Fixed coloring of names on users

This commit is contained in:
Kasper Rynning-Tønnesen
2016-04-19 21:21:53 +02:00
parent b180ff2af0
commit e21d749795
6 changed files with 38 additions and 12 deletions

View File

@@ -892,6 +892,7 @@ ul #chat-log{
/*padding:0px 15px;*/ /*padding:0px 15px;*/
flex:1; flex:1;
position: relative; position: relative;
/*background-color:rgba(0,0,0,0.2);*/
} }
#player{ #player{

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -50,11 +50,18 @@ var Chat = {
$("#favicon").attr("href", "static/images/highlogo.png"); $("#favicon").attr("href", "static/images/highlogo.png");
unseen = true; unseen = true;
} }
var color = Helper.intToARGB(Helper.hashCode(inp[0])).substring(0,6); var color = Helper.intToARGB(Helper.hashCode(inp[0]));
$("#chatall").append("<li title='"+inp[2]+"'><span style='color:#"+color+";'>"+inp[0]+"</span></li>"); if(color.length < 6) {
for(x = color.length; x < 6; x++){
color = "0" + color;
}
}
color = Helper.hexToRgb(color.substring(0,6));
var color_temp = Helper.rgbToHsl([color.r, color.g, color.b], false);
$("#chatall").append("<li title='"+inp[2]+"''><span style='color:"+color_temp+";'>"+inp[0]+"</span></li>");
var in_text = document.createTextNode(inp[1]); var in_text = document.createTextNode(inp[1]);
$("#chatall li:last")[0].appendChild(in_text); $("#chatall li:last")[0].appendChild(in_text);
document.getElementById("chatall").scrollTop = document.getElementById("chatall").scrollHeight document.getElementById("chatall").scrollTop = document.getElementById("chatall").scrollHeight;
}); });
}, },
@@ -74,11 +81,18 @@ var Chat = {
} }
} }
} }
var color = Helper.intToARGB(Helper.hashCode(data[0])).substring(0,6); var color = Helper.intToARGB(Helper.hashCode(data[0]));
$("#chatchannel").append("<li><span style='color:#"+color+";'>"+data[0]+"</span></li>"); if(color.length < 6) {
for(x = color.length; x < 6; x++){
color = "0" + color;
}
}
color = Helper.hexToRgb(color.substring(0,6));
var color_temp = Helper.rgbToHsl([color.r, color.g, color.b], false);
$("#chatchannel").append("<li><span style='color:"+color_temp+";'>"+data[0]+"</span></li>");
var in_text = document.createTextNode(data[1]); var in_text = document.createTextNode(data[1]);
$("#chatchannel li:last")[0].appendChild(in_text); $("#chatchannel li:last")[0].appendChild(in_text);
document.getElementById("chatchannel").scrollTop = document.getElementById("chatchannel").scrollHeight document.getElementById("chatchannel").scrollTop = document.getElementById("chatchannel").scrollHeight;
}); });
}, },

View File

@@ -82,6 +82,16 @@ var Helper = {
(i&0xFF).toString(16); (i&0xFF).toString(16);
}, },
hexToRgb: function(hex) {
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
},
pad: function(n) pad: function(n)
{ {
return n < 10 ? "0"+Math.floor(n) : Math.floor(n); return n < 10 ? "0"+Math.floor(n) : Math.floor(n);
@@ -135,7 +145,7 @@ var Helper = {
return Math.floor(Math.random() * (max - min)) + min; return Math.floor(Math.random() * (max - min)) + min;
}, },
rgbToHsl: function(arr){ rgbToHsl: function(arr, light){
r = arr[0], g = arr[1], b = arr[2]; r = arr[0], g = arr[1], b = arr[2];
r /= 255, g /= 255, b /= 255; r /= 255, g /= 255, b /= 255;
var max = Math.max(r, g, b), min = Math.min(r, g, b); var max = Math.max(r, g, b), min = Math.min(r, g, b);
@@ -154,7 +164,8 @@ var Helper = {
h /= 6; h /= 6;
} }
if(l>0.5)l=0.5; //make sure it isnt too light if(l>0.5 && light)l=0.5; //make sure it isnt too light
else if(l<0.65 && !light)l=0.65;
return "hsl("+Math.floor(h*360)+", "+Math.floor(s*100)+"%, "+Math.floor(l*100)+"%)"; return "hsl("+Math.floor(h*360)+", "+Math.floor(s*100)+"%, "+Math.floor(l*100)+"%)";
}, },

View File

@@ -220,7 +220,7 @@ var Player = {
var colorThief = new ColorThief(); var colorThief = new ColorThief();
var color = colorThief.getColor(img); var color = colorThief.getColor(img);
document.getElementsByTagName("body")[0].style.backgroundColor = Helper.rgbToHsl(color); document.getElementsByTagName("body")[0].style.backgroundColor = Helper.rgbToHsl(color,true);
/*document.getElementById("top-button").style.backgroundColor = Helper.rgbToHsl(color); /*document.getElementById("top-button").style.backgroundColor = Helper.rgbToHsl(color);
document.getElementById("bottom-button").style.backgroundColor = Helper.rgbToHsl(color);*/ document.getElementById("bottom-button").style.backgroundColor = Helper.rgbToHsl(color);*/