diff --git a/front-end/server.py b/front-end/server.py index 910e52dc..b8d89ef2 100644 --- a/front-end/server.py +++ b/front-end/server.py @@ -87,6 +87,7 @@ def get_files(): "Success": True, "Msg": None, "FileList": file_list, + "Path": path_dir, "Python": None }) except Exception as err: diff --git a/front-end/source/kernel/dashboard/plugins/annotation-scoring/plugin-annotation-widgets.js b/front-end/source/kernel/dashboard/plugins/annotation-scoring/plugin-annotation-widgets.js index 6baf74bc..c7ffe738 100644 --- a/front-end/source/kernel/dashboard/plugins/annotation-scoring/plugin-annotation-widgets.js +++ b/front-end/source/kernel/dashboard/plugins/annotation-scoring/plugin-annotation-widgets.js @@ -60,6 +60,7 @@ modelsParameters.annotationLabel = { "valueFontFamily": "var(--widget-font-family)", "textAlign": "left", "displayBorder": false, + "borderColor": "var(--widget-border-color)", "centerVertically": true }; modelsParameters.annotationImage = { @@ -255,13 +256,13 @@ function annotationWidgetsPluginClass() { ' height: inherit; white-space: pre-wrap' + '; color:' + modelsParameters[idInstance].textColor + '; text-align: ' + modelsParameters[idInstance].textAlign + + '; background-color: ' + modelsParameters[idInstance].backgroundColor + '; padding: 4px; resize: inherit; margin: auto; vertical-align: middle ; border-radius: 6px; ' + this.fontSize() + this.valueFontFamily() + this.border() + 'display: ' + displayDiv2 + '" readonly>' + text + ''; widgetHtml.innerHTML = divContent; - widgetHtml.setAttribute("style", "width: inherit; height: inherit; display: " + displayDiv1 + "; " + - "justify-content: center; background-color:" + modelsParameters[idInstance].backgroundColor); + widgetHtml.setAttribute("style", "width: inherit; height: inherit; display: " + displayDiv1 + "; justify-content: center;"); $("#" + idDivContainer).html(widgetHtml); }; diff --git a/front-end/source/kernel/dashboard/plugins/basic/plugin-flat-ui-boolean-widgets.js b/front-end/source/kernel/dashboard/plugins/basic/plugin-flat-ui-boolean-widgets.js index b4ca69bb..055735da 100644 --- a/front-end/source/kernel/dashboard/plugins/basic/plugin-flat-ui-boolean-widgets.js +++ b/front-end/source/kernel/dashboard/plugins/basic/plugin-flat-ui-boolean-widgets.js @@ -26,7 +26,8 @@ modelsParameters.flatUiCheckbox = { "labelColor": "var(--widget-label-color)", "labelFontFamily": "var(--widget-font-family)", "checkboxSize": 1, - "checkboxColor": "var(--widget-input-checked-color)" + "checkedColor": "var(--widget-input-checked-color)", + "uncheckedColor": "var(--widget-input-unchecked-color)" }; modelsParameters.flatUiSwitch = { "label": "labelText", @@ -74,16 +75,9 @@ function flatUiBooleanWidgetsPluginClass() { this.render(); }; - this.backwardCompatibility = function () { - if (_.isUndefined(modelsParameters[idInstance]["checkboxSize"])) { - modelsParameters[idInstance]["checkboxSize"] = 1; - } - if (_.isUndefined(modelsParameters[idInstance]["checkboxColor"])) { - modelsParameters[idInstance]["checkboxColor"] = "#447bdc"; - } - } - this.backwardCompatibility(); + + this.render = function () { //AEF @@ -95,6 +89,12 @@ function flatUiBooleanWidgetsPluginClass() { if (!_.isNull($(".icons").width())) { checkboxWidth = $(".icons").width(); } + + // backward compatibility + if (_.isUndefined(modelsParameters[idInstance].checkboxSize)) { + modelsParameters[idInstance].checkboxSize = 1; + } + var padding = modelsParameters[idInstance].checkboxSize * checkboxWidth + 12; var lineHeight = modelsParameters[idInstance].checkboxSize * checkboxHeight; // @@ -135,20 +135,6 @@ function flatUiBooleanWidgetsPluginClass() { $('[data-toggle="checkbox"]').radiocheck(); $('[data-toggle="radio"]').radiocheck(); - //AEF - if ($(".icons").length >= 1) { - for (let i = 0; i < $(".icons").length; i++) { - if ($(".icons")[i].parentNode.id == "label" + idWidget) { - $(".icons")[i].style.zoom = modelsParameters[idInstance].checkboxSize; - $(".icons")[i].style.color = modelsParameters[idInstance].checkboxColor; - //for (let j = 0; j < $(".icons")[i].childNodes.length; j++) { - // if ($(".icons")[i].childNodes[j].className == "icon-checked") { - // $(".icons")[i].childNodes[j].style.color = modelsParameters[idInstance].checkboxColor; - // } - // } - } - } - } // if (modelsHiddenParams[idInstance].value == true) { $("#checkbox" + idWidget).radiocheck('check'); @@ -156,6 +142,10 @@ function flatUiBooleanWidgetsPluginClass() { $("#checkbox" + idWidget).radiocheck('uncheck'); } + document.styleSheets[0].addRule('#label' + idWidget + ' .icons *' , 'zoom: ' + modelsParameters[idInstance].checkboxSize); + document.styleSheets[0].addRule('#label' + idWidget + ' .icons .icon-checked' , this.checkedColor()); + document.styleSheets[0].addRule('#label' + idWidget + ' .icons .icon-unchecked' , this.uncheckedColor()); + if (this.bIsInteractive) { self.enable(); } else { diff --git a/front-end/source/kernel/dashboard/plugins/basic/plugin-load-file-widgets.js b/front-end/source/kernel/dashboard/plugins/basic/plugin-load-file-widgets.js index 4608abd5..6b7b36f2 100644 --- a/front-end/source/kernel/dashboard/plugins/basic/plugin-load-file-widgets.js +++ b/front-end/source/kernel/dashboard/plugins/basic/plugin-load-file-widgets.js @@ -4,7 +4,7 @@ // │ Copyright © 2022-2023 IFPEN │ \\ // | Licensed under the Apache License, Version 2.0 │ \\ // ├──────────────────────────────────────────────────────────────────────────────┤ \\ -// │ Original authors(s): Ghiles HIDEUR, Tristan BARTEMENT, Guillaume CORBELIN │ \\ │ \\ +// │ Original authors(s): Ghiles HIDEUR, Tristan BARTEMENT, Guillaume CORBELIN │ \\ // └──────────────────────────────────────────────────────────────────────────────┘ \\ /*******************************************************************/ diff --git a/front-end/source/kernel/dashboard/plugins/gauges/plugin-led-light.js b/front-end/source/kernel/dashboard/plugins/gauges/plugin-led-light.js index e6e09e12..88fe98af 100644 --- a/front-end/source/kernel/dashboard/plugins/gauges/plugin-led-light.js +++ b/front-end/source/kernel/dashboard/plugins/gauges/plugin-led-light.js @@ -132,17 +132,19 @@ function ledWidgetsPluginClass() { this.insertLabel = function (widgetHtml) { // conversion to enable HTML tags const labelText = this.getTransformedText("label"); - const widgetLabel = document.createElement('span'); - widgetLabel.setAttribute('class', 'led-span'); - widgetLabel.setAttribute('id', 'led-span' + idWidget); + const widgetLabel = $('', { + class: 'led-span', + id: 'led-span' + idWidget, + html: labelText + }); + let labelStyle = "height: inherit; " + this.labelFontSize() + this.labelColor() + this.labelFontFamily(); if (!_.isUndefined(modelsParameters[idInstance].labelWidthProportion)) { - widgetLabel.setAttribute('style', 'height: inherit; width:' + modelsParameters[idInstance].labelWidthProportion + - ';' + this.labelFontSize()); + labelStyle += modelsParameters[idInstance].labelWidthProportion + "; "; } else { - widgetLabel.setAttribute('style', 'height: inherit; width: 20%; ' + this.labelFontSize() + this.labelColor() + this.labelFontFamily()); + labelStyle += " width: 20%; "; } - widgetLabel.innerHTML = labelText; - widgetHtml.appendChild(widgetLabel); + widgetLabel.attr('style', labelStyle); + widgetHtml.append(widgetLabel[0]); }; this.rescale = function () { diff --git a/front-end/source/kernel/dashboard/plugins/geo-time/plugin-flat-ui-address-completion.js b/front-end/source/kernel/dashboard/plugins/geo-time/plugin-flat-ui-address-completion.js index a8733c24..c62bb967 100644 --- a/front-end/source/kernel/dashboard/plugins/geo-time/plugin-flat-ui-address-completion.js +++ b/front-end/source/kernel/dashboard/plugins/geo-time/plugin-flat-ui-address-completion.js @@ -64,7 +64,7 @@ function flatUiAddressCompletionWidgetsPluginClass() { }; this.enable = function () { - //$("#ac-value" + idWidget).prop("disabled", false); + $("#ac-value" + idWidget).prop("disabled", false); $("#ac-value" + idWidget).bind('typeahead:selected', function (e, val, name) { modelsHiddenParams[idInstance].value = val.word; self.value.updateCallback(self.value, val.word); @@ -86,7 +86,7 @@ function flatUiAddressCompletionWidgetsPluginClass() { }; this.disable = function () { - //$("#ac-value" + idWidget).prop("disabled", true); + $("#ac-value" + idWidget).prop("disabled", true); }; this.formatHereSuggestTable = function (data) { @@ -175,39 +175,37 @@ function flatUiAddressCompletionWidgetsPluginClass() { }; this.render = function () { - var valueHeightPx = Math.min($('#' + idDivContainer).height(), $('#' + idDivContainer).width() / 2); // keepRatio - var widgetHtml = document.createElement('div'); + let valueHeightPx = Math.min($('#' + idDivContainer).height(), $('#' + idDivContainer).width() / 2); // keepRatio + const widgetHtml = document.createElement('div'); widgetHtml.setAttribute('id', 'ac-value-widget-html' + idWidget); widgetHtml.setAttribute('class', 'ac-value-widget-html'); - var divContent = ''; - let widthStyle = ""; + let divContent = ''; if (modelsParameters[idInstance].label != "" && modelsParameters[idInstance].displayLabel) { + let widthStyle = ""; valueHeightPx = Math.min($('#' + idDivContainer).height(), $('#' + idDivContainer).width() / 4); // keepRatio if (!_.isUndefined(modelsParameters[idInstance].valueWidthProportion)) { - var proportion = Math.max(0, 100 - parseFloat(modelsParameters[idInstance].valueWidthProportion)) + "%"; - widthStyle = "width: " + proportion + '; '; + const proportion = Math.max(0, 100 - parseFloat(modelsParameters[idInstance].valueWidthProportion)) + "%"; + widthStyle = "width: " + proportion + "; "; } else { widthStyle = "max-width: 45%; "; } - } - - // conversion to enable HTML tags - const label = this.getTransformedText("label"); - divContent = '' + - label + ''; + // conversion to enable HTML tags + const label = this.getTransformedText("label"); + divContent += '' + label + ''; + } - var border = this.border(); + const border = this.border(); - divContent = divContent + '
'; - divContent = divContent + ''; + divContent += ''; - divContent = divContent + ''; - divContent = divContent + '
'; + divContent += ''; + divContent += ''; widgetHtml.innerHTML = divContent; diff --git a/front-end/source/kernel/dashboard/plugins/widget-base.js b/front-end/source/kernel/dashboard/plugins/widget-base.js index 2515ceae..1c2e0105 100644 --- a/front-end/source/kernel/dashboard/plugins/widget-base.js +++ b/front-end/source/kernel/dashboard/plugins/widget-base.js @@ -27,18 +27,25 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { } // Helper function to set the color value from the modelParameters (for backward compatibility) - this.setColorValueFromModelParameters = function (value, defaultValue) { - const paramValue = modelsParameters[idInstance][value]; - + this.setColorValueFromModelParameters = function (prop, defaultValue) { + let colorValue = defaultValue; + if (_.isUndefined(modelsParameters[idInstance][prop])) { + modelsParameters[idInstance][prop] = defaultValue; + } else { + colorValue = modelsParameters[idInstance][prop]; + } // TODO theme backwards compatibility // if (!paramValue || paramValue.startsWith("#")) { // modelsParameters[idInstance][value] = defaultValue; // return defaultValue; // } - - return paramValue; + const colorHex = this.getColorValueFromCSSProperty(colorValue); + return colorHex; } + // +--------------------------------------------------------------------¦ \\ + // | Global functions | \\ + // +--------------------------------------------------------------------¦ \\ this.labelFontSize = function () { const fs = 'font-size: calc(7px + ' + modelsParameters[idInstance].labelFontSize * getFontFactor() + @@ -53,7 +60,6 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { return fs; }; - this.valueFormat = function (val) { const decDigits = parseInt(modelsParameters[idInstance].decimalDigits, 10); @@ -116,7 +122,7 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { let border = 'border: none; '; if (modelsParameters[idInstance].displayBorder) { const borderColor = this.setColorValueFromModelParameters("borderColor", "var(--widget-border-color)"); - border = ' border: 2px solid ' + borderColor + '; '; + border = 'border: 2px solid ' + borderColor + '; '; } else { border += + '-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0);'; border += '-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0);'; @@ -140,10 +146,8 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { this.backgroundColor = function () { // Backward compatibility - if (_.isUndefined(modelsParameters[idInstance].backgroundColor)) { - modelsParameters[idInstance].backgroundColor = "#ffffff"; - } - const bc = 'background-color:' + modelsParameters[idInstance].backgroundColor + "; "; + const color = this.setColorValueFromModelParameters("backgroundColor", "#ffffff"); + const bc = 'background-color:' + color + "; "; return bc; } @@ -297,7 +301,7 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { // +--------------------------------------------------------------------¦ \\ this.graphColor = function () { const color = this.setColorValueFromModelParameters("graphColor", "var(--widget-label-color)"); - return this.getColorValueFromCSSProperty(color); + return color; }; this.subLabelFontFamily = function () { @@ -321,6 +325,24 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { return fs; }; + // +--------------------------------------------------------------------¦ \\ + // | Checkbox widget | \\ + // +--------------------------------------------------------------------¦ \\ + this.checkedColor = function () { + if (!_.isUndefined(modelsParameters[idInstance].checkboxColor)) { + delete modelsParameters[idInstance].checkboxColor; + } + const color = this.setColorValueFromModelParameters("checkedColor", "var(--widget-input-checked-color)"); + const fc = 'color: ' + color + "; "; + return fc; + } + + this.uncheckedColor = function () { + const color = this.setColorValueFromModelParameters("uncheckedColor", "var(--widget-input-unchecked-color)"); + const fc = 'color: ' + color + "; "; + return fc; + } + // +--------------------------------------------------------------------¦ \\ // | Switch widget | \\ // +--------------------------------------------------------------------¦ \\ @@ -618,13 +640,13 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { // +--------------------------------------------------------------------¦ \\ this.thicknessBackgroundColor = function () { const color = this.setColorValueFromModelParameters("thicknessBackgroundColor", "var(--widget-segment-color)"); - const bc = ' background-color="' + this.getColorValueFromCSSProperty(color) + '" '; + const bc = ' background-color="' + color + '" '; return bc; }; this.thicknessColor = function () { const color = this.setColorValueFromModelParameters("thicknessColor", "var(--widget-range-color)"); - const bc = ' foreground-color="' + this.getColorValueFromCSSProperty(color) + '" '; + const bc = ' foreground-color="' + color + '" '; return bc; }; @@ -633,14 +655,12 @@ function baseWidget(idDivContainer, idWidget, idInstance, bInteractive) { // +--------------------------------------------------------------------¦ \\ this.tipBackgroundColor = function () { const color = this.setColorValueFromModelParameters("tipBackgroundColor", "var(--widget-button-color)"); - const bc = this.getColorValueFromCSSProperty(color); - return bc; + return color; }; this.tipBorderColor = function () { const color = this.setColorValueFromModelParameters("tipBorderColor", "var(--widget-button-text)"); - const bc = this.getColorValueFromCSSProperty(color); - return bc; + return color; }; } diff --git a/front-end/source/kernel/datanodes/base/DatanodeModel.js b/front-end/source/kernel/datanodes/base/DatanodeModel.js index 95817271..30eb72e7 100644 --- a/front-end/source/kernel/datanodes/base/DatanodeModel.js +++ b/front-end/source/kernel/datanodes/base/DatanodeModel.js @@ -259,7 +259,12 @@ DatanodeModel = function ( self.settings(object.settings); self.name(object.name); self.type(object.type); - const iconName = 'icn-' + datanodePlugins[object.type].icon_type.replace(/\.[^/.]+$/, ''); + let iconName = 'icn-'; + if (_.isUndefined(datanodePlugins[object.type])) { + iconName += 'json-variable'; + } else { + iconName += datanodePlugins[object.type].icon_type.replace(/\.[^/.]+$/, ''); + } self.iconType(iconName); if (self.error()) //ABK