coco.min.js

/*
 * coco - CSS Orientation Controls
 * By Ben Hatsor (MIT License)
 */

Element.prototype.coco=function(a){function b(a){k="touchstart"===a.type?a.touches[0].clientX-l:a.clientX-l,h=!0,i=!0}function c(){k=j,l=j,h=!1,!0==i&&g.dispatchEvent(new MouseEvent("click",{view:window,bubbles:!0,cancelable:!1}))}function d(a){h&&(a.preventDefault(),j="touchmove"===a.type?a.touches[0].clientX-k:a.clientX-k,l=j,f(),i=!1)}function f(){g.style.transform="translate3d("+m+"px, "+n+"px, "+o+"px) rotateY("+j+"deg) "+p}var g=this,h=!1,i=!1,j=0,k=0,l=0,m=0,n=0,o=0;g.style.transformStyle="preserve-3d";var p=window.getComputedStyle(g).transform;return"none"==p&&(p=""),!1!==a&&(g.style.pointerEvents="none",document.documentElement.style.cursor="grab",document.addEventListener("mousedown",b,!1),document.addEventListener("mouseup",c,!1),document.addEventListener("mousemove",d,!1),document.addEventListener("keydown",function(a){"37"==a.keyCode||"65"==a.keyCode?m+=3:"39"==a.keyCode||"68"==a.keyCode?m-=3:"32"==a.keyCode?n+=3:"16"==a.keyCode?n-=3:"38"==a.keyCode||"87"==a.keyCode?o+=3:("40"==a.keyCode||"83"==a.keyCode)&&(o-=3),f()},!1),document.addEventListener("touchstart",b,!1),document.addEventListener("touchend",c,!1),document.addEventListener("touchmove",d,!1)),{camera:function(a,b,c){m=a,n=b,o=c,f()}}},NodeList.prototype.coco=function(a){function b(a){l="touchstart"===a.type?a.touches[0].clientX-m:a.clientX-m,h=!0,j=!0}function c(){if(l=k,m=k,h=!1,!0==j)for(var a=0;a<g.length;a++)g[a].dispatchEvent(new MouseEvent("click",{view:window,bubbles:!0,cancelable:!1}))}function d(a){h&&(a.preventDefault(),k="touchmove"===a.type?a.touches[0].clientX-l:a.clientX-l,m=k,f(),j=!1)}function e(a){"37"==a.keyCode||"65"==a.keyCode?n+=3:"39"==a.keyCode||"68"==a.keyCode?n-=3:"32"==a.keyCode?o+=3:"16"==a.keyCode?o-=3:"38"==a.keyCode||"87"==a.keyCode?p+=3:("40"==a.keyCode||"83"==a.keyCode)&&(p-=3),f()}function f(){for(var a=0;a<g.length;a++)g[a].style.transform="translate3d("+n+"px, "+o+"px, "+p+"px) rotateY("+k+"deg) "+q[a]}for(var g=this,h=!1,j=!1,k=0,l=0,m=0,n=0,o=0,p=0,q=[],r=0;r<g.length;r++)g[r].style.transformStyle="preserve-3d",q.push(window.getComputedStyle(g[r]).transform),"none"==q[r]&&(q[r]="");if(!1!==a){for(var r=0;r<g.length;r++)g[r].style.pointerEvents="none";document.documentElement.style.cursor="grab",document.addEventListener("mousedown",b,!1),document.addEventListener("mouseup",c,!1),document.addEventListener("mousemove",d,!1),document.addEventListener("keydown",e,!1),document.addEventListener("touchstart",b,!1),document.addEventListener("touchend",c,!1),document.addEventListener("touchmove",d,!1)}return{camera:function(a,b,c){n=a,o=b,p=c,f()}}};