OrbitControls & Resize

buttons

by jmcjc5u

HTML

<div id="info">hw1 helper
  <br>
  <button id="toggle" style="width:20%">Toggle Turn</button>
<p id="show">
</p>
</div>
<script src="https://threejs.org/build/three.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

CSS

#info {
  position: absolute;
  top: 2%;
  width: 100%;
  padding: 10px;
  text-align: center;
  //color: #ffff00
}

body {
  overflow: hidden;
}

JavaScript

var clock = new THREE.Clock();
var elapsed;
var turn = true;
var cumulate = 0;
var nextCumulate;

init();
animate();

$("#toggle").click(function() {
  turn = !turn;
  if (turn === false) {
  	clock.stop();
    nextCumulate = cumulate + elapsed;
  } else {
  	cumulate = nextCumulate;
  	clock.start();
   }
});

function move() {
	setTimeout (move, 1000);
  
}
function init() {
	
}

function animate2() {
	
}

function animate() {
	requestAnimationFrame (animate);
	elapsed = clock.getElapsedTime();
  let print = (elapsed)
  $('#show').html (`${Math.floor(print+cumulate)} <br> cumulate = ${cumulate}`);
}