${BDFDB.StringUtils.htmlEscape(theme.name)}
Update all variables
`;
let settingspanel = BDFDB.DOMUtils.create(settingshtml);
var settingspanelinner = settingspanel.querySelector(".BDFDB-settings-inner");
var maxwidth = BDFDB.DOMUtils.getRects(wrapper).width - 80;
for (let varstr of vars) {
varstr = varstr.split(":");
let varname = varstr.shift().trim();
varstr = varstr.join(":").split(/;[^A-z0-9]|\/\*/);
let varvalue = varstr.shift().trim();
if (varvalue) {
let vardescription = varstr.join("").replace(/\*\/|\/\*/g, "").replace(/:/g, ": ").replace(/: \//g, ":/").replace(/--/g, " --").replace(/\( --/g, "(--").trim();
vardescription = vardescription && vardescription.indexOf("*") == 0 ? vardescription.slice(1) : vardescription;
let varcontainer = BDFDB.DOMUtils.create(`
${vardescription ? `
${BDFDB.StringUtils.htmlEscape(vardescription)}
` : ""}${vars[vars.length-1] == varstr ? '' : `
`}
`);
let varinput = varcontainer.querySelector(BDFDB.dotCN.input);
varinput.value = varvalue;
varinput.setAttribute("placeholder", varvalue);
let swatch = varcontainer.querySelector(".single-swatch");
let navigator = varcontainer.querySelector(".file-navigator");
let iscolor = BDFDB.ColorUtils.getType(varvalue);
let iscomp = !iscolor && /[0-9 ]+,[0-9 ]+,[0-9 ]+/g.test(varvalue);
let isurlfile = !iscolor && !iscolor && /url\(.+\)/gi.test(varvalue);
let isfile = !iscolor && !iscolor && !isurlfile && /(http(s)?):\/\/[(www\.)?a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/.test(varvalue);
if (iscolor || iscomp) {
let color = iscomp ? BDFDB.ColorUtils.convert(varvalue.split(","), "RGB") : varvalue;
swatch.style.setProperty("background-color", color, "important");
swatch.addEventListener("click", e => {
BDFDB.ColorUtils.openPicker(varcontainer, e.currentTarget, color, {gradient:false, comp:iscomp, alpha:iscolor});
});
}
else BDFDB.DOMUtils.remove(swatch);
if (isurlfile || isfile) {
navigator.addEventListener("change", e => {
let file = navigator.querySelector("input").files[0];
if (file && file.type.indexOf("image") == 0) varinput.value = `${isurlfile ? "url('" : ""}data:${file.type};base64,${BDFDB.LibraryRequires.fs.readFileSync(file.path).toString("base64")}${isurlfile ? "')" : ""}`;
else varinput.value = varvalue;
});
}
else BDFDB.DOMUtils.remove(navigator);
settingspanelinner.appendChild(varcontainer);
}
}
BDFDB.initElements(settingspanel, this);
BDFDB.ListenerUtils.add(this, settingspanel, "click", ".update-button", () => {
let path = BDFDB.LibraryRequires.path.join(this.dir, theme.filename);
let css = BDFDB.LibraryRequires.fs.readFileSync(path).toString();
if (css) {
let amount = 0;
for (let input of settingspanel.querySelectorAll(BDFDB.dotCN.input)) {
let oldvalue = input.getAttribute("placeholder");
let newvalue = input.value;
if (newvalue && newvalue.trim() && newvalue != oldvalue) {
let varname = input.getAttribute("option");
css = css.replace(new RegExp(`--${BDFDB.StringUtils.regEscape(varname)}(\\s*):(\\s*)${BDFDB.StringUtils.regEscape(oldvalue)}`,"g"),`--${varname}$1:$2${newvalue}`);
amount++;
}
}
if (amount > 0) {
BDFDB.LibraryRequires.fs.writeFileSync(path, css);
BDFDB.NotificationUtils.toast(`Updated ${amount} variable${amount == 1 ? "" : "s"} in ${theme.filename}`, {type:"success"});
}
else BDFDB.NotificationUtils.toast(`There are no changed variables to be updated in ${theme.filename}`, {type:"warning"});
}
else BDFDB.NotificationUtils.toast(`Could not find themefile: ${theme.filename}`, {type:"error"});
});
wrapper.appendChild(settingspanel);
}
}