'straight copy from v3'

foglabs · Oct 31, 2020 · efec97c · efec97c
commit efec97c
Show file tree

Hide file tree

Showing 16 changed files with 58,371 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+.DS_Store
diff --git a/index.html b/index.html
@@ -0,0 +1,112 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>FOG VR</title>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
+  <link type="text/css" rel="stylesheet" href="main.css">
+</head>
+<body>
+  <script type="text/javascript">
+    function k(obj){
+      return Object.keys(obj)
+    }
+
+    function lerp(a, b, u) {
+      // start val, dest val, interval
+      return (1 - u) * a + u * b;
+    }
+
+    function rgbToHex(r,g,b){
+      return '#' + componentToHex(r) + componentToHex(g) + componentToHex(b)
+    }
+
+    function componentToHex(c) {
+      c = c < 255 ? c : 255 
+      var hex = c.toString(16)
+      return hex.length == 1 ? "0" + hex : hex
+    }
+
+    function incInRange(val, inc, min, max){
+      return Math.min( Math.max( val+inc, min ), max )
+    }
+
+    function rotateInc(inc, currentRotation){
+      // use radians because js stands for jradianscript
+      let result = currentRotation + inc
+      if(result >= DEG360){
+        result = result - DEG360
+      } else if(result < 0){
+        result = result + DEG360
+      }
+
+      return result
+    }
+
+    function rotateToward(current, destination, amount){
+      if(current == destination){
+        // dont do shit if its already BEEN rotated
+        return current
+      }
+
+      let sign
+      if(current > destination){
+        sign = (current - DEG360 - destination) > (current - destination) ? 1 : -1
+      } else {
+        sign = (destination - current) > (destination - DEG360 - current) ? 1 : -1
+      }
+
+      return rotateInc(sign*amount, current)
+    }
+
+    function isWithin(val, test, precision){
+      // I dont give two fucks!
+      precision = Math.abs(precision)
+      return val < test+precision && val > test-precision
+    }
+
+    function radian(deg){
+      return Math.PI/180*deg
+    }
+
+    function shuffle(arra1) {
+      let ctr = arra1.length
+      let temp
+      let index
+
+        // While there are elements in the array
+      while (ctr > 0) {
+        // Pick a random index
+        index = Math.floor(Math.random() * ctr)
+        // Decrease ctr by 1
+        ctr--
+        // And swap the last element with it
+        temp = arra1[ctr]
+        arra1[ctr] = arra1[index]
+        arra1[index] = temp
+      }
+      return arra1
+    }
+
+    // char lifecycle
+    ALIVE = 0
+    DYING = 1
+    DEAD = 2
+    // a state beyond death
+    CORRUPTING = 3
+
+    PLAYERHEIGHT = 0.3
+    FLOOR = 0.9
+
+    MOVE = 0
+    WAIT = 1
+  </script>
+
+  <script type="module">
+    import * as main from '/v3/lib/main.js'
+    console.log('scene', main.scene)
+  </script>
+
+
+</body>
+</html>
diff --git a/lib/ARButton.js b/lib/ARButton.js
@@ -0,0 +1,156 @@
+class ARButton {
+
+  static createButton( renderer, sessionInit = {} ) {
+
+    const button = document.createElement( 'button' );
+
+    function showStartAR( /*device*/ ) {
+
+      let currentSession = null;
+
+      function onSessionStarted( session ) {
+
+        session.addEventListener( 'end', onSessionEnded );
+
+        renderer.xr.setReferenceSpaceType( 'local' );
+        renderer.xr.setSession( session );
+        button.textContent = 'STOP AR';
+
+        currentSession = session;
+
+      }
+
+      function onSessionEnded( /*event*/ ) {
+
+        currentSession.removeEventListener( 'end', onSessionEnded );
+
+        button.textContent = 'START AR';
+
+        currentSession = null;
+
+      }
+
+      //
+
+      button.style.display = '';
+
+      button.style.cursor = 'pointer';
+      button.style.left = 'calc(50% - 50px)';
+      button.style.width = '100px';
+
+      button.textContent = 'START AR';
+
+      button.onmouseenter = function () {
+
+        button.style.opacity = '1.0';
+
+      };
+
+      button.onmouseleave = function () {
+
+        button.style.opacity = '0.5';
+
+      };
+
+      button.onclick = function () {
+
+        if ( currentSession === null ) {
+
+          navigator.xr.requestSession( 'immersive-ar', sessionInit ).then( onSessionStarted );
+
+        } else {
+
+          currentSession.end();
+
+        }
+
+      };
+
+    }
+
+    function disableButton() {
+
+      button.style.display = '';
+
+      button.style.cursor = 'auto';
+      button.style.left = 'calc(50% - 75px)';
+      button.style.width = '150px';
+
+      button.onmouseenter = null;
+      button.onmouseleave = null;
+
+      button.onclick = null;
+
+    }
+
+    function showARNotSupported() {
+
+      disableButton();
+
+      button.textContent = 'AR NOT SUPPORTED';
+
+    }
+
+    function stylizeElement( element ) {
+
+      element.style.position = 'absolute';
+      element.style.bottom = '20px';
+      element.style.padding = '12px 6px';
+      element.style.border = '1px solid #fff';
+      element.style.borderRadius = '4px';
+      element.style.background = 'rgba(0,0,0,0.1)';
+      element.style.color = '#fff';
+      element.style.font = 'normal 13px sans-serif';
+      element.style.textAlign = 'center';
+      element.style.opacity = '0.5';
+      element.style.outline = 'none';
+      element.style.zIndex = '999';
+
+    }
+
+    if ( 'xr' in navigator ) {
+
+      button.id = 'ARButton';
+      button.style.display = 'none';
+
+      stylizeElement( button );
+
+      navigator.xr.isSessionSupported( 'immersive-ar' ).then( function ( supported ) {
+
+        supported ? showStartAR() : showARNotSupported();
+
+      } ).catch( showARNotSupported );
+
+      return button;
+
+    } else {
+
+      const message = document.createElement( 'a' );
+
+      if ( window.isSecureContext === false ) {
+
+        message.href = document.location.href.replace( /^http:/, 'https:' );
+        message.innerHTML = 'WEBXR NEEDS HTTPS'; // TODO Improve message
+
+      } else {
+
+        message.href = 'https://immersiveweb.dev/';
+        message.innerHTML = 'WEBXR NOT AVAILABLE';
+
+      }
+
+      message.style.left = 'calc(50% - 90px)';
+      message.style.width = '180px';
+      message.style.textDecoration = 'none';
+
+      stylizeElement( message );
+
+      return message;
+
+    }
+
+  }
+
+}
+
+export { ARButton };