fix

assets/bsToast/bsToast.css

@@ -28,6 +28,13 @@
     margin-bottom: 0.75rem;
 }
 
+.toast-title {
+    margin-right: auto;
+}
+.toast-desc {}
+.toast-icon {
+
+}
 .toast-header {
     display: flex;
     align-items: center;

assets/bsToastService/bsToastService.css

@@ -0,0 +1,8 @@
+
+.toast-container--default {
+    z-index: 10000;
+    position: fixed!important;
+    bottom: 0!important;
+    right: 0!important;
+    padding: 1rem !important;
+}

assets/bsToastService/bsToastService.js

@@ -0,0 +1,78 @@
+/** @module bsToastService */
+kit.PluginManager.register('bsToastService', function(module, exports, require, global){
+    var support = require('support');
+    var bsToast = require('bsToast');
+    var Collection = require('Collection');
+
+
+    function Service() {
+        this.close = true;
+        this.option = {
+            animation: true,
+            autohide: true,
+            delay: 4000,
+        };
+        this.closeTemplate = '<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Закрыть"/>';
+        this.iconTemplate = '<svg class="bd-placeholder-img rounded me-2" width="20" height="20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="xMidYMid slice" focusable="false"><rect width="100%" height="100%" fill="#007aff"/></svg>';
+        /**
+         * @type {HTMLElement}
+         */
+        this.container = null;
+        this.onShow = new Collection();
+    }
+
+
+    Service.prototype.setContainer = function (parentNode = document.body, opClass = 'default') {
+        parentNode = support.getNode(parentNode);
+        if(opClass) {
+            opClass = 'toast-container--'+opClass;
+        }
+
+        var opClassSelector = (opClass !== '')?('.'+opClass):'';
+        var container = parentNode.querySelector('.toast-container'+opClassSelector);
+        if(container) {
+            this.container = container;
+            return;
+        }
+
+        var toastContainerTemplate = '<div class="toast-container '+opClass+'"></div>';
+        this.container = support.makeNode(toastContainerTemplate);
+        if(support.isElement(parentNode)) {
+            parentNode.appendChild(this.container);
+        }
+    };
+
+
+    Service.prototype.getToastNode = function (title, message, desc = '') {
+        var closeTemplate = this.close?this.closeTemplate:'';
+        var toastTemplate = '<div class="toast fade hide" role="alert" aria-live="assertive" aria-atomic="true"><div class="toast-header"><div class="toast-icon">'+this.iconTemplate+'</div><strong class="toast-title">'+title+'</strong><small class="toast-desc">' + desc+ '</small>'+closeTemplate+'</div><div class="toast-body">'+message+'</div></div>';
+        return support.makeNode(toastTemplate);
+    };
+
+    Service.prototype.info = function (title, message, desc = '') {
+        var toastNode = this.getToastNode(title, message, desc);
+        var toast = new bsToast(toastNode, this.option);
+        toast.data = {
+            title: title,
+            message: message,
+            desc: desc,
+            date: new Date()
+        };
+        support.setKit(toastNode, 'toast', toast);
+        this.container.appendChild(toastNode);
+        toast.show();
+        this.onShow.eachCall(this, toast, toastNode);
+    };
+
+
+    /**
+     * @memberOf kit.service
+     * @class toast
+     **/
+    var toast = new Service();
+    toast.setContainer();
+
+    global.service.toast = toast;
+
+    module.exports = toast;
+});

assets/core/core.js

@@ -3,6 +3,7 @@
  * @extends kitCorePlugins
  */
 window.kit = window.kit || {};
+window.kit.service = window.kit.service || {};
 (function(global){
     var stateList = {
         undefined: 0,
@@ -463,6 +464,8 @@ window.kit = window.kit || {};
         return module.exports;
     };
 
+
+
     __proto.depsCorrection = function(deps){
         if(!Array.isArray(deps) ) {
             deps = [deps];

assets/core/core.register.js

@@ -54,6 +54,15 @@ __PluginManager__.registerPlugins({
         ],
         deps: ['bsCore'],
     },
+    bsToastService: {
+        path: __pmConfig__.assetsPath + '/bsToastService',
+        module: '/bsToastService.js',
+        type: 'loader',
+        css: [
+            '/bsToastService.css'
+        ],
+        deps: ['bsToast', 'support', 'Collection'],
+    },
     Tooltip: {
         path: __pmConfig__.assetsPath + '/tooltip',
         module: '/tooltip.js',

assets/core/doc.js

@@ -12,7 +12,6 @@
  * @property {kitPluginManagerRequire} require
  * @property {kitToolkit} toolkit
  * @property {kitModal} Modal
- * @property {kitCookie} cookie
  * @property {kitConfig} config
  * @property {kitTooltip} tooltip
  * @property {kitPopover} Popover

assets/support/support.js

@@ -89,7 +89,7 @@ __PluginManager__.register('support', function(module, exports, require, global)
      * @return Element
      */
     function getNode(selector) {
-        if(isString(selector)) {
+        if(isString(selector) && selector !== '') {
             return document.querySelector(selector);
         }
         if(isNode(selector) || isElement(selector)) {
@@ -115,7 +115,25 @@ __PluginManager__.register('support', function(module, exports, require, global)
     function isA(o,c){
         return null!=c&&"undefined"!=typeof Symbol&&c[Symbol.hasInstance]?!!c[Symbol.hasInstance](o):o instanceof c
     }
-
+    function makeNode(html = '') {
+        var nodeWrap = document.createElement('div');
+        nodeWrap.innerHTML = html;
+        var r = nodeWrap.firstElementChild;
+        r.remove();
+        return r;
+    }
+    function setKit(node, key, value) {
+        if(!isElement(node)) return false;
+        node.kit = node.kit || {};
+        node.kit[key] = value;
+    }
+    function getKit(node, key) {
+        if(!isElement(node)) return null;
+        if(node.hasOwnProperty('kit') && node.kit.hasOwnProperty(key)) {
+            return node.kit[key];
+        }
+        return null;
+    }
 
     /**
      * @memberOf kit
@@ -137,7 +155,10 @@ __PluginManager__.register('support', function(module, exports, require, global)
         isElement,
         getNode,
         extend,
-        isA
+        isA,
+        makeNode,
+        setKit,
+        getKit
     };
 
     return module.exports = support;

tests/bsToastsTest.php

@@ -16,44 +16,23 @@ $APPLICATION->ShowHead();
 
 ?>
 <script>
-    kit.ready(['bsToast', 'testing', 'date'], function () {
+    kit.ready(['bsToastService', 'testing', 'date', ], function () {
 
         var unit = new kit.testing.Unit();
         unit.logger.info('Тест bootstrap.Toast 5.1.3');
+        unit.logger.info('Тест service.toast');
+        unit.logger.notice(' ');
+
+        var audio = new Audio('https://issue.megapolis-it.ru/local/media/new_message_tone.mp3');
 
 
-
+        kit.service.toast.onShow.push(function (toast, node) {
-        function makeNode(html = '') {
+            unit.logger.info(toast.data.title, toast.data);
-            var nodeWrap = document.createElement('div');
+            audio.play();
-            nodeWrap.innerHTML = html;
+        });
-            return nodeWrap.firstElementChild;
-        }
-
-
-        var toastContainerTemplate = '<div class="toast-container position-fixed p-3 bottom-0 end-0" style="z-index: 10000;"></div>';
-
-
-        function getToastNode(title, message, time){
-            unit.logger.info(time + ' ' + title, message);
-            var toastTemplate = '<div class="toast fade hide" role="alert" aria-live="assertive" aria-atomic="true"><div class="toast-header"><svg class="bd-placeholder-img rounded me-2" width="20" height="20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="xMidYMid slice" focusable="false"><rect width="100%" height="100%" fill="#007aff"/></svg><strong class="me-auto">'+title+'</strong><small>' + time+ '</small><button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Закрыть"/></div><div class="toast-body">'+message+'</div></div>';
-            return makeNode(toastTemplate);
-        }
-        var toastContainer = makeNode(toastContainerTemplate);
-        document.body.appendChild(toastContainer);
-
-        var audio = new Audio('https://issue.megapolis-it.ru/local/media/new_message-4.mp3');
 
         var intervalId = setInterval(function(){
-
+            kit.service.toast.info('Новая заявка', 'Заявка от Пупкина на дальний склад. Очень срочно! Нужно еще вчера...', kit.date('H:i:s'));
-            var toastEl = getToastNode('Новая заявка', 'Заявка от Пупкина на дальний склад. Очень срочно! Нужно еще вчера...', kit.date('H:i:s'));
-            toastContainer.appendChild(toastEl);
-            var toast = new kit.bsToast(toastEl, option = {
-                animation: true,
-                autohide: true,
-                delay: 33000,
-            });
-            toast.show();
-            audio.play();
         }, 5000);
 
 
@@ -67,18 +46,6 @@ $APPLICATION->ShowHead();
     <div class="kit-logger"></div>
 </div>
     <style>
-        .position-fixed {
-            position: fixed!important;
-        }
-        .bottom-0 {
-            bottom: 0!important;
-        }
-        .end-0 {
-            right: 0!important;
-        }
-        .p-3 {
-            padding: 1rem !important;
-        }
         img, svg {
             vertical-align: middle;
         }
@@ -95,9 +62,6 @@ $APPLICATION->ShowHead();
             -moz-user-select: none;
             user-select: none;
         }
-        .me-auto {
-            margin-right: auto!important;
-        }
     </style>
 <?
 ?>