Something went wrong. Try again.
Paper Mario mod hosting site - AT Protocol appview starhaven.dev
appview
Something went wrong. Try again.
2.5 kB · 64 lines
Rust
at main
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465use maud::{html, Markup};
use crate::page::icon;
pub struct Item { /// The image's address. Empty for a video, which has no image. pub src: String, pub cid: String, pub mime_type: String, pub size: u64, /// A YouTube video's link, in place of an image's `cid`, `mime_type`, /// and `size`. pub url: String, pub alt: String,}
/// A reorderable drag-and-drop list of media items that also owns its file/// input, YouTube link input, progress bar, and hidden form field. Each image/// uploads immediately on selection; the finished order serialises into/// `name` on submit.pub fn render(endpoint: &str, name: &str, items: &[Item]) -> Markup { html! { media-input endpoint=(endpoint) { @for item in items { div.item data-cid=(item.cid) data-mime-type=(item.mime_type) data-size=(item.size) data-url=(item.url) { span.handle draggable="true" aria-hidden="true" { (icon(icondata::LuGripVertical)) } @if item.src.is_empty() { span.video-preview aria-hidden="true" { (icon(icondata::LuYoutube)) } } @else { img src=(item.src) alt=""; } @let what = if item.url.is_empty() { "image" } else { "video" }; input type="text" class="alt" placeholder={ "Describe this " (what) } aria-label={ "Describe this " (what) } value=[(!item.alt.is_empty()).then_some(&item.alt)]; button type="button" class="remove" aria-label={ "Remove " (what) } { (icon(icondata::LuX)) } } } label.button.secondary { (icon(icondata::LuUpload)) "Add images" input.visually-hidden type="file" accept="image/*" multiple; } div.youtube-add { input type="url" class="youtube-url" placeholder="Paste a YouTube link" aria-label="YouTube link"; button type="button" class="secondary" { (icon(icondata::LuYoutube)) "Add video" } } progress max="100" value="0" hidden {} input type="hidden" name=(name); } }}