isometric-css - npm Package Compare versions

Comparing version 2.1.0 to 2.1.1

CHANGELOG.md

 # Changelog
 
+## [2.1.1] - 2021-03-21
+
+- Fix error using the library directly from the browser
+
 ## [2.1.0] - 2021-03-19
@@ -4,0 +8,0 @@

index.js

@@ -1,1 +0,1 @@
-!function(t,e){for(var r in e)t[r]=e[r];e.__esModule&&Object.defineProperty(t,"__esModule",{value:!0})}(exports,(()=>{"use strict";var t={506:(t,e,r)=>{r.r(e),r.d(e,{default:()=>o});const o=function(t){for(var e,r=0,o=0,n=t.length;n>=4;++o,n-=4)e=1540483477*(65535&(e=255&t.charCodeAt(o)|(255&t.charCodeAt(++o))<<8|(255&t.charCodeAt(++o))<<16|(255&t.charCodeAt(++o))<<24))+(59797*(e>>>16)<<16),r=1540483477*(65535&(e^=e>>>24))+(59797*(e>>>16)<<16)^1540483477*(65535&r)+(59797*(r>>>16)<<16);switch(n){case 3:r^=(255&t.charCodeAt(o+2))<<16;case 2:r^=(255&t.charCodeAt(o+1))<<8;case 1:r=1540483477*(65535&(r^=255&t.charCodeAt(o)))+(59797*(r>>>16)<<16)}return(((r=1540483477*(65535&(r^=r>>>13))+(59797*(r>>>16)<<16))^r>>>15)>>>0).toString(36)}},158:function(t,e,r){var o=this&&this.__assign||function(){return(o=Object.assign||function(t){for(var e,r=1,o=arguments.length;r<o;r++)for(var n in e=arguments[r])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t}).apply(this,arguments)};Object.defineProperty(e,"__esModule",{value:!0});var n=r(37),a=r(539),i=r(995),s=function(){function t(){this._elements=new Map,this._classes=new Map,this._styles=new i.Styles}return t.prototype.removeClasses=function(t,e){t.classList.remove(e);var r=this._classes.get(e),o=r.findIndex((function(e){return e===t}));r.splice(o,1),0===r.length&&(this._classes.delete(e),this._styles.remove(e))},t.prototype.process=function(t,e){var r=this._elements.get(t),o=this._styles.getRuleData(e);if(r){if(r.selector===o.selector)return;this.removeClasses(t,r.selector)}t.classList.add(o.selector);var n=this._classes.get(o.selector);n?n.push(t):(this._styles.insert(o.selector,o.declaration),this._classes.set(o.selector,[t])),this._elements.set(t,{plane:e,selector:o.selector,rule:o.rule})},t.prototype.addElement=function(t){var e=a.getPlaneFromElement(t);this.process(t,e)},t.prototype.removeElement=function(t){a.resetElementIsometricData(t);var e=this._elements.get(t);e&&(this._elements.delete(t),this.removeClasses(t,e.selector))},t.prototype.setElementView=function(t,e){if(e===n.VIEW.top||e===n.VIEW.front||e===n.VIEW.side){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{view:e}):{view:e,parentRotations:a.getParentRotations(t)})}},t.prototype.setElementPosition=function(t,e){if(+e.right||+e.left||+e.top){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{position:o(o({},r.plane.position),e)}):{position:e,parentRotations:a.getParentRotations(t)})}},t.prototype.setElementRotation=function(t,e){if((e.axis===n.AXIS.right||e.axis===n.AXIS.left||e.axis===n.AXIS.top)&&+e.value){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{rotation:e}):{rotation:e,parentRotations:a.getParentRotations(t)})}},t.prototype.setElementTexture=function(t,e){if(!("string"!=typeof e.url||e.size&&"string"!=typeof e.size||e.pixelated&&"boolean"!=typeof e.pixelated)){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{texture:o(o({},r.plane.texture),e)}):{texture:e,parentRotations:a.getParentRotations(t)})}},t}();e.default=new s},995:function(t,e,r){var o=this&&this.__assign||function(){return(o=Object.assign||function(t){for(var e,r=1,o=arguments.length;r<o;r++)for(var n in e=arguments[r])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t}).apply(this,arguments)};Object.defineProperty(e,"__esModule",{value:!0}),e.Styles=void 0;var n=r(506),a=r(37),i=r(821),s=r(854),l=r(361),u=function(){function t(){this._style=null,this.scale=s.round(a.SCALE),this.P50="50%",this.transformBefore="translate(-"+this.P50+", -"+this.P50+")",this.tranformAfterTop="translate(-"+this.P50+", "+this.P50+")",this.transformAfterFront="translate(-"+this.P50+", -"+this.P50+")",this.transformAfterSide="translate("+this.P50+", -"+this.P50+")",this.baseDeclarations={position:"absolute"},this.transformOriginDeclarations={transformOrigin:this.P50+" "+this.P50,MsTransformOrigin:this.P50+" "+this.P50,WebkitTransformOrigin:this.P50+" "+this.P50}}return Object.defineProperty(t.prototype,"sheet",{get:function(){return this._style?this._style.sheet:null},enumerable:!1,configurable:!0}),t.prototype.getTransform=function(t,e,r){var o=l.getViewMatrix(t,e,r);if(!o)return null;var n="matrix("+s.round(o[0][0])+","+s.round(o[1][0])+","+s.round(o[0][1])+","+s.round(o[1][1])+",0,0)",i=this.transformBefore+" "+n+" scale("+this.scale+")";switch(t){case a.VIEW.top:return i+" "+this.tranformAfterTop;case a.VIEW.front:return i+" "+this.transformAfterFront;case a.VIEW.side:return i+" "+this.transformAfterSide}},t.prototype.declarationString=function(t){var e=this;return Object.entries(t).reduce((function(t,r){return Array.isArray(r[1])?t+"\n    "+r[1].map((function(t){return e.declarationString(t)})).join("\n"):t+"\n    "+i.kebab(r[0])+": "+r[1]+";"}),"")},t.prototype.tranformPlaneToRule=function(t){var e=this.getTransform(t.view,t.parentRotations,t.rotation),r=e?o(o(o({},this.baseDeclarations),this.transformOriginDeclarations),{transform:e,MsTransform:e,WebkitTransform:e}):o({},this.baseDeclarations);if(t.position){var n=s.isometricToPoint(t.position,t.parentRotations);r.left=n.x+"px",r.top=n.y+"px"}return t.texture&&(r.backgroundImage='url("'+t.texture.url+'")',r.backgroundSize=t.texture.size||"cover",t.texture.pixelated&&(r.MsInterpolationMode="nearest-neighbor",r.imageRendering="pixelated",r.fallbacks=[{imageRendering:"crisp-edges"}])),r},t.prototype.init=function(){this._style=document.createElement("style"),this._style.dataset.isometric="",document.getElementsByTagName("head")[0].appendChild(this._style)},t.prototype.getRule=function(t){return this.tranformPlaneToRule(t)},t.prototype.getDeclarationString=function(t){return this.declarationString(t)},t.prototype.getSelector=function(t){return a.NAMESPACE+"-"+n.default(t)},t.prototype.getRuleData=function(t){var e=this.getRule(t),r=this.getDeclarationString(e);return{rule:e,declaration:r,selector:this.getSelector(r)}},t.prototype.insert=function(t,e){this.sheet||this.init(),this.sheet.insertRule("."+t+" {\n"+e+"\n}")},t.prototype.remove=function(t){var e=this;Array.prototype.some.call(this.sheet.cssRules,(function(r,o){return!(!r||r.selectorText.slice(1)!==t||(e.sheet.deleteRule(o),0))}))},t}();e.Styles=u},37:(t,e)=>{var r,o;Object.defineProperty(e,"__esModule",{value:!0}),e.TYPE_UNDEFINED=e.AXIS=e.VIEW=e.ROT_CMA=e.ROT_45=e.ROT_60=e.SCALE=e.HSQRT3=e.DECIMALS=e.NAMESPACE=void 0,e.NAMESPACE="isometric",e.DECIMALS=6,e.HSQRT3=+(Math.sqrt(3)/2).toFixed(e.DECIMALS),e.SCALE=Math.sqrt(1.5),e.ROT_60=Math.PI/3,e.ROT_45=Math.PI/4,e.ROT_CMA=Math.atan(Math.SQRT2),(o=e.VIEW||(e.VIEW={})).top="top",o.front="front",o.side="side",(r=e.AXIS||(e.AXIS={})).right="right",r.left="left",r.top="top",e.TYPE_UNDEFINED="undefined"},607:(t,e,r)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.IsometricCSS=void 0;var o=r(37),n=r(158);e.IsometricCSS={processDOM:function(){Array.prototype.forEach.call(document.querySelectorAll("."+o.NAMESPACE),(function(t){n.default.addElement(t)}))},processElement:function(t){n.default.addElement(t)},resetElement:function(t){n.default.removeElement(t)},setView:function(t,e){n.default.setElementView(t,e)},setRotation:function(t,e){n.default.setElementRotation(t,e)},setPosition:function(t,e){n.default.setElementPosition(t,e)},setTexture:function(t,e){n.default.setElementTexture(t,e)}},typeof window!==o.TYPE_UNDEFINED&&typeof document!==o.TYPE_UNDEFINED&&(window.IsometricCSS=e.IsometricCSS,window.addEventListener("DOMContentLoaded",(function(){e.IsometricCSS.processDOM()})))},539:(t,e,r)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.resetElementIsometricData=e.getPlaneFromElement=e.getParentRotations=void 0;var o=r(37);e.getParentRotations=function(t){for(var e=[];t.parentElement&&t.parentElement!==document.documentElement;){var r=t.parentElement;r.classList.contains(o.NAMESPACE)&&!r.dataset.view&&r.dataset.rotationAxis&&e.push({axis:r.dataset.rotationAxis,value:+(r.dataset.rotationValue||0)}),t=t.parentElement}return e},e.getPlaneFromElement=function(t){var r=t.dataset.view?t.dataset.view:null,o=+(t.dataset.right||0),n=+(t.dataset.left||0),a=+(t.dataset.top||0),i=t.dataset.rotationAxis?t.dataset.rotationAxis:null,s=+(t.dataset.rotationValue||0),l=t.dataset.texture,u=t.dataset.textureSize||"cover",c="true"===t.dataset.texturePixelated,f={parentRotations:e.getParentRotations(t)};return r&&(f.view=r),(o||n||a)&&(f.position={right:o,left:n,top:a}),i&&s&&(f.rotation={axis:i,value:s}),l&&(f.texture={url:l,size:u,pixelated:c}),f},e.resetElementIsometricData=function(t){t.classList.remove(o.NAMESPACE),function(t,e){["view","right","left","top","rotationAxis","rotationValue","texture","textureSize","texturePixelated"].forEach((function(e){t.dataset[e]&&delete t.dataset[e]}))}(t)}},854:function(t,e,r){var o=this&&this.__spreadArrays||function(){for(var t=0,e=0,r=arguments.length;e<r;e++)t+=arguments[e].length;var o=Array(t),n=0;for(e=0;e<r;e++)for(var a=arguments[e],i=0,s=a.length;i<s;i++,n++)o[n]=a[i];return o};Object.defineProperty(e,"__esModule",{value:!0}),e.isometricToPoint=e.rotatePoint=e.sincos=e.radian=e.round=void 0;var n=r(37);e.round=function(t){var e=Math.pow(10,n.DECIMALS);return Math.round(t*e)/e},e.radian=function(t){return t*Math.PI/180},e.sincos=function(t){return{sin:e.round(Math.sin(t)),cos:e.round(Math.cos(t))}},e.rotatePoint=function(t,r,o){var n=Math.sqrt(Math.pow(t,2)+Math.pow(r,2)),a=Math.atan2(r,t)+e.radian(o);return{x:Math.cos(a)*n,y:Math.sin(a)*n}},e.isometricToPoint=function(t,r){var a=t.right,i=void 0===a?0:a,s=t.left,l=void 0===s?0:s,u=t.top,c=void 0===u?0:u;return r&&r.length&&o(r).reverse().forEach((function(t){switch(t.axis){case n.AXIS.top:var r=e.rotatePoint(i,l,t.value);i=r.x,l=r.y;break;case n.AXIS.right:r=e.rotatePoint(l,c,t.value),l=r.x,c=r.y;break;case n.AXIS.left:r=e.rotatePoint(c,i,t.value),c=r.x,i=r.y}})),{x:e.round((i-l)*n.HSQRT3),y:e.round((i+l)/2-c)}}},361:function(t,e,r){var o=this&&this.__spreadArrays||function(){for(var t=0,e=0,r=arguments.length;e<r;e++)t+=arguments[e].length;var o=Array(t),n=0;for(e=0;e<r;e++)for(var a=arguments[e],i=0,s=a.length;i<s;i++,n++)o[n]=a[i];return o};Object.defineProperty(e,"__esModule",{value:!0}),e.getViewMatrix=e.rotationToRotationMatrix=e.sideMatrix=e.frontMatrix=e.topMatrix=e.rotateZ=e.rotateY=e.rotateX=e.multiplyMatrices=e.multiplyMatrix=void 0;var n=r(37),a=r(854);e.multiplyMatrix=function(t,e){return t.map((function(r,o){return e[0].map((function(n,a){return r.reduce((function(r,n,i){return r+t[o][i]*e[i][a]}),0)}))}))},e.multiplyMatrices=function(){for(var t=[],r=0;r<arguments.length;r++)t[r]=arguments[r];for(var o=t[0],n=1;n<t.length;n++)o=e.multiplyMatrix(o,t[n]);return o},e.rotateX=function(t){var e=a.sincos(t);return[[1,0,0],[0,e.cos,-e.sin],[0,e.sin,e.cos]]},e.rotateY=function(t){var e=a.sincos(t);return[[e.cos,0,e.sin],[0,1,0],[-e.sin,0,e.cos]]},e.rotateZ=function(t){var e=a.sincos(t);return[[e.cos,-e.sin,0],[e.sin,e.cos,0],[0,0,1]]},e.topMatrix=e.multiplyMatrices(e.rotateX(n.ROT_CMA),e.rotateZ(-n.ROT_45)),e.frontMatrix=e.multiplyMatrices(e.rotateZ(-n.ROT_60),e.rotateX(n.ROT_CMA),e.rotateZ(n.ROT_45)),e.sideMatrix=e.multiplyMatrices(e.rotateZ(n.ROT_60),e.rotateX(n.ROT_CMA),e.rotateZ(-n.ROT_45)),e.rotationToRotationMatrix=function(t,r){var o=a.radian(r.value);switch(t){case n.VIEW.top:switch(r.axis){case n.AXIS.top:return e.rotateZ(o);case n.AXIS.left:return e.rotateX(-o);case n.AXIS.right:return e.rotateY(o);default:return null}case n.VIEW.front:switch(r.axis){case n.AXIS.top:return e.rotateY(o);case n.AXIS.left:return e.rotateX(o);case n.AXIS.right:return e.rotateZ(o);default:return null}case n.VIEW.side:switch(r.axis){case n.AXIS.top:return e.rotateY(o);case n.AXIS.left:return e.rotateZ(o);case n.AXIS.right:return e.rotateX(-o);default:return null}default:return null}},e.getViewMatrix=function(t,r,a){var i=[];r.forEach((function(r){var o=e.rotationToRotationMatrix(t,r);o&&i.push(o)}));var s=a?e.rotationToRotationMatrix(t,a):null;switch(s&&i.push(s),t){case n.VIEW.top:return e.multiplyMatrices.apply(void 0,o([e.topMatrix],i));case n.VIEW.front:return e.multiplyMatrices.apply(void 0,o([e.frontMatrix],i));case n.VIEW.side:return e.multiplyMatrices.apply(void 0,o([e.sideMatrix],i))}return null}},821:(t,e)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.kebab=void 0,e.kebab=function(t){return t.replace(/[A-Z]/g,"-$&").toLowerCase()}}},e={};function r(o){if(e[o])return e[o].exports;var n=e[o]={exports:{}};return t[o].call(n.exports,n,n.exports,r),n.exports}return r.d=(t,e)=>{for(var o in e)r.o(e,o)&&!r.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:e[o]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r(607)})());
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports["isometric-css"]=e():t["isometric-css"]=e()}(this,(function(){return(()=>{"use strict";var t={506:(t,e,r)=>{r.r(e),r.d(e,{default:()=>o});const o=function(t){for(var e,r=0,o=0,n=t.length;n>=4;++o,n-=4)e=1540483477*(65535&(e=255&t.charCodeAt(o)|(255&t.charCodeAt(++o))<<8|(255&t.charCodeAt(++o))<<16|(255&t.charCodeAt(++o))<<24))+(59797*(e>>>16)<<16),r=1540483477*(65535&(e^=e>>>24))+(59797*(e>>>16)<<16)^1540483477*(65535&r)+(59797*(r>>>16)<<16);switch(n){case 3:r^=(255&t.charCodeAt(o+2))<<16;case 2:r^=(255&t.charCodeAt(o+1))<<8;case 1:r=1540483477*(65535&(r^=255&t.charCodeAt(o)))+(59797*(r>>>16)<<16)}return(((r=1540483477*(65535&(r^=r>>>13))+(59797*(r>>>16)<<16))^r>>>15)>>>0).toString(36)}},158:function(t,e,r){var o=this&&this.__assign||function(){return(o=Object.assign||function(t){for(var e,r=1,o=arguments.length;r<o;r++)for(var n in e=arguments[r])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t}).apply(this,arguments)};Object.defineProperty(e,"__esModule",{value:!0});var n=r(37),i=r(539),a=r(995),s=function(){function t(){this._elements=new Map,this._classes=new Map,this._styles=new a.Styles}return t.prototype.removeClasses=function(t,e){t.classList.remove(e);var r=this._classes.get(e),o=r.findIndex((function(e){return e===t}));r.splice(o,1),0===r.length&&(this._classes.delete(e),this._styles.remove(e))},t.prototype.process=function(t,e){var r=this._elements.get(t),o=this._styles.getRuleData(e);if(r){if(r.selector===o.selector)return;this.removeClasses(t,r.selector)}t.classList.add(o.selector);var n=this._classes.get(o.selector);n?n.push(t):(this._styles.insert(o.selector,o.declaration),this._classes.set(o.selector,[t])),this._elements.set(t,{plane:e,selector:o.selector,rule:o.rule})},t.prototype.addElement=function(t){var e=i.getPlaneFromElement(t);this.process(t,e)},t.prototype.removeElement=function(t){i.resetElementIsometricData(t);var e=this._elements.get(t);e&&(this._elements.delete(t),this.removeClasses(t,e.selector))},t.prototype.setElementView=function(t,e){if(e===n.VIEW.top||e===n.VIEW.front||e===n.VIEW.side){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{view:e}):{view:e,parentRotations:i.getParentRotations(t)})}},t.prototype.setElementPosition=function(t,e){if(+e.right||+e.left||+e.top){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{position:o(o({},r.plane.position),e)}):{position:e,parentRotations:i.getParentRotations(t)})}},t.prototype.setElementRotation=function(t,e){if((e.axis===n.AXIS.right||e.axis===n.AXIS.left||e.axis===n.AXIS.top)&&+e.value){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{rotation:e}):{rotation:e,parentRotations:i.getParentRotations(t)})}},t.prototype.setElementTexture=function(t,e){if(!("string"!=typeof e.url||e.size&&"string"!=typeof e.size||e.pixelated&&"boolean"!=typeof e.pixelated)){var r=this._elements.get(t);this.process(t,r?o(o({},r.plane),{texture:o(o({},r.plane.texture),e)}):{texture:e,parentRotations:i.getParentRotations(t)})}},t}();e.default=new s},995:function(t,e,r){var o=this&&this.__assign||function(){return(o=Object.assign||function(t){for(var e,r=1,o=arguments.length;r<o;r++)for(var n in e=arguments[r])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t}).apply(this,arguments)};Object.defineProperty(e,"__esModule",{value:!0}),e.Styles=void 0;var n=r(506),i=r(37),a=r(821),s=r(854),l=r(361),u=function(){function t(){this._style=null,this.scale=s.round(i.SCALE),this.P50="50%",this.transformBefore="translate(-"+this.P50+", -"+this.P50+")",this.tranformAfterTop="translate(-"+this.P50+", "+this.P50+")",this.transformAfterFront="translate(-"+this.P50+", -"+this.P50+")",this.transformAfterSide="translate("+this.P50+", -"+this.P50+")",this.baseDeclarations={position:"absolute"},this.transformOriginDeclarations={transformOrigin:this.P50+" "+this.P50,MsTransformOrigin:this.P50+" "+this.P50,WebkitTransformOrigin:this.P50+" "+this.P50}}return Object.defineProperty(t.prototype,"sheet",{get:function(){return this._style?this._style.sheet:null},enumerable:!1,configurable:!0}),t.prototype.getTransform=function(t,e,r){var o=l.getViewMatrix(t,e,r);if(!o)return null;var n="matrix("+s.round(o[0][0])+","+s.round(o[1][0])+","+s.round(o[0][1])+","+s.round(o[1][1])+",0,0)",a=this.transformBefore+" "+n+" scale("+this.scale+")";switch(t){case i.VIEW.top:return a+" "+this.tranformAfterTop;case i.VIEW.front:return a+" "+this.transformAfterFront;case i.VIEW.side:return a+" "+this.transformAfterSide}},t.prototype.declarationString=function(t){var e=this;return Object.entries(t).reduce((function(t,r){return Array.isArray(r[1])?t+"\n    "+r[1].map((function(t){return e.declarationString(t)})).join("\n"):t+"\n    "+a.kebab(r[0])+": "+r[1]+";"}),"")},t.prototype.tranformPlaneToRule=function(t){var e=this.getTransform(t.view,t.parentRotations,t.rotation),r=e?o(o(o({},this.baseDeclarations),this.transformOriginDeclarations),{transform:e,MsTransform:e,WebkitTransform:e}):o({},this.baseDeclarations);if(t.position){var n=s.isometricToPoint(t.position,t.parentRotations);r.left=n.x+"px",r.top=n.y+"px"}return t.texture&&(r.backgroundImage='url("'+t.texture.url+'")',r.backgroundSize=t.texture.size||"cover",t.texture.pixelated&&(r.MsInterpolationMode="nearest-neighbor",r.imageRendering="pixelated",r.fallbacks=[{imageRendering:"crisp-edges"}])),r},t.prototype.init=function(){this._style=document.createElement("style"),this._style.dataset.isometric="",document.getElementsByTagName("head")[0].appendChild(this._style)},t.prototype.getRule=function(t){return this.tranformPlaneToRule(t)},t.prototype.getDeclarationString=function(t){return this.declarationString(t)},t.prototype.getSelector=function(t){return i.NAMESPACE+"-"+n.default(t)},t.prototype.getRuleData=function(t){var e=this.getRule(t),r=this.getDeclarationString(e);return{rule:e,declaration:r,selector:this.getSelector(r)}},t.prototype.insert=function(t,e){this.sheet||this.init(),this.sheet.insertRule("."+t+" {\n"+e+"\n}")},t.prototype.remove=function(t){var e=this;Array.prototype.some.call(this.sheet.cssRules,(function(r,o){return!(!r||r.selectorText.slice(1)!==t||(e.sheet.deleteRule(o),0))}))},t}();e.Styles=u},37:(t,e)=>{var r,o;Object.defineProperty(e,"__esModule",{value:!0}),e.TYPE_UNDEFINED=e.AXIS=e.VIEW=e.ROT_CMA=e.ROT_45=e.ROT_60=e.SCALE=e.HSQRT3=e.DECIMALS=e.NAMESPACE=void 0,e.NAMESPACE="isometric",e.DECIMALS=6,e.HSQRT3=+(Math.sqrt(3)/2).toFixed(e.DECIMALS),e.SCALE=Math.sqrt(1.5),e.ROT_60=Math.PI/3,e.ROT_45=Math.PI/4,e.ROT_CMA=Math.atan(Math.SQRT2),(o=e.VIEW||(e.VIEW={})).top="top",o.front="front",o.side="side",(r=e.AXIS||(e.AXIS={})).right="right",r.left="left",r.top="top",e.TYPE_UNDEFINED="undefined"},607:(t,e,r)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.IsometricCSS=void 0;var o=r(37),n=r(158);e.IsometricCSS={processDOM:function(){Array.prototype.forEach.call(document.querySelectorAll("."+o.NAMESPACE),(function(t){n.default.addElement(t)}))},processElement:function(t){n.default.addElement(t)},resetElement:function(t){n.default.removeElement(t)},setView:function(t,e){n.default.setElementView(t,e)},setRotation:function(t,e){n.default.setElementRotation(t,e)},setPosition:function(t,e){n.default.setElementPosition(t,e)},setTexture:function(t,e){n.default.setElementTexture(t,e)}},typeof window!==o.TYPE_UNDEFINED&&typeof document!==o.TYPE_UNDEFINED&&(window.IsometricCSS=e.IsometricCSS,window.addEventListener("DOMContentLoaded",(function(){e.IsometricCSS.processDOM()})))},539:(t,e,r)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.resetElementIsometricData=e.getPlaneFromElement=e.getParentRotations=void 0;var o=r(37);e.getParentRotations=function(t){for(var e=[];t.parentElement&&t.parentElement!==document.documentElement;){var r=t.parentElement;r.classList.contains(o.NAMESPACE)&&!r.dataset.view&&r.dataset.rotationAxis&&e.push({axis:r.dataset.rotationAxis,value:+(r.dataset.rotationValue||0)}),t=t.parentElement}return e},e.getPlaneFromElement=function(t){var r=t.dataset.view?t.dataset.view:null,o=+(t.dataset.right||0),n=+(t.dataset.left||0),i=+(t.dataset.top||0),a=t.dataset.rotationAxis?t.dataset.rotationAxis:null,s=+(t.dataset.rotationValue||0),l=t.dataset.texture,u=t.dataset.textureSize||"cover",c="true"===t.dataset.texturePixelated,f={parentRotations:e.getParentRotations(t)};return r&&(f.view=r),(o||n||i)&&(f.position={right:o,left:n,top:i}),a&&s&&(f.rotation={axis:a,value:s}),l&&(f.texture={url:l,size:u,pixelated:c}),f},e.resetElementIsometricData=function(t){t.classList.remove(o.NAMESPACE),function(t,e){["view","right","left","top","rotationAxis","rotationValue","texture","textureSize","texturePixelated"].forEach((function(e){t.dataset[e]&&delete t.dataset[e]}))}(t)}},854:function(t,e,r){var o=this&&this.__spreadArrays||function(){for(var t=0,e=0,r=arguments.length;e<r;e++)t+=arguments[e].length;var o=Array(t),n=0;for(e=0;e<r;e++)for(var i=arguments[e],a=0,s=i.length;a<s;a++,n++)o[n]=i[a];return o};Object.defineProperty(e,"__esModule",{value:!0}),e.isometricToPoint=e.rotatePoint=e.sincos=e.radian=e.round=void 0;var n=r(37);e.round=function(t){var e=Math.pow(10,n.DECIMALS);return Math.round(t*e)/e},e.radian=function(t){return t*Math.PI/180},e.sincos=function(t){return{sin:e.round(Math.sin(t)),cos:e.round(Math.cos(t))}},e.rotatePoint=function(t,r,o){var n=Math.sqrt(Math.pow(t,2)+Math.pow(r,2)),i=Math.atan2(r,t)+e.radian(o);return{x:Math.cos(i)*n,y:Math.sin(i)*n}},e.isometricToPoint=function(t,r){var i=t.right,a=void 0===i?0:i,s=t.left,l=void 0===s?0:s,u=t.top,c=void 0===u?0:u;return r&&r.length&&o(r).reverse().forEach((function(t){switch(t.axis){case n.AXIS.top:var r=e.rotatePoint(a,l,t.value);a=r.x,l=r.y;break;case n.AXIS.right:r=e.rotatePoint(l,c,t.value),l=r.x,c=r.y;break;case n.AXIS.left:r=e.rotatePoint(c,a,t.value),c=r.x,a=r.y}})),{x:e.round((a-l)*n.HSQRT3),y:e.round((a+l)/2-c)}}},361:function(t,e,r){var o=this&&this.__spreadArrays||function(){for(var t=0,e=0,r=arguments.length;e<r;e++)t+=arguments[e].length;var o=Array(t),n=0;for(e=0;e<r;e++)for(var i=arguments[e],a=0,s=i.length;a<s;a++,n++)o[n]=i[a];return o};Object.defineProperty(e,"__esModule",{value:!0}),e.getViewMatrix=e.rotationToRotationMatrix=e.sideMatrix=e.frontMatrix=e.topMatrix=e.rotateZ=e.rotateY=e.rotateX=e.multiplyMatrices=e.multiplyMatrix=void 0;var n=r(37),i=r(854);e.multiplyMatrix=function(t,e){return t.map((function(r,o){return e[0].map((function(n,i){return r.reduce((function(r,n,a){return r+t[o][a]*e[a][i]}),0)}))}))},e.multiplyMatrices=function(){for(var t=[],r=0;r<arguments.length;r++)t[r]=arguments[r];for(var o=t[0],n=1;n<t.length;n++)o=e.multiplyMatrix(o,t[n]);return o},e.rotateX=function(t){var e=i.sincos(t);return[[1,0,0],[0,e.cos,-e.sin],[0,e.sin,e.cos]]},e.rotateY=function(t){var e=i.sincos(t);return[[e.cos,0,e.sin],[0,1,0],[-e.sin,0,e.cos]]},e.rotateZ=function(t){var e=i.sincos(t);return[[e.cos,-e.sin,0],[e.sin,e.cos,0],[0,0,1]]},e.topMatrix=e.multiplyMatrices(e.rotateX(n.ROT_CMA),e.rotateZ(-n.ROT_45)),e.frontMatrix=e.multiplyMatrices(e.rotateZ(-n.ROT_60),e.rotateX(n.ROT_CMA),e.rotateZ(n.ROT_45)),e.sideMatrix=e.multiplyMatrices(e.rotateZ(n.ROT_60),e.rotateX(n.ROT_CMA),e.rotateZ(-n.ROT_45)),e.rotationToRotationMatrix=function(t,r){var o=i.radian(r.value);switch(t){case n.VIEW.top:switch(r.axis){case n.AXIS.top:return e.rotateZ(o);case n.AXIS.left:return e.rotateX(-o);case n.AXIS.right:return e.rotateY(o);default:return null}case n.VIEW.front:switch(r.axis){case n.AXIS.top:return e.rotateY(o);case n.AXIS.left:return e.rotateX(o);case n.AXIS.right:return e.rotateZ(o);default:return null}case n.VIEW.side:switch(r.axis){case n.AXIS.top:return e.rotateY(o);case n.AXIS.left:return e.rotateZ(o);case n.AXIS.right:return e.rotateX(-o);default:return null}default:return null}},e.getViewMatrix=function(t,r,i){var a=[];r.forEach((function(r){var o=e.rotationToRotationMatrix(t,r);o&&a.push(o)}));var s=i?e.rotationToRotationMatrix(t,i):null;switch(s&&a.push(s),t){case n.VIEW.top:return e.multiplyMatrices.apply(void 0,o([e.topMatrix],a));case n.VIEW.front:return e.multiplyMatrices.apply(void 0,o([e.frontMatrix],a));case n.VIEW.side:return e.multiplyMatrices.apply(void 0,o([e.sideMatrix],a))}return null}},821:(t,e)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.kebab=void 0,e.kebab=function(t){return t.replace(/[A-Z]/g,"-$&").toLowerCase()}}},e={};function r(o){if(e[o])return e[o].exports;var n=e[o]={exports:{}};return t[o].call(n.exports,n,n.exports,r),n.exports}return r.d=(t,e)=>{for(var o in e)r.o(e,o)&&!r.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:e[o]})},r.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},r(607)})()}));

