icons for channels
This commit is contained in:
parent
aa6ada3d0b
commit
92a19ea3f9
7 changed files with 115 additions and 18 deletions
|
@ -304,22 +304,22 @@ class Channel {
|
|||
const myhtml = document.createElement("span");
|
||||
myhtml.textContent = this.name;
|
||||
if (this.type === 0) {
|
||||
const decoration = document.createElement("b");
|
||||
decoration.textContent = "#";
|
||||
const decoration = document.createElement("img");
|
||||
decoration.src = "/icons/channel.svg";
|
||||
div.appendChild(decoration);
|
||||
decoration.classList.add("space");
|
||||
decoration.classList.add("space", "svgtheme");
|
||||
}
|
||||
else if (this.type === 2) { //
|
||||
const decoration = document.createElement("b");
|
||||
decoration.textContent = "🕪";
|
||||
const decoration = document.createElement("img");
|
||||
decoration.src = "/icons/voice.svg";
|
||||
div.appendChild(decoration);
|
||||
decoration.classList.add("spacee");
|
||||
decoration.classList.add("spacee", "svgtheme");
|
||||
}
|
||||
else if (this.type === 5) { //
|
||||
const decoration = document.createElement("b");
|
||||
decoration.textContent = "📣";
|
||||
const decoration = document.createElement("img");
|
||||
decoration.src = "/icons/announce.svg";
|
||||
div.appendChild(decoration);
|
||||
decoration.classList.add("spacee");
|
||||
decoration.classList.add("spacee", "svgtheme");
|
||||
}
|
||||
else {
|
||||
console.log(this.type);
|
||||
|
@ -908,3 +908,47 @@ class Channel {
|
|||
}
|
||||
Channel.setupcontextmenu();
|
||||
export { Channel };
|
||||
function fixsvgtheme() {
|
||||
const things = document.getElementsByClassName("svgtheme");
|
||||
//console.log(things);
|
||||
if (things.length) {
|
||||
const thing = window.getComputedStyle(things[0]).color.replace("rgb(", "").replace(")", "").split(",");
|
||||
//sconsole.log(thing);
|
||||
const r = +thing[0] / 255;
|
||||
const g = +thing[1] / 255;
|
||||
const b = +thing[2] / 255;
|
||||
const max = Math.max(r, g, b);
|
||||
const min = Math.min(r, g, b);
|
||||
const l = (max + min) / 2;
|
||||
let s;
|
||||
let h;
|
||||
if (max !== min) {
|
||||
if (l <= .5) {
|
||||
s = (max - min) / (max + min);
|
||||
}
|
||||
else {
|
||||
s = (max - min) / (2.0 - max - min);
|
||||
}
|
||||
if (r === max) {
|
||||
h = (g - b) / (max - min);
|
||||
}
|
||||
else if (g === max) {
|
||||
h = 2 + (b - r) / (max - min);
|
||||
}
|
||||
else if (b === max) {
|
||||
h = 4 + (r - g) / (max - min);
|
||||
}
|
||||
}
|
||||
else {
|
||||
s = 0;
|
||||
h = 0;
|
||||
}
|
||||
const rot = Math.floor(h * 60) + "deg";
|
||||
const invert = .5 - (s / 2) + "";
|
||||
const brightness = Math.floor((l * 200)) + "%";
|
||||
document.documentElement.style.setProperty('--rot', rot);
|
||||
document.documentElement.style.setProperty('--invert', invert);
|
||||
document.documentElement.style.setProperty('--brightness', brightness);
|
||||
}
|
||||
}
|
||||
setInterval(fixsvgtheme, 100);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue