]> git.proxmox.com Git - proxmox-widget-toolkit.git/commitdiff
add HelpButton class
authorDietmar Maurer <dietmar@proxmox.com>
Wed, 27 Sep 2017 08:04:29 +0000 (10:04 +0200)
committerDietmar Maurer <dietmar@proxmox.com>
Wed, 27 Sep 2017 08:04:29 +0000 (10:04 +0200)
Makefile
button/HelpButton.js [new file with mode: 0644]

index 9f08eca9b8863d658b3d38edf3872ee01e564edc..eae57cbb5648acc203e6fbc9e63d527182dbe288 100644 (file)
--- a/Makefile
+++ b/Makefile
@@ -30,6 +30,7 @@ JSSRC=                                        \
        form/ComboGrid.js               \
        form/RRDTypeSelector.js         \
        button/Button.js                \
+       button/HelpButton.js            \
        grid/ObjectGrid.js              \
        grid/PendingObjectGrid.js       \
        panel/InputPanel.js             \
diff --git a/button/HelpButton.js b/button/HelpButton.js
new file mode 100644 (file)
index 0000000..dcb6f6e
--- /dev/null
@@ -0,0 +1,93 @@
+/* help button pointing to an online documentation
+   for components contained in a modal window
+*/
+/*global
+  proxmoxOnlineHelpInfo
+*/
+Ext.define('Proxmox.button.Help', {
+    extend: 'Ext.button.Button',
+    xtype: 'proxmoxHelpButton',
+
+    text: gettext('Help'),
+
+    // make help button less flashy by styling it like toolbar buttons
+    iconCls: ' x-btn-icon-el-default-toolbar-small fa fa-question-circle',
+    cls: 'x-btn-default-toolbar-small proxmox-inline-button',
+
+    hidden: true,
+
+    listenToGlobalEvent: true,
+
+    controller: {
+       xclass: 'Ext.app.ViewController',
+       listen: {
+           global: {
+               proxmoxShowHelp: 'onProxmoxShowHelp',
+               proxmoxHideHelp: 'onProxmoxHideHelp'
+           }
+       },
+       onProxmoxShowHelp: function(helpLink) {
+           var me = this.getView();
+           if (me.listenToGlobalEvent === true) {
+               me.setOnlineHelp(helpLink);
+               me.show();
+           }
+       },
+       onProxmoxHideHelp: function() {
+           var me = this.getView();
+           if (me.listenToGlobalEvent === true) {
+               me.hide();
+           }
+       }
+    },
+
+    // this sets the link and the tooltip text
+    setOnlineHelp:function(blockid) {
+       var me = this;
+
+       var info = proxmoxOnlineHelpInfo[blockid];
+       if (info) {
+           me.onlineHelp = blockid;
+           var title = info.title;
+           if (info.subtitle) {
+               title += ' - ' + info.subtitle;
+           }
+           me.setTooltip(title);
+       }
+    },
+
+    // helper to set the onlineHelp via a config object
+    setHelpConfig: function(config) {
+       var me = this;
+       me.setOnlineHelp(config.onlineHelp);
+    },
+
+    handler: function() {
+       var me = this;
+       var docsURI;
+
+       if (me.onlineHelp) {
+           var info = proxmoxOnlineHelpInfo[me.onlineHelp];
+           if (info) {
+               docsURI = window.location.origin + info.link;
+           }
+       }
+
+       if (docsURI) {
+           window.open(docsURI);
+       } else {
+           Ext.Msg.alert(gettext('Help'), gettext('No Help available'));
+       }
+    },
+
+    initComponent: function() {
+       /*jslint confusion: true */
+       var me = this;
+
+       me.callParent();
+
+       if  (me.onlineHelp) {
+           me.setOnlineHelp(me.onlineHelp); // set tooltip
+       }
+    }
+});