package.json

 {
   "name": "isometric-css",
-  "version": "2.1.0",
-  "description": "A lightweight JavaScript library to build isometric projections using CSS classes",
+  "version": "2.1.1",
+  "description": "A lightweight JavaScript library to build isometric projections through declarative HTML attributes",
   "keywords": [
@@ -6,0 +6,0 @@ "isometric",

README.md

 <p align="center">
     <a href="https://github.com/elchininet/isometric-css">
-        <img src="./docs-src/src/images/isometric-css.png?raw=true" width="400" title="isometric-css" />
+        <img src="https://raw.githubusercontent.com/elchininet/isometric-css/master/docs-src/src/images/isometric-css.png" width="550" title="isometric-css" />
     </a>
     <br>
-    A lightweight JavaScript library to build isometric projections using CSS classes
+    A lightweight JavaScript library to build isometric projections through declarative HTML attributes
 </p>
 
-[![Build Status](https://travis-ci.com/elchininet/isometric-css.svg?branch=master)](https://travis-ci.com/elchininet/isometric-css) &nbsp; [![Coverage Status](https://coveralls.io/repos/github/elchininet/isometric-css/badge.svg?branch=master)](https://coveralls.io/github/elchininet/isometric-css?branch=master)
+[![Build Status](https://travis-ci.com/elchininet/isometric-css.svg?branch=master)](https://travis-ci.com/elchininet/isometric-css) &nbsp; [![Coverage Status](https://coveralls.io/repos/github/elchininet/isometric-css/badge.svg?branch=master)](https://coveralls.io/github/elchininet/isometric-css?branch=master) &nbsp; [![npm version](https://badge.fury.io/js/isometric-css.svg)](https://badge.fury.io/js/isometric-css)
 
-## Documentation / Demo
+## Isometric-CSS
 
+[Isometric-CSS](https://elchininet.github.io/isometric-css/) is a lightweight `JavaScript` library to easily build <a href="https://en.wikipedia.org/wiki/Isometric_projection" target="_blank" rel="noreferrer noopener">isometric projections</a> through declarative HTML attributes, so no `JavaScript` knowledge is required. You just need to add the `isometric` class and specific <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/data-*" target="_blank" rel="noreferrer noopener">data attributes</a> to the elements, and on page-load CSS rules will be created and applied to give them the desired transformation. It is also possible to transform the elements dynamically using the `JavaScript` API (read the [API section](https://elchininet.github.io/isometric-css/library-api) for more details).
+
+## Documentation
+
 https://elchininet.github.io/isometric-css/
@@ -17,6 +21,2 @@
     <img src="./docs-src/src/images/isometric.png?raw=true" width="838" title="isometric-css" />
-</a>
-
-## Introduction
-
-To give the apperance of an <a href="https://en.wikipedia.org/wiki/Isometric_projection" target="_blank" rel="noreferrer noopener">isometric projection</a> to an HTML element, it is needed to apply <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/transform" target="_blank" rel="noreferrer noopener">CSS transformations</a> to it. This transformations could be complex to manage, and even more when we have multiple elements and we want to translate or rotate them. The **isometric-css** library can help you with this task, it will create the necessary CSS rules to transform the HTML elements and attach them to the page automatically. You can either apply the transformation through declarative <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/data-*" target="_blank" rel="noreferrer noopener">data attributes</a> in the HTML code or use the library API methods to apply the transformations to the elements dynamically using JavaScript.
+</a>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

55799

increased by0.44%

No dependency changes