2023-06-02 01:42:02 +00:00
{{ template "timemachine_base.html" . }}
{{ define "frame title" }}
< div class = "title" >
{{ . }}
< img class = "frame-close" src = "{{ dataimg " timemachine / win95-close . gif " } } " >
< / div >
{{ end }}
{{ define "content" }}
< div class = "center-layout content mw7 ph3 flex flex-column g3" >
< div class = "frame mv3 mv4-ns mw6 margin-center" >
{{ template "frame title" "Submit A Video" }}
< form class = "post-content" action = "" method = "POST" >
{{ csrftoken .Session }}
< div class = "post-content pa3" >
< div class = "flex flex-column g3" >
< div class = "flex g3" >
< div class = "flex-shrink-0" >
< img class = "pixelated" src = "{{ dataimg " timemachine / win95-media . png " } } " >
< / div >
< div class = "flex flex-column flex-grow-1 g1" >
< strong > Video URL< / strong >
< input
class="win95-input"
type="url"
name="media_url"
required
>
< div class = "f7 less-spacing" >
< p >
Take video of yourself using an old device. The video should:
< / p >
< ul >
2023-06-16 19:29:16 +00:00
< li > Show the entire device< / li >
2023-06-02 01:42:02 +00:00
< li > Clearly show the contents of the device's screen< / li >
2023-06-16 19:29:16 +00:00
< li > Have minimal editing and clear sound< / li >
2023-06-02 01:42:02 +00:00
< / ul >
< p >
2023-06-16 19:29:16 +00:00
Upload the video somewhere publicly accessible, then share the link here. We can download videos from file-sharing services or any video service supported by youtube-dl. < a href = "javascript:terms()" > See licensing terms.< / a >
2023-06-02 01:42:02 +00:00
< / p >
2023-06-16 19:29:16 +00:00
< div id = "terms" class = "dn" >
< p > By submitting this form, you are granting us permission to:< / p >
< ul >
< li > Download copies of any submitted videos< / li >
< li > Edit any submitted videos and publish them with attribution on our website and other promotional channels< / li >
< / ul >
< p > Submitted videos will not be used for any commercial purpose.< / p >
< / div >
2023-06-02 01:42:02 +00:00
< / div >
< / div >
< / div >
< div class = "flex g3" >
< div class = "flex-shrink-0" >
< img class = "pixelated" src = "{{ dataimg " timemachine / win95-checklist . png " } } " >
< / div >
< div class = "flex flex-column flex-grow-1 g1" >
< strong > Device Info< / strong >
< textarea class = "win95-input h4" name = "device_info" required > < / textarea >
< div class = "f7 less-spacing" >
< p >
Include specific info about the device such as its model number, release year, CPU speed, amount of memory, etc.
< / p >
< / div >
< / div >
< / div >
< div class = "flex g3" >
< div class = "flex-shrink-0" >
< img class = "pixelated" src = "{{ dataimg " timemachine / win95-scroll . png " } } " >
< / div >
< div class = "flex flex-column flex-grow-1 g1" >
< strong > Description< / strong >
< textarea class = "win95-input h4" name = "description" required > < / textarea >
< div class = "f7 less-spacing" >
< p >
What's the story behind this device? When did you get it? What did you use it for? Is it in good shape? Is there anything interesting or notable about it?
< / p >
< / div >
< / div >
< / div >
< / div >
< div class = "mt3 flex justify-end g3" >
< button class = "win95-btn" type = "submit" value = "Submit" > < u > S< / u > ubmit< / button >
< / div >
< / div >
< / form >
< / div >
< / div >
< script >
let form = document.querySelector("form");
let mediaUrl = document.querySelector("[name=media_url]");
let deviceInfo = document.querySelector("[name=device_info]");
let description = document.querySelector("[name=description]");
let submitBtn = document.querySelector("[type=submit]");
function saveData() {
localStorage.setItem("tm_media_url", mediaUrl.value);
localStorage.setItem("tm_device_info", deviceInfo.value);
localStorage.setItem("tm_description", description.value);
}
form.addEventListener("submit", function() {
saveData();
submitBtn.disabled = true;
});
document.addEventListener("visibilitychange", function() {
saveData();
});
mediaUrl.value = localStorage.getItem("tm_media_url") ?? "";
deviceInfo.value = localStorage.getItem("tm_device_info") ?? "";
description.value = localStorage.getItem("tm_description") ?? "";
2023-06-16 19:29:16 +00:00
function terms() {
document.querySelector("#terms").classList.toggle("dn");
}
2023-06-02 01:42:02 +00:00
< / script >
{{ end }}