vgapp 0.4.5 → 0.4.7

package/CHANGELOG.md

@@ -1,6 +1,21 @@
+# VEGAS-APP 0.4.3 - 0.4.6 (Июнь, 3, 2025)
+* Исправлены ошибки в разных модулях
+* Во все модули, где есть группа параметров ajax, добавлен параметр output (boolean), 
+разрешает или запрещает добавление контента с сервера в целевой блок
+* Во все модули, где есть группа параметров ajax, добавлен параметр once (boolean), 
+разовый запрос на сервер
+
+## Модуль VGRollup
+* Исправлено, последовательное открытие свернутого контента
+
+## Новый модуль VGLoadMore
+
+---
+
 # VEGAS-APP 0.4.3 (Май, 31, 2025)
 * Исправлены ошибки в разных модулях
 ## Новый модуль VGTabs
+
 ---
 
 # VEGAS-APP 0.4.0 (Май, 287, 2025)
@@ -8,32 +23,38 @@
 ## Модуль VGFORMSENDER
 * Добавлен параметр interceptors (перехватчики) для состояний error и/или success, после чего вызывается соответствующий колбек afterError и/или afterSuccess
 * Добавлен параметр delay в группу alert автоматическое закрытие, отсчет в миллисекундах
+
 ---
 
 # VEGAS-APP 0.3.4 (Май, 20, 2025)
 ## Новый модуль VGSpy
+
 ---
 
 # VEGAS-APP 0.3.0 (Май, 09, 2025)
 * Исправлены ошибки 
 ## Модуль VGFORMSENDER
 * Добавлен параметр pass, будет добавлен глаз к полю с паролем
+
 ---
 
 # VEGAS-APP 0.2.5 (Апрель, 12, 2025)
 * Исправлены ошибки в разных модулях
 ## Новый модуль VGRollup
+
 ---
 
 # VEGAS-APP 0.2.4 (Апрель, 8, 2025)
 ## Модуль VGSidebar & VGModal
 * Добавлен параметр hash
 ## Новый модуль VGToast
+
 ---
 
 # VEGAS-APP 0.2.3 (Апрель, 4, 2025)
 ## Модуль VGDROPDOWN
 * Добавлен параметр overflow и backdrop
+
 ---
 
 # VEGAS-APP 0.2.1 (Март, 31, 2025)

package/README.md

@@ -1,2 +1,16 @@
 # VEGAS APP 
-[FUNC.TRUE?!](http://func-true.ru)
+[FUNC.TRUE?!](http://func-true.ru)
+
+[![npm](https://img.shields.io/npm/v/vgapp.svg?style=flat-square&maxAge=600)](https://www.npmjs.com/package/vgapp) [![npm](https://img.shields.io/npm/l/vgapp.svg?style=flat-square)]()
+
+## Install
+```
+npm i vgapp
+```
+
+## Authors
+
+[VEGAS STUDIO](https://vegas-dev.com)  Russia
+
+## License
+Is published under the [MIT license](http://www.opensource.org/licenses/mit-license)

package/app/modules/base-module.js

@@ -60,7 +60,9 @@ class BaseModule {
 		}
 
 		if ('loader' in _this._params.ajax && _this._params.ajax.loader) {
-			setData('<div class="vg-loader"></div>');
+			if ('output' in _this._params.ajax && _this._params.ajax.output) {
+				setData('<div class="vg-loader"></div>');
+			}
 		}
 
 		Ajax[_this._params.ajax.method](_this._params.ajax.route, _this._params.ajax.data || {}, function (status, data) {
@@ -68,8 +70,11 @@ class BaseModule {
 				_this._isLoaded = true;
 			}
 
-			setData(data.response);
-			execute(callback, [status, data]);
+			if ('output' in _this._params.ajax && _this._params.ajax.output) {
+				setData(data.response);
+			}
+
+			execute(callback, [status, data, $content]);
 		});
 	}
 

package/app/modules/module-fn.js

@@ -101,11 +101,19 @@ const Ajax = {
 		let query = [];
 
 		if (!isEmptyObj(data)) {
-			for (let key of data) {
-				query.push(encodeURIComponent(key[0]) + '=' + encodeURIComponent(key[1]));
+			for (let key in data) {
+				console.log(key)
+				query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key]));
 			}
 		}
-		Ajax.send(url + (query.length ? '?' + query.join('&') : ''), callback, 'GET', null, async)
+
+		let uri = '';
+		if (query.length) {
+			uri += url.includes('?') ? '&' : '?';
+			uri += query.join('&');
+		}
+
+		Ajax.send(url + uri, callback, 'GET', null, async)
 	},
 
 	post: function (url, data, callback, async) {

package/app/modules/vgcollapse/js/vgcollapse.js

@@ -38,6 +38,7 @@ class VGCollapse extends BaseModule {
 				method: 'get',
 				loader: false,
 				once: false,
+				output: true,
 			}
 		}, params));
 

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

@@ -43,6 +43,7 @@ class VGDropdown extends BaseModule {
 				method: 'get',
 				loader: false,
 				once: false,
+				output: true,
 			},
 			animation: {
 				enable: false,

package/app/modules/vglawcookie/js/vglawcookie.js

@@ -45,7 +45,10 @@ class VGLawCookie extends BaseModule {
 			ajax: {
 				route: '',
 				target: '',
-				method: 'get'
+				method: 'get',
+				loader: false,
+				once: false,
+				output: true,
 			}
 		}, params));
 

