vgapp 0.8.5 → 0.8.7

package/CHANGELOG.md

@@ -1,3 +1,8 @@
+# VEGAS-APP 0.8.3 - 0.8.6 (Январь, 4, 2025)
+* Исправлены ошибки в разных модулях
+
+---
+
 # VEGAS-APP 0.8.2 (Январь, 4, 2025)
 * Оптимизирован модуль VGRollup, см. файл readme.md
 * Оптимизирован модуль VGSidebar, см. файл readme.md

package/app/modules/base-module.js

@@ -154,47 +154,6 @@ class BaseModule {
 		new Animation(element, key, params);
 	}
 
-	isMobileDevice() {
-		const userAgent = navigator.userAgent;
-		const isMobileUA = /Android|iPhone|iPad|iPod/i.test(userAgent);
-		const isTouchDevice = "ontouchstart" in window || navigator.maxTouchPoints > 0;
-		const isSmallScreen = window.innerWidth < 768;
-		const isHighDPI = window.devicePixelRatio >= 2;
-
-		function detectIPadPro() {
-			const userAgent = navigator.userAgent;
-			const platform = navigator.platform;
-
-			const isIPad = /iPad/.test(userAgent) || (platform === 'MacIntel' && navigator.maxTouchPoints > 1);
-
-			if (!isIPad) return { isiPadPro: false };
-
-			const screenWidth = window.screen.width * window.devicePixelRatio;
-			const screenHeight = window.screen.height * window.devicePixelRatio;
-
-			const proResolutions = [
-				{ width: 2048, height: 2732 }, // 12.9"
-				{ width: 1668, height: 2388 }, // 11"
-				{ width: 1668, height: 2224 }  // 10.5"
-			];
-
-			const isProResolution = proResolutions.some(res =>
-				(screenWidth === res.width && screenHeight === res.height) ||
-				(screenWidth === res.height && screenHeight === res.width)
-			);
-
-			return {
-				isiPadPro: isProResolution,
-				screenWidth: screenWidth,
-				screenHeight: screenHeight,
-				userAgent: userAgent,
-				platform: platform
-			};
-		}
-
-		return isMobileUA || (isTouchDevice && isSmallScreen && isHighDPI) || detectIPadPro().isiPadPro;
-	}
-
 	static getInstance(element) {
 		return Data.get(Selectors.find(element), this.NAME_KEY)
 	}

package/app/modules/vgdropdown/js/vgdropdown.js

@@ -1,7 +1,7 @@
 import BaseModule from "../../base-module";
 import EventHandler from "../../../utils/js/dom/event";
 import Selectors from "../../../utils/js/dom/selectors";
