Added ServerFolders support to DisplayServersAsChannels

This commit is contained in:
Mirco Wittrien 2018-10-25 09:48:10 +02:00
parent 4b1032460d
commit 358607341b
2 changed files with 97 additions and 61 deletions

View File

@ -12,52 +12,60 @@ class DisplayServersAsChannels {
</svg>`;
this.css = `
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled,
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.scrollerwrapold},
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guilds} {
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guildswrapper},
.bd-minimal .DSAC-styled ${BDFDB.dotCN.scrollerwrapold},
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guilds} {
width: 160px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled,
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.scrollerwrapold},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guilds} {
.DSAC-styled ${BDFDB.dotCN.guildswrapper},
.DSAC-styled ${BDFDB.dotCN.scrollerwrapold},
.DSAC-styled ${BDFDB.dotCN.guilds} {
width: 240px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guilds}::-webkit-scrollbar-track-piece {
.DSAC-styled ${BDFDB.dotCN.guilds}::-webkit-scrollbar-track-piece {
background-color: rgb(27, 29, 32);
border-color: rgb(32, 34, 37);
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guilds}::-webkit-scrollbar-thumb {
.DSAC-styled ${BDFDB.dotCN.guilds}::-webkit-scrollbar-thumb {
background-color: rgb(17, 19, 22);
border-color: rgb(32, 34, 37);
}
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guild} {
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guild} {
margin-left: 55px;
}
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.friendsonline},
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled #RANbutton-frame {
.bd-minimal .DSAC-styled ${BDFDB.dotCN.friendsonline},
.bd-minimal .DSAC-styled #RANbutton-frame {
margin-left: 40px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} a,
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCNS.guildinner + BDFDB.dotCN.avataricon},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror} {
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} a,
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCNS.guildinner + BDFDB.dotCN.avataricon},
.DSAC-styled ${BDFDB.dotCN.guild}.copy,
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.guildinner},
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.guildinner} a,
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCNS.guildinner + BDFDB.dotCN.avataricon},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror} {
margin-left: 0px;
height: 32px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guild},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.friendsonline} {
.DSAC-styled ${BDFDB.dotCN.guildseparator} {
margin-left: 0px;
}
.DSAC-styled ${BDFDB.dotCN.guild},
.DSAC-styled ${BDFDB.dotCN.friendsonline} {
margin-left: 80px;
}
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator},
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild},
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror} {
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guildseparator},
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild},
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guild}.copy,
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror} {
width: 130px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror} {
.DSAC-styled ${BDFDB.dotCN.guildseparator}:not([style*="display: none"]),
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild}:not([style*="display: none"]),
.DSAC-styled ${BDFDB.dotCN.guild}.copy:not([style*="display: none"]),
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror}:not([style*="display: none"]) {
width: 215px;
box-sizing: border-box;
opacity: 0.4;
@ -67,51 +75,66 @@ class DisplayServersAsChannels {
align-items: center;
justify-content: flex-start;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildunread} {
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildunread}.copy.
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildunread} {
opacity: 0.7;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild}:not(${BDFDB.dotCN.guildselected}):hover {
.DSAC-styled ${BDFDB.dotCN.guild}.copy:not(${BDFDB.dotCN.guildselected}):hover,
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild}:not(${BDFDB.dotCN.guildselected}):hover {
opacity: 0.9;
background-color: rgba(79,84,92,.3);
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildselected} {
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildselected}.copy,
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildselected} {
opacity: 1;
background-color: rgba(79,84,92,.6);
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild} > div[draggable] {
.DSAC-styled ${BDFDB.dotCN.guild}.copy > div[draggable],
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild} > div[draggable] {
flex: 1 1 auto;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildaudio} > div[draggable],
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildvideo} > div[draggable] {
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildaudio}.copy > div[draggable],
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildvideo}.copy > div[draggable],
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildaudio} > div[draggable],
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildvideo} > div[draggable] {
padding-right: 20px;
margin-right: 5px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildaudio} > div[draggable] {
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildaudio}.copy > div[draggable],
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildaudio} > div[draggable] {
background: url(/assets/382ca83d9dc390c4be715248bb4864f4.svg) right no-repeat !important;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildvideo} > div[draggable] {
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildvideo}.copy > div[draggable],
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildvideo} > div[draggable] {
background: url(/assets/c46f51f425c824899b6138ea2b61b41d.svg) right no-repeat !important;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.badge} {
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.badge},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.badge} {
position: static;
margin-right: 5px;
}
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} {
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.guildinner},
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} {
width: unset;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} {
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.guildinner},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} {
background: transparent !important;
border-radius: 0px !important;
position: relative;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildaudio + BDFDB.dotCN.guildinner}:after,
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildvideo + BDFDB.dotCN.guildinner}:after {
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildaudio}.copy ${BDFDB.dotCN.guildinner}:after,
.DSAC-styled ${BDFDB.dotCN.guild + BDFDB.dotCN.guildvideo}.copy ${BDFDB.dotCN.guildinner}:after,
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildaudio + BDFDB.dotCN.guildinner}:after,
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildvideo + BDFDB.dotCN.guildinner}:after {
display: none !important;
}
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.avataricon} {
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.avataricon},
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.avataricon} {
font-size: 14px !important;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.avataricon} {
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.avataricon},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.avataricon} {
background: transparent !important;
font-size: 16px !important;
line-height: 32px;
@ -122,27 +145,29 @@ class DisplayServersAsChannels {
right: 0;
width: unset;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} .DSAC-verification-badge {
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.guildinner} .DSAC-verification-badge,
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} .DSAC-verification-badge {
position: absolute;
left: 0;
top: 4px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} .DSAC-verification-badge + ${BDFDB.dotCN.avataricon} {
.DSAC-styled ${BDFDB.dotCN.guild}.copy ${BDFDB.dotCN.guildinner} .DSAC-verification-badge + ${BDFDB.dotCN.avataricon},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildinner} .DSAC-verification-badge + ${BDFDB.dotCN.avataricon} {
left: 25px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror} {
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror} {
border-radius: 3px;
margin-left: -5px;
line-height: 32px;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror},
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildsadd} {
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCNS.guild + BDFDB.dotCN.guildserror},
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCN.guildsadd} {
display: block !important;
}
.bd-minimal ${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildsadd + BDFDB.dotCN.guildsaddinner} {
.bd-minimal .DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildsadd + BDFDB.dotCN.guildsaddinner} {
top: 0;
}
${BDFDB.dotCN.guildswrapper}.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildsadd + BDFDB.dotCN.guildsaddinner} {
.DSAC-styled ${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild + BDFDB.dotCNS.guildsadd + BDFDB.dotCN.guildsaddinner} {
top: -5px;
}`;
}
@ -151,7 +176,7 @@ class DisplayServersAsChannels {
getDescription () {return "Display servers in a similar way as channels.";}
getVersion () {return "1.1.0";}
getVersion () {return "1.1.1";}
getAuthor () {return "DevilBro";}
@ -201,8 +226,19 @@ class DisplayServersAsChannels {
BDFDB.readServerList().forEach(serverObj => {
this.changeServer(serverObj);
});
document.querySelectorAll(BDFDB.dotCN.guild + ".folder").forEach(folderdiv => {
this.changeServer(this.getFolderObject(folderdiv));
});
$(BDFDB.dotCN.guildswrapper).addClass("DSAC-styled");
$(BDFDB.dotCN.guildswrapper).parent()
.off("." + this.getName())
.on("mouseenter." + this.getName(), `${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild}, ${BDFDB.dotCN.guild}.copy`, () => {
BDFDB.appendLocalStyle("HideAllToolTips" + this.getName(), `${BDFDB.dotCN.tooltip} {display: none !important;}`);
})
.on("mouseleave." + this.getName(), `${BDFDB.dotCN.guildseparator} ~ ${BDFDB.dotCN.guild}, ${BDFDB.dotCN.guild}.copy`, () => {
BDFDB.removeLocalStyle("HideAllToolTips" + this.getName());
})
.addClass("DSAC-styled");
}
else {
console.error(this.getName() + ": Fatal Error: Could not load BD functions!");
@ -214,6 +250,9 @@ class DisplayServersAsChannels {
BDFDB.readServerList().forEach(serverObj => {
this.resetServer(serverObj);
});
document.querySelectorAll(BDFDB.dotCN.guild + ".folder").forEach(folderdiv => {
this.resetServer(this.getFolderObject(folderdiv));
});
$(".DSAC-styled").removeClass("DSAC-styled");
BDFDB.unloadMessage(this);
@ -228,16 +267,8 @@ class DisplayServersAsChannels {
var avatar = serverObj.div.querySelector(BDFDB.dotCN.avataricon);
if (avatar) {
avatar.DSAColdName = avatar.textContent;
avatar.textContent = serverObj.name;
if (serverObj.features.has("VERIFIED")) $(this.verificationBadgeMarkup).insertBefore(avatar);
$(serverObj.div)
.off("." + this.getName())
.on("mouseenter." + this.getName(), () => {
BDFDB.appendLocalStyle("HideAllToolTips" + this.getName(), `${BDFDB.dotCN.tooltip} {display: none !important;}`);
})
.on("mouseleave." + this.getName(), () => {
BDFDB.removeLocalStyle("HideAllToolTips" + this.getName());
});
avatar.textContent = serverObj.name || serverObj.folderName;
if (serverObj.features && serverObj.features.has("VERIFIED")) $(this.verificationBadgeMarkup).insertBefore(avatar);
}
}
@ -246,7 +277,12 @@ class DisplayServersAsChannels {
var avatar = serverObj.div.querySelector(BDFDB.dotCN.avataricon);
if (avatar) {
avatar.textContent = avatar.DSAColdName;
$(serverObj.div).off("." + this.getName()).find(".DSAC-verification-badge").remove();
$(serverObj.div).find(".DSAC-verification-badge").remove();
}
}
getFolderObject (folderdiv) {
var data = BDFDB.loadData(folderdiv.id, "ServerFolders", "folders");
return data ? Object.assign({div:folderdiv}, data) : null;
}
}

View File

@ -47,9 +47,9 @@ class ServerFolders {
${BDFDB.dotCN.guild}.folder ${BDFDB.dotCN.badge}.folder.count {
background: #7289DA;
height: 12px;
top: -3px;
right: 30px;
bottom: unset;
}
${BDFDB.dotCN.guild}.guilddragpreview {