strepsirrhini/libreoffice-online
3
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

jsdialogs: if only two panels, create tabs

Browse source 
Change-Id: I714d1cb3f1babb80a85b303163ca8437d4f75be3
This commit is contained in:
Szymon Kłos 2019-10-08 10:50:20 +02:00
parent 034715aec1
commit 1004e5e7ea
2 changed files with 112 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
loleaflet/css/toolbar.css
View file

@ -1008,3 +1008,24 @@ menu-entry-with-icon.padding-left + menu-entry-icon.width */
.menu-entry-no-icon {
padding-left: 42px;
}
.ui-tabs.mobile-wizard {
text-align: center;
}
.ui-tab.mobile-wizard {
display: inline-table;
height: 36px;
line-height: 36px;
vertical-align: middle;
margin: 5px;
padding: 5px;
border-radius: 10px;
border: solid 1px #0b87e7;
}
.ui-tab.selected.mobile-wizard {
color: white;
background-color: #eaf5ff;
border: none;
}

101
loleaflet/src/control/Control.JSDialogBuilder.js
View file

@ -36,6 +36,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
this._controlHandlers['grid'] = this._containerHandler;
this._controlHandlers['frame'] = this._frameHandler;
this._controlHandlers['panel'] = this._panelHandler;
this._controlHandlers['paneltabs'] = this._panelTabsHandler;
this._controlHandlers['container'] = this._containerHandler;
this._controlHandlers['window'] = this._containerHandler;
this._controlHandlers['borderwindow'] = this._containerHandler;
@ -186,6 +187,74 @@ L.Control.JSDialogBuilder = L.Control.extend({
return false;
},
_panelTabsHandler: function(parentContainer, data, builder) {
var tabsContainer = L.DomUtil.create('div', 'ui-tabs mobile-wizard ui-widget', parentContainer);
var contentsContainer = L.DomUtil.create('div', 'ui-tabs-content mobile-wizard ui-widget', parentContainer);
var title1 = builder._cleanText(data.children[1].children[0].id);
var icon1 = builder._createIconPath(title1);
var tab1 = L.DomUtil.create('div', 'ui-tab mobile-wizard', tabsContainer);
var button = L.DomUtil.create('img', 'ui-tab-content mobile-wizard unobutton', tab1);
button.src = icon1;
var label = L.DomUtil.create('span', 'ui-tab-content mobile-wizard unolabel', tab1);
label.innerHTML = title1;
var contentDiv = L.DomUtil.create('div', 'ui-content level-' + builder._currentDepth + ' mobile-wizard', contentsContainer);
contentDiv.title = title1;
builder._currentDepth++;
for (var i = 0; i < data.children[1].children[0].children.length; i++) {
builder.build(contentDiv, [data.children[1].children[0].children[i]]);
}
builder._currentDepth--;
$(contentDiv).hide();
var tab2 = L.DomUtil.create('div', 'ui-tab mobile-wizard', tabsContainer);
var title2 = builder._cleanText(data.children[3].children[0].id);
var icon2 = builder._createIconPath(title2);
var button2 = L.DomUtil.create('img', 'ui-tab-content mobile-wizard unobutton', tab2);
button2.src = icon2;
var label2 = L.DomUtil.create('span', 'ui-tab-content mobile-wizard unolabel', tab2);
label2.innerHTML = title2;
var contentDiv2 = L.DomUtil.create('div', 'ui-content level-' + builder._currentDepth + ' mobile-wizard', contentsContainer);
contentDiv2.title = title2;
builder._currentDepth++;
for (i = 0; i < data.children[3].children[0].children.length; i++) {
builder.build(contentDiv2, [data.children[3].children[0].children[i]]);
}
builder._currentDepth--;
$(contentDiv2).hide();
if (builder.wizard) {
$(tab1).click(function() {
$(tab1).addClass('selected');
$(tab2).removeClass('selected');
$(contentDiv).show();
$(contentDiv2).hide();
});
$(tab2).click(function() {
$(tab2).addClass('selected');
$(tab1).removeClass('selected');
$(contentDiv).hide();
$(contentDiv2).show();
});
} else {
console.debug('Builder used outside of mobile wizard: please implement the click handler');
}
return false;
},
_radiobuttonControl: function(parentContainer, data, builder) {
var radiobutton = L.DomUtil.createWithId('input', data.id, parentContainer);
radiobutton.type = 'radio';
@ -325,9 +394,12 @@ L.Control.JSDialogBuilder = L.Control.extend({
return false;
},
_createIconPathFronUnoCommand: function(command) {
var commandName = command.substring('.uno:'.length);
return 'images/lc_' + commandName.toLowerCase() + '.svg';
_createIconPath: function(name) {
var cleanName = name;
var prefixLength = '.uno:'.length;
if (name.substr(0, prefixLength) == '.uno:')
cleanName = name.substr(prefixLength);
return 'images/lc_' + cleanName.toLowerCase() + '.svg';
},
_unoToolButton: function(parentContainer, data, builder) {
@ -339,7 +411,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
var id = data.command.substr('.uno:'.length);
div.id = id;
var icon = builder._createIconPathFronUnoCommand(data.command);
var icon = builder._createIconPath(data.command);
var buttonId = id + 'img';
button = L.DomUtil.create('img', 'ui-content unobutton', div);
@ -459,13 +531,22 @@ L.Control.JSDialogBuilder = L.Control.extend({
var handler = this._controlHandlers[childType];
if (handler)
processChildren = handler(childObject, childData, this);
else
console.warn('Unsupported control type: \"' + childType + '\"');
var twoPanelsAsChildren = childData.children && childData.children.length == 5
&& childData.children[1] && childData.children[1].type == 'panel'
&& childData.children[3] && childData.children[3].type == 'panel';
if (processChildren && childData.children != undefined)
this.build(childObject, childData.children);
if (twoPanelsAsChildren) {
handler = this._controlHandlers['paneltabs'];
processChildren = handler(childObject, childData, this);
} else {
if (handler)
processChildren = handler(childObject, childData, this);
else
console.warn('Unsupported control type: \"' + childType + '\"');
if (processChildren && childData.children != undefined)
this.build(childObject, childData.children);
}
}
}
});