Chat Console 1.1
Version of the 'Chat Console' that works with IE9 /name [whatever] will change the "handle" to [whatever]
by XGundam05
HTML
<div class="container cyberCowboy">
<div id="result" class="bottom wide"></div>
<div id="container" class="bottom wide input">
<div id="handle" contenteditable="true" spellcheck="false"></div>
<div id="delimiter">-></div>
<div id="edit" contenteditable="true"></div>
</div>
</div>
CSS
.half{
height:50%;
}
.bottom{
position:absolute;
bottom:0px;
}
.wide{
width:100%;
}
.container{
height:400px;
width:100%;
position:relative;
background-color:black;
color:#00FF00;
}
.input{
border-top:1px solid #00FF00
}
#edit{
overflow:hidden;
}
#delimiter{
float:left;
}
#handle{
float:left;
}
.cyberCowboy{
font-size:1.5em;
font-family:"Lucida Console", Monaco, monospace
}
JavaScript
$(document).on('keydown', '#edit', function(e){
if(e.which == 13)
return false;
});
$(document).on('keyup','#edit', function(e){
if(e.which == 13){
$('#end').remove();
parseText($('#edit').text());
$('#result').append('<span id="end"><br></span>');
$('#edit').text('');
}
});
$(document).ready(function(){
$('#handle').text('Client183');
});
function parseText(textLine){
var text = textLine.split(' ');
var isCommand = false;
if(text.length >= 2){
switch(text[0]){
case "/name":
writeLine($('#handle').text() + ' is now ' + text[1]);
$('#handle').text(text[1]);
isCommand = true;
break;
case "/me":
var action = '*' + $('#handle').text();
for(var i = 1; i < text.length; i++){
action += ' ' + text[i];
}
action += '*';
writeLine(action);
isCommand = true;
break;
default:
break;
}
}
if(!isCommand){
writeLine($('#handle').text() + '- ' + $('#edit').text());
}
}
function writeLine(text){
$('#result').append(text + '<br>');
}
String.prototype.format = function() {
var args = arguments;
return this.replace(/{(\d+)}/g, function(match, number) {
return typeof args[number] != 'undefined'
? args[number]
: match
;
});
};