{"id":191,"date":"2026-05-01T05:43:52","date_gmt":"2026-05-01T05:43:52","guid":{"rendered":"https:\/\/b-common.de\/?page_id=191"},"modified":"2026-05-13T16:51:29","modified_gmt":"2026-05-13T16:51:29","slug":"geschlossener-raum-vi","status":"publish","type":"page","link":"http:\/\/b-common.de\/","title":{"rendered":"39 &#8211; GESCHLOSSENER RAUM"},"content":{"rendered":"\n<div style=\"display:flex; flex-direction:column; gap:10px; font-family:Arial;\">\n\n  <div style=\"display:flex; gap:10px;\">\n    <button onclick=\"startSim()\">FLIGHT<\/button>\n    <button onclick=\"stopSim()\">FREEZE<\/button>\n    <button onclick=\"resetSim()\">FIGHT<\/button>\n  <\/div>\n\n  <div style=\"display:grid; grid-template-columns:1fr 1fr; gap:10px;\">\n    <canvas id=\"canvasA\"><\/canvas>\n    <canvas id=\"canvasB\"><\/canvas>\n  <\/div>\n\n<\/div>\n\n<script>\nconst canvasA = document.getElementById(\"canvasA\");\nconst ctxA = canvasA.getContext(\"2d\");\n\nconst canvasB = document.getElementById(\"canvasB\");\nconst ctxB = canvasB.getContext(\"2d\");\n\nconst img = new Image();\nimg.src = \"http:\/\/b-common.de\/wp-content\/uploads\/2026\/04\/AQNz6-zQOHZGQdJf2_lXqnFgizMzHA2uyUNPdXK15Sc4yOMlMnVq-fSxhyzKW06a0lJv79Fh5ofmgcHAHTnL5q_8-e1777579826526.jpeg\";\n\nlet dataA, dataB;\nlet origA, origB;\n\nlet running = false;\nlet animationId;\n\n\/\/ \ud83d\udd01 LOOP CONTROL\nlet phase = 0;        \/\/ 0 = normal, 1 = swapped\nlet frameCount = 0;\nconst switchEvery = 600; \/\/ Frames bis Rollentausch\n\nconst seedNoise = Date.now() % 400;\n\n\/\/ ---------------- INIT ----------------\nimg.onload = () => {\n\n  const size = Math.min(window.innerWidth \/ 2.2, 500);\n\n  canvasA.width = size;\n  canvasA.height = size;\n\n  canvasB.width = size;\n  canvasB.height = size;\n\n  ctxA.drawImage(img, 0, 0, size, size);\n  ctxB.drawImage(img, 0, 0, size, size);\n\n  dataA = ctxA.getImageData(0, 0, size, size);\n  dataB = ctxB.getImageData(0, 0, size, size);\n\n  origA = new Uint8ClampedArray(dataA.data);\n  origB = new Uint8ClampedArray(dataB.data);\n\n  startSim();\n};\n\n\/\/ ---------------- CHAOS ----------------\nfunction chaos(data) {\n  let d = data.data;\n\n  for (let i = 0; i < 700 + seedNoise; i++) {\n    let p1 = Math.floor(Math.random() * (d.length \/ 4)) * 4;\n    let p2 = Math.floor(Math.random() * (d.length \/ 4)) * 4;\n\n    for (let j = 0; j < 3; j++) {\n      let tmp = d[p1 + j];\n      d[p1 + j] = d[p2 + j];\n      d[p2 + j] = tmp;\n    }\n  }\n}\n\n\/\/ ---------------- REVERSE ----------------\nfunction reverse(data, original) {\n  let d = data.data;\n\n  for (let i = 0; i < 2500; i++) {\n    let idx = Math.floor(Math.random() * (d.length \/ 4)) * 4;\n\n    for (let j = 0; j < 3; j++) {\n      d[idx + j] += (original[idx + j] - d[idx + j]) * 0.03;\n    }\n  }\n}\n\n\/\/ ---------------- LOOP ----------------\nfunction loop() {\n  if (!running) return;\n\n  frameCount++;\n\n  \/\/ \ud83d\udd01 Rollenwechsel\n  if (frameCount % switchEvery === 0) {\n    phase = 1 - phase; \/\/ toggle 0 <-> 1\n  }\n\n  if (phase === 0) {\n    chaos(dataA);\n    reverse(dataB, origB);\n  } else {\n    reverse(dataA, origA);\n    chaos(dataB);\n  }\n\n  ctxA.putImageData(dataA, 0, 0);\n  ctxB.putImageData(dataB, 0, 0);\n\n  setTimeout(() => {\n    animationId = requestAnimationFrame(loop);\n  }, 60);\n}\n\n\/\/ ---------------- CONTROLS ----------------\nfunction startSim() {\n  if (!running) {\n    running = true;\n    loop();\n  }\n}\n\nfunction stopSim() {\n  running = false;\n  cancelAnimationFrame(animationId);\n}\n\nfunction resetSim() {\n  stopSim();\n\n  dataA.data.set(origA);\n  dataB.data.set(origB);\n\n  ctxA.putImageData(dataA, 0, 0);\n  ctxB.putImageData(dataB, 0, 0);\n\n  phase = 0;\n  frameCount = 0;\n}\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>FLIGHT FREEZE FIGHT<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-191","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/b-common.de\/index.php?rest_route=\/wp\/v2\/pages\/191","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/b-common.de\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/b-common.de\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/b-common.de\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/b-common.de\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=191"}],"version-history":[{"count":7,"href":"http:\/\/b-common.de\/index.php?rest_route=\/wp\/v2\/pages\/191\/revisions"}],"predecessor-version":[{"id":373,"href":"http:\/\/b-common.de\/index.php?rest_route=\/wp\/v2\/pages\/191\/revisions\/373"}],"wp:attachment":[{"href":"http:\/\/b-common.de\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=191"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}