vgapp 1.5.7 → 1.5.8

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

@@ -1,154 +1,154 @@
-import { isElement, normalizeData } from "../../../utils/js/functions";
-import Params from "../../../utils/js/components/params";
-import Selectors from "../../../utils/js/dom/selectors";
-import { Manipulator } from "../../../utils/js/dom/manipulator";
-
-class VGFilesTemplateRender {
-	constructor(vgFilesInstance, element, params = {}) {
-		this.module = vgFilesInstance;
-		this.element = isElement(element) ? element : null;
-
-		if (!this.element) {
-			console.error('Invalid element provided:', element);
-			return;
-		}
-
-		this._params = new Params(params, element).get();
-		this._nodes = {
-			info: this.module._nodes.info,
-			drop: this.module._nodes.drop
-		};
-
-		this.bufferTemplate = '';
-		this.parsedFiles = [];
-	}
-
-	init() {
-		const $targetNode = this._nodes.info || this._nodes.drop;
-		if (!$targetNode) return false;
-
-		const area = this._nodes.info ? 'info' : 'drop';
-		return this._nativeRenderFiles(area, $targetNode);
-	}
-
-	_nativeRenderFiles(area, $node) {
-		const $list = Selectors.find(`.vg-files-${area}--list`, $node);
-		if (!$list) return false;
-
-		const $items = Array.from($list.children).filter(li => li.tagName === 'LI');
-		if ($items.length === 0) return false;
-
-		this._setTemplateInBuffer($items);
-		if (!this.bufferTemplate) return false;
-
-		this.parsedFiles = $items
-			.map(li => {
-				const rawData = Manipulator.get(li, 'data-file');
-				if (!rawData) return null;
-
-				return this._parseDataFile(rawData);
-			})
-			.filter(Boolean);
-
-		return true;
-	}
-
-	_parseDataFile(rawData) {
-		const dataFile = normalizeData(rawData);
-		if (!dataFile || typeof dataFile !== 'object' || Array.isArray(dataFile)) return null;
-
-		const binaryMeta = this._extractBinaryMeta(dataFile);
-		const name = this._toStringOrNull(dataFile.name);
-		const id = this._toStringOrNull(dataFile.id);
-		const src = this._toStringOrNull(dataFile.src);
-		const type = this._toStringOrNull(dataFile.type) || binaryMeta.type || 'application/octet-stream';
-		const size = this._toNumberOrNull(dataFile.size) ?? binaryMeta.size ?? 0;
-		const lastModified = this._toNumberOrNull(dataFile.lastModified ?? dataFile['last-modified']) ?? binaryMeta.lastModified ?? Date.now();
-
-		const result = {
-			id,
-			name,
-			size,
-			type,
-			src,
-			lastModified
-		};
-
-		if (dataFile.image !== undefined && dataFile.image !== null && dataFile.image !== '') {
-			result.image = dataFile.image;
-		}
-
-		const requiredKeys = ['id', 'name', 'size', 'type', 'src'];
-		const isValid = requiredKeys.every((key) => {
-			const value = result[key];
-			if (key === 'size') return Number.isFinite(value);
-			return value !== undefined && value !== null && value !== '';
-		});
-
-		if (!isValid) return null;
-
-		const customData = {};
-		const reserved = new Set(['id', 'name', 'size', 'type', 'src', 'image', 'lastModified', 'last-modified']);
-
-		Object.entries(dataFile).forEach(([key, value]) => {
-			if (reserved.has(key)) return;
-			if (value === undefined || value === null || value === '') return;
-			customData[key] = value;
-		});
-
-		if (Object.keys(customData).length) {
-			result.customData = customData;
-		}
-
-		return result;
-	}
-
-	_extractBinaryMeta(dataFile) {
-		const binary = dataFile.file || dataFile.blob || dataFile.originFile || null;
-		if (!(binary instanceof Blob)) return {};
-
-		const size = this._toNumberOrNull(binary.size);
-		const type = this._toStringOrNull(binary.type);
-		const lastModified = (binary instanceof File)
-			? this._toNumberOrNull(binary.lastModified)
-			: null;
-
-		return {
-			size: size ?? null,
-			type: type || null,
-			lastModified: lastModified ?? null
-		};
-	}
-
-	_toStringOrNull(value) {
-		if (value === undefined || value === null) return null;
-		const normalized = String(value).trim();
-		return normalized ? normalized : null;
-	}
-
-	_toNumberOrNull(value) {
-		if (value === undefined || value === null || value === '') return null;
-		const normalized = Number(value);
-		return Number.isFinite(normalized) ? normalized : null;
-	}
-
-	_setTemplateInBuffer($items) {
-		if (this.bufferTemplate || $items.length === 0) return;
-
-		const firstItem = $items[0];
-
-		if (!Manipulator.has(firstItem, 'data-file')) {
-			this.bufferTemplate = firstItem.outerHTML;
-			firstItem.remove();
-		} else {
-			this.bufferTemplate = firstItem.outerHTML;
-		}
-	}
-
-	dispose() {
-		this.bufferTemplate = '';
-		this.parsedFiles = [];
-	}
-}
-
+import { isElement, normalizeData } from "../../../utils/js/functions";
+import Params from "../../../utils/js/components/params";
+import Selectors from "../../../utils/js/dom/selectors";
+import { Manipulator } from "../../../utils/js/dom/manipulator";
+
+class VGFilesTemplateRender {
+	constructor(vgFilesInstance, element, params = {}) {
+		this.module = vgFilesInstance;
+		this.element = isElement(element) ? element : null;
+
+		if (!this.element) {
+			console.error('Invalid element provided:', element);
+			return;
+		}
+
+		this._params = new Params(params, element).get();
+		this._nodes = {
+			info: this.module._nodes.info,
+			drop: this.module._nodes.drop
+		};
+
+		this.bufferTemplate = '';
+		this.parsedFiles = [];
+	}
+
+	init() {
+		const $targetNode = this._nodes.info || this._nodes.drop;
+		if (!$targetNode) return false;
+
+		const area = this._nodes.info ? 'info' : 'drop';
+		return this._nativeRenderFiles(area, $targetNode);
+	}
+
+	_nativeRenderFiles(area, $node) {
+		const $list = Selectors.find(`.vg-files-${area}--list`, $node);
+		if (!$list) return false;
+
+		const $items = Array.from($list.children).filter(li => li.tagName === 'LI');
+		if ($items.length === 0) return false;
+
+		this._setTemplateInBuffer($items);
+		if (!this.bufferTemplate) return false;
+
+		this.parsedFiles = $items
+			.map(li => {
+				const rawData = Manipulator.get(li, 'data-file');
+				if (!rawData) return null;
+
+				return this._parseDataFile(rawData);
+			})
+			.filter(Boolean);
+
+		return true;
+	}
+
+	_parseDataFile(rawData) {
+		const dataFile = normalizeData(rawData);
+		if (!dataFile || typeof dataFile !== 'object' || Array.isArray(dataFile)) return null;
+
+		const binaryMeta = this._extractBinaryMeta(dataFile);
+		const name = this._toStringOrNull(dataFile.name);
+		const id = this._toStringOrNull(dataFile.id);
+		const src = this._toStringOrNull(dataFile.src);
+		const type = this._toStringOrNull(dataFile.type) || binaryMeta.type || 'application/octet-stream';
+		const size = this._toNumberOrNull(dataFile.size) ?? binaryMeta.size ?? 0;
+		const lastModified = this._toNumberOrNull(dataFile.lastModified ?? dataFile['last-modified']) ?? binaryMeta.lastModified ?? Date.now();
+
+		const result = {
+			id,
+			name,
+			size,
+			type,
+			src,
+			lastModified
+		};
+
+		if (dataFile.image !== undefined && dataFile.image !== null && dataFile.image !== '') {
+			result.image = dataFile.image;
+		}
+
+		const requiredKeys = ['id', 'name', 'size', 'type', 'src'];
+		const isValid = requiredKeys.every((key) => {
+			const value = result[key];
+			if (key === 'size') return Number.isFinite(value);
+			return value !== undefined && value !== null && value !== '';
+		});
+
+		if (!isValid) return null;
+
+		const customData = {};
+		const reserved = new Set(['id', 'name', 'size', 'type', 'src', 'image', 'lastModified', 'last-modified']);
+
+		Object.entries(dataFile).forEach(([key, value]) => {
+			if (reserved.has(key)) return;
+			if (value === undefined || value === null || value === '') return;
+			customData[key] = value;
+		});
+
+		if (Object.keys(customData).length) {
+			result.customData = customData;
+		}
+
+		return result;
+	}
+
+	_extractBinaryMeta(dataFile) {
+		const binary = dataFile.file || dataFile.blob || dataFile.originFile || null;
+		if (!(binary instanceof Blob)) return {};
+
+		const size = this._toNumberOrNull(binary.size);
+		const type = this._toStringOrNull(binary.type);
+		const lastModified = (binary instanceof File)
+			? this._toNumberOrNull(binary.lastModified)
+			: null;
+
+		return {
+			size: size ?? null,
+			type: type || null,
+			lastModified: lastModified ?? null
+		};
+	}
+
+	_toStringOrNull(value) {
+		if (value === undefined || value === null) return null;
+		const normalized = String(value).trim();
+		return normalized ? normalized : null;
+	}
+
+	_toNumberOrNull(value) {
+		if (value === undefined || value === null || value === '') return null;
+		const normalized = Number(value);
+		return Number.isFinite(normalized) ? normalized : null;
+	}
+
+	_setTemplateInBuffer($items) {
+		if (this.bufferTemplate || $items.length === 0) return;
+
+		const firstItem = $items[0];
+
+		if (!Manipulator.has(firstItem, 'data-file')) {
+			this.bufferTemplate = firstItem.outerHTML;
+			firstItem.remove();
+		} else {
+			this.bufferTemplate = firstItem.outerHTML;
+		}
+	}
+
+	dispose() {
+		this.bufferTemplate = '';
+		this.parsedFiles = [];
+	}
+}
+
 export default VGFilesTemplateRender;

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

@@ -1,38 +1,38 @@
-/**
- * Описание: управляет сортировкой уже загруженных файлов VGFiles.
- * Возможности: меняет порядок элементов, сохраняет ID на сервере и маркирует внутренний drag для защиты dropzone.
- */
-import Selectors from "../../../utils/js/dom/selectors";
-import {isElement, normalizeData} from "../../../utils/js/functions";
-import Ajax from "../../../utils/js/components/ajax";
-import VGToast from "../../vgtoast";
-
-export const VG_FILES_SORTABLE_DATA_TYPE = 'application/x-vg-files-sortable';
-
-let isSortableDragActive = false;
-let sortableDragClearTimer = null;
-
-export function isVGFilesSortableDragActive() {
-    return isSortableDragActive;
-}
-
-function markSortableDragActive() {
-    if (sortableDragClearTimer) {
-        clearTimeout(sortableDragClearTimer);
-        sortableDragClearTimer = null;
-    }
-    isSortableDragActive = true;
-}
-
-function scheduleSortableDragClear() {
-    if (sortableDragClearTimer) clearTimeout(sortableDragClearTimer);
-    sortableDragClearTimer = setTimeout(() => {
-        isSortableDragActive = false;
-        sortableDragClearTimer = null;
-    }, 0);
-}
-
-class VGFilesSortable {
+/**
+ * Описание: управляет сортировкой уже загруженных файлов VGFiles.
+ * Возможности: меняет порядок элементов, сохраняет ID на сервере и маркирует внутренний drag для защиты dropzone.
+ */
+import Selectors from "../../../utils/js/dom/selectors";
+import {isElement, normalizeData} from "../../../utils/js/functions";
+import Ajax from "../../../utils/js/components/ajax";
+import VGToast from "../../vgtoast";
+
+export const VG_FILES_SORTABLE_DATA_TYPE = 'application/x-vg-files-sortable';
+
+let isSortableDragActive = false;
+let sortableDragClearTimer = null;
+
+export function isVGFilesSortableDragActive() {
+    return isSortableDragActive;
+}
+
+function markSortableDragActive() {
+    if (sortableDragClearTimer) {
+        clearTimeout(sortableDragClearTimer);
+        sortableDragClearTimer = null;
+    }
+    isSortableDragActive = true;
+}
+
+function scheduleSortableDragClear() {
+    if (sortableDragClearTimer) clearTimeout(sortableDragClearTimer);
+    sortableDragClearTimer = setTimeout(() => {
+        isSortableDragActive = false;
+        sortableDragClearTimer = null;
+    }, 0);
+}
+
+class VGFilesSortable {
     constructor(vgFilesInstance, options = {}) {
         this._vg = vgFilesInstance;
         this._params = {
@@ -104,12 +104,12 @@ class VGFilesSortable {
         const item = e.target.closest(this._params.itemSelector) || e.target.closest('li');
         if (!item) return;
 
-        this._draggedItem = item;
-		markSortableDragActive();
-
-        e.dataTransfer.effectAllowed = 'move';
-        e.dataTransfer.setData(VG_FILES_SORTABLE_DATA_TYPE, '1');
-        e.dataTransfer.setData('text/plain', 'vgsortable');
+        this._draggedItem = item;
+		markSortableDragActive();
+
+        e.dataTransfer.effectAllowed = 'move';
+        e.dataTransfer.setData(VG_FILES_SORTABLE_DATA_TYPE, '1');
+        e.dataTransfer.setData('text/plain', 'vgsortable');
 
         item.classList.add('dragging');
         requestAnimationFrame(() => item.classList.add('dragging-transparent'));
@@ -118,11 +118,11 @@ class VGFilesSortable {
     _onDragEnd(e) {
         if (this._draggedItem) {
             this._draggedItem.classList.remove('dragging', 'dragging-transparent');
-            this._draggedItem = null;
-            this._saveOrder();
-        }
-
-		scheduleSortableDragClear();
+            this._draggedItem = null;
+            this._saveOrder();
+        }
+
+		scheduleSortableDragClear();
     }
 
     _onDragOver(e) {
@@ -175,15 +175,15 @@ class VGFilesSortable {
             }).filter(id => id !== null);
     }
 
-    destroy() {
+    destroy() {
         this._list.removeEventListener('dragstart', this._boundOnDragStart);
         this._list.removeEventListener('dragend', this._boundOnDragEnd);
         this._list.removeEventListener('dragover', this._boundOnDragOver);
         this._list.removeEventListener('drop', this._boundOnDrop);
 
-        this._draggedItem = null;
-		scheduleSortableDragClear();
-    }
-}
+        this._draggedItem = null;
+		scheduleSortableDragClear();
+    }
+}
 
-export default VGFilesSortable
+export default VGFilesSortable

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

@@ -1,6 +1,6 @@
 /**
  * Описание: основной класс выбора, отображения и AJAX-загрузки файлов VGFiles.
- * Возможности: управляет списками и dropzone, прогрессом, кастомными действиями, удалением, повторной загрузкой и сортировкой.
+ * Возможности: управляет списками и dropzone, прогрессом, кастомными действиями, удалением, повторной загрузкой и сортировкой.
  */
 import VGFilesBase from "./base";
 import FileUploader from "./loader";
@@ -47,11 +47,11 @@ class VGFiles extends VGFilesBase {
             prepend: true,
             replace: true,
             rename: false,
-            smartdrop: false,
-            customButtons: {
-                hideOnUploadState: true
-            },
-            uploads: {
+            smartdrop: false,
+            customButtons: {
+                hideOnUploadState: true
+            },
+            uploads: {
                 mode: 'sequential',
                 route: '',
                 maxParallel: 3,
@@ -273,11 +273,11 @@ class VGFiles extends VGFilesBase {
             this._failingUploadedKeys.clear();
         }
 
-        const notUploadedFiles = files.filter(f =>
-            this._isFileValid(f) && !this._uploadedKeys.has(this._getFileKey(f))
-        );
-        this._setStatItem('failing', this._getFailingCount());
-        if (!notUploadedFiles.length) return;
+        const notUploadedFiles = files.filter(f =>
+            this._isFileValid(f) && !this._uploadedKeys.has(this._getFileKey(f))
+        );
+        this._setStatItem('failing', this._getFailingCount());
+        if (!notUploadedFiles.length) return;
 
         if (!this._uploader || this._uploader.isIdle()) {
             this._uploader = new FileUploader({
@@ -484,7 +484,7 @@ class VGFiles extends VGFilesBase {
             Classes.remove($item, CLASS_NAME_PENDING);
             Classes.replace($item, CLASS_NAME_LOADING, CLASS_NAME_FAILING);
 
-            this._setStatItem('failing', this._getFailingCount());
+            this._setStatItem('failing', this._getFailingCount());
             this._setStatItem('pending', this._pendingUploadedKeys.size);
 
             const button = this._getButtonElement(file);
@@ -512,7 +512,7 @@ class VGFiles extends VGFilesBase {
             this._triggerEvent('upload.allComplete');
             this._updateStat(false);
 
-            if (!this._getFailingCount()) {
+            if (!this._getFailingCount()) {
                 if (this._params.sortable?.enabled && this._params.sortable.route) {
                     import('./sortable.js').then(module => {
                         if (this._sortable && typeof this._sortable.destroy === 'function') {
@@ -528,7 +528,7 @@ class VGFiles extends VGFilesBase {
 
             const payload = {
                 uploaded: this._uploadedKeys.size,
-                failed: this._getFailingCount(),
+                failed: this._getFailingCount(),
                 total: this._files.length
             };
 
@@ -696,13 +696,13 @@ class VGFiles extends VGFilesBase {
         };
 
         const fileToRemove = this._files.find(f => f.name === name && f.size === size);
-        if (fileToRemove) {
-            const key = this._getFileKey(fileToRemove);
-            this._uploadedKeys.delete(key);
-            this._pendingUploadedKeys.delete(key);
-            this._failingUploadedKeys.delete(key);
-            this._forgetFileValidation(fileToRemove);
-        }
+        if (fileToRemove) {
+            const key = this._getFileKey(fileToRemove);
+            this._uploadedKeys.delete(key);
+            this._pendingUploadedKeys.delete(key);
+            this._failingUploadedKeys.delete(key);
+            this._forgetFileValidation(fileToRemove);
+        }
 
         this._getItemElement().forEach(el => {
             const btn = Selectors.find('button', el);
@@ -795,7 +795,7 @@ class VGFiles extends VGFilesBase {
     _updateStatsAfterRemove() {
         this._setStatItem('completed', this._uploadedKeys.size);
         this._setStatItem('pending', this._pendingUploadedKeys.size);
-        this._setStatItem('failing', this._getFailingCount());
+        this._setStatItem('failing', this._getFailingCount());
         this._updateStat();
     }
 
@@ -901,35 +901,35 @@ class VGFiles extends VGFilesBase {
         if ($value) $value.innerHTML = count;
     }
 
-    _renderUIStatusDropInfoAjax(files) {
-        if (!this._params.ajax) return;
-
-        files.forEach(file => {
+    _renderUIStatusDropInfoAjax(files) {
+        if (!this._params.ajax) return;
+
+        files.forEach(file => {
             const $item = this._getItemElement(file);
             if (!$item) return;
 
-            const key = this._getFileKey(file);
-            if (!this._isFileValid(file)) {
-                Classes.remove($item, CLASS_NAME_PENDING);
-                Classes.add($item, CLASS_NAME_FAILING);
-            } else if (this._uploadedKeys.has(key)) {
+            const key = this._getFileKey(file);
+            if (!this._isFileValid(file)) {
+                Classes.remove($item, CLASS_NAME_PENDING);
+                Classes.add($item, CLASS_NAME_FAILING);
+            } else if (this._uploadedKeys.has(key)) {
                 Classes.replace($item, CLASS_NAME_PENDING, CLASS_NAME_COMPLETED);
                 Classes.add($item, CLASS_NAME_LOADED);
             } else if (this._failingUploadedKeys.has(key)) {
                 Classes.replace($item, CLASS_NAME_PENDING, CLASS_NAME_FAILING);
             } else {
-                Classes.add($item, CLASS_NAME_PENDING);
-            }
-        });
-
-        this._setStatItem('failing', this._getFailingCount());
-    }
-
-    _getFailingCount() {
-        const keys = new Set(this._failingUploadedKeys);
-        this._validationErrorsByKey.forEach((errors, key) => keys.add(key));
-        return keys.size;
-    }
+                Classes.add($item, CLASS_NAME_PENDING);
+            }
+        });
+
+        this._setStatItem('failing', this._getFailingCount());
+    }
+
+    _getFailingCount() {
+        const keys = new Set(this._failingUploadedKeys);
+        this._validationErrorsByKey.forEach((errors, key) => keys.add(key));
+        return keys.size;
+    }
 
     _triggerCallback(name, data) {
         const cb = this._params.callbacks?.[name];