Revision 544c6df3
Added by koszko about 2 years ago
| html/options_main.js | ||
|---|---|---|
| 32 | 32 |
chbx_component_li_template.removeAttribute("id");
|
| 33 | 33 |
radio_component_li_template.removeAttribute("id");
|
| 34 | 34 |
|
| 35 |
function list_set_scrollbar(list_elem) |
|
| 36 |
{
|
|
| 37 |
const op = ((list_elem.children.length === 1 && |
|
| 38 |
list_elem.children[0].classList.contains("hide")) ||
|
|
| 39 |
list_elem.children.length < 1) ? "remove" : "add"; |
|
| 40 |
list_elem.parentElement.parentElement.classList[op]("always_scrollbar");
|
|
| 41 |
} |
|
| 42 |
|
|
| 35 | 43 |
function item_li_id(prefix, item) |
| 36 | 44 |
{
|
| 37 | 45 |
return `li_${prefix}_${item}`;
|
| ... | ... | |
| 66 | 74 |
continue; |
| 67 | 75 |
|
| 68 | 76 |
ul.ul.insertBefore(li, element); |
| 69 |
return;
|
|
| 77 |
break;
|
|
| 70 | 78 |
} |
| 71 | 79 |
} |
| 80 |
if (!li.parentElement) |
|
| 81 |
ul.ul.appendChild(li); |
|
| 72 | 82 |
|
| 73 |
ul.ul.appendChild(li);
|
|
| 83 |
list_set_scrollbar(ul.ul);
|
|
| 74 | 84 |
} |
| 75 | 85 |
|
| 76 | 86 |
const chbx_components_ul = by_id("chbx_components_ul");
|
| ... | ... | |
| 98 | 108 |
li.setAttribute("data-prefix", prefix);
|
| 99 | 109 |
li.setAttribute("data-name", name);
|
| 100 | 110 |
|
| 101 |
let chbx = li.firstElementChild; |
|
| 111 |
let chbx = li.firstElementChild.firstElementChild;
|
|
| 102 | 112 |
let span = chbx.nextElementSibling; |
| 103 | 113 |
|
| 104 | 114 |
span.textContent = nice_name(prefix, name); |
| 105 | 115 |
|
| 106 | 116 |
chbx_components_ul.appendChild(li); |
| 117 |
list_set_scrollbar(chbx_components_ul); |
|
| 107 | 118 |
} |
| 108 | 119 |
|
| 109 | 120 |
var radio_component_none_li = by_id("radio_component_none_li");
|
| ... | ... | |
| 118 | 129 |
li.setAttribute("data-prefix", prefix);
|
| 119 | 130 |
li.setAttribute("data-name", name);
|
| 120 | 131 |
|
| 121 |
let radio = li.firstElementChild; |
|
| 132 |
let radio = li.firstElementChild.firstElementChild;
|
|
| 122 | 133 |
let span = radio.nextElementSibling; |
| 123 | 134 |
|
| 124 | 135 |
span.textContent = nice_name(prefix, name); |
| 125 | 136 |
|
| 126 |
radio_components_ul.insertBefore(li, radio_component_none_li); |
|
| 137 |
radio_component_none_li.before(li); |
|
| 138 |
list_set_scrollbar(radio_components_ul); |
|
| 127 | 139 |
} |
| 128 | 140 |
|
| 129 | 141 |
/* Used to reset edited repo. */ |
| ... | ... | |
| 191 | 203 |
const empty_bag_component_li = by_id("empty_bag_component_li");
|
| 192 | 204 |
var bag_components_ul = by_id("bag_components_ul");
|
| 193 | 205 |
|
| 206 |
function remove_bag_component_entry(entry) |
|
| 207 |
{
|
|
| 208 |
const list = entry.parentElement; |
|
| 209 |
entry.remove(); |
|
| 210 |
list_set_scrollbar(list); |
|
| 211 |
} |
|
| 212 |
|
|
| 194 | 213 |
/* Used to construct and update components list of edited bag. */ |
| 195 | 214 |
function add_bag_components(components) |
| 196 | 215 |
{
|
| ... | ... | |
| 199 | 218 |
let li = bag_component_li_template.cloneNode(true); |
| 200 | 219 |
li.setAttribute("data-prefix", prefix);
|
| 201 | 220 |
li.setAttribute("data-name", name);
|
| 221 |
|
|
| 202 | 222 |
let span = li.firstElementChild; |
| 203 | 223 |
span.textContent = nice_name(prefix, name); |
| 204 | 224 |
let remove_but = span.nextElementSibling; |
| 205 |
remove_but.addEventListener("click", () =>
|
|
| 206 |
bag_components_ul.removeChild(li));
|
|
| 225 |
remove_but.addEventListener("click",
|
|
| 226 |
() => remove_bag_component_entry(li));
|
|
| 207 | 227 |
bag_components_ul.appendChild(li); |
| 208 | 228 |
} |
| 209 | 229 |
|
| 210 | 230 |
bag_components_ul.appendChild(empty_bag_component_li); |
| 231 |
list_set_scrollbar(bag_components_ul); |
|
| 211 | 232 |
} |
| 212 | 233 |
|
| 213 | 234 |
/* Used to reset edited bag. */ |
| ... | ... | |
| 219 | 240 |
let old_components_ul = bag_components_ul; |
| 220 | 241 |
bag_components_ul = old_components_ul.cloneNode(false); |
| 221 | 242 |
|
| 222 |
ul.work_li.insertBefore(bag_components_ul, old_components_ul); |
|
| 223 |
ul.work_li.removeChild(old_components_ul); |
|
| 243 |
old_components_ul.replaceWith(bag_components_ul); |
|
| 224 | 244 |
|
| 225 | 245 |
add_bag_components(components); |
| 226 | 246 |
} |
| ... | ... | |
| 228 | 248 |
/* Used to get edited bag data for saving. */ |
| 229 | 249 |
function work_bag_li_data(ul) |
| 230 | 250 |
{
|
| 231 |
let components_ul = ul.work_name_input.nextElementSibling; |
|
| 232 |
let component_li = components_ul.firstElementChild; |
|
| 251 |
let component_li = bag_components_ul.firstElementChild; |
|
| 233 | 252 |
|
| 234 | 253 |
let components = []; |
| 235 | 254 |
|
| ... | ... | |
| 285 | 304 |
} |
| 286 | 305 |
|
| 287 | 306 |
ul.work_li.classList.add("hide");
|
| 307 |
ul.ul.append(ul.work_li); |
|
| 308 |
list_set_scrollbar(ul.ul); |
|
| 288 | 309 |
ul.state = UL_STATE.IDLE; |
| 289 | 310 |
} |
| 290 | 311 |
|
| ... | ... | |
| 323 | 344 |
ul.ul.insertBefore(ul.work_li, li); |
| 324 | 345 |
ul.ul.removeChild(li); |
| 325 | 346 |
ul.work_li.classList.remove("hide");
|
| 347 |
list_set_scrollbar(ul.ul); |
|
| 326 | 348 |
|
| 327 | 349 |
ul.state = UL_STATE.EDITING_ENTRY; |
| 328 | 350 |
ul.edited_item = item; |
| ... | ... | |
| 380 | 402 |
ul.reset_work_li(ul); |
| 381 | 403 |
ul.work_li.classList.remove("hide");
|
| 382 | 404 |
ul.ul.appendChild(ul.work_li); |
| 405 |
list_set_scrollbar(ul.ul); |
|
| 383 | 406 |
|
| 384 | 407 |
if (name !== undefined) |
| 385 | 408 |
ul.work_name_input.value = name; |
| ... | ... | |
| 394 | 417 |
radio_components_window.classList.add("hide");
|
| 395 | 418 |
|
| 396 | 419 |
for (let li of chbx_components_ul.children) {
|
| 397 |
let chbx = li.firstElementChild; |
|
| 420 |
let chbx = li.firstElementChild.firstElementChild;
|
|
| 398 | 421 |
chbx.checked = false; |
| 399 | 422 |
} |
| 400 | 423 |
} |
| ... | ... | |
| 404 | 427 |
let selected = []; |
| 405 | 428 |
|
| 406 | 429 |
for (let li of chbx_components_ul.children) {
|
| 407 |
let chbx = li.firstElementChild; |
|
| 430 |
let chbx = li.firstElementChild.firstElementChild;
|
|
| 408 | 431 |
if (!chbx.checked) |
| 409 | 432 |
continue; |
| 410 | 433 |
|
| ... | ... | |
| 432 | 455 |
|
| 433 | 456 |
let [prefix, item] = components; |
| 434 | 457 |
let li = by_id(radio_li_id(prefix, item)); |
| 458 |
|
|
| 435 | 459 |
if (li === null) |
| 436 | 460 |
radio_component_none_input.checked = false; |
| 437 | 461 |
else |
| 438 |
li.firstElementChild.checked = true; |
|
| 462 |
li.firstElementChild.firstElementChild.checked = true;
|
|
| 439 | 463 |
} |
| 440 | 464 |
|
| 441 | 465 |
function commit_page_components() |
| ... | ... | |
| 443 | 467 |
let components = null; |
| 444 | 468 |
|
| 445 | 469 |
for (let li of radio_components_ul.children) {
|
| 446 |
let radio = li.firstElementChild; |
|
| 470 |
let radio = li.firstElementChild.firstElementChild;
|
|
| 447 | 471 |
if (!radio.checked) |
| 448 | 472 |
continue; |
| 449 | 473 |
|
| ... | ... | |
| 710 | 734 |
for (let [components_ul, id_creator] of uls_creators) {
|
| 711 | 735 |
let li = by_id(id_creator(change.prefix, change.item)); |
| 712 | 736 |
components_ul.removeChild(li); |
| 737 |
list_set_scrollbar(components_ul); |
|
| 713 | 738 |
} |
| 714 | 739 |
} |
| 715 | 740 |
|
Also available in: Unified diff
add styling for options page\n\nThis does not include styling for contents of the import popup