[SSE] Add second line in statusbar, add hide statusbar button in options

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

@@ -67,6 +67,9 @@ define([
                     'sheet:setcolor':       _.bind(this.setWorksheetColor, this),
                     'sheet:updateColors':   _.bind(this.updateTabsColors, this),
                     'sheet:move':           _.bind(this.moveWorksheet, this)
+                },
+                'Common.Views.Header': {
+                    'statusbar:setcompact': _.bind(this.onChangeViewMode, this)
                 }
             });
         },
@@ -787,6 +790,13 @@ define([
                 this._sheetViewTip.hide();
         },
 
+        onChangeViewMode: function(item, compact) {
+            this.statusbar.fireEvent('view:compact', [this.statusbar, compact]);
+            Common.localStorage.setBool('sse-compact-statusbar', compact);
+            Common.NotificationCenter.trigger('layout:changed', 'status');
+            Common.NotificationCenter.trigger('edit:complete', this.statusbar);
+        },
+
         zoomText        : 'Zoom {0}%',
         errorLastSheet  : 'Workbook must have at least one visible worksheet.',
         errorRemoveSheet: 'Can\'t delete the worksheet.',

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

@@ -72,7 +72,11 @@ define([
                     'menu:show': me.onFileMenu.bind(me, 'show')
                 },
                 'Statusbar': {
-                    'sheet:changed': me.onApiSheetChanged.bind(me)
+                    'sheet:changed': me.onApiSheetChanged.bind(me),
+                    'view:compact': function (statusbar, state) {
+                        me.header.mnuitemCompactStatusBar.setChecked(state, true);
+                        me.viewport.vlayout.getItem('statusbar').height = state ? 25 : 50;
+                    }
                 },
                 'Toolbar': {
                     'render:before' : function (toolbar) {
@@ -210,6 +214,13 @@ define([
                     }, this));
                 }
 
+                me.header.mnuitemCompactStatusBar = new Common.UI.MenuItem({
+                    caption: me.header.textHideStatusBar,
+                    checked: Common.localStorage.getBool("sse-compact-statusbar"),
+                    checkable: true,
+                    value: 'statusbar'
+                });
+
                 me.header.mnuitemHideFormulaBar = new Common.UI.MenuItem({
                     caption     : me.textHideFBar,
                     checked     : Common.localStorage.getBool('sse-hidden-formula'),
@@ -274,6 +285,7 @@ define([
                         style: 'min-width: 180px;',
                         items: [
                             me.header.mnuitemCompactToolbar,
+                            me.header.mnuitemCompactStatusBar,
                             me.header.mnuitemHideFormulaBar,
                             {caption:'--'},
                             me.header.mnuitemHideHeadings,
@@ -482,6 +494,7 @@ define([
 
             switch ( item.value ) {
             case 'toolbar': me.header.fireEvent('toolbar:setcompact', [menu, item.isChecked()]); break;
+            case 'statusbar': me.header.fireEvent('statusbar:setcompact', [menu, item.isChecked()]); break;
             case 'formula': me.header.fireEvent('formulabar:hide', [item.isChecked()]); break;
             case 'headings': me.api.asc_setDisplayHeadings(!item.isChecked()); break;
             case 'gridlines': me.api.asc_setDisplayGridlines(!item.isChecked()); break;

apps/spreadsheeteditor/main/app/template/StatusBar.template

@@ -1,5 +1,6 @@
 
 <div class="statusbar">
+    <div class="statusbar-top">
     <div id="status-tabs-scroll" class="status-group">
         <button id="status-btn-tabfirst" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="F"><i class="icon toolbar__icon btn-firstitem">&nbsp;</i></button>
         <button id="status-btn-tabback" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="B"><i class="icon toolbar__icon btn-previtem">&nbsp;</i></button>
@@ -38,4 +39,7 @@
         <div id="status-sheets-bar" class="status-group">
         </div>
     </div>
+    </div>
+    <div class="statusbar-bottom">
+    </div>
 </div>

apps/spreadsheeteditor/main/app/view/Viewport.js

@@ -99,7 +99,8 @@ define([
                     stretch: true
                 }, {
                     el: items[3],
-                    height: 25
+                    alias: 'statusbar',
+                    height: Common.localStorage.getBool('sse-compact-statusbar') ? 25 : 50
                 }]
             });
 

apps/spreadsheeteditor/main/resources/less/statusbar.less

@@ -426,6 +426,10 @@
             height: 25px;
         }
     }
+
+    .statusbar-top, .statusbar-bottom {
+        height: 25px;
+    }
 }
 
 .statusbar-mask {