css-camera - npm Package Compare versions

Comparing version 1.0.0-rc to 1.0.0

lib/constants/default.js

@@ -33,2 +33,7 @@ export var STYLE = {
 };
+export var UPDATE_OPTIONS = {
+    property: 'transform',
+    timingFunction: 'ease-out',
+    delay: '0ms',
+};
 //# sourceMappingURL=default.js.map

lib/css-camera.esm.js

@@ -355,2 +355,7 @@ /*
 };
+var UPDATE_OPTIONS = {
+  property: 'transform',
+  timingFunction: 'ease-out',
+  delay: '0ms'
+};
 
@@ -360,3 +365,9 @@ var CSSCamera = function () {
     if (options === void 0) {
-      options = {};
+      options = {
+        position: [0, 0, 0],
+        scale: [1, 1, 1],
+        rotation: [0, 0, 0],
+        perspective: 0,
+        rotateOffset: 0
+      };
     }
@@ -582,3 +593,3 @@
 
-  __proto.update = function (duration, option) {
+  __proto.update = function (duration, options) {
     if (duration === void 0) {
@@ -588,4 +599,4 @@ duration = 0;
 
-    if (option === void 0) {
-      option = {
+    if (options === void 0) {
+      options = {
         property: 'transform',
@@ -598,3 +609,3 @@ timingFunction: 'ease-out',
     return __awaiter(this, void 0, Promise, function () {
-      var transitionDuration, updateOption, finalOption_1;
+      var updateOptions, transitionDuration, updateOption, finalOption_1;
 
@@ -613,2 +624,3 @@ var _this = this;
         });
+        updateOptions = assign(assign({}, UPDATE_OPTIONS), options);
 
@@ -621,5 +633,5 @@ if (duration > 0) {
           transitionDuration = duration + "ms";
-          updateOption = Object.keys(option).reduce(function (options, key) {
-            options["transition" + (key.charAt(0).toUpperCase() + key.slice(1))] = option[key];
-            return options;
+          updateOption = Object.keys(updateOptions).reduce(function (option, key) {
+            option["transition" + (key.charAt(0).toUpperCase() + key.slice(1))] = updateOptions[key];
+            return option;
           }, {});
@@ -626,0 +638,0 @@ finalOption_1 = __assign({

lib/css-camera.js

@@ -359,2 +359,7 @@ /*
     };
+    var UPDATE_OPTIONS = {
+      property: 'transform',
+      timingFunction: 'ease-out',
+      delay: '0ms'
+    };
 
@@ -364,3 +369,9 @@ var CSSCamera = function () {
         if (options === void 0) {
-          options = {};
+          options = {
+            position: [0, 0, 0],
+            scale: [1, 1, 1],
+            rotation: [0, 0, 0],
+            perspective: 0,
+            rotateOffset: 0
+          };
         }
@@ -586,3 +597,3 @@
 
-      __proto.update = function (duration, option) {
+      __proto.update = function (duration, options) {
         if (duration === void 0) {
@@ -592,4 +603,4 @@ duration = 0;
 
-        if (option === void 0) {
-          option = {
+        if (options === void 0) {
+          options = {
             property: 'transform',
@@ -602,3 +613,3 @@ timingFunction: 'ease-out',
         return __awaiter(this, void 0, Promise, function () {
-          var transitionDuration, updateOption, finalOption_1;
+          var updateOptions, transitionDuration, updateOption, finalOption_1;
 
@@ -617,2 +628,3 @@ var _this = this;
             });
+            updateOptions = assign(assign({}, UPDATE_OPTIONS), options);
 
@@ -625,5 +637,5 @@ if (duration > 0) {
               transitionDuration = duration + "ms";
-              updateOption = Object.keys(option).reduce(function (options, key) {
-                options["transition" + (key.charAt(0).toUpperCase() + key.slice(1))] = option[key];
-                return options;
+              updateOption = Object.keys(updateOptions).reduce(function (option, key) {
+                option["transition" + (key.charAt(0).toUpperCase() + key.slice(1))] = updateOptions[key];
+                return option;
               }, {});
@@ -630,0 +642,0 @@ finalOption_1 = __assign({

lib/css-camera.min.js

@@ -9,3 +9,3 @@ /*
 */
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("gl-matrix")):"function"==typeof define&&define.amd?define(["gl-matrix"],e):(t=t||self).CSSCamera=e(t["gl-matrix"])}(this,function(d){"use strict";var c=function(){return(c=Object.assign||function(t){for(var e,r=1,n=arguments.length;r<n;r++)for(var o in e=arguments[r])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t}).apply(this,arguments)};function t(r,n){var o,i,a,t,c={label:0,sent:function(){if(1&a[0])throw a[1];return a[1]},trys:[],ops:[]};return t={next:e(0),throw:e(1),return:e(2)},"function"==typeof Symbol&&(t[Symbol.iterator]=function(){return this}),t;function e(e){return function(t){return function(e){if(o)throw new TypeError("Generator is already executing.");for(;c;)try{if(o=1,i&&(a=2&e[0]?i.return:e[0]?i.throw||((a=i.return)&&a.call(i),0):i.next)&&!(a=a.call(i,e[1])).done)return a;switch(i=0,a&&(e=[2&e[0],a.value]),e[0]){case 0:case 1:a=e;break;case 4:return c.label++,{value:e[1],done:!1};case 5:c.label++,i=e[1],e=[0];continue;case 7:e=c.ops.pop(),c.trys.pop();continue;default:if(!(a=0<(a=c.trys).length&&a[a.length-1])&&(6===e[0]||2===e[0])){c=0;continue}if(3===e[0]&&(!a||e[1]>a[0]&&e[1]<a[3])){c.label=e[1];break}if(6===e[0]&&c.label<a[1]){c.label=a[1],a=e;break}if(a&&c.label<a[2]){c.label=a[2],c.ops.push(e);break}a[2]&&c.ops.pop(),c.trys.pop();continue}e=n.call(r,c)}catch(t){e=[6,t],i=0}finally{o=a=0}if(5&e[0])throw e[1];return{value:e[0]?e[1]:void 0,done:!0}}([e,t])}}}function r(t,e){var r="function"==typeof Symbol&&t[Symbol.iterator];if(!r)return t;var n,o,i=r.call(t),a=[];try{for(;(void 0===e||0<e--)&&!(n=i.next()).done;)a.push(n.value)}catch(t){o={error:t}}finally{try{n&&!n.done&&(r=i.return)&&r.call(i)}finally{if(o)throw o.error}}return a}function g(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(r(arguments[e]));return t}function u(t,e){if("string"==typeof t){var r=e?e.querySelector(t):document.querySelector(t);if(!r)throw new Error(function(t){return'Element with selector "'+t+"\" doesn't exist."}(t));return r}if(t.nodeName&&1===t.nodeType)return t;throw new Error(function(t){return"Element should be provided in string or HTMLElement. Received: "+t}(t))}function s(e,r){Object.keys(r).forEach(function(t){e.style[t]=r[t]})}function f(n){for(var t=[],e=1;e<arguments.length;e++)t[e-1]=arguments[e];return t.forEach(function(r){Object.keys(r).forEach(function(t){var e=r[t];n[t]=e})}),n}function a(t){var e=d.mat4.create();d.mat4.fromQuat(e,t);var r=e[0],n=e[4],o=e[1],i=e[5],a=e[2],c=e[6],u=e[10],s=d.vec3.create();return s[1]=Math.asin(-function(t,e,r){return Math.max(Math.min(t,r),e)}(a,-1,1)),Math.abs(a)<.99999?(s[0]=Math.atan2(c,u),s[2]=Math.atan2(o,r)):(s[0]=0,s[2]=Math.atan2(-n,i)),s.map(function(t){return function(t){return 180*t/Math.PI}(t)})}var e,l={width:"100%",height:"100%","transform-style":"preserve-3d",overflow:"hidden"},h={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},p={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},v="cc-viewport",m="cc-camera",b="cc-world",y={position:[0,0,0],scale:[1,1,1],rotation:[0,0,0],perspective:0,rotateOffset:0};function n(t,e){void 0===e&&(e={}),this._element=u(t);var r=f(f({},y),e);this._position=d.vec3.fromValues(r.position[0],r.position[1],r.position[2]),this._scale=d.vec3.fromValues(r.scale[0],r.scale[1],r.scale[2]),this._rotation=d.vec3.fromValues(r.rotation[0],r.rotation[1],r.rotation[2]),this._perspective=r.perspective,this._rotateOffset=r.rotateOffset,this._updateTimer=-1;var n=this._element,o=document.createElement("div"),i=o.cloneNode(),a=o.cloneNode();o.className=v,i.className=m,a.className=b,s(o,l),s(i,h),s(a,p),i.appendChild(a),o.appendChild(i),this._viewportEl=o,this._cameraEl=i,this._worldEl=a,n.parentElement.insertBefore(o,n),a.appendChild(n)}return e=n.prototype,Object.defineProperty(n,"VERSION",{get:function(){return"1.0.0-rc"},enumerable:!0,configurable:!0}),Object.defineProperty(e,"element",{get:function(){return this._element},enumerable:!0,configurable:!0}),Object.defineProperty(e,"viewportEl",{get:function(){return this._viewportEl},enumerable:!0,configurable:!0}),Object.defineProperty(e,"cameraEl",{get:function(){return this._cameraEl},enumerable:!0,configurable:!0}),Object.defineProperty(e,"worldEl",{get:function(){return this._worldEl},enumerable:!0,configurable:!0}),Object.defineProperty(e,"position",{get:function(){return g(this._position)},set:function(t){this._position=d.vec3.fromValues(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(e,"scale",{get:function(){return g(this._scale)},set:function(t){this._scale=d.vec3.fromValues(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(e,"rotation",{get:function(){return g(this._rotation)},set:function(t){this._rotation=d.vec3.fromValues(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(e,"quaternion",{get:function(){var t=this._rotation;return g(d.quat.fromEuler(d.quat.create(),t[0],t[1],t[2]))},set:function(t){this._rotation=a(d.quat.fromValues(t[0],t[1],t[2],t[3]))},enumerable:!0,configurable:!0}),Object.defineProperty(e,"perspective",{get:function(){return this._perspective},set:function(t){this._perspective=t},enumerable:!0,configurable:!0}),Object.defineProperty(e,"rotateOffset",{get:function(){return this._rotateOffset},set:function(t){this._rotateOffset=t},enumerable:!0,configurable:!0}),Object.defineProperty(e,"cameraCSS",{get:function(){var t=this._perspective,e=this._rotateOffset,r=this._rotation,n=this._scale;return"scale3d("+n[0]+", "+n[1]+", "+n[2]+") translateZ("+(t-e)+"px) rotateX("+r[0]+"deg) rotateY("+r[1]+"deg) rotateZ("+r[2]+"deg)"},enumerable:!0,configurable:!0}),Object.defineProperty(e,"worldCSS",{get:function(){var t=this._position;return"translate3d("+-t[0]+"px, "+-t[1]+"px, "+-t[2]+"px)"},enumerable:!0,configurable:!0}),e.focus=function(t){var e=u(t),r=this._getFocusMatrix(e),n=d.quat.create(),o=d.vec3.create();d.mat4.getRotation(n,r),d.mat4.getTranslation(o,r);var i=a(n);return d.vec3.negate(i,i),this._rotation=i,this._position=o,this},e.translateLocal=function(t,e,r){void 0===t&&(t=0),void 0===e&&(e=0),void 0===r&&(r=0);var n=this._position,o=this._rotation,i=d.vec3.fromValues(t,e,r),a=d.quat.create();return d.quat.fromEuler(a,-o[0],-o[1],-o[2]),d.vec3.transformQuat(i,i,a),d.vec3.add(n,n,i),this},e.translate=function(t,e,r){return void 0===t&&(t=0),void 0===e&&(e=0),void 0===r&&(r=0),d.vec3.add(this._position,this._position,d.vec3.fromValues(t,e,r)),this},e.rotate=function(t,e,r){return void 0===t&&(t=0),void 0===e&&(e=0),void 0===r&&(r=0),d.vec3.add(this._rotation,this._rotation,d.vec3.fromValues(t,e,r)),this},e.update=function(i,a){return void 0===i&&(i=0),void 0===a&&(a={property:"transform",timingFunction:"ease-out",delay:"0ms"}),function(i,a,c,u){return new(c||(c=Promise))(function(t,e){function r(t){try{o(u.next(t))}catch(t){e(t)}}function n(t){try{o(u.throw(t))}catch(t){e(t)}}function o(e){e.done?t(e.value):new c(function(t){t(e.value)}).then(r,n)}o((u=u.apply(i,a||[])).next())})}(this,void 0,Promise,function(){var e,r,n,o=this;return t(this,function(t){return s(this._viewportEl,{perspective:this.perspective+"px"}),s(this._cameraEl,{transform:this.cameraCSS}),s(this._worldEl,{transform:this.worldCSS}),0<i&&(0<this._updateTimer&&window.clearTimeout(this._updateTimer),e=i+"ms",r=Object.keys(a).reduce(function(t,e){return t["transition"+(e.charAt(0).toUpperCase()+e.slice(1))]=a[e],t},{}),n=c({transitionDuration:e},r),[this._viewportEl,this._cameraEl,this._worldEl].forEach(function(t){s(t,n)})),[2,new Promise(function(t){0<i?o._updateTimer=window.setTimeout(function(){[o._viewportEl,o._cameraEl,o._worldEl].forEach(function(t){s(t,{transition:""})}),o._updateTimer=-1,t()},i):requestAnimationFrame(function(){t()})})]})})},e._getFocusMatrix=function(t){for(var h=[];t&&(h.push(t),t!==this._element);)t=t.parentElement;h.reverse();var e=h.map(function(t){return window.getComputedStyle(t)}),r=function(t,e){for(var r=0;r<t.length;r+=1){var n=t[r];if(n&&e(n))return r}return-1}(e,function(t){return"preserve-3d"!==t.transformStyle});0<r&&e.splice(r+1);var p={left:0,top:0,width:this.viewportEl.offsetWidth,height:this.viewportEl.offsetHeight},v=d.quat.identity(d.quat.create()),m=d.vec3.fromValues(0,0,0);e.forEach(function(t,e){var r=h[e],n={left:r.offsetLeft,top:r.offsetTop,width:r.offsetWidth,height:r.offsetHeight},o=function(t){var e=t.getPropertyValue("transform"),r=/\(((\s|\S)+)\)/.exec(e),n=r?r[1].split(",").map(function(t){return parseFloat(t)}):[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1];if(16===n.length)return d.mat4.fromValues.apply(d.mat4,g(n));var o=d.mat4.create();return d.mat4.identity(o),o[0]=n[0],o[1]=n[1],o[4]=n[2],o[5]=n[3],o[12]=n[4],o[13]=n[5],o}(t),i=function(t,e){var r=t.left+(t.width-e.width)/2,n=t.top+(t.height-e.height)/2;return d.vec3.fromValues(r,n,0)}(n,p);d.vec3.transformQuat(i,i,v),d.vec3.add(m,m,i);var a=function(t,e){var r=t.transformOrigin.split(" ").map(function(t){return parseFloat(t.substring(0,t.length-2))}),n=r[0]-e.width/2,o=r[1]-e.height/2;return d.vec3.fromValues(n,o,0)}(t,n);d.vec3.transformQuat(a,a,v);var c=d.vec3.clone(m);d.vec3.add(c,c,a);var u=d.vec3.create();d.vec3.sub(u,m,c);var s=d.quat.invert(d.quat.create(),v);d.vec3.transformQuat(u,u,s),d.vec3.transformMat4(u,u,o),d.vec3.transformQuat(u,u,v);var f=d.vec3.add(d.vec3.create(),c,u),l=d.mat4.getRotation(d.quat.create(),o);d.vec3.copy(m,f),d.quat.mul(v,v,l),p=n});var n=d.vec3.fromValues(0,0,this.perspective);d.vec3.transformQuat(n,n,v),d.vec3.add(m,m,n);var o=d.mat4.create();return d.mat4.fromRotationTranslation(o,v,m),o},n});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("gl-matrix")):"function"==typeof define&&define.amd?define(["gl-matrix"],e):(t=t||self).CSSCamera=e(t["gl-matrix"])}(this,function(d){"use strict";var u=function(){return(u=Object.assign||function(t){for(var e,r=1,n=arguments.length;r<n;r++)for(var o in e=arguments[r])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t}).apply(this,arguments)};function t(r,n){var o,i,a,t,c={label:0,sent:function(){if(1&a[0])throw a[1];return a[1]},trys:[],ops:[]};return t={next:e(0),throw:e(1),return:e(2)},"function"==typeof Symbol&&(t[Symbol.iterator]=function(){return this}),t;function e(e){return function(t){return function(e){if(o)throw new TypeError("Generator is already executing.");for(;c;)try{if(o=1,i&&(a=2&e[0]?i.return:e[0]?i.throw||((a=i.return)&&a.call(i),0):i.next)&&!(a=a.call(i,e[1])).done)return a;switch(i=0,a&&(e=[2&e[0],a.value]),e[0]){case 0:case 1:a=e;break;case 4:return c.label++,{value:e[1],done:!1};case 5:c.label++,i=e[1],e=[0];continue;case 7:e=c.ops.pop(),c.trys.pop();continue;default:if(!(a=0<(a=c.trys).length&&a[a.length-1])&&(6===e[0]||2===e[0])){c=0;continue}if(3===e[0]&&(!a||e[1]>a[0]&&e[1]<a[3])){c.label=e[1];break}if(6===e[0]&&c.label<a[1]){c.label=a[1],a=e;break}if(a&&c.label<a[2]){c.label=a[2],c.ops.push(e);break}a[2]&&c.ops.pop(),c.trys.pop();continue}e=n.call(r,c)}catch(t){e=[6,t],i=0}finally{o=a=0}if(5&e[0])throw e[1];return{value:e[0]?e[1]:void 0,done:!0}}([e,t])}}}function r(t,e){var r="function"==typeof Symbol&&t[Symbol.iterator];if(!r)return t;var n,o,i=r.call(t),a=[];try{for(;(void 0===e||0<e--)&&!(n=i.next()).done;)a.push(n.value)}catch(t){o={error:t}}finally{try{n&&!n.done&&(r=i.return)&&r.call(i)}finally{if(o)throw o.error}}return a}function g(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(r(arguments[e]));return t}function c(t,e){if("string"==typeof t){var r=e?e.querySelector(t):document.querySelector(t);if(!r)throw new Error(function(t){return'Element with selector "'+t+"\" doesn't exist."}(t));return r}if(t.nodeName&&1===t.nodeType)return t;throw new Error(function(t){return"Element should be provided in string or HTMLElement. Received: "+t}(t))}function s(e,r){Object.keys(r).forEach(function(t){e.style[t]=r[t]})}function f(n){for(var t=[],e=1;e<arguments.length;e++)t[e-1]=arguments[e];return t.forEach(function(r){Object.keys(r).forEach(function(t){var e=r[t];n[t]=e})}),n}function a(t){var e=d.mat4.create();d.mat4.fromQuat(e,t);var r=e[0],n=e[4],o=e[1],i=e[5],a=e[2],c=e[6],u=e[10],s=d.vec3.create();return s[1]=Math.asin(-function(t,e,r){return Math.max(Math.min(t,r),e)}(a,-1,1)),Math.abs(a)<.99999?(s[0]=Math.atan2(c,u),s[2]=Math.atan2(o,r)):(s[0]=0,s[2]=Math.atan2(-n,i)),s.map(function(t){return function(t){return 180*t/Math.PI}(t)})}var e,l={width:"100%",height:"100%","transform-style":"preserve-3d",overflow:"hidden"},h={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},p={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},v="cc-viewport",m="cc-camera",b="cc-world",y={position:[0,0,0],scale:[1,1,1],rotation:[0,0,0],perspective:0,rotateOffset:0},_={property:"transform",timingFunction:"ease-out",delay:"0ms"};function n(t,e){void 0===e&&(e={position:[0,0,0],scale:[1,1,1],rotation:[0,0,0],perspective:0,rotateOffset:0}),this._element=c(t);var r=f(f({},y),e);this._position=d.vec3.fromValues(r.position[0],r.position[1],r.position[2]),this._scale=d.vec3.fromValues(r.scale[0],r.scale[1],r.scale[2]),this._rotation=d.vec3.fromValues(r.rotation[0],r.rotation[1],r.rotation[2]),this._perspective=r.perspective,this._rotateOffset=r.rotateOffset,this._updateTimer=-1;var n=this._element,o=document.createElement("div"),i=o.cloneNode(),a=o.cloneNode();o.className=v,i.className=m,a.className=b,s(o,l),s(i,h),s(a,p),i.appendChild(a),o.appendChild(i),this._viewportEl=o,this._cameraEl=i,this._worldEl=a,n.parentElement.insertBefore(o,n),a.appendChild(n)}return e=n.prototype,Object.defineProperty(n,"VERSION",{get:function(){return"1.0.0-rc"},enumerable:!0,configurable:!0}),Object.defineProperty(e,"element",{get:function(){return this._element},enumerable:!0,configurable:!0}),Object.defineProperty(e,"viewportEl",{get:function(){return this._viewportEl},enumerable:!0,configurable:!0}),Object.defineProperty(e,"cameraEl",{get:function(){return this._cameraEl},enumerable:!0,configurable:!0}),Object.defineProperty(e,"worldEl",{get:function(){return this._worldEl},enumerable:!0,configurable:!0}),Object.defineProperty(e,"position",{get:function(){return g(this._position)},set:function(t){this._position=d.vec3.fromValues(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(e,"scale",{get:function(){return g(this._scale)},set:function(t){this._scale=d.vec3.fromValues(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(e,"rotation",{get:function(){return g(this._rotation)},set:function(t){this._rotation=d.vec3.fromValues(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(e,"quaternion",{get:function(){var t=this._rotation;return g(d.quat.fromEuler(d.quat.create(),t[0],t[1],t[2]))},set:function(t){this._rotation=a(d.quat.fromValues(t[0],t[1],t[2],t[3]))},enumerable:!0,configurable:!0}),Object.defineProperty(e,"perspective",{get:function(){return this._perspective},set:function(t){this._perspective=t},enumerable:!0,configurable:!0}),Object.defineProperty(e,"rotateOffset",{get:function(){return this._rotateOffset},set:function(t){this._rotateOffset=t},enumerable:!0,configurable:!0}),Object.defineProperty(e,"cameraCSS",{get:function(){var t=this._perspective,e=this._rotateOffset,r=this._rotation,n=this._scale;return"scale3d("+n[0]+", "+n[1]+", "+n[2]+") translateZ("+(t-e)+"px) rotateX("+r[0]+"deg) rotateY("+r[1]+"deg) rotateZ("+r[2]+"deg)"},enumerable:!0,configurable:!0}),Object.defineProperty(e,"worldCSS",{get:function(){var t=this._position;return"translate3d("+-t[0]+"px, "+-t[1]+"px, "+-t[2]+"px)"},enumerable:!0,configurable:!0}),e.focus=function(t){var e=c(t),r=this._getFocusMatrix(e),n=d.quat.create(),o=d.vec3.create();d.mat4.getRotation(n,r),d.mat4.getTranslation(o,r);var i=a(n);return d.vec3.negate(i,i),this._rotation=i,this._position=o,this},e.translateLocal=function(t,e,r){void 0===t&&(t=0),void 0===e&&(e=0),void 0===r&&(r=0);var n=this._position,o=this._rotation,i=d.vec3.fromValues(t,e,r),a=d.quat.create();return d.quat.fromEuler(a,-o[0],-o[1],-o[2]),d.vec3.transformQuat(i,i,a),d.vec3.add(n,n,i),this},e.translate=function(t,e,r){return void 0===t&&(t=0),void 0===e&&(e=0),void 0===r&&(r=0),d.vec3.add(this._position,this._position,d.vec3.fromValues(t,e,r)),this},e.rotate=function(t,e,r){return void 0===t&&(t=0),void 0===e&&(e=0),void 0===r&&(r=0),d.vec3.add(this._rotation,this._rotation,d.vec3.fromValues(t,e,r)),this},e.update=function(a,c){return void 0===a&&(a=0),void 0===c&&(c={property:"transform",timingFunction:"ease-out",delay:"0ms"}),function(i,a,c,u){return new(c||(c=Promise))(function(t,e){function r(t){try{o(u.next(t))}catch(t){e(t)}}function n(t){try{o(u.throw(t))}catch(t){e(t)}}function o(e){e.done?t(e.value):new c(function(t){t(e.value)}).then(r,n)}o((u=u.apply(i,a||[])).next())})}(this,void 0,Promise,function(){var r,e,n,o,i=this;return t(this,function(t){return s(this._viewportEl,{perspective:this.perspective+"px"}),s(this._cameraEl,{transform:this.cameraCSS}),s(this._worldEl,{transform:this.worldCSS}),r=f(f({},_),c),0<a&&(0<this._updateTimer&&window.clearTimeout(this._updateTimer),e=a+"ms",n=Object.keys(r).reduce(function(t,e){return t["transition"+(e.charAt(0).toUpperCase()+e.slice(1))]=r[e],t},{}),o=u({transitionDuration:e},n),[this._viewportEl,this._cameraEl,this._worldEl].forEach(function(t){s(t,o)})),[2,new Promise(function(t){0<a?i._updateTimer=window.setTimeout(function(){[i._viewportEl,i._cameraEl,i._worldEl].forEach(function(t){s(t,{transition:""})}),i._updateTimer=-1,t()},a):requestAnimationFrame(function(){t()})})]})})},e._getFocusMatrix=function(t){for(var h=[];t&&(h.push(t),t!==this._element);)t=t.parentElement;h.reverse();var e=h.map(function(t){return window.getComputedStyle(t)}),r=function(t,e){for(var r=0;r<t.length;r+=1){var n=t[r];if(n&&e(n))return r}return-1}(e,function(t){return"preserve-3d"!==t.transformStyle});0<r&&e.splice(r+1);var p={left:0,top:0,width:this.viewportEl.offsetWidth,height:this.viewportEl.offsetHeight},v=d.quat.identity(d.quat.create()),m=d.vec3.fromValues(0,0,0);e.forEach(function(t,e){var r=h[e],n={left:r.offsetLeft,top:r.offsetTop,width:r.offsetWidth,height:r.offsetHeight},o=function(t){var e=t.getPropertyValue("transform"),r=/\(((\s|\S)+)\)/.exec(e),n=r?r[1].split(",").map(function(t){return parseFloat(t)}):[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1];if(16===n.length)return d.mat4.fromValues.apply(d.mat4,g(n));var o=d.mat4.create();return d.mat4.identity(o),o[0]=n[0],o[1]=n[1],o[4]=n[2],o[5]=n[3],o[12]=n[4],o[13]=n[5],o}(t),i=function(t,e){var r=t.left+(t.width-e.width)/2,n=t.top+(t.height-e.height)/2;return d.vec3.fromValues(r,n,0)}(n,p);d.vec3.transformQuat(i,i,v),d.vec3.add(m,m,i);var a=function(t,e){var r=t.transformOrigin.split(" ").map(function(t){return parseFloat(t.substring(0,t.length-2))}),n=r[0]-e.width/2,o=r[1]-e.height/2;return d.vec3.fromValues(n,o,0)}(t,n);d.vec3.transformQuat(a,a,v);var c=d.vec3.clone(m);d.vec3.add(c,c,a);var u=d.vec3.create();d.vec3.sub(u,m,c);var s=d.quat.invert(d.quat.create(),v);d.vec3.transformQuat(u,u,s),d.vec3.transformMat4(u,u,o),d.vec3.transformQuat(u,u,v);var f=d.vec3.add(d.vec3.create(),c,u),l=d.mat4.getRotation(d.quat.create(),o);d.vec3.copy(m,f),d.quat.mul(v,v,l),p=n});var n=d.vec3.fromValues(0,0,this.perspective);d.vec3.transformQuat(n,n,v),d.vec3.add(m,m,n);var o=d.mat4.create();return d.mat4.fromRotationTranslation(o,v,m),o},n});
 //# sourceMappingURL=css-camera.min.js.map

lib/css-camera.pkgd.min.js

@@ -9,3 +9,3 @@ /*
 */
-!function(t,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):(t=t||self).CSSCamera=r()}(this,function(){"use strict";var u=function(){return(u=Object.assign||function(t){for(var r,n=1,e=arguments.length;n<e;n++)for(var a in r=arguments[n])Object.prototype.hasOwnProperty.call(r,a)&&(t[a]=r[a]);return t}).apply(this,arguments)};function t(n,e){var a,o,i,t,u={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return t={next:r(0),throw:r(1),return:r(2)},"function"==typeof Symbol&&(t[Symbol.iterator]=function(){return this}),t;function r(r){return function(t){return function(r){if(a)throw new TypeError("Generator is already executing.");for(;u;)try{if(a=1,o&&(i=2&r[0]?o.return:r[0]?o.throw||((i=o.return)&&i.call(o),0):o.next)&&!(i=i.call(o,r[1])).done)return i;switch(o=0,i&&(r=[2&r[0],i.value]),r[0]){case 0:case 1:i=r;break;case 4:return u.label++,{value:r[1],done:!1};case 5:u.label++,o=r[1],r=[0];continue;case 7:r=u.ops.pop(),u.trys.pop();continue;default:if(!(i=0<(i=u.trys).length&&i[i.length-1])&&(6===r[0]||2===r[0])){u=0;continue}if(3===r[0]&&(!i||r[1]>i[0]&&r[1]<i[3])){u.label=r[1];break}if(6===r[0]&&u.label<i[1]){u.label=i[1],i=r;break}if(i&&u.label<i[2]){u.label=i[2],u.ops.push(r);break}i[2]&&u.ops.pop(),u.trys.pop();continue}r=e.call(n,u)}catch(t){r=[6,t],o=0}finally{a=i=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,t])}}}function n(t,r){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var e,a,o=n.call(t),i=[];try{for(;(void 0===r||0<r--)&&!(e=o.next()).done;)i.push(e.value)}catch(t){a={error:t}}finally{try{e&&!e.done&&(n=o.return)&&n.call(o)}finally{if(a)throw a.error}}return i}function v(){for(var t=[],r=0;r<arguments.length;r++)t=t.concat(n(arguments[r]));return t}var R=1e-6,d="undefined"!=typeof Float32Array?Float32Array:Array;Math.random,Math.PI;function b(){var t=new d(16);return d!=Float32Array&&(t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[11]=0,t[12]=0,t[13]=0,t[14]=0),t[0]=1,t[5]=1,t[10]=1,t[15]=1,t}function m(t,r,n,e,a,o,i,u,s,c,h,f,l,p,M,v){var b=new d(16);return b[0]=t,b[1]=r,b[2]=n,b[3]=e,b[4]=a,b[5]=o,b[6]=i,b[7]=u,b[8]=s,b[9]=c,b[10]=h,b[11]=f,b[12]=l,b[13]=p,b[14]=M,b[15]=v,b}function E(t){return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t}function r(t,r,n){var e=r[0],a=r[1],o=r[2],i=r[3],u=r[4],s=r[5],c=r[6],h=r[7],f=r[8],l=r[9],p=r[10],M=r[11],v=r[12],b=r[13],d=r[14],m=r[15],w=n[0],y=n[1],g=n[2],_=n[3];return t[0]=w*e+y*u+g*f+_*v,t[1]=w*a+y*s+g*l+_*b,t[2]=w*o+y*c+g*p+_*d,t[3]=w*i+y*h+g*M+_*m,w=n[4],y=n[5],g=n[6],_=n[7],t[4]=w*e+y*u+g*f+_*v,t[5]=w*a+y*s+g*l+_*b,t[6]=w*o+y*c+g*p+_*d,t[7]=w*i+y*h+g*M+_*m,w=n[8],y=n[9],g=n[10],_=n[11],t[8]=w*e+y*u+g*f+_*v,t[9]=w*a+y*s+g*l+_*b,t[10]=w*o+y*c+g*p+_*d,t[11]=w*i+y*h+g*M+_*m,w=n[12],y=n[13],g=n[14],_=n[15],t[12]=w*e+y*u+g*f+_*v,t[13]=w*a+y*s+g*l+_*b,t[14]=w*o+y*c+g*p+_*d,t[15]=w*i+y*h+g*M+_*m,t}function w(t,r,n){var e=r[0],a=r[1],o=r[2],i=r[3],u=e+e,s=a+a,c=o+o,h=e*u,f=e*s,l=e*c,p=a*s,M=a*c,v=o*c,b=i*u,d=i*s,m=i*c;return t[0]=1-(p+v),t[1]=f+m,t[2]=l-d,t[3]=0,t[4]=f-m,t[5]=1-(h+v),t[6]=M+b,t[7]=0,t[8]=l+d,t[9]=M-b,t[10]=1-(h+p),t[11]=0,t[12]=n[0],t[13]=n[1],t[14]=n[2],t[15]=1,t}function i(t,r){return t[0]=r[12],t[1]=r[13],t[2]=r[14],t}function y(t,r){var n=r[0]+r[5]+r[10],e=0;return 0<n?(e=2*Math.sqrt(n+1),t[3]=.25*e,t[0]=(r[6]-r[9])/e,t[1]=(r[8]-r[2])/e,t[2]=(r[1]-r[4])/e):r[0]>r[5]&&r[0]>r[10]?(e=2*Math.sqrt(1+r[0]-r[5]-r[10]),t[3]=(r[6]-r[9])/e,t[0]=.25*e,t[1]=(r[1]+r[4])/e,t[2]=(r[8]+r[2])/e):r[5]>r[10]?(e=2*Math.sqrt(1+r[5]-r[0]-r[10]),t[3]=(r[8]-r[2])/e,t[0]=(r[1]+r[4])/e,t[1]=.25*e,t[2]=(r[6]+r[9])/e):(e=2*Math.sqrt(1+r[10]-r[0]-r[5]),t[3]=(r[1]-r[4])/e,t[0]=(r[8]+r[2])/e,t[1]=(r[6]+r[9])/e,t[2]=.25*e),t}function h(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=n+n,u=e+e,s=a+a,c=n*i,h=e*i,f=e*u,l=a*i,p=a*u,M=a*s,v=o*i,b=o*u,d=o*s;return t[0]=1-f-M,t[1]=h+d,t[2]=l-b,t[3]=0,t[4]=h-d,t[5]=1-c-M,t[6]=p+v,t[7]=0,t[8]=l+b,t[9]=p-v,t[10]=1-c-f,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t}function e(t,r,n){return t[0]=r[0]-n[0],t[1]=r[1]-n[1],t[2]=r[2]-n[2],t[3]=r[3]-n[3],t[4]=r[4]-n[4],t[5]=r[5]-n[5],t[6]=r[6]-n[6],t[7]=r[7]-n[7],t[8]=r[8]-n[8],t[9]=r[9]-n[9],t[10]=r[10]-n[10],t[11]=r[11]-n[11],t[12]=r[12]-n[12],t[13]=r[13]-n[13],t[14]=r[14]-n[14],t[15]=r[15]-n[15],t}var g={create:b,clone:function(t){var r=new d(16);return r[0]=t[0],r[1]=t[1],r[2]=t[2],r[3]=t[3],r[4]=t[4],r[5]=t[5],r[6]=t[6],r[7]=t[7],r[8]=t[8],r[9]=t[9],r[10]=t[10],r[11]=t[11],r[12]=t[12],r[13]=t[13],r[14]=t[14],r[15]=t[15],r},copy:function(t,r){return t[0]=r[0],t[1]=r[1],t[2]=r[2],t[3]=r[3],t[4]=r[4],t[5]=r[5],t[6]=r[6],t[7]=r[7],t[8]=r[8],t[9]=r[9],t[10]=r[10],t[11]=r[11],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15],t},fromValues:m,set:function(t,r,n,e,a,o,i,u,s,c,h,f,l,p,M,v,b){return t[0]=r,t[1]=n,t[2]=e,t[3]=a,t[4]=o,t[5]=i,t[6]=u,t[7]=s,t[8]=c,t[9]=h,t[10]=f,t[11]=l,t[12]=p,t[13]=M,t[14]=v,t[15]=b,t},identity:E,transpose:function(t,r){if(t===r){var n=r[1],e=r[2],a=r[3],o=r[6],i=r[7],u=r[11];t[1]=r[4],t[2]=r[8],t[3]=r[12],t[4]=n,t[6]=r[9],t[7]=r[13],t[8]=e,t[9]=o,t[11]=r[14],t[12]=a,t[13]=i,t[14]=u}else t[0]=r[0],t[1]=r[4],t[2]=r[8],t[3]=r[12],t[4]=r[1],t[5]=r[5],t[6]=r[9],t[7]=r[13],t[8]=r[2],t[9]=r[6],t[10]=r[10],t[11]=r[14],t[12]=r[3],t[13]=r[7],t[14]=r[11],t[15]=r[15];return t},invert:function(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=r[4],u=r[5],s=r[6],c=r[7],h=r[8],f=r[9],l=r[10],p=r[11],M=r[12],v=r[13],b=r[14],d=r[15],m=n*u-e*i,w=n*s-a*i,y=n*c-o*i,g=e*s-a*u,_=e*c-o*u,E=a*c-o*s,x=h*v-f*M,O=h*b-l*M,S=h*d-p*M,q=f*b-l*v,P=f*d-p*v,j=l*d-p*b,T=m*j-w*P+y*q+g*S-_*O+E*x;return T?(T=1/T,t[0]=(u*j-s*P+c*q)*T,t[1]=(a*P-e*j-o*q)*T,t[2]=(v*E-b*_+d*g)*T,t[3]=(l*_-f*E-p*g)*T,t[4]=(s*S-i*j-c*O)*T,t[5]=(n*j-a*S+o*O)*T,t[6]=(b*y-M*E-d*w)*T,t[7]=(h*E-l*y+p*w)*T,t[8]=(i*P-u*S+c*x)*T,t[9]=(e*S-n*P-o*x)*T,t[10]=(M*_-v*y+d*m)*T,t[11]=(f*y-h*_-p*m)*T,t[12]=(u*O-i*q-s*x)*T,t[13]=(n*q-e*O+a*x)*T,t[14]=(v*w-M*g-b*m)*T,t[15]=(h*g-f*w+l*m)*T,t):null},adjoint:function(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=r[4],u=r[5],s=r[6],c=r[7],h=r[8],f=r[9],l=r[10],p=r[11],M=r[12],v=r[13],b=r[14],d=r[15];return t[0]=u*(l*d-p*b)-f*(s*d-c*b)+v*(s*p-c*l),t[1]=-(e*(l*d-p*b)-f*(a*d-o*b)+v*(a*p-o*l)),t[2]=e*(s*d-c*b)-u*(a*d-o*b)+v*(a*c-o*s),t[3]=-(e*(s*p-c*l)-u*(a*p-o*l)+f*(a*c-o*s)),t[4]=-(i*(l*d-p*b)-h*(s*d-c*b)+M*(s*p-c*l)),t[5]=n*(l*d-p*b)-h*(a*d-o*b)+M*(a*p-o*l),t[6]=-(n*(s*d-c*b)-i*(a*d-o*b)+M*(a*c-o*s)),t[7]=n*(s*p-c*l)-i*(a*p-o*l)+h*(a*c-o*s),t[8]=i*(f*d-p*v)-h*(u*d-c*v)+M*(u*p-c*f),t[9]=-(n*(f*d-p*v)-h*(e*d-o*v)+M*(e*p-o*f)),t[10]=n*(u*d-c*v)-i*(e*d-o*v)+M*(e*c-o*u),t[11]=-(n*(u*p-c*f)-i*(e*p-o*f)+h*(e*c-o*u)),t[12]=-(i*(f*b-l*v)-h*(u*b-s*v)+M*(u*l-s*f)),t[13]=n*(f*b-l*v)-h*(e*b-a*v)+M*(e*l-a*f),t[14]=-(n*(u*b-s*v)-i*(e*b-a*v)+M*(e*s-a*u)),t[15]=n*(u*l-s*f)-i*(e*l-a*f)+h*(e*s-a*u),t},determinant:function(t){var r=t[0],n=t[1],e=t[2],a=t[3],o=t[4],i=t[5],u=t[6],s=t[7],c=t[8],h=t[9],f=t[10],l=t[11],p=t[12],M=t[13],v=t[14],b=t[15];return(r*i-n*o)*(f*b-l*v)-(r*u-e*o)*(h*b-l*M)+(r*s-a*o)*(h*v-f*M)+(n*u-e*i)*(c*b-l*p)-(n*s-a*i)*(c*v-f*p)+(e*s-a*u)*(c*M-h*p)},multiply:r,translate:function(t,r,n){var e,a,o,i,u,s,c,h,f,l,p,M,v=n[0],b=n[1],d=n[2];return r===t?(t[12]=r[0]*v+r[4]*b+r[8]*d+r[12],t[13]=r[1]*v+r[5]*b+r[9]*d+r[13],t[14]=r[2]*v+r[6]*b+r[10]*d+r[14],t[15]=r[3]*v+r[7]*b+r[11]*d+r[15]):(e=r[0],a=r[1],o=r[2],i=r[3],u=r[4],s=r[5],c=r[6],h=r[7],f=r[8],l=r[9],p=r[10],M=r[11],t[0]=e,t[1]=a,t[2]=o,t[3]=i,t[4]=u,t[5]=s,t[6]=c,t[7]=h,t[8]=f,t[9]=l,t[10]=p,t[11]=M,t[12]=e*v+u*b+f*d+r[12],t[13]=a*v+s*b+l*d+r[13],t[14]=o*v+c*b+p*d+r[14],t[15]=i*v+h*b+M*d+r[15]),t},scale:function(t,r,n){var e=n[0],a=n[1],o=n[2];return t[0]=r[0]*e,t[1]=r[1]*e,t[2]=r[2]*e,t[3]=r[3]*e,t[4]=r[4]*a,t[5]=r[5]*a,t[6]=r[6]*a,t[7]=r[7]*a,t[8]=r[8]*o,t[9]=r[9]*o,t[10]=r[10]*o,t[11]=r[11]*o,t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15],t},rotate:function(t,r,n,e){var a,o,i,u,s,c,h,f,l,p,M,v,b,d,m,w,y,g,_,E,x,O,S,q,P=e[0],j=e[1],T=e[2],F=Math.sqrt(P*P+j*j+T*T);return F<R?null:(P*=F=1/F,j*=F,T*=F,a=Math.sin(n),i=1-(o=Math.cos(n)),u=r[0],s=r[1],c=r[2],h=r[3],f=r[4],l=r[5],p=r[6],M=r[7],v=r[8],b=r[9],d=r[10],m=r[11],w=P*P*i+o,y=j*P*i+T*a,g=T*P*i-j*a,_=P*j*i-T*a,E=j*j*i+o,x=T*j*i+P*a,O=P*T*i+j*a,S=j*T*i-P*a,q=T*T*i+o,t[0]=u*w+f*y+v*g,t[1]=s*w+l*y+b*g,t[2]=c*w+p*y+d*g,t[3]=h*w+M*y+m*g,t[4]=u*_+f*E+v*x,t[5]=s*_+l*E+b*x,t[6]=c*_+p*E+d*x,t[7]=h*_+M*E+m*x,t[8]=u*O+f*S+v*q,t[9]=s*O+l*S+b*q,t[10]=c*O+p*S+d*q,t[11]=h*O+M*S+m*q,r!==t&&(t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t)},rotateX:function(t,r,n){var e=Math.sin(n),a=Math.cos(n),o=r[4],i=r[5],u=r[6],s=r[7],c=r[8],h=r[9],f=r[10],l=r[11];return r!==t&&(t[0]=r[0],t[1]=r[1],t[2]=r[2],t[3]=r[3],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t[4]=o*a+c*e,t[5]=i*a+h*e,t[6]=u*a+f*e,t[7]=s*a+l*e,t[8]=c*a-o*e,t[9]=h*a-i*e,t[10]=f*a-u*e,t[11]=l*a-s*e,t},rotateY:function(t,r,n){var e=Math.sin(n),a=Math.cos(n),o=r[0],i=r[1],u=r[2],s=r[3],c=r[8],h=r[9],f=r[10],l=r[11];return r!==t&&(t[4]=r[4],t[5]=r[5],t[6]=r[6],t[7]=r[7],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t[0]=o*a-c*e,t[1]=i*a-h*e,t[2]=u*a-f*e,t[3]=s*a-l*e,t[8]=o*e+c*a,t[9]=i*e+h*a,t[10]=u*e+f*a,t[11]=s*e+l*a,t},rotateZ:function(t,r,n){var e=Math.sin(n),a=Math.cos(n),o=r[0],i=r[1],u=r[2],s=r[3],c=r[4],h=r[5],f=r[6],l=r[7];return r!==t&&(t[8]=r[8],t[9]=r[9],t[10]=r[10],t[11]=r[11],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t[0]=o*a+c*e,t[1]=i*a+h*e,t[2]=u*a+f*e,t[3]=s*a+l*e,t[4]=c*a-o*e,t[5]=h*a-i*e,t[6]=f*a-u*e,t[7]=l*a-s*e,t},fromTranslation:function(t,r){return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=r[0],t[13]=r[1],t[14]=r[2],t[15]=1,t},fromScaling:function(t,r){return t[0]=r[0],t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=r[1],t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=r[2],t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromRotation:function(t,r,n){var e,a,o,i=n[0],u=n[1],s=n[2],c=Math.sqrt(i*i+u*u+s*s);return c<R?null:(i*=c=1/c,u*=c,s*=c,e=Math.sin(r),o=1-(a=Math.cos(r)),t[0]=i*i*o+a,t[1]=u*i*o+s*e,t[2]=s*i*o-u*e,t[3]=0,t[4]=i*u*o-s*e,t[5]=u*u*o+a,t[6]=s*u*o+i*e,t[7]=0,t[8]=i*s*o+u*e,t[9]=u*s*o-i*e,t[10]=s*s*o+a,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t)},fromXRotation:function(t,r){var n=Math.sin(r),e=Math.cos(r);return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=e,t[6]=n,t[7]=0,t[8]=0,t[9]=-n,t[10]=e,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromYRotation:function(t,r){var n=Math.sin(r),e=Math.cos(r);return t[0]=e,t[1]=0,t[2]=-n,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=n,t[9]=0,t[10]=e,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromZRotation:function(t,r){var n=Math.sin(r),e=Math.cos(r);return t[0]=e,t[1]=n,t[2]=0,t[3]=0,t[4]=-n,t[5]=e,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromRotationTranslation:w,fromQuat2:function(t,r){var n=new d(3),e=-r[0],a=-r[1],o=-r[2],i=r[3],u=r[4],s=r[5],c=r[6],h=r[7],f=e*e+a*a+o*o+i*i;return 0<f?(n[0]=2*(u*i+h*e+s*o-c*a)/f,n[1]=2*(s*i+h*a+c*e-u*o)/f,n[2]=2*(c*i+h*o+u*a-s*e)/f):(n[0]=2*(u*i+h*e+s*o-c*a),n[1]=2*(s*i+h*a+c*e-u*o),n[2]=2*(c*i+h*o+u*a-s*e)),w(t,r,n),t},getTranslation:i,getScaling:function(t,r){var n=r[0],e=r[1],a=r[2],o=r[4],i=r[5],u=r[6],s=r[8],c=r[9],h=r[10];return t[0]=Math.sqrt(n*n+e*e+a*a),t[1]=Math.sqrt(o*o+i*i+u*u),t[2]=Math.sqrt(s*s+c*c+h*h),t},getRotation:y,fromRotationTranslationScale:function(t,r,n,e){var a=r[0],o=r[1],i=r[2],u=r[3],s=a+a,c=o+o,h=i+i,f=a*s,l=a*c,p=a*h,M=o*c,v=o*h,b=i*h,d=u*s,m=u*c,w=u*h,y=e[0],g=e[1],_=e[2];return t[0]=(1-(M+b))*y,t[1]=(l+w)*y,t[2]=(p-m)*y,t[3]=0,t[4]=(l-w)*g,t[5]=(1-(f+b))*g,t[6]=(v+d)*g,t[7]=0,t[8]=(p+m)*_,t[9]=(v-d)*_,t[10]=(1-(f+M))*_,t[11]=0,t[12]=n[0],t[13]=n[1],t[14]=n[2],t[15]=1,t},fromRotationTranslationScaleOrigin:function(t,r,n,e,a){var o=r[0],i=r[1],u=r[2],s=r[3],c=o+o,h=i+i,f=u+u,l=o*c,p=o*h,M=o*f,v=i*h,b=i*f,d=u*f,m=s*c,w=s*h,y=s*f,g=e[0],_=e[1],E=e[2],x=a[0],O=a[1],S=a[2],q=(1-(v+d))*g,P=(p+y)*g,j=(M-w)*g,T=(p-y)*_,F=(1-(l+d))*_,A=(b+m)*_,C=(M+w)*E,R=(b-m)*E,k=(1-(l+v))*E;return t[0]=q,t[1]=P,t[2]=j,t[3]=0,t[4]=T,t[5]=F,t[6]=A,t[7]=0,t[8]=C,t[9]=R,t[10]=k,t[11]=0,t[12]=n[0]+x-(q*x+T*O+C*S),t[13]=n[1]+O-(P*x+F*O+R*S),t[14]=n[2]+S-(j*x+A*O+k*S),t[15]=1,t},fromQuat:h,frustum:function(t,r,n,e,a,o,i){var u=1/(n-r),s=1/(a-e),c=1/(o-i);return t[0]=2*o*u,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=2*o*s,t[6]=0,t[7]=0,t[8]=(n+r)*u,t[9]=(a+e)*s,t[10]=(i+o)*c,t[11]=-1,t[12]=0,t[13]=0,t[14]=i*o*2*c,t[15]=0,t},perspective:function(t,r,n,e,a){var o,i=1/Math.tan(r/2);return t[0]=i/n,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=i,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[11]=-1,t[12]=0,t[13]=0,t[15]=0,null!=a&&a!==1/0?(o=1/(e-a),t[10]=(a+e)*o,t[14]=2*a*e*o):(t[10]=-1,t[14]=-2*e),t},perspectiveFromFieldOfView:function(t,r,n,e){var a=Math.tan(r.upDegrees*Math.PI/180),o=Math.tan(r.downDegrees*Math.PI/180),i=Math.tan(r.leftDegrees*Math.PI/180),u=Math.tan(r.rightDegrees*Math.PI/180),s=2/(i+u),c=2/(a+o);return t[0]=s,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=c,t[6]=0,t[7]=0,t[8]=-(i-u)*s*.5,t[9]=(a-o)*c*.5,t[10]=e/(n-e),t[11]=-1,t[12]=0,t[13]=0,t[14]=e*n/(n-e),t[15]=0,t},ortho:function(t,r,n,e,a,o,i){var u=1/(r-n),s=1/(e-a),c=1/(o-i);return t[0]=-2*u,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=-2*s,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=2*c,t[11]=0,t[12]=(r+n)*u,t[13]=(a+e)*s,t[14]=(i+o)*c,t[15]=1,t},lookAt:function(t,r,n,e){var a,o,i,u,s,c,h,f,l,p,M=r[0],v=r[1],b=r[2],d=e[0],m=e[1],w=e[2],y=n[0],g=n[1],_=n[2];return Math.abs(M-y)<R&&Math.abs(v-g)<R&&Math.abs(b-_)<R?E(t):(h=M-y,f=v-g,l=b-_,a=m*(l*=p=1/Math.sqrt(h*h+f*f+l*l))-w*(f*=p),o=w*(h*=p)-d*l,i=d*f-m*h,(p=Math.sqrt(a*a+o*o+i*i))?(a*=p=1/p,o*=p,i*=p):i=o=a=0,u=f*i-l*o,s=l*a-h*i,c=h*o-f*a,(p=Math.sqrt(u*u+s*s+c*c))?(u*=p=1/p,s*=p,c*=p):c=s=u=0,t[0]=a,t[1]=u,t[2]=h,t[3]=0,t[4]=o,t[5]=s,t[6]=f,t[7]=0,t[8]=i,t[9]=c,t[10]=l,t[11]=0,t[12]=-(a*M+o*v+i*b),t[13]=-(u*M+s*v+c*b),t[14]=-(h*M+f*v+l*b),t[15]=1,t)},targetTo:function(t,r,n,e){var a=r[0],o=r[1],i=r[2],u=e[0],s=e[1],c=e[2],h=a-n[0],f=o-n[1],l=i-n[2],p=h*h+f*f+l*l;0<p&&(h*=p=1/Math.sqrt(p),f*=p,l*=p);var M=s*l-c*f,v=c*h-u*l,b=u*f-s*h;return 0<(p=M*M+v*v+b*b)&&(M*=p=1/Math.sqrt(p),v*=p,b*=p),t[0]=M,t[1]=v,t[2]=b,t[3]=0,t[4]=f*b-l*v,t[5]=l*M-h*b,t[6]=h*v-f*M,t[7]=0,t[8]=h,t[9]=f,t[10]=l,t[11]=0,t[12]=a,t[13]=o,t[14]=i,t[15]=1,t},str:function(t){return"mat4("+t[0]+", "+t[1]+", "+t[2]+", "+t[3]+", "+t[4]+", "+t[5]+", "+t[6]+", "+t[7]+", "+t[8]+", "+t[9]+", "+t[10]+", "+t[11]+", "+t[12]+", "+t[13]+", "+t[14]+", "+t[15]+")"},frob:function(t){return Math.sqrt(Math.pow(t[0],2)+Math.pow(t[1],2)+Math.pow(t[2],2)+Math.pow(t[3],2)+Math.pow(t[4],2)+Math.pow(t[5],2)+Math.pow(t[6],2)+Math.pow(t[7],2)+Math.pow(t[8],2)+Math.pow(t[9],2)+Math.pow(t[10],2)+Math.pow(t[11],2)+Math.pow(t[12],2)+Math.pow(t[13],2)+Math.pow(t[14],2)+Math.pow(t[15],2))},add:function(t,r,n){return t[0]=r[0]+n[0],t[1]=r[1]+n[1],t[2]=r[2]+n[2],t[3]=r[3]+n[3],t[4]=r[4]+n[4],t[5]=r[5]+n[5],t[6]=r[6]+n[6],t[7]=r[7]+n[7],t[8]=r[8]+n[8],t[9]=r[9]+n[9],t[10]=r[10]+n[10],t[11]=r[11]+n[11],t[12]=r[12]+n[12],t[13]=r[13]+n[13],t[14]=r[14]+n[14],t[15]=r[15]+n[15],t},subtract:e,multiplyScalar:function(t,r,n){return t[0]=r[0]*n,t[1]=r[1]*n,t[2]=r[2]*n,t[3]=r[3]*n,t[4]=r[4]*n,t[5]=r[5]*n,t[6]=r[6]*n,t[7]=r[7]*n,t[8]=r[8]*n,t[9]=r[9]*n,t[10]=r[10]*n,t[11]=r[11]*n,t[12]=r[12]*n,t[13]=r[13]*n,t[14]=r[14]*n,t[15]=r[15]*n,t},multiplyScalarAndAdd:function(t,r,n,e){return t[0]=r[0]+n[0]*e,t[1]=r[1]+n[1]*e,t[2]=r[2]+n[2]*e,t[3]=r[3]+n[3]*e,t[4]=r[4]+n[4]*e,t[5]=r[5]+n[5]*e,t[6]=r[6]+n[6]*e,t[7]=r[7]+n[7]*e,t[8]=r[8]+n[8]*e,t[9]=r[9]+n[9]*e,t[10]=r[10]+n[10]*e,t[11]=r[11]+n[11]*e,t[12]=r[12]+n[12]*e,t[13]=r[13]+n[13]*e,t[14]=r[14]+n[14]*e,t[15]=r[15]+n[15]*e,t},exactEquals:function(t,r){return t[0]===r[0]&&t[1]===r[1]&&t[2]===r[2]&&t[3]===r[3]&&t[4]===r[4]&&t[5]===r[5]&&t[6]===r[6]&&t[7]===r[7]&&t[8]===r[8]&&t[9]===r[9]&&t[10]===r[10]&&t[11]===r[11]&&t[12]===r[12]&&t[13]===r[13]&&t[14]===r[14]&&t[15]===r[15]},equals:function(t,r){var n=t[0],e=t[1],a=t[2],o=t[3],i=t[4],u=t[5],s=t[6],c=t[7],h=t[8],f=t[9],l=t[10],p=t[11],M=t[12],v=t[13],b=t[14],d=t[15],m=r[0],w=r[1],y=r[2],g=r[3],_=r[4],E=r[5],x=r[6],O=r[7],S=r[8],q=r[9],P=r[10],j=r[11],T=r[12],F=r[13],A=r[14],C=r[15];return Math.abs(n-m)<=R*Math.max(1,Math.abs(n),Math.abs(m))&&Math.abs(e-w)<=R*Math.max(1,Math.abs(e),Math.abs(w))&&Math.abs(a-y)<=R*Math.max(1,Math.abs(a),Math.abs(y))&&Math.abs(o-g)<=R*Math.max(1,Math.abs(o),Math.abs(g))&&Math.abs(i-_)<=R*Math.max(1,Math.abs(i),Math.abs(_))&&Math.abs(u-E)<=R*Math.max(1,Math.abs(u),Math.abs(E))&&Math.abs(s-x)<=R*Math.max(1,Math.abs(s),Math.abs(x))&&Math.abs(c-O)<=R*Math.max(1,Math.abs(c),Math.abs(O))&&Math.abs(h-S)<=R*Math.max(1,Math.abs(h),Math.abs(S))&&Math.abs(f-q)<=R*Math.max(1,Math.abs(f),Math.abs(q))&&Math.abs(l-P)<=R*Math.max(1,Math.abs(l),Math.abs(P))&&Math.abs(p-j)<=R*Math.max(1,Math.abs(p),Math.abs(j))&&Math.abs(M-T)<=R*Math.max(1,Math.abs(M),Math.abs(T))&&Math.abs(v-F)<=R*Math.max(1,Math.abs(v),Math.abs(F))&&Math.abs(b-A)<=R*Math.max(1,Math.abs(b),Math.abs(A))&&Math.abs(d-C)<=R*Math.max(1,Math.abs(d),Math.abs(C))},mul:r,sub:e};function _(){var t=new d(3);return d!=Float32Array&&(t[0]=0,t[1]=0,t[2]=0),t}function x(t,r,n){var e=new d(3);return e[0]=t,e[1]=r,e[2]=n,e}function O(t,r,n){return t[0]=r[0]+n[0],t[1]=r[1]+n[1],t[2]=r[2]+n[2],t}function a(t,r,n){var e=r[0],a=r[1],o=r[2],i=n[0],u=n[1],s=n[2];return t[0]=a*s-o*u,t[1]=o*i-e*s,t[2]=e*u-a*i,t}function S(t,r,n){var e=n[0],a=n[1],o=n[2],i=n[3],u=r[0],s=r[1],c=r[2],h=a*c-o*s,f=o*u-e*c,l=e*s-a*u,p=a*l-o*f,M=o*h-e*l,v=e*f-a*h,b=2*i;return h*=b,f*=b,l*=b,p*=2,M*=2,v*=2,t[0]=u+h+p,t[1]=s+f+M,t[2]=c+l+v,t}var o,q=function(t,r,n){return t[0]=r[0]-n[0],t[1]=r[1]-n[1],t[2]=r[2]-n[2],t},s=function(t){var r=t[0],n=t[1],e=t[2];return Math.sqrt(r*r+n*n+e*e)};o=_();var c;c=function(){var t=new d(4);return d!=Float32Array&&(t[0]=0,t[1]=0,t[2]=0,t[3]=0),t}();function P(){var t=new d(4);return d!=Float32Array&&(t[0]=0,t[1]=0,t[2]=0),t[3]=1,t}function j(t){return t[0]=0,t[1]=0,t[2]=0,t[3]=1,t}function f(t,r,n){n*=.5;var e=Math.sin(n);return t[0]=e*r[0],t[1]=e*r[1],t[2]=e*r[2],t[3]=Math.cos(n),t}function l(t,r,n){var e=r[0],a=r[1],o=r[2],i=r[3],u=n[0],s=n[1],c=n[2],h=n[3];return t[0]=e*h+i*u+a*c-o*s,t[1]=a*h+i*s+o*u-e*c,t[2]=o*h+i*c+e*s-a*u,t[3]=i*h-e*u-a*s-o*c,t}function p(t,r,n,e){var a,o,i,u,s,c=r[0],h=r[1],f=r[2],l=r[3],p=n[0],M=n[1],v=n[2],b=n[3];return(o=c*p+h*M+f*v+l*b)<0&&(o=-o,p=-p,M=-M,v=-v,b=-b),s=R<1-o?(a=Math.acos(o),i=Math.sin(a),u=Math.sin((1-e)*a)/i,Math.sin(e*a)/i):(u=1-e,e),t[0]=u*c+s*p,t[1]=u*h+s*M,t[2]=u*f+s*v,t[3]=u*l+s*b,t}function T(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=n*n+e*e+a*a+o*o,u=i?1/i:0;return t[0]=-n*u,t[1]=-e*u,t[2]=-a*u,t[3]=o*u,t}function M(t,r){var n,e=r[0]+r[4]+r[8];if(0<e)n=Math.sqrt(e+1),t[3]=.5*n,n=.5/n,t[0]=(r[5]-r[7])*n,t[1]=(r[6]-r[2])*n,t[2]=(r[1]-r[3])*n;else{var a=0;r[4]>r[0]&&(a=1),r[8]>r[3*a+a]&&(a=2);var o=(a+1)%3,i=(a+2)%3;n=Math.sqrt(r[3*a+a]-r[3*o+o]-r[3*i+i]+1),t[a]=.5*n,n=.5/n,t[3]=(r[3*o+i]-r[3*i+o])*n,t[o]=(r[3*o+a]+r[3*a+o])*n,t[i]=(r[3*i+a]+r[3*a+i])*n}return t}function F(t,r,n,e){var a=.5*Math.PI/180;r*=a,n*=a,e*=a;var o=Math.sin(r),i=Math.cos(r),u=Math.sin(n),s=Math.cos(n),c=Math.sin(e),h=Math.cos(e);return t[0]=o*s*h-i*u*c,t[1]=i*u*h+o*s*c,t[2]=i*s*c-o*u*h,t[3]=i*s*h+o*u*c,t}var A,C,k,I,N,D,V=function(t,r,n,e){var a=new d(4);return a[0]=t,a[1]=r,a[2]=n,a[3]=e,a},Z=l,H=function(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=n*n+e*e+a*a+o*o;return 0<i&&(i=1/Math.sqrt(i)),t[0]=n*i,t[1]=e*i,t[2]=a*i,t[3]=o*i,t};A=_(),C=x(1,0,0),k=x(0,1,0),I=P(),N=P(),D=function(){var t=new d(9);return d!=Float32Array&&(t[1]=0,t[2]=0,t[3]=0,t[5]=0,t[6]=0,t[7]=0),t[0]=1,t[4]=1,t[8]=1,t}();function L(t,r){if("string"==typeof t){var n=r?r.querySelector(t):document.querySelector(t);if(!n)throw new Error(function(t){return'Element with selector "'+t+"\" doesn't exist."}(t));return n}if(t.nodeName&&1===t.nodeType)return t;throw new Error(function(t){return"Element should be provided in string or HTMLElement. Received: "+t}(t))}var X;X=function(){var t=new d(2);return d!=Float32Array&&(t[0]=0,t[1]=0),t}();function Y(r,n){Object.keys(n).forEach(function(t){r.style[t]=n[t]})}function Q(e){for(var t=[],r=1;r<arguments.length;r++)t[r-1]=arguments[r];return t.forEach(function(n){Object.keys(n).forEach(function(t){var r=n[t];e[t]=r})}),e}function W(t){var r=b();h(r,t);var n=r[0],e=r[4],a=r[1],o=r[5],i=r[2],u=r[6],s=r[10],c=_();return c[1]=Math.asin(-function(t,r,n){return Math.max(Math.min(t,n),r)}(i,-1,1)),Math.abs(i)<.99999?(c[0]=Math.atan2(u,s),c[2]=Math.atan2(a,n)):(c[0]=0,c[2]=Math.atan2(-e,o)),c.map(function(t){return function(t){return 180*t/Math.PI}(t)})}var B,G={width:"100%",height:"100%","transform-style":"preserve-3d",overflow:"hidden"},U={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},z={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},J="cc-viewport",K="cc-camera",$="cc-world",tt={position:[0,0,0],scale:[1,1,1],rotation:[0,0,0],perspective:0,rotateOffset:0};function rt(t,r){void 0===r&&(r={}),this._element=L(t);var n=Q(Q({},tt),r);this._position=x(n.position[0],n.position[1],n.position[2]),this._scale=x(n.scale[0],n.scale[1],n.scale[2]),this._rotation=x(n.rotation[0],n.rotation[1],n.rotation[2]),this._perspective=n.perspective,this._rotateOffset=n.rotateOffset,this._updateTimer=-1;var e=this._element,a=document.createElement("div"),o=a.cloneNode(),i=a.cloneNode();a.className=J,o.className=K,i.className=$,Y(a,G),Y(o,U),Y(i,z),o.appendChild(i),a.appendChild(o),this._viewportEl=a,this._cameraEl=o,this._worldEl=i,e.parentElement.insertBefore(a,e),i.appendChild(e)}return B=rt.prototype,Object.defineProperty(rt,"VERSION",{get:function(){return"1.0.0-rc"},enumerable:!0,configurable:!0}),Object.defineProperty(B,"element",{get:function(){return this._element},enumerable:!0,configurable:!0}),Object.defineProperty(B,"viewportEl",{get:function(){return this._viewportEl},enumerable:!0,configurable:!0}),Object.defineProperty(B,"cameraEl",{get:function(){return this._cameraEl},enumerable:!0,configurable:!0}),Object.defineProperty(B,"worldEl",{get:function(){return this._worldEl},enumerable:!0,configurable:!0}),Object.defineProperty(B,"position",{get:function(){return v(this._position)},set:function(t){this._position=x(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(B,"scale",{get:function(){return v(this._scale)},set:function(t){this._scale=x(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(B,"rotation",{get:function(){return v(this._rotation)},set:function(t){this._rotation=x(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(B,"quaternion",{get:function(){var t=this._rotation;return v(F(P(),t[0],t[1],t[2]))},set:function(t){this._rotation=W(V(t[0],t[1],t[2],t[3]))},enumerable:!0,configurable:!0}),Object.defineProperty(B,"perspective",{get:function(){return this._perspective},set:function(t){this._perspective=t},enumerable:!0,configurable:!0}),Object.defineProperty(B,"rotateOffset",{get:function(){return this._rotateOffset},set:function(t){this._rotateOffset=t},enumerable:!0,configurable:!0}),Object.defineProperty(B,"cameraCSS",{get:function(){var t=this._perspective,r=this._rotateOffset,n=this._rotation,e=this._scale;return"scale3d("+e[0]+", "+e[1]+", "+e[2]+") translateZ("+(t-r)+"px) rotateX("+n[0]+"deg) rotateY("+n[1]+"deg) rotateZ("+n[2]+"deg)"},enumerable:!0,configurable:!0}),Object.defineProperty(B,"worldCSS",{get:function(){var t=this._position;return"translate3d("+-t[0]+"px, "+-t[1]+"px, "+-t[2]+"px)"},enumerable:!0,configurable:!0}),B.focus=function(t){var r=L(t),n=this._getFocusMatrix(r),e=P(),a=_();y(e,n),i(a,n);var o=W(e);return function(t,r){t[0]=-r[0],t[1]=-r[1],t[2]=-r[2]}(o,o),this._rotation=o,this._position=a,this},B.translateLocal=function(t,r,n){void 0===t&&(t=0),void 0===r&&(r=0),void 0===n&&(n=0);var e=this._position,a=this._rotation,o=x(t,r,n),i=P();return F(i,-a[0],-a[1],-a[2]),S(o,o,i),O(e,e,o),this},B.translate=function(t,r,n){return void 0===t&&(t=0),void 0===r&&(r=0),void 0===n&&(n=0),O(this._position,this._position,x(t,r,n)),this},B.rotate=function(t,r,n){return void 0===t&&(t=0),void 0===r&&(r=0),void 0===n&&(n=0),O(this._rotation,this._rotation,x(t,r,n)),this},B.update=function(o,i){return void 0===o&&(o=0),void 0===i&&(i={property:"transform",timingFunction:"ease-out",delay:"0ms"}),function(o,i,u,s){return new(u||(u=Promise))(function(t,r){function n(t){try{a(s.next(t))}catch(t){r(t)}}function e(t){try{a(s.throw(t))}catch(t){r(t)}}function a(r){r.done?t(r.value):new u(function(t){t(r.value)}).then(n,e)}a((s=s.apply(o,i||[])).next())})}(this,void 0,Promise,function(){var r,n,e,a=this;return t(this,function(t){return Y(this._viewportEl,{perspective:this.perspective+"px"}),Y(this._cameraEl,{transform:this.cameraCSS}),Y(this._worldEl,{transform:this.worldCSS}),0<o&&(0<this._updateTimer&&window.clearTimeout(this._updateTimer),r=o+"ms",n=Object.keys(i).reduce(function(t,r){return t["transition"+(r.charAt(0).toUpperCase()+r.slice(1))]=i[r],t},{}),e=u({transitionDuration:r},n),[this._viewportEl,this._cameraEl,this._worldEl].forEach(function(t){Y(t,e)})),[2,new Promise(function(t){0<o?a._updateTimer=window.setTimeout(function(){[a._viewportEl,a._cameraEl,a._worldEl].forEach(function(t){Y(t,{transition:""})}),a._updateTimer=-1,t()},o):requestAnimationFrame(function(){t()})})]})})},B._getFocusMatrix=function(t){for(var f=[];t&&(f.push(t),t!==this._element);)t=t.parentElement;f.reverse();var r=f.map(function(t){return window.getComputedStyle(t)}),n=function(t,r){for(var n=0;n<t.length;n+=1){var e=t[n];if(e&&r(e))return n}return-1}(r,function(t){return"preserve-3d"!==t.transformStyle});0<n&&r.splice(n+1);var l={left:0,top:0,width:this.viewportEl.offsetWidth,height:this.viewportEl.offsetHeight},p=j(P()),M=x(0,0,0);r.forEach(function(t,r){var n=f[r],e={left:n.offsetLeft,top:n.offsetTop,width:n.offsetWidth,height:n.offsetHeight},a=function(t){var r=t.getPropertyValue("transform"),n=/\(((\s|\S)+)\)/.exec(r),e=n?n[1].split(",").map(function(t){return parseFloat(t)}):[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1];if(16===e.length)return m.apply(g,v(e));var a=b();return E(a),a[0]=e[0],a[1]=e[1],a[4]=e[2],a[5]=e[3],a[12]=e[4],a[13]=e[5],a}(t),o=function(t,r){return x(t.left+(t.width-r.width)/2,t.top+(t.height-r.height)/2,0)}(e,l);S(o,o,p),O(M,M,o);var i=function(t,r){var n=t.transformOrigin.split(" ").map(function(t){return parseFloat(t.substring(0,t.length-2))});return x(n[0]-r.width/2,n[1]-r.height/2,0)}(t,e);S(i,i,p);var u=function(t){var r=new d(3);return r[0]=t[0],r[1]=t[1],r[2]=t[2],r}(M);O(u,u,i);var s=_();q(s,M,u),S(s,s,T(P(),p)),function(t,r,n){var e=r[0],a=r[1],o=r[2],i=n[3]*e+n[7]*a+n[11]*o+n[15];i=i||1,t[0]=(n[0]*e+n[4]*a+n[8]*o+n[12])/i,t[1]=(n[1]*e+n[5]*a+n[9]*o+n[13])/i,t[2]=(n[2]*e+n[6]*a+n[10]*o+n[14])/i}(s,s,a),S(s,s,p);var c=O(_(),u,s),h=y(P(),a);!function(t,r){t[0]=r[0],t[1]=r[1],t[2]=r[2]}(M,c),Z(p,p,h),l=e});var e=x(0,0,this.perspective);S(e,e,p),O(M,M,e);var a=b();return w(a,p,M),a},rt});
+!function(t,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):(t=t||self).CSSCamera=r()}(this,function(){"use strict";var s=function(){return(s=Object.assign||function(t){for(var r,n=1,e=arguments.length;n<e;n++)for(var a in r=arguments[n])Object.prototype.hasOwnProperty.call(r,a)&&(t[a]=r[a]);return t}).apply(this,arguments)};function t(n,e){var a,o,i,t,u={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return t={next:r(0),throw:r(1),return:r(2)},"function"==typeof Symbol&&(t[Symbol.iterator]=function(){return this}),t;function r(r){return function(t){return function(r){if(a)throw new TypeError("Generator is already executing.");for(;u;)try{if(a=1,o&&(i=2&r[0]?o.return:r[0]?o.throw||((i=o.return)&&i.call(o),0):o.next)&&!(i=i.call(o,r[1])).done)return i;switch(o=0,i&&(r=[2&r[0],i.value]),r[0]){case 0:case 1:i=r;break;case 4:return u.label++,{value:r[1],done:!1};case 5:u.label++,o=r[1],r=[0];continue;case 7:r=u.ops.pop(),u.trys.pop();continue;default:if(!(i=0<(i=u.trys).length&&i[i.length-1])&&(6===r[0]||2===r[0])){u=0;continue}if(3===r[0]&&(!i||r[1]>i[0]&&r[1]<i[3])){u.label=r[1];break}if(6===r[0]&&u.label<i[1]){u.label=i[1],i=r;break}if(i&&u.label<i[2]){u.label=i[2],u.ops.push(r);break}i[2]&&u.ops.pop(),u.trys.pop();continue}r=e.call(n,u)}catch(t){r=[6,t],o=0}finally{a=i=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,t])}}}function n(t,r){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var e,a,o=n.call(t),i=[];try{for(;(void 0===r||0<r--)&&!(e=o.next()).done;)i.push(e.value)}catch(t){a={error:t}}finally{try{e&&!e.done&&(n=o.return)&&n.call(o)}finally{if(a)throw a.error}}return i}function v(){for(var t=[],r=0;r<arguments.length;r++)t=t.concat(n(arguments[r]));return t}var R=1e-6,b="undefined"!=typeof Float32Array?Float32Array:Array;Math.random,Math.PI;function m(){var t=new b(16);return b!=Float32Array&&(t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[11]=0,t[12]=0,t[13]=0,t[14]=0),t[0]=1,t[5]=1,t[10]=1,t[15]=1,t}function d(t,r,n,e,a,o,i,u,s,c,h,f,l,p,M,v){var m=new b(16);return m[0]=t,m[1]=r,m[2]=n,m[3]=e,m[4]=a,m[5]=o,m[6]=i,m[7]=u,m[8]=s,m[9]=c,m[10]=h,m[11]=f,m[12]=l,m[13]=p,m[14]=M,m[15]=v,m}function E(t){return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t}function r(t,r,n){var e=r[0],a=r[1],o=r[2],i=r[3],u=r[4],s=r[5],c=r[6],h=r[7],f=r[8],l=r[9],p=r[10],M=r[11],v=r[12],m=r[13],b=r[14],d=r[15],w=n[0],y=n[1],g=n[2],_=n[3];return t[0]=w*e+y*u+g*f+_*v,t[1]=w*a+y*s+g*l+_*m,t[2]=w*o+y*c+g*p+_*b,t[3]=w*i+y*h+g*M+_*d,w=n[4],y=n[5],g=n[6],_=n[7],t[4]=w*e+y*u+g*f+_*v,t[5]=w*a+y*s+g*l+_*m,t[6]=w*o+y*c+g*p+_*b,t[7]=w*i+y*h+g*M+_*d,w=n[8],y=n[9],g=n[10],_=n[11],t[8]=w*e+y*u+g*f+_*v,t[9]=w*a+y*s+g*l+_*m,t[10]=w*o+y*c+g*p+_*b,t[11]=w*i+y*h+g*M+_*d,w=n[12],y=n[13],g=n[14],_=n[15],t[12]=w*e+y*u+g*f+_*v,t[13]=w*a+y*s+g*l+_*m,t[14]=w*o+y*c+g*p+_*b,t[15]=w*i+y*h+g*M+_*d,t}function w(t,r,n){var e=r[0],a=r[1],o=r[2],i=r[3],u=e+e,s=a+a,c=o+o,h=e*u,f=e*s,l=e*c,p=a*s,M=a*c,v=o*c,m=i*u,b=i*s,d=i*c;return t[0]=1-(p+v),t[1]=f+d,t[2]=l-b,t[3]=0,t[4]=f-d,t[5]=1-(h+v),t[6]=M+m,t[7]=0,t[8]=l+b,t[9]=M-m,t[10]=1-(h+p),t[11]=0,t[12]=n[0],t[13]=n[1],t[14]=n[2],t[15]=1,t}function i(t,r){return t[0]=r[12],t[1]=r[13],t[2]=r[14],t}function y(t,r){var n=r[0]+r[5]+r[10],e=0;return 0<n?(e=2*Math.sqrt(n+1),t[3]=.25*e,t[0]=(r[6]-r[9])/e,t[1]=(r[8]-r[2])/e,t[2]=(r[1]-r[4])/e):r[0]>r[5]&&r[0]>r[10]?(e=2*Math.sqrt(1+r[0]-r[5]-r[10]),t[3]=(r[6]-r[9])/e,t[0]=.25*e,t[1]=(r[1]+r[4])/e,t[2]=(r[8]+r[2])/e):r[5]>r[10]?(e=2*Math.sqrt(1+r[5]-r[0]-r[10]),t[3]=(r[8]-r[2])/e,t[0]=(r[1]+r[4])/e,t[1]=.25*e,t[2]=(r[6]+r[9])/e):(e=2*Math.sqrt(1+r[10]-r[0]-r[5]),t[3]=(r[1]-r[4])/e,t[0]=(r[8]+r[2])/e,t[1]=(r[6]+r[9])/e,t[2]=.25*e),t}function h(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=n+n,u=e+e,s=a+a,c=n*i,h=e*i,f=e*u,l=a*i,p=a*u,M=a*s,v=o*i,m=o*u,b=o*s;return t[0]=1-f-M,t[1]=h+b,t[2]=l-m,t[3]=0,t[4]=h-b,t[5]=1-c-M,t[6]=p+v,t[7]=0,t[8]=l+m,t[9]=p-v,t[10]=1-c-f,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t}function e(t,r,n){return t[0]=r[0]-n[0],t[1]=r[1]-n[1],t[2]=r[2]-n[2],t[3]=r[3]-n[3],t[4]=r[4]-n[4],t[5]=r[5]-n[5],t[6]=r[6]-n[6],t[7]=r[7]-n[7],t[8]=r[8]-n[8],t[9]=r[9]-n[9],t[10]=r[10]-n[10],t[11]=r[11]-n[11],t[12]=r[12]-n[12],t[13]=r[13]-n[13],t[14]=r[14]-n[14],t[15]=r[15]-n[15],t}var g={create:m,clone:function(t){var r=new b(16);return r[0]=t[0],r[1]=t[1],r[2]=t[2],r[3]=t[3],r[4]=t[4],r[5]=t[5],r[6]=t[6],r[7]=t[7],r[8]=t[8],r[9]=t[9],r[10]=t[10],r[11]=t[11],r[12]=t[12],r[13]=t[13],r[14]=t[14],r[15]=t[15],r},copy:function(t,r){return t[0]=r[0],t[1]=r[1],t[2]=r[2],t[3]=r[3],t[4]=r[4],t[5]=r[5],t[6]=r[6],t[7]=r[7],t[8]=r[8],t[9]=r[9],t[10]=r[10],t[11]=r[11],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15],t},fromValues:d,set:function(t,r,n,e,a,o,i,u,s,c,h,f,l,p,M,v,m){return t[0]=r,t[1]=n,t[2]=e,t[3]=a,t[4]=o,t[5]=i,t[6]=u,t[7]=s,t[8]=c,t[9]=h,t[10]=f,t[11]=l,t[12]=p,t[13]=M,t[14]=v,t[15]=m,t},identity:E,transpose:function(t,r){if(t===r){var n=r[1],e=r[2],a=r[3],o=r[6],i=r[7],u=r[11];t[1]=r[4],t[2]=r[8],t[3]=r[12],t[4]=n,t[6]=r[9],t[7]=r[13],t[8]=e,t[9]=o,t[11]=r[14],t[12]=a,t[13]=i,t[14]=u}else t[0]=r[0],t[1]=r[4],t[2]=r[8],t[3]=r[12],t[4]=r[1],t[5]=r[5],t[6]=r[9],t[7]=r[13],t[8]=r[2],t[9]=r[6],t[10]=r[10],t[11]=r[14],t[12]=r[3],t[13]=r[7],t[14]=r[11],t[15]=r[15];return t},invert:function(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=r[4],u=r[5],s=r[6],c=r[7],h=r[8],f=r[9],l=r[10],p=r[11],M=r[12],v=r[13],m=r[14],b=r[15],d=n*u-e*i,w=n*s-a*i,y=n*c-o*i,g=e*s-a*u,_=e*c-o*u,E=a*c-o*s,x=h*v-f*M,O=h*m-l*M,S=h*b-p*M,q=f*m-l*v,P=f*b-p*v,j=l*b-p*m,F=d*j-w*P+y*q+g*S-_*O+E*x;return F?(F=1/F,t[0]=(u*j-s*P+c*q)*F,t[1]=(a*P-e*j-o*q)*F,t[2]=(v*E-m*_+b*g)*F,t[3]=(l*_-f*E-p*g)*F,t[4]=(s*S-i*j-c*O)*F,t[5]=(n*j-a*S+o*O)*F,t[6]=(m*y-M*E-b*w)*F,t[7]=(h*E-l*y+p*w)*F,t[8]=(i*P-u*S+c*x)*F,t[9]=(e*S-n*P-o*x)*F,t[10]=(M*_-v*y+b*d)*F,t[11]=(f*y-h*_-p*d)*F,t[12]=(u*O-i*q-s*x)*F,t[13]=(n*q-e*O+a*x)*F,t[14]=(v*w-M*g-m*d)*F,t[15]=(h*g-f*w+l*d)*F,t):null},adjoint:function(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=r[4],u=r[5],s=r[6],c=r[7],h=r[8],f=r[9],l=r[10],p=r[11],M=r[12],v=r[13],m=r[14],b=r[15];return t[0]=u*(l*b-p*m)-f*(s*b-c*m)+v*(s*p-c*l),t[1]=-(e*(l*b-p*m)-f*(a*b-o*m)+v*(a*p-o*l)),t[2]=e*(s*b-c*m)-u*(a*b-o*m)+v*(a*c-o*s),t[3]=-(e*(s*p-c*l)-u*(a*p-o*l)+f*(a*c-o*s)),t[4]=-(i*(l*b-p*m)-h*(s*b-c*m)+M*(s*p-c*l)),t[5]=n*(l*b-p*m)-h*(a*b-o*m)+M*(a*p-o*l),t[6]=-(n*(s*b-c*m)-i*(a*b-o*m)+M*(a*c-o*s)),t[7]=n*(s*p-c*l)-i*(a*p-o*l)+h*(a*c-o*s),t[8]=i*(f*b-p*v)-h*(u*b-c*v)+M*(u*p-c*f),t[9]=-(n*(f*b-p*v)-h*(e*b-o*v)+M*(e*p-o*f)),t[10]=n*(u*b-c*v)-i*(e*b-o*v)+M*(e*c-o*u),t[11]=-(n*(u*p-c*f)-i*(e*p-o*f)+h*(e*c-o*u)),t[12]=-(i*(f*m-l*v)-h*(u*m-s*v)+M*(u*l-s*f)),t[13]=n*(f*m-l*v)-h*(e*m-a*v)+M*(e*l-a*f),t[14]=-(n*(u*m-s*v)-i*(e*m-a*v)+M*(e*s-a*u)),t[15]=n*(u*l-s*f)-i*(e*l-a*f)+h*(e*s-a*u),t},determinant:function(t){var r=t[0],n=t[1],e=t[2],a=t[3],o=t[4],i=t[5],u=t[6],s=t[7],c=t[8],h=t[9],f=t[10],l=t[11],p=t[12],M=t[13],v=t[14],m=t[15];return(r*i-n*o)*(f*m-l*v)-(r*u-e*o)*(h*m-l*M)+(r*s-a*o)*(h*v-f*M)+(n*u-e*i)*(c*m-l*p)-(n*s-a*i)*(c*v-f*p)+(e*s-a*u)*(c*M-h*p)},multiply:r,translate:function(t,r,n){var e,a,o,i,u,s,c,h,f,l,p,M,v=n[0],m=n[1],b=n[2];return r===t?(t[12]=r[0]*v+r[4]*m+r[8]*b+r[12],t[13]=r[1]*v+r[5]*m+r[9]*b+r[13],t[14]=r[2]*v+r[6]*m+r[10]*b+r[14],t[15]=r[3]*v+r[7]*m+r[11]*b+r[15]):(e=r[0],a=r[1],o=r[2],i=r[3],u=r[4],s=r[5],c=r[6],h=r[7],f=r[8],l=r[9],p=r[10],M=r[11],t[0]=e,t[1]=a,t[2]=o,t[3]=i,t[4]=u,t[5]=s,t[6]=c,t[7]=h,t[8]=f,t[9]=l,t[10]=p,t[11]=M,t[12]=e*v+u*m+f*b+r[12],t[13]=a*v+s*m+l*b+r[13],t[14]=o*v+c*m+p*b+r[14],t[15]=i*v+h*m+M*b+r[15]),t},scale:function(t,r,n){var e=n[0],a=n[1],o=n[2];return t[0]=r[0]*e,t[1]=r[1]*e,t[2]=r[2]*e,t[3]=r[3]*e,t[4]=r[4]*a,t[5]=r[5]*a,t[6]=r[6]*a,t[7]=r[7]*a,t[8]=r[8]*o,t[9]=r[9]*o,t[10]=r[10]*o,t[11]=r[11]*o,t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15],t},rotate:function(t,r,n,e){var a,o,i,u,s,c,h,f,l,p,M,v,m,b,d,w,y,g,_,E,x,O,S,q,P=e[0],j=e[1],F=e[2],T=Math.sqrt(P*P+j*j+F*F);return T<R?null:(P*=T=1/T,j*=T,F*=T,a=Math.sin(n),i=1-(o=Math.cos(n)),u=r[0],s=r[1],c=r[2],h=r[3],f=r[4],l=r[5],p=r[6],M=r[7],v=r[8],m=r[9],b=r[10],d=r[11],w=P*P*i+o,y=j*P*i+F*a,g=F*P*i-j*a,_=P*j*i-F*a,E=j*j*i+o,x=F*j*i+P*a,O=P*F*i+j*a,S=j*F*i-P*a,q=F*F*i+o,t[0]=u*w+f*y+v*g,t[1]=s*w+l*y+m*g,t[2]=c*w+p*y+b*g,t[3]=h*w+M*y+d*g,t[4]=u*_+f*E+v*x,t[5]=s*_+l*E+m*x,t[6]=c*_+p*E+b*x,t[7]=h*_+M*E+d*x,t[8]=u*O+f*S+v*q,t[9]=s*O+l*S+m*q,t[10]=c*O+p*S+b*q,t[11]=h*O+M*S+d*q,r!==t&&(t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t)},rotateX:function(t,r,n){var e=Math.sin(n),a=Math.cos(n),o=r[4],i=r[5],u=r[6],s=r[7],c=r[8],h=r[9],f=r[10],l=r[11];return r!==t&&(t[0]=r[0],t[1]=r[1],t[2]=r[2],t[3]=r[3],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t[4]=o*a+c*e,t[5]=i*a+h*e,t[6]=u*a+f*e,t[7]=s*a+l*e,t[8]=c*a-o*e,t[9]=h*a-i*e,t[10]=f*a-u*e,t[11]=l*a-s*e,t},rotateY:function(t,r,n){var e=Math.sin(n),a=Math.cos(n),o=r[0],i=r[1],u=r[2],s=r[3],c=r[8],h=r[9],f=r[10],l=r[11];return r!==t&&(t[4]=r[4],t[5]=r[5],t[6]=r[6],t[7]=r[7],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t[0]=o*a-c*e,t[1]=i*a-h*e,t[2]=u*a-f*e,t[3]=s*a-l*e,t[8]=o*e+c*a,t[9]=i*e+h*a,t[10]=u*e+f*a,t[11]=s*e+l*a,t},rotateZ:function(t,r,n){var e=Math.sin(n),a=Math.cos(n),o=r[0],i=r[1],u=r[2],s=r[3],c=r[4],h=r[5],f=r[6],l=r[7];return r!==t&&(t[8]=r[8],t[9]=r[9],t[10]=r[10],t[11]=r[11],t[12]=r[12],t[13]=r[13],t[14]=r[14],t[15]=r[15]),t[0]=o*a+c*e,t[1]=i*a+h*e,t[2]=u*a+f*e,t[3]=s*a+l*e,t[4]=c*a-o*e,t[5]=h*a-i*e,t[6]=f*a-u*e,t[7]=l*a-s*e,t},fromTranslation:function(t,r){return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=r[0],t[13]=r[1],t[14]=r[2],t[15]=1,t},fromScaling:function(t,r){return t[0]=r[0],t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=r[1],t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=r[2],t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromRotation:function(t,r,n){var e,a,o,i=n[0],u=n[1],s=n[2],c=Math.sqrt(i*i+u*u+s*s);return c<R?null:(i*=c=1/c,u*=c,s*=c,e=Math.sin(r),o=1-(a=Math.cos(r)),t[0]=i*i*o+a,t[1]=u*i*o+s*e,t[2]=s*i*o-u*e,t[3]=0,t[4]=i*u*o-s*e,t[5]=u*u*o+a,t[6]=s*u*o+i*e,t[7]=0,t[8]=i*s*o+u*e,t[9]=u*s*o-i*e,t[10]=s*s*o+a,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t)},fromXRotation:function(t,r){var n=Math.sin(r),e=Math.cos(r);return t[0]=1,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=e,t[6]=n,t[7]=0,t[8]=0,t[9]=-n,t[10]=e,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromYRotation:function(t,r){var n=Math.sin(r),e=Math.cos(r);return t[0]=e,t[1]=0,t[2]=-n,t[3]=0,t[4]=0,t[5]=1,t[6]=0,t[7]=0,t[8]=n,t[9]=0,t[10]=e,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromZRotation:function(t,r){var n=Math.sin(r),e=Math.cos(r);return t[0]=e,t[1]=n,t[2]=0,t[3]=0,t[4]=-n,t[5]=e,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=1,t[11]=0,t[12]=0,t[13]=0,t[14]=0,t[15]=1,t},fromRotationTranslation:w,fromQuat2:function(t,r){var n=new b(3),e=-r[0],a=-r[1],o=-r[2],i=r[3],u=r[4],s=r[5],c=r[6],h=r[7],f=e*e+a*a+o*o+i*i;return 0<f?(n[0]=2*(u*i+h*e+s*o-c*a)/f,n[1]=2*(s*i+h*a+c*e-u*o)/f,n[2]=2*(c*i+h*o+u*a-s*e)/f):(n[0]=2*(u*i+h*e+s*o-c*a),n[1]=2*(s*i+h*a+c*e-u*o),n[2]=2*(c*i+h*o+u*a-s*e)),w(t,r,n),t},getTranslation:i,getScaling:function(t,r){var n=r[0],e=r[1],a=r[2],o=r[4],i=r[5],u=r[6],s=r[8],c=r[9],h=r[10];return t[0]=Math.sqrt(n*n+e*e+a*a),t[1]=Math.sqrt(o*o+i*i+u*u),t[2]=Math.sqrt(s*s+c*c+h*h),t},getRotation:y,fromRotationTranslationScale:function(t,r,n,e){var a=r[0],o=r[1],i=r[2],u=r[3],s=a+a,c=o+o,h=i+i,f=a*s,l=a*c,p=a*h,M=o*c,v=o*h,m=i*h,b=u*s,d=u*c,w=u*h,y=e[0],g=e[1],_=e[2];return t[0]=(1-(M+m))*y,t[1]=(l+w)*y,t[2]=(p-d)*y,t[3]=0,t[4]=(l-w)*g,t[5]=(1-(f+m))*g,t[6]=(v+b)*g,t[7]=0,t[8]=(p+d)*_,t[9]=(v-b)*_,t[10]=(1-(f+M))*_,t[11]=0,t[12]=n[0],t[13]=n[1],t[14]=n[2],t[15]=1,t},fromRotationTranslationScaleOrigin:function(t,r,n,e,a){var o=r[0],i=r[1],u=r[2],s=r[3],c=o+o,h=i+i,f=u+u,l=o*c,p=o*h,M=o*f,v=i*h,m=i*f,b=u*f,d=s*c,w=s*h,y=s*f,g=e[0],_=e[1],E=e[2],x=a[0],O=a[1],S=a[2],q=(1-(v+b))*g,P=(p+y)*g,j=(M-w)*g,F=(p-y)*_,T=(1-(l+b))*_,A=(m+d)*_,C=(M+w)*E,R=(m-d)*E,k=(1-(l+v))*E;return t[0]=q,t[1]=P,t[2]=j,t[3]=0,t[4]=F,t[5]=T,t[6]=A,t[7]=0,t[8]=C,t[9]=R,t[10]=k,t[11]=0,t[12]=n[0]+x-(q*x+F*O+C*S),t[13]=n[1]+O-(P*x+T*O+R*S),t[14]=n[2]+S-(j*x+A*O+k*S),t[15]=1,t},fromQuat:h,frustum:function(t,r,n,e,a,o,i){var u=1/(n-r),s=1/(a-e),c=1/(o-i);return t[0]=2*o*u,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=2*o*s,t[6]=0,t[7]=0,t[8]=(n+r)*u,t[9]=(a+e)*s,t[10]=(i+o)*c,t[11]=-1,t[12]=0,t[13]=0,t[14]=i*o*2*c,t[15]=0,t},perspective:function(t,r,n,e,a){var o,i=1/Math.tan(r/2);return t[0]=i/n,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=i,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[11]=-1,t[12]=0,t[13]=0,t[15]=0,null!=a&&a!==1/0?(o=1/(e-a),t[10]=(a+e)*o,t[14]=2*a*e*o):(t[10]=-1,t[14]=-2*e),t},perspectiveFromFieldOfView:function(t,r,n,e){var a=Math.tan(r.upDegrees*Math.PI/180),o=Math.tan(r.downDegrees*Math.PI/180),i=Math.tan(r.leftDegrees*Math.PI/180),u=Math.tan(r.rightDegrees*Math.PI/180),s=2/(i+u),c=2/(a+o);return t[0]=s,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=c,t[6]=0,t[7]=0,t[8]=-(i-u)*s*.5,t[9]=(a-o)*c*.5,t[10]=e/(n-e),t[11]=-1,t[12]=0,t[13]=0,t[14]=e*n/(n-e),t[15]=0,t},ortho:function(t,r,n,e,a,o,i){var u=1/(r-n),s=1/(e-a),c=1/(o-i);return t[0]=-2*u,t[1]=0,t[2]=0,t[3]=0,t[4]=0,t[5]=-2*s,t[6]=0,t[7]=0,t[8]=0,t[9]=0,t[10]=2*c,t[11]=0,t[12]=(r+n)*u,t[13]=(a+e)*s,t[14]=(i+o)*c,t[15]=1,t},lookAt:function(t,r,n,e){var a,o,i,u,s,c,h,f,l,p,M=r[0],v=r[1],m=r[2],b=e[0],d=e[1],w=e[2],y=n[0],g=n[1],_=n[2];return Math.abs(M-y)<R&&Math.abs(v-g)<R&&Math.abs(m-_)<R?E(t):(h=M-y,f=v-g,l=m-_,a=d*(l*=p=1/Math.sqrt(h*h+f*f+l*l))-w*(f*=p),o=w*(h*=p)-b*l,i=b*f-d*h,(p=Math.sqrt(a*a+o*o+i*i))?(a*=p=1/p,o*=p,i*=p):i=o=a=0,u=f*i-l*o,s=l*a-h*i,c=h*o-f*a,(p=Math.sqrt(u*u+s*s+c*c))?(u*=p=1/p,s*=p,c*=p):c=s=u=0,t[0]=a,t[1]=u,t[2]=h,t[3]=0,t[4]=o,t[5]=s,t[6]=f,t[7]=0,t[8]=i,t[9]=c,t[10]=l,t[11]=0,t[12]=-(a*M+o*v+i*m),t[13]=-(u*M+s*v+c*m),t[14]=-(h*M+f*v+l*m),t[15]=1,t)},targetTo:function(t,r,n,e){var a=r[0],o=r[1],i=r[2],u=e[0],s=e[1],c=e[2],h=a-n[0],f=o-n[1],l=i-n[2],p=h*h+f*f+l*l;0<p&&(h*=p=1/Math.sqrt(p),f*=p,l*=p);var M=s*l-c*f,v=c*h-u*l,m=u*f-s*h;return 0<(p=M*M+v*v+m*m)&&(M*=p=1/Math.sqrt(p),v*=p,m*=p),t[0]=M,t[1]=v,t[2]=m,t[3]=0,t[4]=f*m-l*v,t[5]=l*M-h*m,t[6]=h*v-f*M,t[7]=0,t[8]=h,t[9]=f,t[10]=l,t[11]=0,t[12]=a,t[13]=o,t[14]=i,t[15]=1,t},str:function(t){return"mat4("+t[0]+", "+t[1]+", "+t[2]+", "+t[3]+", "+t[4]+", "+t[5]+", "+t[6]+", "+t[7]+", "+t[8]+", "+t[9]+", "+t[10]+", "+t[11]+", "+t[12]+", "+t[13]+", "+t[14]+", "+t[15]+")"},frob:function(t){return Math.sqrt(Math.pow(t[0],2)+Math.pow(t[1],2)+Math.pow(t[2],2)+Math.pow(t[3],2)+Math.pow(t[4],2)+Math.pow(t[5],2)+Math.pow(t[6],2)+Math.pow(t[7],2)+Math.pow(t[8],2)+Math.pow(t[9],2)+Math.pow(t[10],2)+Math.pow(t[11],2)+Math.pow(t[12],2)+Math.pow(t[13],2)+Math.pow(t[14],2)+Math.pow(t[15],2))},add:function(t,r,n){return t[0]=r[0]+n[0],t[1]=r[1]+n[1],t[2]=r[2]+n[2],t[3]=r[3]+n[3],t[4]=r[4]+n[4],t[5]=r[5]+n[5],t[6]=r[6]+n[6],t[7]=r[7]+n[7],t[8]=r[8]+n[8],t[9]=r[9]+n[9],t[10]=r[10]+n[10],t[11]=r[11]+n[11],t[12]=r[12]+n[12],t[13]=r[13]+n[13],t[14]=r[14]+n[14],t[15]=r[15]+n[15],t},subtract:e,multiplyScalar:function(t,r,n){return t[0]=r[0]*n,t[1]=r[1]*n,t[2]=r[2]*n,t[3]=r[3]*n,t[4]=r[4]*n,t[5]=r[5]*n,t[6]=r[6]*n,t[7]=r[7]*n,t[8]=r[8]*n,t[9]=r[9]*n,t[10]=r[10]*n,t[11]=r[11]*n,t[12]=r[12]*n,t[13]=r[13]*n,t[14]=r[14]*n,t[15]=r[15]*n,t},multiplyScalarAndAdd:function(t,r,n,e){return t[0]=r[0]+n[0]*e,t[1]=r[1]+n[1]*e,t[2]=r[2]+n[2]*e,t[3]=r[3]+n[3]*e,t[4]=r[4]+n[4]*e,t[5]=r[5]+n[5]*e,t[6]=r[6]+n[6]*e,t[7]=r[7]+n[7]*e,t[8]=r[8]+n[8]*e,t[9]=r[9]+n[9]*e,t[10]=r[10]+n[10]*e,t[11]=r[11]+n[11]*e,t[12]=r[12]+n[12]*e,t[13]=r[13]+n[13]*e,t[14]=r[14]+n[14]*e,t[15]=r[15]+n[15]*e,t},exactEquals:function(t,r){return t[0]===r[0]&&t[1]===r[1]&&t[2]===r[2]&&t[3]===r[3]&&t[4]===r[4]&&t[5]===r[5]&&t[6]===r[6]&&t[7]===r[7]&&t[8]===r[8]&&t[9]===r[9]&&t[10]===r[10]&&t[11]===r[11]&&t[12]===r[12]&&t[13]===r[13]&&t[14]===r[14]&&t[15]===r[15]},equals:function(t,r){var n=t[0],e=t[1],a=t[2],o=t[3],i=t[4],u=t[5],s=t[6],c=t[7],h=t[8],f=t[9],l=t[10],p=t[11],M=t[12],v=t[13],m=t[14],b=t[15],d=r[0],w=r[1],y=r[2],g=r[3],_=r[4],E=r[5],x=r[6],O=r[7],S=r[8],q=r[9],P=r[10],j=r[11],F=r[12],T=r[13],A=r[14],C=r[15];return Math.abs(n-d)<=R*Math.max(1,Math.abs(n),Math.abs(d))&&Math.abs(e-w)<=R*Math.max(1,Math.abs(e),Math.abs(w))&&Math.abs(a-y)<=R*Math.max(1,Math.abs(a),Math.abs(y))&&Math.abs(o-g)<=R*Math.max(1,Math.abs(o),Math.abs(g))&&Math.abs(i-_)<=R*Math.max(1,Math.abs(i),Math.abs(_))&&Math.abs(u-E)<=R*Math.max(1,Math.abs(u),Math.abs(E))&&Math.abs(s-x)<=R*Math.max(1,Math.abs(s),Math.abs(x))&&Math.abs(c-O)<=R*Math.max(1,Math.abs(c),Math.abs(O))&&Math.abs(h-S)<=R*Math.max(1,Math.abs(h),Math.abs(S))&&Math.abs(f-q)<=R*Math.max(1,Math.abs(f),Math.abs(q))&&Math.abs(l-P)<=R*Math.max(1,Math.abs(l),Math.abs(P))&&Math.abs(p-j)<=R*Math.max(1,Math.abs(p),Math.abs(j))&&Math.abs(M-F)<=R*Math.max(1,Math.abs(M),Math.abs(F))&&Math.abs(v-T)<=R*Math.max(1,Math.abs(v),Math.abs(T))&&Math.abs(m-A)<=R*Math.max(1,Math.abs(m),Math.abs(A))&&Math.abs(b-C)<=R*Math.max(1,Math.abs(b),Math.abs(C))},mul:r,sub:e};function _(){var t=new b(3);return b!=Float32Array&&(t[0]=0,t[1]=0,t[2]=0),t}function x(t,r,n){var e=new b(3);return e[0]=t,e[1]=r,e[2]=n,e}function O(t,r,n){return t[0]=r[0]+n[0],t[1]=r[1]+n[1],t[2]=r[2]+n[2],t}function a(t,r,n){var e=r[0],a=r[1],o=r[2],i=n[0],u=n[1],s=n[2];return t[0]=a*s-o*u,t[1]=o*i-e*s,t[2]=e*u-a*i,t}function S(t,r,n){var e=n[0],a=n[1],o=n[2],i=n[3],u=r[0],s=r[1],c=r[2],h=a*c-o*s,f=o*u-e*c,l=e*s-a*u,p=a*l-o*f,M=o*h-e*l,v=e*f-a*h,m=2*i;return h*=m,f*=m,l*=m,p*=2,M*=2,v*=2,t[0]=u+h+p,t[1]=s+f+M,t[2]=c+l+v,t}var o,q=function(t,r,n){return t[0]=r[0]-n[0],t[1]=r[1]-n[1],t[2]=r[2]-n[2],t},u=function(t){var r=t[0],n=t[1],e=t[2];return Math.sqrt(r*r+n*n+e*e)};o=_();var c;c=function(){var t=new b(4);return b!=Float32Array&&(t[0]=0,t[1]=0,t[2]=0,t[3]=0),t}();function P(){var t=new b(4);return b!=Float32Array&&(t[0]=0,t[1]=0,t[2]=0),t[3]=1,t}function j(t){return t[0]=0,t[1]=0,t[2]=0,t[3]=1,t}function f(t,r,n){n*=.5;var e=Math.sin(n);return t[0]=e*r[0],t[1]=e*r[1],t[2]=e*r[2],t[3]=Math.cos(n),t}function l(t,r,n){var e=r[0],a=r[1],o=r[2],i=r[3],u=n[0],s=n[1],c=n[2],h=n[3];return t[0]=e*h+i*u+a*c-o*s,t[1]=a*h+i*s+o*u-e*c,t[2]=o*h+i*c+e*s-a*u,t[3]=i*h-e*u-a*s-o*c,t}function p(t,r,n,e){var a,o,i,u,s,c=r[0],h=r[1],f=r[2],l=r[3],p=n[0],M=n[1],v=n[2],m=n[3];return(o=c*p+h*M+f*v+l*m)<0&&(o=-o,p=-p,M=-M,v=-v,m=-m),s=R<1-o?(a=Math.acos(o),i=Math.sin(a),u=Math.sin((1-e)*a)/i,Math.sin(e*a)/i):(u=1-e,e),t[0]=u*c+s*p,t[1]=u*h+s*M,t[2]=u*f+s*v,t[3]=u*l+s*m,t}function F(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=n*n+e*e+a*a+o*o,u=i?1/i:0;return t[0]=-n*u,t[1]=-e*u,t[2]=-a*u,t[3]=o*u,t}function M(t,r){var n,e=r[0]+r[4]+r[8];if(0<e)n=Math.sqrt(e+1),t[3]=.5*n,n=.5/n,t[0]=(r[5]-r[7])*n,t[1]=(r[6]-r[2])*n,t[2]=(r[1]-r[3])*n;else{var a=0;r[4]>r[0]&&(a=1),r[8]>r[3*a+a]&&(a=2);var o=(a+1)%3,i=(a+2)%3;n=Math.sqrt(r[3*a+a]-r[3*o+o]-r[3*i+i]+1),t[a]=.5*n,n=.5/n,t[3]=(r[3*o+i]-r[3*i+o])*n,t[o]=(r[3*o+a]+r[3*a+o])*n,t[i]=(r[3*i+a]+r[3*a+i])*n}return t}function T(t,r,n,e){var a=.5*Math.PI/180;r*=a,n*=a,e*=a;var o=Math.sin(r),i=Math.cos(r),u=Math.sin(n),s=Math.cos(n),c=Math.sin(e),h=Math.cos(e);return t[0]=o*s*h-i*u*c,t[1]=i*u*h+o*s*c,t[2]=i*s*c-o*u*h,t[3]=i*s*h+o*u*c,t}var A,C,k,I,N,D,V=function(t,r,n,e){var a=new b(4);return a[0]=t,a[1]=r,a[2]=n,a[3]=e,a},Z=l,H=function(t,r){var n=r[0],e=r[1],a=r[2],o=r[3],i=n*n+e*e+a*a+o*o;return 0<i&&(i=1/Math.sqrt(i)),t[0]=n*i,t[1]=e*i,t[2]=a*i,t[3]=o*i,t};A=_(),C=x(1,0,0),k=x(0,1,0),I=P(),N=P(),D=function(){var t=new b(9);return b!=Float32Array&&(t[1]=0,t[2]=0,t[3]=0,t[5]=0,t[6]=0,t[7]=0),t[0]=1,t[4]=1,t[8]=1,t}();function L(t,r){if("string"==typeof t){var n=r?r.querySelector(t):document.querySelector(t);if(!n)throw new Error(function(t){return'Element with selector "'+t+"\" doesn't exist."}(t));return n}if(t.nodeName&&1===t.nodeType)return t;throw new Error(function(t){return"Element should be provided in string or HTMLElement. Received: "+t}(t))}var X;X=function(){var t=new b(2);return b!=Float32Array&&(t[0]=0,t[1]=0),t}();function Y(r,n){Object.keys(n).forEach(function(t){r.style[t]=n[t]})}function Q(e){for(var t=[],r=1;r<arguments.length;r++)t[r-1]=arguments[r];return t.forEach(function(n){Object.keys(n).forEach(function(t){var r=n[t];e[t]=r})}),e}function W(t){var r=m();h(r,t);var n=r[0],e=r[4],a=r[1],o=r[5],i=r[2],u=r[6],s=r[10],c=_();return c[1]=Math.asin(-function(t,r,n){return Math.max(Math.min(t,n),r)}(i,-1,1)),Math.abs(i)<.99999?(c[0]=Math.atan2(u,s),c[2]=Math.atan2(a,n)):(c[0]=0,c[2]=Math.atan2(-e,o)),c.map(function(t){return function(t){return 180*t/Math.PI}(t)})}var B,G={width:"100%",height:"100%","transform-style":"preserve-3d",overflow:"hidden"},U={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},z={width:"100%",height:"100%","transform-style":"preserve-3d","will-change":"transform"},J="cc-viewport",K="cc-camera",$="cc-world",tt={position:[0,0,0],scale:[1,1,1],rotation:[0,0,0],perspective:0,rotateOffset:0},rt={property:"transform",timingFunction:"ease-out",delay:"0ms"};function nt(t,r){void 0===r&&(r={position:[0,0,0],scale:[1,1,1],rotation:[0,0,0],perspective:0,rotateOffset:0}),this._element=L(t);var n=Q(Q({},tt),r);this._position=x(n.position[0],n.position[1],n.position[2]),this._scale=x(n.scale[0],n.scale[1],n.scale[2]),this._rotation=x(n.rotation[0],n.rotation[1],n.rotation[2]),this._perspective=n.perspective,this._rotateOffset=n.rotateOffset,this._updateTimer=-1;var e=this._element,a=document.createElement("div"),o=a.cloneNode(),i=a.cloneNode();a.className=J,o.className=K,i.className=$,Y(a,G),Y(o,U),Y(i,z),o.appendChild(i),a.appendChild(o),this._viewportEl=a,this._cameraEl=o,this._worldEl=i,e.parentElement.insertBefore(a,e),i.appendChild(e)}return B=nt.prototype,Object.defineProperty(nt,"VERSION",{get:function(){return"1.0.0-rc"},enumerable:!0,configurable:!0}),Object.defineProperty(B,"element",{get:function(){return this._element},enumerable:!0,configurable:!0}),Object.defineProperty(B,"viewportEl",{get:function(){return this._viewportEl},enumerable:!0,configurable:!0}),Object.defineProperty(B,"cameraEl",{get:function(){return this._cameraEl},enumerable:!0,configurable:!0}),Object.defineProperty(B,"worldEl",{get:function(){return this._worldEl},enumerable:!0,configurable:!0}),Object.defineProperty(B,"position",{get:function(){return v(this._position)},set:function(t){this._position=x(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(B,"scale",{get:function(){return v(this._scale)},set:function(t){this._scale=x(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(B,"rotation",{get:function(){return v(this._rotation)},set:function(t){this._rotation=x(t[0],t[1],t[2])},enumerable:!0,configurable:!0}),Object.defineProperty(B,"quaternion",{get:function(){var t=this._rotation;return v(T(P(),t[0],t[1],t[2]))},set:function(t){this._rotation=W(V(t[0],t[1],t[2],t[3]))},enumerable:!0,configurable:!0}),Object.defineProperty(B,"perspective",{get:function(){return this._perspective},set:function(t){this._perspective=t},enumerable:!0,configurable:!0}),Object.defineProperty(B,"rotateOffset",{get:function(){return this._rotateOffset},set:function(t){this._rotateOffset=t},enumerable:!0,configurable:!0}),Object.defineProperty(B,"cameraCSS",{get:function(){var t=this._perspective,r=this._rotateOffset,n=this._rotation,e=this._scale;return"scale3d("+e[0]+", "+e[1]+", "+e[2]+") translateZ("+(t-r)+"px) rotateX("+n[0]+"deg) rotateY("+n[1]+"deg) rotateZ("+n[2]+"deg)"},enumerable:!0,configurable:!0}),Object.defineProperty(B,"worldCSS",{get:function(){var t=this._position;return"translate3d("+-t[0]+"px, "+-t[1]+"px, "+-t[2]+"px)"},enumerable:!0,configurable:!0}),B.focus=function(t){var r=L(t),n=this._getFocusMatrix(r),e=P(),a=_();y(e,n),i(a,n);var o=W(e);return function(t,r){t[0]=-r[0],t[1]=-r[1],t[2]=-r[2]}(o,o),this._rotation=o,this._position=a,this},B.translateLocal=function(t,r,n){void 0===t&&(t=0),void 0===r&&(r=0),void 0===n&&(n=0);var e=this._position,a=this._rotation,o=x(t,r,n),i=P();return T(i,-a[0],-a[1],-a[2]),S(o,o,i),O(e,e,o),this},B.translate=function(t,r,n){return void 0===t&&(t=0),void 0===r&&(r=0),void 0===n&&(n=0),O(this._position,this._position,x(t,r,n)),this},B.rotate=function(t,r,n){return void 0===t&&(t=0),void 0===r&&(r=0),void 0===n&&(n=0),O(this._rotation,this._rotation,x(t,r,n)),this},B.update=function(i,u){return void 0===i&&(i=0),void 0===u&&(u={property:"transform",timingFunction:"ease-out",delay:"0ms"}),function(o,i,u,s){return new(u||(u=Promise))(function(t,r){function n(t){try{a(s.next(t))}catch(t){r(t)}}function e(t){try{a(s.throw(t))}catch(t){r(t)}}function a(r){r.done?t(r.value):new u(function(t){t(r.value)}).then(n,e)}a((s=s.apply(o,i||[])).next())})}(this,void 0,Promise,function(){var n,r,e,a,o=this;return t(this,function(t){return Y(this._viewportEl,{perspective:this.perspective+"px"}),Y(this._cameraEl,{transform:this.cameraCSS}),Y(this._worldEl,{transform:this.worldCSS}),n=Q(Q({},rt),u),0<i&&(0<this._updateTimer&&window.clearTimeout(this._updateTimer),r=i+"ms",e=Object.keys(n).reduce(function(t,r){return t["transition"+(r.charAt(0).toUpperCase()+r.slice(1))]=n[r],t},{}),a=s({transitionDuration:r},e),[this._viewportEl,this._cameraEl,this._worldEl].forEach(function(t){Y(t,a)})),[2,new Promise(function(t){0<i?o._updateTimer=window.setTimeout(function(){[o._viewportEl,o._cameraEl,o._worldEl].forEach(function(t){Y(t,{transition:""})}),o._updateTimer=-1,t()},i):requestAnimationFrame(function(){t()})})]})})},B._getFocusMatrix=function(t){for(var f=[];t&&(f.push(t),t!==this._element);)t=t.parentElement;f.reverse();var r=f.map(function(t){return window.getComputedStyle(t)}),n=function(t,r){for(var n=0;n<t.length;n+=1){var e=t[n];if(e&&r(e))return n}return-1}(r,function(t){return"preserve-3d"!==t.transformStyle});0<n&&r.splice(n+1);var l={left:0,top:0,width:this.viewportEl.offsetWidth,height:this.viewportEl.offsetHeight},p=j(P()),M=x(0,0,0);r.forEach(function(t,r){var n=f[r],e={left:n.offsetLeft,top:n.offsetTop,width:n.offsetWidth,height:n.offsetHeight},a=function(t){var r=t.getPropertyValue("transform"),n=/\(((\s|\S)+)\)/.exec(r),e=n?n[1].split(",").map(function(t){return parseFloat(t)}):[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1];if(16===e.length)return d.apply(g,v(e));var a=m();return E(a),a[0]=e[0],a[1]=e[1],a[4]=e[2],a[5]=e[3],a[12]=e[4],a[13]=e[5],a}(t),o=function(t,r){return x(t.left+(t.width-r.width)/2,t.top+(t.height-r.height)/2,0)}(e,l);S(o,o,p),O(M,M,o);var i=function(t,r){var n=t.transformOrigin.split(" ").map(function(t){return parseFloat(t.substring(0,t.length-2))});return x(n[0]-r.width/2,n[1]-r.height/2,0)}(t,e);S(i,i,p);var u=function(t){var r=new b(3);return r[0]=t[0],r[1]=t[1],r[2]=t[2],r}(M);O(u,u,i);var s=_();q(s,M,u),S(s,s,F(P(),p)),function(t,r,n){var e=r[0],a=r[1],o=r[2],i=n[3]*e+n[7]*a+n[11]*o+n[15];i=i||1,t[0]=(n[0]*e+n[4]*a+n[8]*o+n[12])/i,t[1]=(n[1]*e+n[5]*a+n[9]*o+n[13])/i,t[2]=(n[2]*e+n[6]*a+n[10]*o+n[14])/i}(s,s,a),S(s,s,p);var c=O(_(),u,s),h=y(P(),a);!function(t,r){t[0]=r[0],t[1]=r[1],t[2]=r[2]}(M,c),Z(p,p,h),l=e});var e=x(0,0,this.perspective);S(e,e,p),O(M,M,e);var a=m();return w(a,p,M),a},nt});
 //# sourceMappingURL=css-camera.pkgd.min.js.map

lib/CSSCamera.js

@@ -8,3 +8,9 @@ import * as tslib_1 from "tslib";
     function CSSCamera(el, options) {
-        if (options === void 0) { options = {}; }
+        if (options === void 0) { options = {
+            position: [0, 0, 0],
+            scale: [1, 1, 1],
+            rotation: [0, 0, 0],
+            perspective: 0,
+            rotateOffset: 0,
+        }; }
         this._element = getElement(el);
@@ -160,5 +166,5 @@ var op = assign(assign({}, DEFAULT.OPTIONS), options);
     };
-    CSSCamera.prototype.update = function (duration, option) {
+    CSSCamera.prototype.update = function (duration, options) {
         if (duration === void 0) { duration = 0; }
-        if (option === void 0) { option = {
+        if (options === void 0) { options = {
             property: 'transform',
@@ -169,3 +175,3 @@ timingFunction: 'ease-out',
         return tslib_1.__awaiter(this, void 0, void 0, function () {
-            var transitionDuration, updateOption, finalOption_1;
+            var updateOptions, transitionDuration, updateOption, finalOption_1;
             var _this = this;
@@ -176,2 +182,3 @@ return tslib_1.__generator(this, function (_a) {
                 applyCSS(this._worldEl, { transform: this.worldCSS });
+                updateOptions = assign(assign({}, DEFAULT.UPDATE_OPTIONS), options);
                 if (duration > 0) {
@@ -182,5 +189,5 @@ if (this._updateTimer > 0) {
                     transitionDuration = duration + "ms";
-                    updateOption = Object.keys(option).reduce(function (options, key) {
-                        options["transition" + (key.charAt(0).toUpperCase() + key.slice(1))] = option[key];
-                        return options;
+                    updateOption = Object.keys(updateOptions).reduce(function (option, key) {
+                        option["transition" + (key.charAt(0).toUpperCase() + key.slice(1))] = updateOptions[key];
+                        return option;
                     }, {});
@@ -187,0 +194,0 @@ finalOption_1 = tslib_1.__assign({ transitionDuration: transitionDuration }, updateOption);

lib/declaration/constants/default.d.ts

@@ -33,1 +33,6 @@ export declare const STYLE: {
 };
+export declare const UPDATE_OPTIONS: {
+    property: string;
+    timingFunction: string;
+    delay: string;
+};

lib/declaration/CSSCamera.d.ts

@@ -31,5 +31,5 @@ import { UpdateOption, Options } from './types';
     rotate(x?: number, y?: number, z?: number): this;
-    update(duration?: number, option?: Partial<UpdateOption>): Promise<this>;
+    update(duration?: number, options?: Partial<UpdateOption>): Promise<this>;
     private _getFocusMatrix;
 }
 export default CSSCamera;

package.json

 {
   "name": "css-camera",
-  "version": "1.0.0-rc",
+  "version": "1.0.0",
   "description": "Add a depth to your web page with CSS3 3D transform.",
@@ -5,0 +5,0 @@ "main": "lib/css-camera.js",

src/constants/default.ts

@@ -35,1 +35,7 @@ export const STYLE = {
 };
+
+export const UPDATE_OPTIONS = {
+  property: 'transform',
+  timingFunction: 'ease-out',
+  delay: '0ms',
+};

src/CSSCamera.ts

@@ -78,3 +78,3 @@ import { mat4, vec3, quat } from 'gl-matrix';
   /**
-   * The current euler rotation as number array([x, y, z]).
+   * The current Euler rotation angles in degree as number array([x, y, z]).
    * @example
@@ -120,2 +120,4 @@ * const camera = new CSSCamera(el);
    * The camera will be as far away from the focal point as this value.
+   * |![rot0](https://woodneck.github.io/css-camera/asset/rot0.gif)|![rot150](https://woodneck.github.io/css-camera/asset/rot150.gif)|
+   * |:---:|:---:|
    * @example
@@ -176,2 +178,14 @@ * const camera = new CSSCamera(el);
    * @param - The element to apply camera. Can be HTMLElement or CSS selector.
+   * @param {Partial<Options>} [options] Camera options
+   * @param {number[]} [options.position=[0, 0, 0]] Initial position of the camera.
+   * @param {number[]} [options.scale=[1, 1, 1]] Initial scale of the camera.
+   * @param {number[]} [options.rotation=[0, 0, 0]] Initial Euler rotation angles(x, y, z) of the camera in degree.
+   * @param {number} [options.perspective=0] Initial perspective of the camera.
+   * @param {number} [options.rotateOffset=0] Initial rotate offset of the camera.
+   * @example
+   * const camera = new CSSCamera("#el", {
+   *   position: [0, 0, 150], // Initial pos(x, y, z)
+   *   rotation: [90, 0, 0],  // Initial rotation(x, y, z, in degree)
+   *   perspective: 300       // CSS "perspective" value to apply
+   * });
    */
@@ -302,11 +316,17 @@ constructor(el: string | HTMLElement, options: Partial<Options> = {}) {
    * console.log(camera.cameraEl.style.transform); // scale3d(1, 1, 1) translateZ(300px) rotateX(0deg) rotateY(90deg) rotateZ(0deg)
+   *
+   * // When if you want to apply multiple properties
+   * camera.update(1000, {
+   *   property: "transform, background-color",
+   *   timingFunction: "ease-out, ease-out", // As same with CSS, you should assign values to each property
+   *   delay: "0ms, 100ms"
+   * });
    * @param - Transition duration in ms.
-   * @param - Transition options.
+   * @param {Partial<UpdateOption>} [options] Transition options.
+   * @param {string} [options.property="transform"] CSS [transition-property](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-property) to apply.
+   * @param {string} [options.timingFunction="ease-out"] CSS [transition-timing-function](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-timing-function) to apply.
+   * @param {string} [options.delay="0ms"] CSS [transition-delay](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-delay) to apply.
    * @return {Promise<CSSCamera>} A promise resolving instance itself
    */
-  public async update(duration: number = 0, option: Partial<UpdateOption> = {
-    property: 'transform',
-    timingFunction: 'ease-out',
-    delay: '0ms',
-  }): Promise<this> {
+  public async update(duration: number = 0, options: Partial<UpdateOption> = {}): Promise<this> {
     applyCSS(this._viewportEl, { perspective: `${this.perspective}px` });
@@ -316,2 +336,4 @@ applyCSS(this._cameraEl, { transform: this.cameraCSS });
 
+    const updateOptions = assign(assign({}, DEFAULT.UPDATE_OPTIONS), options) as UpdateOption;
+
     if (duration > 0) {
@@ -323,5 +345,5 @@ if (this._updateTimer > 0) {
       const transitionDuration = `${duration}ms`;
-      const updateOption = Object.keys(option).reduce((options: {[key: string]: ValueOf<UpdateOption>}, key) => {
-        options[`transition${key.charAt(0).toUpperCase() + key.slice(1)}`] = option[key as keyof UpdateOption]!;
-        return options;
+      const updateOption = Object.keys(updateOptions).reduce((option: {[key: string]: ValueOf<UpdateOption>}, key) => {
+        option[`transition${key.charAt(0).toUpperCase() + key.slice(1)}`] = updateOptions[key as keyof UpdateOption]!;
+        return option;
       }, {});
@@ -328,0 +350,0 @@

src/types.ts

@@ -12,7 +12,7 @@ export type ValueOf<T> = T[keyof T];
  * @typedef
- * @property {Array<number>} [position=[0, 0, 0]] - Initial position of the camera.
- * @property {Array<number>} [scale=[1, 1, 1]] - Initial scale of the camera.
- * @property {Array<number>} [rotation=[0, 0, 0]] - Initial rotation(x, y, z) of the camera.
- * @property {number} [perspective=0] - Initial perspective of the camera.
- * @property {number} [rotateOffset=0] - Initial rotate offset of the camera.
+ * @property - Initial position of the camera.
+ * @property - Initial scale of the camera.
+ * @property - Initial Euler rotation angles(x, y, z) of the camera in degree.
+ * @property - Initial perspective of the camera.
+ * @property - Initial rotate offset of the camera.
  */
@@ -36,12 +36,5 @@ export interface Options {
  * @typedef
- * @property {string} [property="transform"] - CSS [transition-property](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-property) to apply.
- * @property {string} [timingFunction="ease-out"] - CSS [transition-timing-function](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-timing-function) to apply.
- * @property {string} [delay="0ms"] - CSS [transition-delay](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-delay) to apply.
- * @example
- * // When if you want to apply multiple properties
- * camera.update(1000, {
- *   property: "transform, background-color",
- *   timingFunction: "ease-out, ease-out", // As same with CSS, you should assign values to each property
- *   delay: "0ms, 100ms"
- * });
+ * @property - CSS [transition-property](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-property) to apply.
+ * @property - CSS [transition-timing-function](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-timing-function) to apply.
+ * @property - CSS [transition-delay](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-delay) to apply.
  */
@@ -48,0 +41,0 @@ export interface UpdateOption {

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

11329856

increased by345.25%

Number of package files

92

increased by2.22%

Lines of code

7301

increased by1%

Number of low quality alerts

1

decreased by-50%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes