Add close comments button. Layout refactoring

apps/common/main/lib/template/CommentsPanel.template

@@ -12,6 +12,7 @@
     </div>
     <div id="comments-header" class="">
         <label><%=textComments%></label>
+        <div id="comments-btn-close" style="float:right;margin-left: 4px;"></div>
         <div id="comments-btn-sort" style="float:right;"></div>
     </div>
 </div>

apps/common/main/lib/view/Comments.js

@@ -359,9 +359,17 @@ define([
                     })
                 });
 
+                this.buttonClose = new Common.UI.Button({
+                    parentEl: $('#comments-btn-close', this.$el),
+                    cls: 'btn-toolbar',
+                    iconCls: 'toolbar__icon btn-close',
+                    hint: this.textClosePanel
+                });
+
                 this.buttonAddCommentToDoc.on('click', _.bind(this.onClickShowBoxDocumentComment, this));
                 this.buttonAdd.on('click', _.bind(this.onClickAddDocumentComment, this));
                 this.buttonCancel.on('click', _.bind(this.onClickCancelDocumentComment, this));
+                this.buttonClose.on('click', _.bind(this.onClickClosePanel, this));
                 this.buttonSort.menu.on('item:toggle', _.bind(this.onSortClick, this));
 
                 this.txtComment = $('#comment-msg-new', this.el);
@@ -776,6 +784,10 @@ define([
             state && this.fireEvent('comment:sort', [item.value]);
         },
 
+        onClickClosePanel: function() {
+            Common.NotificationCenter.trigger('leftmenu:change', 'hide');
+        },
+
         textComments            : 'Comments',
         textAnonym              : 'Guest',
         textAddCommentToDoc     : 'Add Comment to Document',
@@ -794,6 +806,7 @@ define([
         textSort: 'Sort comments',
         mniPosition: 'Sort by Position',
         mniAuthor: 'Sort by Authors',
-        mniDate: 'Sort by Date'
+        mniDate: 'Sort by Date',
+        textClosePanel: 'Close comments'
     }, Common.Views.Comments || {}))
 });

apps/common/main/resources/less/comments.less

@@ -23,6 +23,15 @@
             font-weight: bold;
             margin-top: 2px;
         }
+
+        #comments-btn-sort {
+            .btn-toolbar {
+                min-width: 20px;
+            }
+            .inner-box-caret {
+                display: none;
+            }
+        }
     }
 
     .messages-ct {

apps/documenteditor/main/locale/en.json

@@ -250,6 +250,7 @@
   "Common.Views.Comments.mniPosition": "Sort by Position",
   "Common.Views.Comments.mniAuthor": "Sort by Authors",
   "Common.Views.Comments.mniDate": "Sort by Date",
+  "Common.Views.Comments.textClosePanel": "Close comments",
   "Common.Views.CopyWarningDialog.textDontShow": "Don't show this message again",
   "Common.Views.CopyWarningDialog.textMsg": "Copy, cut and paste actions using the editor toolbar buttons and context menu actions will be performed within this editor tab only.<br><br>To copy or paste to or from applications outside the editor tab use the following keyboard combinations:",
   "Common.Views.CopyWarningDialog.textTitle": "Copy, Cut and Paste Actions",

apps/presentationeditor/main/locale/en.json

@@ -143,6 +143,7 @@
   "Common.Views.Comments.mniPosition": "Sort by Position",
   "Common.Views.Comments.mniAuthor": "Sort by Authors",
   "Common.Views.Comments.mniDate": "Sort by Date",
+  "Common.Views.Comments.textClosePanel": "Close comments",
   "Common.Views.CopyWarningDialog.textDontShow": "Don't show this message again",
   "Common.Views.CopyWarningDialog.textMsg": "Copy, cut and paste actions using the editor toolbar buttons and context menu actions will be performed within this editor tab only.<br><br>To copy or paste to or from applications outside the editor tab use the following keyboard combinations:",
   "Common.Views.CopyWarningDialog.textTitle": "Copy, Cut and Paste Actions",

apps/spreadsheeteditor/main/app/controller/LeftMenu.js

@@ -98,6 +98,7 @@ define([
                 }
             });
             Common.NotificationCenter.on('app:comment:add', _.bind(this.onAppAddComment, this));
+            Common.NotificationCenter.on('leftmenu:change', _.bind(this.onMenuChange, this));
         },
 
         onLaunch: function() {
@@ -961,6 +962,18 @@ define([
             }
         },
 
+        onMenuChange: function (value) {
+            if ('hide' === value) {
+                if (this.leftMenu.btnComments.isActive() && this.api) {
+                    this.leftMenu.btnComments.toggle(false);
+                    this.leftMenu.onBtnMenuClick(this.leftMenu.btnComments);
+
+                    // focus to sdk
+                    this.api.asc_enableKeyEvents(true);
+                }
+            }
+        },
+
         textNoTextFound        : 'Text not found',
         newDocumentTitle        : 'Unnamed document',
         textItemEntireCell      : 'Entire cell contents',

apps/spreadsheeteditor/main/locale/en.json

@@ -191,6 +191,7 @@
   "Common.Views.Comments.mniPosition": "Sort by Position",
   "Common.Views.Comments.mniAuthor": "Sort by Authors",
   "Common.Views.Comments.mniDate": "Sort by Date",
+  "Common.Views.Comments.textClosePanel": "Close comments",
   "Common.Views.CopyWarningDialog.textDontShow": "Don't show this message again",
   "Common.Views.CopyWarningDialog.textMsg": "Copy, cut and paste actions using the editor toolbar buttons and context menu actions will be performed within this editor tab only.<br><br>To copy or paste to or from applications outside the editor tab use the following keyboard combinations:",
   "Common.Views.CopyWarningDialog.textTitle": "Copy, Cut and Paste Actions",