Here you go. I commented out the parts that I used to center the div layer, so it is reset back to the original distance from the right side. var ColorNote = ColorNote || (function() {
'use strict';
var version = 0.1,
ch = function (c) {
var entities = {
'<' : 'lt',
'>' : 'gt',
"'" : '#39',
'@' : '#64',
'{' : '#123',
'|' : '#124',
'}' : '#125',
'[' : '#91',
']' : '#93',
'"' : 'quot',
'-' : 'mdash',
' ' : 'nbsp'
};
if(_.has(entities,c) ){
return ('&'+entities[c]+';');
}
return '';
},
showHelp = function(who) {
sendChat('',
'/w '+who+' '
+'<div style="border: 1px solid black; background-color: white; padding: 3px 3px;">'
+'<div style="font-weight: bold; border-bottom: 1px solid black;font-size: 130%;">'
+'ColorNote v'+version
+'</div>'
+'<div style="padding-left:10px;margin-bottom:3px;">'
+'<p>ColorNote provides the <b>!note</b> command, which looks like /em but but colored differently.</p>'
+'</div>'
+'<b>Commands</b>'
+'<div style="padding-left:10px;">'
+'<b><span style="font-family: serif;">!note '+ch('<')+'message'+ch('>')+'</span></b>'
+'<div style="padding-left: 10px;padding-right:20px">'
+'<p>Sends a message in the same manner as <i>/em</i> does, but with dark green text on a light green background.</p>'
+'<ul>'
+'<li style="border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;">'
+'<b><span style="font-family: serif;">'+ch('<')+'message'+ch('>')+'</span></b> '+ch('-')+' The message to output as part of the note.'
+'</li> '
+'</ul>'
+'</div>'
+'</div>'
+'</div>'
);
},
handleInput = function(msg) {
var args, who, color;
if (msg.type !== "api") {
return;
}
args = msg.content.split(/\s+/);
who=getObj('player',msg.playerid).get('_displayname').split(' ')[0];
color=getObj('player',msg.playerid).get('color').split(' ')[0];
function getBrightness(hex) {
hex = hex.replace('#', '');
var c_r = hexDec(hex.substr(0, 2));
var c_g = hexDec(hex.substr(2, 2));
var c_b = hexDec(hex.substr(4, 2));
return ((c_r * 299) + (c_g * 587) + (c_b * 114)) / 1000;
}
var txcolor = (getBrightness(color) < (255 / 2)) ? "#FFF" : "#000";
switch(args[0]) {
case '!note':
if(1 === args.length) {
showHelp(who);
} else {
sendChat('','/direct '
+"<div style=\""
+" background-color: "+color+";"
+" color: "+txcolor+";"
+" display: block;"
+" font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;"
+" font-size: 14px;"
+" font-style: italic;"
+" font-weight: bold;"
// +" position: relative;"
// +" right: 21px;"
+" line-height: 17.0625px;"
+" padding-top: 7px;"
+" padding-bottom: 7px;"
+" padding-left: 5px;"
+" padding-right: 5px;"
+" text-align: center;"
+" word-wrap: break-word;"
+" zoom: 1;"
+"\">"
+_.rest(args).join(' ')
+"</div>"
);
}
break;
}
},
registerEventHandlers = function() {
on('chat:message', handleInput);
};
return {
RegisterEventHandlers: registerEventHandlers
};
}());
on("ready",function(){
'use strict';
ColorNote.RegisterEventHandlers();
});
