Merge pull request #429 from ONLYOFFICE/feature/plugin-help

Feature/plugin help

apps/common/main/lib/component/Window.js

@@ -152,6 +152,7 @@ define([
                 alias:      'Window',
                 cls:        '',
                 toolclose:  'close',
+                help:       false,
                 maxwidth: undefined,
                 maxheight: undefined,
                 minwidth: 0,
@@ -162,9 +163,14 @@ define([
         var template = '<div class="asc-window<%= modal?" modal":"" %><%= cls?" "+cls:"" %>" id="<%= id %>" style="width:<%= width %>px;">' +
                             '<% if (header==true) { %>' +
                                 '<div class="header">' +
+                                    '<div class="tools">' +
                                     '<% if (closable!==false) %>' +
                                         '<div class="tool close img-commonctrl"></div>' +
                                     '<% %>' +
+                                    '<% if (help===true) %>' +
+                                        '<div class="tool help">?</div>' +
+                                    '<% %>' +
+                                    '</div>' +
                                     '<div class="title"><%= title %></div> ' +
                                 '</div>' +
                             '<% } %>' +
@@ -284,7 +290,7 @@ define([
 
         /* window drag's functions */
         function _dragstart(event) {
-            if ( $(event.target).hasClass('close') ) return;
+            if ( $(event.target).hasClass('close') || $(event.target).hasClass('help') ) return;
             Common.UI.Menu.Manager.hideAll();
             var zoom = (event instanceof jQuery.Event) ? Common.Utils.zoom() : 1;
             this.dragging.enabled = true;
@@ -635,8 +641,13 @@ define([
                         else
                             (this.initConfig.toolclose=='hide') ? this.hide() : this.close();
                     };
+                    var dohelp = function() {
+                        if ( this.$window.find('.tool.help').hasClass('disabled') ) return;
+                        this.fireEvent('help',this);
+                    };
                     this.$window.find('.header').on('mousedown', this.binding.dragStart);
                     this.$window.find('.tool.close').on('click', _.bind(doclose, this));
+                    this.$window.find('.tool.help').on('click', _.bind(dohelp, this));
 
                     if (!this.initConfig.modal)
                         Common.Gateway.on('processmouse', _.bind(_onProcessMouse, this));

apps/common/main/lib/controller/Plugins.js

@@ -203,6 +203,7 @@ define([
                 plugin.set_Name(item.get('name'));
                 plugin.set_Guid(item.get('guid'));
                 plugin.set_BaseUrl(item.get('baseUrl'));
+                plugin.set_Help(item.get('help'));
 
                 var variations = item.get('variations'),
                     variationsArr = [];
@@ -380,6 +381,7 @@ define([
                         });
                     }
 
+                    var help = plugin.get_Help();
                     me.pluginDlg = new Common.Views.PluginDlg({
                         cls: isCustomWindow ? 'plain' : '',
                         header: !isCustomWindow,
@@ -389,7 +391,8 @@ define([
                         url: url,
                         frameId : frameId,
                         buttons: isCustomWindow ? undefined : newBtns,
-                        toolcallback: _.bind(this.onToolClose, this)
+                        toolcallback: _.bind(this.onToolClose, this),
+                        help: !!help
                     });
                     me.pluginDlg.on({
                         'render:after': function(obj){
@@ -404,6 +407,9 @@ define([
                         },
                         'resize': function(args){
                             me.api.asc_pluginEnableMouseEvents(args[1]=='start');
+                        },
+                        'help': function(){
+                            help && window.open(help, '_blank');
                         }
                     });
 
@@ -555,7 +561,8 @@ define([
                             currentVariation: 0,
                             visible: pluginVisible,
                             groupName: (item.group) ? item.group.name : '',
-                            groupRank: (item.group) ? item.group.rank : 0
+                            groupRank: (item.group) ? item.group.rank : 0,
+                            help: item.help
                         }));
                     }
                 });

apps/common/main/resources/less/window.less

@@ -59,6 +59,12 @@
 
         cursor: move;
 
+        .tools {
+            position: absolute;
+            right: 0;
+            padding-right: 6px;
+        }
+
         .tool {
             float: right;
             width: 16px;
@@ -80,6 +86,25 @@
                     cursor: default;
                 }
             }
+
+            &.help {
+                width: 20px;
+                margin-right:0;
+                line-height: 14px;
+                font-size: 14px;
+                font-weight: bold;
+                color: #444;
+                opacity: 0.7;
+
+                &:hover {
+                    opacity: 1;
+                }
+
+                &.disabled {
+                    opacity: 0.3;
+                    cursor: default;
+                }
+            }
         }
 
         &.resizing {