Merge branch 'feature/Bug_37388' into develop.

[SSE] Fix bug 37388: work with several tabs
This commit is contained in:
Julia Radzhabova 2019-10-09 14:39:16 +03:00
commit efa8b00b7e
5 changed files with 302 additions and 63 deletions

View file

@ -51,7 +51,7 @@ define([
this.active = false;
this.label = 'Tab';
this.cls = '';
this.template = _.template(['<li class="<% if(active){ %>active<% } %> <% if(cls.length){%><%= cls %><%}%>" data-label="<%= label %>">',
this.template = _.template(['<li class="<% if(active){ %>active selected<% } %> <% if(cls.length){%><%= cls %><%}%>" data-label="<%= label %>">',
'<a><%- label %></a>',
'</li>'].join(''));
@ -82,6 +82,10 @@ define([
this.$el.addClass('active');
},
isSelected: function() {
return this.$el.hasClass('selected');
},
deactivate: function(){
this.$el.removeClass('active');
},
@ -110,6 +114,11 @@ define([
this.$el.removeClass(cls);
},
toggleClass: function(cls) {
if (cls.length)
this.$el.toggleClass(cls);
},
hasClass: function(cls) {
return this.$el.hasClass(cls);
},

View file

@ -69,12 +69,28 @@ define([
};
StateManager.prototype.attach = function (tab) {
tab.changeState = $.proxy(function () {
this.trigger('tab:change', tab);
this.bar.$el.find('ul > li.active').removeClass('active');
tab.activate();
tab.changeState = $.proxy(function (select) {
if (select) {
tab.toggleClass('selected');
var selectTab = _.find(this.bar.selectTabs, function (item) {return item.sheetindex === tab.sheetindex;});
if (selectTab) {
this.bar.selectTabs = _.without(this.bar.selectTabs, selectTab);
} else {
this.bar.selectTabs.push(tab);
}
} else {
if (!tab.isSelected()) {
this.bar.$el.find('ul > li.selected').removeClass('selected');
tab.addClass('selected');
this.bar.selectTabs.length = 0;
this.bar.selectTabs.push(tab);
}
this.trigger('tab:change', tab);
this.bar.$el.find('ul > li.active').removeClass('active');
tab.activate();
this.bar.trigger('tab:changed', this.bar, this.bar.tabs.indexOf(tab), tab);
this.bar.trigger('tab:changed', this.bar, this.bar.tabs.indexOf(tab), tab);
}
}, this);
var dragHelper = new (function() {
@ -278,17 +294,91 @@ define([
document.removeEventListener('dragstart',dragDropText);
});
}
},
setHookTabs: function (e, bar, tabs) {
var me = this;
function dragComplete() {
if (!_.isUndefined(me.drag)) {
bar.dragging = false;
bar.$el.find('li.mousemove').removeClass('mousemove right');
var arrSelectIndex = [];
tabs.forEach(function (item) {
arrSelectIndex.push(item.sheetindex);
});
if (!_.isUndefined(me.drag.place)) {
me.bar.trigger('tab:move', arrSelectIndex, me.drag.place);
me.bar.$bar.scrollLeft(me.scrollLeft);
me.bar.scrollX = undefined;
} else {
me.bar.trigger('tab:move', arrSelectIndex);
me.bar.$bar.scrollLeft(me.scrollLeft);
me.bar.scrollX = undefined;
}
me.drag = undefined;
}
}
function dragMove (event) {
if (!_.isUndefined(me.drag)) {
me.drag.moveX = event.clientX*Common.Utils.zoom();
if (me.drag.moveX > me.tabBarRight) {
bar.tabs[bar.tabs.length - 1].$el.addClass('mousemove right');
me.drag.place = bar.tabs.length;
} else {
$(event.target).parent().parent().find('li.mousemove').removeClass('mousemove right');
$(event.target).parent().addClass('mousemove');
var name = event.target.parentElement.dataset.label,
currentTab = _.findWhere(bar.tabs, {label: name});
if (!_.isUndefined(currentTab)) {
me.drag.place = currentTab.sheetindex;
}
}
}
}
if (!_.isUndefined(bar) && !_.isUndefined(tabs) && bar.tabs.length > 1) {
me.bar = bar;
me.drag = {tabs: tabs};
bar.dragging = true;
this.calculateBounds();
$(document).on('mousemove.tabbar', dragMove);
$(document).on('mouseup.tabbar', function (e) {
dragComplete(e);
$(document).off('mouseup.tabbar');
$(document).off('mousemove.tabbar', dragMove);
});
}
}
}
});
tab.$el.on({
click: $.proxy(function () {
if (!tab.disabled && !tab.$el.hasClass('active')) {
if (tab.control == 'manual') {
this.bar.trigger('tab:manual', this.bar, this.bar.tabs.indexOf(tab), tab);
} else {
tab.changeState();
click: $.proxy(function (event) {
if (!tab.disabled) {
if (event.ctrlKey || event.metaKey) {
tab.changeState(true);
} else if (event.shiftKey) {
this.bar.$el.find('ul > li.selected').removeClass('selected');
this.bar.selectTabs.length = 0;
var $active = this.bar.$el.find('ul > li.active'),
indexAct = $active.index(),
indexCur = this.bar.tabs.indexOf(tab);
var startIndex = (indexCur > indexAct) ? indexAct : indexCur,
endIndex = (indexCur > indexAct) ? indexCur : indexAct;
for (var i = startIndex; i <= endIndex; i++) {
this.bar.tabs[i].changeState(true);
}
} else if (!tab.$el.hasClass('active')) {
if (this.bar.tabs.length === this.bar.selectTabs.length) {
this.bar.$el.find('ul > li.selected').removeClass('selected');
this.bar.selectTabs.length = 0;
}
if (tab.control == 'manual') {
this.bar.trigger('tab:manual', this.bar, this.bar.tabs.indexOf(tab), tab);
} else {
tab.changeState();
}
}
}
!tab.disabled && Common.NotificationCenter.trigger('edit:complete', this.bar);
@ -297,12 +387,16 @@ define([
this.trigger('tab:dblclick', this, this.tabs.indexOf(tab), tab);
}, this.bar),
contextmenu: $.proxy(function () {
this.trigger('tab:contextmenu', this, this.tabs.indexOf(tab), tab);
this.trigger('tab:contextmenu', this, this.tabs.indexOf(tab), tab, this.selectTabs);
}, this.bar),
mousedown: $.proxy(function (e) {
if (this.bar.options.draggable && !_.isUndefined(dragHelper) && (3 !== e.which)) {
if (!tab.isLockTheDrag) {
dragHelper.setHook(e, this.bar, tab);
if (this.bar.selectTabs.length > 1) {
dragHelper.setHookTabs(e, this.bar, this.bar.selectTabs);
} else {
dragHelper.setHook(e, this.bar, tab);
}
}
}
}, this)
@ -322,6 +416,7 @@ define([
tabs: [],
template: _.template('<ul class="nav nav-tabs <%= placement %>" />'),
selectTabs: [],
initialize : function (options) {
_.extend(this.config, options);
@ -397,6 +492,10 @@ define([
me.$bar.append(tab.render().$el);
me.tabs.push(tab);
me.manager.attach(tab);
if (tab.isActive()) {
me.selectTabs.length = 0;
me.selectTabs.push(tab);
}
}
} else {
for (i = tabs.length; i-- > 0 ; ) {
@ -410,6 +509,11 @@ define([
me.tabs.splice(index, 0, tab);
}
if (tab.isActive()) {
me.selectTabs.length = 0;
me.selectTabs.push(tab);
}
me.manager.attach(tab);
}
}
@ -462,6 +566,27 @@ define([
this.checkInvisible();
},
setSelectAll: function(isSelect) {
var me = this;
me.selectTabs.length = 0;
if (isSelect) {
me.tabs.forEach(function(tab){
if (!tab.isSelected()) {
tab.addClass('selected');
}
me.selectTabs.push(tab);
});
} else {
me.tabs.forEach(function(tab){
if (tab.isActive()) {
me.selectTabs.push(tab);
} else if (tab.isSelected()) {
tab.removeClass('selected');
}
});
}
},
getActive: function(iselem) {
return iselem ? this.$bar.find('> li.active') : this.$bar.find('> li.active').index();
},

View file

@ -247,24 +247,42 @@ define([
onTabMenu: function(obj, item, e) {
var me = this;
switch (item.value){
case 'ins':
setTimeout(function(){
me.api.asc_insertWorksheet(me.createSheetName());
}, 1);
break;
case 'del': this.deleteWorksheet(); break;
case 'ren': this.renameWorksheet(); break;
case 'copy': this.moveWorksheet(false); break;
case 'move': this.moveWorksheet(true); break;
case 'hide':
setTimeout(function(){
me.hideWorksheet(true);}, 1);
break;
var selectTabs = this.statusbar.tabbar.selectTabs,
arrIndex = [];
selectTabs.forEach(function (item) {
arrIndex.push(item.sheetindex);
});
switch (item.value) {
case 'ins':
var arrNames = [];
for(var i = 0; i < arrIndex.length; i++) {
arrNames.push(me.createSheetName(arrNames));
}
setTimeout(function () {
me.api.asc_insertWorksheet(arrNames);
}, 1);
break;
case 'del':
this.deleteWorksheet(arrIndex);
break;
case 'ren':
this.renameWorksheet();
break;
case 'copy':
this.moveWorksheet(arrIndex, false);
break;
case 'move':
this.moveWorksheet(arrIndex, true);
break;
case 'hide':
setTimeout(function () {
me.hideWorksheet(true, arrIndex);
}, 1);
break;
}
},
createSheetName: function() {
createSheetName: function(curArrNames) {
var items = [], wc = this.api.asc_getWorksheetsCount();
while (wc--) {
items.push(this.api.asc_getWorksheetName(wc).toLowerCase());
@ -276,10 +294,21 @@ define([
if (items.indexOf(name.toLowerCase()) < 0) break;
}
if (curArrNames && curArrNames.length > 0) {
var arr = [];
curArrNames.forEach(function (item) {
arr.push(item.toLowerCase());
});
while(arr.indexOf(name.toLowerCase()) !== -1) {
index++;
name = this.strSheet + index;
}
}
return name;
},
createCopyName: function(orig) {
createCopyName: function(orig, curArrNames) {
var wc = this.api.asc_getWorksheetsCount(), names = [];
while (wc--) {
names.push(this.api.asc_getWorksheetName(wc).toLowerCase());
@ -294,20 +323,31 @@ define([
if (names.indexOf(name.toLowerCase()) < 0) break;
}
if (curArrNames && curArrNames.length > 0) {
var arr = [];
curArrNames.forEach(function (item) {
arr.push(item.toLowerCase());
});
while(arr.indexOf(name.toLowerCase()) !== -1) {
index++;
name = first + '(' + index + ')';
}
}
return name;
},
deleteWorksheet: function() {
deleteWorksheet: function(selectTabs) {
var me = this;
if (this.statusbar.tabbar.tabs.length == 1) {
if (this.statusbar.tabbar.tabs.length == 1 || selectTabs.length === this.statusbar.tabbar.tabs.length) {
Common.UI.warning({msg: this.errorLastSheet});
} else {
Common.UI.warning({
msg: this.warnDeleteSheet,
buttons: ['ok','cancel'],
callback: function(btn) {
if (btn == 'ok' && !me.api.asc_deleteWorksheet()) {
if (btn == 'ok' && !me.api.asc_deleteWorksheet(selectTabs)) {
_.delay(function(){
Common.UI.error({msg: me.errorRemoveSheet});
},10);
@ -319,7 +359,7 @@ define([
hideWorksheet: function(hide, index) {
if ( hide ) {
this.statusbar.tabbar.tabs.length == 1 ?
(this.statusbar.tabbar.tabs.length == 1 || index.length === this.statusbar.tabbar.tabs.length) ?
Common.UI.warning({msg: this.errorLastSheet}) :
this.api['asc_hideWorksheet'](index);
} else {
@ -376,26 +416,38 @@ define([
}
},
moveWorksheet: function(cut, silent, index, destPos) {
moveWorksheet: function(selectArr, cut, silent, index, destPos) {
var me = this;
var wc = me.api.asc_getWorksheetsCount(), items = [], i = -1;
var wc = me.api.asc_getWorksheetsCount(), items = [], arrIndex = [], i = -1;
while (++i < wc) {
if (!this.api.asc_isWorksheetHidden(i)) {
items.push({
value : me.api.asc_getWorksheetName(i),
inindex : i
value: me.api.asc_getWorksheetName(i),
inindex: i
});
}
}
if (!_.isUndefined(selectArr)) {
items.forEach(function (item) {
if (selectArr.indexOf(item.inindex) !== -1) {
arrIndex.push(item.inindex);
}
});
}
if (!_.isUndefined(silent)) {
me.api.asc_showWorksheet(items[index].inindex);
if (_.isUndefined(selectArr)) {
me.api.asc_showWorksheet(items[index].inindex);
Common.NotificationCenter.trigger('comments:updatefilter', ['doc', 'sheet' + this.api.asc_getActiveWorksheetId()]);
Common.NotificationCenter.trigger('comments:updatefilter', ['doc', 'sheet' + this.api.asc_getActiveWorksheetId()]);
if (!_.isUndefined(destPos)) {
me.api.asc_moveWorksheet(items.length === destPos ? wc : items[destPos].inindex);
if (!_.isUndefined(destPos)) {
me.api.asc_moveWorksheet(items.length === destPos ? wc : items[destPos].inindex);
}
} else {
if (!_.isUndefined(destPos)) {
me.api.asc_moveWorksheet(destPos, arrIndex);
}
}
return;
}
@ -406,10 +458,13 @@ define([
handler : function(btn, i) {
if (btn == 'ok') {
if (cut) {
me.api.asc_moveWorksheet(i == -255 ? wc : i);
me.api.asc_moveWorksheet(i == -255 ? wc : i, arrIndex);
} else {
var new_text = me.createCopyName(me.api.asc_getWorksheetName(me.api.asc_getActiveWorksheetIndex()));
me.api.asc_copyWorksheet(i == -255 ? wc : i, new_text);
var arrNames = [];
arrIndex.forEach(function (item) {
arrNames.push(me.createCopyName(me.api.asc_getWorksheetName(item), arrNames));
});
me.api.asc_copyWorksheet(i == -255 ? wc : i, arrNames, arrIndex);
}
}
me.api.asc_enableKeyEvents(true);
@ -481,18 +536,26 @@ define([
},
setWorksheetColor: function (color) {
var me = this;
if (this.api) {
var sindex = this.api.asc_getActiveWorksheetIndex();
var tab = _.findWhere(this.statusbar.tabbar.tabs, {sheetindex: sindex});
if (tab) {
var selectTabs = this.statusbar.tabbar.selectTabs,
arrIndex = [];
selectTabs.forEach(function (item) {
arrIndex.push(item.sheetindex);
});
if (arrIndex) {
if ('transparent' === color) {
this.api.asc_setWorksheetTabColor(null, [sindex]);
tab.$el.find('a').css('box-shadow', '');
this.api.asc_setWorksheetTabColor(null, arrIndex);
selectTabs.forEach(function (tab) {
tab.$el.find('a').css('box-shadow', '');
});
} else {
var asc_clr = Common.Utils.ThemeColor.getRgbColor(color);
if (asc_clr) {
this.api.asc_setWorksheetTabColor(asc_clr, [sindex]);
this.setTabLineColor(tab, asc_clr);
this.api.asc_setWorksheetTabColor(asc_clr, arrIndex);
selectTabs.forEach(function (tab) {
me.setTabLineColor(tab, asc_clr);
});
}
}
}

View file

@ -182,19 +182,23 @@ define([
me.fireEvent('sheet:changename');
}
}, this),
'tab:move' : _.bind(function (tabIndex, index) {
'tab:move' : _.bind(function (selectTabs, index) {
me.tabBarScroll = {scrollLeft: me.tabbar.scrollX};
if (_.isUndefined(index) || tabIndex === index) {
if (_.isUndefined(selectTabs) || _.isUndefined(index) || selectTabs === index) {
return;
}
if (_.isArray(selectTabs)) {
me.fireEvent('sheet:move', [selectTabs, false, true, undefined, index]);
} else {
var tabIndex = selectTabs;
if (tabIndex < index) {
++index;
if (tabIndex < index) {
++index;
}
me.fireEvent('sheet:move', [undefined, false, true, tabIndex, index]);
}
me.fireEvent('sheet:move', [false, true, tabIndex, index]);
}, this)
});
@ -241,7 +245,10 @@ define([
{
caption: this.itemTabColor,
menu: menuColorItems
}
},
{ caption: '--' },
{caption: this.selectAllSheets, value: 'selectall'},
{caption: this.ungroupSheets, value: 'noselect'}
]
}).on('render:after', function(btn) {
var colorVal = $('<div class="btn-color-value-line"></div>');
@ -409,7 +416,7 @@ define([
// Common.NotificationCenter.trigger('comments:updatefilter', ['doc', 'sheet' + this.api.asc_getActiveWorksheetId()], false); // hide popover
},
onTabMenu: function (o, index, tab) {
onTabMenu: function (o, index, tab, select) {
if (this.mode.isEdit && !this.isEditFormula && (this.rangeSelectionMode !== Asc.c_oAscSelectionDialogType.Chart) &&
(this.rangeSelectionMode !== Asc.c_oAscSelectionDialogType.FormatTable) &&
!this.mode.isDisconnected ) {
@ -432,6 +439,15 @@ define([
this.tabMenu.items[6].setDisabled(isdoclocked);
this.tabMenu.items[7].setDisabled(issheetlocked);
if (select.length === 1) {
this.tabMenu.items[10].hide();
} else {
this.tabMenu.items[10].show();
}
this.tabMenu.items[9].setDisabled(issheetlocked);
this.tabMenu.items[10].setDisabled(issheetlocked);
this.api.asc_closeCellEditor();
this.api.asc_enableKeyEvents(false);
@ -473,6 +489,11 @@ define([
onTabMenuClick: function (o, item) {
if (item && this.api) {
this.enableKeyEvents = (item.value === 'ins' || item.value === 'hide');
if (item.value === 'selectall') {
this.tabbar.setSelectAll(true);
} else if (item.value === 'noselect') {
this.tabbar.setSelectAll(false);
}
}
},
@ -544,7 +565,9 @@ define([
textMin : 'MIN',
textMax : 'MAX',
filteredRecordsText : '{0} of {1} records filtered',
filteredText : 'Filter mode'
filteredText : 'Filter mode',
selectAllSheets : 'Select All Sheets',
ungroupSheets : 'Ungroup Sheets'
}, SSE.Views.Statusbar || {}));
SSE.Views.Statusbar.RenameDialog = Common.UI.Window.extend(_.extend({

View file

@ -194,6 +194,14 @@
}
}
&.selected {
> a {
border-bottom-color: @body-bg;
background-color: @body-bg;
box-shadow: 0px 2px 0 @gray-deep inset;
}
}
&.coauth-locked {
> a {
outline: none;
@ -224,6 +232,17 @@
color: @gray-darker;
}
}
&.mousemove {
> a {
background: linear-gradient(to right, @black, @gray-light 1px);
}
&.right {
> a {
background: linear-gradient(to left, @black, @gray-light 1px);
}
}
}
}
}