add: entry metadata

This commit is contained in:
trisua 2025-07-21 02:11:23 -04:00
parent d80368e6c2
commit b505199492
11 changed files with 631 additions and 45 deletions

View file

@ -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;

View file

@ -178,6 +178,10 @@ video {
appearance: none;
}
.button.small {
--h: 28px;
}
.button:hover {
background: var(--color-super-raised);
}

View file

@ -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);
}
})
}"))

View file

@ -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")

View file

@ -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);
}
})
}"))

View file

@ -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 }}"))

View file

@ -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"))