shorter-js - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

dist/shorter-js.esm.js

 /*!
-* shorter-js v0.1.0 (https://thednp.github.io/shorter-js/)
+* shorter-js v0.1.1 (https://thednp.github.io/shorter-js/)
 * Copyright 2019-2020 © dnp_theme
@@ -14,2 +14,6 @@ * Licensed under MIT (https://github.com/thednp/shorter-js/blob/master/LICENSE)
 
+var animationDuration = 'webkitAnimationDuration' in document.body.style ? 'webkitAnimationDuration' : 'animationDuration';
+
+var animationEndEvent = 'webkitAnimation' in document.body.style ? 'webkitAnimationEnd' : 'animationend';
+
 var transitionDuration = 'webkitTransition' in document.body.style ? 'webkitTransitionDuration' : 'transitionDuration';
@@ -42,2 +46,4 @@
 
+var supportAnimation = 'webkitAnimation' in document.body.style || 'animation' in document.body.style;
+
 var supportTransition = 'webkitTransition' in document.body.style || 'transition' in document.body.style;
@@ -76,2 +82,17 @@
 
+function getElementAnimationDuration(element) {
+  var duration = supportAnimation ? parseFloat(getComputedStyle(element)[animationDuration]) : 0;
+  duration = typeof duration === 'number' && !isNaN(duration) ? duration * 1000 : 0;
+  return duration;
+}
+
+function emulateAnimationEnd(element,handler){
+  var called = 0, duration = getElementAnimationDuration(element);
+  duration ? element.addEventListener( animationEndEvent, function animationEndWrapper(e){
+              !called && handler(e), called = 1;
+              element.removeEventListener( animationEndEvent, animationEndWrapper);
+            })
+           : setTimeout(function() { !called && handler(), called = 1; }, 17);
+}
+
 function getElementTransitionDuration(element) {
@@ -127,3 +148,5 @@ var duration = supportTransition ? parseFloat(getComputedStyle(element)[transitionDuration]) : 0;
   mouseSwipeEvents: mouseSwipeEvents,
+  animationDuration: animationDuration,
   transitionDuration: transitionDuration,
+  animationEndEvent: animationEndEvent,
   transitionEndEvent: transitionEndEvent,
@@ -135,2 +158,3 @@ isMobile: isMobile,
   supportTouch: supportTouch,
+  supportAnimation: supportAnimation,
   supportTransition: supportTransition,
@@ -143,2 +167,3 @@ addClass: addClass,
   one: one,
+  emulateAnimationEnd: emulateAnimationEnd,
   emulateTransitionEnd: emulateTransitionEnd,
@@ -148,2 +173,3 @@ isElementInScrollRange: isElementInScrollRange,
   passiveHandler: passiveHandler,
+  getElementAnimationDuration: getElementAnimationDuration,
   getElementTransitionDuration: getElementTransitionDuration,
@@ -150,0 +176,0 @@ queryElement: queryElement,

dist/shorter-js.esm.min.js

@@ -1,2 +0,2 @@
-// shorter-js v0.1.0 | dnp_theme © 2020 | MIT-License
-var e="onmouseleave"in document?["mouseenter","mouseleave"]:["mouseover","mouseout"],t="webkitTransition"in document.body.style?"webkitTransitionDuration":"transitionDuration",n="webkitTransition"in document.body.style?"webkitTransitionEnd":"transitionend",o=/iPhone|iPad|iPod|Android/i.test(navigator.userAgent),i="webkitPerspective"in document.body.style||"perspective"in document.body.style,r=function(){var e=!1;try{var t=Object.defineProperty({},"passive",{get:function(){e=!0}});document.addEventListener("DOMContentLoaded",(function e(){document.removeEventListener("DOMContentLoaded",e,t)}),t)}catch(e){}return e}(),s="webkitTransform"in document.body.style||"transform"in document.body.style,u="ontouchstart"in window||navigator.msMaxTouchPoints||!1,a="webkitTransition"in document.body.style||"transition"in document.body.style;function c(e,t,n,o){o=o||!1,e.addEventListener(t,n,o)}function d(e,t,n,o){o=o||!1,e.removeEventListener(t,n,o)}function m(e){var n=a?parseFloat(getComputedStyle(e)[t]):0;return n="number"!=typeof n||isNaN(n)?0:1e3*n}var l={mouseClickEvents:{down:"mousedown",up:"mouseup"},mouseHoverEvents:e,touchEvents:{start:"touchstart",end:"touchend",move:"touchmove",cancel:"touchcancel"},mouseSwipeEvents:{start:"mousedown",end:"mouseup",move:"mousemove",cancel:"mouseout"},transitionDuration:t,transitionEndEvent:n,isMobile:o,support3DTransform:i,supportPassive:r,supportTransform:s,supportTouch:u,supportTransition:a,addClass:function(e,t){e.classList.add(t)},removeClass:function(e,t){e.classList.remove(t)},hasClass:function(e,t){return e.classList.contains(t)},on:c,off:d,one:function(e,t,n,o){c(e,t,(function i(r){r.target===e&&(n(r),d(e,t,i,o))}),o)},emulateTransitionEnd:function(e,t){var o=0;m(e)?e.addEventListener(n,(function i(r){!o&&t(r),o=1,e.removeEventListener(n,i)})):setTimeout((function(){!o&&t(),o=1}),17)},isElementInScrollRange:function(e){var t=e.getBoundingClientRect(),n=window.innerHeight||document.documentElement.clientHeight;return t.top<=n&&t.bottom>=0},isElementInViewport:function(e){var t=e.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)},passiveHandler:!!r&&{passive:!0},getElementTransitionDuration:m,queryElement:function(e,t){var n=t&&t instanceof Element?t:document;return e instanceof Element?e:n.querySelector(e)},tryWrapper:function(e,t){try{e()}catch(e){console.error(t+" "+e)}}};export default l;
+// shorter-js v0.1.1 | dnp_theme © 2020 | MIT-License
+var n="onmouseleave"in document?["mouseenter","mouseleave"]:["mouseover","mouseout"],t="webkitAnimationDuration"in document.body.style?"webkitAnimationDuration":"animationDuration",e="webkitAnimation"in document.body.style?"webkitAnimationEnd":"animationend",o="webkitTransition"in document.body.style?"webkitTransitionDuration":"transitionDuration",i="webkitTransition"in document.body.style?"webkitTransitionEnd":"transitionend",r=/iPhone|iPad|iPod|Android/i.test(navigator.userAgent),s="webkitPerspective"in document.body.style||"perspective"in document.body.style,a=function(){var n=!1;try{var t=Object.defineProperty({},"passive",{get:function(){n=!0}});document.addEventListener("DOMContentLoaded",(function n(){document.removeEventListener("DOMContentLoaded",n,t)}),t)}catch(n){}return n}(),u="webkitTransform"in document.body.style||"transform"in document.body.style,m="ontouchstart"in window||navigator.msMaxTouchPoints||!1,d="webkitAnimation"in document.body.style||"animation"in document.body.style,c="webkitTransition"in document.body.style||"transition"in document.body.style;function l(n,t,e,o){o=o||!1,n.addEventListener(t,e,o)}function v(n,t,e,o){o=o||!1,n.removeEventListener(t,e,o)}function f(n){var e=d?parseFloat(getComputedStyle(n)[t]):0;return e="number"!=typeof e||isNaN(e)?0:1e3*e}function p(n){var t=c?parseFloat(getComputedStyle(n)[o]):0;return t="number"!=typeof t||isNaN(t)?0:1e3*t}var y={mouseClickEvents:{down:"mousedown",up:"mouseup"},mouseHoverEvents:n,touchEvents:{start:"touchstart",end:"touchend",move:"touchmove",cancel:"touchcancel"},mouseSwipeEvents:{start:"mousedown",end:"mouseup",move:"mousemove",cancel:"mouseout"},animationDuration:t,transitionDuration:o,animationEndEvent:e,transitionEndEvent:i,isMobile:r,support3DTransform:s,supportPassive:a,supportTransform:u,supportTouch:m,supportAnimation:d,supportTransition:c,addClass:function(n,t){n.classList.add(t)},removeClass:function(n,t){n.classList.remove(t)},hasClass:function(n,t){return n.classList.contains(t)},on:l,off:v,one:function(n,t,e,o){l(n,t,(function i(r){r.target===n&&(e(r),v(n,t,i,o))}),o)},emulateAnimationEnd:function(n,t){var o=0;f(n)?n.addEventListener(e,(function i(r){!o&&t(r),o=1,n.removeEventListener(e,i)})):setTimeout((function(){!o&&t(),o=1}),17)},emulateTransitionEnd:function(n,t){var e=0;p(n)?n.addEventListener(i,(function o(r){!e&&t(r),e=1,n.removeEventListener(i,o)})):setTimeout((function(){!e&&t(),e=1}),17)},isElementInScrollRange:function(n){var t=n.getBoundingClientRect(),e=window.innerHeight||document.documentElement.clientHeight;return t.top<=e&&t.bottom>=0},isElementInViewport:function(n){var t=n.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)},passiveHandler:!!a&&{passive:!0},getElementAnimationDuration:f,getElementTransitionDuration:p,queryElement:function(n,t){var e=t&&t instanceof Element?t:document;return n instanceof Element?n:e.querySelector(n)},tryWrapper:function(n,t){try{n()}catch(n){console.error(t+" "+n)}}};export default y;

dist/shorter-js.js

 /*!
-* shorter-js v0.1.0 (https://thednp.github.io/shorter-js/)
+* shorter-js v0.1.1 (https://thednp.github.io/shorter-js/)
 * Copyright 2019-2020 © dnp_theme
@@ -20,2 +20,6 @@ * Licensed under MIT (https://github.com/thednp/shorter-js/blob/master/LICENSE)
 
+  var animationDuration = 'webkitAnimationDuration' in document.body.style ? 'webkitAnimationDuration' : 'animationDuration';
+
+  var animationEndEvent = 'webkitAnimation' in document.body.style ? 'webkitAnimationEnd' : 'animationend';
+
   var transitionDuration = 'webkitTransition' in document.body.style ? 'webkitTransitionDuration' : 'transitionDuration';
@@ -48,2 +52,4 @@
 
+  var supportAnimation = 'webkitAnimation' in document.body.style || 'animation' in document.body.style;
+
   var supportTransition = 'webkitTransition' in document.body.style || 'transition' in document.body.style;
@@ -82,2 +88,17 @@
 
+  function getElementAnimationDuration(element) {
+    var duration = supportAnimation ? parseFloat(getComputedStyle(element)[animationDuration]) : 0;
+    duration = typeof duration === 'number' && !isNaN(duration) ? duration * 1000 : 0;
+    return duration;
+  }
+
+  function emulateAnimationEnd(element,handler){
+    var called = 0, duration = getElementAnimationDuration(element);
+    duration ? element.addEventListener( animationEndEvent, function animationEndWrapper(e){
+                !called && handler(e), called = 1;
+                element.removeEventListener( animationEndEvent, animationEndWrapper);
+              })
+             : setTimeout(function() { !called && handler(), called = 1; }, 17);
+  }
+
   function getElementTransitionDuration(element) {
@@ -133,3 +154,5 @@ var duration = supportTransition ? parseFloat(getComputedStyle(element)[transitionDuration]) : 0;
     mouseSwipeEvents: mouseSwipeEvents,
+    animationDuration: animationDuration,
     transitionDuration: transitionDuration,
+    animationEndEvent: animationEndEvent,
     transitionEndEvent: transitionEndEvent,
@@ -141,2 +164,3 @@ isMobile: isMobile,
     supportTouch: supportTouch,
+    supportAnimation: supportAnimation,
     supportTransition: supportTransition,
@@ -149,2 +173,3 @@ addClass: addClass,
     one: one,
+    emulateAnimationEnd: emulateAnimationEnd,
     emulateTransitionEnd: emulateTransitionEnd,
@@ -154,2 +179,3 @@ isElementInScrollRange: isElementInScrollRange,
     passiveHandler: passiveHandler,
+    getElementAnimationDuration: getElementAnimationDuration,
     getElementTransitionDuration: getElementTransitionDuration,
@@ -156,0 +182,0 @@ queryElement: queryElement,

dist/shorter-js.min.js

@@ -1,2 +0,2 @@
-// shorter-js v0.1.0 | dnp_theme © 2020 | MIT-License
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).SHORTER=t()}(this,(function(){"use strict";var e="onmouseleave"in document?["mouseenter","mouseleave"]:["mouseover","mouseout"],t="webkitTransition"in document.body.style?"webkitTransitionDuration":"transitionDuration",n="webkitTransition"in document.body.style?"webkitTransitionEnd":"transitionend",o=/iPhone|iPad|iPod|Android/i.test(navigator.userAgent),i="webkitPerspective"in document.body.style||"perspective"in document.body.style,s=function(){var e=!1;try{var t=Object.defineProperty({},"passive",{get:function(){e=!0}});document.addEventListener("DOMContentLoaded",(function e(){document.removeEventListener("DOMContentLoaded",e,t)}),t)}catch(e){}return e}(),r="webkitTransform"in document.body.style||"transform"in document.body.style,u="ontouchstart"in window||navigator.msMaxTouchPoints||!1,c="webkitTransition"in document.body.style||"transition"in document.body.style;function a(e,t,n,o){o=o||!1,e.addEventListener(t,n,o)}function d(e,t,n,o){o=o||!1,e.removeEventListener(t,n,o)}function m(e){var n=c?parseFloat(getComputedStyle(e)[t]):0;return n="number"!=typeof n||isNaN(n)?0:1e3*n}return{mouseClickEvents:{down:"mousedown",up:"mouseup"},mouseHoverEvents:e,touchEvents:{start:"touchstart",end:"touchend",move:"touchmove",cancel:"touchcancel"},mouseSwipeEvents:{start:"mousedown",end:"mouseup",move:"mousemove",cancel:"mouseout"},transitionDuration:t,transitionEndEvent:n,isMobile:o,support3DTransform:i,supportPassive:s,supportTransform:r,supportTouch:u,supportTransition:c,addClass:function(e,t){e.classList.add(t)},removeClass:function(e,t){e.classList.remove(t)},hasClass:function(e,t){return e.classList.contains(t)},on:a,off:d,one:function(e,t,n,o){a(e,t,(function i(s){s.target===e&&(n(s),d(e,t,i,o))}),o)},emulateTransitionEnd:function(e,t){var o=0;m(e)?e.addEventListener(n,(function i(s){!o&&t(s),o=1,e.removeEventListener(n,i)})):setTimeout((function(){!o&&t(),o=1}),17)},isElementInScrollRange:function(e){var t=e.getBoundingClientRect(),n=window.innerHeight||document.documentElement.clientHeight;return t.top<=n&&t.bottom>=0},isElementInViewport:function(e){var t=e.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)},passiveHandler:!!s&&{passive:!0},getElementTransitionDuration:m,queryElement:function(e,t){var n=t&&t instanceof Element?t:document;return e instanceof Element?e:n.querySelector(e)},tryWrapper:function(e,t){try{e()}catch(e){console.error(t+" "+e)}}}}));
+// shorter-js v0.1.1 | dnp_theme © 2020 | MIT-License
+!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(n=n||self).SHORTER=t()}(this,(function(){"use strict";var n="onmouseleave"in document?["mouseenter","mouseleave"]:["mouseover","mouseout"],t="webkitAnimationDuration"in document.body.style?"webkitAnimationDuration":"animationDuration",e="webkitAnimation"in document.body.style?"webkitAnimationEnd":"animationend",o="webkitTransition"in document.body.style?"webkitTransitionDuration":"transitionDuration",i="webkitTransition"in document.body.style?"webkitTransitionEnd":"transitionend",r=/iPhone|iPad|iPod|Android/i.test(navigator.userAgent),s="webkitPerspective"in document.body.style||"perspective"in document.body.style,u=function(){var n=!1;try{var t=Object.defineProperty({},"passive",{get:function(){n=!0}});document.addEventListener("DOMContentLoaded",(function n(){document.removeEventListener("DOMContentLoaded",n,t)}),t)}catch(n){}return n}(),a="webkitTransform"in document.body.style||"transform"in document.body.style,d="ontouchstart"in window||navigator.msMaxTouchPoints||!1,m="webkitAnimation"in document.body.style||"animation"in document.body.style,c="webkitTransition"in document.body.style||"transition"in document.body.style;function l(n,t,e,o){o=o||!1,n.addEventListener(t,e,o)}function v(n,t,e,o){o=o||!1,n.removeEventListener(t,e,o)}function f(n){var e=m?parseFloat(getComputedStyle(n)[t]):0;return e="number"!=typeof e||isNaN(e)?0:1e3*e}function p(n){var t=c?parseFloat(getComputedStyle(n)[o]):0;return t="number"!=typeof t||isNaN(t)?0:1e3*t}return{mouseClickEvents:{down:"mousedown",up:"mouseup"},mouseHoverEvents:n,touchEvents:{start:"touchstart",end:"touchend",move:"touchmove",cancel:"touchcancel"},mouseSwipeEvents:{start:"mousedown",end:"mouseup",move:"mousemove",cancel:"mouseout"},animationDuration:t,transitionDuration:o,animationEndEvent:e,transitionEndEvent:i,isMobile:r,support3DTransform:s,supportPassive:u,supportTransform:a,supportTouch:d,supportAnimation:m,supportTransition:c,addClass:function(n,t){n.classList.add(t)},removeClass:function(n,t){n.classList.remove(t)},hasClass:function(n,t){return n.classList.contains(t)},on:l,off:v,one:function(n,t,e,o){l(n,t,(function i(r){r.target===n&&(e(r),v(n,t,i,o))}),o)},emulateAnimationEnd:function(n,t){var o=0;f(n)?n.addEventListener(e,(function i(r){!o&&t(r),o=1,n.removeEventListener(e,i)})):setTimeout((function(){!o&&t(),o=1}),17)},emulateTransitionEnd:function(n,t){var e=0;p(n)?n.addEventListener(i,(function o(r){!e&&t(r),e=1,n.removeEventListener(i,o)})):setTimeout((function(){!e&&t(),e=1}),17)},isElementInScrollRange:function(n){var t=n.getBoundingClientRect(),e=window.innerHeight||document.documentElement.clientHeight;return t.top<=e&&t.bottom>=0},isElementInViewport:function(n){var t=n.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)},passiveHandler:!!u&&{passive:!0},getElementAnimationDuration:f,getElementTransitionDuration:p,queryElement:function(n,t){var e=t&&t instanceof Element?t:document;return n instanceof Element?n:e.querySelector(n)},tryWrapper:function(n,t){try{n()}catch(n){console.error(t+" "+n)}}}}));

package.json

 {
   "name": "shorter-js",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "A small ES6/ES7 library with various JavaScript tools useful for creating light libraries.",
@@ -5,0 +5,0 @@ "main": "dist/shorter-js.min.js",

README.md

@@ -30,2 +30,3 @@ # shorter-js
 * ***supportTransform*** - checks and preserves the client browser capability for webKit `transform` 
+* ***supportAnimation*** - checks and preserves the client browser capability for webKit keyframe `animation` 
 * ***supportTransition*** - checks and preserves the client browser capability for webKit `transition` 
@@ -79,2 +80,3 @@
 # misc
+* ***emulateAnimationEnd*** - utility to execute a callback function when `animationend` event is triggered, or execute the callback right after for legacy browsers
 * ***emulateTransitionEnd*** - utility to execute a callback function when `transitionend` event is triggered, or execute the callback right after for legacy browsers
@@ -110,3 +112,5 @@ * ***getElementTransitionDuration*** - returns the `transitionDuration` property of a `transition` property
 * ***touchEvents*** - preserves the pointer events from touch actions: start: `touchstart`, end: `touchend`, move: `touchmove`, cancel: `touchcancel`
-* ***transitionDuration*** - preserves the `transitionDuration` event property supported by the client browser 
+* ***animationDuration*** - preserves the `animationDuration` property name supported by the client browser 
+* ***animationEndEvent*** - preserves the `animationEndEvent` event name supported by the client browser 
+* ***transitionDuration*** - preserves the `transitionDuration` property name supported by the client browser 
 * ***transitionEndEvent*** - preserves the `transitionend` event name supported by the client browser 
@@ -131,4 +135,4 @@
 // Example
-import {on} from 'shorter-js/src/event/on.js'
-import {addClass} from 'shorter-js/src/class/addClass.js'
+import on from 'shorter-js/src/event/on.js'
+import addClass from 'shorter-js/src/class/addClass.js'
 ```
@@ -135,0 +139,0 @@

src/index.js

@@ -6,2 +6,4 @@ // strings FIRST
 import mouseSwipeEvents   from './strings/mouseSwipeEvents.js'
+import animationDuration  from './strings/animationDuration.js'
+import animationEndEvent  from './strings/animationEndEvent.js'
 import transitionDuration from './strings/transitionDuration.js'
@@ -16,2 +18,3 @@ import transitionEndEvent from './strings/transitionEndEvent.js'
 import supportTouch       from './boolean/supportTouch.js'
+import supportAnimation  from './boolean/supportAnimation.js'
 import supportTransition  from './boolean/supportTransition.js'
@@ -30,2 +33,3 @@
 // misc
+import emulateAnimationEnd          from './misc/emulateAnimationEnd.js'
 import emulateTransitionEnd         from './misc/emulateTransitionEnd.js'
@@ -35,2 +39,3 @@ import isElementInScrollRange       from './misc/isElementInScrollRange.js'
 import passiveHandler               from './misc/passiveHandler.js'
+import getElementAnimationDuration  from './misc/getElementAnimationDuration.js'
 import getElementTransitionDuration from './misc/getElementTransitionDuration.js'
@@ -45,3 +50,5 @@ import queryElement                 from './misc/queryElement.js'
   mouseSwipeEvents,
+  animationDuration,
   transitionDuration,
+  animationEndEvent,
   transitionEndEvent,
@@ -53,2 +60,3 @@ isMobile,
   supportTouch,
+  supportAnimation,
   supportTransition,
@@ -61,2 +69,3 @@ addClass,
   one,
+  emulateAnimationEnd,
   emulateTransitionEnd,
@@ -66,2 +75,3 @@ isElementInScrollRange,
   passiveHandler,
+  getElementAnimationDuration,
   getElementTransitionDuration,
@@ -68,0 +78,0 @@ queryElement,

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

36382

increased by19.75%

Number of package files

38

increased by15.15%

Lines of code

482

increased by17.85%

Number of lines in readme file

138

increased by2.99%

No dependency changes