keep chat always focused

1 files changed, 18 insertions, 10 deletions

diff --git a/index.html b/index.html
index dcda3eb..754b96c 100644
--- a/index.html
+++ b/index.html
@@ -103,10 +103,7 @@ function Room(_roomid){
 	this.listdiv.innerHTML="<div style='float:right;cursor:default' onclick='dodestroyroom(\""+this.id+"\")'>X</div><b>Room:</b>";
 	this.listdiv.addEventListener("click",function(ev){
 		if(ev.target!=this.listdiv)return;
-		if(visibleroomuidiv)visibleroomuidiv.classList.add("invisible");
-		else document.getElementById("roomuisplash").classList.remove("invisible");
-		visibleroomuidiv=this.uidiv;
-		this.uidiv.classList.remove("invisible");
+		this.becomeVisible();
 	}.bind(this));
 	document.getElementById("roomlistcontainer").appendChild(this.listdiv);
 
@@ -127,24 +124,27 @@ function Room(_roomid){
 
 	e=document.createElement("div");
 	e.classList.add("chatdiv");
+	e.addEventListener("click",function(){
+		this.chatinput.focus();
+	}.bind(this));
 	table=document.createElement("table");
 	table.classList.add("chatlogtable");
 	tbody=document.createElement("tbody");
 	tbody.classList.add("chatlogtbody");
 	table.appendChild(tbody);
 	e.appendChild(table);
-	input=document.createElement("input");
-	input.type="text";
-	input.classList.add("chatinput");
-	input.setAttribute("placeholder","Type something...");
-	input.addEventListener("keypress",function(ev){
+	this.chatinput=document.createElement("input");
+	this.chatinput.type="text";
+	this.chatinput.classList.add("chatinput");
+	this.chatinput.setAttribute("placeholder","Type something...");
+	this.chatinput.addEventListener("keypress",function(ev){
 		if(ev.keyCode!=13&&ev.which!=13)return;
 		var msg=ev.target.value;
 		ev.target.value="";
 		if(msg.length==0)return;
 		socket.emit("roomchat",this.id,msg);
 	}.bind(this));
-	e.appendChild(input);
+	e.appendChild(this.chatinput);
 	this.uidiv.appendChild(e);
 
 	this.gamediv=document.createElement("div");
@@ -156,6 +156,7 @@ function Room(_roomid){
 	this.cvs.width=this.cellsz*W+1;
 	this.cvs.height=this.cellsz*H+1;
 	this.cvs.addEventListener("click",function(ev){
+		this.chatinput.focus();
 		if(!this.canplace)return;
 		if(ev.target!=this.cvs)return;
 		var bbox=ev.target.getBoundingClientRect();
@@ -183,6 +184,13 @@ function Room(_roomid){
 
 	document.body.appendChild(this.uidiv);
 }
+Room.prototype.becomeVisible=function(){
+	if(visibleroomuidiv)visibleroomuidiv.classList.add("invisible");
+	else document.getElementById("roomuisplash").classList.remove("invisible");
+	visibleroomuidiv=this.uidiv;
+	this.uidiv.classList.remove("invisible");
+	this.chatinput.focus();
+};
 Room.prototype.join=function(user){
 	this.listdiv.innerHTML+=" "+user[1];
 	this.userlist.push(user.slice());