jsdialogs: UI Builder
Change-Id: I6cfcae90542eca84d45a99b15dc97ed3356a0626 Reviewed-on: https://gerrit.libreoffice.org/79724 Reviewed-by: Szymon Kłos <szymon.klos@collabora.com> Tested-by: Szymon Kłos <szymon.klos@collabora.com>
This commit is contained in:
parent
e3a01b7561
commit
ab9962a9f2
4 changed files with 155 additions and 3 deletions
|
@ -330,6 +330,7 @@ pot:
|
|||
src/control/Control.ContextMenu.js \
|
||||
src/control/Control.DocumentRepair.js \
|
||||
src/control/Control.DownloadProgress.js \
|
||||
src/control/Control.JSDialogBuilder.js \
|
||||
src/control/Control.Menubar.js \
|
||||
src/control/Control.MobileInput.js \
|
||||
src/control/Control.MobileWizard.js \
|
||||
|
|
|
@ -400,6 +400,7 @@ var deps = {
|
|||
'control/Control.LokDialog.js',
|
||||
'control/Control.AlertDialog.js',
|
||||
'control/Control.Infobar.js',
|
||||
'control/Control.JSDialogBuilder.js',
|
||||
'control/Control.MobileWizard.js'],
|
||||
heading: 'Controls',
|
||||
desc: 'Handles vex dialogs for displaying alerts'
|
||||
|
|
148
loleaflet/src/control/Control.JSDialogBuilder.js
Normal file
148
loleaflet/src/control/Control.JSDialogBuilder.js
Normal file
|
@ -0,0 +1,148 @@
|
|||
/* -*- js-indent-level: 8 -*- */
|
||||
/*
|
||||
* L.Control.JSDialogBuilder used for building the native HTML components
|
||||
* from the JSON description provided by the server.
|
||||
*/
|
||||
|
||||
/* global $ */
|
||||
L.Control.JSDialogBuilder = L.Control.extend({
|
||||
|
||||
_controlHandlers: {},
|
||||
|
||||
_setup: function() {
|
||||
this._controlHandlers['radiobutton'] = this._radiobuttonControl;
|
||||
this._controlHandlers['checkbox'] = this._checkboxControl;
|
||||
this._controlHandlers['spinfield'] = this._spinfieldControl;
|
||||
this._controlHandlers['edit'] = this._editControl;
|
||||
this._controlHandlers['pushbutton'] = this._pushbuttonControl;
|
||||
this._controlHandlers['combobox'] = this._comboboxControl;
|
||||
this._controlHandlers['listbox'] = this._comboboxControl;
|
||||
this._controlHandlers['fixedtext'] = this._fixedtextControl;
|
||||
this._controlHandlers['container'] = this._containerHandler;
|
||||
this._controlHandlers['window'] = this._containerHandler;
|
||||
this._controlHandlers['borderwindow'] = this._containerHandler;
|
||||
this._controlHandlers['control'] = this._containerHandler;
|
||||
this._controlHandlers['scrollbar'] = this._ignoreHandler;
|
||||
this._controlHandlers['toolbox'] = this._ignoreHandler;
|
||||
},
|
||||
|
||||
_containerHandler: function() {
|
||||
return true;
|
||||
},
|
||||
|
||||
_ignoreHandler: function() {
|
||||
return false;
|
||||
},
|
||||
|
||||
_radiobuttonControl: function(parentContainer, data) {
|
||||
var radiobutton = L.DomUtil.create('input', '', parentContainer);
|
||||
radiobutton.type = 'radiobutton';
|
||||
radiobutton.value = data.text;
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
_checkboxControl: function(parentContainer, data) {
|
||||
var checkbox = L.DomUtil.createWithId('input', data.id, parentContainer);
|
||||
checkbox.type = 'checkbox';
|
||||
var checkboxLabel = L.DomUtil.create('label', '', parentContainer);
|
||||
checkboxLabel.innerHTML = data.text;
|
||||
checkboxLabel.for = data.id;
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
_spinfieldControl: function(parentContainer, data) {
|
||||
var spinfield = L.DomUtil.create('input', '', parentContainer);
|
||||
spinfield.type = 'number';
|
||||
spinfield.value = data.text;
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
_editControl: function(parentContainer, data) {
|
||||
var edit = L.DomUtil.create('input', '', parentContainer);
|
||||
edit.value = data.text;
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
_pushbuttonControl: function(parentContainer, data) {
|
||||
var pushbutton = L.DomUtil.create('button', '', parentContainer);
|
||||
pushbutton.innerHTML = data.text;
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
_comboboxControl: function(parentContainer, data) {
|
||||
var listbox = L.DomUtil.create('select', '', parentContainer);
|
||||
listbox.value = data.text;
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
_fixedtextControl: function(parentContainer, data) {
|
||||
var fixedtext = L.DomUtil.create('p', '', parentContainer);
|
||||
fixedtext.innerHTML = data.text;
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
build: function(parent, data, currentIsContainer, currentIsVertival, columns) {
|
||||
var currentInsertPlace = parent;
|
||||
var currentHorizontalRow = parent;
|
||||
|
||||
if (currentIsContainer && !currentIsVertival)
|
||||
currentHorizontalRow = L.DomUtil.create('tr', '', parent);
|
||||
|
||||
for (var childIndex in data) {
|
||||
var childData = data[childIndex];
|
||||
var childType = childData.type;
|
||||
var childIsEnabled = childData.enabled;
|
||||
var processChildren = true;
|
||||
|
||||
if (childIsEnabled === false)
|
||||
continue;
|
||||
|
||||
if (currentIsContainer) {
|
||||
var horizontalOverflow = (childIndex > 0 && columns && (childIndex % columns == 0));
|
||||
var newRow = currentIsVertival || horizontalOverflow;
|
||||
if (newRow) {
|
||||
currentHorizontalRow = L.DomUtil.create('tr', '', parent);
|
||||
currentInsertPlace = L.DomUtil.create('td', '', currentHorizontalRow);
|
||||
} else
|
||||
currentInsertPlace = L.DomUtil.create('td', '', currentHorizontalRow);
|
||||
}
|
||||
|
||||
var childIsContainer = (childType == 'container' || childType == 'borderwindow');
|
||||
var childIsVertical = childData.vertical === true;
|
||||
var childColumns = childData.cols;
|
||||
|
||||
var childObject = null;
|
||||
if (childIsContainer && childType != 'borderwindow')
|
||||
childObject = L.DomUtil.create('table', '', currentInsertPlace);
|
||||
else
|
||||
childObject = currentInsertPlace;
|
||||
|
||||
$(childObject).css('border-style', 'solid');
|
||||
$(childObject).css('border-width', '1px');
|
||||
$(childObject).css('border-color', 'black');
|
||||
|
||||
var handler = this._controlHandlers[childType];
|
||||
|
||||
if (handler)
|
||||
processChildren = handler(childObject, childData);
|
||||
else
|
||||
console.warn('Unsupported control type: \"' + childType + '\"');
|
||||
|
||||
if (processChildren && childData.children != undefined)
|
||||
this.build(childObject, childData.children, childIsContainer, childIsVertical, childColumns);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
L.control.jsDialogBuilder = function (options) {
|
||||
var builder = new L.Control.JSDialogBuilder(options);
|
||||
builder._setup();
|
||||
return builder;
|
||||
};
|
|
@ -51,14 +51,16 @@ L.Control.MobileWizard = L.Control.extend({
|
|||
},
|
||||
|
||||
_onMobileWizard: function(data) {
|
||||
if (!this._isActive) {
|
||||
if (data) {
|
||||
this._isActive = true;
|
||||
|
||||
this._showWizard();
|
||||
|
||||
this._hideKeyboard();
|
||||
|
||||
console.log(data);
|
||||
var content = $('#mobile-wizard-content');
|
||||
content.empty();
|
||||
|
||||
L.control.jsDialogBuilder().build(content.get(0), [data]);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue