Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

tua-body-scroll-lock

Package Overview
Dependencies
Maintainers
2
Versions
35
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

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

Comparing version 0.3.0 to 0.3.1

2

dist/tua-bsl.esm.browser.js
/**
* tua-body-scroll-lock v0.3.0
* tua-body-scroll-lock v0.3.1
* (c) 2019 Evinma, BuptStEve

@@ -4,0 +4,0 @@ * @license MIT

112

dist/tua-bsl.esm.js
/**
* tua-body-scroll-lock v0.3.0
* tua-body-scroll-lock v0.3.1
* (c) 2019 Evinma, BuptStEve

@@ -7,13 +7,17 @@ * @license MIT

const isServer = () => typeof window === 'undefined';
const $ = selector => document.querySelector(selector);
const detectOS = ua => {
var isServer = function isServer() {
return typeof window === 'undefined';
};
var $ = function $(selector) {
return document.querySelector(selector);
};
var detectOS = function detectOS(ua) {
ua = ua || navigator.userAgent;
const ipad = /(iPad).*OS\s([\d_]+)/.test(ua);
const iphone = !ipad && /(iPhone\sOS)\s([\d_]+)/.test(ua);
const android = /(Android);?[\s/]+([\d.]+)?/.test(ua);
const ios = iphone || ipad;
var ipad = /(iPad).*OS\s([\d_]+)/.test(ua);
var iphone = !ipad && /(iPhone\sOS)\s([\d_]+)/.test(ua);
var android = /(Android);?[\s/]+([\d.]+)?/.test(ua);
var ios = iphone || ipad;
return {
ios,
android
ios: ios,
android: android
};

@@ -29,4 +33,4 @@ };

let isSupportOptions = false;
const listenerOptions = {
var isSupportOptions = false;
var listenerOptions = {
get passive() {

@@ -40,10 +44,8 @@ isSupportOptions = true;

const noop = () => {};
var noop = function noop() {};
const testEvent = '__TUA_BSL_TEST_PASSIVE__';
var testEvent = '__TUA_BSL_TEST_PASSIVE__';
window.addEventListener(testEvent, noop, listenerOptions);
window.removeEventListener(testEvent, noop, listenerOptions);
const {
capture
} = options;
var capture = options.capture;
/* istanbul ignore next */

@@ -54,20 +56,20 @@

