tua-body-scroll-lock - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0-0

dist/index.d.ts

 declare const lock: (targetElement?: HTMLElement | HTMLElement[] | null | undefined) => void;
 declare const unlock: (targetElement?: HTMLElement | HTMLElement[] | null | undefined) => void;
-export { lock, unlock };
+declare const clearBodyLocks: () => void;
+export { lock, unlock, clearBodyLocks };

dist/tua-bsl.esm.browser.js

 /**
- * tua-body-scroll-lock v1.1.0
+ * tua-body-scroll-lock v1.2.0-0
  * (c) 2020 Evinma, BuptStEve
@@ -181,3 +181,27 @@ * @license MIT
 };
+const clearBodyLocks = () => {
+    if (isServer())
+        return;
+    lockedNum = 0;
+    if (!detectOS().ios &&
+        typeof unLockCallback === 'function') {
+        unLockCallback();
+        return;
+    }
+    // IOS
+    if (lockedElements.length) {
+        // clear events
+        let element = lockedElements.pop();
+        while (element) {
+            element.ontouchmove = null;
+            element.ontouchstart = null;
+            element = lockedElements.pop();
+        }
+    }
+    if (documentListenerAdded) {
+        document.removeEventListener('touchmove', preventDefault, eventListenerOptions);
+        documentListenerAdded = false;
+    }
+};
 
-export { lock, unlock };
+export { clearBodyLocks, lock, unlock };

dist/tua-bsl.esm.browser.min.js

@@ -1,1 +0,1 @@
-const e=()=>"undefined"==typeof window,t=e=>{e=e||navigator.userAgent;const t=/(iPad).*OS\s([\d_]+)/.test(e);return{ios:!t&&/(iPhone\sOS)\s([\d_]+)/.test(e)||t,android:/(Android);?[\s\/]+([\d.]+)?/.test(e)}};let o=0,n=0,i=0,s=null,r=!1;const l=[],c=function(t){if(e())return!1;if(!t)throw new Error("options must be provided");let o=!1;const n={get passive(){o=!0}},i=()=>{};window.addEventListener("__TUA_BSL_TEST_PASSIVE__",i,n),window.removeEventListener("__TUA_BSL_TEST_PASSIVE__",i,n);const{capture:s}=t;return o?t:void 0!==s&&s}({passive:!1}),d=e=>{e.cancelable&&e.preventDefault()},h=h=>{if(!e()){if(t().ios){if(h){(Array.isArray(h)?h:[h]).forEach(e=>{e&&-1===l.indexOf(e)&&(e.ontouchstart=e=>{n=e.targetTouches[0].clientY,i=e.targetTouches[0].clientX},e.ontouchmove=t=>{1===t.targetTouches.length&&((e,t)=>{if(t){const{scrollTop:o,scrollLeft:s,scrollWidth:r,scrollHeight:l,clientWidth:c,clientHeight:h}=t,a=e.targetTouches[0].clientX-i,u=e.targetTouches[0].clientY-n,f=Math.abs(u)>Math.abs(a),g=u>0&&0===o,y=a>0&&0===s,p=a<0&&s+c+1>=r,v=u<0&&o+h+1>=l;if(f&&(g||v)||!f&&(y||p))return d(e)}e.stopPropagation()})(t,e)},l.push(e))})}r||(document.addEventListener("touchmove",d,c),r=!0)}else o<=0&&(s=t().android?(()=>{const e=document.documentElement,t=document.body,o=e.scrollTop||t.scrollTop,n=Object.assign({},e.style),i=Object.assign({},t.style);return e.style.height="100%",e.style.overflow="hidden",t.style.top=`-${o}px`,t.style.width="100%",t.style.height="auto",t.style.position="fixed",t.style.overflow="hidden",()=>{e.style.height=n.height||"",e.style.overflow=n.overflow||"",["top","width","height","overflow","position"].forEach(e=>{t.style[e]=i[e]||""}),window.scrollTo(0,o)}})():(()=>{const e=document.body,t=Object.assign({},e.style),o=window.innerWidth-e.clientWidth;return e.style.overflow="hidden",e.style.boxSizing="border-box",e.style.paddingRight=`${o}px`,()=>{["overflow","boxSizing","paddingRight"].forEach(o=>{e.style[o]=t[o]||""})}})());o+=1}},a=n=>{if(!(e()||(o-=1)>0))if(t().ios||"function"!=typeof s){if(n){(Array.isArray(n)?n:[n]).forEach(e=>{const t=l.indexOf(e);-1!==t&&(e.ontouchmove=null,e.ontouchstart=null,l.splice(t,1))})}r&&(document.removeEventListener("touchmove",d,c),r=!1)}else s()};export{h as lock,a as unlock};
+const e=()=>"undefined"==typeof window,t=e=>{e=e||navigator.userAgent;const t=/(iPad).*OS\s([\d_]+)/.test(e);return{ios:!t&&/(iPhone\sOS)\s([\d_]+)/.test(e)||t,android:/(Android);?[\s/]+([\d.]+)?/.test(e)}};let o=0,n=0,i=0,s=null,r=!1;const l=[],c=function(t){if(e())return!1;if(!t)throw new Error("options must be provided");let o=!1;const n={get passive(){o=!0}},i=()=>{};window.addEventListener("__TUA_BSL_TEST_PASSIVE__",i,n),window.removeEventListener("__TUA_BSL_TEST_PASSIVE__",i,n);const{capture:s}=t;return o?t:void 0!==s&&s}({passive:!1}),d=e=>{e.cancelable&&e.preventDefault()},h=h=>{if(!e()){if(t().ios){if(h){(Array.isArray(h)?h:[h]).forEach(e=>{e&&-1===l.indexOf(e)&&(e.ontouchstart=e=>{n=e.targetTouches[0].clientY,i=e.targetTouches[0].clientX},e.ontouchmove=t=>{1===t.targetTouches.length&&((e,t)=>{if(t){const{scrollTop:o,scrollLeft:s,scrollWidth:r,scrollHeight:l,clientWidth:c,clientHeight:h}=t,u=e.targetTouches[0].clientX-i,a=e.targetTouches[0].clientY-n,f=Math.abs(a)>Math.abs(u),p=a>0&&0===o,g=u>0&&0===s,v=u<0&&s+c+1>=r,y=a<0&&o+h+1>=l;if(f&&(p||y)||!f&&(g||v))return d(e)}e.stopPropagation()})(t,e)},l.push(e))})}r||(document.addEventListener("touchmove",d,c),r=!0)}else o<=0&&(s=t().android?(()=>{const e=document.documentElement,t=document.body,o=e.scrollTop||t.scrollTop,n=Object.assign({},e.style),i=Object.assign({},t.style);return e.style.height="100%",e.style.overflow="hidden",t.style.top=`-${o}px`,t.style.width="100%",t.style.height="auto",t.style.position="fixed",t.style.overflow="hidden",()=>{e.style.height=n.height||"",e.style.overflow=n.overflow||"",["top","width","height","overflow","position"].forEach(e=>{t.style[e]=i[e]||""}),window.scrollTo(0,o)}})():(()=>{const e=document.body,t=Object.assign({},e.style),o=window.innerWidth-e.clientWidth;return e.style.overflow="hidden",e.style.boxSizing="border-box",e.style.paddingRight=`${o}px`,()=>{["overflow","boxSizing","paddingRight"].forEach(o=>{e.style[o]=t[o]||""})}})());o+=1}},u=n=>{if(!(e()||(o-=1)>0))if(t().ios||"function"!=typeof s){if(n){(Array.isArray(n)?n:[n]).forEach(e=>{const t=l.indexOf(e);-1!==t&&(e.ontouchmove=null,e.ontouchstart=null,l.splice(t,1))})}r&&(document.removeEventListener("touchmove",d,c),r=!1)}else s()},a=()=>{if(!e())if(o=0,t().ios||"function"!=typeof s){if(l.length){let e=l.pop();for(;e;)e.ontouchmove=null,e.ontouchstart=null,e=l.pop()}r&&(document.removeEventListener("touchmove",d,c),r=!1)}else s()};export{a as clearBodyLocks,h as lock,u as unlock};

dist/tua-bsl.esm.js

 /**
- * tua-body-scroll-lock v1.1.0
+ * tua-body-scroll-lock v1.2.0-0
  * (c) 2020 Evinma, BuptStEve
@@ -201,2 +201,29 @@ * @license MIT
 
-export { lock, unlock };
+var clearBodyLocks = function clearBodyLocks() {
+  if (isServer()) return;
+  lockedNum = 0;
+
+  if (!detectOS().ios && typeof unLockCallback === 'function') {
+    unLockCallback();
+    return;
+  } // IOS
+
+
+  if (lockedElements.length) {
+    // clear events
+    var element = lockedElements.pop();
+
+    while (element) {
+      element.ontouchmove = null;
+      element.ontouchstart = null;
+      element = lockedElements.pop();
+    }
+  }
+
+  if (documentListenerAdded) {
+    document.removeEventListener('touchmove', preventDefault, eventListenerOptions);
+    documentListenerAdded = false;
+  }
+};
+
+export { clearBodyLocks, lock, unlock };

dist/tua-bsl.umd.js

 /**
- * tua-body-scroll-lock v1.1.0
+ * tua-body-scroll-lock v1.2.0-0
  * (c) 2020 Evinma, BuptStEve
@@ -206,2 +206,30 @@ * @license MIT
 
+    var clearBodyLocks = function clearBodyLocks() {
+      if (isServer()) return;
+      lockedNum = 0;
+
+      if (!detectOS().ios && typeof unLockCallback === 'function') {
+        unLockCallback();
+        return;
+      } // IOS
+
+
+      if (lockedElements.length) {
+        // clear events
+        var element = lockedElements.pop();
+
+        while (element) {
+          element.ontouchmove = null;
+          element.ontouchstart = null;
+          element = lockedElements.pop();
+        }
+      }
+
+      if (documentListenerAdded) {
+        document.removeEventListener('touchmove', preventDefault, eventListenerOptions);
+        documentListenerAdded = false;
+      }
+    };
+
+    exports.clearBodyLocks = clearBodyLocks;
     exports.lock = lock;
@@ -208,0 +236,0 @@ exports.unlock = unlock;

dist/tua-bsl.umd.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e=e||self).bodyScrollLock={})}(this,function(e){"use strict";var t=function(){return"undefined"==typeof window},o=function(e){e=e||navigator.userAgent;var t=/(iPad).*OS\s([\d_]+)/.test(e);return{ios:!t&&/(iPhone\sOS)\s([\d_]+)/.test(e)||t,android:/(Android);?[\s\/]+([\d.]+)?/.test(e)}};var n=0,i=0,r=0,s=null,c=!1,l=[],d=function(e){if(t())return!1;if(!e)throw new Error("options must be provided");var o=!1,n={get passive(){o=!0}},i=function(){};window.addEventListener("__TUA_BSL_TEST_PASSIVE__",i,n),window.removeEventListener("__TUA_BSL_TEST_PASSIVE__",i,n);var r=e.capture;return o?e:void 0!==r&&r}({passive:!1}),u=function(e){e.cancelable&&e.preventDefault()};e.lock=function(e){if(!t()){if(o().ios){if(e)(Array.isArray(e)?e:[e]).forEach(function(e){e&&-1===l.indexOf(e)&&(e.ontouchstart=function(e){i=e.targetTouches[0].clientY,r=e.targetTouches[0].clientX},e.ontouchmove=function(t){1===t.targetTouches.length&&function(e,t){if(t){var o=t.scrollTop,n=t.scrollLeft,s=t.scrollWidth,c=t.scrollHeight,l=t.clientWidth,d=t.clientHeight,f=e.targetTouches[0].clientX-r,a=e.targetTouches[0].clientY-i,h=Math.abs(a)>Math.abs(f);if(h&&(a>0&&0===o||a<0&&o+d+1>=c)||!h&&(f>0&&0===n||f<0&&n+l+1>=s))return u(e)}e.stopPropagation()}(t,e)},l.push(e))});c||(document.addEventListener("touchmove",u,d),c=!0)}else n<=0&&(s=o().android?(f=document.documentElement,a=document.body,h=f.scrollTop||a.scrollTop,v=Object.assign({},f.style),p=Object.assign({},a.style),f.style.height="100%",f.style.overflow="hidden",a.style.top="-".concat(h,"px"),a.style.width="100%",a.style.height="auto",a.style.position="fixed",a.style.overflow="hidden",function(){f.style.height=v.height||"",f.style.overflow=v.overflow||"",["top","width","height","overflow","position"].forEach(function(e){a.style[e]=p[e]||""}),window.scrollTo(0,h)}):function(){var e=document.body,t=Object.assign({},e.style),o=window.innerWidth-e.clientWidth;return e.style.overflow="hidden",e.style.boxSizing="border-box",e.style.paddingRight="".concat(o,"px"),function(){["overflow","boxSizing","paddingRight"].forEach(function(o){e.style[o]=t[o]||""})}}());var f,a,h,v,p;n+=1}},e.unlock=function(e){if(!(t()||(n-=1)>0))if(o().ios||"function"!=typeof s){if(e)(Array.isArray(e)?e:[e]).forEach(function(e){var t=l.indexOf(e);-1!==t&&(e.ontouchmove=null,e.ontouchstart=null,l.splice(t,1))});c&&(document.removeEventListener("touchmove",u,d),c=!1)}else s()},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=e||self).bodyScrollLock={})}(this,function(e){"use strict";var t=function(){return"undefined"==typeof window},o=function(e){e=e||navigator.userAgent;var t=/(iPad).*OS\s([\d_]+)/.test(e);return{ios:!t&&/(iPhone\sOS)\s([\d_]+)/.test(e)||t,android:/(Android);?[\s/]+([\d.]+)?/.test(e)}};var n=0,i=0,r=0,c=null,s=!1,l=[],u=function(e){if(t())return!1;if(!e)throw new Error("options must be provided");var o=!1,n={get passive(){o=!0}},i=function(){};window.addEventListener("__TUA_BSL_TEST_PASSIVE__",i,n),window.removeEventListener("__TUA_BSL_TEST_PASSIVE__",i,n);var r=e.capture;return o?e:void 0!==r&&r}({passive:!1}),f=function(e){e.cancelable&&e.preventDefault()};e.clearBodyLocks=function(){if(!t())if(n=0,o().ios||"function"!=typeof c){if(l.length)for(var e=l.pop();e;)e.ontouchmove=null,e.ontouchstart=null,e=l.pop();s&&(document.removeEventListener("touchmove",f,u),s=!1)}else c()},e.lock=function(e){if(!t()){if(o().ios){if(e)(Array.isArray(e)?e:[e]).forEach(function(e){e&&-1===l.indexOf(e)&&(e.ontouchstart=function(e){i=e.targetTouches[0].clientY,r=e.targetTouches[0].clientX},e.ontouchmove=function(t){1===t.targetTouches.length&&function(e,t){if(t){var o=t.scrollTop,n=t.scrollLeft,c=t.scrollWidth,s=t.scrollHeight,l=t.clientWidth,u=t.clientHeight,d=e.targetTouches[0].clientX-r,a=e.targetTouches[0].clientY-i,h=Math.abs(a)>Math.abs(d);if(h&&(a>0&&0===o||a<0&&o+u+1>=s)||!h&&(d>0&&0===n||d<0&&n+l+1>=c))return f(e)}e.stopPropagation()}(t,e)},l.push(e))});s||(document.addEventListener("touchmove",f,u),s=!0)}else n<=0&&(c=o().android?(d=document.documentElement,a=document.body,h=d.scrollTop||a.scrollTop,v=Object.assign({},d.style),p=Object.assign({},a.style),d.style.height="100%",d.style.overflow="hidden",a.style.top="-".concat(h,"px"),a.style.width="100%",a.style.height="auto",a.style.position="fixed",a.style.overflow="hidden",function(){d.style.height=v.height||"",d.style.overflow=v.overflow||"",["top","width","height","overflow","position"].forEach(function(e){a.style[e]=p[e]||""}),window.scrollTo(0,h)}):function(){var e=document.body,t=Object.assign({},e.style),o=window.innerWidth-e.clientWidth;return e.style.overflow="hidden",e.style.boxSizing="border-box",e.style.paddingRight="".concat(o,"px"),function(){["overflow","boxSizing","paddingRight"].forEach(function(o){e.style[o]=t[o]||""})}}());var d,a,h,v,p;n+=1}},e.unlock=function(e){if(!(t()||(n-=1)>0))if(o().ios||"function"!=typeof c){if(e)(Array.isArray(e)?e:[e]).forEach(function(e){var t=l.indexOf(e);-1!==t&&(e.ontouchmove=null,e.ontouchstart=null,l.splice(t,1))});s&&(document.removeEventListener("touchmove",f,u),s=!1)}else c()},Object.defineProperty(e,"__esModule",{value:!0})});

package.json

 {
     "name": "tua-body-scroll-lock",
-    "version": "1.1.0",
+    "version": "1.2.0-0",
     "description": "🔐Body scroll locking that just works with everything",
@@ -5,0 +5,0 @@ "main": "dist/tua-bsl.umd.js",

README.md

@@ -155,2 +155,35 @@ # tua-body-scroll-lock
 
+### clearBodyLocks
+In the SPA, if you called `lock`, but forgot to call `unlock` before jumping to other pages, that is too bad. Because the operation of the page is not restored, such as forbid `touchmove`, `clearBodyLocks` is used to clear all side effects. Sure, you can also call `unlock`, but if you have called `lock` multiple times, you must call `unlock` multiple times, which is very unfriendly.
+#### demo.vue
+```js
+<template>
+  // some element
+</template>
+<script>
+import { lock, unlock, clearBodyLocks } from 'tua-body-scroll-lock';
+
+export default {
+  name: 'demo',
+  data () {
+    return {}
+  },
+  methods: {
+    showDialog () {
+      // Disable body scroll
+      lock()
+    },
+    hideDialog () {
+      // Enable body scroll
+      unlock()
+    }
+  },
+  beforeDestroy () {
+    // If forgot to call unlock before jumping to other pages, `clearBodyLocks` can clean all side effect.
+    clearBodyLocks()
+  }
+}
+</script>
+```
+
 ## Demo
@@ -157,0 +190,0 @@

src/index.ts

@@ -190,2 +190,31 @@ import {
 
-export { lock, unlock }
+const clearBodyLocks = () => {
+    if (isServer()) return
+
+    lockedNum = 0
+    if (
+        !detectOS().ios &&
+        typeof unLockCallback === 'function'
+    ) {
+        unLockCallback()
+        return
+    }
+    // IOS
+    if (lockedElements.length) {
+        // clear events
+        let element = lockedElements.pop()
+        while (element) {
+            element.ontouchmove = null
+            element.ontouchstart = null
+
+            element = lockedElements.pop()
+        }
+    }
+
+    if (documentListenerAdded) {
+        document.removeEventListener('touchmove', preventDefault, eventListenerOptions)
+        documentListenerAdded = false
+    }
+}
+
+export { lock, unlock, clearBodyLocks }

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

54726

12.07%

Lines of code

844

12.53%

Number of lines in readme file

223

17.37%

Worsened metrics

Number of low quality alerts

2

100%

No dependency changes