devextreme
Version:
JavaScript/TypeScript Component Suite for Responsive Web Development
103 lines (101 loc) • 4.4 kB
JavaScript
/**
* DevExtreme (cjs/__internal/core/environment/init_mobile_viewport.js)
* Version: 25.2.7
* Build date: Tue May 05 2026
*
* Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED
* Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
*/
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.initMobileViewport = void 0;
var _renderer = _interopRequireDefault(require("../../../core/renderer"));
var _m_devices = _interopRequireDefault(require("../../core/m_devices"));
var _m_dom_adapter = _interopRequireDefault(require("../../core/m_dom_adapter"));
var _m_extend = require("../../core/utils/m_extend");
var _m_resize_callbacks = _interopRequireDefault(require("../../core/utils/m_resize_callbacks"));
var _m_size = require("../../core/utils/m_size");
var _m_style = require("../../core/utils/m_style");
var _m_support = _interopRequireDefault(require("../../core/utils/m_support"));
var _m_window = require("../../core/utils/m_window");
var _m_events_engine = _interopRequireDefault(require("../../events/core/m_events_engine"));
function _interopRequireDefault(e) {
return e && e.__esModule ? e : {
default: e
}
}
const window = (0, _m_window.getWindow)();
const initMobileViewport = function(options) {
options = (0, _m_extend.extend)({}, options);
let realDevice = _m_devices.default.real();
const {
allowZoom: allowZoom
} = options;
const {
allowPan: allowPan
} = options;
const allowSelection = "allowSelection" in options ? options.allowSelection : "generic" === realDevice.platform;
if (!(0, _renderer.default)("meta[name=viewport]").length) {
(0, _renderer.default)("<meta>").attr("name", "viewport").appendTo("head")
}
const metaVerbs = ["width=device-width"];
const msTouchVerbs = [];
if (allowZoom) {
msTouchVerbs.push("pinch-zoom")
} else {
metaVerbs.push("initial-scale=1.0", "maximum-scale=1.0, user-scalable=no")
}
if (allowPan) {
msTouchVerbs.push("pan-x", "pan-y")
}
if (!allowPan && !allowZoom) {
(0, _renderer.default)("html, body").css({
msContentZooming: "none",
msUserSelect: "none",
overflow: "hidden"
})
} else {
(0, _renderer.default)("html").css("msOverflowStyle", "-ms-autohiding-scrollbar")
}
if (!allowSelection && _m_support.default.supportProp("userSelect")) {
(0, _renderer.default)(".dx-viewport").css((0, _m_style.styleProp)("userSelect"), "none")
}(0, _renderer.default)("meta[name=viewport]").attr("content", metaVerbs.join());
(0, _renderer.default)("html").css("msTouchAction", msTouchVerbs.join(" ") || "none");
realDevice = _m_devices.default.real();
if (_m_support.default.touch) {
_m_events_engine.default.off(_m_dom_adapter.default.getDocument(), ".dxInitMobileViewport");
_m_events_engine.default.on(_m_dom_adapter.default.getDocument(), "dxpointermove.dxInitMobileViewport", e => {
const count = e.pointers.length;
const isTouchEvent = "touch" === e.pointerType;
const zoomDisabled = !allowZoom && count > 1;
const panDisabled = !allowPan && 1 === count && !e.isScrollingEvent;
if (isTouchEvent && (zoomDisabled || panDisabled)) {
e.preventDefault()
}
})
}
if (realDevice.ios) {
const isPhoneGap = "file:" === _m_dom_adapter.default.getLocation().protocol;
if (!isPhoneGap) {
_m_resize_callbacks.default.add(() => {
const windowWidth = (0, _m_size.getWidth)(window);
(0, _m_size.setWidth)((0, _renderer.default)("body"), windowWidth)
})
}
}
if (realDevice.android) {
_m_resize_callbacks.default.add(() => {
setTimeout(() => {
const activeElement = _m_dom_adapter.default.getActiveElement();
if (activeElement.scrollIntoViewIfNeeded) {
activeElement.scrollIntoViewIfNeeded()
} else {
activeElement.scrollIntoView(false)
}
})
})
}
};
exports.initMobileViewport = initMobileViewport;