iot-backend/software/flow/node_modules/node-red-dashboard/nodes/ui_group.html

88 lines
3.7 KiB
HTML
Raw Normal View History

2023-02-22 17:26:41 +01:00
<script type="text/javascript">
// convert to i18 text
function c_ui_group(x) {
return RED._("node-red-dashboard/ui_group:ui_group."+x);
}
RED.nodes.registerType('ui_group',{
category: 'config',
defaults: {
name: {value: c_ui_group("label.default")},
tab: {type:"ui_tab", required: true },
order: {value: 0},
disp: {value: true},
width: {value: 6},
collapse: {value: false},
disabled: {value: false},
hidden: {value: false},
className: {value: ''},
},
sort: function(A,B) {
if (A.tab !== B.tab) {
var tabA = RED.nodes.node(A.tab);
var tabB = RED.nodes.node(B.tab);
if (!tabA && tabB) {
return -1;
}
else if (tabA && !tabB) {
return 1;
}
else {
return tabA.order - tabB.order;
}
}
return A.order - B.order;
},
paletteLabel: 'dashboard group',
label: function() {
var tabNode = RED.nodes.node(this.tab);
if (tabNode) {
return "["+(tabNode.name||c_ui_group("label.tab"))+"] " + (this.name || c_ui_group("label.group"));
}
return "["+c_ui_group("label.unassigned")+"] " + (this.name || c_ui_group("label.group"));
},
labelStyle: function() { return this.name?"node_label_italic":""; },
oneditprepare: function() {
$("#node-input-size").elementSizer({
width: "#node-config-input-width",
auto: false
});
$("#node-config-input-disp").on("change", function() {
if ($("#node-config-input-disp").is(":checked")) {
$("#group-collapse-flag").show();
}
else {
$("#group-collapse-flag").hide();
$("#node-config-input-collapse").prop("checked",false);
}
});
}
});
</script>
<script type="text/html" data-template-name="ui_group">
<div class="form-row">
<label for="node-config-input-name"><i class="fa fa-tag"></i> <span data-i18n="ui_group.label.name"></span></label>
<input type="text" id="node-config-input-name">
</div>
<div class="form-row">
<label for="node-config-input-tab"><i class="fa fa-table"></i> <span data-i18n="ui_group.label.tab"></span></label>
<input type="text" id="node-config-input-tab">
</div>
<div class="form-row">
<label for="node-config-input-className"><i class="fa fa-code"></i> <span data-i18n="ui_group.label.className"></label>
<input type="text" id="node-config-input-className" data-i18n="[placeholder]ui_group.label.classNamePlaceholder"/>
</div>
<div class="form-row">
<label for="node-config-input-width"><i class="fa fa-arrows-h"></i> <span data-i18n="ui_group.label.width"></span></label>
<input type="hidden" id="node-config-input-width">
<button class="editor-button" id="node-input-size"></button>
</div>
<div class="form-row">
<input style="margin:8px 0 10px 102px; width:20px;" type="checkbox" checked id="node-config-input-disp"> <label style="width:auto" for="node-config-input-disp"><span data-i18n="ui_group.display-name"></span></label>
</div>
<div class="form-row" id="group-collapse-flag">
<input style="margin:8px 0 10px 102px; width:20px;" type="checkbox" id="node-config-input-collapse"> <label style="width:auto" for="node-config-input-collapse"><span data-i18n="ui_group.collapse-name"></span></label>
</div>
</script>