-import {isDisabled, mergeDeepObject, noop} from "../../../utils/js/functions";
+import {isDisabled, isMobileDevice, mergeDeepObject, noop} from "../../../utils/js/functions";
 import Placement from "../../../utils/js/components/placement";
 
 /**
@@ -299,7 +299,7 @@ class VGDropdown extends BaseModule {
 	static init(element, params = {}) {
 		const instance = VGDropdown.getOrCreateInstance(element, params);
 
-		if (instance._params.hover && !instance.isMobileDevice()) {
+		if (instance._params.hover && !isMobileDevice()) {
 			let currentElem = null;
 
 			EventHandler.on(instance._parent, EVENT_MOUSEOVER_DATA_API, (event) => {

package/app/modules/vgfiles/js/vgfiles.js

@@ -10,6 +10,7 @@ import {lang_buttons, lang_messages} from "../../../utils/js/components/lang";
 import VGAlert from "../../vgalert";
 import VGToast from "../../vgtoast";
 import VGFilesTemplateRender from "./render";
+import VGFilesSortable from "./sortable";
 
 const NAME = 'files';
 const NAME_KEY = 'vg.files';
@@ -168,11 +169,7 @@ class VGFiles extends VGFilesBase {
 
         // Если нужно — запустить sortable
         if (this._params.sortable?.enabled && this._params.sortable.route && !this._sortable) {
-            import('./sortable.js').then(module => {
-                this._sortable = new module.default(this, this._params.sortable);
-            }).catch(err => {
-                console.error('Ошибка загрузки VGFilesSortable:', err);
-            });
+            this._sortable = new VGFilesSortable(this, this._params.sortable)
         }
 
         // Триггерим изменение

package/app/modules/vgnav/js/vgnav.js

@@ -1,7 +1,15 @@
 import BaseModule from "../../base-module";
 import Selectors from "../../../utils/js/dom/selectors";
 import {getSVG} from "../../module-fn";
-import {execute, isDisabled, isVisible, mergeDeepObject, noop, normalizeData} from "../../../utils/js/functions";
+import {
+	execute,
+	isDisabled,
+	isMobileDevice,
+	isVisible,
+	mergeDeepObject,
+	noop,
+	normalizeData
+} from "../../../utils/js/functions";
 import EventHandler from "../../../utils/js/dom/event";
 import {Manipulator} from "../../../utils/js/dom/manipulator";
 import Placement from "../../../utils/js/components/placement";
@@ -332,7 +340,7 @@ class VGNav extends BaseModule {
 
 		let drops = Selectors.findAll('.dropdown', instance.navigation);
 
-		if (instance._params.hover && !instance.isMobileDevice()) {
+		if (instance._params.hover && !isMobileDevice()) {
 			[...drops].forEach(function (el) {
 				let currentElem = null;
 
@@ -431,7 +439,7 @@ EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (
 		execute(instance._params.callbacks.afterClick, [instance, event, this]);
 	}
 
-	if (instance._params.hover && !instance.isMobileDevice()) return;
+	if (instance._params.hover && !isMobileDevice()) return;
 
 	event.preventDefault();
 

package/app/utils/js/components/backdrop.js

@@ -10,7 +10,7 @@ const CLASS_NAME_FADE = 'fade';
 const CLASS_NAME_SHOW = 'show';
 const EVENT_MOUSEDOWN = `mousedown.vg.${NAME}`;
 
-const backdropDelay = 150; // Уменьшено для более плавного UX
+const backdropDelay = 150;
 
 class Backdrop {
 	static get _rootEl() {
@@ -25,7 +25,20 @@ class Backdrop {
 	 * @param {Function} callback - вызывается после отображения
 	 */
 	static show(callback) {
+		// Проверяем, существует ли бэкдроп в DOM, даже если _backdrop === null
 		if (!this._backdrop) {
+			this._backdrop = this._rootEl.querySelector(`.${CLASS_NAME}`);
+		}
+
+		// Если найден в DOM — используем его
+		if (this._backdrop) {
+			// Убеждаемся, что классы корректны
+			Classes.add(this._backdrop, CLASS_NAME_SHOW);
+			setTimeout(() => {
+				Classes.add(this._backdrop, CLASS_NAME_FADE);
+			}, backdropDelay);
+		} else {
+			// Создаём новый, если не найден
 			this._append();
 		}
 
@@ -37,6 +50,11 @@ class Backdrop {
 	 * @param {Function} callback - вызывается после скрытия
 	 */
 	static hide(callback) {
+		if (!this._backdrop) {
+			// На всякий случай проверим, есть ли элемент в DOM
+			this._backdrop = this._rootEl.querySelector(`.${CLASS_NAME}`);
+		}
+
 		if (!this._backdrop) return;
 
 		this._destroy().then(execute.bind(null, callback));

package/app/utils/js/components/scrollbar.js

@@ -10,7 +10,7 @@
 
 import { Manipulator } from "../dom/manipulator";
 import Selectors from "../dom/selectors";
-import { isElement } from "../functions";
+import {isElement, isMobileDevice} from "../functions";
 
 /**
  * Константы
@@ -50,14 +50,16 @@ class ScrollBarHelper {
 	 * Скрывает скроллбар и корректирует макет
 	 */
 	hide() {
-		const width = this.getWidth();
-		if (width === 0) return;
-
-		this._disableOverflow();
-
-		this._setStyle(SELECTOR_FIXED_CONTENT, PROPERTY_PADDING, width, (value) => value + width);
-		this._setStyle(SELECTOR_STICKY_CONTENT, PROPERTY_MARGIN, width, (value) => value - width);
-		this._setStyle(this._element, PROPERTY_PADDING, width, (value) => value + width);
+		if (this.isOverflowing && !isMobileDevice()) {
+			const width = this.getWidth();
+			this._disableOverflow();
+
+			this._setStyle(SELECTOR_FIXED_CONTENT, PROPERTY_PADDING, width, (value) => value + width);
+			this._setStyle(SELECTOR_STICKY_CONTENT, PROPERTY_MARGIN, width, (value) => value - width);
+			this._setStyle(this._element, PROPERTY_PADDING, width, (value) => value + width);
+		} else if (isMobileDevice()) {
+			this._disableOverflow();
+		}
 	}
 
 	/**
@@ -70,8 +72,6 @@ class ScrollBarHelper {
 		this._resetStyle(SELECTOR_STICKY_CONTENT, PROPERTY_MARGIN);
 	}
 
-	// === Приватные методы ===
-
 	/**
 	 * Блокирует overflow у body
 	 * @private
@@ -142,7 +142,7 @@ class ScrollBarHelper {
 		// Важно: сохраняем даже пустую строку (если inline-стиля не было)
 		// чтобы reset() мог корректно восстановить "как было".
 		if (value !== null) {
-			Manipulator.set(element, property, value);
+			//Manipulator.set(element, property, value);
 		}
 	}
 

package/app/utils/js/functions.js

@@ -309,6 +309,47 @@ const getDeepestLastChild = (el) => {
  */
 const isRTL = () => document.documentElement.dir === 'rtl';
 
+function isMobileDevice() {
+	const userAgent = navigator.userAgent;
+	const isMobileUA = /Android|iPhone|iPad|iPod/i.test(userAgent);
+	const isTouchDevice = "ontouchstart" in window || navigator.maxTouchPoints > 0;
+	const isSmallScreen = window.innerWidth < 768;
+	const isHighDPI = window.devicePixelRatio >= 2;
+
+	function detectIPadPro() {
+		const userAgent = navigator.userAgent;
+		const platform = navigator.platform;
+
+		const isIPad = /iPad/.test(userAgent) || (platform === 'MacIntel' && navigator.maxTouchPoints > 1);
+
+		if (!isIPad) return { isiPadPro: false };
+
+		const screenWidth = window.screen.width * window.devicePixelRatio;
+		const screenHeight = window.screen.height * window.devicePixelRatio;
+
+		const proResolutions = [
+			{ width: 2048, height: 2732 }, // 12.9"
+			{ width: 1668, height: 2388 }, // 11"
+			{ width: 1668, height: 2224 }  // 10.5"
+		];
+
+		const isProResolution = proResolutions.some(res =>
+			(screenWidth === res.width && screenHeight === res.height) ||
+			(screenWidth === res.height && screenHeight === res.width)
+		);
+
+		return {
+			isiPadPro: isProResolution,
+			screenWidth: screenWidth,
+			screenHeight: screenHeight,
+			userAgent: userAgent,
+			platform: platform
+		};
+	}
+
+	return isMobileUA || (isTouchDevice && isSmallScreen && isHighDPI) || detectIPadPro().isiPadPro;
+}
+
 // экспорт
 export {
 	getDeepestLastChild,
@@ -331,4 +372,5 @@ export {
 	getNextActiveElement,
 	getTransitionDurationFromElement,
 	triggerTransitionEnd,
+	isMobileDevice
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "vgapp",
-	"version": "0.8.5",
+	"version": "0.8.7",
 	"description": "",
 	"author": {
 		"name": "Vegas Studio",