aly/servatrice
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Webclient overhaul (#2735)

Browse source 
Migrate from protobuf.js 5.x to 6.x (remove long.js and bytebuffer.js)
Upgrade jQuery from 1.x to 3.x
Upgrade jQueryUI to 1.12.x
Use minimized version of js libraries
Disable debug messages
Fix default value for Event_RoomSay’s RoomMessageType field
This commit is contained in:
ctrlaltca 2017-05-29 14:12:36 +02:00 committed by GitHub
parent 87060dc5c7
commit f75caa7245
32 changed files with 73 additions and 38313 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
common/pb/event_room_say.proto
View file

@ -6,8 +6,9 @@ message Event_RoomSay {
optional Event_RoomSay ext = 1002; optional Event_RoomSay ext = 1002;
} }
enum RoomMessageType { enum RoomMessageType {
Welcome = 1; // rooms welcome message UserMessage = 0; // user message
ChatHistory = 2; // rooms chat history message Welcome = 1; // rooms welcome message
ChatHistory = 2; // rooms chat history message
} }
optional string name = 1; optional string name = 1;
optional string message = 2; optional string message = 2;

14
webclient/index.html
View file

@ -3,7 +3,7 @@
<head> <head>
<title>Cockatrice web client</title> <title>Cockatrice web client</title>
<link rel="shortcut icon" href="imgs/cockatrice.png" /> <link rel="shortcut icon" href="imgs/cockatrice.png" />
<link rel="stylesheet" href="js/jquery-ui-1.11.4.css"> <link rel="stylesheet" href="js/jquery-ui-1.12.1.min.css">
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
<body> <body>
@ -75,11 +75,9 @@ Loading cockatrice web client...
</div> </div>
<script src="js/jquery-1.11.3.js"></script> <script src="js/jquery-3.2.1.min.js"></script>
<script src="js/jquery-ui-1.11.4.js"></script> <script src="js/jquery-ui-1.12.1.min.js"></script>
<script src="js/long.js"></script> <script src="js/protobuf-6.7.0.min.js"></script>
<script src="js/bytebuffer.js"></script>
<script src="js/protobuf.js"></script>
<script src="webclient.js"></script> <script src="webclient.js"></script>
<script> <script>
@ -216,7 +214,7 @@ Loading cockatrice web client...
} }
var options = { var options = {
"debug": true, "debug": false,
"autojoinrooms" : true, "autojoinrooms" : true,
"host": host, "host": host,
"port": port, "port": port,
@ -284,7 +282,7 @@ Loading cockatrice web client...
switch(key) switch(key)
{ {
case 'avatarBmp': case 'avatarBmp':
$('#userinfo').prepend("<img id='avatar' src='data:image/JPEG;base64," + value.toBase64() + "' /><br/>"); $('#userinfo').prepend("<img id='avatar' src='data:image/JPEG;base64," + btoa(String.fromCharCode.apply(null, value)) + "' /><br/>");
break; break;
case 'accountageSecs': case 'accountageSecs':
$('#userinfo').append('Registered since: ' + timeAgoToInterval(value) + '<br/>'); $('#userinfo').append('Registered since: ' + timeAgoToInterval(value) + '<br/>');

3651
webclient/js/bytebuffer.js
View file

File diff suppressed because it is too large Load diff

BIN
webclient/js/images/ui-bg_diagonals-thick_18_b81900_40x40.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 418 B

BIN
webclient/js/images/ui-bg_diagonals-thick_20_666666_40x40.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 312 B

BIN
webclient/js/images/ui-bg_flat_10_000000_40x100.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 205 B

BIN
webclient/js/images/ui-bg_glass_100_f6f6f6_1x400.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 262 B

BIN
webclient/js/images/ui-bg_glass_100_fdf5ce_1x400.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 348 B

BIN
webclient/js/images/ui-bg_glass_65_ffffff_1x400.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 207 B

BIN
webclient/js/images/ui-bg_gloss-wave_35_f6a828_500x100.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 5.7 KiB

BIN
webclient/js/images/ui-bg_highlight-soft_100_eeeeee_1x100.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 278 B

BIN
webclient/js/images/ui-bg_highlight-soft_75_ffe45c_1x100.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 328 B

BIN
webclient/js/images/ui-icons_222222_256x240.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 6.8 KiB

BIN
webclient/js/images/ui-icons_228ef1_256x240.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 4.4 KiB

BIN
webclient/js/images/ui-icons_444444_256x240.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.8 KiB

BIN
webclient/js/images/ui-icons_555555_256x240.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.9 KiB

BIN
webclient/js/images/ui-icons_777620_256x240.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
webclient/js/images/ui-icons_777777_256x240.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 6.8 KiB

BIN
webclient/js/images/ui-icons_cc0000_256x240.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 4.5 KiB

BIN
webclient/js/images/ui-icons_ef8c08_256x240.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 4.4 KiB

BIN
webclient/js/images/ui-icons_ffd27a_256x240.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 4.4 KiB

BIN
webclient/js/images/ui-icons_ffffff_256x240.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.2 KiB

After

Width:  |  Height:  |  Size: 6.2 KiB

10351
webclient/js/jquery-1.11.3.js vendored
View file

File diff suppressed because it is too large Load diff

4
webclient/js/jquery-3.2.1.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

1225
webclient/js/jquery-ui-1.11.4.css vendored
View file

File diff suppressed because it is too large Load diff

16617
webclient/js/jquery-ui-1.11.4.js vendored
View file

File diff suppressed because it is too large Load diff

7
webclient/js/jquery-ui-1.12.1.min.css vendored Normal file
View file

File diff suppressed because one or more lines are too long

13
webclient/js/jquery-ui-1.12.1.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

1220
webclient/js/long.js
View file

File diff suppressed because it is too large Load diff

10
webclient/js/protobuf-6.7.0.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

5211
webclient/js/protobuf.js
View file

File diff suppressed because it is too large Load diff

56
webclient/webclient.js
View file

@ -26,8 +26,6 @@ var WebClient = {
keepalive: 5000 keepalive: 5000
}, },
protobuf : null,
builder : null,
pb : null, pb : null,
pbfiles : [ pbfiles : [
// commands // commands
@ -53,14 +51,13 @@ var WebClient = {
initialize : function() initialize : function()
{ {
this.protobuf = dcodeIO.ProtoBuf; this.pb = new protobuf.Root({
this.builder = this.protobuf.newBuilder({ convertFieldsToCamelCase: true }); convertFieldsToCamelCase: true,
$.each(this.pbfiles, function(index, fileName) {
WebClient.protobuf.loadProtoFile(fileName, WebClient.builder);
}); });
this.pb = this.builder.build(); this.pb.load(this.pbfiles, {
keepCase: false
});
this.initialized=true; this.initialized=true;
}, },
@ -96,7 +93,7 @@ var WebClient = {
this.pendingCommands[this.cmdId] = callback; this.pendingCommands[this.cmdId] = callback;
if (this.socket.readyState == WebSocket.OPEN) { if (this.socket.readyState == WebSocket.OPEN) {
this.socket.send(cmd.toArrayBuffer()); this.socket.send(WebClient.pb.CommandContainer.encode(cmd).finish());
if(this.options.debug) if(this.options.debug)
console.log("Sent: " + cmd.toString()); console.log("Sent: " + cmd.toString());
} else { } else {
@ -107,7 +104,7 @@ var WebClient = {
sendRoomCommand : function(roomId, roomCmd, callback) sendRoomCommand : function(roomId, roomCmd, callback)
{ {
var cmd = new WebClient.pb.CommandContainer({ var cmd = WebClient.pb.CommandContainer.create({
"roomId" : roomId, "roomId" : roomId,
"roomCommand" : [ roomCmd ] "roomCommand" : [ roomCmd ]
}); });
@ -116,7 +113,7 @@ var WebClient = {
sendSessionCommand : function(ses, callback) sendSessionCommand : function(ses, callback)
{ {
var cmd = new WebClient.pb.CommandContainer({ var cmd = WebClient.pb.CommandContainer.create({
"sessionCommand" : [ ses ] "sessionCommand" : [ ses ]
}); });
WebClient.sendCommand(cmd, callback); WebClient.sendCommand(cmd, callback);
@ -141,9 +138,9 @@ var WebClient = {
} }
// send a ping // send a ping
var CmdPing = new WebClient.pb.Command_Ping(); var CmdPing = WebClient.pb.Command_Ping.create();
var sc = new WebClient.pb.SessionCommand({ var sc = WebClient.pb.SessionCommand.create({
".Command_Ping.ext" : CmdPing ".Command_Ping.ext" : CmdPing
}); });
@ -157,21 +154,26 @@ var WebClient = {
doLogin : function() doLogin : function()
{ {
var CmdLogin = new WebClient.pb.Command_Login({ var CmdLogin = WebClient.pb.Command_Login.create({
"userName" : this.options.user, "userName" : this.options.user,
"password" : this.options.pass, "password" : this.options.pass,
"clientid" : this.guid(), "clientid" : this.guid(),
"clientver" : "webclient-0.2 (2016-08-03)", "clientver" : "webclient-0.3 (2017-05-26)",
"clientfeatures" : [ "clientfeatures" : [
"client_id", "client_id",
"client_ver", "client_ver",
"feature_set", "feature_set",
"room_chat_history", "room_chat_history",
"client_warnings" "client_warnings",
/* unimplemented features */
"forgot_password",
"idle_client",
"mod_log_lookup",
"user_ban_history"
] ]
}); });
var sc = new WebClient.pb.SessionCommand({ var sc = WebClient.pb.SessionCommand.create({
".Command_Login.ext" : CmdLogin ".Command_Login.ext" : CmdLogin
}); });
@ -227,9 +229,9 @@ var WebClient = {
doListRooms : function() doListRooms : function()
{ {
var CmdListRooms = new WebClient.pb.Command_ListRooms(); var CmdListRooms = WebClient.pb.Command_ListRooms.create();
var sc = new WebClient.pb.SessionCommand({ var sc = WebClient.pb.SessionCommand.create({
".Command_ListRooms.ext" : CmdListRooms ".Command_ListRooms.ext" : CmdListRooms
}); });
@ -289,11 +291,11 @@ var WebClient = {
$.each(roomsList, function(index, room) { $.each(roomsList, function(index, room) {
if(room.autoJoin) if(room.autoJoin)
{ {
var CmdJoinRoom = new WebClient.pb.Command_JoinRoom({ var CmdJoinRoom = WebClient.pb.Command_JoinRoom.create({
"roomId" : room.roomId "roomId" : room.roomId
}); });
var sc = new WebClient.pb.SessionCommand({ var sc = WebClient.pb.SessionCommand.create({
".Command_JoinRoom.ext" : CmdJoinRoom ".Command_JoinRoom.ext" : CmdJoinRoom
}); });
@ -395,19 +397,19 @@ var WebClient = {
this.socket.onmessage = function(event) { this.socket.onmessage = function(event) {
//console.log("Received " + event.data.byteLength + " bytes"); //console.log("Received " + event.data.byteLength + " bytes");
var uint8msg = new Uint8Array(event.data);
try { try {
var msg = WebClient.pb.ServerMessage.decode(event.data); var msg = WebClient.pb.ServerMessage.decode(uint8msg);
if(WebClient.options.debug) if(WebClient.options.debug)
console.log(msg); console.log(msg);
} catch (err) { } catch (err) {
console.log("Processing failed:", err); console.log("Processing failed:", err);
if(WebClient.options.debug) if(WebClient.options.debug)
{ {
var view = new Uint8Array(event.data);
var str = ""; var str = "";
for(var i = 0; i < view.length; i++) for(var i = 0; i < uint8msg.length; i++)
{ {
str += String.fromCharCode(view[i]); str += String.fromCharCode(uint8msg[i]);
} }
console.log(str); console.log(str);
} }
@ -442,11 +444,11 @@ var WebClient = {
}, },
roomSay : function(roomId, msg) { roomSay : function(roomId, msg) {
var CmdRoomSay = new WebClient.pb.Command_RoomSay({ var CmdRoomSay = WebClient.pb.Command_RoomSay.create({
"message" : msg "message" : msg
}); });
var sc = new WebClient.pb.RoomCommand({ var sc = WebClient.pb.RoomCommand.create({
".Command_RoomSay.ext" : CmdRoomSay ".Command_RoomSay.ext" : CmdRoomSay
}); });