ru.coon 2.8.65 → 3.0.2

package/src/uielement/component/settings/UiCustomPanelEditorController.js

@@ -25,7 +25,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         refreshModelView: '{previewTabs.activeTab}',
     },
 
-    receiveMessage: function(event) {
+    receiveMessage(event) {
         if (event.data == 'give me elements') {
             if (!this.getView()) {
                 return;
@@ -42,7 +42,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    init: function(view) {
+    init(view) {
         view.doInit = this.doInit.bind(this);
         this.lookup('pluginPanel').fireEvent('load', []);
         window.addEventListener('message', this.receiveMessage.bind(this), false);
@@ -55,17 +55,19 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         });
         const referencesStore = Ext.data.StoreManager.lookup('formReferences');
         referencesStore && referencesStore.removeAll();
-        this.getView().down('UiCustomPanelPluginPanel').on('ExecuteFunctionPluginChange', this.onChangeExecuteFunctionPlugin, this);
+        grid.on('select', this.setUnusedHandlers, this);
     },
-    onChangeExecuteFunctionPlugin: function() {
+
+    setUnusedHandlers() {
         const uiEditor = this.lookup('UiAceEditorPanel').lookup('uiEditor');
-        uiEditor.setHandlerList(this.lookup('pluginPanel').down('UiCustomPanelPluginGrid').getStore().getRange());
+        uiEditor.setHandlerList(this.lookup('pluginPanel').down('UiCustomPanelPluginGrid').getStore().getDataSource().getRange());
         const unused = uiEditor.getHandlerList()
             .map((plugin) => plugin.handlerName)
             .filter(uiEditor.isHandlerUnused, this);
         this.getViewModel().set('unusedHandlers', unused);
     },
-    onPluginStoreChanged: function(store) {
+
+    onPluginStoreChanged(store) {
         const handlerStoreData = store.getRange().map((record) => {
             if (record.get('handlerName') !== '-/-') {
                 return {
@@ -161,6 +163,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
                     plugins.push(Object.assign({
                         jsonProperties: plugin,
                         isSingle: pluginsMap.get(plugin.ptype).isSingle,
+                        isHandlerRequired: pluginsMap.get(plugin.ptype).getInitialConfig().hasOwnProperty('handlerName'),
                     }, plugin));
                 } else {
                     aceEditorPlugins.push(plugin);
@@ -177,7 +180,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         this.getViewModel().set('aceEditorData', beatifiedValue);
     },
 
-    loadUiElement: function(uiElementCd) {
+    loadUiElement(uiElementCd) {
         if (uiElementCd) {
             const uiElementCommand = Ext.create('command.GetUIElementCommand');
             uiElementCommand.on('complete', this.loadUiElementBean, this);
@@ -185,7 +188,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    checkVerifiedPluginClasses: function() {
+    checkVerifiedPluginClasses() {
         return Object.keys(Ext.ClassManager.classes).reduce((acc, key) => {
             const prototype = Ext.ClassManager.classes[key].prototype;
             if (prototype) {
@@ -199,7 +202,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }, new Map());
     },
 
-    doInit: function(uiElementCd) {
+    doInit(uiElementCd) {
         if (uiElementCd) {
             this.loadUiElement(uiElementCd);
         } else {
@@ -207,7 +210,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    saveHandler: function() {
+    saveHandler() {
         this.beatify();
         this.checkValidity()
             .then(() => {
@@ -228,7 +231,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
             });
     },
 
-    checkValidity: function() {
+    checkValidity() {
         const vm = this.getViewModel();
         const errors = [];
 
@@ -259,7 +262,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    isUsedUiElement: function() {
+    isUsedUiElement() {
         return Coon.util.promisifyCmd('command.GetUIElementCommand', this.lookup('uielementId').value, true)
             .then((uiElement) => {
                 if (uiElement) {
@@ -269,7 +272,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
             });
     },
 
-    createAnnotationWindow: function(messages) {
+    createAnnotationWindow(messages) {
         const aceEditor = this.getView().down('UiAceEditor');
         const annotationWindow = Ext.create({
             xtype: 'UiCustomPanelAnnotationWindow',
@@ -311,15 +314,15 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }, this);
     },
 
-    closeHandler: function() {
+    closeHandler() {
         this.close();
     },
 
-    close: function() {
+    close() {
         this.getView().fireEvent('close');
     },
 
-    inputParameters: function() {
+    inputParameters() {
         return [
             {name: 'uiElementCd', description: 'uiElementCd', required: true}
         ];
@@ -329,7 +332,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
      * @param {Ext.button.Button} component
      * @param {Event} e
      */
-    beatify: function(component, e) {
+    beatify(component, e) {
         this.lookup('UiAceEditorPanel').down('UiAceEditor').flush();
         const vm = this.getViewModel();
         const value = vm.get('aceEditorData');
@@ -365,7 +368,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         UiAceEditor.on('linterReady', UiAceEditor.doLint, UiAceEditor);
     },
 
-    updateHandlersStore: function(pluginsArr) {
+    updateHandlersStore(pluginsArr) {
         const handlerStoreData = [];
         pluginsArr.forEach((el) => {
             const {handlerName, ptype} = el;
@@ -376,7 +379,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         this.getViewModel().getStore('handlersStore').setData(handlerStoreData);
     },
 
-    showPanel: function() {
+    showPanel() {
         this.beatify();
         const vm = this.getViewModel();
         const settings = vm.get('uiElement');
@@ -398,7 +401,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    autoloadChange: function(cb, newValue) {
+    autoloadChange(cb, newValue) {
         const vm = this.getViewModel();
         const isFrame = !vm.get('formEditorIsPage');
         const target = isFrame ? this.lookup('frame').getFrame().contentWindow : this.newPageRef;
@@ -407,7 +410,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    reloadFrame: function() {
+    reloadFrame() {
         this.beatify();
         const vm = this.getViewModel();
         if (!vm.get('formEditorIsPage')) {
@@ -417,7 +420,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    changeEditorLocation: function() {
+    changeEditorLocation() {
         const vm = this.getViewModel();
         if (!vm.get('formEditorIsPage')) {
             this.openNewPage();
@@ -426,7 +429,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         }
     },
 
-    openNewPage: function() {
+    openNewPage() {
         const vm = this.getViewModel();
         if (this.newPageRef) {
             this.newPageRef.close();
@@ -440,7 +443,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         vm.set('formEditorIsPage', true);
     },
 
-    destroy: function(...args) {
+    destroy(...args) {
         const me = this;
         if (me.newPageRef) {
             me.newPageRef.close();
@@ -448,7 +451,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         me.callParent(...args);
     },
 
-    openFrameView: function() {
+    openFrameView() {
         const vm = this.getViewModel();
         if (this.newPageRef) {
             this.newPageRef.close();
@@ -464,7 +467,7 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
         vm.set('formEditorIsPage', false);
     },
 
-    needConfirmBeforeClose: function(view) {
+    needConfirmBeforeClose(view) {
         this.beatify();
         Ext.MessageBox.show({
             title: 'Закрыть',
@@ -484,11 +487,13 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
             },
         });
     },
-    copyHash: function() {
+
+    copyHash() {
         const hash = this.getViewModel().get('uiElementHash');
         Coon.util.copyToClipboard(hash);
     },
-    checkEqualuty: function() {
+
+    checkEqualuty() {
         const field = this.lookup('insertHash');
         const hash = field.getValue();
         field.setValue(hash.replace(/[^A-Za-z0-9]/g, '').trim());
@@ -509,7 +514,8 @@ Ext.define('Coon.uielement.component.settings.UiCustomPanelEditorController', {
             );
         }
     },
-    clearTrigger: function(field) {
+
+    clearTrigger(field) {
         field.clear();
         this.lookup('iconComponent').setHtml('');
     },

package/src/uielement/component/settings/plugin/UiCustomPanelPluginGrid.js

@@ -29,14 +29,21 @@ Ext.define('Coon.uielement.component.settings.plugin.UiCustomPanelPluginGrid', {
     },
 
     viewConfig: {
-        getRowClass: function(rec) {
+        getRowClass: function(rec, i, rp, store) {
+            const rowClasses = [];
+
             if (rec.get('isDeleted')) {
-                return 'deletedRecord';
+                rowClasses.push('deletedRecord');
             }
             if (rec.get('isNew')) {
-                return 'newRecord';
+                rowClasses.push('newRecord');
+            }
+
+            if (rec.get('hasInvalidName')) {
+                rowClasses.push('invalidName');
             }
-            return '';
+
+            return rowClasses.join(' ');
         },
     },
     setData: function(data) {
@@ -71,40 +78,107 @@ Ext.define('Coon.uielement.component.settings.plugin.UiCustomPanelPluginGrid', {
     dockedItems: [{
         xtype: 'toolbar',
         dock: 'top',
+        layout: {
+            type: 'vbox',
+            align: 'stretch',
+        },
         items: [
             {
-                xtype: 'ForeignButton',
-                text: 'Добавить',
-                ui: 'blue-text-button-border',
-                createSelectWindow: function() {
-                    return Ext.create('Coon.uielement.component.settings.plugin.UiCustomPanelPluginSelectWindow', {
-                        onlyVerifiedPlugins: true,
-                        exclude: {
-                            handler: 'excludePtypes',
-                            scope: this,
-                        },
-                    });
-                },
-                listeners: {
-                    select: 'addHandler',
+                xtype: 'container',
+                flex: 1,
+                margin: '0 0 5 0',
+                layout: {
+                    type: 'hbox',
+                    align: 'end',
                 },
+                items: [
+                    {
+                        xtype: 'ForeignButton',
+                        flex: 1,
+                        text: 'Добавить',
+                        ui: 'blue-text-button-border',
+                        margin: '0 10 0 0',
+                        createSelectWindow: function() {
+                            return Ext.create('Coon.uielement.component.settings.plugin.UiCustomPanelPluginSelectWindow', {
+                                onlyVerifiedPlugins: true,
+                                exclude: {
+                                    handler: 'excludePtypes',
+                                    scope: this,
+                                },
+                            });
+                        },
+                        listeners: {
+                            select: 'addHandler',
+                        },
+                        bind: {
+                            disabled: '{favoriteButtonPressed}',
+                        },
+                    },
+                    {
+                        xtype: 'textfield',
+                        itemId: 'searchInPlugins',
+                        emptyText: 'фильтр по тексту в плагинах',
+                        flex: 2,
+                        triggers: {
+                            clear: {
+                                cls: 'svg-icon svg-icon-cancel-small',
+                                tooltip: 'Очистить поле',
+                                handler: function() {
+                                    this.clear();
+                                },
+                            },
+                        },
+                    }
+                ],
             },
             {
-                xtype: 'textfield',
-                emptyText: 'фильтр по тексту в плагинах',
+                xtype: 'container',
                 flex: 1,
-                listeners: {
-                    change: 'searchInPlugins',
+                layout: {
+                    type: 'hbox',
                 },
-                triggers: {
-                    clear: {
-                        cls: 'svg-icon svg-icon-cancel-small',
-                        tooltip: 'Очистить поле',
-                        handler: function() {
-                            this.clear();
+                items: [
+                    {
+                        xtype: 'segmentedbutton',
+                        allowToggle: false,
+                        margin: '0 3 0 0',
+                        bind: {
+                            disabled: '{favoriteButtonPressed}',
                         },
+                        items: [
+                            {
+                                xtype: 'button',
+                                itemId: 'historyButton',
+                                iconCls: 'svg-fa svg-fa-arrow-rotate-left',
+                                tooltip: 'Показать историю',
+                                arrowVisible: false,
+                                disabled: true,
+                                allowToggle: false,
+                                padding: '5 8',
+                            },
+                            {
+                                xtype: 'button',
+                                text: 'X',
+                                itemId: 'clearHistoryButton',
+                                tooltip: 'Очистить историю',
+                                disabled: true,
+                            }
+                        ],
                     },
-                },
+                    {
+                        xtype: 'splitbutton',
+                        ui: 'blue-text-button-border',
+                        itemId: 'favoriteButton',
+                        iconCls: 'svg-fa svg-fa-star',
+                        tooltip: 'Показать избранное',
+                        enableToggle: true,
+                        disabled: true,
+                        padding: '5 8',
+                        bind: {
+                            pressed: '{favoriteButtonPressed}',
+                        },
+                    }
+                ],
             }
         ],
     }],
@@ -151,18 +225,57 @@ Ext.define('Coon.uielement.component.settings.plugin.UiCustomPanelPluginGrid', {
                     type: 'string',
                 },
                 renderer: function(value, metaData, record) {
-                    const unused = record.get('unusedHandler');
-                    if (unused) {
+                    const tooltips = [];
+
+                    if (record.get('unusedHandler')) {
                         metaData.tdStyle = 'color: red';
-                        return Coon.format.withHint(value, 'Обработчик нигде не используется');
+                        tooltips.push('Обработчик нигде не используется');
+                    }
+                    if (record.get('hasInvalidName')) {
+                        tooltips.push('Имя обработчика отсутствует или дублируется');
+                    }
+
+                    if (tooltips.length) {
+                        return Coon.format.withHint(value, `${tooltips.join('<br/>')}`);
+                    } else {
+                        return value;
                     }
-                    return value;
                 },
                 sorter: function(v1, v2) {
                     v1 = v1.get('handlerName');
                     v2 = v2.get('handlerName');
                     return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
                 },
+            },
+            {
+                xtype: 'actioncolumn',
+                itemId: 'favoritesColumn',
+                width: 30,
+                menuDisabled: true,
+                sortable: false,
+                getClass: function(v, meta, record) {
+                    const favorites = this.lookupController().favoritePlugins.items || {};
+                    if (record.get('hasInvalidName')) {
+                        return 'pointerNone';
+                    }
+                    if (favorites.hasOwnProperty(record.getId()) && favorites[record.getId()]) {
+                        return 'svg-icon svg-icon-star';
+                    } else {
+                        return 'svg-icon svg-icon-bg-gray svg-icon-star';
+                    }
+                },
+                getTip: function(v, meta, record) {
+                    const favorites = this.lookupController().favoritePlugins.items || {};
+                    if (record.get('hasInvalidName')) {
+                        return 'Имя обработчика невалидно';
+                    }
+                    if (favorites.hasOwnProperty(record.getId()) && favorites[record.getId()]) {
+                        return 'Удалить из избранного';
+                    } else {
+                        return 'Добавить в избранное';
+                    }
+                },
+                handler: 'toggleFavoriteState',
             }
         ],
     },

package/src/uielement/component/settings/plugin/UiCustomPanelPluginGrid.scss

@@ -8,4 +8,32 @@
     .newRecord {
         font-style:italic;
     }
+    .invalidName {
+        background-color: rgba(139, 0, 0, 0.1);
+    }
+    .x-ripple-container {
+        display: none;
+    }
+    .svg-icon-bg-gray {
+        opacity: 0.2;
+    }
+    .x-btn-wrap-blue-text-button-border-small.x-btn-split-right:after {
+        padding-left: 8px;
+    }
+    .x-segmented-button .x-segmented-button-item {
+        padding-left: 3px;
+        padding-right: 3px;
+    }
+    .pointerNone {
+        cursor: no-drop;
+    }
 }
+
+.UICustomPanelPluginMenu {
+    .menuPluginItem .x-menu-item-text-default.x-menu-item-indent-no-separator {
+        margin-left: 15px;
+    }
+    .x-menu-item.menuPluginItemCurrent {
+        background-color: var(--base-light-color);
+    }
+}