abo-utils - npm Package Compare versions

Comparing version 0.1.0 to 0.2.0

CHANGELOG.md

@@ -11,2 +11,7 @@ # Changelog
 
+## [0.2.0] - 2018-08-09
+### Added
+- Refactoring/more utils.
+
+
 ## [0.1.0] - 2018-08-07
@@ -22,3 +27,4 @@ ### Added
 
-[Unreleased]: https://github.com/Sphinxxxx/abo-utils/compare/v0.1.0...HEAD
+[Unreleased]: https://github.com/Sphinxxxx/abo-utils/compare/v0.2.0...HEAD
+[0.2.0]: https://github.com/Sphinxxxx/abo-utils/compare/v0.1.0...v0.2.0
 [0.1.0]: https://github.com/Sphinxxxx/abo-utils/compare/v0.0.0...v0.1.0

dist/abo-utils.js

 /*!
- * abo-utils v0.1.0
+ * abo-utils v0.2.0
  * https://github.com/Sphinxxxx/abo-utils
@@ -26,4 +26,36 @@ *
 
-  function calcAngle(p0, p1, p2) {
+  function clamp(x, min, max) {
+      return Math.max(min, Math.min(x, max));
+  }
 
+  function lerp(v0, v1, t) {
+      if (Array.isArray(v0)) {
+          return v0.map(function (v, i) {
+              return lerp(v, v1[i], t);
+          });
+      }
+      return (1 - t) * v0 + t * v1;
+  }
+
+  var utilsMath = Object.freeze({
+    clamp: clamp,
+    lerp: lerp
+  });
+
+  function distance(p1, p2) {
+      var dx = p2[0] - p1[0],
+          dy = p2[1] - p1[1];
+      return Math.sqrt(dx * dx + dy * dy);
+  }
+
+  function rotatePoint(p, radians) {
+      var x = p[0],
+          y = p[1],
+          cos = Math.cos(radians),
+          sin = Math.sin(radians);
+
+      return [cos * x - sin * y, sin * x + cos * y];
+  }
+
+  function angleBetween(p1, p2, p3) {
       function squared(a) {
@@ -33,24 +65,38 @@ return a * a;
 
-      var a = squared(p1[0] - p0[0]) + squared(p1[1] - p0[1]),
-          b = squared(p1[0] - p2[0]) + squared(p1[1] - p2[1]),
-          c = squared(p2[0] - p0[0]) + squared(p2[1] - p0[1]);
+      var radians = void 0;
 
-      var angle = Math.acos((a + b - c) / Math.sqrt(4 * a * b));
-      return angle;
-  }
-
-  function calcIncircle(A, B, C) {
-      function lineLen(p1, p2) {
+      if (!p3) {
           var dx = p2[0] - p1[0],
               dy = p2[1] - p1[1];
-          return Math.sqrt(dx * dx + dy * dy);
+
+          radians = Math.atan2(dy, dx);
       }
 
-      var a = lineLen(B, C),
-          b = lineLen(C, A),
-          c = lineLen(A, B),
+      else {
+
+              var a = squared(p2[0] - p1[0]) + squared(p2[1] - p1[1]),
+                  b = squared(p2[0] - p3[0]) + squared(p2[1] - p3[1]),
+                  c = squared(p3[0] - p1[0]) + squared(p3[1] - p1[1]);
+
+              radians = Math.acos((a + b - c) / Math.sqrt(4 * a * b));
+          }
+
+      return radians;
+  }
+
+  function triangleArea(A, B, C) {
+
+      var area = Math.abs((B[0] - A[0]) * (C[1] - A[1]) - (C[0] - A[0]) * (B[1] - A[1])) / 2;
+
+      return area;
+  }
+
+  function triangleIncircle(A, B, C) {
+      var a = distance(B, C),
+          b = distance(C, A),
+          c = distance(A, B),
           p = a + b + c,
           s = p / 2;
 
-      var area = Math.sqrt(s * (s - a) * (s - b) * (s - c));
+      var area = triangleArea(A, B, C);
 
@@ -67,3 +113,3 @@ var r = area / s,
   function expandTriangle(A, B, C, amount) {
-      var incircle = calcIncircle(A, B, C),
+      var incircle = triangleIncircle(A, B, C),
           c = incircle.c,
@@ -87,4 +133,7 @@ factor = (incircle.r + amount) / incircle.r;
   var utilsGeom = Object.freeze({
-    calcAngle: calcAngle,
-    calcIncircle: calcIncircle,
+    distance: distance,
+    rotatePoint: rotatePoint,
+    angleBetween: angleBetween,
+    triangleArea: triangleArea,
+    triangleIncircle: triangleIncircle,
     expandTriangle: expandTriangle
@@ -174,2 +223,34 @@ });
 
+  function animate(durationMS, callback, alternate) {
+      var startTime = void 0,
+          cancelled = void 0;
+      function anim(t) {
+          if (!startTime) {
+              startTime = t;
+          }
+
+          var totalProgress = (t - startTime) / durationMS;
+
+          var relProgress = totalProgress % 1;
+          if (alternate) {
+              var iteration = Math.trunc(totalProgress);
+              if (iteration % 2) {
+                  relProgress = 1 - relProgress;
+              }
+          }
+
+          callback(relProgress, totalProgress);
+          if (!cancelled) {
+              requestAnimationFrame(anim);
+          }
+      }
+      requestAnimationFrame(anim);
+
+      return {
+          cancel: function cancel() {
+              cancelled = true;
+          }
+      };
+  }
+
   var utilsDom = Object.freeze({
@@ -180,3 +261,4 @@ $$: $$,
     relativeMousePos: relativeMousePos,
-    live: live
+    live: live,
+    animate: animate
   });
@@ -208,4 +290,42 @@
 
-  function drawImageTriangle(img, ctx, s1, s2, s3, d1, d2, d3) {
+  var slicedToArray = function () {
+    function sliceIterator(arr, i) {
+      var _arr = [];
+      var _n = true;
+      var _d = false;
+      var _e = undefined;
 
+      try {
+        for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
+          _arr.push(_s.value);
+
+          if (i && _arr.length === i) break;
+        }
+      } catch (err) {
+        _d = true;
+        _e = err;
+      } finally {
+        try {
+          if (!_n && _i["return"]) _i["return"]();
+        } finally {
+          if (_d) throw _e;
+        }
+      }
+
+      return _arr;
+    }
+
+    return function (arr, i) {
+      if (Array.isArray(arr)) {
+        return arr;
+      } else if (Symbol.iterator in Object(arr)) {
+        return sliceIterator(arr, i);
+      } else {
+        throw new TypeError("Invalid attempt to destructure non-iterable instance");
+      }
+    };
+  }();
+
+  function drawImageTriangle(img, ctx, s1, s2, s3, d1, d2, d3, expand) {
+
       function linearSolution(r1, s1, t1, r2, s2, t2, r3, s3, t3) {
@@ -219,2 +339,12 @@ var a = ((t2 - t3) * (s1 - s2) - (t1 - t2) * (s2 - s3)) / ((r2 - r3) * (s1 - s2) - (r1 - r2) * (s2 - s3));
 
+      if (expand) {
+          var _geom$expandTriangle, _geom$expandTriangle2, _geom$expandTriangle3, _geom$expandTriangle4;
+
+          var destOverlap = .3,
+              destArea = triangleArea(d1, d2, d3),
+              srcArea = triangleArea(s1, s2, s3);
+
+          (_geom$expandTriangle = expandTriangle(d1, d2, d3, destOverlap), _geom$expandTriangle2 = slicedToArray(_geom$expandTriangle, 3), d1 = _geom$expandTriangle2[0], d2 = _geom$expandTriangle2[1], d3 = _geom$expandTriangle2[2], _geom$expandTriangle), (_geom$expandTriangle3 = expandTriangle(s1, s2, s3, destOverlap * srcArea / destArea), _geom$expandTriangle4 = slicedToArray(_geom$expandTriangle3, 3), s1 = _geom$expandTriangle4[0], s2 = _geom$expandTriangle4[1], s3 = _geom$expandTriangle4[2], _geom$expandTriangle3);
+      }
+
       var xm = linearSolution(s1[0], s1[1], d1[0], s2[0], s2[1], d2[0], s3[0], s3[1], d3[0]),
@@ -236,13 +366,2 @@ ym = linearSolution(s1[0], s1[1], d1[1], s2[0], s2[1], d2[1], s3[0], s3[1], d3[1]);
 
-      var incircle = calcIncircle(d1, d2, d3),
-          c = incircle.c;
-      ctx.beginPath();
-      ctx.arc(c[0], c[1], incircle.r, 0, 2 * Math.PI, false);
-      ctx.moveTo(d1[0], d1[1]);
-      ctx.lineTo(d2[0], d2[1]);
-      ctx.lineTo(d3[0], d3[1]);
-      ctx.closePath();
-      ctx.lineWidth = 2;
-      ctx.strokeStyle = 'rgba(255,0,0, .4)';
-      ctx.stroke();
   }
@@ -456,2 +575,3 @@
   exports.Polys = utilsPolys;
+  exports.Math = utilsMath;
   exports.Geom = utilsGeom;
@@ -458,0 +578,0 @@ exports.DOM = utilsDom;

dist/abo-utils.min.js

 /*!
- * abo-utils v0.1.0
+ * abo-utils v0.2.0
  * https://github.com/Sphinxxxx/abo-utils
@@ -8,2 +8,2 @@ *
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e.ABOUtils={})}(this,function(e){"use strict";Array.from=Array.from||function(e){return Array.prototype.slice.call(e)},Math.trunc=Math.trunc||function(e){return e<0?Math.ceil(e):Math.floor(e)};var t=Object.freeze({});function d(e,t,n){function r(e,t){var n=t[0]-e[0],r=t[1]-e[1];return Math.sqrt(n*n+r*r)}var a=r(t,n),o=r(n,e),i=r(e,t),c=a+o+i,u=c/2;return{r:Math.sqrt(u*(u-a)*(u-o)*(u-i))/u,c:[(a*e[0]+o*t[0]+i*n[0])/c,(a*e[1]+o*t[1]+i*n[1])/c]}}var n=Object.freeze({calcAngle:function(e,t,n){function r(e){return e*e}var a=r(t[0]-e[0])+r(t[1]-e[1]),o=r(t[0]-n[0])+r(t[1]-n[1]),i=r(n[0]-e[0])+r(n[1]-e[1]);return Math.acos((a+o-i)/Math.sqrt(4*a*o))},calcIncircle:d,expandTriangle:function(e,t,n,r){var a=d(e,t,n),o=a.c,i=(a.r+r)/a.r;function c(e){var t=e[0]-o[0],n=e[1]-o[1];return[t*i+o[0],n*i+o[1]]}return[c(e),c(t),c(n)]}});function i(e,t){var n=(t=t||document).querySelectorAll(e);return Array.from(n)}var r=Object.freeze({$$:i,$$1:function(e,t){return(t=t||document).querySelector(e)},createElement:function(e,t,n){var r=e.split(/([#\.])/);if(1<r.length){e=r[0]||"div",n=n||{};for(var a=1;a<r.length-1;a++){var o=r[a],i=r[a+1];"#"===o?n.id=i:n.class=n.class?n.class+" "+i:i,a++}}var c=t?document.createElementNS(t.namespaceURI,e):document.createElement(e);if(n)for(var u in n)c.setAttribute(u,n[u]);return t&&t.appendChild(c),c},relativeMousePos:function(e,t,n){function r(e,t,n){return Math.max(t,Math.min(e,n))}var a=t.getBoundingClientRect(),o=e.clientX-a.left,i=e.clientY-a.top;return n&&(o=r(o,0,a.width),i=r(i,0,a.height)),[o,i]},live:function(e,a,o){document.addEventListener(e,function(e){var t=i(a);if(t&&t.length){for(var n=e.target,r=-1;n&&-1===(r=t.indexOf(n));)n=n.parentElement;-1<r&&o.call(n,e)}})}}),a=function(){function r(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(e,t,n){return t&&r(e.prototype,t),n&&r(e,n),e}}();var o=function(){function r(e,t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,r),this.w=e.width=t||e.width,this.h=e.height=n||e.height,this.targetContext=e.getContext("2d"),this.targetData=this.targetContext.getImageData(0,0,this.w,this.h)}return a(r,[{key:"setPixel",value:function(e,t,n){var r=4*(t*this.w+e),a=this.targetData.data;a[r]=n[0],a[r+1]=n[1],a[r+2]=n[2],a[r+3]=3<n.length?n[3]:255}},{key:"render",value:function(){this.targetContext.putImageData(this.targetData,0,0)}}]),r}(),c=Object.freeze({drawImageTriangle:function(e,t,n,r,a,o,i,c){function u(e,t,n,r,a,o,i,c,u){var l=((o-u)*(t-a)-(n-o)*(a-c))/((r-i)*(t-a)-(e-r)*(a-c)),s=((o-u)*(e-r)-(n-o)*(r-i))/((a-c)*(e-r)-(t-a)*(r-i));return[l,s,n-e*l-t*s]}var l=u(n[0],n[1],o[0],r[0],r[1],i[0],a[0],a[1],c[0]),s=u(n[0],n[1],o[1],r[0],r[1],i[1],a[0],a[1],c[1]);t.save(),t.setTransform(l[0],s[0],l[1],s[1],l[2],s[2]),t.beginPath(),t.moveTo(n[0],n[1]),t.lineTo(r[0],r[1]),t.lineTo(a[0],a[1]),t.closePath(),t.clip(),t.drawImage(e,0,0,e.width,e.height),t.restore();var f=d(o,i,c),h=f.c;t.beginPath(),t.arc(h[0],h[1],f.r,0,2*Math.PI,!1),t.moveTo(o[0],o[1]),t.lineTo(i[0],i[1]),t.lineTo(c[0],c[1]),t.closePath(),t.lineWidth=2,t.strokeStyle="rgba(255,0,0, .4)",t.stroke()},CanvasPixelBuffer:o}),u={a:7,c:6,h:1,l:2,m:2,q:4,s:4,t:2,v:1,z:0},l=/([astvzqmhlc])([^astvzqmhlc]*)/gi;var s=Object.freeze({parsePath:function(e){var o=[];return e.replace(l,function(e,t,n){var r,a=t.toLowerCase();for(n=(r=(r=(r=n).replace(/(\.\d+)(?=\.)/g,"$1 ")).match(/-?[.0-9]+(?:e[-+]?\d+)?/gi))?r.map(Number):[],"m"===a&&2<n.length&&(o.push([t].concat(n.splice(0,2))),a="l",t="m"===t?"l":"L");;){if(n.length===u[a])return n.unshift(t),o.push(n);if(n.length<u[a])throw new Error("Malformed path data: "+[t,n]);o.push([t].concat(n.splice(0,u[a])))}}),o},absolutizePath:function(e){var a=0,o=0,i=0,c=0;return e.map(function(e){var t=(e=e.slice())[0],n=t.toUpperCase();if(e.startPoint={x:i,y:c},t!==n)switch(e[0]=n,t){case"a":e[6]+=i,e[7]+=c;break;case"v":e[1]+=c;break;case"h":e[1]+=i;break;default:for(var r=1;r<e.length;)e[r++]+=i,e[r++]+=c}switch(n){case"Z":i=a,c=o;break;case"H":i=e[1];break;case"V":c=e[1];break;case"M":i=a=e[1],c=o=e[2];break;default:i=e[e.length-2],c=e[e.length-1]}return e.endPoint={x:i,y:c},e})},serializePath:function(e){return e.reduce(function(e,t){return e+t[0]+t.slice(1).join(",")},"")}});function f(){var e=new Date,t=("00"+e.getMilliseconds()).substr(-3);return e.toTimeString().split(" ")[0]+"."+t}e.Polys=t,e.Geom=n,e.DOM=r,e.Canvas=c,e.SVG=s,e.printTime=f,e.htmlEncode=function(e){return document.createElement("a").appendChild(document.createTextNode(e)).parentNode.innerHTML},e.htmlDecode=function(e){var t=document.createElement("a");return t.innerHTML=e,t.textContent},e.getQueryVariable=function(e){for(var t=window.location.search.substring(1).split("&"),n=0;n<t.length;n++){var r=t[n].split("=");if(r[0]===e)return r[1]}return!1},e.alertErrors=function(){window.onerror=function(e,t,n){alert(f()+" - Error message: "+e+"\nURL: "+t+"\nLine Number: "+n)}},e.logToScreen=function(){var t=document.body.appendChild(document.createElement("div"));t.id="abo-log",t.setAttribute("style","position:fixed;top:0;left:0;z-index:9999;white-space:pre;pointer-events:none;background-color:rgba(255,255,255,.5);"),console._log=console.log,console.log=function(){var e=Array.from(arguments).join(" ");t.textContent=f()+" - "+e+"\n"+t.textContent}},Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t(e.ABOUtils={})}(this,function(e){"use strict";Array.from=Array.from||function(e){return Array.prototype.slice.call(e)},Math.trunc=Math.trunc||function(e){return e<0?Math.ceil(e):Math.floor(e)};var t=Object.freeze({});var n=Object.freeze({clamp:function(e,t,n){return Math.max(t,Math.min(e,n))},lerp:function n(e,r,a){return Array.isArray(e)?e.map(function(e,t){return n(e,r[t],a)}):(1-a)*e+a*r}});function u(e,t){var n=t[0]-e[0],r=t[1]-e[1];return Math.sqrt(n*n+r*r)}function b(e,t,n){return Math.abs((t[0]-e[0])*(n[1]-e[1])-(n[0]-e[0])*(t[1]-e[1]))/2}function l(e,t,n){var r=u(t,n),a=u(n,e),i=u(e,t),o=r+a+i,c=o/2;return{r:b(e,t,n)/c,c:[(r*e[0]+a*t[0]+i*n[0])/o,(r*e[1]+a*t[1]+i*n[1])/o]}}function y(e,t,n,r){var a=l(e,t,n),i=a.c,o=(a.r+r)/a.r;function c(e){var t=e[0]-i[0],n=e[1]-i[1];return[t*o+i[0],n*o+i[1]]}return[c(e),c(t),c(n)]}var r=Object.freeze({distance:u,rotatePoint:function(e,t){var n=e[0],r=e[1],a=Math.cos(t),i=Math.sin(t);return[a*n-i*r,i*n+a*r]},angleBetween:function(e,t,n){function r(e){return e*e}var a=void 0;if(n){var i=r(t[0]-e[0])+r(t[1]-e[1]),o=r(t[0]-n[0])+r(t[1]-n[1]),c=r(n[0]-e[0])+r(n[1]-e[1]);a=Math.acos((i+o-c)/Math.sqrt(4*i*o))}else{var u=t[0]-e[0],l=t[1]-e[1];a=Math.atan2(l,u)}return a},triangleArea:b,triangleIncircle:l,expandTriangle:y});function o(e,t){var n=(t=t||document).querySelectorAll(e);return Array.from(n)}var a=Object.freeze({$$:o,$$1:function(e,t){return(t=t||document).querySelector(e)},createElement:function(e,t,n){var r=e.split(/([#\.])/);if(1<r.length){e=r[0]||"div",n=n||{};for(var a=1;a<r.length-1;a++){var i=r[a],o=r[a+1];"#"===i?n.id=o:n.class=n.class?n.class+" "+o:o,a++}}var c=t?document.createElementNS(t.namespaceURI,e):document.createElement(e);if(n)for(var u in n)c.setAttribute(u,n[u]);return t&&t.appendChild(c),c},relativeMousePos:function(e,t,n){function r(e,t,n){return Math.max(t,Math.min(e,n))}var a=t.getBoundingClientRect(),i=e.clientX-a.left,o=e.clientY-a.top;return n&&(i=r(i,0,a.width),o=r(o,0,a.height)),[i,o]},live:function(e,a,i){document.addEventListener(e,function(e){var t=o(a);if(t&&t.length){for(var n=e.target,r=-1;n&&-1===(r=t.indexOf(n));)n=n.parentElement;-1<r&&i.call(n,e)}})},animate:function(a,i,o){var c=void 0,u=void 0;return requestAnimationFrame(function e(t){c||(c=t);var n=(t-c)/a,r=n%1;o&&Math.trunc(n)%2&&(r=1-r),i(r,n),u||requestAnimationFrame(e)}),{cancel:function(){u=!0}}}}),i=function(){function r(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(e,t,n){return t&&r(e.prototype,t),n&&r(e,n),e}}(),w=function(e,t){if(Array.isArray(e))return e;if(Symbol.iterator in Object(e))return function(e,t){var n=[],r=!0,a=!1,i=void 0;try{for(var o,c=e[Symbol.iterator]();!(r=(o=c.next()).done)&&(n.push(o.value),!t||n.length!==t);r=!0);}catch(e){a=!0,i=e}finally{try{!r&&c.return&&c.return()}finally{if(a)throw i}}return n}(e,t);throw new TypeError("Invalid attempt to destructure non-iterable instance")};var c=function(){function r(e,t,n){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,r),this.w=e.width=t||e.width,this.h=e.height=n||e.height,this.targetContext=e.getContext("2d"),this.targetData=this.targetContext.getImageData(0,0,this.w,this.h)}return i(r,[{key:"setPixel",value:function(e,t,n){var r=4*(t*this.w+e),a=this.targetData.data;a[r]=n[0],a[r+1]=n[1],a[r+2]=n[2],a[r+3]=3<n.length?n[3]:255}},{key:"render",value:function(){this.targetContext.putImageData(this.targetData,0,0)}}]),r}(),f=Object.freeze({drawImageTriangle:function(e,t,n,r,a,i,o,c,u){function l(e,t,n,r,a,i,o,c,u){var l=((i-u)*(t-a)-(n-i)*(a-c))/((r-o)*(t-a)-(e-r)*(a-c)),f=((i-u)*(e-r)-(n-i)*(r-o))/((a-c)*(e-r)-(t-a)*(r-o));return[l,f,n-e*l-t*f]}if(u){var f,s,h,d,v=b(i,o,c),m=b(n,r,a);f=y(i,o,c,.3),i=(s=w(f,3))[0],o=s[1],c=s[2],h=y(n,r,a,.3*m/v),n=(d=w(h,3))[0],r=d[1],a=d[2]}var p=l(n[0],n[1],i[0],r[0],r[1],o[0],a[0],a[1],c[0]),g=l(n[0],n[1],i[1],r[0],r[1],o[1],a[0],a[1],c[1]);t.save(),t.setTransform(p[0],g[0],p[1],g[1],p[2],g[2]),t.beginPath(),t.moveTo(n[0],n[1]),t.lineTo(r[0],r[1]),t.lineTo(a[0],a[1]),t.closePath(),t.clip(),t.drawImage(e,0,0,e.width,e.height),t.restore()},CanvasPixelBuffer:c}),s={a:7,c:6,h:1,l:2,m:2,q:4,s:4,t:2,v:1,z:0},h=/([astvzqmhlc])([^astvzqmhlc]*)/gi;var d=Object.freeze({parsePath:function(e){var i=[];return e.replace(h,function(e,t,n){var r,a=t.toLowerCase();for(n=(r=(r=(r=n).replace(/(\.\d+)(?=\.)/g,"$1 ")).match(/-?[.0-9]+(?:e[-+]?\d+)?/gi))?r.map(Number):[],"m"===a&&2<n.length&&(i.push([t].concat(n.splice(0,2))),a="l",t="m"===t?"l":"L");;){if(n.length===s[a])return n.unshift(t),i.push(n);if(n.length<s[a])throw new Error("Malformed path data: "+[t,n]);i.push([t].concat(n.splice(0,s[a])))}}),i},absolutizePath:function(e){var a=0,i=0,o=0,c=0;return e.map(function(e){var t=(e=e.slice())[0],n=t.toUpperCase();if(e.startPoint={x:o,y:c},t!==n)switch(e[0]=n,t){case"a":e[6]+=o,e[7]+=c;break;case"v":e[1]+=c;break;case"h":e[1]+=o;break;default:for(var r=1;r<e.length;)e[r++]+=o,e[r++]+=c}switch(n){case"Z":o=a,c=i;break;case"H":o=e[1];break;case"V":c=e[1];break;case"M":o=a=e[1],c=i=e[2];break;default:o=e[e.length-2],c=e[e.length-1]}return e.endPoint={x:o,y:c},e})},serializePath:function(e){return e.reduce(function(e,t){return e+t[0]+t.slice(1).join(",")},"")}});function v(){var e=new Date,t=("00"+e.getMilliseconds()).substr(-3);return e.toTimeString().split(" ")[0]+"."+t}e.Polys=t,e.Math=n,e.Geom=r,e.DOM=a,e.Canvas=f,e.SVG=d,e.printTime=v,e.htmlEncode=function(e){return document.createElement("a").appendChild(document.createTextNode(e)).parentNode.innerHTML},e.htmlDecode=function(e){var t=document.createElement("a");return t.innerHTML=e,t.textContent},e.getQueryVariable=function(e){for(var t=window.location.search.substring(1).split("&"),n=0;n<t.length;n++){var r=t[n].split("=");if(r[0]===e)return r[1]}return!1},e.alertErrors=function(){window.onerror=function(e,t,n){alert(v()+" - Error message: "+e+"\nURL: "+t+"\nLine Number: "+n)}},e.logToScreen=function(){var t=document.body.appendChild(document.createElement("div"));t.id="abo-log",t.setAttribute("style","position:fixed;top:0;left:0;z-index:9999;white-space:pre;pointer-events:none;background-color:rgba(255,255,255,.5);"),console._log=console.log,console.log=function(){var e=Array.from(arguments).join(" ");t.textContent=v()+" - "+e+"\n"+t.textContent}},Object.defineProperty(e,"__esModule",{value:!0})});

package.json

 {
   "name": "abo-utils",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "JS utils and polyfills.",
@@ -5,0 +5,0 @@ "author": "Andreas Borgen",

src/index.js

@@ -6,2 +6,3 @@ //Doesn't work yet..
 import * as Polys  from './utils-polys';
+import * as Math   from './utils-math';
 import * as Geom   from './utils-geom';
@@ -15,2 +16,2 @@ import * as DOM    from './utils-dom';
 //..and other things within namespaces:
-export { Polys, Geom, DOM, Canvas, SVG };
+export { Polys, Math, Geom, DOM, Canvas, SVG };

src/utils-canvas.js

@@ -18,3 +18,3 @@ import * as geom from './utils-geom';
  */
