14 let r = 0, g = 0, b = 0;
16 if (hex.length === 4) {
17 r = parseInt(hex[1] + hex[1], 16);
18 g = parseInt(hex[2] + hex[2], 16);
19 b = parseInt(hex[3] + hex[3], 16);
22 else if (hex.length === 7) {
23 r = parseInt(hex[1] + hex[2], 16);
24 g = parseInt(hex[3] + hex[4], 16);
25 b = parseInt(hex[5] + hex[6], 16);
42 createRow(data, index, auto_assign_default =
true) {
46 let boxStyle =
"width: 100%; font-size: 12px; border:solid thin lightskyblue; background-color: #000000"
49 let row = document.createElement(
"div");
50 row.classList.add(
"row",
"row_hover",
"pb-2",
"pt-2",
'g-1');
53 let nameCol = document.createElement(
"div");
54 nameCol.classList.add(
"col-sm-2",
"text-start");
55 let nameLabel = document.createElement(
"label");
56 nameLabel.textContent = data.name;
57 nameLabel.classList.add(
"form-label");
58 nameCol.appendChild(nameLabel);
59 row.appendChild(nameCol);
62 let typeCol = document.createElement(
"div");
63 typeCol.classList.add(
"col-sm-2");
64 let typeLabel = document.createElement(
"label");
65 typeLabel.textContent = data.type;
66 typeLabel.classList.add(
"form-label");
67 typeCol.setAttribute(
"data-type", data.type);
68 typeCol.appendChild(typeLabel);
69 row.appendChild(typeCol);
72 let uinameCol = document.createElement(
"div");
73 uinameCol.classList.add(
"col-sm");
74 let uinameInput = document.createElement(
"input");
75 uinameInput.type =
"text";
76 uinameInput.style = boxStyle;
77 uinameInput.classList.add(
"form-control",
"form-control-sm");
78 uinameInput.value = data.uiname ||
"";
79 uinameInput.setAttribute(
"data-ui-name",
"true");
80 uinameCol.appendChild(uinameInput);
81 row.appendChild(uinameCol);
84 let uifolderCol = document.createElement(
"div");
85 uifolderCol.classList.add(
"col-sm");
86 let uifolderInput = document.createElement(
"input");
87 uifolderInput.type =
"text";
88 uifolderInput.style = boxStyle;
89 uifolderInput.classList.add(
"form-control",
"form-control-sm");
90 uifolderInput.value = data.uifolder ||
""
91 uifolderInput.setAttribute(
"data-ui-group",
"true");
92 uifolderCol.appendChild(uifolderInput);
93 row.appendChild(uifolderCol);
97 let ui_items = [data.uimin, data.uimax, data.uistep, data.uisoftmin, data.uisoftmax];
98 let ui_item_ids = [
'data-ui-min',
'data-ui-max',
'data-ui-step',
'data-ui-softmin',
'data-ui-softmax'];
100 for (let u = 0; u < 5; u++) {
103 let inputCol = document.createElement(
"div");
104 inputCol.classList.add(
"col-sm");
106 let ui_item = ui_items[u];
107 let ui_item_id = ui_item_ids[u];
109 if (u == 1 || u == 4) {
110 if (data.type ===
'integer')
116 if (data.type ===
'integer')
122 if (data.type ===
"float" || data.type ==
"integer") {
124 let input = document.createElement(
"input");
125 input.setAttribute(ui_item_id,
"true");
126 input.type =
"number";
127 input.style = boxStyle;
128 input.classList.add(
"form-control",
"form-control-sm");
129 if (ui_item != undefined)
130 input.value = ui_item
132 input.value = (auto_assign_default ? ui_default :
null);
133 inputCol.appendChild(input);
135 else if (data.type ===
"vector2" || data.type ==
"vector3" || data.type ==
"vector4") {
137 if (data.type ===
"vector2") {
140 else if (data.type ===
"vector3") {
143 else if (data.type ===
"vector4") {
148 let container = document.createElement(
"div");
149 container.classList.add(
"container",
"p-2",
"rounded-2");
151 container.style.border =
"1px solid #f0f0f0";
153 for (let i = 0; i < count; i++) {
155 let input = document.createElement(
"input");
156 input.type =
"number";
157 input.style = boxStyle;
158 input.classList.add(
"form-control",
"form-control-sm",
"me-2",
"mb-2");
159 if (ui_item && ui_item[i] != undefined)
162 input.value = ui_item[i]
167 input.value = (auto_assign_default ? ui_default :
null);
169 input.setAttribute(ui_item_id,
"true");
171 container.appendChild(input);
173 inputCol.appendChild(container);
175 row.appendChild(inputCol);
185 const inputContainer = document.getElementById(
"input-container");
189 this.sortable.destroy();
190 this.sortable =
null;
194 inputContainer.innerHTML =
"";
196 sampleData.forEach((data, index) => {
197 let row = this.
createRow(data, index, auto_assign_default);
198 inputContainer.appendChild(row);
202 this.sortable =
new Sortable(inputContainer, {
204 ghostClass:
"sortable-ghost",
205 chosenClass:
"sortable-ghost"
215 const rows = document.querySelectorAll(
"#input-container .row");
216 const extractedData = [];
218 rows.forEach(row => {
219 const name = row.querySelector(
"label").textContent;
220 const uiname = row.querySelector(
"input[data-ui-name]").value;
221 const uifolder = row.querySelector(
"input[data-ui-group]").value;
222 const type = row.querySelector(
"[data-type]").textContent;
227 let uisoftmin =
null;
228 let uisoftmax =
null;
229 if (type ===
"integer" || type ===
"float" || type ===
"vector2" || type ===
"vector3" || type ==
"vector4") {
230 let inputs = row.querySelectorAll(
"input[data-ui-min]");
231 uimin = Array.from(inputs).map(input => input.value && input.value !==
'' ? parseFloat(input.value) :
null);
232 if (uimin.some(value => value ===
null)) {
237 inputs = row.querySelectorAll(
"input[data-ui-max]");
238 uimax = Array.from(inputs).map(input => input.value && input.value !==
'' ? parseFloat(input.value) :
null);
239 if (uimax.some(value => value ===
null)) {
243 inputs = row.querySelectorAll(
"input[data-ui-step]");
244 uistep = Array.from(inputs).map(input => input.value && input.value !==
'' ? parseFloat(input.value) :
null);
245 if (uistep.some(value => value ===
null)) {
249 inputs = row.querySelectorAll(
"input[data-ui-softmin]");
250 uisoftmin = Array.from(inputs).map(input => input.value && input.value !==
'' ? parseFloat(input.value) :
null);
251 if (uisoftmin.some(value => value ===
null)) {
255 inputs = row.querySelectorAll(
"input[data-ui-softmax]");
256 uisoftmax = Array.from(inputs).map(input => input.value && input.value !==
'' ? parseFloat(input.value) :
null);
257 if (uisoftmax.some(value => value ===
null)) {
261 extractedData.push({ name, type, uiname, uifolder, uimin, uimax, uistep, uisoftmin, uisoftmax });
264 return extractedData;