jelq

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>jelqd</title>

<style>pre { white-space: pre-wrap; } pre, li, p { overflow-wrap: anywhere; }</style>

</head>

<body>

<h1 id="status">jelqd</h1>

<p id="detail">A roguelike played over HTTP. Press POST /runs to begin.</p>

<ul id="links"></ul>

<ul id="headers"></ul>

<pre id="body"></pre>

<hr>

<h2>Run</h2>

<p>

Run <input id="run" size="20" placeholder="/runs/...">

seed <input id="seed" size="12" placeholder="(unranked)">

<button onclick="start()">POST /runs</button>

</p>

<h2>JELQ</h2>

<p>

technique

<select id="technique">

<option>warmup</option>

<option>wet</option>

<option>dry</option>

<option>stretch</option>

<option>uli</option>

<option>edge</option>

<option>pump</option>

<option>ice</option>

<option>supplement</option>

</select>

or combo <input id="combo" size="14" placeholder="wet,stretch">

intensity <input id="intensity" type="number" min="1" max="10" value="5" size="3">

Content-Type

<select id="lube">

<option value="">(none)</option>

<option>application/baby-oil</option>

<option>application/coconut-oil</option>

<option>application/lotion</option>

<option>application/vaseline</option>

<option>text/plain; charset=spit</option>

<option>image/jpeg</option>

</select>

<button onclick="jelq()">JELQ</button>

</p>

<h2>Methods</h2>

<ul>

<li>the run: <button onclick="go('GET', '')">GET</button> <button onclick="go('HEAD', '')">HEAD</button> <button onclick="go('PUT', '')">PUT</button> <button onclick="go('OPTIONS', '')">OPTIONS</button> <button onclick="go('TRACE', '')">TRACE</button> <button onclick="go('DELETE', '')">DELETE</button></li>

<li>/floor: <button onclick="go('GET', '/floor')">GET</button> <button onclick="go('POST', '/floor')">POST</button></li>

<li>/drawer: <button onclick="go('POST', '/drawer')">POST</button></li>

<li>/inventory: <button onclick="go('GET', '/inventory')">GET</button> item <input id="item" size="16"> <button onclick="go('GET', '/inventory/' + val('item'))">GET</button> <button onclick="go('DELETE', '/inventory/' + val('item'))">DELETE</button></li>

<li>/techniques: <button onclick="go('GET', '/techniques')">GET</button></li>

<li>/length: <button onclick="go('GET', '/length')">GET</button> <button onclick="go('HEAD', '/length')">HEAD</button></li>

<li>/foreskin: <button onclick="go('GET', '/foreskin')">GET</button> <button onclick="go('DELETE', '/foreskin')">DELETE</button></li>

<li>/branches: <button onclick="go('POST', '/branches/forum')">POST forum</button> <button onclick="go('POST', '/branches/close-tab')">POST close-tab</button></li>

<li>/shop: <button onclick="go('GET', '/shop')">GET</button> item <input id="buy" size="16"> <button onclick="go('POST', '/shop/' + val('buy'))">POST</button></li>

<li>/portal: <button onclick="go('GET', '/portal')">GET</button> <button onclick="go('POST', '/portal')">POST</button></li>

<li>/elder: <button onclick="go('GET', '/elder')">GET</button></li>

<li>/grip: <button onclick="go('GET', '/grip')">GET</button></li>

<li>/diagnosis: <button onclick="go('GET', '/diagnosis')">GET</button></li>

<li>PATCH the run, as application/json-patch+json:<br>

<textarea id="patch" rows="2" cols="60">[{"op": "test", "path": "/length", "value": 6}]</textarea>

<button onclick="go('PATCH', '', [['Content-Type', 'application/json-patch+json']], val('patch'))">PATCH</button></li>

<li>anything: method <input id="method" size="8" value="GET"> path <input id="path" size="30" value="/leaderboard"> <button onclick="send(val('method'), val('path'))">Send</button></li>

