index.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>ShockVortexML | Task-preserving CFD segmentation</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <main>
    <header>
      <p class="eyebrow">COMPRESSIBLE-FLOW MACHINE LEARNING</p>
      <h1>Task-preserving shock and vortex-core segmentation</h1>
      <p class="lead">Explore the multistructure movie pipeline: learned shock fronts and transition bands, vortex-core candidates, wake/shear, and expanding-flow regions. Density schlieren is shown on the left and detected structures on the right.</p>
      <nav>
        <a target="_blank" rel="noopener noreferrer" href="https://huggingface.co/ehsanroohi/Task-Preserving-Shock-Vortex-Segmentation">Model & checkpoints</a>
        <a target="_blank" rel="noopener noreferrer" href="https://github.com/Ehsan-Roohi/ShockVortexML">GitHub source</a>
        <a target="_blank" rel="noopener noreferrer" href="https://github.com/Ehsan-Roohi/ShockVortexML/releases/tag/movies-localfront-v2-20260909">Full-resolution movies</a>
        <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/@ehsan_roohi">YouTube</a>
      </nav>
    </header>

    <section class="viewer">
      <div class="tabs" role="tablist">
        <button class="active" data-image="airfoil_movie_v2.png" data-caption="Mach 3 diamond airfoil, α = 40°, Re = 10,000 · t = 6 · Movie S9 pipeline">Airfoil</button>
        <button data-image="cylinder_movie_v2.png" data-caption="Mach 2.7 Euler cylinder · t = 8 · Movie S10 pipeline">Cylinder</button>
      </div>
      <p id="caption">Mach 3 diamond airfoil, α = 40°, Re = 10,000 · t = 6 · Movie S9 pipeline</p>
      <img id="result" src="airfoil_movie_v2.png" alt="Density schlieren and movie-pipeline shock, core, wake and expansion-region predictions">
    </section>

    <section class="note">
      <h2>Interpretation</h2>
      <p>These figures use the same saved predictions as Movies S9 and S10 in the linked release. A learned local shock-front model and fixed validation-selected front extraction are combined with the retained learned core/wake branches and the PM-v4 expansion-region branch. Purple marks core candidates, green marks wake/shear, and blue marks expanding flow. The blue region is not a validated centred Prandtl–Meyer fan. Some small internal candidates and missed structures remain; these inspected development examples do not establish independent accuracy.</p>
      <p>The three HJ checkpoints in the linked model repository belong to the separate task-preservation control experiment. Its three-seed weak-reference shock Dice is 0.936 ± 0.004 for airfoils and 0.939 ± 0.024 for cylinders; these scores are not assigned to the multistructure movie pipeline shown above. The model card gives the complete results and limitations.</p>
      <nav><a target="_blank" rel="noopener noreferrer" href="demo_provenance_v2.json">Figure provenance</a></nav>
    </section>
  </main>
  <script>
    const image = document.querySelector('#result');
    const caption = document.querySelector('#caption');
    document.querySelectorAll('.tabs button').forEach(button => button.addEventListener('click', () => {
      document.querySelectorAll('.tabs button').forEach(item => item.classList.remove('active'));
      button.classList.add('active');
      image.src = button.dataset.image;
      caption.textContent = button.dataset.caption;
    }));
  </script>
</body>
</html>