lightcordwarez
/
BetterDiscordAddons
mirror of https://github.com/mwittrien/BetterDiscordAddons.git
1
0
Fork 0
Code Issues 24 Releases Wiki Activity

Added charcounter to nickname change modal

This commit is contained in:
Mirco Wittrien 2018-12-03 16:35:58 +01:00
parent a8b8feaafc
commit a76fe62a1a
1 changed files with 77 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
Plugins/CharCounter/CharCounter.plugin.js
View File

@ -4,7 +4,7 @@ class CharCounter {
initConstructor () {
this.selecting = false;
this.counterMarkup = `<div id="charcounter"></div>`;
this.counterMarkup = `<div id="charcounter" class="charcounter"></div>`;
this.css = `
${BDFDB.dotCN.themelight} #charcounter {
@ -18,6 +18,9 @@ class CharCounter {
${BDFDB.dotCNS.typing + BDFDB.dotCN.cooldownwrapper} {
margin-right: 64px;
}
.charcounter-added {
position: relative !important;
}
#charcounter {
display: block;
position: absolute;
@ -25,7 +28,7 @@ class CharCounter {
pointer-events: none;
}
#charcounter.normal {
right: 0;
right: 0;
bottom: -1.3em;
}
#charcounter.edit {
@ -33,8 +36,12 @@ class CharCounter {
bottom: -1.3em;
}
#charcounter.form {
right: 0;
right: 0;
bottom: -1.0em;
}
#charcounter.nickname {
right: 0;
top: 0;
}`;
}
@ -42,7 +49,7 @@ class CharCounter {
getDescription () {return "Adds a charcounter in the chat.";}
getVersion () {return "1.2.6";}
getVersion () {return "1.2.8";}
getAuthor () {return "DevilBro";}
@ -76,8 +83,8 @@ class CharCounter {
(change, i) => {
if (change.addedNodes) {
change.addedNodes.forEach((node) => {
if (node && node.tagName && node.querySelector(BDFDB.dotCN.textareainner + ":not(" + BDFDB.dotCN.textareainnerdisabled + ")")) {
this.appendCounter(node.querySelector("textarea"));
if (node.tagName && node.querySelector(BDFDB.dotCN.textareainner + ":not(" + BDFDB.dotCN.textareainnerdisabled + ")")) {
this.checkTextarea(node.querySelector("textarea"));
}
});
}
@ -85,8 +92,27 @@ class CharCounter {
);
});
BDFDB.addObserver(this, BDFDB.dotCN.appmount, {name:"textareaObserver",instance:observer}, {childList: true, subtree: true});
observer = new MutationObserver((changes, _) => {
changes.forEach(
(change, i) => {
if (change.addedNodes) {
change.addedNodes.forEach((node) => {
let resetnickname;
if (node.tagName && (resetnickname = node.querySelector(BDFDB.dotCN.reset)) != null) {
if (BDFDB.getInnerText(resetnickname.firstElementChild) == BDFDB.LanguageStrings.RESET_NICKNAME) {
this.appendCounter(node.querySelector(BDFDB.dotCN.inputdefault), "nickname");
console.log("yes");
}
}
});
}
}
);
});
BDFDB.addObserver(this, BDFDB.dotCN.app + " ~ [class^='theme']:not([class*='popouts'])", {name:"modalObserver",instance:observer}, {childList: true, subtree: true});
document.querySelectorAll("textarea").forEach(textarea => {this.appendCounter(textarea);});
document.querySelectorAll("textarea").forEach(textarea => {this.checkTextarea(textarea);});
}
else {
console.error(this.getName() + ": Fatal Error: Could not load BD functions!");
@ -96,7 +122,7 @@ class CharCounter {
stop () {
if (typeof BDFDB === "object") {
$("#charcounter").remove();
$(".charcounter").remove();
$(".charcounter-added").removeClass("charcounter-added");
BDFDB.unloadMessage(this);
@ -105,49 +131,55 @@ class CharCounter {
// begin of own functions
appendCounter (textarea) {
checkTextarea (textarea) {
if (!textarea) return;
var textareaWrap = textarea.parentElement;
if (textareaWrap && !textareaWrap.querySelector("#charcounter")) {
var textareaInstance = BDFDB.getOwnerInstance({"node":textarea, "props":["handlePaste","saveCurrentText"], "up":true});
if (textareaInstance && textareaInstance.props && textareaInstance.props.type) {
var counter = $(this.counterMarkup);
counter.addClass(textareaInstance.props.type).appendTo(textareaWrap);
var updateCounter = () => {
var selection = textarea.selectionEnd - textarea.selectionStart == 0 ? "" : " (" + (textarea.selectionEnd - textarea.selectionStart) + ")";
counter.text(BDFDB.getParsedLength(textarea.value) + "/2000" + selection);
}
textareaWrap.parentElement.classList.add("charcounter-added");
$(textarea)
.off("keydown." + this.getName() + " click." + this.getName())
.on("keydown." + this.getName() + " click." + this.getName(), e => {
clearTimeout(textarea.charcountertimeout);
textarea.charcountertimeout = setTimeout(() => {updateCounter();},100);
})
.off("mousedown." + this.getName())
.on("mousedown." + this.getName(), e => {
this.selecting = true;
});
$(document)
.off("mouseup." + this.getName())
.on("mouseup." + this.getName(), e => {
if (this.selecting) {
this.selecting = false;
}
})
.off("mousemove." + this.getName())
.on("mousemove." + this.getName(), e => {
if (this.selecting) {
setTimeout(() => {
updateCounter();
},10);
}
});
updateCounter();
this.appendCounter(textarea, textareaInstance.props.type);
}
}
}
appendCounter (input, type) {
if (!input) return;
var counter = $(this.counterMarkup);
counter.addClass(type).appendTo(input.parentElement);
var updateCounter = () => {
var selection = input.selectionEnd - input.selectionStart == 0 ? "" : " (" + (input.selectionEnd - input.selectionStart) + ")";
counter.text(type == "nickname" ? (input.value.length + "/32" + selection) : (BDFDB.getParsedLength(input.value) + "/2000" + selection));
}
input.parentElement.parentElement.classList.add("charcounter-added");
$(input)
.attr("maxlength", type == "nickname" ? 32 : "")
.off("keydown." + this.getName() + " click." + this.getName())
.on("keydown." + this.getName() + " click." + this.getName(), e => {
clearTimeout(input.charcountertimeout);
input.charcountertimeout = setTimeout(() => {updateCounter();},100);
})
.off("mousedown." + this.getName())
.on("mousedown." + this.getName(), e => {
this.selecting = true;
});
$(document)
.off("mouseup." + this.getName())
.on("mouseup." + this.getName(), e => {
if (this.selecting) {
this.selecting = false;
}
})
.off("mousemove." + this.getName())
.on("mousemove." + this.getName(), e => {
if (this.selecting) {
setTimeout(() => {
updateCounter();
},10);
}
});
updateCounter();
}
}