let lockedNum = 0;
let initialClientY = 0;
let unLockCallback = null;
let documentListenerAdded = false;
const lockedElements = [];
const eventListenerOptions = getEventListenerOptions({
var lockedNum = 0;
var initialClientY = 0;
var unLockCallback = null;
var documentListenerAdded = false;
var lockedElements = [];
var eventListenerOptions = getEventListenerOptions({
passive: false
});
const setOverflowHiddenPc = () => {
const $body = $('body');
const bodyStyle = Object.assign({}, $body.style);
const scrollBarWidth = window.innerWidth - document.body.clientWidth;
var setOverflowHiddenPc = function setOverflowHiddenPc() {
var $body = $('body');
var bodyStyle = Object.assign({}, $body.style);
var scrollBarWidth = window.innerWidth - document.body.clientWidth;
$body.style.overflow = 'hidden';
$body.style.boxSizing = 'border-box';
$body.style.paddingRight = `${scrollBarWidth}px`;
return () => {
['overflow', 'boxSizing', 'paddingRight'].forEach(x => {
$body.style.paddingRight = "".concat(scrollBarWidth, "px");
return function () {
['overflow', 'boxSizing', 'paddingRight'].forEach(function (x) {
$body.style[x] = bodyStyle[x] || '';

@@ -78,11 +80,11 @@ });

const setOverflowHiddenMobile = () => {
const $html = $('html');
const $body = $('body');
const scrollTop = $html.scrollTop || $body.scrollTop;
const htmlStyle = Object.assign({}, $html.style);
const bodyStyle = Object.assign({}, $body.style);
var setOverflowHiddenMobile = function setOverflowHiddenMobile() {
var $html = $('html');
var $body = $('body');
var scrollTop = $html.scrollTop || $body.scrollTop;
var htmlStyle = Object.assign({}, $html.style);
var bodyStyle = Object.assign({}, $body.style);
$html.style.height = '100%';
$html.style.overflow = 'hidden';
$body.style.top = `-${scrollTop}px`;
$body.style.top = "-".concat(scrollTop, "px");
$body.style.width = '100%';

@@ -92,6 +94,6 @@ $body.style.height = 'auto';

$body.style.overflow = 'hidden';
return () => {
return function () {
$html.style.height = htmlStyle.height || '';
$html.style.overflow = htmlStyle.overflow || '';
['top', 'width', 'height', 'overflow', 'position'].forEach(x => {
['top', 'width', 'height', 'overflow', 'position'].forEach(function (x) {
$body.style[x] = bodyStyle[x] || '';

@@ -103,3 +105,3 @@ });

const preventDefault = event => {
var preventDefault = function preventDefault(event) {
if (!event.cancelable) return;

@@ -109,13 +111,11 @@ event.preventDefault();

const handleScroll = (event, targetElement) => {
const clientY = event.targetTouches[0].clientY - initialClientY;
var handleScroll = function handleScroll(event, targetElement) {
var clientY = event.targetTouches[0].clientY - initialClientY;
if (targetElement) {
const {
scrollTop,
scrollHeight,
clientHeight
} = targetElement;
const isOnTop = clientY > 0 && scrollTop === 0;
const isOnBottom = clientY < 0 && scrollTop + clientHeight + 1 >= scrollHeight;
var scrollTop = targetElement.scrollTop,
scrollHeight = targetElement.scrollHeight,
clientHeight = targetElement.clientHeight;
var isOnTop = clientY > 0 && scrollTop === 0;
var isOnBottom = clientY < 0 && scrollTop + clientHeight + 1 >= scrollHeight;

@@ -131,10 +131,10 @@ if (isOnTop || isOnBottom) {

const checkTargetElement = targetElement => {
var checkTargetElement = function checkTargetElement(targetElement) {
if (targetElement) return;
if (targetElement === null) return;
if (process.env.NODE_ENV === 'production') return;
console.warn(`If scrolling is also required in the floating layer, ` + `the target element must be provided.`);
console.warn("If scrolling is also required in the floating layer, " + "the target element must be provided.");
};
const lock = targetElement => {
var lock = function lock(targetElement) {
if (isServer()) return;

@@ -146,7 +146,7 @@ checkTargetElement(targetElement);

if (targetElement && lockedElements.indexOf(targetElement) === -1) {
targetElement.ontouchstart = event => {
targetElement.ontouchstart = function (event) {
initialClientY = event.targetTouches[0].clientY;
};
targetElement.ontouchmove = event => {
targetElement.ontouchmove = function (event) {
if (event.targetTouches.length !== 1) return;

@@ -170,3 +170,3 @@ handleScroll(event, targetElement);

const unlock = targetElement => {
var unlock = function unlock(targetElement) {
if (isServer()) return;

@@ -184,3 +184,3 @@ checkTargetElement(targetElement);

if (targetElement) {
const index = lockedElements.indexOf(targetElement);
var index = lockedElements.indexOf(targetElement);

@@ -187,0 +187,0 @@ if (index !== -1) {

112

dist/tua-bsl.umd.js
/**
* tua-body-scroll-lock v0.3.0
* tua-body-scroll-lock v0.3.1
* (c) 2019 Evinma, BuptStEve

@@ -13,13 +13,17 @@ * @license MIT

const isServer = () => typeof window === 'undefined';
const $ = selector => document.querySelector(selector);
const detectOS = ua => {
var isServer = function isServer() {
return typeof window === 'undefined';
};
var $ = function $(selector) {
return document.querySelector(selector);
};
var detectOS = function detectOS(ua) {
ua = ua || navigator.userAgent;
const ipad = /(iPad).*OS\s([\d_]+)/.test(ua);
const iphone = !ipad && /(iPhone\sOS)\s([\d_]+)/.test(ua);
const android = /(Android);?[\s/]+([\d.]+)?/.test(ua);
const ios = iphone || ipad;
var ipad = /(iPad).*OS\s([\d_]+)/.test(ua);
var iphone = !ipad && /(iPhone\sOS)\s([\d_]+)/.test(ua);
var android = /(Android);?[\s/]+([\d.]+)?/.test(ua);
var ios = iphone || ipad;
return {
ios,
android
ios: ios,
android: android
};

@@ -35,4 +39,4 @@ };

let isSupportOptions = false;
const listenerOptions = {
var isSupportOptions = false;
var listenerOptions = {
get passive() {

@@ -46,10 +50,8 @@ isSupportOptions = true;

const noop = () => {};
var noop = function noop() {};
const testEvent = '__TUA_BSL_TEST_PASSIVE__';
var testEvent = '__TUA_BSL_TEST_PASSIVE__';
window.addEventListener(testEvent, noop, listenerOptions);
window.removeEventListener(testEvent, noop, listenerOptions);
const {
capture
} = options;
var capture = options.capture;
/* istanbul ignore next */

@@ -60,20 +62,20 @@

let lockedNum = 0;
let initialClientY = 0;
let unLockCallback = null;
let documentListenerAdded = false;
const lockedElements = [];
const eventListenerOptions = getEventListenerOptions({
var lockedNum = 0;
var initialClientY = 0;
var unLockCallback = null;
var documentListenerAdded = false;
var lockedElements = [];
var eventListenerOptions = getEventListenerOptions({
passive: false
});
const setOverflowHiddenPc = () => {
const $body = $('body');
const bodyStyle = Object.assign({}, $body.style);
const scrollBarWidth = window.innerWidth - document.body.clientWidth;
var setOverflowHiddenPc = function setOverflowHiddenPc() {
var $body = $('body');
var bodyStyle = Object.assign({}, $body.style);
var scrollBarWidth = window.innerWidth - document.body.clientWidth;
$body.style.overflow = 'hidden';
$body.style.boxSizing = 'border-box';
$body.style.paddingRight = `${scrollBarWidth}px`;
return () => {
['overflow', 'boxSizing', 'paddingRight'].forEach(x => {
$body.style.paddingRight = "".concat(scrollBarWidth, "px");
return function () {
['overflow', 'boxSizing', 'paddingRight'].forEach(function (x) {
$body.style[x] = bodyStyle[x] || '';

@@ -84,11 +86,11 @@ });

const setOverflowHiddenMobile = () => {
const $html = $('html');
const $body = $('body');
const scrollTop = $html.scrollTop || $body.scrollTop;
const htmlStyle = Object.assign({}, $html.style);
const bodyStyle = Object.assign({}, $body.style);
var setOverflowHiddenMobile = function setOverflowHiddenMobile() {
var $html = $('html');
var $body = $('body');
var scrollTop = $html.scrollTop || $body.scrollTop;
var htmlStyle = Object.assign({}, $html.style);
var bodyStyle = Object.assign({}, $body.style);
$html.style.height = '100%';
$html.style.overflow = 'hidden';
$body.style.top = `-${scrollTop}px`;
$body.style.top = "-".concat(scrollTop, "px");
$body.style.width = '100%';

@@ -98,6 +100,6 @@ $body.style.height = 'auto';

$body.style.overflow = 'hidden';
return () => {
return function () {
$html.style.height = htmlStyle.height || '';
$html.style.overflow = htmlStyle.overflow || '';
['top', 'width', 'height', 'overflow', 'position'].forEach(x => {
['top', 'width', 'height', 'overflow', 'position'].forEach(function (x) {
$body.style[x] = bodyStyle[x] || '';

@@ -109,3 +111,3 @@ });

const preventDefault = event => {
var preventDefault = function preventDefault(event) {
if (!event.cancelable) return;

@@ -115,13 +117,11 @@ event.preventDefault();

const handleScroll = (event, targetElement) => {
const clientY = event.targetTouches[0].clientY - initialClientY;
var handleScroll = function handleScroll(event, targetElement) {
var clientY = event.targetTouches[0].clientY - initialClientY;
if (targetElement) {
const {
scrollTop,
scrollHeight,
clientHeight
} = targetElement;
const isOnTop = clientY > 0 && scrollTop === 0;
const isOnBottom = clientY < 0 && scrollTop + clientHeight + 1 >= scrollHeight;
var scrollTop = targetElement.scrollTop,
scrollHeight = targetElement.scrollHeight,
clientHeight = targetElement.clientHeight;
var isOnTop = clientY > 0 && scrollTop === 0;
var isOnBottom = clientY < 0 && scrollTop + clientHeight + 1 >= scrollHeight;

@@ -137,9 +137,9 @@ if (isOnTop || isOnBottom) {

const checkTargetElement = targetElement => {
var checkTargetElement = function checkTargetElement(targetElement) {
if (targetElement) return;
if (targetElement === null) return;
console.warn(`If scrolling is also required in the floating layer, ` + `the target element must be provided.`);
console.warn("If scrolling is also required in the floating layer, " + "the target element must be provided.");
};
const lock = targetElement => {
var lock = function lock(targetElement) {
if (isServer()) return;

@@ -151,7 +151,7 @@ checkTargetElement(targetElement);

if (targetElement && lockedElements.indexOf(targetElement) === -1) {
targetElement.ontouchstart = event => {
targetElement.ontouchstart = function (event) {
initialClientY = event.targetTouches[0].clientY;
};
targetElement.ontouchmove = event => {
targetElement.ontouchmove = function (event) {
if (event.targetTouches.length !== 1) return;

@@ -175,3 +175,3 @@ handleScroll(event, targetElement);

const unlock = targetElement => {
var unlock = function unlock(targetElement) {
if (isServer()) return;

@@ -189,3 +189,3 @@ checkTargetElement(targetElement);

if (targetElement) {
const index = lockedElements.indexOf(targetElement);
var index = lockedElements.indexOf(targetElement);

@@ -192,0 +192,0 @@ if (index !== -1) {

2

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";const t=()=>"undefined"==typeof window,o=e=>document.querySelector(e),n=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 i=0,s=0,l=null,r=!1;const d=[],c=function(e){if(t())return!1;if(!e)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}=e;return o?e:void 0!==s&&s}({passive:!1}),u=e=>{e.cancelable&&e.preventDefault()};e.lock=e=>{t()||(n().ios?(e&&-1===d.indexOf(e)&&(e.ontouchstart=e=>{s=e.targetTouches[0].clientY},e.ontouchmove=t=>{1===t.targetTouches.length&&((e,t)=>{const o=e.targetTouches[0].clientY-s;if(t){const{scrollTop:n,scrollHeight:i,clientHeight:s}=t,l=o<0&&n+s+1>=i;if(o>0&&0===n||l)return u(e)}e.stopPropagation()})(t,e)},d.push(e)),r||(document.addEventListener("touchmove",u,c),r=!0)):i<=0&&(l=n().android?(()=>{const e=o("html"),t=o("body"),n=e.scrollTop||t.scrollTop,i=Object.assign({},e.style),s=Object.assign({},t.style);return e.style.height="100%",e.style.overflow="hidden",t.style.top=`-${n}px`,t.style.width="100%",t.style.height="auto",t.style.position="fixed",t.style.overflow="hidden",()=>{e.style.height=i.height||"",e.style.overflow=i.overflow||"",["top","width","height","overflow","position"].forEach(e=>{t.style[e]=s[e]||""}),window.scrollTo(0,n)}})():(()=>{const e=o("body"),t=Object.assign({},e.style),n=window.innerWidth-document.body.clientWidth;return e.style.overflow="hidden",e.style.boxSizing="border-box",e.style.paddingRight=`${n}px`,()=>{["overflow","boxSizing","paddingRight"].forEach(o=>{e.style[o]=t[o]||""})}})()),i+=1)},e.unlock=e=>{if(!(t()||(i-=1)>0))if(n().ios||"function"!=typeof l){if(e){const t=d.indexOf(e);-1!==t&&(e.ontouchmove=null,e.ontouchstart=null,d.splice(t,1))}r&&(document.removeEventListener("touchmove",u,c),r=!1)}else l()},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){return document.querySelector(e)},n=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 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){var f,a,h,v,p;t()||(n().ios?(e&&-1===l.indexOf(e)&&(e.ontouchstart=function(e){r=e.targetTouches[0].clientY},e.ontouchmove=function(t){1===t.targetTouches.length&&function(e,t){var o=e.targetTouches[0].clientY-r;if(t){var n=t.scrollTop,i=t.scrollHeight,s=t.clientHeight;if(o>0&&0===n||o<0&&n+s+1>=i)return u(e)}e.stopPropagation()}(t,e)},l.push(e)),c||(document.addEventListener("touchmove",u,d),c=!0)):i<=0&&(s=n().android?(f=o("html"),a=o("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=o("body"),t=Object.assign({},e.style),n=window.innerWidth-document.body.clientWidth;return e.style.overflow="hidden",e.style.boxSizing="border-box",e.style.paddingRight="".concat(n,"px"),function(){["overflow","boxSizing","paddingRight"].forEach(function(o){e.style[o]=t[o]||""})}}()),i+=1)},e.unlock=function(e){if(!(t()||(i-=1)>0))if(n().ios||"function"!=typeof s){if(e){var o=l.indexOf(e);-1!==o&&(e.ontouchmove=null,e.ontouchstart=null,l.splice(o,1))}c&&(document.removeEventListener("touchmove",u,d),c=!1)}else s()},Object.defineProperty(e,"__esModule",{value:!0})});

5

package.json
{
"name": "tua-body-scroll-lock",
"version": "0.3.0",
"version": "0.3.1",
"description": "🔐Body scroll locking that just works with everything",

@@ -18,3 +18,4 @@ "main": "dist/tua-bsl.umd.js",

"test:tdd": "cross-env NODE_ENV=test jest --watch",
"build": "npm run lint && rollup -c && cp index.html dist/index.html",
"prebuild": "rimraf dist/* & npm test",
"build": "npm run lint && cross-env NODE_ENV=production rollup -c && cp index.html dist/index.html",
"next": "npm --no-git-tag-version version prerelease",

@@ -21,0 +22,0 @@ "next:m": "npm --no-git-tag-version version preminor",

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc