aboutsummaryrefslogtreecommitdiff
path: root/index.html
diff options
context:
space:
mode:
authorJames Barnett <noreply@jamesbarnett.xyz>2022-01-01 21:21:52 +0000
committerJames Barnett <noreply@jamesbarnett.xyz>2022-01-01 21:21:52 +0000
commit7ad1b7efabea1349107669a432e6c88305f8d825 (patch)
tree8de34e4b3e20e4e8c0c01578ce0b0cfaa46cc6cf /index.html
parentdc5e815da04d7c377b3cb51558d6fe7b8e0fd7c0 (diff)
downloadjs-raytracer-7ad1b7efabea1349107669a432e6c88305f8d825.tar.xz
js-raytracer-7ad1b7efabea1349107669a432e6c88305f8d825.zip
Implement basic ray tracing
Diffstat (limited to 'index.html')
-rw-r--r--index.html61
1 files changed, 61 insertions, 0 deletions
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..b084dc8
--- /dev/null
+++ b/index.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8">
+ <title>Test</title>
+ <link rel="stylesheet" href="https://unpkg.com/spectre.css/dist/spectre.min.css">
+ <link rel="stylesheet" href="style.css">
+ </head>
+ <body>
+
+ <div class="container grid-xl">
+ <div class="columns">
+ <div class="column col-xl-12">
+ <div id="output-wrapper" class="p-centered loading loading-lg">
+ <canvas id="render-output"></canvas>
+ </div>
+ </div>
+ <div class="column">
+ <div class="columns controls">
+ <!-- <div class="column col-12 col-xl-3">
+ <p>foo</p>
+ </div>
+ <div class="column col-12 col-xl-1 hide-xl">
+ <div class="divider"></div>
+ </div> -->
+ <div class="column col-12 col-xl-9">
+ <p>Render options</p>
+ <div class="form-group">
+ <label class="form-switch">
+ <input id="diffuse-toggle" type="checkbox" checked>
+ <i class="form-icon"></i> Diffuse lighting
+ </label>
+ </div>
+ <div class="form-group">
+ <label class="form-switch">
+ <input id="specular-toggle" type="checkbox" checked>
+ <i class="form-icon"></i> Specular lighting
+ </label>
+ </div>
+ <div class="form-group">
+ <label class="form-switch">
+ <input id="shadows-toggle" type="checkbox" checked>
+ <i class="form-icon"></i> Shadows
+ </label>
+ </div>
+ <div class="form-group">
+ <label class="form-switch">
+ <input id="reflections-toggle" type="checkbox" checked>
+ <i class="form-icon"></i> Reflections
+ </label>
+ </div>
+ <button id="render" class="btn btn-primary">Render</button>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <script src="./bundle.js"></script>
+ </body>
+</html>