vreminisc/index.html at main · mstenius/vreminisc · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover" />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
  <title>VReminisc — 360° photo viewer</title>
  <link rel="stylesheet" href="css/style.css" />
  <script type="importmap">
  {
    "imports": {
      "three": "./js/vendor/three/three.module.js"
    }
  }
  </script>
</head>
<body>
  <header>
    <h1 id="headerTitle">VReminisc</h1>
    <label class="photo-label">
      Photo:
      <select id="photoSelect"></select>
    </label>
    <span id="loadStatus" class="load-status"></span>
    <button id="motionButton" class="toolbar-button" type="button" hidden>Motion Look</button>
    <button id="fullscreenButton" class="toolbar-button" type="button" hidden>Fullscreen</button>
    <a
      class="source-link"
      href="https://github.com/mstenius/vreminisc"
      target="_blank"
      rel="noopener noreferrer"
    >VReminisc</a>
    <span id="version" class="version-label" hidden></span>
  </header>
  <main>
    <canvas id="glcanvas"></canvas>
    <div id="vrButtonContainer"></div>
    <div id="hint" class="hint">Drag to look around</div>
    <div id="loadingIndicator" class="loading-indicator">Loading...</div>
  </main>
  <script type="module" src="js/version.js"></script>
  <script type="module" src="js/viewer.js"></script>
</body>
</html>