vgapp 0.5.4 → 0.5.6

package/CHANGELOG.md

@@ -1,3 +1,6 @@
+# VEGAS-APP 0.4.6 - 0.5.5 (Июнь, 21, 2025)
+* Исправлены ошибки в разных модулях
+
 # VEGAS-APP 0.4.3 - 0.4.6 (Июнь, 3, 2025)
 * Исправлены ошибки в разных модулях
 * Во все модули, где есть группа параметров ajax, добавлен параметр output (boolean), 

package/app/modules/module-fn.js

@@ -102,7 +102,6 @@ const Ajax = {
 
 		if (!isEmptyObj(data)) {
 			for (let key in data) {
-				console.log(key)
 				query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key]));
 			}
 		}

package/app/modules/vgloadmore/js/vgloadmore.js

@@ -1,11 +1,11 @@
 import BaseModule from "../../base-module";
 import EventHandler from "../../../utils/js/dom/event";
-import {execute, mergeDeepObject} from "../../../utils/js/functions";
+import {execute, isObject, mergeDeepObject, normalizeData} from "../../../utils/js/functions";
 import Selectors from "../../../utils/js/dom/selectors";
+import {Manipulator} from "../../../utils/js/dom/manipulator";
 
 const NAME             = 'loadmore';
 const NAME_KEY         = 'vg.loadmore';
-const CLASS_NAME_SHOW  = 'show';
 
 const SELECTOR_DATA_TOGGLE = '[data-vg-toggle="loadmore"]';
 
@@ -15,6 +15,9 @@ const EVENT_KEY_SHOW   = `${NAME_KEY}.show`;
 const EVENT_KEY_SHOWN  = `${NAME_KEY}.shown`;
 const EVENT_KEY_LOADED = `${NAME_KEY}.loaded`;
 
