icons for channels

This commit is contained in:
MathMan05 2024-07-31 20:23:35 -05:00
parent aa6ada3d0b
commit 92a19ea3f9
7 changed files with 115 additions and 18 deletions

View file

@ -317,20 +317,20 @@ 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)
}
@ -899,3 +899,44 @@ 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:number;
let h:number;
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);