</ul>

<h2>Headers</h2>

<p>Sent with every request when filled in.</p>

<ul>

<li>Authorization <input id="authorization" size="50" placeholder='Excuse "homework"'></li>

<li>Proxy-Authorization <input id="proxy-authorization" size="30" placeholder="Ruler 5.4"></li>

<li>If-Match <input id="if-match" size="24"></li>

<li>If-None-Match <input id="if-none-match" size="24"></li>

<li>If-Modified-Since <input id="if-modified-since" size="32"></li>

<li>Range <input id="range" size="16" placeholder="inches=0-2"></li>

<li>Accept <input id="accept" size="30"></li>

<li>Accept-Encoding <input id="accept-encoding" size="10"></li>

<li>Expect <input id="expect" size="16"></li>

<li>Upgrade <input id="upgrade" size="16" placeholder="underhand"></li>

</ul>

<hr>

<p><a href="/leaderboard">/leaderboard</a> <a href="/graveyard">/graveyard</a> <a href="/forum/threads/2009">/forum/threads/2009</a></p>

<script>

const HEADERS = ["Authorization", "Proxy-Authorization", "If-Match", "If-None-Match", "If-Modified-Since", "Range", "Accept", "Accept-Encoding", "Expect", "Upgrade"];

function val(id) {

  return document.getElementById(id).value.trim();

}

function put(id, text) {

  document.getElementById(id).textContent = text;

}

function item(list, text, onclick) {

  const li = document.createElement("li");

  if (onclick) {

    const button = document.createElement("button");

    button.textContent = text;

    button.onclick = onclick;

    li.appendChild(button);

  } else {

    li.textContent = text;

  }

  document.getElementById(list).appendChild(li);

}

function hrefs(value, found) {

  if (value && typeof value === "object") {

    if (typeof value.href === "string") found.push([value.method || "GET", value.href]);

    for (const key in value) hrefs(value[key], found);

  }

  return found;

}

async function send(method, path, extra, body) {

  const headers = HEADERS.map(name => [name, val(name.toLowerCase())]).filter(h => h[1]);

  if (val("upgrade")) headers.push(["Connection", "upgrade"]);

  const response = await fetch("/ui/send", {

    method: "POST",

    headers: {"Content-Type": "application/json"},

    body: JSON.stringify({method, path, headers: headers.concat(extra || []), body: body || ""}),

  });

  show(await response.json(), path);

}

function show(r, path) {

  put("status", r.status + " " + (r.reason || ""));

  let parsed = null;

  try { parsed = JSON.parse(r.body); } catch (e) {}

  put("detail", parsed && parsed.detail ? parsed.detail : "");

  put("body", r.body);

  document.getElementById("headers").replaceChildren();

  document.getElementById("links").replaceChildren();

  for (const [name, value] of r.headers) item("headers", name + ": " + value);

  const location = r.headers.find(h => h[0] === "location");

  if (location && path === "/runs" && r.status === 201) document.getElementById("run").value = location[1];

  if (location) item("links", "GET " + location[1], () => send("GET", location[1]));

  for (const [method, href] of hrefs(parsed, [])) item("links", method + " " + href, () => send(method, href));

}

function go(method, sub, extra, body) {

  if (!val("run")) {

    put("status", "No run");

    put("detail", "Press POST /runs first.");

    return;

  }

  send(method, val("run") + sub, extra, body);

}

function start() {

  send("POST", val("seed") ? "/runs?seed=" + encodeURIComponent(val("seed")) : "/runs");

}

function jelq() {

  const technique = val("combo") || val("technique");

  const query = "?technique=" + encodeURIComponent(technique) + "&intensity=" + encodeURIComponent(val("intensity"));

  const lube = val("lube");

  go("JELQ", query, lube ? [["Content-Type", lube]] : []);

}

</script>

</body>

</html>