napplet.soy
Create a napplet
Back to Impact Yard remix
SOURCE / PINNED RELEASE

Made of little things.

Impact Yard remix

Release
5b31a37bbd07…
Author-recorded commit
7762f7efb018…
License
LICENSE
Author’s source reference
nostr://npub1n8ga89w8h6tvwamxusfyzexw8gjy84yxu9rxgnmk955cxtml4ujswzxydd/wss%3A%2F%2Fgit.napplet.soy%2F/n-c1d8c061b02

Archive hash verified: c640627baa321925…. The source-to-build association is the author’s claim; it has not been independently rebuilt.

index.html
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="theme-color" content="#182420" />
    <title>Impact Yard</title>
  </head>
  <body>
    <main id="app">
      <canvas id="scene" tabindex="0" aria-label="Driving simulator. W or up to accelerate, S or down to reverse, A and D to steer, space to brake. F fires the rocket boost. R recovers the car. C changes the camera. N visits the next structure."></canvas>
      <div class="topline">
        <div class="location"><span class="live-dot"></span><span>Test yard <span class="location-detail">/ 360 × 360 m</span></span></div>
        <div class="toolbar" aria-label="Simulation controls">
          <button id="slow" title="Toggle slow motion" aria-label="Toggle slow motion" aria-pressed="false"><span class="button-icon">◷</span><span class="button-label">1× speed</span></button>
          <button id="pause" title="Pause simulation" aria-label="Pause simulation" aria-pressed="false"><span class="button-icon">Ⅱ</span></button>
          <span class="divider"></span>
          <button id="rebuild" class="primary" title="Rebuild yard" aria-label="Rebuild yard"><span class="button-icon">↻</span><span class="button-label">Rebuild yard</span></button>
        </div>
      </div>
      <aside class="yard-guide" aria-label="Yard structures">
        <div class="panel-label">STRUCTURES <span id="structure-count">17</span></div>
        <div id="structure-list"></div>
        <div class="guide-note"><span class="small-dot"></span>Select a structure to line up a run</div>
      </aside>
      <div class="scene-tools">
        <button id="camera" title="Change camera (C)" aria-label="Change camera"><svg viewBox="0 0 20 20" fill="none" aria-hidden="true"><path d="M3 6h3l1.5-2h5L14 6h3v10H3z"/><circle cx="10" cy="10.5" r="2.5"/></svg><span id="camera-label">Chase camera</span><kbd>C</kbd></button>
        <button id="recover" title="Recover car (R)" aria-label="Recover car"><span class="button-icon">↥</span><span class="button-label">Recover car</span><kbd>R</kbd></button>
        <button id="site" title="Visit next structure (N)" aria-label="Visit next structure"><span class="button-icon">⇥</span><span class="button-label">Next structure</span><kbd>N</kbd></button>
      </div>
      <div id="status" class="status" role="status">Starting the yard…</div>
      <div class="bottomline">
        <section class="speedometer" aria-label="Vehicle speed">
          <div class="speed-reading"><span id="speed">0</span><div><span class="unit">KM/H</span><span id="gear">N</span></div></div>
          <div class="speed-track"><span id="speed-fill"></span></div>
          <div class="speed-caption"><span>0</span><span>140</span><span>280</span></div>
        </section>
        <div class="keyboard-help"><div><kbd>W</kbd><span>Accelerate</span><kbd>S</kbd><span>Reverse</span></div><div><kbd>A</kbd><kbd>D</kbd><span>Steer</span><kbd class="space-key">SPACE</kbd><span>Brake</span></div><div><kbd>F</kbd><span>Rocket boost</span><kbd>N</kbd><span>Next site</span></div></div>
        <section class="telemetry" aria-label="Impact telemetry"><div><span class="panel-label">DISPLACED</span><strong><span id="displaced">0</span><small id="prop-total">/ 0</small></strong></div><div><span class="panel-label">PEAK IMPACT</span><strong><span id="impact">0</span><small>km/h</small></strong></div></section>
      </div>
      <div class="touch-controls" aria-label="Driving controls">
        <div class="steer-controls"><button data-drive="left" aria-label="Steer left">←</button><button data-drive="right" aria-label="Steer right">→</button></div>
        <div class="pedal-controls"><button id="boost" data-state="ready" title="Fire rocket boost (F)" aria-label="Fire rocket boost"><svg viewBox="0 0 20 20" fill="none" aria-hidden="true"><path d="M10 2c-3 3-3 6-3 10h6c0-4 0-7-3-10Z M7 8 4 12v3l3-2m6-5 3 4v3l-3-2M8 15l2 3 2-3"/><circle cx="10" cy="8" r="1"/></svg><span class="boost-copy"><span>F · BOOST</span><span id="boost-label">READY</span></span><span class="boost-track" aria-hidden="true"><span id="boost-fill"></span></span></button><button data-drive="brake" class="brake" aria-label="Brake">■</button><button data-drive="reverse" aria-label="Reverse">↓</button><button data-drive="forward" class="accelerate" aria-label="Accelerate">↑</button></div>
      </div>
      <div id="paused-notice" hidden><span>Simulation paused</span><button id="resume">Resume driving <span>▶</span></button></div>
      <button id="retry" hidden>Reload simulator</button>
    </main>
    <script type="module" src="/src/main.ts"></script>
  </body>
</html>