Share page for Astro Formally Protests Cleaning Robots
This commit is contained in:
parent
3690278211
commit
25ad188e99
1 changed files with 98 additions and 0 deletions
98
v/b11e33cb.html
Normal file
98
v/b11e33cb.html
Normal file
|
|
@ -0,0 +1,98 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title>Astro Formally Protests Cleaning Robots — PayToLaugh</title>
|
||||||
|
<meta name="description" content="Robotic vacuum cleaners are sold as autonomous, convenient machines that quietly clean on their own, including underwater pool models.">
|
||||||
|
<link rel="canonical" href="https://paytolaugh.com/v/b11e33cb.html">
|
||||||
|
|
||||||
|
<meta property="og:site_name" content="PayToLaugh">
|
||||||
|
<meta property="og:type" content="video.other">
|
||||||
|
<meta property="og:url" content="https://paytolaugh.com/v/b11e33cb.html">
|
||||||
|
<meta property="og:title" content="Astro Formally Protests Cleaning Robots">
|
||||||
|
<meta property="og:description" content="Robotic vacuum cleaners are sold as autonomous, convenient machines that quietly clean on their own, including underwater pool models.">
|
||||||
|
<meta property="og:image" content="https://api.corben.world/files/e4d459b4-17c4-40c1-a688-f22c5530f649/public">
|
||||||
|
<meta property="og:image:width" content="1200">
|
||||||
|
<meta property="og:image:height" content="630">
|
||||||
|
<meta property="og:image:alt" content="Astro, mid sentence">
|
||||||
|
<meta property="og:video" content="https://api.corben.world/files/c00b9f3a-9835-4286-875f-fd597226d516/public?v=astro-astro-formally-protests-cleaning-r.mp4">
|
||||||
|
<meta property="og:video:secure_url" content="https://api.corben.world/files/c00b9f3a-9835-4286-875f-fd597226d516/public?v=astro-astro-formally-protests-cleaning-r.mp4">
|
||||||
|
<meta property="og:video:type" content="video/mp4">
|
||||||
|
<meta property="og:video:width" content="720">
|
||||||
|
<meta property="og:video:height" content="1280">
|
||||||
|
|
||||||
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
|
<meta name="twitter:title" content="Astro Formally Protests Cleaning Robots">
|
||||||
|
<meta name="twitter:description" content="Robotic vacuum cleaners are sold as autonomous, convenient machines that quietly clean on their own, including underwater pool models.">
|
||||||
|
<meta name="twitter:image" content="https://api.corben.world/files/e4d459b4-17c4-40c1-a688-f22c5530f649/public">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="/assets/app.css">
|
||||||
|
<style>
|
||||||
|
.watch{max-width:420px;margin:0 auto;padding:26px 20px 44px;width:100%;box-sizing:border-box}
|
||||||
|
.watch video{width:100%;aspect-ratio:9/16;border-radius:14px;background:#000;display:block;
|
||||||
|
border:1px solid var(--line)}
|
||||||
|
.watch h1{font-size:23px;margin:20px 0 4px;line-height:1.25}
|
||||||
|
.watch .who{color:var(--muted);font:12px/1.6 var(--mono)}
|
||||||
|
.watch .cta{margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
|
||||||
|
.watch .cta p{color:var(--muted);font-size:14.5px;margin:0 0 14px}
|
||||||
|
dialog{border:1px solid var(--line);background:var(--panel);color:var(--ink);
|
||||||
|
border-radius:14px;padding:22px;max-width:420px;width:90%}
|
||||||
|
dialog::backdrop{background:rgba(4,6,10,.72)}
|
||||||
|
dialog input{width:100%;box-sizing:border-box}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="watch">
|
||||||
|
<video controls playsinline preload="metadata" poster="https://api.corben.world/files/e4d459b4-17c4-40c1-a688-f22c5530f649/public" src="https://api.corben.world/files/c00b9f3a-9835-4286-875f-fd597226d516/public?v=astro-astro-formally-protests-cleaning-r.mp4"></video>
|
||||||
|
<h1>Astro Formally Protests Cleaning Robots</h1>
|
||||||
|
<p class="who">Astro · 32 seconds</p>
|
||||||
|
<p style="margin:16px 0 0">
|
||||||
|
<button type="button" class="btn" id="share">Share this</button>
|
||||||
|
</p>
|
||||||
|
<div class="cta">
|
||||||
|
<p>Made on PayToLaugh. Upload a photo of your pet, paste something worth
|
||||||
|
reacting to, and they will have opinions about it.</p>
|
||||||
|
<a class="btn" style="display:inline-block;text-decoration:none" href="/">Make one for your pet</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<dialog id="sharebox">
|
||||||
|
<h2 class="sec" style="margin-top:0">Share this video</h2>
|
||||||
|
<p style="color:var(--muted);font-size:14px;margin:0 0 12px">Anyone with this link can watch it.</p>
|
||||||
|
<input type="text" id="shareurl" readonly value="https://paytolaugh.com/v/b11e33cb.html">
|
||||||
|
<p style="margin:14px 0 0">
|
||||||
|
<button type="button" class="btn" id="copy">Copy link</button>
|
||||||
|
<button type="button" class="btn ghost" id="close" style="margin-left:8px">Close</button>
|
||||||
|
</p>
|
||||||
|
</dialog>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
/* Everything above is already in the served HTML, so a preview crawler sees
|
||||||
|
the tags and the video without running any of this. */
|
||||||
|
var box = document.getElementById("sharebox");
|
||||||
|
document.getElementById("share").onclick = async function () {
|
||||||
|
if (navigator.share) {
|
||||||
|
try { await navigator.share({ title: "Astro Formally Protests Cleaning Robots", url: "https://paytolaugh.com/v/b11e33cb.html" }); return; }
|
||||||
|
catch (e) { if (e && e.name === "AbortError") return; }
|
||||||
|
}
|
||||||
|
box.showModal();
|
||||||
|
};
|
||||||
|
document.getElementById("close").onclick = function () { box.close(); };
|
||||||
|
document.getElementById("copy").onclick = function () {
|
||||||
|
var i = document.getElementById("shareurl");
|
||||||
|
i.select();
|
||||||
|
var b = this;
|
||||||
|
navigator.clipboard.writeText(i.value).then(function () {
|
||||||
|
b.textContent = "Copied";
|
||||||
|
setTimeout(function () { b.textContent = "Copy link"; }, 1600);
|
||||||
|
}).catch(function () { b.textContent = "Press Ctrl+C"; });
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<script src="/assets/app.js"></script>
|
||||||
|
<script>
|
||||||
|
/* Count the view. The page is static, so this is the only moving part. */
|
||||||
|
try { api("resolve_share", { code: "b11e33cb" }); } catch (e) {}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in a new issue