diff --git a/apps/spreadsheeteditor/mobile/app/controller/Statusbar.js b/apps/spreadsheeteditor/mobile/app/controller/Statusbar.js index 7d55649a3..127b0dc32 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/Statusbar.js +++ b/apps/spreadsheeteditor/mobile/app/controller/Statusbar.js @@ -57,7 +57,8 @@ define([ initialize: function() { this.addListeners({ 'Statusbar': { - 'sheet:click': this.onTabClick + 'sheet:click': this.onTabClick, + 'sheet:addnew': this.onAddTab } }); }, @@ -79,6 +80,7 @@ define([ console.log('change in collection'); }, reset : function (collection, opts) { + me.statusbar.clearTabs(); collection.each(function(model) { me.statusbar.addSheet(model); }); @@ -134,54 +136,12 @@ define([ return; - // this.tabbar.empty(true); - // this.btnAddWorksheet.setDisabled(true); - if (this.api) { - var wc = this.api.asc_getWorksheetsCount(), i = -1; - var hidentems = [], items = [], tab, locked; - var sindex = this.api.asc_getActiveWorksheetIndex(); + // if (!this.tabbar.isTabVisible(sindex)) + // this.tabbar.setTabVisible(sindex); - while (++i < wc) { - locked = me.api.asc_isWorksheetLockedOrDeleted(i); - tab = { - sheetindex : i, - active : sindex == i, - label : me.api.asc_getWorksheetName(i), -// reorderable : !locked, - cls : locked ? 'coauth-locked':'', - isLockTheDrag : locked - }; - - this.api.asc_isWorksheetHidden(i)? hidentems.push(tab) : items.push(tab); - } - - if (hidentems.length) { - hidentems.forEach(function(item){ - me.tabMenu.items[6].menu.addItem(new Common.UI.MenuItem({ - style: 'white-space: pre-wrap', - caption: Common.Utils.String.htmlEncode(item.label), - value: item.sheetindex - })); - }); - this.tabMenu.items[6].show(); - } - - this.tabbar.add(items); - - if (!_.isUndefined(this.tabBarScroll)) { - this.tabbar.$bar.scrollLeft(this.tabBarScroll.scrollLeft); - this.tabBarScroll = undefined; - } - if (!this.tabbar.isTabVisible(sindex)) - this.tabbar.setTabVisible(sindex); - - this.btnAddWorksheet.setDisabled(me.mode.isDisconnected || me.api.asc_isWorkbookLocked()); - $('#status-label-zoom').text(Common.Utils.String.format(this.zoomText, Math.floor((this.api.asc_getZoom() +.005)*100))); - - me.fireEvent('sheet:changed', [me, sindex]); - me.fireEvent('sheet:updateColors', [true]); - Common.NotificationCenter.trigger('comments:updatefilter', {property: 'uid', value: new RegExp('^(doc_|sheet' + me.api.asc_getActiveWorksheetId() + '_)')}, false); + // this.btnAddWorksheet.setDisabled(me.mode.isDisconnected || me.api.asc_isWorkbookLocked()); + // $('#status-label-zoom').text(Common.Utils.String.format(this.zoomText, Math.floor((this.api.asc_getZoom() +.005)*100))); } }, @@ -520,6 +480,11 @@ define([ this.statusbar.setActiveTab(index); }, + onAddTab: function () { + this.api.asc_closeCellEditor(); + this.api.asc_addWorksheet(this.createSheetName()); + }, + errorLastSheet : 'Workbook must have at least one visible worksheet.', errorRemoveSheet: 'Can\'t delete the worksheet.', warnDeleteSheet : 'The worksheet maybe has data. Proceed operation?', diff --git a/apps/spreadsheeteditor/mobile/app/view/Statusbar.js b/apps/spreadsheeteditor/mobile/app/view/Statusbar.js index 0de837ce8..7dbcbcb1b 100644 --- a/apps/spreadsheeteditor/mobile/app/view/Statusbar.js +++ b/apps/spreadsheeteditor/mobile/app/view/Statusbar.js @@ -49,7 +49,7 @@ define([ el: '.pages > .page', template: '
' + '
' + - '' + + '' + '
' + '
' + '' + @@ -69,6 +69,10 @@ define([ this.$el = $(this.template).appendTo($(this.el)); this.$boxTabs = this.$el.find('.box-tabs > ul'); + this.$btnAddTab = this.$el.find('#box-addtab > .button'); + this.$btnAddTab.on('click', function(e){ + me.fireEvent('sheet:addnew'); + }); // this.editMode = false; @@ -115,6 +119,11 @@ define([ addSheets: function () { }, + clearTabs: function () { + this.$boxTabs.children().off('click'); + this.$boxTabs.empty(); + }, + setActiveTab: function (index) { this.$boxTabs.children().removeClass('active') .eq(index).addClass('active'); diff --git a/apps/spreadsheeteditor/mobile/resources/less/app-material.less b/apps/spreadsheeteditor/mobile/resources/less/app-material.less index f5e3171eb..007ac7f6a 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/app-material.less +++ b/apps/spreadsheeteditor/mobile/resources/less/app-material.less @@ -59,6 +59,7 @@ @import url('material/_icons.less'); @import url('app-common'); @import url('celleditor'); +@import url('statusbar'); // Add Container diff --git a/apps/spreadsheeteditor/mobile/resources/less/statusbar.less b/apps/spreadsheeteditor/mobile/resources/less/statusbar.less index d09a543f1..c6391a5cc 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/statusbar.less +++ b/apps/spreadsheeteditor/mobile/resources/less/statusbar.less @@ -1,4 +1,5 @@ @statusBarHeight: 30px; +@fontColor: #000; .statusbar { box-sizing: border-box; @@ -9,41 +10,59 @@ border-top: 1px solid @gray-dark; height: @statusBarHeight; + min-height: @statusBarHeight; display: flex; flex-direction: row; .box-tabs { flex-grow: 1; } + + .button { + border: 0 none; + color: #000; + font-size: 18px; + line-height: inherit; + } + + i.icon { + width: 22px; + height: 22px; + + &.icon-plus { + .encoded-svg-background(''); + } + } } .box-tabs { ul { margin: 0; padding: 0; + white-space: nowrap; > li { list-style: none; display: inline; - &.active { + &:not(.active) { a { - background-color: yellow; + color: #848484; } } a { display: inline-block; - border-radius: 0; padding: 0 10px 0; - line-height: 24px; + line-height: @statusBarHeight; margin-right: -1px; background-color: #f1f1f1; outline: none; - border-left-color: #cbcbcb; - border-right-color: #cbcbcb; - border-top-color: #cbcbcb; - color: #848484; + border: 1px solid #cbcbcb; + border-top: 0 none; + border-bottom: 0 none; + color: #000; + height: 100%; &:hover { cursor: pointer;