package/app/modules/vgloadmore/index.js

@@ -0,0 +1,3 @@
+import VGLoadMore from "./js/vgloadmore";
+
+export default VGLoadMore

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

@@ -0,0 +1,104 @@
+import BaseModule from "../../base-module";
+import EventHandler from "../../../utils/js/dom/event";
+import {execute, mergeDeepObject} from "../../../utils/js/functions";
+import Selectors from "../../../utils/js/dom/selectors";
+
+const NAME             = 'loadmore';
+const NAME_KEY         = 'vg.loadmore';
+const CLASS_NAME_SHOW  = 'show';
+
+const SELECTOR_DATA_TOGGLE = '[data-vg-toggle="loadmore"]';
+
+const EVENT_KEY_HIDE   = `${NAME_KEY}.hide`;
+const EVENT_KEY_HIDDEN = `${NAME_KEY}.hidden`;
+const EVENT_KEY_SHOW   = `${NAME_KEY}.show`;
+const EVENT_KEY_SHOWN  = `${NAME_KEY}.shown`;
+const EVENT_KEY_LOADED = `${NAME_KEY}.loaded`;
+
+const EVENT_KEY_CLICK_DATA_API      = `click.${NAME_KEY}.data.api`;
+
+class VGLoadMore extends BaseModule{
+	constructor(element, params) {
+		super(element, params);
+
+		this._params = this._getParams(element, mergeDeepObject({
+			limit: 0,
+			offset: 0,
+			output: true,
+			autohide: true,
+			button: {
+				text: '',
+				send: 'Загружаем...'
+			},
+			ajax: {
+				route: '',
+				target: '',
+				method: 'get',
+				loader: false,
+				once: false,
+				output: false,
+			},
+		}, params));
+
+		this.fOffset = this._params.offset;
+
+		if (!this._params.button.text) {
+			this._params.button.text = this._element.innerHTML;
+		}
+	}
+
+	static get NAME() {
+		return NAME;
+	}
+
+	static get NAME_KEY() {
+		return NAME_KEY;
+	}
+
+	toggle(callback) {
+		this._params.ajax.data = {
+			limit: this._params.limit,
+			offset: this._params.offset
+		}
+
+		if (this._params.button.send) {
+			this._element.innerHTML = this._params.button.send;
+		}
+
+		this._route((status, data, target) => {
+			if ('loader' in this._params.ajax && this._params.ajax.loader) {
+				let loader = Selectors.find('.vg-loader', target);
+				if (loader) loader.remove();
+			}
+
+			if ('output' in this._params && this._params.output) {
+				target.insertAdjacentHTML('beforeend', data.response);
+			}
+
+			this._params.offset = this.fOffset + this._params.offset;
+			this._element.innerHTML = this._params.button.text;
+
+			if ('autohide' in this._params && this._params.autohide) {
+				if (!data.response) this._element.remove();
+			}
+
+			EventHandler.trigger(this._element, EVENT_KEY_LOADED, {stats: status, data: data});
+			execute(callback, [this, data, target, status]);
+		});
+	}
+}
+
+/**
+ * Data API implementation
+ */
+EventHandler.on(document, EVENT_KEY_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
+	const target = this;
+
+	if (['A', 'AREA'].includes(this.tagName)) event.preventDefault();
+
+	const instance = VGLoadMore.getOrCreateInstance(target);
+	instance.toggle();
+});
+
+
+export default VGLoadMore;

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

