stuff
This commit is contained in:
Mirco Wittrien
parent
be2599e61f
commit
136f13698f
300
Plugins/BDFDB.js
300
Plugins/BDFDB.js
|
|
@ -2407,22 +2407,18 @@ var BDFDB = {
|
|||
};
|
||||
BDFDB.ColorUtils.getSwatchColor = function (container, number) {
|
||||
if (!Node.prototype.isPrototypeOf(container)) return;
|
||||
var swatches = container.querySelector(`${BDFDB.dotCN.colorpickerswatches}[number="${number}"]`);
|
||||
var swatches = container.querySelector(`${BDFDB.dotCN.colorpickerswatches}[number="${number}"], ${BDFDB.dotCN.colorpickerswatch}[number="${number}"]`);
|
||||
if (!swatches) return null;
|
||||
var ins = BDFDB.ReactUtils.getInstance(container.querySelector(`${BDFDB.dotCN.colorpickerswatches}[number="${number}"]`));
|
||||
var ins = BDFDB.ReactUtils.getInstance(swatches);
|
||||
if (ins) return BDFDB.ReactUtils.findValue(ins, "selectedColor", {up:true, blacklist:{"props":true}});
|
||||
else { // REMOVE ONCE REWRITTEN
|
||||
var swatch = swatches.querySelector(`${BDFDB.dotCN.colorpickerswatch + BDFDB.dotCN.colorpickerswatchselected}`);
|
||||
return swatch ? swatch.gradient || BDFDB.ColorUtils.convert(swatch.style.getPropertyValue("background-color"), "RGBCOMP") : null;
|
||||
}
|
||||
};
|
||||
BDFDB.ColorUtils.openPicker = function (container, target, color, options = {gradient: true, comp: false, alpha: true, callback: _ => {}}) {
|
||||
BDFDB.ColorUtils.openPicker = function (container, target, color, options = {gradient: true, alpha: true, callback: _ => {}}) {
|
||||
if (!container || !target) return;
|
||||
|
||||
if (options.comp) {
|
||||
options.gradient = false;
|
||||
options.alpha = false;
|
||||
}
|
||||
if (typeof options.callback != "function") options.callback = _ => {};
|
||||
|
||||
var hexformat = options.alpha ? "HEXA" : "HEX";
|
||||
|
|
@ -2643,25 +2639,25 @@ var BDFDB = {
|
|||
gradientpane.querySelector(".gradient-cursor.selected").firstElementChild.style.setProperty("background-color", rgb);
|
||||
updateGradient();
|
||||
}
|
||||
else container.setState({
|
||||
selectedColor: rgb,
|
||||
customColor: rgb
|
||||
});
|
||||
else {
|
||||
container.setState({
|
||||
selectedColor: rgb,
|
||||
customColor: rgb
|
||||
});
|
||||
if (container.refInput) {
|
||||
container.refInput.props.value = !rgb ? "" : (container.state.compMode ? BDFDB.ColorUtils.convert(rgb, "RGBCOMP").slice(0,3).join(",") : rgb);
|
||||
BDFDB.ReactUtils.forceUpdate(container.refInput);
|
||||
}
|
||||
}
|
||||
}
|
||||
else if (isswatches) {
|
||||
setSwatch(container.querySelector(BDFDB.dotCN.colorpickerswatch + ".selected"), null, false);
|
||||
setSwatch(container.querySelector(BDFDB.dotCN.colorpickerswatch + BDFDB.dotCN.colorpickerswatchselected), null, false);
|
||||
if (isgradient) {
|
||||
gradientpane.querySelector(".gradient-cursor.selected").firstElementChild.style.setProperty("background-color", rgb);
|
||||
updateGradient();
|
||||
}
|
||||
else setSwatch(container.querySelector(BDFDB.dotCN.colorpickerswatch + BDFDB.dotCN.colorpickerswatch), rgb, true);
|
||||
}
|
||||
else {
|
||||
let input = container.querySelector(BDFDB.dotCN.input);
|
||||
if (input) input.value = options.comp ? BDFDB.ColorUtils.convert(hex, "RGBCOMP").join(",") : rgb;
|
||||
let swatch = container.querySelector(BDFDB.dotCN.colorpickerswatchsingle);
|
||||
if (swatch) swatch.style.setProperty("background-color", rgb, "important");
|
||||
}
|
||||
if (setinput) hexinput.value = hex;
|
||||
options.callback(rgb);
|
||||
}
|
||||
|
|
@ -3744,31 +3740,31 @@ var BDFDB = {
|
|||
return ele.innerHTML;
|
||||
};
|
||||
BDFDB.StringUtils.regEscape = function (string) {
|
||||
return string.replace(/([\-\/\\\^\$\*\+\?\.\(\)\|\[\]\{\}])/g, "\\$1");
|
||||
return typeof string == "string" && string.replace(/([\-\/\\\^\$\*\+\?\.\(\)\|\[\]\{\}])/g, "\\$1");
|
||||
};
|
||||
BDFDB.StringUtils.insertNRST = function (string) {
|
||||
return string.replace(/\\r/g, "\r").replace(/\\n/g, "\n").replace(/\\t/g, "\t").replace(/\\s/g, " ");
|
||||
return typeof string == "string" && string.replace(/\\r/g, "\r").replace(/\\n/g, "\n").replace(/\\t/g, "\t").replace(/\\s/g, " ");
|
||||
};
|
||||
BDFDB.StringUtils.getParsedLength = function (string, channelid = LibraryModules.LastChannelStore.getChannelId()) {
|
||||
if (!string) return 0;
|
||||
if (typeof string != "string" || !string) return 0;
|
||||
var channel = LibraryModules.ChannelStore.getChannel(channelid);
|
||||
var length = (!channel || string.indexOf("/") == 0 || string.indexOf("s/") == 0 || string.indexOf("+:") == 0) ? string.length : LibraryModules.MessageCreationUtils.parse(channel, string).content.length;
|
||||
return length > string.length ? length : string.length;
|
||||
};
|
||||
BDFDB.StringUtils.highlight = function (text, searchstring, prefix = `<span class="${BDFDB.disCN.highlight}">`, suffix = `</span>`) {
|
||||
if (!searchstring || searchstring.length < 1) return text;
|
||||
var offset = 0, original = text;
|
||||
BDFDB.ArrayUtils.getAllIndexes(text.toUpperCase(), searchstring.toUpperCase()).forEach(index => {
|
||||
BDFDB.StringUtils.highlight = function (string, searchstring, prefix = `<span class="${BDFDB.disCN.highlight}">`, suffix = `</span>`) {
|
||||
if (typeof string != "string" || !searchstring || searchstring.length < 1) return string;
|
||||
var offset = 0, original = string;
|
||||
BDFDB.ArrayUtils.getAllIndexes(string.toUpperCase(), searchstring.toUpperCase()).forEach(index => {
|
||||
var d1 = offset * (prefix.length + suffix.length);
|
||||
index = index + d1;
|
||||
var d2 = index + searchstring.length;
|
||||
var d3 = [-1].concat(BDFDB.ArrayUtils.getAllIndexes(text.substring(0, index), "<"));
|
||||
var d4 = [-1].concat(BDFDB.ArrayUtils.getAllIndexes(text.substring(0, index), ">"));
|
||||
var d3 = [-1].concat(BDFDB.ArrayUtils.getAllIndexes(string.substring(0, index), "<"));
|
||||
var d4 = [-1].concat(BDFDB.ArrayUtils.getAllIndexes(string.substring(0, index), ">"));
|
||||
if (d3[d3.length - 1] > d4[d4.length - 1]) return;
|
||||
text = text.substring(0, index) + prefix + text.substring(index, d2) + suffix + text.substring(d2);
|
||||
string = string.substring(0, index) + prefix + string.substring(index, d2) + suffix + string.substring(d2);
|
||||
offset++;
|
||||
});
|
||||
return text || original;
|
||||
return string || original;
|
||||
};
|
||||
|
||||
BDFDB.NumberUtils = {};
|
||||
|
|
@ -3981,10 +3977,10 @@ var BDFDB = {
|
|||
collapseContainerHeader: "header-2s6x-5",
|
||||
collapseContainerInner: "inner-TkGytd",
|
||||
collapseContainerTitle: "title-ROsJi-",
|
||||
colorPickerSwatches: "swatches",
|
||||
colorPickerSwatchesDisabled: "disabled",
|
||||
colorPickerSwatchSingle: "single-swatch",
|
||||
colorPickerSwatchSelected: "selected",
|
||||
colorPickerSwatches: "swatches-QxZw_N",
|
||||
colorPickerSwatchesDisabled: "disabled-2JgNxl",
|
||||
colorPickerSwatchSingle: "single-Fbb1wB",
|
||||
colorPickerSwatchSelected: "selected-f5IVXN",
|
||||
confirmModal: "confirmModal-t-WDWJ",
|
||||
favButtonContainer: "favbutton-8Fzu45",
|
||||
guild: "guild-r3yAE_",
|
||||
|
|
@ -6206,7 +6202,7 @@ var BDFDB = {
|
|||
`${length}${!this.props.max ? "" : "/" + this.props.max}${!select ? "" : " (" + select + ")"}`,
|
||||
typeof this.props.renderSuffix == "function" && this.props.renderSuffix(length)
|
||||
].filter(n => n);
|
||||
return children.length == 1 ? children : BDFDB.ReactUtils.createElement(LibraryComponents.Flex, {
|
||||
return children.length == 1 ? children[0] : BDFDB.ReactUtils.createElement(LibraryComponents.Flex, {
|
||||
align: LibraryComponents.Flex.Align.CENTER,
|
||||
children: children
|
||||
});
|
||||
|
|
@ -6328,16 +6324,17 @@ var BDFDB = {
|
|||
props.colorRows = props.colors.length ? [props.colors.slice(0, parseInt(props.colors.length/2)), props.colors.slice(parseInt(props.colors.length/2))] : [];
|
||||
props.customColor = props.selectedColor != null ? (props.colors.indexOf(props.selectedColor) > -1 ? null : props.selectedColor) : null;
|
||||
props.customSelected = !!props.customColor;
|
||||
props.pickerConfig = BDFDB.ObjectUtils.is(props.pickerConfig) ? props.pickerConfig : {gradient: true, comp: false, alpha: true, callback: _ => {}};
|
||||
props.pickerConfig = BDFDB.ObjectUtils.is(props.pickerConfig) ? props.pickerConfig : {gradient: true, alpha: true, callback: _ => {}};
|
||||
this.state = props;
|
||||
|
||||
var swatches = this;
|
||||
this.ColorSwatch = class ColorSwatch extends LibraryModules.React.Component {
|
||||
render() {
|
||||
let usewhite = !BDFDB.ColorUtils.isBright(this.props.color);
|
||||
return BDFDB.ReactUtils.createElement("button", {
|
||||
let swatch = BDFDB.ReactUtils.createElement("button", {
|
||||
type: "button",
|
||||
className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.colorpickerswatch, this.props.isDisabled && BDFDB.disCN.colorpickerswatchdisabled, this.props.isSelected && BDFDB.disCN.colorpickerswatchselected, this.props.isCustom && BDFDB.disCN.colorpickerswatchcustom, this.props.isSingle && BDFDB.disCN.colorpickerswatchsingle, this.props.color == null && BDFDB.disCN.colorpickerswatchnocolor),
|
||||
className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.colorpickerswatch, this.props.isSingle && BDFDB.disCN.colorpickerswatchsingle, this.props.isDisabled && BDFDB.disCN.colorpickerswatchdisabled, this.props.isSelected && BDFDB.disCN.colorpickerswatchselected, this.props.isCustom && BDFDB.disCN.colorpickerswatchcustom, this.props.color == null && BDFDB.disCN.colorpickerswatchnocolor),
|
||||
number: this.props.number,
|
||||
disabled: this.props.isDisabled,
|
||||
onClick: _ => {
|
||||
if (!this.props.isSelected) {
|
||||
|
|
@ -6353,10 +6350,6 @@ var BDFDB = {
|
|||
if (swatch) BDFDB.ColorUtils.openPicker(swatches, swatch, this.props.color, swatches.state.pickerConfig);
|
||||
};
|
||||
},
|
||||
onMouseEnter: _ => {
|
||||
let swatch = this.props.isCustom || this.props.isSingle || this.props.color == null ? BDFDB.ReactUtils.findDOMNode(this) : null;
|
||||
if (swatch) BDFDB.TooltipUtils.create(swatch, this.props.isCustom || this.props.isSingle ? BDFDB.LanguageUtils.LanguageStrings.CUSTOM_COLOR : BDFDB.LanguageUtils.LanguageStrings.DEFAULT, {type: "bottom"});
|
||||
},
|
||||
style: Object.assign({}, this.props.style, {
|
||||
background: BDFDB.ObjectUtils.is(this.props.color) ? BDFDB.ColorUtils.createGradient(this.props.color) : BDFDB.ColorUtils.convert(this.props.color, "RGBA")
|
||||
}),
|
||||
|
|
@ -6377,6 +6370,11 @@ var BDFDB = {
|
|||
}) : null
|
||||
]
|
||||
});
|
||||
return this.props.isCustom || this.props.isSingle || this.props.color == null ? BDFDB.ReactUtils.createElement(LibraryComponents.TooltipContainer, {
|
||||
text: this.props.isCustom || this.props.isSingle ? BDFDB.LanguageUtils.LanguageStrings.CUSTOM_COLOR : BDFDB.LanguageUtils.LanguageStrings.DEFAULT,
|
||||
tooltipConfig: {position: this.props.isSingle ? "top" : "bottom"},
|
||||
children: swatch
|
||||
}) : swatch;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -6395,7 +6393,16 @@ var BDFDB = {
|
|||
});
|
||||
}
|
||||
render() {
|
||||
return BDFDB.ReactUtils.createElement(LibraryComponents.Flex, {
|
||||
let customSwatch = BDFDB.ReactUtils.createElement(this.ColorSwatch, {
|
||||
number: !this.state.colors.length ? (this.props.number != null ? this.props.number : 0) : null,
|
||||
color: this.state.customColor,
|
||||
isSingle: !this.state.colors.length,
|
||||
isCustom: this.state.colors.length,
|
||||
isSelected: this.state.customSelected,
|
||||
isDisabled: this.state.disabled,
|
||||
style: {margin: 0}
|
||||
});
|
||||
return !this.state.colors.length ? customSwatch : BDFDB.ReactUtils.createElement(LibraryComponents.Flex, {
|
||||
className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.colorpickerswatches, this.state.disabled && BDFDB.disCN.colorpickerswatchesdisabled),
|
||||
number: this.props.number != null ? this.props.number : 0,
|
||||
children: [
|
||||
|
|
@ -6403,19 +6410,7 @@ var BDFDB = {
|
|||
className: BDFDB.disCN.marginreset,
|
||||
shrink: 0,
|
||||
grow: 0,
|
||||
wrap: true,
|
||||
children: [
|
||||
BDFDB.ReactUtils.createElement(this.ColorSwatch, {
|
||||
color: this.state.customColor,
|
||||
isSingle: !this.state.colors.length,
|
||||
isCustom: this.state.colors.length,
|
||||
isSelected: this.state.customSelected,
|
||||
isDisabled: this.state.disabled,
|
||||
style: {
|
||||
margin: 0
|
||||
}
|
||||
})
|
||||
]
|
||||
children: customSwatch
|
||||
}),
|
||||
this.state.colors.length ? BDFDB.ReactUtils.createElement(LibraryComponents.Flex, {
|
||||
direction: LibraryComponents.Flex.Direction.VERTICAL,
|
||||
|
|
@ -6494,6 +6489,29 @@ var BDFDB = {
|
|||
}
|
||||
} : LibraryComponents.FavButton;
|
||||
|
||||
LibraryComponents.FileButton = reactInitialized ? class BDFDB_FileButton extends LibraryModules.React.Component {
|
||||
render() {
|
||||
return BDFDB.ReactUtils.createElement(LibraryComponents.Button, BDFDB.ObjectUtils.exclude(Object.assign({}, this.props, {
|
||||
onClick: e => {e.currentTarget.querySelector("input").click();},
|
||||
children: [
|
||||
BDFDB.LanguageUtils.LibraryStrings.file_navigator_text,
|
||||
BDFDB.ReactUtils.createElement("input", {
|
||||
type: "file",
|
||||
accept: this.props.filter && `${this.props.filter}/*`,
|
||||
style: {display: "none"},
|
||||
onChange: e => {
|
||||
let file = e.currentTarget.files[0];
|
||||
if (this.refInput && file && (!this.props.filter || file.type.indexOf(this.props.filter) == 0)) {
|
||||
this.refInput.props.value = `${this.props.mode == "url" ? "url('" : ""}data:${file.type};base64,${BDFDB.LibraryRequires.fs.readFileSync(file.path).toString("base64")}${this.props.mode ? "')" : ""}`;
|
||||
BDFDB.ReactUtils.forceUpdate(this.refInput);
|
||||
}
|
||||
}
|
||||
})
|
||||
]
|
||||
}), "filter"));
|
||||
}
|
||||
} : LibraryComponents.FileButton;
|
||||
|
||||
LibraryComponents.Flex = BDFDB.ModuleUtils.findByProperties("Wrap", "Direction", "Child");
|
||||
|
||||
LibraryComponents.FormComponents = Object.assign({}, BDFDB.ModuleUtils.findByProperties("FormSection", "FormText"));
|
||||
|
|
@ -6907,6 +6925,9 @@ var BDFDB = {
|
|||
let childcomponent = LibraryComponents[this.props.type];
|
||||
if (!childcomponent) return null;
|
||||
if (this.props.mini && childcomponent.Sizes) this.props.size = childcomponent.Sizes.MINI || childcomponent.Sizes.MIN;
|
||||
let childprops = BDFDB.ObjectUtils.exclude(Object.assign(BDFDB.ObjectUtils.exclude(this.props, "className", "id", "type"), this.props.childProps, {
|
||||
onChange: this.handleChange.bind(this)
|
||||
}), "basis", "dividerbottom", "dividertop", "label", "labelchildren", "mini", "note", "childProps");
|
||||
return BDFDB.ReactUtils.createElement(LibraryComponents.Flex, {
|
||||
className: BDFDB.DOMUtils.formatClassName(this.props.className, this.props.disabled && BDFDB.disCN.disabled),
|
||||
id: this.props.id,
|
||||
|
|
@ -6931,9 +6952,7 @@ var BDFDB = {
|
|||
shrink: this.props.basis ? 0 : 1,
|
||||
basis: this.props.basis,
|
||||
wrap: true,
|
||||
children: BDFDB.ReactUtils.createElement(childcomponent, BDFDB.ObjectUtils.exclude(Object.assign({}, this.props, this.props.childProps, {
|
||||
onChange: this.handleChange.bind(this)
|
||||
}), "id", "basis", "dividerbottom", "dividertop", "label", "labelchildren", "mini", "note", "childProps"))
|
||||
children: BDFDB.ReactUtils.createElement(childcomponent, childprops)
|
||||
})
|
||||
]
|
||||
}),
|
||||
|
|
@ -7067,12 +7086,8 @@ var BDFDB = {
|
|||
BDFDB.ReactUtils.forceUpdate(this);
|
||||
if (typeof this.props.onChange == "function") this.props.onChange(e, this);
|
||||
}
|
||||
handleBlur(e) {
|
||||
if (typeof this.props.onBlur == "function") this.props.onBlur(e, this);
|
||||
}
|
||||
handleFocus(e) {
|
||||
if (typeof this.props.onFocus == "function") this.props.onFocus(e, this);
|
||||
}
|
||||
handleBlur(e) {if (typeof this.props.onBlur == "function") this.props.onBlur(e, this);}
|
||||
handleFocus(e) {if (typeof this.props.onFocus == "function") this.props.onFocus(e, this);}
|
||||
render() {
|
||||
return BDFDB.ReactUtils.createElement(NativeSubComponents.TextArea, Object.assign({}, this.props, {
|
||||
onChange: this.handleChange.bind(this),
|
||||
|
|
@ -7085,30 +7100,18 @@ var BDFDB = {
|
|||
LibraryComponents.TextElement = BDFDB.ModuleUtils.findByName("Text");
|
||||
|
||||
LibraryComponents.TextInput = reactInitialized ? class BDFDB_TextInput extends LibraryModules.React.Component {
|
||||
handleKeyDown(e) {
|
||||
if (typeof this.props.onKeyDown == "function") this.props.onKeyDown(e, this);
|
||||
}
|
||||
handleChange(e) {
|
||||
e = BDFDB.ObjectUtils.is(e) ? e.currentTarget.value : e;
|
||||
this.props.value = e;
|
||||
BDFDB.ReactUtils.forceUpdate(this);
|
||||
if (typeof this.props.onChange == "function") this.props.onChange(e, this);
|
||||
}
|
||||
handleInput(e) {
|
||||
if (typeof this.props.onInput == "function") this.props.onInput(BDFDB.ObjectUtils.is(e) ? e.currentTarget.value : e, this);
|
||||
}
|
||||
handleBlur(e) {
|
||||
if (typeof this.props.onBlur == "function") this.props.onBlur(e, this);
|
||||
}
|
||||
handleFocus(e) {
|
||||
if (typeof this.props.onFocus == "function") this.props.onFocus(e, this);
|
||||
}
|
||||
handleMouseEnter(e) {
|
||||
if (typeof this.props.onMouseEnter == "function") this.props.onMouseEnter(e, this);
|
||||
}
|
||||
handleMouseLeave(e) {
|
||||
if (typeof this.props.onMouseLeave == "function") this.props.onMouseLeave(e, this);
|
||||
}
|
||||
handleInput(e) {if (typeof this.props.onInput == "function") this.props.onInput(BDFDB.ObjectUtils.is(e) ? e.currentTarget.value : e, this);}
|
||||
handleKeyDown(e) {if (typeof this.props.onKeyDown == "function") this.props.onKeyDown(e, this);}
|
||||
handleBlur(e) {if (typeof this.props.onBlur == "function") this.props.onBlur(e, this);}
|
||||
handleFocus(e) {if (typeof this.props.onFocus == "function") this.props.onFocus(e, this);}
|
||||
handleMouseEnter(e) {if (typeof this.props.onMouseEnter == "function") this.props.onMouseEnter(e, this);}
|
||||
handleMouseLeave(e) {if (typeof this.props.onMouseLeave == "function") this.props.onMouseLeave(e, this);}
|
||||
handleNumberButton(ins, value) {
|
||||
BDFDB.TimeUtils.clear(ins.pressedTimeout);
|
||||
ins.pressedTimeout = BDFDB.TimeUtils.timeout(_ => {
|
||||
|
|
@ -7130,61 +7133,79 @@ var BDFDB = {
|
|||
});
|
||||
input.patched = true;
|
||||
}
|
||||
if (this.props.type == "color") {
|
||||
let swatchinstance = BDFDB.ReactUtils.findOwner(this, {name: "BDFDB_ColorSwatches"});
|
||||
if (swatchinstance) swatchinstance.refInput = this;
|
||||
}
|
||||
else if (this.props.type == "file") {
|
||||
let navigatorinstance = BDFDB.ReactUtils.findOwner(this, {name: "BDFDB_FileButton"});
|
||||
if (navigatorinstance) navigatorinstance.refInput = this;
|
||||
}
|
||||
}
|
||||
render() {
|
||||
let childprops = Object.assign({}, this.props, {
|
||||
className: BDFDB.DOMUtils.formatClassName(this.props.size && LibraryComponents.TextInput.Sizes[this.props.size.toUpperCase()] && BDFDB.disCN["input" + this.props.size.toLowerCase()] || BDFDB.disCN.inputdefault, this.props.inputClassName, this.props.focused && BDFDB.disCN.inputfocused, this.props.error || this.props.errorMessage ? BDFDB.disCN.inputerror : (this.props.success && BDFDB.disCN.inputsuccess), this.props.disabled && BDFDB.disCN.inputdisabled, this.props.editable && BDFDB.disCN.inputeditable),
|
||||
type: this.props.type == "color" || this.props.type == "file" ? "text" : this.props.type,
|
||||
onKeyDown: this.handleKeyDown.bind(this),
|
||||
onChange: this.handleChange.bind(this),
|
||||
onInput: this.handleInput.bind(this),
|
||||
onBlur: this.handleBlur.bind(this),
|
||||
onFocus: this.handleFocus.bind(this),
|
||||
onMouseEnter: this.handleMouseEnter.bind(this),
|
||||
onMouseLeave: this.handleMouseLeave.bind(this),
|
||||
ref: this.props.inputRef
|
||||
});
|
||||
BDFDB.ObjectUtils.delete(childprops, "errorMessage", "focused", "error", "success", "inputClassName", "inputPrefix", "size", "editable", "inputRef", "style");
|
||||
return BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.inputwrapper, this.props.type == "number" && (this.props.size && LibraryComponents.TextInput.Sizes[this.props.size.toUpperCase()] && BDFDB.disCN["inputnumberwrapper" + this.props.size.toLowerCase()] || BDFDB.disCN.inputnumberwrapperdefault), this.props.className),
|
||||
style: this.props.style,
|
||||
children: [
|
||||
this.props.inputPrefix ? BDFDB.ReactUtils.createElement("span", {
|
||||
className: BDFDB.disCN.inputprefix
|
||||
}) : null,
|
||||
this.props.type == "number" ? BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputnumberbuttons,
|
||||
children: [
|
||||
BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputnumberbuttonup,
|
||||
onClick: e => {
|
||||
var min = parseInt(this.props.min);
|
||||
var max = parseInt(this.props.max);
|
||||
var newv = parseInt(this.props.value) + 1 || min || 0;
|
||||
if (isNaN(max) || !isNaN(max) && newv <= max) this.handleNumberButton.bind(this)(e._targetInst, isNaN(min) || !isNaN(min) && newv >= min ? newv : min);
|
||||
}
|
||||
}),
|
||||
BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputnumberbuttondown,
|
||||
onClick: e => {
|
||||
var min = parseInt(this.props.min);
|
||||
var max = parseInt(this.props.max);
|
||||
var newv = parseInt(this.props.value) - 1 || min || 0;
|
||||
if (isNaN(min) || !isNaN(min) && newv >= min) this.handleNumberButton.bind(this)(e._targetInst, isNaN(max) || !isNaN(max) && newv <= max ? newv : max);
|
||||
}
|
||||
})
|
||||
]
|
||||
}) : null,
|
||||
BDFDB.ReactUtils.createElement("input", childprops),
|
||||
this.props.type == "color" ? BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputerrormessage,
|
||||
children: this.props.errorMessage
|
||||
}) : null,
|
||||
this.props.errorMessage ? BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputerrormessage,
|
||||
children: this.props.errorMessage
|
||||
}) : null,
|
||||
].filter(n => n)
|
||||
let children = [
|
||||
BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.DOMUtils.formatClassName(BDFDB.disCN.inputwrapper, this.props.type == "number" && (this.props.size && LibraryComponents.TextInput.Sizes[this.props.size.toUpperCase()] && BDFDB.disCN["inputnumberwrapper" + this.props.size.toLowerCase()] || BDFDB.disCN.inputnumberwrapperdefault), this.props.className),
|
||||
style: this.props.style,
|
||||
children: [
|
||||
this.props.inputPrefix ? BDFDB.ReactUtils.createElement("span", {
|
||||
className: BDFDB.disCN.inputprefix
|
||||
}) : null,
|
||||
this.props.type == "number" ? BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputnumberbuttons,
|
||||
children: [
|
||||
BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputnumberbuttonup,
|
||||
onClick: e => {
|
||||
var min = parseInt(this.props.min);
|
||||
var max = parseInt(this.props.max);
|
||||
var newv = parseInt(this.props.value) + 1 || min || 0;
|
||||
if (isNaN(max) || !isNaN(max) && newv <= max) this.handleNumberButton.bind(this)(e._targetInst, isNaN(min) || !isNaN(min) && newv >= min ? newv : min);
|
||||
}
|
||||
}),
|
||||
BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputnumberbuttondown,
|
||||
onClick: e => {
|
||||
var min = parseInt(this.props.min);
|
||||
var max = parseInt(this.props.max);
|
||||
var newv = parseInt(this.props.value) - 1 || min || 0;
|
||||
if (isNaN(min) || !isNaN(min) && newv >= min) this.handleNumberButton.bind(this)(e._targetInst, isNaN(max) || !isNaN(max) && newv <= max ? newv : max);
|
||||
}
|
||||
})
|
||||
]
|
||||
}) : null,
|
||||
BDFDB.ReactUtils.createElement("input", BDFDB.ObjectUtils.exclude(Object.assign({}, this.props, {
|
||||
className: BDFDB.DOMUtils.formatClassName(this.props.size && LibraryComponents.TextInput.Sizes[this.props.size.toUpperCase()] && BDFDB.disCN["input" + this.props.size.toLowerCase()] || BDFDB.disCN.inputdefault, this.props.inputClassName, this.props.focused && BDFDB.disCN.inputfocused, this.props.error || this.props.errorMessage ? BDFDB.disCN.inputerror : (this.props.success && BDFDB.disCN.inputsuccess), this.props.disabled && BDFDB.disCN.inputdisabled, this.props.editable && BDFDB.disCN.inputeditable),
|
||||
type: this.props.type == "color" || this.props.type == "file" ? "text" : this.props.type,
|
||||
onChange: this.handleChange.bind(this),
|
||||
onInput: this.handleInput.bind(this),
|
||||
onKeyDown: this.handleKeyDown.bind(this),
|
||||
onBlur: this.handleBlur.bind(this),
|
||||
onFocus: this.handleFocus.bind(this),
|
||||
onMouseEnter: this.handleMouseEnter.bind(this),
|
||||
onMouseLeave: this.handleMouseLeave.bind(this),
|
||||
maxLength: this.props.type == "file" ? false : this.props.maxLength,
|
||||
ref: this.props.inputRef
|
||||
}), "errorMessage", "focused", "error", "success", "inputClassName", "inputPrefix", "size", "editable", "inputRef", "style", "mode", "filter")),
|
||||
this.props.errorMessage ? BDFDB.ReactUtils.createElement("div", {
|
||||
className: BDFDB.disCN.inputerrormessage,
|
||||
children: this.props.errorMessage
|
||||
}) : null,
|
||||
].filter(n => n)
|
||||
}),
|
||||
this.props.type == "color" ? BDFDB.ReactUtils.createElement(LibraryComponents.ColorSwatches, {
|
||||
colors: [],
|
||||
compMode: this.props.mode == "comp",
|
||||
color: this.props.value && this.props.mode == "comp" ? BDFDB.ColorUtils.convert(this.props.value.split(","), "RGB") : this.props.value,
|
||||
pickerConfig: {gradient:false, alpha:this.props.mode != "comp"}
|
||||
}) : null,
|
||||
this.props.type == "file" ? BDFDB.ReactUtils.createElement(LibraryComponents.FileButton, {
|
||||
filter: this.props.filter
|
||||
}) : null
|
||||
].filter(n => n);
|
||||
return children.length == 1 ? children[0] : BDFDB.ReactUtils.createElement(LibraryComponents.Flex, {
|
||||
align: LibraryComponents.Flex.Align.CENTER,
|
||||
children: children.map((child, i) => i == 0 ? BDFDB.ReactUtils.createElement(LibraryComponents.Flex.Child, {children: child}) : child)
|
||||
});
|
||||
}
|
||||
} : LibraryComponents.TextInput;
|
||||
|
|
@ -7499,6 +7520,15 @@ var BDFDB = {
|
|||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
${BDFDB.dotCN.colorpickerswatches + BDFDB.dotCN.colorpickerswatchesdisabled} {
|
||||
cursor: no-drop;
|
||||
filter: grayscale(70%) brightness(50%);
|
||||
}
|
||||
${BDFDB.dotCN.colorpickerswatchsingle} {
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
${BDFDB.dotCN.svgicon} {
|
||||
color: var(--interactive-normal);
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -3,7 +3,7 @@
|
|||
class ThemeSettings {
|
||||
getName () {return "ThemeSettings";}
|
||||
|
||||
getVersion () {return "1.1.5";}
|
||||
getVersion () {return "1.1.6";}
|
||||
|
||||
getAuthor () {return "DevilBro";}
|
||||
|
||||
|
|
@ -11,11 +11,11 @@ class ThemeSettings {
|
|||
|
||||
constructor () {
|
||||
this.changelog = {
|
||||
"improved":[["Colorpicker & Filenavigator","The plugin now tries to guess if whether an input is used as a colorinput or a fileinput and adds elements to more easily change them"]]
|
||||
"improved":[["New Library Structure & React","Restructured my Library and switched to React rendering instead of DOM manipulation"]]
|
||||
};
|
||||
|
||||
this.patchModules = {
|
||||
"V2C_ThemeCard":"componentDidMount"
|
||||
V2C_ThemeCard: "render"
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -59,7 +59,8 @@ class ThemeSettings {
|
|||
if (global.BDFDB && typeof BDFDB === "object" && BDFDB.loaded) {
|
||||
this.stopping = true;
|
||||
|
||||
BDFDB.DOMUtils.remove(".themes-settings-button",".themes-settings-footer");
|
||||
BDFDB.ModuleUtils.forceAllUpdates(this);
|
||||
|
||||
BDFDB.PluginUtils.clear(this);
|
||||
}
|
||||
}
|
||||
|
|
@ -67,38 +68,40 @@ class ThemeSettings {
|
|||
|
||||
// begin of own functions
|
||||
|
||||
processV2CThemeCard (instance, wrapper) {
|
||||
if (instance.props && instance.props.theme && !wrapper.querySelector(BDFDB.dotCN._reposettingsbutton + ".themes-settings-button")) {
|
||||
let vars = this.getThemeVars(instance.props.theme.css);
|
||||
processV2CThemeCard (e) {
|
||||
if (e.instance.props && e.instance.props.theme && !e.instance.state.settings) {
|
||||
let vars = this.getThemeVars(e.instance.props.theme.css);
|
||||
if (vars.length) {
|
||||
let footer = wrapper.querySelector(BDFDB.dotCN._repofooter);
|
||||
if (!footer) {
|
||||
footer = document.createElement("div");
|
||||
footer.className = BDFDB.disCNS._repofooter + "themes-settings-footer";
|
||||
wrapper.appendChild(footer);
|
||||
let [children, index] = BDFDB.ReactUtils.findChildren(e.returnvalue, {props: [["className", BDFDB.disCN._repofooter]]});
|
||||
if (index == -1) {
|
||||
let footer = BDFDB.ReactUtils.createElement("div", {className: BDFDB.disCN._repofooter, children: []});
|
||||
e.returnvalue.props.children.push(footer);
|
||||
children = footer.props.children;
|
||||
}
|
||||
let button = document.createElement("button");
|
||||
button.className = BDFDB.disCNS._reposettingsbutton + "themes-settings-button";
|
||||
button.innerText = "Settings";
|
||||
footer.appendChild(button);
|
||||
button.addEventListener("click", () => {
|
||||
BDFDB.DOMUtils.addClass(wrapper, BDFDB.disCN._reposettingsopen);
|
||||
BDFDB.DOMUtils.removeClass(wrapper, BDFDB.disCN._reposettingsclosed);
|
||||
let children = [];
|
||||
while (wrapper.childElementCount) {
|
||||
children.push(wrapper.firstChild);
|
||||
wrapper.firstChild.remove();
|
||||
else children = children[index].props.children;
|
||||
children.push(BDFDB.ReactUtils.createElement("button", {
|
||||
className: BDFDB.disCNS._reposettingsbutton,
|
||||
children: "Settings",
|
||||
onClick: event => {
|
||||
let wrapper = BDFDB.DOMUtils.getParent(BDFDB.dotCN._reposettingsclosed, event.currentTarget);
|
||||
BDFDB.DOMUtils.addClass(wrapper, BDFDB.disCN._reposettingsopen);
|
||||
BDFDB.DOMUtils.removeClass(wrapper, BDFDB.disCN._reposettingsclosed);
|
||||
let children = [];
|
||||
while (wrapper.childElementCount) {
|
||||
children.push(wrapper.firstChild);
|
||||
wrapper.firstChild.remove();
|
||||
}
|
||||
let closebutton = BDFDB.DOMUtils.create(`<div style="float: right; cursor: pointer;"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12" style="width: 18px; height: 18px;"><g class="background" fill="none" fill-rule="evenodd"><path d="M0 0h12v12H0"></path><path class="fill" fill="#dcddde" d="M9.5 3.205L8.795 2.5 6 5.295 3.205 2.5l-.705.705L5.295 6 2.5 8.795l.705.705L6 6.705 8.795 9.5l.705-.705L6.705 6"></path></g></svg></div>`);
|
||||
wrapper.appendChild(closebutton);
|
||||
closebutton.addEventListener("click", () => {
|
||||
BDFDB.DOMUtils.removeClass(wrapper, BDFDB.disCN._reposettingsopen);
|
||||
BDFDB.DOMUtils.addClass(wrapper, BDFDB.disCN._reposettingsclosed);
|
||||
while (wrapper.childElementCount) wrapper.firstChild.remove();
|
||||
while (children.length) wrapper.appendChild(children.shift());
|
||||
})
|
||||
this.createThemeSettings(wrapper, e.instance.props.theme, vars);
|
||||
}
|
||||
let closebutton = BDFDB.DOMUtils.create(`<div style="float: right; cursor: pointer;"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12" style="width: 18px; height: 18px;"><g class="background" fill="none" fill-rule="evenodd"><path d="M0 0h12v12H0"></path><path class="fill" fill="#dcddde" d="M9.5 3.205L8.795 2.5 6 5.295 3.205 2.5l-.705.705L5.295 6 2.5 8.795l.705.705L6 6.705 8.795 9.5l.705-.705L6.705 6"></path></g></svg></div>`);
|
||||
wrapper.appendChild(closebutton);
|
||||
closebutton.addEventListener("click", () => {
|
||||
BDFDB.DOMUtils.removeClass(wrapper, BDFDB.disCN._reposettingsopen);
|
||||
BDFDB.DOMUtils.addClass(wrapper, BDFDB.disCN._reposettingsclosed);
|
||||
while (wrapper.childElementCount) wrapper.firstChild.remove();
|
||||
while (children.length) wrapper.appendChild(children.shift());
|
||||
})
|
||||
this.createThemeSettings(wrapper, instance.props.theme, vars);
|
||||
});
|
||||
}));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -118,12 +121,37 @@ class ThemeSettings {
|
|||
|
||||
createThemeSettings (wrapper, theme, vars) {
|
||||
if (!global.BDFDB || typeof BDFDB != "object" || !BDFDB.loaded || !this.started) return;
|
||||
var settingshtml = `<div class="theme-settings" id="theme-settings-${theme.name}"><div class="${theme.name}-settings BDFDB-settings"><div class="${BDFDB.disCNS.titledefault + BDFDB.disCNS.titlesize18 + BDFDB.disCNS.height24 + BDFDB.disCNS.weightnormal + BDFDB.disCN.marginbottom8}">${BDFDB.StringUtils.htmlEscape(theme.name)}</div><div class="BDFDB-settings-inner"><div class="${BDFDB.disCNS.flex + BDFDB.disCNS.horizontal + BDFDB.disCNS.justifystart + BDFDB.disCNS.aligncenter + BDFDB.disCNS.nowrap + BDFDB.disCN.marginbottom8}" style="flex: 0 0 auto;"><h3 class="${BDFDB.disCNS.titledefault + BDFDB.disCNS.marginreset + BDFDB.disCNS.weightmedium + BDFDB.disCNS.titlesize16 + BDFDB.disCNS.height24 + BDFDB.disCN.flexchild}" style="flex: 1 1 auto;">Update all variables</h3><button type="button" class="${BDFDB.disCNS.flexchild + BDFDB.disCNS.button + BDFDB.disCNS.buttonlookfilled + BDFDB.disCNS.buttoncolorgreen + BDFDB.disCNS.buttonsizemedium + BDFDB.disCN.buttongrow} update-button" style="flex: 0 0 auto;"><div class="${BDFDB.disCN.buttoncontents}">Update</div></button></div></div></div>`;
|
||||
|
||||
let settingspanel = BDFDB.DOMUtils.create(settingshtml);
|
||||
var settingspanelinner = settingspanel.querySelector(".BDFDB-settings-inner");
|
||||
|
||||
var maxwidth = BDFDB.DOMUtils.getRects(wrapper).width - 80;
|
||||
let settingsitems = [];
|
||||
|
||||
settingsitems.push(BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.SettingsItem, {
|
||||
type: "Button",
|
||||
className: BDFDB.disCN.marginbottom8,
|
||||
color: BDFDB.LibraryComponents.Button.Colors.GREEN,
|
||||
label: "Update all variables",
|
||||
onClick: _ => {
|
||||
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 wrapper.querySelectorAll(BDFDB.dotCN.input)) {
|
||||
let oldvalue = input.getAttribute("placeholder");
|
||||
let newvalue = input.value;
|
||||
if (newvalue && newvalue.trim() && newvalue != oldvalue) {
|
||||
let varname = input.getAttribute("varname");
|
||||
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"});
|
||||
},
|
||||
children: "Update"
|
||||
}));
|
||||
|
||||
for (let varstr of vars) {
|
||||
varstr = varstr.split(":");
|
||||
|
|
@ -131,66 +159,42 @@ class ThemeSettings {
|
|||
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(`<div class="${BDFDB.disCNS.flex + BDFDB.disCNS.horizontal + BDFDB.disCNS.directioncolumn + BDFDB.disCNS.justifystart + BDFDB.disCNS.alignstretch + BDFDB.disCNS.nowrap + BDFDB.disCN.marginbottom20} varcontainer" style="flex: 1 1 auto;"><div class="${BDFDB.disCNS.flex + BDFDB.disCNS.horizontal + BDFDB.disCNS.justifystart + BDFDB.disCNS.aligncenter + BDFDB.disCN.nowrap}" style="flex: 1 1 auto;"><h3 class="${BDFDB.disCNS.titledefault + BDFDB.disCNS.weightmedium + BDFDB.disCNS.titlesize16 + BDFDB.disCN.flexchild} BDFDB-textscrollwrapper" style="flex: 0 0 30%;"><div class="BDFDB-textscroll">${varname[0].toUpperCase() + varname.slice(1)}</div></h3><div class="${BDFDB.disCNS.inputwrapper + BDFDB.disCNS.vertical + BDFDB.disCNS.flex2 + BDFDB.disCN.directioncolumn}" style="flex: 1 1 auto;"><input type="text" option="${varname}" class="${BDFDB.disCNS.inputdefault + BDFDB.disCNS.input + BDFDB.disCN.titlesize16} varinput"></div><button type="button" class="${BDFDB.disCN.colorpickerswatch} single-swatch" style="background-color: black;"></button><button type="button" class="${BDFDB.disCNS.flexchild + BDFDB.disCNS.button + BDFDB.disCNS.buttonlookfilled + BDFDB.disCNS.buttoncolorbrand + BDFDB.disCNS.buttonsizemedium + BDFDB.disCN.buttongrow} file-navigator" style="flex: 0 0 auto;"><div class="${BDFDB.disCN.buttoncontents}"></div><input type="file" accept="image/*" style="display:none!important;"></button></div>${vardescription ? `<div class="${BDFDB.disCNS.description + BDFDB.disCNS.note + BDFDB.disCN.primary} BDFDB-textscrollwrapper" style="flex: 1 1 auto; max-width: ${maxwidth}px !important;"><div class="BDFDB-textscroll">${BDFDB.StringUtils.htmlEscape(vardescription)}</div></div>` : ""}${vars[vars.length-1] == varstr ? '' : `<div class="${BDFDB.disCNS.divider + BDFDB.disCN.dividerdefault}"></div>`}</div>`);
|
||||
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 childType = "text", childMode = "";
|
||||
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});
|
||||
});
|
||||
childType = "color";
|
||||
childMode = iscomp && "comp";
|
||||
}
|
||||
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++;
|
||||
else {
|
||||
let isurlfile = /url\(.+\)/gi.test(varvalue);
|
||||
let isfile = !isurlfile && /(http(s)?):\/\/[(www\.)?a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/.test(varvalue);
|
||||
if (isfile || isurlfile) {
|
||||
childType = "file";
|
||||
childMode = isurlfile && "url";
|
||||
}
|
||||
}
|
||||
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"});
|
||||
let vardescription = varstr.join("").replace(/\*\/|\/\*/g, "").replace(/:/g, ": ").replace(/: \//g, ":/").replace(/--/g, " --").replace(/\( --/g, "(--").trim();
|
||||
settingsitems.push(BDFDB.ReactUtils.createElement(BDFDB.LibraryComponents.SettingsItem, {
|
||||
className: BDFDB.disCN.marginbottom20,
|
||||
dividerbottom: vars[vars.length-1] != varstr,
|
||||
type: "TextInput",
|
||||
childProps: {
|
||||
type: childType,
|
||||
mode: childMode,
|
||||
filter: childType == "file" && "image",
|
||||
filter: childType == "file" && "image"
|
||||
},
|
||||
label: varname[0].toUpperCase() + varname.slice(1),
|
||||
note: vardescription && vardescription.indexOf("*") == 0 ? vardescription.slice(1) : vardescription,
|
||||
basis: "70%",
|
||||
varname: varname,
|
||||
value: varvalue,
|
||||
placeholder: varvalue
|
||||
}));
|
||||
}
|
||||
else BDFDB.NotificationUtils.toast(`Could not find themefile: ${theme.filename}`, {type:"error"});
|
||||
});
|
||||
|
||||
wrapper.appendChild(settingspanel);
|
||||
}
|
||||
|
||||
wrapper.appendChild(BDFDB.PluginUtils.createSettingsPanel(theme, settingsitems));
|
||||
}
|
||||
}
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
--dgeneraltransparency: 0.15;
|
||||
--dmessagetransparency: 0.5;
|
||||
--dguildchanneltransparency: 0.15;
|
||||
--dmemberlistransparency: 0.0;
|
||||
--dmemberlisttransparency: 0.0;
|
||||
--daccentcolor: 190,78,180;
|
||||
|
||||
--dbackground: url(https://mwittrien.github.io/BetterDiscordAddons/ThemesV2/BasicBackground/background.jpg);
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
--vtransparencyalpha: var(--transparencyalpha, var(--dtransparencyalpha));
|
||||
--vmessagetransparency: var(--messagetransparency, var(--dmessagetransparency));
|
||||
--vguildchanneltransparency: var(--guildchanneltransparency, var(--dguildchanneltransparency));
|
||||
--vmemberlistransparency: var(--memberlistransparency, var(--dmemberlistransparency));
|
||||
--vmemberlisttransparency: var(--memberlisttransparency, var(--dmemberlisttransparency));
|
||||
--vaccentcolor: var(--accentcolor, var(--daccentcolor));
|
||||
--vlinkcolor: var(--vaccentcolor);
|
||||
|
||||
|
|
@ -188,7 +188,7 @@ body, /* body */
|
|||
background-color: rgba(var(--vtransparencycolor), var(--vguildchanneltransparency));
|
||||
}
|
||||
#app-mount .membersWrap-2h-GB4 { /* members container */
|
||||
background-color: rgba(var(--vtransparencycolor), var(--vmemberlistransparency));
|
||||
background-color: rgba(var(--vtransparencycolor), var(--vmemberlisttransparency));
|
||||
}
|
||||
|
||||
.themeDark-3Ap_7i, .themeLight-2aS1dz { /* errorscreen */
|
||||
|
|
@ -5587,7 +5587,7 @@ body.foldercontentopened .titleBar-AC4pGV.typeMacOS-3EmCyP .macButtons-2MuSAC {
|
|||
z-index: -1;
|
||||
}
|
||||
#MemberCount:after {
|
||||
background-color: rgba(var(--vtransparencycolor), calc(var(--vtransparencyalpha) + var(--vmemberlistransparency) * 0.85));
|
||||
background-color: rgba(var(--vtransparencycolor), calc(var(--vtransparencyalpha) + var(--vmemberlisttransparency) * 0.85));
|
||||
}
|
||||
#MemberCount:before {
|
||||
background: var(--vbackground) center/var(--vbackgroundsize);
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
--transparencyalpha: 0.15; /* default: 0.15 (general darkness of the app) */
|
||||
--messagetransparency: 0.5; /* default: 0.5 (additional shadows behind messages, set to 0 to remove boxes) */
|
||||
--guildchanneltransparency: 0.15; /* default: 0.15 (additional darkness for guild/channel list) */
|
||||
--memberlistransparency: 0.0; /* default: 0.0 (additional darkness for member list) */
|
||||
--memberlisttransparency: 0.0; /* default: 0.0 (additional darkness for member list) */
|
||||
--accentcolor: 190,78,180; /* default: 190,78,180 (blurple: 114,137,218 bd-blue: 58,113,193) */
|
||||
|
||||
--background: url(https://mwittrien.github.io/BetterDiscordAddons/ThemesV2/BasicBackground/background.jpg); /* general background image */
|
||||
|
|
|
|||
Loading…
Reference in New Issue