+const CLASS_NAME_HIDE = 'vg-collapse';
+const CLASS_NAME_SHOW = 'show';
+
 const EVENT_KEY_CLICK_DATA_API      = `click.${NAME_KEY}.data.api`;
 
 class VGLoadMore extends BaseModule{
@@ -28,7 +31,8 @@ class VGLoadMore extends BaseModule{
 			autohide: true,
 			button: {
 				text: '',
-				send: 'Загружаем...'
+				send: 'Загружаем...',
+				classes: []
 			},
 			ajax: {
 				route: '',
@@ -55,7 +59,71 @@ class VGLoadMore extends BaseModule{
 		return NAME_KEY;
 	}
 
+	static init(el, callback) {
+		let id           = el.id,
+			items        = normalizeData(el.dataset.elements),
+			limit        = normalizeData(el.dataset.limit),
+			offset       = normalizeData(el.dataset.offset),
+			output       = el.dataset.output || 'true',
+			autohide     = el.dataset.autohide || 'true',
+			params       = el.dataset.params,
+			buttonParams = normalizeData(el.dataset.button);
+
+		if (!isObject(buttonParams)) {
+			console.log('Дата атрибут data-button должен быть в формате json и передавать объект');
+			return;
+		}
+
+		if (limit < offset) {
+			console.log('Параметр offset должен быть меньше или равен параметру limit');
+			return;
+		}
+
+		if (!id && !items && !limit && !offset) return;
+
+		let itemsElements = [... Selectors.findAll('.' + items, el)];
+
+		if (itemsElements.length <= limit) return;
+
+		itemsElements.forEach((item, i) => {
+			item.classList.add(CLASS_NAME_HIDE)
+			if ((i + 1) <= limit) item.classList.add(CLASS_NAME_SHOW)
+		});
+
+		let button = document.createElement('button');
+
+		buttonParams.text = normalizeData(el.dataset.buttonText) || 'Показать еще';
+
+		Manipulator.set(button, 'data-limit', limit);
+		Manipulator.set(button, 'data-offset', offset);
+		Manipulator.set(button, 'data-output', output);
+		Manipulator.set(button, 'data-autohide', autohide);
+		Manipulator.set(button, 'data-elements', items);
+		Manipulator.set(button, 'data-vg-toggle', 'loadmore');
+		Manipulator.set(button, 'data-target', '#' + id);
+
+		if (params) Manipulator.set(button, 'data-autohide', params);
+
+		button.innerHTML = buttonParams.text
+
+		if ('classes' in buttonParams && buttonParams.classes.length) {
+			buttonParams.classes.forEach(cl => button.classList.add(cl));
+		}
+
+		el.parentNode.insertBefore(button, el.nextSibling);
+
+		execute(callback, [el, button]);
+	}
+
 	toggle(callback) {
+		if (this._params.ajax.route) {
+			this.ajax(callback);
+		} else {
+			this.static(callback);
+		}
+	}
+
+	ajax(callback) {
 		this._params.ajax.data = {
 			limit: this._params.limit,
 			offset: this._params.offset
@@ -75,7 +143,7 @@ class VGLoadMore extends BaseModule{
 				target.insertAdjacentHTML('beforeend', data.response);
 			}
 
-			this._params.offset = this.fOffset + this._params.offset;
+			this._params.offset = this.counter();
 			this._element.innerHTML = this._params.button.text;
 
 			if ('autohide' in this._params && this._params.autohide) {
@@ -86,8 +154,44 @@ class VGLoadMore extends BaseModule{
 			execute(callback, [this, data, target, status]);
 		});
 	}
+
+	static(callback) {
+		if (!'elements' in this._params && !'target' in this._params) return;
+
+		let container = Selectors.find(this._params.target),
+			items = Selectors.findAll('.' + this._params.elements, container);
+
+		if (items) {
+			items.slice(this._params.offset, this._params.offset + this._params.limit).forEach(item => item.classList.add(CLASS_NAME_SHOW));
+			this._params.offset = this.counter();
+		}
+
+		let itemsHidden = Selectors.findAll('.' + this._params.elements + ':not(.show)', container);
+
+		if (this.remainder(itemsHidden.length)) {
+			if ('autohide' in this._params && this._params.autohide) {
+				this._element.remove();
+			}
+		}
+
+		execute(callback, [this, this._element]);
+	}
+
+	counter() {
+		return this.fOffset + this._params.offset;
+	}
+
+	remainder(count) {
+		return count === 0
+	}
 }
 
+EventHandler.on(document, 'DOMContentLoaded', function () {
+	[... document.querySelectorAll('[data-vgloadmore]')].forEach(el => {
+		VGLoadMore.init(el);
+	})
+});
+
 /**
  * Data API implementation
  */

package/app/modules/vgmodal/js/vgmodal.js

@@ -272,7 +272,7 @@ class VGModal extends BaseModule {
 	}
 
 	_addEventListeners() {
-		EventHandler.on(this._element, EVENT_KEY_KEYDOWN_DISMISS, event => {
+		EventHandler.on(document, EVENT_KEY_KEYDOWN_DISMISS, event => {
 			if (event.key !== ESCAPE_KEY) return;
 
 			if (this._params.keyboard) {

package/app/modules/vgrollup/js/vgrollup.js

@@ -23,7 +23,6 @@ class VGRollup  extends BaseModule {
 
 		this._params = this._getParams(element, mergeDeepObject({
 			content: 'text',
-			offset: 0,
 			cnt: 0,
 			fade: true,
 			transition: false,
@@ -49,15 +48,8 @@ class VGRollup  extends BaseModule {
 			transition: "vg-rollup-content--transition"
 		};
 
-		this.total    = 0;
-		this.count    = 0;
-		this.offset   = 0;
-		this.isOffset = false;
-
-		if (this._params.offset > 0) {
-			this.offset = this._params.offset || 0;
-			this.isOffset = true;
-		}
+		this.total       = 0;
+		this.count       = 0;
 
 		this.build();
 	}
@@ -77,12 +69,15 @@ class VGRollup  extends BaseModule {
 		if (!isShown) {
 			instance._element.classList.add(CLASS_NAME_SHOW);
 			relatedTarget.innerHTML = instance._params.button.less;
+			relatedTarget.setAttribute("aria-expanded", true);
 
 			if (instance.offset > 0) {
 				if (instance.isOffset) {
 					relatedTarget.innerHTML = instance._params.button.more;
+					relatedTarget.setAttribute("aria-expanded", true);
 				} else {
 					relatedTarget.innerHTML = instance._params.button.less;
+					relatedTarget.setAttribute("aria-expanded", false);
 				}
 			}
 
@@ -101,7 +96,12 @@ class VGRollup  extends BaseModule {
 				}
 			}
 
-			relatedTarget.setAttribute("aria-expanded", false);
+			if (instance.isOffset) {
+				relatedTarget.setAttribute("aria-expanded", true);
+			} else {
+				relatedTarget.setAttribute("aria-expanded", false);
+			}
+
 			instance._element.classList.remove(CLASS_NAME_SHOW);
 			relatedTarget.innerHTML = instance._params.button.more + textShowNum;
 			instance.switch(instance._element, true);
@@ -208,14 +208,12 @@ class VGRollup  extends BaseModule {
 	}
 
 	switch(el, switcher = false) {
-		const _this = this;
-
-		if (switcher && !_this.isOffset) {
+		if (switcher && !this.isOffset) {
 			this.build(el, false);
 
 			if (this._params.offset > 0) {
-				_this.offset = this._params.offset;
-				if (_this.offset > 0) this.isOffset = true;
+				this.offset = this._params.offset;
+				if (this.offset > 0) this.isOffset = true;
 			}
 		} else {
 			el.classList.remove(this.classes.hidden);
@@ -224,23 +222,13 @@ class VGRollup  extends BaseModule {
 
 			el.removeAttribute("style");
 
-			if (_this._params.content === 'elements') {
-				let className = _this._params.elements;
+			if (this._params.content === 'elements') {
+				let className = this._params.elements;
 
 				let items = Selectors.findAll('.' + className, el);
 
 				if (items.length) {
-					if (_this.offset > 0) {
-						items.slice(_this.offset, _this.offset + _this.count).forEach(item => item.classList.remove(CLASS_NAME_HIDE));
-						_this.offset = _this.offset + _this._params.offset;
-
-						if (_this.offset >= (items.length - _this.count)) {
-							_this.isOffset = false;
-							_this.offset = 0;
-						}
-					} else {
-						items.forEach((item) => item.classList.remove(CLASS_NAME_HIDE))
-					}
+					items.forEach((item) => item.classList.remove(CLASS_NAME_HIDE))
 				}
 			}
 		}
@@ -277,7 +265,6 @@ EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, functi
 		return
 	}
 
-	this.setAttribute('aria-expanded', true);
 	VGRollup.toggle(target, this);
 });