-function drawImageTriangle(img, ctx, s1, s2, s3, d1, d2, d3) {
+function drawImageTriangle(img, ctx, s1, s2, s3, d1, d2, d3, expand) {
 
@@ -40,2 +40,13 @@ /**
     }
+    
+    if(expand) {
+        //Overlap the destination areas a little
+        //to avoid hairline cracks when drawing mulitiple connected triangles.
+        const destOverlap = .3,
+              destArea = geom.triangleArea(d1, d2, d3),
+              srcArea = geom.triangleArea(s1, s2, s3);
+              
+        [d1, d2, d3] = geom.expandTriangle(d1, d2, d3,  destOverlap),
+        [s1, s2, s3] = geom.expandTriangle(s1, s2, s3,  destOverlap * srcArea/destArea);
+    }
 
@@ -62,4 +73,4 @@ //I assume the "m" is for "magic"...
     
-    //* DEBUG - https://en.wikipedia.org/wiki/Incircle_and_excircles_of_a_triangle
-    const incircle = geom.calcIncircle(d1, d2, d3),
+    /* DEBUG - https://en.wikipedia.org/wiki/Incircle_and_excircles_of_a_triangle
+    const incircle = geom.triangleIncircle(d1, d2, d3),
           c = incircle.c;
@@ -66,0 +77,0 @@ //console.log(incircle);

src/utils-dom.js

@@ -96,3 +96,29 @@
 
+function animate(durationMS, callback, alternate) {
+    let startTime, cancelled;
+    function anim(t) {
+        if(!startTime) { startTime = t; }
 
-export { $$, $$1, createElement, relativeMousePos, live };
+        const totalProgress = (t - startTime) / durationMS;
+
+        let relProgress = totalProgress % 1;
+        if(alternate) {
+            const iteration = Math.trunc(totalProgress);
+            if(iteration % 2) {
+                relProgress = 1 - relProgress;
+            }
+        }
+
+        callback(relProgress, totalProgress);
+        if(!cancelled) { requestAnimationFrame(anim); }
+    }
+    requestAnimationFrame(anim);
+    
+    return {
+        cancel() { cancelled = true; }
+    };
+}
+
+
+
+export { $$, $$1, createElement, relativeMousePos, live, animate };

src/utils-geom.js

@@ -1,28 +0,83 @@
-//Center point is p1; angle returned in radians
-//  Optimized:
-//  http://phrogz.net/angle-between-three-points
-function calcAngle(p0, p1, p2) {
+function distance(p1, p2) {
+    const dx = p2[0] - p1[0],
+          dy = p2[1] - p1[1];
+    return Math.sqrt(dx*dx + dy*dy);
+}
 
+
+//https://stackoverflow.com/questions/2259476/rotating-a-point-about-another-point-2d
+function rotatePoint(p, radians) {
+    const x = p[0],
+          y = p[1],
+          cos = Math.cos(radians),
+          sin = Math.sin(radians);
+    
+    return [cos*x - sin*y, sin*x + cos*y];
+}
+
+
+//Angle (in radians) between two or three points
+function angleBetween(p1, p2, p3) {
     function squared(a) { return a*a; }
 
-    var a = squared(p1[0] - p0[0]) + squared(p1[1] - p0[1]),
-        b = squared(p1[0] - p2[0]) + squared(p1[1] - p2[1]),
-        c = squared(p2[0] - p0[0]) + squared(p2[1] - p0[1]);
+    let radians;
     
-    var angle = Math.acos( (a+b-c) / Math.sqrt(4*a*b) );
-    //console.log('findAngle:', p0, '->', p1, '->', p2, ':', angle);
-    return angle;
+    //Angle between two points
+    //https://gist.github.com/conorbuck/2606166
+    if(!p3) {
+        const dx = p2[0] - p1[0],
+              dy = p2[1] - p1[1];
+
+        radians = Math.atan2(dy, dx);
+    }
+
+    //Angle between three points (center point is p2)
+    //http://stackoverflow.com/questions/17763392/how-to-calculate-in-javascript-angle-between-3-points
+    //  Optimized:
+    //  http://phrogz.net/angle-between-three-points
+    else {
+        /*
+        function findAngle(A,B,C) {
+            var AB = Math.sqrt(Math.pow(B.x-A.x,2)+ Math.pow(B.y-A.y,2));    
+            var BC = Math.sqrt(Math.pow(B.x-C.x,2)+ Math.pow(B.y-C.y,2)); 
+            var AC = Math.sqrt(Math.pow(C.x-A.x,2)+ Math.pow(C.y-A.y,2));
+            
+            var angle = Math.acos((BC*BC+AB*AB-AC*AC)/(2*BC*AB));
+            console.log('findAngle:', A, '->', B, '->', C, ':', angle);
+            return angle;
+        }
+        */
+
+        const a = squared(p2[0] - p1[0]) + squared(p2[1] - p1[1]),
+              b = squared(p2[0] - p3[0]) + squared(p2[1] - p3[1]),
+              c = squared(p3[0] - p1[0]) + squared(p3[1] - p1[1]);
+        
+        radians = Math.acos( (a+b-c) / Math.sqrt(4*a*b) );
+    }
+
+    //console.log('findAngle:', p1, '->', p2, '->', p3, ':', radians);
+    return radians;
 }
-/*
-//http://stackoverflow.com/questions/17763392/how-to-calculate-in-javascript-angle-between-3-points
-function findAngle(A,B,C) {
-    var AB = Math.sqrt(Math.pow(B.x-A.x,2)+ Math.pow(B.y-A.y,2));    
-    var BC = Math.sqrt(Math.pow(B.x-C.x,2)+ Math.pow(B.y-C.y,2)); 
-    var AC = Math.sqrt(Math.pow(C.x-A.x,2)+ Math.pow(C.y-A.y,2));
+
+
+function triangleArea(A, B, C) {
+    /*
+    //Heron's formula
+    //Side lengths, perimiter p and semiperimiter s:
+    //https://www.wikihow.com/Calculate-the-Area-of-a-Triangle#Using_Side_Lengths
+    const a = distance(B, C),
+          b = distance(C, A),
+          c = distance(A, B),
+          p = (a + b + c),
+          s = p/2;
     
-    var angle = Math.acos((BC*BC+AB*AB-AC*AC)/(2*BC*AB));
-    console.log('findAngle:', A, '->', B, '->', C, ':', angle);
-    return angle;
+    const area = Math.sqrt(s * (s-a) * (s-b) * (s-c));
+    */
+    
+    //Faster(?) alternative:
+    //http://geomalgorithms.com/a01-_area.html#Modern-Triangles
+    const area = Math.abs( (B[0]-A[0]) * (C[1]-A[1]) - (C[0]-A[0]) * (B[1]-A[1]) )/2;
+
+    return area;
 }
-*/
 
@@ -35,22 +90,11 @@
  */
-function calcIncircle(A, B, C) {
-    function lineLen(p1, p2) {
-        const dx = p2[0] - p1[0],
-              dy = p2[1] - p1[1];
-        return Math.sqrt(dx*dx + dy*dy);
-    }
-    
+function triangleIncircle(A, B, C) {
     //Side lengths, perimiter p and semiperimiter s:
-    const a = lineLen(B, C),
-          b = lineLen(C, A),
-          c = lineLen(A, B),
+    const a = distance(B, C),
+          b = distance(C, A),
+          c = distance(A, B),
           p = (a + b + c),
           s = p/2;
     
-    //Heron's formula
-    //https://www.wikihow.com/Calculate-the-Area-of-a-Triangle#Using_Side_Lengths
-    const area = Math.sqrt(s * (s-a) * (s-b) * (s-c));
-    //Faster(?) alternative:
-    //http://geomalgorithms.com/a01-_area.html#Modern-Triangles
-    //const area = Math.abs( (B[0]-A[0])*(C[1]-A[1]) - (C[0]-A[0])*(B[1]-A[1]) )/2;
+    const area = triangleArea(A, B, C);
 
@@ -76,3 +120,3 @@ //Incircle radius r
 function expandTriangle(A, B, C, amount) {
-    const incircle = calcIncircle(A, B, C),
+    const incircle = triangleIncircle(A, B, C),
           c = incircle.c,
@@ -97,2 +141,2 @@ factor = (incircle.r + amount)/(incircle.r);
 
-export { calcAngle, calcIncircle, expandTriangle };
+export { distance, rotatePoint, angleBetween, triangleArea, triangleIncircle, expandTriangle };

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

Improved metrics

Total package byte prevSize

44185

increased by18.72%

Number of package files

14

increased by7.69%

Lines of code

973

increased by21.02%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes