rename room by edit

RoomManager.js

@@ -608,7 +608,7 @@ function updateRoom (msgObj) {
 		audio.playSoundEffect('JoinRoom');
 	}
 
-	$('room-name').textContent = msgObj.roomName;
+	$('room-name').value = msgObj.roomName;
 	$('room-host-nickname').textContent = msgObj.host;
 	$('room-guest-nickname').textContent = msgObj.guest;
 	setClass($('room-guest-nickname'),'ready',msgObj.guestReady);
@@ -856,6 +856,15 @@ $('link-edit-deck').onclick = function (event) {
 	return false;
 };
 
+$('room-name').onblur = function (event) {
+	var roomName = event.target.value;
+	if (roomName) {
+		socket.emit('renameRoom', {
+			'roomName': roomName
+		});
+	}
+};
+
 /* 直播 */
 var stopFetchingLive = 0;
 var watchingLive = false;

css.css

@@ -415,6 +415,9 @@ ol,ul,li {
 	color: #f2442b;
 	font-size: 150%;
 	font-weight: bold;
+	text-align: center;
+	background: transparent;
+	border: none;
 }
 #room-host-nickname {
 	color: #77d25b;

index.html

@@ -119,7 +119,9 @@
 		<table id="table-room">
 			<tbody>
 					<tr>
-						<td colspan="100"><span id="room-name"></span></td>
+						<td colspan="100">
+							<input id="room-name" type="text"></input>
+							</td>
 					</tr>
 					<tr>
 						<td><span id="room-host-nickname" class="nickname"></span></td>