Commit ad3fb0af authored by damianofalcioni's avatar damianofalcioni

Added Javascript Render UI

parent 4d51a021
......@@ -26,8 +26,11 @@
<script src="js/modules/newCodeEditorUI.js"></script>
<script src="js/modules/newMicroserviceUI.js"></script>
<script src="js/modules/newMicroserviceUI_configUI.js"></script>
<script src="js/modules/newJavascriptRenderUI.js"></script>
<script src="js/modules/newJavascriptRenderUI_configUI.js"></script>
<script src="js/widgets/MicroserviceUI_manifest.js"></script>
<script src="js/widgets/JavascriptRenderUI_manifest.js"></script>
<script src="js/main.js"></script>
</body>
......
......@@ -16,6 +16,7 @@
var widget = OliveUI.modules.newWidgetUI({
initialView: 'render',
widgetTitle: widgetName,
removeBtnClickFn: function () {
widgetRootDiv.remove();
delete _state.widgetInstances[uuid];
......
......@@ -10,6 +10,7 @@
var widget1 = oliveUI.createWidgetInstance('Microservice UI');
var widget2 = oliveUI.createWidgetInstance('Microservice UI');
var widget3 = oliveUI.createWidgetInstance('Javascript Render UI');
oliveUI.setWidgetInstanceConfiguration(widget1, {
microserviceInputs: {
......@@ -31,4 +32,10 @@
serviceName: 'Test 2'
});
oliveUI.setWidgetInstanceConfiguration(widget3, {
javascriptAlg: `return $('<button>Test</button>').click(function () {
alert('Test button clicked');
});`
});
}(OliveUI));
(function (OliveUI, Utils) {
'use strict';
var _statics = {
init: {
loadJavascriptContent: function (_dom, content) {
var alg = content.javascriptAlg;
try {
var algF = new Function(alg + '\n//# sourceURL=' + Utils.generateUUID() + '.js');
var domOut = algF();
_dom.outputDiv.empty().append(domOut);
} catch (e) {
Utils.showError(e, _dom.messageDiv);
}
}
}
};
var _newJavascriptRenderUI = function (config = {}) {
var _dom = {
messageDiv: $('<div>'),
outputDiv: $('<div>')
};
return {
render: function () {
return $('<div>').append(
_dom.messageDiv,
_dom.outputDiv);
},
setContent: function (content = {}) {
content.javascriptAlg = content.javascriptAlg || '';
_statics.init.loadJavascriptContent(_dom, content);
}
};
};
OliveUI.modules.newJavascriptRenderUI = _newJavascriptRenderUI;
}(OliveUI, OliveUI.utils));
(function (OliveUI, newCodeEditorUI) {
'use strict';
var _newJavascriptRenderUI_configUI = function (config = {}) {
var _dom = {
rootNode: $('<div>')
};
var _sub = {
codeEditor: newCodeEditorUI({})
};
return {
getContent: function () {
return {
javascriptAlg: _sub.codeEditor.getContent()
};
},
setContent: function (content = {}) {
_sub.codeEditor.setContent(content.javascriptAlg || '/*Javascript algoritm that "return" a DOM object.*/\n');
},
render: function () {
return _dom.rootNode.empty().append(
_sub.codeEditor.render()
);
},
refresh: function () {
_sub.codeEditor.refresh();
}
};
};
OliveUI.modules.newJavascriptRenderUI_configUI = _newJavascriptRenderUI_configUI;
}(OliveUI, OliveUI.modules.newCodeEditorUI));
......@@ -22,7 +22,7 @@
alg = 'return $("<pre>").append($("<code>").append(JSON.stringify(output, null, 2)));';
}
try {
var algF = new Function('output', alg + '\n//# sourceURL=microservice_custom_alg.js');
var algF = new Function('output', alg + '\n//# sourceURL=' + Utils.generateUUID() + '.js');
var domOut = algF(data);
_dom.outputDiv.empty().append(domOut);
} catch (e) {
......
......@@ -50,6 +50,7 @@
_dom.deleteBtn.toggle(config.removeBtnClickFn ? config.deleteBtnVisible : false);
},
initWidget: function (_dom, config, _state) {
_dom.panelTitle.html(config.widgetTitle);
_statics.init.initButtonsVisibility(_dom, config);
_dom.renderModuleDom.hide();
_dom.configModuleDom.hide();
......@@ -98,6 +99,7 @@
var _newWidgetUI = function (config = {}) {
config.initialView = config.initialView || 'render'; //render or config
config.widgetTitle = config.widgetTitle || '';
config.removeBtnClickFn = config.removeBtnClickFn || null;
config.refreshBtnVisible = config.refreshBtnVisible != null ? config.refreshBtnVisible : true;
config.settingBtnVisible = config.settingBtnVisible != null ? config.settingBtnVisible : true;
......
(function (OliveUI, newJavascriptRenderUI, newJavascriptRenderUI_configUI) {
'use strict';
OliveUI.addWidgetManifest({
name: 'Javascript Render UI',
description: '',
createUIFn: function () {
return newJavascriptRenderUI({});
},
createConfigurationUIFn: function () {
return newJavascriptRenderUI_configUI({});
}
});
}(OliveUI, OliveUI.modules.newJavascriptRenderUI, OliveUI.modules.newJavascriptRenderUI_configUI));
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment