add: finish ui rewrite
This commit is contained in:
parent
e9846016e6
commit
5dec98d698
119 changed files with 8776 additions and 9350 deletions
321
crates/app/src/public/html/post/post.lisp
Normal file
321
crates/app/src/public/html/post/post.lisp
Normal file
|
|
@ -0,0 +1,321 @@
|
|||
(text "{% extends \"root.html\" %} {% block head %}")
|
||||
(title
|
||||
(text "Post - {{ config.name }}"))
|
||||
|
||||
(text "{% endblock %} {% block body %} {{ macros::nav() }}")
|
||||
(main
|
||||
("class" "flex flex-col gap-2")
|
||||
(text "{% if post.replying_to -%}")
|
||||
(a
|
||||
("href" "/post/{{ post.replying_to }}")
|
||||
("class" "button")
|
||||
(text "{{ icon \"arrow-up\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:action.continue_thread\" }}")))
|
||||
(text "{%- endif %}")
|
||||
(div
|
||||
("style" "display: contents;")
|
||||
(text "{% if post.context.repost and post.context.repost.reposting -%} {{ components::repost(repost=reposting, post=post, owner=owner, community=community, show_community=true, can_manage_post=can_manage_posts) }} {% else %} {{ components::post(post=post, owner=owner, question=question, community=community, show_community=true, can_manage_post=can_manage_posts) }} {%- endif %}"))
|
||||
(text "{% if user and post.context.comments_enabled -%}")
|
||||
(div
|
||||
("class" "card-nest")
|
||||
(div
|
||||
("class" "card small")
|
||||
(b
|
||||
(text "{{ text \"communities:label.create_reply\" }}")))
|
||||
(form
|
||||
("class" "card flex flex-col gap-2")
|
||||
("onsubmit" "create_reply_from_form(event)")
|
||||
(div
|
||||
("class" "flex flex-col gap-1")
|
||||
(label
|
||||
("for" "content")
|
||||
(text "{{ text \"communities:label.content\" }}"))
|
||||
(textarea
|
||||
("type" "text")
|
||||
("name" "content")
|
||||
("id" "content")
|
||||
("placeholder" "content")
|
||||
("required" "")
|
||||
("minlength" "2")
|
||||
("maxlength" "4096")))
|
||||
(div
|
||||
("id" "files_list")
|
||||
("class" "flex gap-2 flex-wrap"))
|
||||
(div
|
||||
("class" "flex gap-2")
|
||||
(text "{{ components::emoji_picker(element_id=\"content\", render_dialog=true) }} {% if is_supporter -%} {{ components::file_picker(files_list_id=\"files_list\") }} {% endif %}")
|
||||
(button
|
||||
("class" "primary")
|
||||
(text "{{ text \"communities:action.create\" }}")))))
|
||||
(text "{%- endif %}")
|
||||
(div
|
||||
("class" "pillmenu")
|
||||
(a
|
||||
("href" "#/replies")
|
||||
("data-tab-button" "replies")
|
||||
("class" "active")
|
||||
(text "{{ icon \"newspaper\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:label.replies\" }}")))
|
||||
(a
|
||||
("href" "/post/{{ post.id }}/reposts")
|
||||
(text "{{ icon \"repeat-2\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:label.reposts\" }}")))
|
||||
(a
|
||||
("href" "/post/{{ post.id }}/reposts?quotes=true")
|
||||
(text "{{ icon \"quote\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:label.quotes\" }}"))))
|
||||
(text "{% if (user and user.id == post.owner) or can_manage_posts -%}")
|
||||
(div
|
||||
("class" "pillmenu")
|
||||
(text "{% if user and user.id == post.owner -%}")
|
||||
(a
|
||||
("href" "/post/{{ post.id }}#/edit")
|
||||
(text "{{ icon \"pen\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:label.edit_content\" }}")))
|
||||
(text "{%- endif %}")
|
||||
(a
|
||||
("href" "/post/{{ post.id }}/likes")
|
||||
(text "{{ icon \"heart\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:label.likes\" }}")))
|
||||
(a
|
||||
("href" "#/configure")
|
||||
("data-tab-button" "configure")
|
||||
(text "{{ icon \"settings\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:action.configure\" }}"))))
|
||||
(text "{%- endif %}")
|
||||
(div
|
||||
("class" "flex flex-col gap-2 hidden")
|
||||
("data-tab" "configure")
|
||||
(div
|
||||
("class" "card-nest w-full")
|
||||
(div
|
||||
("class" "card small flex items-center gap-2")
|
||||
(text "{{ icon \"settings\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:action.configure\" }}")))
|
||||
(div
|
||||
("class" "card tertiary flex flex-col gap-4")
|
||||
("id" "post_context")))
|
||||
(button
|
||||
("onclick" "save_context()")
|
||||
(text "{{ icon \"check\" }}")
|
||||
(span
|
||||
(text "{{ text \"general:action.save\" }}")))
|
||||
(script
|
||||
(text "setTimeout(() => {
|
||||
const ui = ns(\"ui\");
|
||||
const element = document.getElementById(\"post_context\");
|
||||
const settings = JSON.parse(\"{{ post_context_serde|safe }}\");
|
||||
|
||||
globalThis.save_context = () => {
|
||||
fetch(\"/api/v1/posts/{{ post.id }}/context\", {
|
||||
method: \"POST\",
|
||||
headers: {
|
||||
\"Content-Type\": \"application/json\",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
context: settings,
|
||||
}),
|
||||
})
|
||||
.then((res) => res.json())
|
||||
.then((res) => {
|
||||
trigger(\"atto::toast\", [
|
||||
res.ok ? \"success\" : \"error\",
|
||||
res.message,
|
||||
]);
|
||||
});
|
||||
};
|
||||
|
||||
ui.refresh_container(element, []);
|
||||
|
||||
const can_manage_pins = \"{{ can_manage_pins }}\" === \"true\";
|
||||
const is_owner =
|
||||
\"{{ user and user.id == post.owner }}\" === \"true\";
|
||||
|
||||
const settings_fields = [
|
||||
[
|
||||
[
|
||||
\"comments_enabled\",
|
||||
\"Allow people to comment on your post\",
|
||||
],
|
||||
\"{{ post.context.comments_enabled }}\",
|
||||
\"checkbox\",
|
||||
],
|
||||
[
|
||||
[
|
||||
\"reposts_enabled\",
|
||||
\"Allow people to repost/quote your post\",
|
||||
],
|
||||
\"{{ post.context.reposts_enabled }}\",
|
||||
\"checkbox\",
|
||||
],
|
||||
[
|
||||
[
|
||||
\"reactions_enabled\",
|
||||
\"Allow people to like/dislike your post\",
|
||||
],
|
||||
\"{{ post.context.reactions_enabled }}\",
|
||||
\"checkbox\",
|
||||
],
|
||||
[
|
||||
[\"is_nsfw\", \"Hide from public timelines\"],
|
||||
\"{{ community.context.is_nsfw }}\",
|
||||
\"checkbox\",
|
||||
],
|
||||
[
|
||||
[\"content_warning\", \"Content warning\"],
|
||||
settings.content_warning,
|
||||
\"textarea\",
|
||||
],
|
||||
[
|
||||
[\"tags\", \"Tags\"],
|
||||
settings.tags.join(\", \"),
|
||||
\"input\",
|
||||
{
|
||||
embed_html:
|
||||
'<span class=\"fade\">Tags should be separated by a comma.</span>',
|
||||
},
|
||||
],
|
||||
];
|
||||
|
||||
if (can_manage_pins) {
|
||||
settings_fields.push([
|
||||
[\"is_pinned\", \"Pinned to community wall\"],
|
||||
\"{{ post.context.is_pinned }}\",
|
||||
\"checkbox\",
|
||||
]);
|
||||
}
|
||||
|
||||
if (is_owner) {
|
||||
settings_fields.push([
|
||||
[\"is_profile_pinned\", \"Pinned to your profile\"],
|
||||
\"{{ post.context.is_profile_pinned }}\",
|
||||
\"checkbox\",
|
||||
]);
|
||||
}
|
||||
|
||||
ui.generate_settings_ui(element, settings_fields, settings, {
|
||||
tags: (new_tags) => {
|
||||
settings.tags = new_tags
|
||||
.split(\",\")
|
||||
.map((t) => t.trim());
|
||||
},
|
||||
});
|
||||
}, 250);")))
|
||||
(text "{% if user and user.id == post.owner -%}")
|
||||
(div
|
||||
("class" "card-nest w-full hidden")
|
||||
("data-tab" "edit")
|
||||
(div
|
||||
("class" "card small flex items-center gap-2")
|
||||
(text "{{ icon \"pen\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:label.edit_content\" }}")))
|
||||
(form
|
||||
("class" "card flex flex-col gap-2")
|
||||
("onsubmit" "edit_post_from_form(event)")
|
||||
(div
|
||||
("class" "flex flex-col gap-1")
|
||||
(label
|
||||
("for" "content")
|
||||
(text "{{ text \"communities:label.content\" }}"))
|
||||
(textarea
|
||||
("type" "text")
|
||||
("name" "new_content")
|
||||
("id" "new_content")
|
||||
("placeholder" "content")
|
||||
("required" "")
|
||||
("minlength" "2")
|
||||
("maxlength" "4096")
|
||||
(text "{{ post.content }}")))
|
||||
(div
|
||||
("class" "flex gap-2")
|
||||
(text "{{ components::emoji_picker(element_id=\"new_content\", render_dialog=false) }}")
|
||||
(button
|
||||
("class" "primary")
|
||||
(text "{{ text \"general:action.save\" }}")))))
|
||||
(script
|
||||
(text "async function edit_post_from_form(e) {
|
||||
e.preventDefault();
|
||||
await trigger(\"atto::debounce\", [\"posts::edit\"]);
|
||||
fetch(\"/api/v1/posts/{{ post.id }}/content\", {
|
||||
method: \"POST\",
|
||||
headers: {
|
||||
\"Content-Type\": \"application/json\",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
content: e.target.new_content.value,
|
||||
}),
|
||||
})
|
||||
.then((res) => res.json())
|
||||
.then((res) => {
|
||||
trigger(\"atto::toast\", [
|
||||
res.ok ? \"success\" : \"error\",
|
||||
res.message,
|
||||
]);
|
||||
});
|
||||
}"))
|
||||
(text "{%- endif %}")
|
||||
(div
|
||||
("class" "card-nest w-full")
|
||||
("data-tab" "replies")
|
||||
(div
|
||||
("class" "card small flex items-center gap-2")
|
||||
(text "{{ icon \"newspaper\" }}")
|
||||
(span
|
||||
(text "{{ text \"communities:label.replies\" }}")))
|
||||
(div
|
||||
("class" "card flex flex-col gap-4")
|
||||
(text "{% for post in replies %} {{ components::post(post=post[0], owner=post[1], question=post[3], secondary=true, show_community=false) }} {% endfor %} {{ components::pagination(page=page, items=replies|length) }}"))))
|
||||
|
||||
(script
|
||||
(text "async function create_reply_from_form(e) {
|
||||
e.preventDefault();
|
||||
await trigger(\"atto::debounce\", [\"posts::create\"]);
|
||||
|
||||
// create body
|
||||
const body = new FormData();
|
||||
|
||||
if (e.target.file_picker) {
|
||||
for (const file of e.target.file_picker.files) {
|
||||
body.append(file.name, file);
|
||||
}
|
||||
}
|
||||
|
||||
body.append(
|
||||
\"body\",
|
||||
JSON.stringify({
|
||||
content: e.target.content.value,
|
||||
community: \"{{ community.id }}\",
|
||||
replying_to: \"{{ post.id }}\",
|
||||
}),
|
||||
);
|
||||
|
||||
// ...
|
||||
fetch(\"/api/v1/posts\", {
|
||||
method: \"POST\",
|
||||
body,
|
||||
})
|
||||
.then((res) => res.json())
|
||||
.then((res) => {
|
||||
trigger(\"atto::toast\", [
|
||||
res.ok ? \"success\" : \"error\",
|
||||
res.message,
|
||||
]);
|
||||
|
||||
if (res.ok) {
|
||||
setTimeout(() => {
|
||||
window.location.href = `/post/${res.payload}`;
|
||||
}, 100);
|
||||
}
|
||||
});
|
||||
}"))
|
||||
|
||||
(text "{% endblock %}")
|
||||
Loading…
Add table
Add a link
Reference in a new issue