shorter-js
Advanced tools
shorter-js - npm Package Compare versions
Comparing version 0.0.3 to 0.0.4
| /*! | ||
| * shorter-js v0.0.3 (https://thednp.github.io/shorter-js/) | ||
| * shorter-js v0.0.4 (https://thednp.github.io/shorter-js/) | ||
| * Copyright 2019-2020 © dnp_theme | ||
@@ -85,2 +85,18 @@ * Licensed under MIT (https://github.com/thednp/shorter-js/blob/master/LICENSE) | ||
| function isElementInScrollRange(element) { | ||
| var bcr = element.getBoundingClientRect(), | ||
| viewportHeight = window.innerHeight || document.documentElement.clientHeight; | ||
| return bcr.top <= viewportHeight && bcr.bottom >= 0; | ||
| } | ||
| function isElementInViewport(element) { | ||
| var bcr = element.getBoundingClientRect(); | ||
| return ( | ||
| bcr.top >= 0 && | ||
| bcr.left >= 0 && | ||
| bcr.bottom <= (window.innerHeight || document.documentElement.clientHeight) && | ||
| bcr.right <= (window.innerWidth || document.documentElement.clientWidth) | ||
| ) | ||
| } | ||
| var passiveHandler = supportPassive ? { passive: true } : false; | ||
@@ -97,2 +113,4 @@ | ||
| exports.hasClass = hasClass; | ||
| exports.isElementInScrollRange = isElementInScrollRange; | ||
| exports.isElementInViewport = isElementInViewport; | ||
| exports.mouseClickEvents = mouseClickEvents; | ||
@@ -99,0 +117,0 @@ exports.mouseHoverEvents = mouseHoverEvents; |
@@ -1,2 +0,2 @@ | ||
| // shorter-js v0.0.3 | dnp_theme © 2020 | MIT-License | ||
| !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((e=e||self).SHORTER={})}(this,(function(e){"use strict";var n="onmouseleave"in document?["mouseenter","mouseleave"]:["mouseover","mouseout"],t="webkitTransition"in document.body.style?"webkitTransitionDuration":"transitionDuration",o="webkitTransition"in document.body.style?"webkitTransitionEnd":"transitionend",i="webkitPerspective"in document.body.style||"perspective"in document.body.style;function s(e,n,t,o){o=o||!1,e.addEventListener(n,t,o)}function r(e,n,t,o){o=o||!1,e.removeEventListener(n,t,o)}function u(e,n,t,o){s(e,n,(function i(s){s.target===e&&(t(s),r(e,n,i,o))}),o)}var a=function(){var e=!1;try{var n=Object.defineProperty({},"passive",{get:function(){e=!0}});u(document,"DOMContentLoaded",(function(){}),n)}catch(e){}return e}(),c="webkitTransform"in document.body.style||"transform"in document.body.style,d="webkitTransition"in document.body.style||"transition"in document.body.style;function m(e){var n=d?window.getComputedStyle(e)[t]:0;return n="number"!=typeof(n=parseFloat(n))||isNaN(n)?0:1e3*n}var f=!!a&&{passive:!0};e.addClass=function(e,n){e.classList.add(n)},e.emulateTransitionEnd=function(e,n){var t=0;m(e)?u(e,o,(function(e){!t&&n(e),t=1})):setTimeout((function(){!t&&n(),t=1}),17)},e.getElementTransitionDuration=m,e.hasClass=function(e,n){return e.classList.contains(n)},e.mouseClickEvents={down:"mousedown",up:"mouseup"},e.mouseHoverEvents=n,e.off=r,e.on=s,e.one=u,e.passiveHandler=f,e.queryElement=function(e,n){var t=n&&n instanceof Element?n:document;return e instanceof Element?e:t.querySelector(e)},e.removeClass=function(e,n){e.classList.remove(n)},e.support3DTransform=i,e.supportPassive=a,e.supportTransform=c,e.supportTransition=d,e.touchEvents={start:"touchstart",end:"touchend",move:"touchmove",cancel:"touchcancel"},e.transitionDuration=t,e.transitionEndEvent=o,Object.defineProperty(e,"__esModule",{value:!0})})); | ||
| // shorter-js v0.0.4 | dnp_theme © 2020 | MIT-License | ||
| !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((e=e||self).SHORTER={})}(this,(function(e){"use strict";var n="onmouseleave"in document?["mouseenter","mouseleave"]:["mouseover","mouseout"],t="webkitTransition"in document.body.style?"webkitTransitionDuration":"transitionDuration",o="webkitTransition"in document.body.style?"webkitTransitionEnd":"transitionend",i="webkitPerspective"in document.body.style||"perspective"in document.body.style;function s(e,n,t,o){o=o||!1,e.addEventListener(n,t,o)}function r(e,n,t,o){o=o||!1,e.removeEventListener(n,t,o)}function u(e,n,t,o){s(e,n,(function i(s){s.target===e&&(t(s),r(e,n,i,o))}),o)}var c=function(){var e=!1;try{var n=Object.defineProperty({},"passive",{get:function(){e=!0}});u(document,"DOMContentLoaded",(function(){}),n)}catch(e){}return e}(),a="webkitTransform"in document.body.style||"transform"in document.body.style,d="webkitTransition"in document.body.style||"transition"in document.body.style;function m(e){var n=d?window.getComputedStyle(e)[t]:0;return n="number"!=typeof(n=parseFloat(n))||isNaN(n)?0:1e3*n}var l=!!c&&{passive:!0};e.addClass=function(e,n){e.classList.add(n)},e.emulateTransitionEnd=function(e,n){var t=0;m(e)?u(e,o,(function(e){!t&&n(e),t=1})):setTimeout((function(){!t&&n(),t=1}),17)},e.getElementTransitionDuration=m,e.hasClass=function(e,n){return e.classList.contains(n)},e.isElementInScrollRange=function(e){var n=e.getBoundingClientRect(),t=window.innerHeight||document.documentElement.clientHeight;return n.top<=t&&n.bottom>=0},e.isElementInViewport=function(e){var n=e.getBoundingClientRect();return n.top>=0&&n.left>=0&&n.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&n.right<=(window.innerWidth||document.documentElement.clientWidth)},e.mouseClickEvents={down:"mousedown",up:"mouseup"},e.mouseHoverEvents=n,e.off=r,e.on=s,e.one=u,e.passiveHandler=l,e.queryElement=function(e,n){var t=n&&n instanceof Element?n:document;return e instanceof Element?e:t.querySelector(e)},e.removeClass=function(e,n){e.classList.remove(n)},e.support3DTransform=i,e.supportPassive=c,e.supportTransform=a,e.supportTransition=d,e.touchEvents={start:"touchstart",end:"touchend",move:"touchmove",cancel:"touchcancel"},e.transitionDuration=t,e.transitionEndEvent=o,Object.defineProperty(e,"__esModule",{value:!0})})); |
| { | ||
| "name": "shorter-js", | ||
| "version": "0.0.3", | ||
| "version": "0.0.4", | ||
| "description": "A small ES6/ES7 library with various JavaScript tools useful for creating light libraries.", | ||
@@ -5,0 +5,0 @@ "main": "dist/shorter-js.js", |
@@ -69,5 +69,5 @@ # shorter-js | ||
| on(targetElement,'click',eventHandler,passiveHandler) | ||
| // detach a passive mousedown eventHandler | ||
| // detach a passive mouseup eventHandler | ||
| off(targetElement,'mouseup',eventHandler,passiveHandler) | ||
| // attach a single instance passive mousedown eventHandler | ||
| // attach a single instance passive touchstart eventHandler | ||
| one(targetElement,'touchstart',eventHandler,passiveHandler) | ||
@@ -79,2 +79,4 @@ ``` | ||
| * ***getElementTransitionDuration*** - returns the `transitionDuration` property of a `transition` property | ||
| * ***isElementInScrollRange*** - a quick utility that checks if a target *Element* surface is scrolled within the visible area of the window | ||
| * ***isElementInViewport*** - a quick utility that checks if a target *Element* is scrolled fully into visible window area, might not be useful for elements larger in size than the window itself, the above might be more useful | ||
| * ***passiveHandler*** - a constant that preserves a standard handler `options` with `passive: true event` option used | ||
@@ -91,2 +93,8 @@ * ***queryElement*** - a simple utility to check if a certain item is an *Element* or a selector string, and if a selector string find the FIRST *Element* and return it | ||
| emulateTransitionEnd(targetElement,callback) | ||
| // check if element is in scroll range | ||
| // emulateTransitionEnd for the above | ||
| if (isElementInScrollRange(targetElement)){ | ||
| doSomeAction() | ||
| } | ||
| ``` | ||
@@ -109,7 +117,16 @@ | ||
| off(targetElement,mouseClickEvents.down,eventHandler,passiveHandler) | ||
| // attach a single instance passive mousedown eventHandler | ||
| // attach a single instance passive touchstart eventHandler | ||
| one(targetElement,touchEvents.start,eventHandler,passiveHandler) | ||
| ``` | ||
| # Advanced Use | ||
| To avoid adding un-necessary shorties into your code, you might want to import them directly from their location | ||
| ```js | ||
| // Example | ||
| import {on} from 'shorter-js/src/event/on.js' | ||
| import {addClass} from 'shorter-js/src/class/addClass.js' | ||
| ``` | ||
| # License | ||
| [MIT License](https://github.com/thednp/shorter-js/blob/master/LICENSE) |
@@ -26,4 +26,6 @@ // strings FIRST | ||
| export {emulateTransitionEnd} from './misc/emulateTransitionEnd.js' | ||
| export {isElementInScrollRange} from './misc/isElementInScrollRange.js' | ||
| export {isElementInViewport} from './misc/isElementInViewport.js' | ||
| export {passiveHandler} from './misc/passiveHandler.js' | ||
| export {getElementTransitionDuration} from './misc/getElementTransitionDuration.js' | ||
| export {queryElement} from './misc/queryElement.js' |
New alerts
License Policy Violation
LicenseThis 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
LicenseThis 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
- increased by13.66%
21603
- Number of package files
- increased by7.69%
28
- Lines of code
- increased by14.6%
259
- Number of lines in readme file
- increased by15.18%
129
No dependency changes