animate-svg - npm Package Compare versions

Comparing version 0.0.6 to 0.0.7

lib/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-function getLength(path) {
-    if (typeof path.getTotalLength === 'function') {
-        return path.getTotalLength();
-    }
-    var x1 = +path.getAttribute('x1') || 0;
-    var x2 = +path.getAttribute('x2') || 0;
-    var y1 = +path.getAttribute('y1') || 0;
-    var y2 = +path.getAttribute('y2') || 0;
+var once = function (el, eventType) { return new Promise(function (resolve) {
+    el.addEventListener(eventType, function handler(e) {
+        el.removeEventListener(eventType, handler);
+        resolve(e);
+    });
+}); };
+var transitionEndPromise = function (path) { return once(path, 'transitionend'); };
+function getLineLength(path) {
+    var x1 = +(path.getAttribute('x1') || 0);
+    var x2 = +(path.getAttribute('x2') || 0);
+    var y1 = +(path.getAttribute('y1') || 0);
+    var y2 = +(path.getAttribute('y2') || 0);
     var x = x2 - x1;
@@ -15,10 +19,7 @@ var y = y2 - y1;
 }
-function transitionEndPromise(path) {
-    return new Promise(function (resolve, reject) {
-        path.addEventListener('transitionend', function handler(e) {
-            path.removeEventListener('transitionend', handler);
-            resolve(e);
-        });
-    });
-}
+var getLength = function (path) {
+    return typeof path.getTotalLength === 'function'
+        ? path.getTotalLength()
+        : getLineLength(path);
+};
 exports.default = function (path, speed, reverse) {
@@ -25,0 +26,0 @@ if (reverse === void 0) { reverse = false; }

package.json

 {
   "name": "animate-svg",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "description": "Animate SVG paths & lines",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -20,3 +20,6 @@ # animate-svg
   const path = document.getElementById('some-svg-path-element')
+  // the animateSvg function esentially returns a promise
+  // so you can await it if you use it in an async function
   await animateSvg(path, 1, false)
+  // blablabla
 }
@@ -23,0 +26,0 @@ ```

src/index.ts

 export type SVGGeometryElement = SVGPathElement | SVGLineElement
 
-function getLength(path: SVGGeometryElement) {
-    if (typeof path.getTotalLength === 'function') {
-        return path.getTotalLength()
-    }
-    const x1 = +path.getAttribute('x1') || 0
-    const x2 = +path.getAttribute('x2') || 0
-    const y1 = +path.getAttribute('y1') || 0
-    const y2 = +path.getAttribute('y2') || 0
+const once = <K extends keyof HTMLElementEventMap>(
+    el: EventTarget,
+    eventType: K,
+) => new Promise<HTMLElementEventMap[K]>(resolve => {
+    el.addEventListener(eventType, function handler(e) {
+        el.removeEventListener(eventType, handler)
+        resolve(e)
+    })
+})
+
+const transitionEndPromise = (path: SVGGeometryElement) => once(path, 'transitionend')
+
+function getLineLength(path: SVGLineElement) {
+    const x1 = +(path.getAttribute('x1') || 0)
+    const x2 = +(path.getAttribute('x2') || 0)
+    const y1 = +(path.getAttribute('y1') || 0)
+    const y2 = +(path.getAttribute('y2') || 0)
     const x = x2 - x1
@@ -16,10 +25,6 @@ const y = y2 - y1
 
-function transitionEndPromise(path: SVGGeometryElement) {
-    return new Promise<Event>((resolve, reject) => {
-        path.addEventListener('transitionend', function handler(e) {
-            path.removeEventListener('transitionend', handler)
-            resolve(e)
-        })
-    })
-}
+const getLength = (path: SVGGeometryElement) =>
+    typeof path.getTotalLength === 'function'
+    ? (path as SVGPathElement).getTotalLength()
+    : getLineLength(path as SVGLineElement)
 
@@ -42,3 +47,3 @@ export default (path: SVGGeometryElement, speed: number, reverse = false) => {
 
-    return promise
+    return promise as Promise<Event>
 }

tsconfig.json

@@ -9,2 +9,3 @@ {
         "lib": [ "dom", "es7" ],
+        "strictNullChecks": true,
         "declaration": true,
@@ -11,0 +12,0 @@ "alwaysStrict": true,

No alert changes

Improved metrics

Total package byte prevSize

7948

increased by8.76%

Lines of code

109

increased by4.81%

Number of lines in readme file

34

increased by9.68%

No dependency changes