Unique color per nick
This commit is contained in:
parent
cd68d12436
commit
678f6e3c08
@ -1,6 +1,6 @@
|
||||
html,
|
||||
body {
|
||||
font: 12px Consolas, monospace;
|
||||
font: 13px "Consolas", monospace;
|
||||
height: 100%;
|
||||
}
|
||||
a:focus {
|
||||
@ -164,6 +164,7 @@ h2 {
|
||||
background: #fff;
|
||||
border-left: 1px solid #ddd;
|
||||
bottom: 30px;
|
||||
line-height: 1.4em;
|
||||
overflow-y: auto;
|
||||
padding: 4px 0;
|
||||
position: absolute;
|
||||
@ -173,20 +174,23 @@ h2 {
|
||||
}
|
||||
#chat .users .user {
|
||||
display: block;
|
||||
color: #f00;
|
||||
padding: 0 8px;
|
||||
}
|
||||
#chat .messages {
|
||||
bottom: 30px;
|
||||
left: 0;
|
||||
overflow-y: auto;
|
||||
padding: 4px 8px;
|
||||
padding: 4px 0;
|
||||
position: absolute;
|
||||
right: 160px;
|
||||
top: 43px;
|
||||
word-wrap: break-word;
|
||||
z-index: 0;
|
||||
}
|
||||
#chat .message {
|
||||
line-height: 1.4em;
|
||||
padding: 0 6px;
|
||||
}
|
||||
#chat .message .time {
|
||||
color: #bbb;
|
||||
}
|
||||
|
@ -90,7 +90,7 @@
|
||||
</div>
|
||||
<div class="users">
|
||||
{{#each users}}
|
||||
<a href="{{name}}" class="user">
|
||||
<a href="{{name}}" class="user" style="color: {{color name}}">
|
||||
{{mode}}{{name}}
|
||||
</a>
|
||||
{{/each}}
|
||||
@ -99,8 +99,8 @@
|
||||
{{#each messages}}
|
||||
<div class="message {{type}}">
|
||||
<span class="time">{{time}}</span>
|
||||
<a href="{{user}}" class="user">{{mode}}{{user}}</a>
|
||||
<span class="text">{{type}} {{{autoLink text}}}</span>
|
||||
<a href="{{user}}" class="user" style="color: {{color user}}">{{mode}}{{user}}</a>
|
||||
<span class="text">{{type}} {{{link text}}}</span>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
@ -114,7 +114,7 @@
|
||||
|
||||
<script type="text/html" id="user">
|
||||
{{#users}}
|
||||
<a href="{{name}}" class="user">
|
||||
<a href="{{name}}" class="user" style="color: {{color name}}">
|
||||
{{mode}}{{name}}
|
||||
</a>
|
||||
{{/users}}
|
||||
@ -124,8 +124,8 @@
|
||||
{{#messages}}
|
||||
<div class="message {{type}}">
|
||||
<span class="time">{{time}}</span>
|
||||
<a href="{{user}}" class="user">{{mode}}{{user}}</a>
|
||||
<span class="text">{{type}} {{{autoLink text}}}</span>
|
||||
<a href="{{user}}" class="user" style="color: {{color user}}">{{mode}}{{user}}</a>
|
||||
<span class="text">{{type}} {{{link text}}}</span>
|
||||
</div>
|
||||
{{/messages}}
|
||||
</script>
|
||||
|
@ -215,9 +215,58 @@ $(function() {
|
||||
};
|
||||
});
|
||||
|
||||
Handlebars.registerHelper("autoLink", function(text) {
|
||||
Handlebars.registerHelper("link", function(text) {
|
||||
var text = Handlebars.Utils.escapeExpression(text);
|
||||
return URI.withinString(text, function(url) {
|
||||
return "<a href='" + url + "' target='_blank'>" + url + "</a>";
|
||||
});
|
||||
});
|
||||
|
||||
Handlebars.registerHelper("color", function(text) {
|
||||
return get_color(text);
|
||||
});
|
||||
|
||||
// colornicks
|
||||
// https://github.com/avidal
|
||||
|
||||
function clean_nick(nick) {
|
||||
// attempts to clean up a nickname
|
||||
// by removing alternate characters from the end
|
||||
// nc_ becomes nc, avidal` becomes avidal
|
||||
|
||||
nick = nick.toLowerCase();
|
||||
|
||||
// typically ` and _ are used on the end alone
|
||||
nick = nick.replace(/[`_]+$/, '');
|
||||
|
||||
// remove |<anything> from the end
|
||||
nick = nick.replace(/|.*$/, '');
|
||||
|
||||
return nick;
|
||||
}
|
||||
|
||||
function hash(nick) {
|
||||
var cleaned = clean_nick(nick);
|
||||
var h = 0;
|
||||
|
||||
for(var i = 0; i < cleaned.length; i++) {
|
||||
h = cleaned.charCodeAt(i) + (h << 6) + (h << 16) - h;
|
||||
}
|
||||
|
||||
return h;
|
||||
}
|
||||
|
||||
function get_color(nick) {
|
||||
var nickhash = hash(nick);
|
||||
|
||||
// get a random value for the hue
|
||||
var h = nickhash % 360;
|
||||
|
||||
var l = 50;
|
||||
var s = 100;
|
||||
|
||||
// playing around with some numbers
|
||||
h = 360 + (h % 40);
|
||||
|
||||
return "hsl(" + h + "," + s + "%," + l + "%)";
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user