mirror of
https://github.com/bunkerity/bunkerweb
synced 2026-05-24 09:28:37 +00:00
fix FilterSettings and disabled inactive pro
This commit is contained in:
Jordan Blasenhauer
parent
4b24d0a38e
commit
ac96e925bc
2 changed files with 161 additions and 138 deletions
|
|
@ -46,7 +46,7 @@ class Dropdown {
|
|||
const btn = e.target.closest("button");
|
||||
const btnValue = btn.getAttribute("value");
|
||||
const btnSetting = btn.getAttribute(
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`,
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`
|
||||
);
|
||||
//stop if same value to avoid new fetching
|
||||
const isSameVal = this.isSameValue(btnSetting, btnValue);
|
||||
|
|
@ -68,7 +68,7 @@ class Dropdown {
|
|||
|
||||
closeAllDrop() {
|
||||
const drops = document.querySelectorAll(
|
||||
`[data-${this.prefix}-setting-select-dropdown]`,
|
||||
`[data-${this.prefix}-setting-select-dropdown]`
|
||||
);
|
||||
drops.forEach((drop) => {
|
||||
drop.classList.add("hidden");
|
||||
|
|
@ -76,8 +76,8 @@ class Dropdown {
|
|||
document
|
||||
.querySelector(
|
||||
`svg[data-${this.prefix}-setting-select="${drop.getAttribute(
|
||||
`data-${this.prefix}-setting-select-dropdown`,
|
||||
)}"]`,
|
||||
`data-${this.prefix}-setting-select-dropdown`
|
||||
)}"]`
|
||||
)
|
||||
.classList.remove("rotate-180");
|
||||
});
|
||||
|
|
@ -85,7 +85,7 @@ class Dropdown {
|
|||
|
||||
isSameValue(btnSetting, value) {
|
||||
const selectCustom = document.querySelector(
|
||||
`[data-${this.prefix}-setting-select-text="${btnSetting}"]`,
|
||||
`[data-${this.prefix}-setting-select-text="${btnSetting}"]`
|
||||
);
|
||||
const currVal = selectCustom.textContent;
|
||||
return currVal === value ? true : false;
|
||||
|
|
@ -93,30 +93,30 @@ class Dropdown {
|
|||
|
||||
setSelectNewValue(btnSetting, value) {
|
||||
const selectCustom = document.querySelector(
|
||||
`[data-${this.prefix}-setting-select="${btnSetting}"]`,
|
||||
`[data-${this.prefix}-setting-select="${btnSetting}"]`
|
||||
);
|
||||
selectCustom.querySelector(
|
||||
`[data-${this.prefix}-setting-select-text]`,
|
||||
`[data-${this.prefix}-setting-select-text]`
|
||||
).textContent = value;
|
||||
}
|
||||
|
||||
hideDropdown(btnSetting) {
|
||||
//hide dropdown
|
||||
const dropdownEl = document.querySelector(
|
||||
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`,
|
||||
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`
|
||||
);
|
||||
dropdownEl.classList.add("hidden");
|
||||
dropdownEl.classList.remove("flex");
|
||||
//svg effect
|
||||
const dropdownChevron = document.querySelector(
|
||||
`svg[data-${this.prefix}-setting-select="${btnSetting}"]`,
|
||||
`svg[data-${this.prefix}-setting-select="${btnSetting}"]`
|
||||
);
|
||||
dropdownChevron.classList.remove("rotate-180");
|
||||
}
|
||||
|
||||
changeDropBtnStyle(btnSetting, selectedBtn) {
|
||||
const dropdownEl = document.querySelector(
|
||||
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`,
|
||||
`[data-${this.prefix}-setting-select-dropdown="${btnSetting}"]`
|
||||
);
|
||||
//reset dropdown btns
|
||||
const btnEls = dropdownEl.querySelectorAll("button");
|
||||
|
|
@ -126,7 +126,7 @@ class Dropdown {
|
|||
"bg-primary",
|
||||
"dark:bg-primary",
|
||||
"text-gray-300",
|
||||
"text-gray-300",
|
||||
"text-gray-300"
|
||||
);
|
||||
btn.classList.add("bg-white", "dark:bg-slate-700", "text-gray-700");
|
||||
});
|
||||
|
|
@ -134,7 +134,7 @@ class Dropdown {
|
|||
selectedBtn.classList.remove(
|
||||
"bg-white",
|
||||
"dark:bg-slate-700",
|
||||
"text-gray-700",
|
||||
"text-gray-700"
|
||||
);
|
||||
selectedBtn.classList.add("dark:bg-primary", "bg-primary", "text-gray-300");
|
||||
}
|
||||
|
|
@ -145,10 +145,10 @@ class Dropdown {
|
|||
.getAttribute(`data-${this.prefix}-setting-select`);
|
||||
//toggle dropdown
|
||||
const dropdownEl = document.querySelector(
|
||||
`[data-${this.prefix}-setting-select-dropdown="${attribute}"]`,
|
||||
`[data-${this.prefix}-setting-select-dropdown="${attribute}"]`
|
||||
);
|
||||
const dropdownChevron = document.querySelector(
|
||||
`svg[data-${this.prefix}-setting-select="${attribute}"]`,
|
||||
`svg[data-${this.prefix}-setting-select="${attribute}"]`
|
||||
);
|
||||
dropdownEl.classList.toggle("hidden");
|
||||
dropdownEl.classList.toggle("flex");
|
||||
|
|
@ -215,14 +215,16 @@ class Multiple {
|
|||
.closest("button")
|
||||
.hasAttribute(`data-${this.prefix}-multiple-add`)
|
||||
) {
|
||||
if (this.isAvoidAction(e.target)) return;
|
||||
|
||||
//get plugin from btn
|
||||
const btn = e.target.closest("button");
|
||||
const attName = btn.getAttribute(
|
||||
`data-${this.prefix}-multiple-add`,
|
||||
`data-${this.prefix}-multiple-add`
|
||||
);
|
||||
//get all multiple groups
|
||||
const multipleEls = document.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple*="${attName}"]`,
|
||||
`[data-${this.prefix}-settings-multiple*="${attName}"]`
|
||||
);
|
||||
//case no schema
|
||||
if (multipleEls.length <= 0) return;
|
||||
|
|
@ -234,7 +236,7 @@ class Multiple {
|
|||
//and keep the highest num
|
||||
multipleEls.forEach((container) => {
|
||||
const ctnrName = container.getAttribute(
|
||||
`data-${this.prefix}-settings-multiple`,
|
||||
`data-${this.prefix}-settings-multiple`
|
||||
);
|
||||
const num = this.getSuffixNumOrFalse(ctnrName);
|
||||
if (!isNaN(num) && num > topNum) topNum = num;
|
||||
|
|
@ -245,7 +247,7 @@ class Multiple {
|
|||
const setNum = +currNum === 0 ? `` : `_${currNum}`;
|
||||
//the default (schema) group is the last group
|
||||
const schema = document.querySelector(
|
||||
`[data-${this.prefix}-settings-multiple="${attName}_SCHEMA"]`,
|
||||
`[data-${this.prefix}-settings-multiple="${attName}_SCHEMA"]`
|
||||
);
|
||||
//clone schema to create a group with new num
|
||||
const schemaClone = schema.cloneNode(true);
|
||||
|
|
@ -267,6 +269,7 @@ class Multiple {
|
|||
.closest("button")
|
||||
.hasAttribute(`data-${this.prefix}-multiple-toggle`)
|
||||
) {
|
||||
if (this.isAvoidAction(e.target)) return;
|
||||
const att = e.target
|
||||
.closest("button")
|
||||
.getAttribute(`data-${this.prefix}-multiple-toggle`);
|
||||
|
|
@ -282,15 +285,17 @@ class Multiple {
|
|||
.closest("button")
|
||||
.hasAttribute(`data-${this.prefix}-multiple-delete`)
|
||||
) {
|
||||
if (this.isAvoidAction(e.target)) return;
|
||||
|
||||
// We are not removing it really, just hiding it and update values to default
|
||||
// By setting default value, group will be send to server and delete (because a setting with default value is useless to keep)
|
||||
const multContainer = e.target.closest(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
multContainer.classList.add("hidden-multiple");
|
||||
// get setting container
|
||||
const settings = multContainer.querySelectorAll(
|
||||
`[data-setting-container]`,
|
||||
`[data-setting-container]`
|
||||
);
|
||||
settings.forEach((setting) => {
|
||||
// for regular input
|
||||
|
|
@ -317,7 +322,7 @@ class Multiple {
|
|||
// for select
|
||||
try {
|
||||
const selects = setting.querySelectorAll(
|
||||
"button[data-setting-select]",
|
||||
"button[data-setting-select]"
|
||||
);
|
||||
selects.forEach((select) => {
|
||||
const defaultVal = select.getAttribute("data-default") || "";
|
||||
|
|
@ -328,8 +333,8 @@ class Multiple {
|
|||
defaultVal;
|
||||
const dropdown = document.querySelector(
|
||||
`[data-setting-select-dropdown="${select.getAttribute(
|
||||
"data-setting-select",
|
||||
)}"]`,
|
||||
"data-setting-select"
|
||||
)}"]`
|
||||
);
|
||||
dropdown.querySelector(`button[value=${defaultVal}]`).click();
|
||||
});
|
||||
|
|
@ -341,6 +346,17 @@ class Multiple {
|
|||
});
|
||||
}
|
||||
|
||||
isAvoidAction(target) {
|
||||
// check that not disabled pro plugin
|
||||
const proDisabled = target
|
||||
.closest("[data-plugin-item]")
|
||||
.hasAttribute("data-pro-disabled")
|
||||
? true
|
||||
: false;
|
||||
|
||||
return proDisabled;
|
||||
}
|
||||
|
||||
sortMultipleByContainerAndSuffixe(obj) {
|
||||
const sortMultiples = {};
|
||||
for (const [name, value] of Object.entries(obj)) {
|
||||
|
|
@ -354,13 +370,13 @@ class Multiple {
|
|||
? name.replace(`_${splitName[splitName.length - 1]}`, "").trim()
|
||||
: name.trim();
|
||||
const relateSetting = document.querySelector(
|
||||
`[data-setting-container=${nameSuffixLess}_SCHEMA]`,
|
||||
`[data-setting-container=${nameSuffixLess}_SCHEMA]`
|
||||
);
|
||||
const relateCtnr = relateSetting.closest(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
const relateCtnrName = relateCtnr.getAttribute(
|
||||
`data-${this.prefix}-settings-multiple`,
|
||||
`data-${this.prefix}-settings-multiple`
|
||||
);
|
||||
//then we sort the setting on the right container name by suffixe number
|
||||
if (!(relateCtnrName in sortMultiples)) {
|
||||
|
|
@ -378,7 +394,7 @@ class Multiple {
|
|||
addOneMultGroup() {
|
||||
const settings = document.querySelector(`[data-${this.prefix}-modal-form]`);
|
||||
const multAddBtns = settings.querySelectorAll(
|
||||
`[data-${this.prefix}-multiple-add]`,
|
||||
`[data-${this.prefix}-multiple-add]`
|
||||
);
|
||||
multAddBtns.forEach((btn) => {
|
||||
//check if already one (SCHEMA exclude so length >= 2)
|
||||
|
|
@ -394,7 +410,7 @@ class Multiple {
|
|||
|
||||
showMultByAtt(att) {
|
||||
const multContainers = document.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`,
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`
|
||||
);
|
||||
multContainers.forEach((container) => {
|
||||
if (
|
||||
|
|
@ -408,7 +424,7 @@ class Multiple {
|
|||
|
||||
toggleMultByAtt(att) {
|
||||
const multContainers = document.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`,
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`
|
||||
);
|
||||
multContainers.forEach((container) => {
|
||||
if (
|
||||
|
|
@ -424,7 +440,7 @@ class Multiple {
|
|||
//get schema settings
|
||||
const multiples = {};
|
||||
const schemaSettings = document.querySelectorAll(
|
||||
`[data-setting-container$="SCHEMA"]`,
|
||||
`[data-setting-container$="SCHEMA"]`
|
||||
);
|
||||
// loop on every schema settings
|
||||
schemaSettings.forEach((schema) => {
|
||||
|
|
@ -450,11 +466,11 @@ class Multiple {
|
|||
setMultipleToDOM(sortMultObj) {
|
||||
//we loop on each multiple that contains values to render to DOM
|
||||
for (const [schemaCtnrName, multGroupBySuffix] of Object.entries(
|
||||
sortMultObj,
|
||||
sortMultObj
|
||||
)) {
|
||||
//we need to access the DOM schema container
|
||||
const schemaCtnr = document.querySelector(
|
||||
`[data-${this.prefix}-settings-multiple="${schemaCtnrName}"]`,
|
||||
`[data-${this.prefix}-settings-multiple="${schemaCtnrName}"]`
|
||||
);
|
||||
//now we have to loop on each multiple settings group
|
||||
for (const [suffix, settings] of Object.entries(multGroupBySuffix)) {
|
||||
|
|
@ -470,14 +486,14 @@ class Multiple {
|
|||
for (const [name, data] of Object.entries(settings)) {
|
||||
//get setting container of clone container
|
||||
const settingContainer = schemaCtnrClone.querySelector(
|
||||
`[data-setting-container="${name}"]`,
|
||||
`[data-setting-container="${name}"]`
|
||||
);
|
||||
//replace input info and disabled state
|
||||
this.setSetting(
|
||||
data["value"],
|
||||
data["method"],
|
||||
data["global"],
|
||||
settingContainer,
|
||||
settingContainer
|
||||
);
|
||||
}
|
||||
//send schema clone to DOM and show it
|
||||
|
|
@ -492,7 +508,7 @@ class Multiple {
|
|||
`data-${this.prefix}-settings-multiple`,
|
||||
schemaCtnrClone
|
||||
.getAttribute(`data-${this.prefix}-settings-multiple`)
|
||||
.replace("_SCHEMA", suffix),
|
||||
.replace("_SCHEMA", suffix)
|
||||
);
|
||||
|
||||
//rename title
|
||||
|
|
@ -506,18 +522,18 @@ class Multiple {
|
|||
|
||||
//rename setting container
|
||||
const settingCtnrs = schemaCtnrClone.querySelectorAll(
|
||||
"[data-setting-container]",
|
||||
"[data-setting-container]"
|
||||
);
|
||||
settingCtnrs.forEach((settingCtnr) => {
|
||||
settingCtnr.setAttribute(
|
||||
"data-setting-container",
|
||||
settingCtnr
|
||||
.getAttribute("data-setting-container")
|
||||
.replace("_SCHEMA", suffix),
|
||||
.replace("_SCHEMA", suffix)
|
||||
);
|
||||
settingCtnr.setAttribute(
|
||||
"id",
|
||||
settingCtnr.getAttribute("id").replace("_SCHEMA", suffix),
|
||||
settingCtnr.getAttribute("id").replace("_SCHEMA", suffix)
|
||||
);
|
||||
});
|
||||
|
||||
|
|
@ -526,7 +542,7 @@ class Multiple {
|
|||
labelEls.forEach((label) => {
|
||||
label.setAttribute(
|
||||
"for",
|
||||
label.getAttribute("for").replace("_SCHEMA", suffix),
|
||||
label.getAttribute("for").replace("_SCHEMA", suffix)
|
||||
);
|
||||
});
|
||||
|
||||
|
|
@ -535,19 +551,19 @@ class Multiple {
|
|||
popoverBtns.forEach((popoverBtn) => {
|
||||
popoverBtn.setAttribute(
|
||||
"data-popover-btn",
|
||||
popoverBtn.getAttribute("data-popover-btn").replace("_SCHEMA", suffix),
|
||||
popoverBtn.getAttribute("data-popover-btn").replace("_SCHEMA", suffix)
|
||||
);
|
||||
});
|
||||
|
||||
const popoverContents = schemaCtnrClone.querySelectorAll(
|
||||
"[data-popover-content]",
|
||||
"[data-popover-content]"
|
||||
);
|
||||
popoverContents.forEach((popoverContent) => {
|
||||
popoverContent.setAttribute(
|
||||
"data-popover-content",
|
||||
popoverContent
|
||||
.getAttribute("data-popover-content")
|
||||
.replace("_SCHEMA", suffix),
|
||||
.replace("_SCHEMA", suffix)
|
||||
);
|
||||
});
|
||||
|
||||
|
|
@ -556,7 +572,7 @@ class Multiple {
|
|||
invalidEls.forEach((invalidEl) => {
|
||||
invalidEl.setAttribute(
|
||||
"data-invalid",
|
||||
invalidEl.getAttribute("data-invalid").replace("_SCHEMA", suffix),
|
||||
invalidEl.getAttribute("data-invalid").replace("_SCHEMA", suffix)
|
||||
);
|
||||
});
|
||||
|
||||
|
|
@ -634,15 +650,15 @@ class Multiple {
|
|||
//click the custom select dropdown btn value to update select value
|
||||
select.parentElement
|
||||
.querySelector(
|
||||
`button[data-setting-select-dropdown-btn][value='${defaultVal}']`,
|
||||
`button[data-setting-select-dropdown-btn][value='${defaultVal}']`
|
||||
)
|
||||
.click();
|
||||
|
||||
//set state to custom visible el
|
||||
const btnCustom = document.querySelector(
|
||||
`[data-setting-select=${select.getAttribute(
|
||||
"data-setting-select-default",
|
||||
)}]`,
|
||||
"data-setting-select-default"
|
||||
)}]`
|
||||
);
|
||||
|
||||
this.setDisabledMultServ(btnCustom, method, global);
|
||||
|
|
@ -678,10 +694,10 @@ class Multiple {
|
|||
selects.forEach((select) => {
|
||||
const method = select.getAttribute("data-default-method");
|
||||
const name = select.getAttribute(
|
||||
`data-${this.prefix}-setting-select-default`,
|
||||
`data-${this.prefix}-setting-select-default`
|
||||
);
|
||||
const selDOM = document.querySelector(
|
||||
`button[data-${this.prefix}-setting-select='${name}']`,
|
||||
`button[data-${this.prefix}-setting-select='${name}']`
|
||||
);
|
||||
if (method === "ui" || method === "default") {
|
||||
selDOM.removeAttribute("disabled", "");
|
||||
|
|
@ -696,6 +712,13 @@ class Multiple {
|
|||
//for already existing global config multiples
|
||||
//global is check
|
||||
setDisabledMultServ(inp, method, global) {
|
||||
// Check if pro
|
||||
const proDisabled = inp
|
||||
.closest("[data-plugin-item]")
|
||||
.hasAttribute("data-pro-disabled")
|
||||
? true
|
||||
: false;
|
||||
if (proDisabled) return inp.setAttribute("disabled", "");
|
||||
if (global) return inp.removeAttribute("disabled");
|
||||
|
||||
if (method === "ui" || method === "default") {
|
||||
|
|
@ -716,7 +739,7 @@ class Multiple {
|
|||
hiddenIfNoMultiples() {
|
||||
//hide multiple btn if no multiple exist on a plugin
|
||||
const multiples = document.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
multiples.forEach((container) => {
|
||||
if (container.querySelectorAll(`[data-setting-container]`).length <= 0)
|
||||
|
|
@ -728,7 +751,7 @@ class Multiple {
|
|||
|
||||
removePrevMultiples() {
|
||||
const multiPlugins = document.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
multiPlugins.forEach((multiGrp) => {
|
||||
if (
|
||||
|
|
@ -764,7 +787,7 @@ const setPopover = new Popover("main", "global-config");
|
|||
const setDrop = new Dropdown();
|
||||
const setTabsSelect = new TabsSelect(
|
||||
document.querySelector("[data-global-config-tabs-select-container]"),
|
||||
document.querySelector("[data-global-config-plugins-container]"),
|
||||
document.querySelector("[data-global-config-plugins-container]")
|
||||
);
|
||||
const setInvalid = new showInvalid();
|
||||
const format = new FormatValue();
|
||||
|
|
@ -772,7 +795,7 @@ const format = new FormatValue();
|
|||
const setFilterGlobal = new FilterSettings(
|
||||
"keyword",
|
||||
document.querySelector("[data-global-config-tabs-select-container]"),
|
||||
document.querySelector("[data-global-config-plugins-container]"),
|
||||
document.querySelector("[data-global-config-plugins-container]")
|
||||
);
|
||||
|
||||
const setMultiple = new Multiple("global-config");
|
||||
|
|
@ -784,19 +807,19 @@ const checkServiceModalKeyword = new CheckNoMatchFilter(
|
|||
.querySelector("[data-global-config-plugins-container]")
|
||||
.querySelectorAll("[data-plugin-item]"),
|
||||
document.querySelector("[data-global-config-form]"),
|
||||
document.querySelector("[data-global-config-nomatch]"),
|
||||
document.querySelector("[data-global-config-nomatch]")
|
||||
);
|
||||
|
||||
try {
|
||||
const checkServiceCardSelect = new CheckNoMatchFilter(
|
||||
document.querySelectorAll(
|
||||
"button[data-global-config-setting-select-dropdown-btn]",
|
||||
"button[data-global-config-setting-select-dropdown-btn]"
|
||||
),
|
||||
"select",
|
||||
document
|
||||
.querySelector("[data-global-config-plugins-container]")
|
||||
.querySelectorAll("[data-plugin-item]"),
|
||||
document.querySelector("[data-global-config-form]"),
|
||||
document.querySelector("[data-global-config-nomatch]"),
|
||||
document.querySelector("[data-global-config-nomatch]")
|
||||
);
|
||||
} catch (e) {}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ class Popover {
|
|||
this.hidePopover(this.relateBtn);
|
||||
} catch (e) {}
|
||||
},
|
||||
true,
|
||||
true
|
||||
);
|
||||
|
||||
window.addEventListener("pointerover", (e) => {
|
||||
|
|
@ -48,7 +48,7 @@ class Popover {
|
|||
const popoverName = btn.getAttribute("data-popover-btn");
|
||||
//toggle curr popover
|
||||
const popover = btn.parentElement.querySelector(
|
||||
`[data-popover-content=${popoverName}]`,
|
||||
`[data-popover-content=${popoverName}]`
|
||||
);
|
||||
|
||||
popover.classList.add("transition-all", "delay-200", "opacity-0");
|
||||
|
|
@ -70,7 +70,7 @@ class Popover {
|
|||
const popoverName = btn.getAttribute("data-popover-btn");
|
||||
//toggle curr popover
|
||||
const popover = btn.parentElement.querySelector(
|
||||
`[data-popover-content=${popoverName}]`,
|
||||
`[data-popover-content=${popoverName}]`
|
||||
);
|
||||
popover.classList.add("hidden");
|
||||
popover.classList.remove("transition-all", "delay-200");
|
||||
|
|
@ -127,7 +127,7 @@ class TabsSelect {
|
|||
window.history.replaceState(
|
||||
null,
|
||||
"",
|
||||
`${window.location.pathname}#${tabAtt}`,
|
||||
`${window.location.pathname}#${tabAtt}`
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -153,7 +153,7 @@ class TabsSelect {
|
|||
const fragment = window.location.hash.substring(1);
|
||||
if (fragment) {
|
||||
const tab = this.tabContainer.querySelector(
|
||||
`button[data-tab-select-handler='${fragment}']`,
|
||||
`button[data-tab-select-handler='${fragment}']`
|
||||
);
|
||||
tab.click();
|
||||
// Scroll to the top of the page (with a delay to ensure the tab is clicked first)
|
||||
|
|
@ -167,7 +167,7 @@ class TabsSelect {
|
|||
|
||||
resetTabsStyle() {
|
||||
const tabsEl = this.tabContainer.querySelectorAll(
|
||||
"button[data-tab-select-handler]",
|
||||
"button[data-tab-select-handler]"
|
||||
);
|
||||
tabsEl.forEach((tab) => {
|
||||
tab.classList.remove("active");
|
||||
|
|
@ -176,7 +176,7 @@ class TabsSelect {
|
|||
|
||||
highlightClicked(tabAtt) {
|
||||
const tabMobile = this.tabContainer.querySelector(
|
||||
`button[data-tab-select-handler='${tabAtt}']`,
|
||||
`button[data-tab-select-handler='${tabAtt}']`
|
||||
);
|
||||
tabMobile.classList.add("active");
|
||||
}
|
||||
|
|
@ -191,14 +191,14 @@ class TabsSelect {
|
|||
|
||||
showSettingClicked(tabAtt) {
|
||||
const plugin = this.contentContainer.querySelector(
|
||||
`[data-plugin-item='${tabAtt}']`,
|
||||
`[data-plugin-item='${tabAtt}']`
|
||||
);
|
||||
plugin.classList.remove("hidden");
|
||||
}
|
||||
|
||||
setDropBtnText(tabAtt, text) {
|
||||
const dropBtn = this.tabContainer.querySelector(
|
||||
"[data-tab-select-dropdown-btn]",
|
||||
"[data-tab-select-dropdown-btn]"
|
||||
);
|
||||
dropBtn.setAttribute("data-tab-id", tabAtt);
|
||||
dropBtn.querySelector("span").textContent = text;
|
||||
|
|
@ -206,7 +206,7 @@ class TabsSelect {
|
|||
|
||||
closeDropdown() {
|
||||
const dropdown = this.tabContainer.querySelector(
|
||||
"[data-tab-select-dropdown]",
|
||||
"[data-tab-select-dropdown]"
|
||||
);
|
||||
dropdown.classList.add("hidden");
|
||||
dropdown.classList.remove("flex");
|
||||
|
|
@ -216,7 +216,7 @@ class TabsSelect {
|
|||
|
||||
toggleDropdown() {
|
||||
const dropdown = this.tabContainer.querySelector(
|
||||
"[data-tab-select-dropdown]",
|
||||
"[data-tab-select-dropdown]"
|
||||
);
|
||||
const combobox = dropdown.querySelector("[data-combobox]");
|
||||
if (combobox) {
|
||||
|
|
@ -241,7 +241,7 @@ class TabsSelect {
|
|||
|
||||
updateTabArrow() {
|
||||
const dropdown = this.tabContainer.querySelector(
|
||||
"[data-tab-select-dropdown]",
|
||||
"[data-tab-select-dropdown]"
|
||||
);
|
||||
|
||||
if (dropdown.classList.contains("hidden")) {
|
||||
|
|
@ -275,24 +275,24 @@ class FilterSettings {
|
|||
inputID,
|
||||
tabContainer,
|
||||
contentContainer,
|
||||
prefix = "global-config",
|
||||
prefix = "global-config"
|
||||
) {
|
||||
this.input = document.querySelector(`input#${inputID}`);
|
||||
this.prefix = prefix;
|
||||
this.contextTxtEl = document.querySelector(
|
||||
`span[data-${this.prefix}-setting-select-text="context"]`,
|
||||
`span[data-${this.prefix}-setting-select-text="context"]`
|
||||
);
|
||||
this.typeTxtEl = document.querySelector(
|
||||
`span[data-${this.prefix}-setting-select-text="type"]`,
|
||||
`span[data-${this.prefix}-setting-select-text="type"]`
|
||||
);
|
||||
this.comboboxEl = document.querySelector(
|
||||
`[data-${this.prefix}-tabs-select] [data-combobox]`,
|
||||
`[data-${this.prefix}-tabs-select] [data-combobox]`
|
||||
);
|
||||
this.isComboCheck = false;
|
||||
this.tabContainer = tabContainer;
|
||||
this.contentContainer = contentContainer;
|
||||
this.tabsEls = this.tabContainer.querySelectorAll(
|
||||
`[data-tab-select-handler]`,
|
||||
`[data-tab-select-handler]`
|
||||
);
|
||||
this.comboboxEl = this.tabContainer
|
||||
.querySelector("[data-tab-select-dropdown]")
|
||||
|
|
@ -325,16 +325,16 @@ class FilterSettings {
|
|||
try {
|
||||
if (
|
||||
(e.target.hasAttribute(
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`,
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`
|
||||
) &&
|
||||
e.target.getAttribute(
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`,
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`
|
||||
) === `context`) ||
|
||||
(e.target.hasAttribute(
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`,
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`
|
||||
) &&
|
||||
e.target.getAttribute(
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`,
|
||||
`data-${this.prefix}-setting-select-dropdown-btn`
|
||||
) === `type`)
|
||||
) {
|
||||
return this.runFilter();
|
||||
|
|
@ -464,7 +464,7 @@ class FilterSettings {
|
|||
.toLowerCase();
|
||||
const settingEl =
|
||||
multSetting.querySelector("input")?.getAttribute("id") ||
|
||||
setting.querySelector("select")?.getAttribute("id") ||
|
||||
multSetting.querySelector("select")?.getAttribute("id") ||
|
||||
"";
|
||||
const settingId = settingEl.trim().toLowerCase().replaceAll("_", " ");
|
||||
if (
|
||||
|
|
@ -531,7 +531,7 @@ class FilterSettings {
|
|||
const multGroups = this.contentContainer
|
||||
.querySelector(`[data-plugin-item=${tabName}]`)
|
||||
.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple^="${multHandlerName}"]`,
|
||||
`[data-${this.prefix}-settings-multiple^="${multHandlerName}"]`
|
||||
);
|
||||
// check for each if all settings are hidden
|
||||
|
||||
|
|
@ -539,7 +539,7 @@ class FilterSettings {
|
|||
const multGroup = multGroups[j];
|
||||
let isAllMultSettingHidden = true;
|
||||
const settings = multGroup.querySelectorAll(
|
||||
`[data-setting-container]`,
|
||||
`[data-setting-container]`
|
||||
);
|
||||
for (let k = 0; k < settings.length; k++) {
|
||||
if (!settings[k].classList.contains("hidden")) {
|
||||
|
|
@ -632,7 +632,7 @@ class FilterSettings {
|
|||
.querySelector("[data-tab-select-dropdown-btn]")
|
||||
.setAttribute("data-tab-id", "no-match");
|
||||
this.tabContainer.querySelector(
|
||||
"[data-tab-select-dropdown-btn] span",
|
||||
"[data-tab-select-dropdown-btn] span"
|
||||
).textContent = "No match";
|
||||
// we want to close dropdown in case open previously
|
||||
this.toggleDropdown(true, true, false);
|
||||
|
|
@ -641,7 +641,7 @@ class FilterSettings {
|
|||
|
||||
// case at least one match
|
||||
const currTabBtn = this.tabContainer.querySelector(
|
||||
`[data-tab-select-handler='${tabNameBeforeFilter}']`,
|
||||
`[data-tab-select-handler='${tabNameBeforeFilter}']`
|
||||
);
|
||||
|
||||
// case the previous plugin is still visible, set is as active by clicking it again
|
||||
|
|
@ -661,7 +661,7 @@ class FilterSettings {
|
|||
return;
|
||||
|
||||
const hiddenTabsEl = this.tabContainer.querySelectorAll(
|
||||
`[data-tab-select-handler][class*="!hidden"]`,
|
||||
`[data-tab-select-handler][class*="!hidden"]`
|
||||
);
|
||||
|
||||
if (hiddenTabsEl.length < this.tabsEls.length - 1)
|
||||
|
|
@ -672,15 +672,15 @@ class FilterSettings {
|
|||
toggleDropdown(
|
||||
avoidComboFocus = false,
|
||||
disableOpen = false,
|
||||
disableClose = false,
|
||||
disableClose = false
|
||||
) {
|
||||
// avoid this on mobile
|
||||
if (window.innerWidth < 768) return;
|
||||
const dropdownEl = this.tabContainer.querySelector(
|
||||
"[data-tab-select-dropdown]",
|
||||
"[data-tab-select-dropdown]"
|
||||
);
|
||||
const dropdownBtn = this.tabContainer.querySelector(
|
||||
"[data-tab-select-dropdown-btn]",
|
||||
"[data-tab-select-dropdown-btn]"
|
||||
);
|
||||
if (this.comboboxEl && avoidComboFocus)
|
||||
this.comboboxEl.setAttribute("data-focus", "false");
|
||||
|
|
@ -736,7 +736,7 @@ class FilterSettings {
|
|||
const multGroups = this.contentContainer
|
||||
.querySelector(`[data-plugin-item=${tabName}]`)
|
||||
.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple^="${multHandlerName}"]`,
|
||||
`[data-${this.prefix}-settings-multiple^="${multHandlerName}"]`
|
||||
);
|
||||
// check for each if all settings are hidden
|
||||
for (let j = 0; j < multGroups.length; j++) {
|
||||
|
|
@ -751,7 +751,7 @@ class FilterSettings {
|
|||
multGroup.classList.remove("hidden");
|
||||
|
||||
const settings = multGroup.querySelectorAll(
|
||||
`[data-setting-container]`,
|
||||
`[data-setting-container]`
|
||||
);
|
||||
for (let k = 0; k < settings.length; k++) {
|
||||
settings[k].classList.remove("hidden");
|
||||
|
|
@ -768,7 +768,7 @@ class FilterSettings {
|
|||
.querySelector(`[data-plugin-item="${tabName}"]`)
|
||||
.querySelector(`[data-plugin-settings]`);
|
||||
const settings = settingContainer.querySelectorAll(
|
||||
"[data-setting-container]",
|
||||
"[data-setting-container]"
|
||||
);
|
||||
return settings;
|
||||
}
|
||||
|
|
@ -790,7 +790,7 @@ class FilterSettings {
|
|||
)
|
||||
continue;
|
||||
const settingsContainer = settingMultipleGroup.querySelectorAll(
|
||||
`[data-setting-container]`,
|
||||
`[data-setting-container]`
|
||||
);
|
||||
|
||||
settingsContainer.forEach((setting) => {
|
||||
|
|
@ -859,7 +859,7 @@ class CheckNoMatchFilter {
|
|||
elsToCheck,
|
||||
elContainer,
|
||||
noMatchEl,
|
||||
classToCheck = "hidden",
|
||||
classToCheck = "hidden"
|
||||
) {
|
||||
this.input = input;
|
||||
this.type = type;
|
||||
|
|
@ -989,11 +989,11 @@ class Settings {
|
|||
this.mode = mode;
|
||||
|
||||
this.serverNameInps = this.container.querySelectorAll(
|
||||
'input[name="SERVER_NAME"][data-setting-input]',
|
||||
'input[name="SERVER_NAME"][data-setting-input]'
|
||||
);
|
||||
|
||||
this.submitBtn = this.container.querySelector(
|
||||
`button[data-${this.prefix}-modal-submit]`,
|
||||
`button[data-${this.prefix}-modal-submit]`
|
||||
);
|
||||
this.currAction = "";
|
||||
this.currMethod = "";
|
||||
|
|
@ -1091,7 +1091,7 @@ class Settings {
|
|||
parentEl = this.container,
|
||||
attMethodName = "data-default-method",
|
||||
attValueName = "data-default-value",
|
||||
avoidMultiple = true,
|
||||
avoidMultiple = true
|
||||
) {
|
||||
// Start with input-like (input, checkbox)
|
||||
const inps = avoidMultiple
|
||||
|
|
@ -1122,7 +1122,7 @@ class Settings {
|
|||
"select",
|
||||
select,
|
||||
select.getAttribute("name"),
|
||||
parentEl,
|
||||
parentEl
|
||||
)
|
||||
)
|
||||
return;
|
||||
|
|
@ -1132,15 +1132,15 @@ class Settings {
|
|||
//click the custom select dropdown to update select value
|
||||
select.parentElement
|
||||
.querySelector(
|
||||
`button[data-setting-select-dropdown-btn][value='${defaultVal}']`,
|
||||
`button[data-setting-select-dropdown-btn][value='${defaultVal}']`
|
||||
)
|
||||
.click();
|
||||
|
||||
//set state to custom visible el
|
||||
const btnCustom = document.querySelector(
|
||||
`[data-setting-select=${select.getAttribute(
|
||||
"data-setting-select-default",
|
||||
)}]`,
|
||||
"data-setting-select-default"
|
||||
)}]`
|
||||
);
|
||||
|
||||
this.setDisabledByMethod(btnCustom, defaultMethod);
|
||||
|
|
@ -1169,7 +1169,7 @@ class Settings {
|
|||
settings,
|
||||
setMethodUI,
|
||||
forceEnabled,
|
||||
emptyServerName,
|
||||
emptyServerName
|
||||
) {
|
||||
// Get global needed data
|
||||
this.currAction = action;
|
||||
|
|
@ -1186,7 +1186,7 @@ class Settings {
|
|||
|
||||
updateOldNameValue() {
|
||||
const oldNameInps = this.container.querySelectorAll(
|
||||
'input[name="OLD_SERVER_NAME"]',
|
||||
'input[name="OLD_SERVER_NAME"]'
|
||||
);
|
||||
|
||||
oldNameInps.forEach((inp) => {
|
||||
|
|
@ -1198,7 +1198,7 @@ class Settings {
|
|||
updateOperation() {
|
||||
// update operation and other hidden inputs for all mode in modal
|
||||
const operationInps = this.container.querySelectorAll(
|
||||
'input[name="operation"]',
|
||||
'input[name="operation"]'
|
||||
);
|
||||
operationInps.forEach((inp) => {
|
||||
inp.setAttribute("value", this.operation);
|
||||
|
|
@ -1270,7 +1270,7 @@ class Settings {
|
|||
if (inp.tagName === "SELECT") {
|
||||
inp.parentElement
|
||||
.querySelector(
|
||||
`button[data-setting-select-dropdown-btn][value='${value}']`,
|
||||
`button[data-setting-select-dropdown-btn][value='${value}']`
|
||||
)
|
||||
.click();
|
||||
inp.setAttribute("data-method", method);
|
||||
|
|
@ -1337,7 +1337,7 @@ class SettingsMultiple extends Settings {
|
|||
const attName = btn.getAttribute(`data-${this.prefix}-multiple-add`);
|
||||
//get all multiple groups
|
||||
const multipleEls = this.container.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple*="${attName}"]`,
|
||||
`[data-${this.prefix}-settings-multiple*="${attName}"]`
|
||||
);
|
||||
//case no schema
|
||||
if (multipleEls.length <= 0) return;
|
||||
|
|
@ -1349,7 +1349,7 @@ class SettingsMultiple extends Settings {
|
|||
//and keep the highest num
|
||||
multipleEls.forEach((container) => {
|
||||
const ctnrName = container.getAttribute(
|
||||
`data-${this.prefix}-settings-multiple`,
|
||||
`data-${this.prefix}-settings-multiple`
|
||||
);
|
||||
const [containerSuffix, containerIsNum, containerName] =
|
||||
this.getSuffixData(ctnrName);
|
||||
|
|
@ -1362,7 +1362,7 @@ class SettingsMultiple extends Settings {
|
|||
const setNum = +currNum === 0 ? `` : `_${currNum}`;
|
||||
//the default (schema) group is the last group
|
||||
const schema = this.container.querySelector(
|
||||
`[data-${this.prefix}-settings-multiple="${attName}_SCHEMA"]`,
|
||||
`[data-${this.prefix}-settings-multiple="${attName}_SCHEMA"]`
|
||||
);
|
||||
//clone schema to create a group with new num
|
||||
const schemaClone = schema.cloneNode(true);
|
||||
|
|
@ -1403,12 +1403,12 @@ class SettingsMultiple extends Settings {
|
|||
// We are not removing it really, just hiding it and update values to default
|
||||
// By setting default value, group will be send to server and delete (because a setting with default value is useless to keep)
|
||||
const multContainer = e.target.closest(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
multContainer.classList.add("hidden-multiple");
|
||||
// get setting container
|
||||
const settings = multContainer.querySelectorAll(
|
||||
`[data-setting-container]`,
|
||||
`[data-setting-container]`
|
||||
);
|
||||
settings.forEach((setting) => {
|
||||
// for regular input
|
||||
|
|
@ -1435,7 +1435,7 @@ class SettingsMultiple extends Settings {
|
|||
// for select
|
||||
try {
|
||||
const selects = setting.querySelectorAll(
|
||||
"button[data-setting-select]",
|
||||
"button[data-setting-select]"
|
||||
);
|
||||
selects.forEach((select) => {
|
||||
const defaultVal = select.getAttribute("data-default") || "";
|
||||
|
|
@ -1446,8 +1446,8 @@ class SettingsMultiple extends Settings {
|
|||
defaultVal;
|
||||
const dropdown = this.container.querySelector(
|
||||
`[data-setting-select-dropdown="${select.getAttribute(
|
||||
"data-setting-select",
|
||||
)}"]`,
|
||||
"data-setting-select"
|
||||
)}"]`
|
||||
);
|
||||
dropdown.querySelector(`button[value=${defaultVal}]`).click();
|
||||
});
|
||||
|
|
@ -1472,7 +1472,7 @@ class SettingsMultiple extends Settings {
|
|||
|
||||
removePrevMultiples() {
|
||||
const multiPlugins = this.container.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
multiPlugins.forEach((multiGrp) => {
|
||||
if (
|
||||
|
|
@ -1503,11 +1503,11 @@ class SettingsMultiple extends Settings {
|
|||
setMultipleToDOM(sortMultObj) {
|
||||
// We want to loop on each schema container
|
||||
for (const [schemaCtnrName, multGroupBySuffix] of Object.entries(
|
||||
sortMultObj,
|
||||
sortMultObj
|
||||
)) {
|
||||
//we need to access the DOM schema container
|
||||
const schemaCtnr = this.container.querySelector(
|
||||
`[data-${this.prefix}-settings-multiple="${schemaCtnrName}"]`,
|
||||
`[data-${this.prefix}-settings-multiple="${schemaCtnrName}"]`
|
||||
);
|
||||
//now we have to loop on each multiple settings group
|
||||
for (const [suffix, settings] of Object.entries(multGroupBySuffix)) {
|
||||
|
|
@ -1523,7 +1523,7 @@ class SettingsMultiple extends Settings {
|
|||
for (const [name, data] of Object.entries(settings)) {
|
||||
//get setting container of clone container
|
||||
const settingContainer = schemaCtnrClone.querySelector(
|
||||
`[data-setting-container="${name}"]`,
|
||||
`[data-setting-container="${name}"]`
|
||||
);
|
||||
}
|
||||
//send schema clone to DOM and show it
|
||||
|
|
@ -1546,7 +1546,7 @@ class SettingsMultiple extends Settings {
|
|||
const multiples = {};
|
||||
|
||||
const schemaSettings = this.container.querySelectorAll(
|
||||
`[data-setting-container$="SCHEMA"]`,
|
||||
`[data-setting-container$="SCHEMA"]`
|
||||
);
|
||||
|
||||
// loop on every schema settings
|
||||
|
|
@ -1573,13 +1573,13 @@ class SettingsMultiple extends Settings {
|
|||
|
||||
addOneMultGroup() {
|
||||
const multAddBtns = this.container.querySelectorAll(
|
||||
`[data-${this.prefix}-multiple-add]`,
|
||||
`[data-${this.prefix}-multiple-add]`
|
||||
);
|
||||
multAddBtns.forEach((btn) => {
|
||||
const att = btn.getAttribute(`data-${this.prefix}-multiple-add`);
|
||||
//check if already one (SCHEMA exclude so length >= 2)
|
||||
const multGroups = this.container.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple^="${att}"]`,
|
||||
`[data-${this.prefix}-settings-multiple^="${att}"]`
|
||||
);
|
||||
if (multGroups.length >= 2) return;
|
||||
|
||||
|
|
@ -1596,7 +1596,7 @@ class SettingsMultiple extends Settings {
|
|||
hiddenIfNoMultiples() {
|
||||
//hide multiple btn if no multiple exist on a plugin
|
||||
const multiples = this.container.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
multiples.forEach((container) => {
|
||||
if (container.querySelectorAll(`[data-setting-container]`).length <= 0)
|
||||
|
|
@ -1608,7 +1608,7 @@ class SettingsMultiple extends Settings {
|
|||
|
||||
showMultByAtt(att) {
|
||||
const multContainers = this.container.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`,
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`
|
||||
);
|
||||
multContainers.forEach((container) => {
|
||||
if (
|
||||
|
|
@ -1622,7 +1622,7 @@ class SettingsMultiple extends Settings {
|
|||
|
||||
toggleMultByAtt(att) {
|
||||
const multContainers = this.container.querySelectorAll(
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`,
|
||||
`[data-${this.prefix}-settings-multiple^=${att}]`
|
||||
);
|
||||
multContainers.forEach((container) => {
|
||||
if (
|
||||
|
|
@ -1657,10 +1657,10 @@ class SettingsMultiple extends Settings {
|
|||
selects.forEach((select) => {
|
||||
const method = select.getAttribute("data-default-method");
|
||||
const name = select.getAttribute(
|
||||
`data-${this.prefix}-setting-select-default`,
|
||||
`data-${this.prefix}-setting-select-default`
|
||||
);
|
||||
const selDOM = this.container.querySelector(
|
||||
`button[data-${this.prefix}-setting-select='${name}']`,
|
||||
`button[data-${this.prefix}-setting-select='${name}']`
|
||||
);
|
||||
if (method === "ui" || method === "default") {
|
||||
selDOM.removeAttribute("disabled", "");
|
||||
|
|
@ -1685,14 +1685,14 @@ class SettingsMultiple extends Settings {
|
|||
? name.replace(`_${splitName[splitName.length - 1]}`, "").trim()
|
||||
: name.trim();
|
||||
const relateSetting = this.container.querySelector(
|
||||
`[data-setting-container=${nameSuffixLess}_SCHEMA]`,
|
||||
`[data-setting-container=${nameSuffixLess}_SCHEMA]`
|
||||
);
|
||||
if (!relateSetting) continue;
|
||||
const relateCtnr = relateSetting.closest(
|
||||
`[data-${this.prefix}-settings-multiple]`,
|
||||
`[data-${this.prefix}-settings-multiple]`
|
||||
);
|
||||
const relateCtnrName = relateCtnr.getAttribute(
|
||||
`data-${this.prefix}-settings-multiple`,
|
||||
`data-${this.prefix}-settings-multiple`
|
||||
);
|
||||
//then we sort the setting on the right container name by suffixe number
|
||||
if (!(relateCtnrName in sortMultiples)) {
|
||||
|
|
@ -1713,7 +1713,7 @@ class SettingsMultiple extends Settings {
|
|||
`data-${this.prefix}-settings-multiple`,
|
||||
schemaCtnrClone
|
||||
.getAttribute(`data-${this.prefix}-settings-multiple`)
|
||||
.replace("_SCHEMA", suffix),
|
||||
.replace("_SCHEMA", suffix)
|
||||
);
|
||||
|
||||
// Get all elemennts by attribute to update _SCHEMA by suffix
|
||||
|
|
@ -1732,7 +1732,7 @@ class SettingsMultiple extends Settings {
|
|||
attEls.forEach((attEl) => {
|
||||
attEl.setAttribute(
|
||||
att,
|
||||
attEl.getAttribute(att).replace("_SCHEMA", suffix),
|
||||
attEl.getAttribute(att).replace("_SCHEMA", suffix)
|
||||
);
|
||||
});
|
||||
});
|
||||
|
|
@ -1819,7 +1819,7 @@ class SettingsEditor extends SettingsMultiple {
|
|||
addDefaultEditorIfNone() {
|
||||
// get containers with _SCHEMA
|
||||
const editorContainers = this.container.querySelectorAll(
|
||||
"[data-editor-container$='_SCHEMA']",
|
||||
"[data-editor-container$='_SCHEMA']"
|
||||
);
|
||||
editorContainers.forEach((editorContainer) => {
|
||||
// Check if others editor exists with same base name
|
||||
|
|
@ -1827,7 +1827,7 @@ class SettingsEditor extends SettingsMultiple {
|
|||
.getAttribute("data-editor-container")
|
||||
.replace("_SCHEMA", "");
|
||||
const otherEditors = this.container.querySelectorAll(
|
||||
`[data-editor-container*='${editorName}']`,
|
||||
`[data-editor-container*='${editorName}']`
|
||||
);
|
||||
if (otherEditors.length > 1) return;
|
||||
// Add default editor
|
||||
|
|
@ -1845,7 +1845,7 @@ class SettingsEditor extends SettingsMultiple {
|
|||
// reset previous editors
|
||||
this.editorEls.forEach((editor) => {
|
||||
const editorContainer = editor.container.closest(
|
||||
"[data-editor-container]",
|
||||
"[data-editor-container]"
|
||||
);
|
||||
editorContainer.remove();
|
||||
editor.destroy();
|
||||
|
|
@ -1854,7 +1854,7 @@ class SettingsEditor extends SettingsMultiple {
|
|||
this.editorEls = [];
|
||||
// get only container ending with _SCHEMA
|
||||
const editorContainers = this.container.querySelectorAll(
|
||||
"[data-editor-container$='_SCHEMA']",
|
||||
"[data-editor-container$='_SCHEMA']"
|
||||
);
|
||||
const configsSettings = this.getEditorSettings();
|
||||
// Create instances on the right containers
|
||||
|
|
@ -1875,7 +1875,7 @@ class SettingsEditor extends SettingsMultiple {
|
|||
editorType,
|
||||
editorName,
|
||||
num,
|
||||
editorValue,
|
||||
editorValue
|
||||
);
|
||||
}
|
||||
});
|
||||
|
|
@ -1894,11 +1894,11 @@ class SettingsEditor extends SettingsMultiple {
|
|||
editor.setAttribute("name", `${contName}_${num}`);
|
||||
}
|
||||
const filenameInp = containerClone.querySelector(
|
||||
`input[data-editor-filename]`,
|
||||
`input[data-editor-filename]`
|
||||
);
|
||||
if (filenameInp) filenameInp.value = name;
|
||||
const hiddenInp = containerClone.querySelector(
|
||||
`textarea[data-editor-input]`,
|
||||
`textarea[data-editor-input]`
|
||||
);
|
||||
if (hiddenInp) {
|
||||
hiddenInp.setAttribute("data-config-type", type);
|
||||
|
|
@ -1957,7 +1957,7 @@ class SettingsAdvanced extends SettingsEditor {
|
|||
settings,
|
||||
setMethodUI = false,
|
||||
forceEnabled = false,
|
||||
emptyServerName = false,
|
||||
emptyServerName = false
|
||||
) {
|
||||
this.updateData(
|
||||
action,
|
||||
|
|
@ -1966,7 +1966,7 @@ class SettingsAdvanced extends SettingsEditor {
|
|||
settings,
|
||||
setMethodUI,
|
||||
forceEnabled,
|
||||
emptyServerName,
|
||||
emptyServerName
|
||||
);
|
||||
this.setSettingsAdvanced();
|
||||
this.resetServerName();
|
||||
|
|
@ -1982,7 +1982,7 @@ class SettingsAdvanced extends SettingsEditor {
|
|||
checkVisibleInpsValidity() {
|
||||
try {
|
||||
const inps = this.container.querySelectorAll(
|
||||
"[data-plugin-item]:not(.hidden) input[data-setting-input], [data-plugin-item][class*='hidden'] input[data-setting-input]",
|
||||
"[data-plugin-item]:not(.hidden) input[data-setting-input], [data-plugin-item][class*='hidden'] input[data-setting-input]"
|
||||
);
|
||||
|
||||
// merge input with visible and not visible
|
||||
|
|
@ -2008,7 +2008,7 @@ class SettingsAdvanced extends SettingsEditor {
|
|||
) {
|
||||
// Case conflict with another server name
|
||||
const serverNames = document.querySelectorAll(
|
||||
"[data-services-service]",
|
||||
"[data-services-service]"
|
||||
);
|
||||
const serverNameValue = inps[i].getAttribute("value");
|
||||
serverNames.forEach((serverName) => {
|
||||
|
|
@ -2023,7 +2023,7 @@ class SettingsAdvanced extends SettingsEditor {
|
|||
}
|
||||
|
||||
const errMsg = this.container.querySelector(
|
||||
"[data-services-modal-error-msg]",
|
||||
"[data-services-modal-error-msg]"
|
||||
);
|
||||
if (!isAllValid) {
|
||||
invalidInp.classList.add("invalid");
|
||||
|
|
|
|||
Loading…
Reference in a new issue