add: entry metadata
This commit is contained in:
parent
d80368e6c2
commit
b505199492
11 changed files with 631 additions and 45 deletions
|
@ -35,6 +35,18 @@ function media_theme_pref() {
|
|||
}
|
||||
}
|
||||
|
||||
globalThis.temporary_set_theme = (theme) => {
|
||||
document.documentElement.className = theme.toLowerCase();
|
||||
|
||||
if (theme === "Light") {
|
||||
document.getElementById("switch_light").classList.remove("hidden");
|
||||
document.getElementById("switch_dark").classList.add("hidden");
|
||||
} else {
|
||||
document.getElementById("switch_light").classList.add("hidden");
|
||||
document.getElementById("switch_dark").classList.remove("hidden");
|
||||
}
|
||||
};
|
||||
|
||||
globalThis.set_theme = (theme) => {
|
||||
window.localStorage.setItem("attobin:theme", theme);
|
||||
document.documentElement.className = theme;
|
||||
|
@ -67,14 +79,26 @@ function check_message() {
|
|||
}
|
||||
}
|
||||
|
||||
globalThis.show_message = (message, message_good = true) => {
|
||||
const element = document.getElementById("messages");
|
||||
element.style.marginBottom = "1rem";
|
||||
element.style.paddingLeft = "1rem";
|
||||
element.innerHTML += `<li class="${message_good ? "green" : "red"}">${message.replaceAll('"', "")}</li>`;
|
||||
};
|
||||
|
||||
check_message();
|
||||
|
||||
// editor
|
||||
globalThis.init_editor = () => {
|
||||
globalThis.editor = CodeMirror(document.getElementById("editor_tab"), {
|
||||
value: (document.getElementById("editor_content") || { innerHTML: "" })
|
||||
globalThis.init_editor = (
|
||||
name = "editor",
|
||||
mode = "markdown",
|
||||
element = "editor_tab",
|
||||
content_element = "editor_content",
|
||||
) => {
|
||||
globalThis[name] = CodeMirror(document.getElementById(element), {
|
||||
value: (document.getElementById(content_element) || { innerHTML: "" })
|
||||
.innerHTML,
|
||||
mode: "markdown",
|
||||
mode,
|
||||
lineWrapping: true,
|
||||
lineNumbers: false,
|
||||
autoCloseBrackets: true,
|
||||
|
@ -99,20 +123,24 @@ globalThis.init_editor = () => {
|
|||
},
|
||||
});
|
||||
|
||||
window.addEventListener("beforeunload", (e) => {
|
||||
if (!globalThis.ALLOW_LEAVE) {
|
||||
e.preventDefault();
|
||||
return null;
|
||||
}
|
||||
});
|
||||
if (name === "editor") {
|
||||
window.addEventListener("beforeunload", (e) => {
|
||||
if (!globalThis.ALLOW_LEAVE) {
|
||||
e.preventDefault();
|
||||
return null;
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
globalThis.tab_editor = () => {
|
||||
document.getElementById("editor_tab").classList.remove("hidden");
|
||||
document.getElementById("preview_tab").classList.add("hidden");
|
||||
document.getElementById("metadata_tab").classList.add("hidden");
|
||||
|
||||
document.getElementById("editor_tab_button").classList.remove("camo");
|
||||
document.getElementById("preview_tab_button").classList.add("camo");
|
||||
document.getElementById("metadata_tab_button").classList.add("camo");
|
||||
};
|
||||
|
||||
globalThis.tab_preview = async () => {
|
||||
|
@ -133,9 +161,28 @@ globalThis.tab_preview = async () => {
|
|||
// ...
|
||||
document.getElementById("editor_tab").classList.add("hidden");
|
||||
document.getElementById("preview_tab").classList.remove("hidden");
|
||||
document.getElementById("metadata_tab").classList.add("hidden");
|
||||
|
||||
document.getElementById("editor_tab_button").classList.add("camo");
|
||||
document.getElementById("preview_tab_button").classList.remove("camo");
|
||||
document.getElementById("metadata_tab_button").classList.add("camo");
|
||||
};
|
||||
|
||||
globalThis.first_time_on_metadata_tab = true;
|
||||
globalThis.tab_metadata = () => {
|
||||
document.getElementById("editor_tab").classList.add("hidden");
|
||||
document.getElementById("preview_tab").classList.add("hidden");
|
||||
document.getElementById("metadata_tab").classList.remove("hidden");
|
||||
|
||||
document.getElementById("editor_tab_button").classList.add("camo");
|
||||
document.getElementById("preview_tab_button").classList.add("camo");
|
||||
document.getElementById("metadata_tab_button").classList.remove("camo");
|
||||
|
||||
if (globalThis.first_time_on_metadata_tab) {
|
||||
globalThis.metadata_editor.refresh();
|
||||
}
|
||||
|
||||
globalThis.first_time_on_metadata_tab = false;
|
||||
};
|
||||
|
||||
let exists_timeout = null;
|
||||
|
|
|
@ -178,6 +178,10 @@ video {
|
|||
appearance: none;
|
||||
}
|
||||
|
||||
.button.small {
|
||||
--h: 28px;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background: var(--color-super-raised);
|
||||
}
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
(text "{% extends \"root.lisp\" %} {% block head %}")
|
||||
(title
|
||||
(text "{{ entry.slug }}"))
|
||||
(link ("rel" "icon") ("href" "/public/favicon.svg"))
|
||||
(text "{% endblock %} {% block body %}")
|
||||
(div
|
||||
("class" "flex items-center bar")
|
||||
|
@ -13,7 +14,12 @@
|
|||
("class" "button camo tab_button")
|
||||
("id" "preview_tab_button")
|
||||
("onclick" "tab_preview()")
|
||||
(text "Preview")))
|
||||
(text "Preview"))
|
||||
(button
|
||||
("class" "button camo tab_button")
|
||||
("id" "metadata_tab_button")
|
||||
("onclick" "tab_metadata()")
|
||||
(text "Metadata")))
|
||||
(div
|
||||
("class" "card tab tabs")
|
||||
(div
|
||||
|
@ -21,6 +27,9 @@
|
|||
("class" "tab fadein"))
|
||||
(div
|
||||
("id" "preview_tab")
|
||||
("class" "tab fadein hidden container"))
|
||||
(div
|
||||
("id" "metadata_tab")
|
||||
("class" "tab fadein hidden")))
|
||||
(form
|
||||
("class" "w-full flex flex-col gap-2")
|
||||
|
@ -75,10 +84,12 @@
|
|||
(link ("rel" "stylesheet") ("href" "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/default.min.css"))
|
||||
|
||||
(script ("id" "editor_content") ("type" "text/markdown") (text "{{ entry.content|remove_script_tags|safe }}"))
|
||||
(script ("id" "editor_metadata_content") ("type" "text/markdown") (text "{{ entry.metadata|remove_script_tags|safe }}"))
|
||||
|
||||
(script
|
||||
(text "setTimeout(() => {
|
||||
globalThis.init_editor();
|
||||
globalThis.init_editor(\"metadata_editor\", \"plain\", \"metadata_tab\", \"editor_metadata_content\");
|
||||
}, 150);
|
||||
|
||||
globalThis.edit_entry = (e) => {
|
||||
|
@ -99,6 +110,7 @@
|
|||
edit_code: e.target.edit_code.value,
|
||||
new_slug: e.target.new_slug.value || undefined,
|
||||
new_edit_code: e.target.new_edit_code.value || undefined,
|
||||
metadata: globalThis.metadata_editor.getValue(),
|
||||
\"delete\": rm,
|
||||
}),
|
||||
})
|
||||
|
@ -117,8 +129,7 @@
|
|||
window.location.href = \"/\";
|
||||
}
|
||||
} else {
|
||||
document.cookie = `Atto-Message=\"${res.message}\"; path=/`;
|
||||
check_message();
|
||||
show_message(res.message, false);
|
||||
}
|
||||
})
|
||||
}"))
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
(text "{% extends \"root.lisp\" %} {% block head %}")
|
||||
(title
|
||||
(text "Error - {{ name }}"))
|
||||
(link ("rel" "icon") ("href" "/public/favicon.svg"))
|
||||
(text "{% endblock %} {% block body %}")
|
||||
(div
|
||||
("class" "card")
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
(text "{% extends \"root.lisp\" %} {% block head %}")
|
||||
(title
|
||||
(text "{{ name }}"))
|
||||
(link ("rel" "icon") ("href" "/public/favicon.svg"))
|
||||
(text "{% endblock %} {% block body %}")
|
||||
(div
|
||||
("class" "flex items-center bar")
|
||||
|
@ -13,7 +14,12 @@
|
|||
("class" "button camo tab_button")
|
||||
("id" "preview_tab_button")
|
||||
("onclick" "tab_preview()")
|
||||
(text "Preview")))
|
||||
(text "Preview"))
|
||||
(button
|
||||
("class" "button camo tab_button")
|
||||
("id" "metadata_tab_button")
|
||||
("onclick" "tab_metadata()")
|
||||
(text "Metadata")))
|
||||
(div
|
||||
("class" "card tab tabs")
|
||||
(div
|
||||
|
@ -21,6 +27,9 @@
|
|||
("class" "tab fadein"))
|
||||
(div
|
||||
("id" "preview_tab")
|
||||
("class" "tab fadein hidden container"))
|
||||
(div
|
||||
("id" "metadata_tab")
|
||||
("class" "tab fadein hidden")))
|
||||
(form
|
||||
("class" "w-full flex justify-between gap-2 flex-collapse-rev")
|
||||
|
@ -58,6 +67,7 @@
|
|||
(script
|
||||
(text "setTimeout(() => {
|
||||
globalThis.init_editor();
|
||||
globalThis.init_editor(\"metadata_editor\", \"plain\", \"metadata_tab\");
|
||||
}, 150);
|
||||
|
||||
globalThis.create_entry = (e) => {
|
||||
|
@ -71,6 +81,7 @@
|
|||
content: globalThis.editor.getValue(),
|
||||
slug: e.target.slug.value || undefined,
|
||||
edit_code: e.target.edit_code.value || undefined,
|
||||
metadata: globalThis.metadata_editor.getValue(),
|
||||
}),
|
||||
})
|
||||
.then(res => res.json())
|
||||
|
@ -81,8 +92,7 @@
|
|||
document.cookie = \"Atto-Message-Good=true; path=/\";
|
||||
window.location.href = `/${res.payload[0]}`;
|
||||
} else {
|
||||
document.cookie = `Atto-Message=\"${res.message}\"; path=/`;
|
||||
check_message();
|
||||
show_message(res.message, false);
|
||||
}
|
||||
})
|
||||
}"))
|
||||
|
|
|
@ -7,12 +7,10 @@
|
|||
(meta ("name" "viewport") ("content" "width=device-width, initial-scale=1.0"))
|
||||
(meta ("http-equiv" "X-UA-Compatible") ("content" "ie=edge"))
|
||||
|
||||
(link ("rel" "icon") ("href" "/public/favicon.svg"))
|
||||
(link ("rel" "stylesheet") ("href" "{{ tetratto }}/css/utility.css?v={{ build_code }}"))
|
||||
(link ("rel" "stylesheet") ("href" "/public/style.css?v={{ build_code }}"))
|
||||
|
||||
(meta ("name" "theme-color") ("content" "#fbc27f"))
|
||||
(meta ("name" "description") ("content" "{{ name }}"))
|
||||
(meta ("property" "og:type") ("content" "website"))
|
||||
(meta ("property" "og:site_name") ("content" "{{ name }}"))
|
||||
|
||||
|
|
|
@ -1,11 +1,14 @@
|
|||
(text "{% extends \"root.lisp\" %} {% block head %}")
|
||||
(text "{% if not metadata.page_title -%}")
|
||||
(title
|
||||
(text "{{ entry.slug }}"))
|
||||
(text "{%- endif %} {{ metadata_head|safe }}")
|
||||
(link ("rel" "icon") ("href" "/public/favicon.svg"))
|
||||
(text "{% endblock %} {% block body %}")
|
||||
(div
|
||||
("class" "flex flex-col gap-2")
|
||||
(div
|
||||
("class" "card")
|
||||
("class" "card container")
|
||||
("style" "min-height: 15rem")
|
||||
(text "{{ entry.content|markdown|safe }}"))
|
||||
(div
|
||||
|
@ -17,9 +20,27 @@
|
|||
|
||||
(div
|
||||
("class" "flex flex-col gap-1 items-end fade")
|
||||
; dates
|
||||
(span (text "Pub: {{ entry.created / 1000|int|date(format=\"%Y-%m-%d %H:%M\", timezone=\"Etc/UTC\") }} UTC"))
|
||||
(span (text "Edit: {{ entry.edited / 1000|int|date(format=\"%Y-%m-%d %H:%M\", timezone=\"Etc/UTC\") }} UTC"))
|
||||
(span (text "Views: {{ views }}")))))
|
||||
|
||||
; auto theme
|
||||
(text "{% if metadata.access_recommended_theme != 'None' -%}")
|
||||
(span (text "Auto theme: {{ metadata.access_recommended_theme }}"))
|
||||
(script ("defer" "true") (text "setTimeout(() => { temporary_set_theme('{{ metadata.access_recommended_theme }}') }, 150);"))
|
||||
(text "{%- endif %}")
|
||||
|
||||
; views
|
||||
(text "{% if not metadata.option_disable_views -%}")
|
||||
(span (text "Views: {{ views }}"))
|
||||
(text "{%- endif %}")
|
||||
|
||||
; easy-to-read
|
||||
(text "{% if metadata.access_easy_read|length > 0 -%}")
|
||||
(a ("class" "button small") ("href" "/{{ metadata.access_easy_read }}") (b (text "E2R")))
|
||||
(text "{%- endif %}"))))
|
||||
|
||||
(text "{{ metadata_css|safe }}")
|
||||
|
||||
(link ("rel" "stylesheet") ("href" "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/default.min.css"))
|
||||
(script ("src" "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/highlight.min.js"))
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue