add: post image uploads (supporter)
This commit is contained in:
parent
ba1f8ef063
commit
70965298b5
18 changed files with 455 additions and 50 deletions
|
@ -238,7 +238,8 @@ and show_community and community.id != config.town_square or question %}
|
|||
>
|
||||
{{ post.content|markdown|safe }}
|
||||
</span>
|
||||
{% else %}
|
||||
|
||||
{{ self::post_media(upload_ids=post.uploads) }} {% else %}
|
||||
<details>
|
||||
<summary
|
||||
class="card flex gap-2 items-center tertiary red w-full"
|
||||
|
@ -247,13 +248,17 @@ and show_community and community.id != config.town_square or question %}
|
|||
<b>{{ post.context.content_warning }}</b>
|
||||
</summary>
|
||||
|
||||
<span
|
||||
id="post-content:{{ post.id }}"
|
||||
class="no_p_margin"
|
||||
hook="long"
|
||||
>
|
||||
{{ post.content|markdown|safe }}
|
||||
</span>
|
||||
<div class="flex flex-col gap-2">
|
||||
<span
|
||||
id="post-content:{{ post.id }}"
|
||||
class="no_p_margin"
|
||||
hook="long"
|
||||
>
|
||||
{{ post.content|markdown|safe }}
|
||||
</span>
|
||||
|
||||
{{ self::post_media(upload_ids=post.uploads) }}
|
||||
</div>
|
||||
</details>
|
||||
{% endif %}
|
||||
|
||||
|
@ -386,6 +391,17 @@ and show_community and community.id != config.town_square or question %}
|
|||
{% if community and show_community and community.id != config.town_square or
|
||||
question %}
|
||||
</div>
|
||||
{% endif %} {%- endmacro %} {% macro post_media(upload_ids) -%} {% if
|
||||
upload_ids|length > 0%}
|
||||
<div class="media_gallery gap-2">
|
||||
{% for upload in upload_ids %}
|
||||
<img
|
||||
src="/api/v1/uploads/{{ upload }}"
|
||||
alt="Image upload"
|
||||
onclick="trigger('ui::lightbox_open', ['/api/v1/uploads/{{ upload }}'])"
|
||||
/>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %} {%- endmacro %} {% macro notification(notification) -%}
|
||||
<div class="w-full card-nest">
|
||||
<div class="card small notif_title flex items-center">
|
||||
|
@ -1262,8 +1278,77 @@ show_kick=false, secondary=false) -%}
|
|||
</div>
|
||||
</div>
|
||||
</dialog>
|
||||
{% endif %} {%- endmacro %} {% macro supporter_ad(body="") -%} {% if
|
||||
config.stripe and not is_supporter %}
|
||||
{% endif %} {%- endmacro %} {% macro file_picker(files_list_id) -%}
|
||||
<button
|
||||
class="button small square quaternary"
|
||||
onclick="pick_file()"
|
||||
title="Images"
|
||||
type="button"
|
||||
>
|
||||
{{ icon "image-up" }}
|
||||
</button>
|
||||
|
||||
<input
|
||||
type="file"
|
||||
multiple
|
||||
accept="image/png,image/jpeg,image/avif,image/webp"
|
||||
style="display: none"
|
||||
name="file_picker"
|
||||
/>
|
||||
|
||||
<div style="display: none" id="file_template">
|
||||
{{ icon "image" }}
|
||||
<b class="name shorter" style="overflow-wrap: normal">.file_name</b>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(() => {
|
||||
const input = document.querySelector("input[name=file_picker]");
|
||||
const element = document.getElementById("{{ files_list_id }}");
|
||||
const template = document.getElementById("file_template");
|
||||
|
||||
globalThis.pick_file = () => {
|
||||
input.click();
|
||||
};
|
||||
|
||||
globalThis.render_file_picker_files = () => {
|
||||
element.innerHTML = "";
|
||||
|
||||
let idx = 0;
|
||||
for (const file of input.files) {
|
||||
element.innerHTML += `<div class="card small secondary flex items-center gap-2" onclick="remove_file(${idx})" style="cursor: pointer">${template.innerHTML.replace(
|
||||
".file_name",
|
||||
file.name,
|
||||
)}</div>`;
|
||||
|
||||
idx += 1;
|
||||
}
|
||||
};
|
||||
|
||||
globalThis.remove_file = (idx) => {
|
||||
const files = Array.from(input.files);
|
||||
files.splice(idx - 1, 1);
|
||||
|
||||
// update files
|
||||
const list = new DataTransfer();
|
||||
|
||||
for (item of files) {
|
||||
list.items.add(item);
|
||||
}
|
||||
|
||||
input.files = list.files;
|
||||
|
||||
// render
|
||||
render_file_picker_files();
|
||||
};
|
||||
|
||||
input.addEventListener("change", () => {
|
||||
render_file_picker_files();
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
{%- endmacro %} {% macro supporter_ad(body="") -%} {% if config.stripe and not
|
||||
is_supporter %}
|
||||
<div
|
||||
class="card w-full supporter_ad"
|
||||
ui_ident="supporter_ad"
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue