tornis - npm Package Compare versions

Comparing version 0.1.6 to 0.2.1

dist/tornis.es5.js

@@ -1,1 +0,1 @@
-!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):(t=t||self,i(t.tornis={}))}(this,function(t){"use strict";function i(t,i){if(!(t instanceof i))throw new TypeError("Cannot call a class as a function")}function s(t,i){for(var s=0;s<i.length;s++){var e=i[s];e.enumerable=e.enumerable||!1,e.configurable=!0,"value"in e&&(e.writable=!0),Object.defineProperty(t,e.key,e)}}function e(t,i,e){return i&&s(t.prototype,i),e&&s(t,e),t}function h(t,i){var s=0;return function(){var e=(new Date).getTime();if(!(e-s<t))return s=e,i.apply(void 0,arguments)}}function o(t){return Math.floor(t.reduce(function(t,i){return t+i},0)/t.length)}var a="undefined"==typeof window,n=new(function(){function t(){i(this,t),a||(this.lastX=0,this.lastY=0,this.lastWidth=window.innerWidth,this.lastHeight=window.innerHeight,this.lastMouseX=0,this.lastMouseY=0,this.scrollHeight=document.body.scrollHeight,this.scrollChange=!1,this.sizeChange=!1,this.mouseChange=!1,this.currX=0,this.currY=0,this.currWidth=window.innerWidth,this.currHeight=window.innerHeight,this.currMouseX=0,this.currMouseY=0,this.mouseXVelocity=[],this.mouseYVelocity=[],this.lastMouseXVelocity=0,this.lastMouseYVelocity=0,this.updating=!1,this.callbacks=[],this.update=this.update.bind(this),this.handleResize=this.handleResize.bind(this),this.handleMouse=this.handleMouse.bind(this),this.formatData=this.formatData.bind(this),this.watch=this.watch.bind(this),this.unwatch=this.unwatch.bind(this),this.handleResize=h(110,this.handleResize),this.handleMouse=h(75,this.handleMouse),window.addEventListener("resize",this.handleResize),window.addEventListener("mousemove",this.handleMouse),requestAnimationFrame(this.update))}return e(t,[{key:"handleResize",value:function(t){this.currWidth=window.innerWidth,this.currHeight=window.innerHeight}},{key:"handleMouse",value:function(t){this.currMouseX=t.clientX,this.currMouseY=t.clientY}},{key:"formatData",value:function(){return{scroll:{changed:this.scrollChange,left:Math.floor(this.lastX),right:Math.floor(this.lastX+this.lastWidth),top:Math.floor(this.lastY),bottom:Math.floor(this.lastY+this.lastHeight),velocity:{x:Math.floor(this.scrollXVelocity)||0,y:Math.floor(this.scrollYVelocity)||0}},size:{changed:this.sizeChange,x:Math.floor(this.lastWidth),y:Math.floor(this.lastHeight),docY:Math.floor(this.scrollHeight)},mouse:{changed:this.mouseChange,x:Math.floor(this.lastMouseX),y:Math.floor(this.lastMouseY),velocity:{x:Math.floor(this.lastMouseXVelocity)||0,y:Math.floor(this.lastMouseYVelocity)||0}}}}},{key:"update",value:function(){var t=this,i=this.currWidth,s=this.currHeight,e=this.currMouseX,h=this.currMouseY;if(this.updating)return!1;this.scrollChange=this.sizeChange=this.mouseChange=!1,window.pageXOffset==this.lastX&&0!=this.scrollXVelocity&&(this.scrollXVelocity=0,this.scrollChange=!0),window.pageYOffset==this.lastY&&0!=this.scrollYVelocity&&(this.scrollYVelocity=0,this.scrollChange=!0),window.pageXOffset!=this.lastX&&(this.scrollChange=!0,this.scrollXVelocity=Math.floor(window.pageXOffset-this.lastX),this.lastX=window.pageXOffset),window.pageYOffset!=this.lastY&&(this.scrollChange=!0,this.scrollYVelocity=Math.floor(window.pageYOffset-this.lastY),this.lastY=window.pageYOffset),i!=this.lastWidth&&(this.lastWidth=i,this.scrollHeight=document.body.scrollHeight,this.sizeChange=!0),s!=this.lastHeight&&(this.lastHeight=s,this.sizeChange=!0),this.mouseXVelocity.length>5&&this.mouseXVelocity.shift(),this.mouseXVelocity.push(e-this.lastMouseX),o(this.mouseXVelocity)!=this.lastMouseXVelocity&&(this.lastMouseXVelocity=o(this.mouseXVelocity),this.mouseChange=!0),e!=this.lastMouseX&&(this.lastMouseX=e,this.mouseChange=!0),this.mouseYVelocity.length>5&&this.mouseYVelocity.shift(),this.mouseYVelocity.push(h-this.lastMouseY),o(this.mouseYVelocity)!=this.lastMouseYVelocity&&(this.lastMouseYVelocity=o(this.mouseYVelocity),this.mouseChange=!0),h==this.lastMouseY&&0==o(this.mouseYVelocity)||(this.lastMouseY=h,this.mouseChange=!0),(this.scrollChange||this.sizeChange||this.mouseChange)&&this.callbacks.forEach(function(i){return i(t.formatData())}),this.updating=!1,requestAnimationFrame(this.update)}},{key:"watch",value:function(t){var i=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if("function"!=typeof t)throw new Error("Value passed to Watch is not a function");if(!a){if(i){var s=this.formatData();s.scroll.changed=!0,s.mouse.changed=!0,s.size.changed=!0,t(s)}this.callbacks.push(t)}}},{key:"unwatch",value:function(t){if("function"!=typeof t)throw new Error("The value passed to unwatch is not a function");a||(this.callbacks=this.callbacks.filter(function(i){return i!==t}))}}]),t}());a||(window.__TORNIS={watchViewport:n.watch,unwatchViewport:n.unwatch,getViewportState:n.formatData});var l=n.watch,r=n.unwatch,u=n.formatData;t.getViewportState=u,t.unwatchViewport=r,t.watchViewport=l,Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):(t=t||self,i(t.tornis={}))}(this,function(t){"use strict";function i(t,i){if(!(t instanceof i))throw new TypeError("Cannot call a class as a function")}function s(t,i){for(var s=0;s<i.length;s++){var e=i[s];e.enumerable=e.enumerable||!1,e.configurable=!0,"value"in e&&(e.writable=!0),Object.defineProperty(t,e.key,e)}}function e(t,i,e){return i&&s(t.prototype,i),e&&s(t,e),t}function a(t,i){var s=0;return function(){var e=(new Date).getTime();if(!(e-s<t))return s=e,i.apply(void 0,arguments)}}function h(t){return Math.floor(t.reduce(function(t,i){return t+i},0)/t.length)}var o="undefined"==typeof window,n=new(function(){function t(){i(this,t),o||(this.lastX=0,this.lastY=0,this.lastWidth=window.innerWidth,this.lastHeight=window.innerHeight,this.lastMouseX=0,this.lastMouseY=0,this.lastWindowX=window.screenX,this.lastWindowY=window.screenY,this.lastAlpha=0,this.lastBeta=0,this.lastGamma=0,this.currAlpha=0,this.currBeta=0,this.currGamma=0,this.scrollHeight=document.body.scrollHeight,this.scrollChange=!1,this.sizeChange=!1,this.mouseChange=!1,this.positionChange=!1,this.orientationChange=!1,this.currX=0,this.currY=0,this.currWidth=window.innerWidth,this.currHeight=window.innerHeight,this.currMouseX=0,this.currMouseY=0,this.currWindowX=0,this.mouseXVelocity=[],this.mouseYVelocity=[],this.lastMouseXVelocity=0,this.lastMouseYVelocity=0,this.windowXVelocity=[],this.windowYVelocity=[],this.lastWindowXVelocity=0,this.lastWindowYVelocity=0,this.updating=!1,this.callbacks=[],this.update=this.update.bind(this),this.handleResize=this.handleResize.bind(this),this.handleMouse=this.handleMouse.bind(this),this.handleOrientation=this.handleOrientation.bind(this),this.recalibrateOrientation=this.recalibrateOrientation.bind(this),this.formatData=this.formatData.bind(this),this.watch=this.watch.bind(this),this.unwatch=this.unwatch.bind(this),this.handleResize=a(110,this.handleResize),this.handleMouse=a(75,this.handleMouse),window.addEventListener("resize",this.handleResize),window.addEventListener("mousemove",this.handleMouse),window.addEventListener("deviceorientation",this.handleOrientation),requestAnimationFrame(this.update))}return e(t,[{key:"handleResize",value:function(t){this.currWidth=window.innerWidth,this.currHeight=window.innerHeight}},{key:"handleMouse",value:function(t){this.currMouseX=t.clientX,this.currMouseY=t.clientY}},{key:"handleOrientation",value:function(t){this.initialAlpha||(this.initialAlpha=t.alpha),this.initialBeta||(this.initialBeta=t.beta),this.initialGamma||(this.initialGamma=t.gamma),this.currAlpha=t.alpha,this.currBeta=t.beta,this.currGamma=t.gamma}},{key:"recalibrateOrientation",value:function(){var t={prev:{alpha:this.initialAlpha,beta:this.initialBeta,gamma:this.initialGamma}};return this.initialAlpha=this.lastAlpha,this.initialBeta=this.lastBeta,this.initialGamma=this.lastGamma,t.current={alpha:this.initialAlpha,beta:this.initialBeta,gamma:this.initialGamma},t}},{key:"formatData",value:function(){return{scroll:{changed:this.scrollChange,left:Math.floor(this.lastX),right:Math.floor(this.lastX+this.lastWidth),top:Math.floor(this.lastY),bottom:Math.floor(this.lastY+this.lastHeight),velocity:{x:Math.floor(this.scrollXVelocity)||0,y:Math.floor(this.scrollYVelocity)||0}},size:{changed:this.sizeChange,x:Math.floor(this.lastWidth),y:Math.floor(this.lastHeight),docY:Math.floor(this.scrollHeight)},mouse:{changed:this.mouseChange,x:Math.floor(this.lastMouseX),y:Math.floor(this.lastMouseY),velocity:{x:Math.floor(this.lastMouseXVelocity)||0,y:Math.floor(this.lastMouseYVelocity)||0}},position:{changed:this.positionChange,left:Math.floor(this.lastWindowX),right:Math.floor(this.lastWindowX+this.lastWidth),top:Math.floor(this.lastWindowY),bottom:Math.floor(this.lastWindowY+this.lastHeight),velocity:{x:Math.floor(this.lastWindowXVelocity)||0,y:Math.floor(this.lastWindowYVelocity)||0}},orientation:{changed:this.orientationChange,alpha:Math.floor(this.lastAlpha-this.initialAlpha)||0,beta:Math.floor(this.lastBeta-this.initialBeta)||0,gamma:Math.floor(this.lastGamma-this.initialGamma)||0}}}},{key:"update",value:function(){var t=this,i=this.currWidth,s=this.currHeight,e=this.currMouseX,a=this.currMouseY,o=this.currAlpha,n=this.currBeta,l=this.currGamma;if(this.updating)return!1;this.scrollChange=this.sizeChange=this.mouseChange=this.positionChange=this.orientationChange=!1,this.windowXVelocity.length>5&&this.windowXVelocity.shift(),this.windowXVelocity.push(window.screenX-this.lastWindowX),h(this.windowXVelocity)!=this.lastWindowXVelocity&&(this.lastWindowXVelocity=h(this.windowXVelocity),this.positionChange=!0),window.screenX!=this.lastWindowX&&(this.positionChange=!0,this.lastWindowX=window.screenX),this.windowYVelocity.length>5&&this.windowYVelocity.shift(),this.windowYVelocity.push(window.screenY-this.lastWindowY),h(this.windowYVelocity)!=this.lastWindowYVelocity&&(this.lastWindowYVelocity=h(this.windowYVelocity),this.positionChange=!0),window.screenY!=this.lastWindowY&&(this.positionChange=!0,this.lastWindowY=window.screenY),window.pageXOffset==this.lastX&&0!=this.scrollXVelocity&&(this.scrollXVelocity=0,this.scrollChange=!0),window.pageYOffset==this.lastY&&0!=this.scrollYVelocity&&(this.scrollYVelocity=0,this.scrollChange=!0),window.pageXOffset!=this.lastX&&(this.scrollChange=!0,this.scrollXVelocity=Math.floor(window.pageXOffset-this.lastX),this.lastX=window.pageXOffset),window.pageYOffset!=this.lastY&&(this.scrollChange=!0,this.scrollYVelocity=Math.floor(window.pageYOffset-this.lastY),this.lastY=window.pageYOffset),i!=this.lastWidth&&(this.lastWidth=i,this.scrollHeight=document.body.scrollHeight,this.sizeChange=!0),s!=this.lastHeight&&(this.lastHeight=s,this.sizeChange=!0),this.mouseXVelocity.length>5&&this.mouseXVelocity.shift(),this.mouseXVelocity.push(e-this.lastMouseX),h(this.mouseXVelocity)!=this.lastMouseXVelocity&&(this.lastMouseXVelocity=h(this.mouseXVelocity),this.mouseChange=!0),e!=this.lastMouseX&&(this.lastMouseX=e,this.mouseChange=!0),this.mouseYVelocity.length>5&&this.mouseYVelocity.shift(),this.mouseYVelocity.push(a-this.lastMouseY),h(this.mouseYVelocity)!=this.lastMouseYVelocity&&(this.lastMouseYVelocity=h(this.mouseYVelocity),this.mouseChange=!0),a==this.lastMouseY&&0==h(this.mouseYVelocity)||(this.lastMouseY=a,this.mouseChange=!0),o!=this.lastAlpha&&(this.lastAlpha=o,this.orientationChange=!0),n!=this.lastBeta&&(this.lastBeta=n,this.orientationChange=!0),l!=this.lastGamma&&(this.lastGamma=l,this.orientationChange=!0),(this.scrollChange||this.sizeChange||this.mouseChange||this.positionChange||this.orientationChange)&&this.callbacks.forEach(function(i){return i(t.formatData())}),this.updating=!1,requestAnimationFrame(this.update)}},{key:"watch",value:function(t){var i=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];if("function"!=typeof t)throw new Error("Value passed to Watch is not a function");if(!o){if(i){var s=this.formatData();s.scroll.changed=!0,s.mouse.changed=!0,s.size.changed=!0,s.position.changed=!0,s.orientation.changed=!0,t(s)}this.callbacks.push(t)}}},{key:"unwatch",value:function(t){if("function"!=typeof t)throw new Error("The value passed to unwatch is not a function");o||(this.callbacks=this.callbacks.filter(function(i){return i!==t}))}}]),t}());o||(window.__TORNIS={watchViewport:n.watch,unwatchViewport:n.unwatch,getViewportState:n.formatData,recalibrateOrientation:n.recalibrateOrientation});var l=n.watch,r=n.unwatch,c=n.formatData,u=n.recalibrateOrientation;t.getViewportState=c,t.recalibrateOrientation=u,t.unwatchViewport=r,t.watchViewport=l,Object.defineProperty(t,"__esModule",{value:!0})});

dist/tornis.js

@@ -1,1 +0,1 @@
-!function(t,s){"object"==typeof exports&&"undefined"!=typeof module?s(exports):"function"==typeof define&&define.amd?define(["exports"],s):(t=t||self,s(t.tornis={}))}(this,function(t){"use strict";function s(t,s){let i=0;return function(...e){const h=(new Date).getTime();if(!(h-i<t))return i=h,s(...e)}}function i(t){return Math.floor(t.reduce((t,s)=>t+s,0)/t.length)}const e="undefined"==typeof window;class h{constructor(){e||(this.lastX=0,this.lastY=0,this.lastWidth=window.innerWidth,this.lastHeight=window.innerHeight,this.lastMouseX=0,this.lastMouseY=0,this.scrollHeight=document.body.scrollHeight,this.scrollChange=!1,this.sizeChange=!1,this.mouseChange=!1,this.currX=0,this.currY=0,this.currWidth=window.innerWidth,this.currHeight=window.innerHeight,this.currMouseX=0,this.currMouseY=0,this.mouseXVelocity=[],this.mouseYVelocity=[],this.lastMouseXVelocity=0,this.lastMouseYVelocity=0,this.updating=!1,this.callbacks=[],this.update=this.update.bind(this),this.handleResize=this.handleResize.bind(this),this.handleMouse=this.handleMouse.bind(this),this.formatData=this.formatData.bind(this),this.watch=this.watch.bind(this),this.unwatch=this.unwatch.bind(this),this.handleResize=s(110,this.handleResize),this.handleMouse=s(75,this.handleMouse),window.addEventListener("resize",this.handleResize),window.addEventListener("mousemove",this.handleMouse),requestAnimationFrame(this.update))}handleResize(t){this.currWidth=window.innerWidth,this.currHeight=window.innerHeight}handleMouse(t){this.currMouseX=t.clientX,this.currMouseY=t.clientY}formatData(){return{scroll:{changed:this.scrollChange,left:Math.floor(this.lastX),right:Math.floor(this.lastX+this.lastWidth),top:Math.floor(this.lastY),bottom:Math.floor(this.lastY+this.lastHeight),velocity:{x:Math.floor(this.scrollXVelocity)||0,y:Math.floor(this.scrollYVelocity)||0}},size:{changed:this.sizeChange,x:Math.floor(this.lastWidth),y:Math.floor(this.lastHeight),docY:Math.floor(this.scrollHeight)},mouse:{changed:this.mouseChange,x:Math.floor(this.lastMouseX),y:Math.floor(this.lastMouseY),velocity:{x:Math.floor(this.lastMouseXVelocity)||0,y:Math.floor(this.lastMouseYVelocity)||0}}}}update(){const{currWidth:currWidth,currHeight:currHeight,currMouseX:currMouseX,currMouseY:currMouseY}=this;if(this.updating)return!1;this.scrollChange=this.sizeChange=this.mouseChange=!1,window.pageXOffset==this.lastX&&0!=this.scrollXVelocity&&(this.scrollXVelocity=0,this.scrollChange=!0),window.pageYOffset==this.lastY&&0!=this.scrollYVelocity&&(this.scrollYVelocity=0,this.scrollChange=!0),window.pageXOffset!=this.lastX&&(this.scrollChange=!0,this.scrollXVelocity=Math.floor(window.pageXOffset-this.lastX),this.lastX=window.pageXOffset),window.pageYOffset!=this.lastY&&(this.scrollChange=!0,this.scrollYVelocity=Math.floor(window.pageYOffset-this.lastY),this.lastY=window.pageYOffset),currWidth!=this.lastWidth&&(this.lastWidth=currWidth,this.scrollHeight=document.body.scrollHeight,this.sizeChange=!0),currHeight!=this.lastHeight&&(this.lastHeight=currHeight,this.sizeChange=!0),this.mouseXVelocity.length>5&&this.mouseXVelocity.shift(),this.mouseXVelocity.push(currMouseX-this.lastMouseX),i(this.mouseXVelocity)!=this.lastMouseXVelocity&&(this.lastMouseXVelocity=i(this.mouseXVelocity),this.mouseChange=!0),currMouseX!=this.lastMouseX&&(this.lastMouseX=currMouseX,this.mouseChange=!0),this.mouseYVelocity.length>5&&this.mouseYVelocity.shift(),this.mouseYVelocity.push(currMouseY-this.lastMouseY),i(this.mouseYVelocity)!=this.lastMouseYVelocity&&(this.lastMouseYVelocity=i(this.mouseYVelocity),this.mouseChange=!0),currMouseY==this.lastMouseY&&0==i(this.mouseYVelocity)||(this.lastMouseY=currMouseY,this.mouseChange=!0),(this.scrollChange||this.sizeChange||this.mouseChange)&&this.callbacks.forEach(t=>t(this.formatData())),this.updating=!1,requestAnimationFrame(this.update)}watch(t,s=!0){if("function"!=typeof t)throw new Error("Value passed to Watch is not a function");if(!e){if(s){const s=this.formatData();s.scroll.changed=!0,s.mouse.changed=!0,s.size.changed=!0,t(s)}this.callbacks.push(t)}}unwatch(t){if("function"!=typeof t)throw new Error("The value passed to unwatch is not a function");e||(this.callbacks=this.callbacks.filter(s=>s!==t))}}const o=new h;e||(window.__TORNIS={watchViewport:o.watch,unwatchViewport:o.unwatch,getViewportState:o.formatData});const a=o.watch,l=o.unwatch,n=o.formatData;t.getViewportState=n,t.unwatchViewport=l,t.watchViewport=a,Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?i(exports):"function"==typeof define&&define.amd?define(["exports"],i):(t=t||self,i(t.tornis={}))}(this,function(t){"use strict";function i(t,i){let s=0;return function(...h){const e=(new Date).getTime();if(!(e-s<t))return s=e,i(...h)}}function s(t){return Math.floor(t.reduce((t,i)=>t+i,0)/t.length)}const h="undefined"==typeof window;class e{constructor(){h||(this.lastX=0,this.lastY=0,this.lastWidth=window.innerWidth,this.lastHeight=window.innerHeight,this.lastMouseX=0,this.lastMouseY=0,this.lastWindowX=window.screenX,this.lastWindowY=window.screenY,this.lastAlpha=0,this.lastBeta=0,this.lastGamma=0,this.currAlpha=0,this.currBeta=0,this.currGamma=0,this.scrollHeight=document.body.scrollHeight,this.scrollChange=!1,this.sizeChange=!1,this.mouseChange=!1,this.positionChange=!1,this.orientationChange=!1,this.currX=0,this.currY=0,this.currWidth=window.innerWidth,this.currHeight=window.innerHeight,this.currMouseX=0,this.currMouseY=0,this.currWindowX=0,this.mouseXVelocity=[],this.mouseYVelocity=[],this.lastMouseXVelocity=0,this.lastMouseYVelocity=0,this.windowXVelocity=[],this.windowYVelocity=[],this.lastWindowXVelocity=0,this.lastWindowYVelocity=0,this.updating=!1,this.callbacks=[],this.update=this.update.bind(this),this.handleResize=this.handleResize.bind(this),this.handleMouse=this.handleMouse.bind(this),this.handleOrientation=this.handleOrientation.bind(this),this.recalibrateOrientation=this.recalibrateOrientation.bind(this),this.formatData=this.formatData.bind(this),this.watch=this.watch.bind(this),this.unwatch=this.unwatch.bind(this),this.handleResize=i(110,this.handleResize),this.handleMouse=i(75,this.handleMouse),window.addEventListener("resize",this.handleResize),window.addEventListener("mousemove",this.handleMouse),window.addEventListener("deviceorientation",this.handleOrientation),requestAnimationFrame(this.update))}handleResize(t){this.currWidth=window.innerWidth,this.currHeight=window.innerHeight}handleMouse(t){this.currMouseX=t.clientX,this.currMouseY=t.clientY}handleOrientation(t){this.initialAlpha||(this.initialAlpha=t.alpha),this.initialBeta||(this.initialBeta=t.beta),this.initialGamma||(this.initialGamma=t.gamma),this.currAlpha=t.alpha,this.currBeta=t.beta,this.currGamma=t.gamma}recalibrateOrientation(){const t={prev:{alpha:this.initialAlpha,beta:this.initialBeta,gamma:this.initialGamma}};return this.initialAlpha=this.lastAlpha,this.initialBeta=this.lastBeta,this.initialGamma=this.lastGamma,t.current={alpha:this.initialAlpha,beta:this.initialBeta,gamma:this.initialGamma},t}formatData(){return{scroll:{changed:this.scrollChange,left:Math.floor(this.lastX),right:Math.floor(this.lastX+this.lastWidth),top:Math.floor(this.lastY),bottom:Math.floor(this.lastY+this.lastHeight),velocity:{x:Math.floor(this.scrollXVelocity)||0,y:Math.floor(this.scrollYVelocity)||0}},size:{changed:this.sizeChange,x:Math.floor(this.lastWidth),y:Math.floor(this.lastHeight),docY:Math.floor(this.scrollHeight)},mouse:{changed:this.mouseChange,x:Math.floor(this.lastMouseX),y:Math.floor(this.lastMouseY),velocity:{x:Math.floor(this.lastMouseXVelocity)||0,y:Math.floor(this.lastMouseYVelocity)||0}},position:{changed:this.positionChange,left:Math.floor(this.lastWindowX),right:Math.floor(this.lastWindowX+this.lastWidth),top:Math.floor(this.lastWindowY),bottom:Math.floor(this.lastWindowY+this.lastHeight),velocity:{x:Math.floor(this.lastWindowXVelocity)||0,y:Math.floor(this.lastWindowYVelocity)||0}},orientation:{changed:this.orientationChange,alpha:Math.floor(this.lastAlpha-this.initialAlpha)||0,beta:Math.floor(this.lastBeta-this.initialBeta)||0,gamma:Math.floor(this.lastGamma-this.initialGamma)||0}}}update(){const{currWidth:currWidth,currHeight:currHeight,currMouseX:currMouseX,currMouseY:currMouseY,currAlpha:currAlpha,currBeta:currBeta,currGamma:currGamma}=this;if(this.updating)return!1;this.scrollChange=this.sizeChange=this.mouseChange=this.positionChange=this.orientationChange=!1,this.windowXVelocity.length>5&&this.windowXVelocity.shift(),this.windowXVelocity.push(window.screenX-this.lastWindowX),s(this.windowXVelocity)!=this.lastWindowXVelocity&&(this.lastWindowXVelocity=s(this.windowXVelocity),this.positionChange=!0),window.screenX!=this.lastWindowX&&(this.positionChange=!0,this.lastWindowX=window.screenX),this.windowYVelocity.length>5&&this.windowYVelocity.shift(),this.windowYVelocity.push(window.screenY-this.lastWindowY),s(this.windowYVelocity)!=this.lastWindowYVelocity&&(this.lastWindowYVelocity=s(this.windowYVelocity),this.positionChange=!0),window.screenY!=this.lastWindowY&&(this.positionChange=!0,this.lastWindowY=window.screenY),window.pageXOffset==this.lastX&&0!=this.scrollXVelocity&&(this.scrollXVelocity=0,this.scrollChange=!0),window.pageYOffset==this.lastY&&0!=this.scrollYVelocity&&(this.scrollYVelocity=0,this.scrollChange=!0),window.pageXOffset!=this.lastX&&(this.scrollChange=!0,this.scrollXVelocity=Math.floor(window.pageXOffset-this.lastX),this.lastX=window.pageXOffset),window.pageYOffset!=this.lastY&&(this.scrollChange=!0,this.scrollYVelocity=Math.floor(window.pageYOffset-this.lastY),this.lastY=window.pageYOffset),currWidth!=this.lastWidth&&(this.lastWidth=currWidth,this.scrollHeight=document.body.scrollHeight,this.sizeChange=!0),currHeight!=this.lastHeight&&(this.lastHeight=currHeight,this.sizeChange=!0),this.mouseXVelocity.length>5&&this.mouseXVelocity.shift(),this.mouseXVelocity.push(currMouseX-this.lastMouseX),s(this.mouseXVelocity)!=this.lastMouseXVelocity&&(this.lastMouseXVelocity=s(this.mouseXVelocity),this.mouseChange=!0),currMouseX!=this.lastMouseX&&(this.lastMouseX=currMouseX,this.mouseChange=!0),this.mouseYVelocity.length>5&&this.mouseYVelocity.shift(),this.mouseYVelocity.push(currMouseY-this.lastMouseY),s(this.mouseYVelocity)!=this.lastMouseYVelocity&&(this.lastMouseYVelocity=s(this.mouseYVelocity),this.mouseChange=!0),currMouseY==this.lastMouseY&&0==s(this.mouseYVelocity)||(this.lastMouseY=currMouseY,this.mouseChange=!0),currAlpha!=this.lastAlpha&&(this.lastAlpha=currAlpha,this.orientationChange=!0),currBeta!=this.lastBeta&&(this.lastBeta=currBeta,this.orientationChange=!0),currGamma!=this.lastGamma&&(this.lastGamma=currGamma,this.orientationChange=!0),(this.scrollChange||this.sizeChange||this.mouseChange||this.positionChange||this.orientationChange)&&this.callbacks.forEach(t=>t(this.formatData())),this.updating=!1,requestAnimationFrame(this.update)}watch(t,i=!0){if("function"!=typeof t)throw new Error("Value passed to Watch is not a function");if(!h){if(i){const i=this.formatData();i.scroll.changed=!0,i.mouse.changed=!0,i.size.changed=!0,i.position.changed=!0,i.orientation.changed=!0,t(i)}this.callbacks.push(t)}}unwatch(t){if("function"!=typeof t)throw new Error("The value passed to unwatch is not a function");h||(this.callbacks=this.callbacks.filter(i=>i!==t))}}const a=new e;h||(window.__TORNIS={watchViewport:a.watch,unwatchViewport:a.unwatch,getViewportState:a.formatData,recalibrateOrientation:a.recalibrateOrientation});const o=a.watch,n=a.unwatch,l=a.formatData,r=a.recalibrateOrientation;t.getViewportState=l,t.recalibrateOrientation=r,t.unwatchViewport=n,t.watchViewport=o,Object.defineProperty(t,"__esModule",{value:!0})});

index.d.ts

@@ -51,2 +51,19 @@ /**
   }
+  position: {
+    changed: Boolean
+    left: number
+    right: number
+    top: number
+    bottom: number
+    velocity: {
+      x: number
+      y: number
+    }
+  }
+  orientation: {
+    changed: Boolean,
+    alpha: number,
+    beta: number,
+    gamma: number
+  }
 }

package.json

 {
   "name": "tornis",
-  "version": "0.1.6",
+  "version": "0.2.1",
   "description": "Tornis helps you watch and respond to changes in your browser's viewport",
@@ -17,2 +17,3 @@ "main": "dist/tornis.js",
     "state",
+    "orientation",
     "management"
@@ -19,0 +20,0 @@ ],

README.md

@@ -20,4 +20,4 @@ # Tornis - watch and respond
 * Scroll velocity
-
-Coming soon:
+* Browser position relative to the screen
+* Browser velocity relative to the screen
 * Device orientation
@@ -74,2 +74,19 @@
     }
+  },
+  position: {
+    changed: Boolean,
+    left: Integer,
+    right: Integer,
+    top: Integer,
+    bottom: Integer,
+    velocity: {
+      x: Integer,
+      y: Integer
+    }
+  },
+  orientation: {
+    changed: Boolean,
+    alpha: Integer,
+    beta: Integer,
+    gamma: Integer
   }
@@ -81,4 +98,9 @@ }
 
-You can see an example of this in the next section.
+You can see an example of this in the standard usage section.
 
+## A note on device orientation
+The `deviceorientation` API is currently in a state of flux, with the intention of full deprecation at some point in the future. However, as of publishing, it is still available. On Chrome, `deviceorientation` is deprecated over http, and you will require https for the events to fire. Similarly, on iOS, the API is now blocked behind a flag in the user's Safari settings. The user must enable 'motion and orientation access' for the events to fire.
+
+Once the API is enabled, Tornis doesn't calculate device orientation values exactly as the device does. Instead it resolves for the user's natural resting position by storing the initial device position on page load. All subsequent values reported for alpha, beta and gamma are relative to this initially calibrated position. The function `recalibrateOrientation()` can be used to reset the default position. This function returns an object containing the previous, and incoming calibrated positions.
+
 ## Standard usage
@@ -90,7 +112,8 @@ ``` javascript
   unwatchViewport, 
-  getViewportState
+  getViewportState,
+  recalibrateOrientation
 } from 'tornis';
 
 // define a watched function, to be run on each update
-const updateValues = ({ size, scroll, mouse, orientation }) => {
+const updateValues = ({ size, scroll, mouse, position, orientation }) => {
   if (size.changed) {
@@ -107,2 +130,10 @@ // do something related to size
   }
+
+  if (position.changed) {
+    // do something related to browser window position or velocity
+  }
+
+  if (orientation.changed) {
+    // do something related to device orientation
+  }
 };
@@ -122,2 +153,5 @@
 const state = getViewportState();
+
+// to reset the default device orientation.
+const calibrationData = recalibrateOrientation();
 ```
@@ -124,0 +158,0 @@

src/tornis.js

@@ -48,3 +48,13 @@ // Check if the module is initialised during server-side rendering
     this.lastMouseY = 0;
+    this.lastWindowX = window.screenX;
+    this.lastWindowY = window.screenY;
 
+    // device orientation
+    this.lastAlpha = 0;
+    this.lastBeta = 0;
+    this.lastGamma = 0;
+    this.currAlpha = 0;
+    this.currBeta = 0;
+    this.currGamma = 0;
+
     this.scrollHeight = document.body.scrollHeight;
@@ -55,2 +65,4 @@
     this.mouseChange = false;
+    this.positionChange = false;
+    this.orientationChange = false;
 
@@ -63,2 +75,3 @@ this.currX = 0;
     this.currMouseY = 0;
+    this.currWindowX = 0;
     
@@ -71,2 +84,9 @@ // initialise array buffers for mouse velocity
 
+    // initialise array buffers for window velocity
+    this.windowXVelocity = [];
+    this.windowYVelocity = [];
+    this.lastWindowXVelocity = 0;
+    this.lastWindowYVelocity = 0;
+
+
     // flag to limit rAF renders
@@ -82,2 +102,4 @@ this.updating = false;
     this.handleMouse = this.handleMouse.bind(this);
+    this.handleOrientation = this.handleOrientation.bind(this);
+    this.recalibrateOrientation = this.recalibrateOrientation.bind(this);
     this.formatData = this.formatData.bind(this);
@@ -94,2 +116,3 @@ this.watch = this.watch.bind(this);
     window.addEventListener('mousemove', this.handleMouse);
+    window.addEventListener('deviceorientation', this.handleOrientation);
 
@@ -117,2 +140,44 @@ // begin the update loop
   /**
+   * Event handler to capture device orientation
+   */
+  handleOrientation(e) {
+    // cache initial position for calibration
+    if (!this.initialAlpha) { this.initialAlpha = e.alpha; }
+    if (!this.initialBeta) { this.initialBeta = e.beta; }
+    if (!this.initialGamma) { this.initialGamma = e.gamma; }
+    
+    this.currAlpha = e.alpha;
+    this.currBeta = e.beta;
+    this.currGamma = e.gamma;
+  }
+
+  /** 
+   * Allow initial orientation to be reset to the last recorded values
+  */
+  recalibrateOrientation() {
+    // cache the old values
+    const calibration = {
+      prev: {
+        alpha: this.initialAlpha,
+        beta: this.initialBeta,
+        gamma: this.initialGamma,
+      }
+    };
+
+    // reset the values to the last recorded position
+    this.initialAlpha = this.lastAlpha;
+    this.initialBeta = this.lastBeta;
+    this.initialGamma = this.lastGamma;
+    
+    // add the new values to the cached calibration data
+    calibration.current = {
+      alpha: this.initialAlpha,
+      beta: this.initialBeta,
+      gamma: this.initialGamma,
+    };
+
+    return calibration;
+  }
+
+  /**
    * Returns a copy of the store data, formatted for public use
@@ -147,2 +212,20 @@ */
         }
+      },
+      position: {
+        changed: this.positionChange,
+        left: Math.floor(this.lastWindowX),
+        right: Math.floor(this.lastWindowX + this.lastWidth),
+        top: Math.floor(this.lastWindowY),
+        bottom: Math.floor(this.lastWindowY + this.lastHeight),
+        velocity: {
+          x: Math.floor(this.lastWindowXVelocity) || 0,
+          y: Math.floor(this.lastWindowYVelocity) || 0
+        }
+      },
+      orientation: {
+        changed: this.orientationChange,
+        // These values are relative to the first calibrated value
+        alpha: Math.floor(this.lastAlpha - this.initialAlpha) || 0,
+        beta: Math.floor(this.lastBeta - this.initialBeta) || 0,
+        gamma: Math.floor(this.lastGamma - this.initialGamma) || 0
       }
@@ -160,3 +243,6 @@ };
       currMouseX,
-      currMouseY
+      currMouseY,
+      currAlpha,
+      currBeta,
+      currGamma
     } = this;
@@ -166,4 +252,37 @@ if (this.updating) return false;
     // reset the flags
-    this.scrollChange = this.sizeChange = this.mouseChange = false;
+    this.scrollChange = this.sizeChange = this.mouseChange = this.positionChange = this.orientationChange = false;
+
+    // we need to grab a buffer of the last five values and average them
+    if (this.windowXVelocity.length > 5) { this.windowXVelocity.shift(); }
+    this.windowXVelocity.push(window.screenX - this.lastWindowX);
+
+    // see if the average velocity changed
+    if (getMean(this.windowXVelocity) != this.lastWindowXVelocity) {
+      this.lastWindowXVelocity = getMean(this.windowXVelocity);
+      this.positionChange = true;
+    }
+
+    // check window X position
+    if (window.screenX != this.lastWindowX) {
+      this.positionChange = true;
+      this.lastWindowX = window.screenX;
+    }
+
+    // we need to grab a buffer of the last five values and average them
+    if (this.windowYVelocity.length > 5) { this.windowYVelocity.shift(); }
+    this.windowYVelocity.push(window.screenY - this.lastWindowY);
+
+    // see if the average velocity changed
+    if (getMean(this.windowYVelocity) != this.lastWindowYVelocity) {
+      this.lastWindowYVelocity = getMean(this.windowYVelocity);
+      this.positionChange = true;
+    }
+
+    // check window Y position
+    if (window.screenY != this.lastWindowY) {
+      this.positionChange = true;
+      this.lastWindowY = window.screenY;
+    }
     
+
     // reset scroll X velocity
@@ -241,2 +360,18 @@ if (window.pageXOffset == this.lastX && this.scrollXVelocity != 0) {
 
+    // orientation
+    if (currAlpha != this.lastAlpha) {
+      this.lastAlpha = currAlpha;
+      this.orientationChange = true;
+    }
+
+    if (currBeta != this.lastBeta) {
+      this.lastBeta = currBeta;
+      this.orientationChange = true;
+    }
+
+    if (currGamma != this.lastGamma) {
+      this.lastGamma = currGamma;
+      this.orientationChange = true;
+    }
+
     // Finally, we can invoke the callbacks, but if something has changed
@@ -246,3 +381,5 @@ if (
       this.sizeChange ||
-      this.mouseChange 
+      this.mouseChange ||
+      this.positionChange ||
+      this.orientationChange
     ) {
@@ -281,2 +418,4 @@ // pass the formatted data into each watched function
       firstRunData.size.changed = true;
+      firstRunData.position.changed = true;
+      firstRunData.orientation.changed = true;
   
@@ -318,3 +457,4 @@ // run the callback using the simulated data
     unwatchViewport: TORNIS.unwatch,
-    getViewportState: TORNIS.formatData
+    getViewportState: TORNIS.formatData,
+    recalibrateOrientation: TORNIS.recalibrateOrientation
   };
@@ -326,2 +466,3 @@ }
 export const unwatchViewport = TORNIS.unwatch;
-export const getViewportState = TORNIS.formatData;
+export const getViewportState = TORNIS.formatData;
+export const recalibrateOrientation = TORNIS.recalibrateOrientation;

No alert changes

Improved metrics

Total package byte prevSize

63634

increased by39.8%

Number of package files

13

increased by8.33%

Lines of code

527

increased by43.6%

Number of lines in readme file

173

increased by24.46%

No dependency changes