devextreme
Version:
HTML5 JavaScript Component Suite for Responsive Web Development
122 lines (120 loc) • 4.93 kB
JavaScript
/**
* DevExtreme (cjs/ui/popup/popup_overflow_manager.js)
* Version: 23.2.6
* Build date: Wed May 01 2024
*
* Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
;
exports.createBodyOverflowManager = void 0;
var _window = require("../../core/utils/window");
var _type = require("../../core/utils/type");
var _dom_adapter = _interopRequireDefault(require("../../core/dom_adapter"));
var _devices = _interopRequireDefault(require("../../core/devices"));
var _common = require("../../core/utils/common");
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : {
default: obj
}
}
const overflowManagerMock = {
setOverflow: _common.noop,
restoreOverflow: _common.noop
};
const createBodyOverflowManager = () => {
if (!(0, _window.hasWindow)()) {
return overflowManagerMock
}
const window = (0, _window.getWindow)();
const documentElement = _dom_adapter.default.getDocument().documentElement;
const body = _dom_adapter.default.getBody();
const isIosDevice = "ios" === _devices.default.real().platform;
const prevSettings = {
overflow: null,
overflowX: null,
overflowY: null,
paddingRight: null,
position: null,
top: null,
left: null
};
const setBodyPaddingRight = () => {
const scrollBarWidth = window.innerWidth - documentElement.clientWidth;
if (prevSettings.paddingRight || scrollBarWidth <= 0) {
return
}
const paddingRight = window.getComputedStyle(body).getPropertyValue("padding-right");
const computedBodyPaddingRight = parseInt(paddingRight, 10);
prevSettings.paddingRight = computedBodyPaddingRight;
body.style.setProperty("padding-right", "".concat(computedBodyPaddingRight + scrollBarWidth, "px"))
};
const restoreBodyPaddingRight = () => {
if (!(0, _type.isDefined)(prevSettings.paddingRight)) {
return
}
if (prevSettings.paddingRight) {
body.style.setProperty("padding-right", "".concat(prevSettings.paddingRight, "px"))
} else {
body.style.removeProperty("padding-right")
}
prevSettings.paddingRight = null
};
return {
setOverflow: isIosDevice ? () => {
if ((0, _type.isDefined)(prevSettings.position) || "fixed" === body.style.position) {
return
}
const {
scrollY: scrollY,
scrollX: scrollX
} = window;
prevSettings.position = body.style.position;
prevSettings.top = body.style.top;
prevSettings.left = body.style.left;
body.style.setProperty("position", "fixed");
body.style.setProperty("top", "".concat(-scrollY, "px"));
body.style.setProperty("left", "".concat(-scrollX, "px"))
} : () => {
setBodyPaddingRight();
if (prevSettings.overflow || "hidden" === body.style.overflow) {
return
}
prevSettings.overflow = body.style.overflow;
prevSettings.overflowX = body.style.overflowX;
prevSettings.overflowY = body.style.overflowY;
body.style.setProperty("overflow", "hidden")
},
restoreOverflow: isIosDevice ? () => {
if (!(0, _type.isDefined)(prevSettings.position)) {
return
}
const scrollY = -parseInt(body.style.top, 10);
const scrollX = -parseInt(body.style.left, 10);
["position", "top", "left"].forEach(property => {
if (prevSettings[property]) {
body.style.setProperty(property, prevSettings[property])
} else {
body.style.removeProperty(property)
}
});
window.scrollTo(scrollX, scrollY);
prevSettings.position = null
} : () => {
restoreBodyPaddingRight();
["overflow", "overflowX", "overflowY"].forEach(property => {
if (!(0, _type.isDefined)(prevSettings[property])) {
return
}
const propertyInKebabCase = property.replace(/(X)|(Y)/, symbol => "-".concat(symbol.toLowerCase()));
if (prevSettings[property]) {
body.style.setProperty(propertyInKebabCase, prevSettings[property])
} else {
body.style.removeProperty(propertyInKebabCase)
}
prevSettings[property] = null
})
}
}
};
exports.createBodyOverflowManager = createBodyOverflowManager;