You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

41 lines
1.5 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Graphische Datenverarbeitung - Raytracing - Scenegraph</title>
  6. <script type="text/javascript" src="scenegraph.bundle.js"></script>
  7. <link rel="icon" type="image/png" href="ai-logo.png">
  8. </head>
  9. <body>
  10. <nav class="navbar navbar-light bg-light">
  11. <div class="container">
  12. <a class="navbar-brand" href="/index.html">
  13. <img src="ai-logo.png" width="30" height="30" class="d-inline-block align-top" alt="">
  14. Graphische Datenverarbeitung
  15. </a>
  16. <div class="navbar-brand">Raytracing</div>
  17. </div>
  18. </nav>
  19. <br>
  20. <div class="container">
  21. <div class="row">
  22. <figure class="figure col-sm-6">
  23. <canvas id="result" class="figure-img mx-auto d-block" width="500" height="500"></canvas>
  24. <figcaption class="figure-caption text-center">
  25. <p>Implement a Raytracer using a Scenegraph.</p>
  26. <button id="startAnimationBtn" class="btn btn-dark">Start</button>
  27. <button id="stopAnimationBtn" class="btn btn-dark">Stop</button>
  28. </figcaption>
  29. </figure>
  30. <figure class="col-sm-6 figure">
  31. <img class="figure-img mx-auto d-block" src="scenegraph-finished.png">
  32. <figcaption class="figure-caption text-center">Reference image</figcaption>
  33. </figure>
  34. </div>
  35. </div>
  36. </body>
  37. </html>