@@ -63,8 +63,9 @@ function timerSelector(first, second, initiate) {

     }

 }

-message.innerHTML = "Press video to post, double press to flip.";

-video.addEventListener("click", timerSelector(post, flip, true));

+message.innerHTML = "Press video to post, long press to flip.";

+video.addEventListener("pointerdown", timerSelector(flip, post, true));

+video.addEventListener("pointerup",   timerSelector(flip, post, false));

 camera.appendChild(message);

 camera.appendChild(video);

 getVideo();

@@ -4,6 +4,7 @@ const type    = "image/jpeg";

 const quality = 0.95;

 const width   = 1920;

 const height  = 1440;

+const timeout = 250;

 const camera  = document.getElementById("camera");

 const message = document.createElement("div");

@@ -12,6 +13,7 @@ const canvas  = document.createElement("canvas")

 const ctx     = canvas.getContext("2d");

 let facingMode = "environment";

+let timer      = null;

 async function getVideo() {

     try {

@@ -43,8 +45,26 @@ async function post()

     }

 }

-message.innerHTML = "Press video to post.";

-video.addEventListener("click", post);

+function flip() {

+    facingMode = facingMode == "environment" ? "user" : "environment";

+    getVideo();

+}

+

+function timerSelector(first, second, initiate) {

+    return () => {

+        if (timer == null) {

+            if (initiate)

+                timer = setTimeout(() => { timer = null; first(); }, timeout);

+        } else {

+            clearTimeout(timer);

+            timer = null;

+            second();

+        }

+    }

+}

+

+message.innerHTML = "Press video to post, double press to flip.";

+video.addEventListener("click", timerSelector(post, flip, true));

 camera.appendChild(message);

 camera.appendChild(video);

 getVideo();

new file mode 100644

@@ -0,0 +1,50 @@

+"use strict";

+

+const type    = "image/jpeg";

+const quality = 0.95;

+const width   = 1920;

+const height  = 1440;

+

+const camera  = document.getElementById("camera");

+const message = document.createElement("div");

+const video   = document.createElement("video");

+const canvas  = document.createElement("canvas")

+const ctx     = canvas.getContext("2d");

+

+let facingMode = "environment";

+

+async function getVideo() {

+    try {

+        video.srcObject = await navigator.mediaDevices.getUserMedia({

+            video: { facingMode, width, height },

+        });

+        video.play();

+    } catch (err) {

+        camera.removeChild(video);

+        message.innerHTML = `Could not get video: ${err.name}: ${err.message}`;

+    }

+}

+

+async function post()

+{

+    try {

+        message.innerHTML = "Posting...";

+        canvas.width  = video.videoWidth;

+        canvas.height = video.videoHeight;

+        ctx.drawImage(video, 0, 0);

+        const blob = await new Promise((r) => canvas.toBlob(r, type, quality));

+        const resp = await fetch("/", {

+            method: "POST",

+            body:   blob,

+        });

+        message.innerHTML = `${resp.status}: ${resp.statusText}`;

+    } catch (err) {

+        message.innerHTML = `${err.name}: ${err.message}`;

+    }

+}

+

+message.innerHTML = "Press video to post.";

+video.addEventListener("click", post);

+camera.appendChild(message);

+camera.appendChild(video);

+getVideo();