@@ -56,7 +56,8 @@ class VGModal extends BaseModule {
 				target: '',
 				method: 'get',
 				loader: false,
-				once: false
+				once: false,
+				output: true,
 			},
 			animation: {
 				enable: false,

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

@@ -77,7 +77,10 @@ class VGNav extends BaseModule {
 			ajax: {
 				route: '',
 				target: '',
-				method: 'get'
+				method: 'get',
+				loader: false,
+				once: false,
+				output: true,
 			}
 		}, params));
 

package/app/modules/vgsidebar/js/vgsidebar.js

@@ -49,6 +49,7 @@ class VGSidebar extends BaseModule {
 				method: 'get',
 				loader: false,
 				once: false,
+				output: true,
 			}
 		}, params));
 

package/app/modules/vgtabs/js/vgtabs.js

@@ -62,7 +62,8 @@ class VGTabs extends BaseModule {
 				target: '',
 				method: 'get',
 				loader: false,
-				once: true
+				once: true,
+				output: true,
 			},
 		}, this._params);
 

package/app/modules/vgtoast/js/vgtoast.js

@@ -53,6 +53,7 @@ class VGToast extends BaseModule {
 				method: 'get',
 				loader: false,
 				once: false,
+				output: true,
 			}
 		}, params));
 

package/app/utils/js/components/templater.js

@@ -3,6 +3,7 @@ import {execute, mergeDeepObject} from "../functions";
 const TEMPLATES = [
 	{type: 'pass-open', template: '<span data-vg-toggle="vgpass" class="[[classes]]" title="Показать / Скрыть" data-bs-toggle="tooltip"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80zm0-208a128 128 0 1 1 0 256 128 128 0 1 1 0-256z"/></svg></span>'},
 	{type: 'pass-close', template: '<span data-vg-toggle="vgpass" class="[[classes]]" title="Показать / Скрыть" data-bs-toggle="tooltip"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L525.6 386.7c39.6-40.6 66.4-86.1 79.9-118.4c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 68.8 400.8 32 320 32c-68.2 0-125 26.3-169.3 60.8L38.8 5.1zm151 118.3C226 97.7 269.5 80 320 80c65.2 0 118.8 29.6 159.9 67.7C518.4 183.5 545 226 558.6 256c-12.6 28-36.6 66.8-70.9 100.9l-53.8-42.2c9.1-17.6 14.2-37.5 14.2-58.7c0-70.7-57.3-128-128-128c-32.2 0-61.7 11.9-84.2 31.5l-46.1-36.1zM394.9 284.2l-81.5-63.9c4.2-8.5 6.6-18.2 6.6-28.3c0-5.5-.7-10.9-2-16c.7 0 1.3 0 2 0c44.2 0 80 35.8 80 80c0 9.9-1.8 19.4-5.1 28.2zm9.4 130.3C378.8 425.4 350.7 432 320 432c-65.2 0-118.8-29.6-159.9-67.7C121.6 328.5 95 286 81.4 256c8.3-18.4 21.5-41.5 39.4-64.8L83.1 161.5C60.3 191.2 44 220.8 34.5 243.7c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 443.2 239.2 480 320 480c47.8 0 89.9-12.9 126.2-32.5l-41.9-33zM192 256c0 70.7 57.3 128 128 128c13.3 0 26.1-2 38.2-5.8L302 334c-23.5-5.4-43.1-21.2-53.7-42.3l-56.1-44.2c-.2 2.8-.3 5.6-.3 8.5z"/></svg></span>'},
+	{type: 'loader', template: '<div class="vg-loader"></div>'}
 ]