disable animation after 2 seconds idle

This commit is contained in:
Stewart Allen 2020-06-14 18:42:15 -04:00
commit 87d1ee3ffa
2 changed files with 27 additions and 4 deletions

View file

@ -76,7 +76,8 @@
}), }),
hiddenKey, hiddenKey,
vizChange, vizChange,
docVisible = true; docVisible = true,
lastAction = Date.now();
if (typeof DOC.hidden !== "undefined") { if (typeof DOC.hidden !== "undefined") {
hiddenKey = "hidden"; hiddenKey = "hidden";
@ -93,6 +94,10 @@
docVisible = DOC[hiddenKey] ? false : true; docVisible = DOC[hiddenKey] ? false : true;
}, false); }, false);
function updateLastAction() {
lastAction = Date.now();
}
/** ****************************************************************** /** ******************************************************************
* TWEENing Functions * TWEENing Functions
******************************************************************* */ ******************************************************************* */
@ -105,6 +110,7 @@
tweenit(); tweenit();
function tweenCamPan(x,y,z) { function tweenCamPan(x,y,z) {
updateLastAction();
let pos = viewControl.getPosition(); let pos = viewControl.getPosition();
pos.panX = x; pos.panX = x;
pos.panY = y; pos.panY = y;
@ -115,6 +121,7 @@
function tweenCam(pos) { function tweenCam(pos) {
let tf = function () { let tf = function () {
viewControl.setPosition(this); viewControl.setPosition(this);
updateLastAction();
refresh(); refresh();
}; };
new TWEEN.Tween(viewControl.getPosition()). new TWEEN.Tween(viewControl.getPosition()).
@ -133,6 +140,7 @@
}, },
update = function() { update = function() {
setPlatformSize(this.x, this.y, this.z); setPlatformSize(this.x, this.y, this.z);
updateLastAction();
refresh(); refresh();
}, },
complete = function() { complete = function() {
@ -354,6 +362,7 @@
} }
function onResize() { function onResize() {
updateLastAction();
camera.aspect = aspect(); camera.aspect = aspect();
camera.updateProjectionMatrix(); camera.updateProjectionMatrix();
renderer.setSize(width(), height()); renderer.setSize(width(), height());
@ -384,6 +393,7 @@
} }
function keyHandler(evt) { function keyHandler(evt) {
updateLastAction();
if (!defaultKeys || inputHasFocus()) return false; if (!defaultKeys || inputHasFocus()) return false;
if (evt.metaKey) return false; if (evt.metaKey) return false;
let handled = true; let handled = true;
@ -438,6 +448,7 @@
******************************************************************* */ ******************************************************************* */
function onMouseDown(event) { function onMouseDown(event) {
updateLastAction();
if (event.target === renderer.domElement) { if (event.target === renderer.domElement) {
DOC.activeElement.blur(); DOC.activeElement.blur();
event.preventDefault(); event.preventDefault();
@ -484,6 +495,7 @@
} }
function onMouseUp(event) { function onMouseUp(event) {
updateLastAction();
if (!viewControl.enabled) { if (!viewControl.enabled) {
viewControl.enabled = true; viewControl.enabled = true;
viewControl.onMouseUp(event); viewControl.onMouseUp(event);
@ -518,6 +530,7 @@
} }
function onMouseMove(event) { function onMouseMove(event) {
updateLastAction();
let int, vis; let int, vis;
if (viewControl.enabled) { if (viewControl.enabled) {
event.preventDefault(); event.preventDefault();
@ -755,12 +768,22 @@
'mousemove', onMouseMove, 'mousemove', onMouseMove,
'mousedown', onMouseDown, 'mousedown', onMouseDown,
'mouseup', onMouseUp, 'mouseup', onMouseUp,
'keypress', keyHandler 'keypress', keyHandler,
// dup with touch but need to observe here
'DOMMouseScroll', updateLastAction,
'mousewheel', updateLastAction,
'touchstart', updateLastAction,
'touchmove', updateLastAction,
'touchend', updateLastAction
]); ]);
let animating = true;
function animate() { function animate() {
requestAnimationFrame(animate); requestAnimationFrame(animate);
if (docVisible && !freeze) renderer.render(SCENE, camera); if (docVisible && !freeze && Date.now() - lastAction < 2000) {
renderer.render(SCENE, camera);
}
} }
animate(); animate();

View file

@ -65,7 +65,7 @@
<div id="mid" class="grow row"> <div id="mid" class="grow row">
<div id="progress"><div id="progbar"><div id="progtxt">loading</div></div></div> <div id="progress"><div id="progbar"><div id="progtxt">loading</div></div></div>
<div id="mid-lcol" class="col j-center noshow"> <div id="mid-lcol" class="col j-center noshow">
<div id="lt-back" class="lt-menu"> <div id="lt-back" class="lt-menu lt-enabled">
<i class="fas fa-arrow-circle-left"></i> <i class="fas fa-arrow-circle-left"></i>
</div> </div>
<div id="lt-top"></div> <div id="lt-top"></div>