server/ui/js/gorobots.js

562 lines
17 KiB
JavaScript
Raw Normal View History

2015-08-27 22:19:53 -07:00
var gorobots_init = function gorobots(my, webgl){
my.width = null;
my.height = null;
my.server = "ws://localhost:8666/ws/";
my.websocket = null;
my.id = null;
my.connection_retry = 3000;
my.state = null;
my.spectator = false;
my.debug = false;
my.debug_draw = true;
var grey = "#999999";
var colors = [
"#222222", // Grey
"#000099",
"#009900",
"#990000",
"#009999",
"#990099",
"#999900",
"#000044",
"#004400",
"#440000",
"#004444",
"#440044",
"#444400",
"#0000cc",
"#00cc00",
"#cc0000",
"#00cccc",
"#cc00cc",
"#cccc00"
];
my.connect = function(server){
connection = new WebSocket(server, null);
my.websocket = connection;
console.log(connection);
connection.onerror = function (error) {
console.log('WebSocket Error ' + error);
};
connection.onopen = function(){
console.log("Connected to " + server);
my.send_game_request();
};
connection.onclose = function(){
my.id = null;
my.state = null;
my.renderer.reset();
console.log("Connection Closed");
if (my.connection_retry > 0){
// Retry every few seconds
console.log("Lost Connection: " + server);
setTimeout(function(){
my.websocket = my.connect(my.server);
}, my.connection_retry);
}
};
connection.onmessage = function (e) {
// Handshake protocol, we must establish a game ID and send
// the robot config for approval before we can play
new_data = JSON.parse(e.data);
if (my.state === null) {
if (new_data.type == "idreq") {
if ('id' in new_data){
my.id = new_data['id'];
console.log("Assigned ID " + my.id + " by server");
} else {
console.log("server failed to send us an id");
}
my.send_client_id();
my.state = "gameparam";
// send supported encodings
my.websocket.send(JSON.stringify(["json"]));
}
} else if (my.state == "gameparam"){
if (new_data.type == "gameparam") {
// > [OK | FULL | NOT AUTH], board size, game params
my.parse_game_params(new_data);
my.state = "handshake";
my.setup_robot();
}
} else if (my.state == "handshake") {
// We have game details, make the render target
console.log("completed handshake");
console.log(new_data);
if('success' in new_data) {
if (!new_data.success){
alert("Your Robot Config is not valid, adjust your point distributions and try again");
return false;
}
}
my.renderer.setup_render_target(my.width, my.height, my.width, my.height);
my.state = "play";
} else if(my.state == "play") {
if (new_data.type == "handshake") {
// This is the handshake response, we've been assigned an ID
// and are in the game (or TODO: in a lobby).
console.log("we got a handshake when we expect a boardstate packet");
} else if (new_data.type == "stats") {
// XXX: need to actually assign this to the player/robots
// ...
console.log("\\o/ we have stats: " + JSON.stringify(new_data));
} else if (new_data.type == "boardstate") {
my.renderer.begin_frame(new_data['turn']);
var draw_list = my.process_gameplay_packet(new_data);
my.renderer.render(draw_list);
my.renderer.end_frame();
} else if (new_data.type == "gameover") {
my.renderer.reset();
} else {
console.error("unexpected state ...");
}
}
};
return connection;
};
my.prepare_data = function(data){
// get all the robot id's in the scanner list and find them in the
// overall robot list so we can pass them to the robot code
if (data['my_robots']){
for (var i=0; i < data['my_robots'].length; i++){
var bot = data['my_robots'][i];
bot.messages = data.messages;
for(var p in bot['scanners']){
var bot_id = bot['scanners'][p]['id'];
// find the scanner object in the pool of objects
if (bot['scanners'][p]['type'] == 'robot'){
for (var b in data['robots']){
if (data['robots'][b]['id'] == bot_id){
bot['scanners'][p] = data['robots'][b];
bot['scanners'][p].type = "robot";
bot['scanners'][p].friend = false;
}
}
for (var mybot in data['my_robots']){
if (data['my_robots'][mybot].id == bot['scanners'][p].id){
bot['scanners'][p].friend = true;
}
}
}
if (bot['scanners'][p]['type'] == 'projectile'){
for (var b in data['projectiles']){
if (data['projectiles'][b]['id'] == bot_id){
bot['scanners'][p] = data['projectiles'][b];
bot['scanners'][p].type = "projectile";
}
}
}
}
}
}
return data;
};
my.process_gameplay_packet = function(new_data){
my.stats.begin();
my.renderer.clear_debug();
var draw_list = [];
if (new_data.reset){
// my.setup_robot();
my.renderer.reset();
return;
}
if (!my.paused) {
var debug_div = document.getElementById("raw-debug");
if (debug_div){
debug_div.innerHTML = JSON.stringify(new_data, undefined, 2);
}
}
// Prep the data
new_data = my.prepare_data(new_data);
// Dump the contents of the message from the server
if (!my.paused) {
var debug_div = document.getElementById("debug");
if (debug_div){
debug_div.innerHTML = JSON.stringify(new_data, undefined, 2);
}
}
// Update the robots and build a list of what to draw
var my_robots = new_data['my_robots'];
var robots = new_data['robots'];
var all_bots = new_data['all_bots'];
my.all_bots = [];
my.my_bots = my_robots;
// Set the list of players and assign colors
var players = "";
var col = 2;
for (i=0; i < all_bots.length; i++){
my.all_bots.push(all_bots[i]['robot_id']);
// I hate javascript
var health_str = "";
if (all_bots[i]['health'] < 0) {
health_str = "000";
all_bots[i]['color'] = grey;
}
else if (all_bots[i]['health'] < 10) {
health_str = "00" + all_bots[i]['health'];
all_bots[i]['color'] = colors[col];
}
else if (all_bots[i]['health'] < 100){
health_str = "0" + all_bots[i]['health'];
all_bots[i]['color'] = colors[col];
}
else{
health_str = all_bots[i]['health'];
all_bots[i]['color'] = colors[col];
}
var mine = false;
for (var mybot in my.my_bots){
if (my.my_bots[mybot].id == all_bots[i]['robot_id']){
mine = true;
all_bots[i]['color'] = colors[1];
}
}
if (!mine){
col++;
}
players += ("<span style='color: " +
all_bots[i]['color'] +
";'>&nbsp&nbsp" +
all_bots[i]['robot_id'] +
" [" + health_str + "]</span>");
}
var players_div = document.getElementById("players");
if (players_div){
players_div.innerHTML = players;
}
// Now let's deal with all the things in the world
var i = 0;
if (my_robots){
instructions = {};
for (i=0; i < my_robots.length; i++){
if (my_robots[i].health > 0) {
instructions[my_robots[i]['id']] = my.update_robot(my_robots[i], new_data['obj']);
}
for (var bot in all_bots){
if (all_bots[bot]['robot_id'] == my_robots[i]['id']){
col = all_bots[bot]['color'];
}
}
if (my_robots[i].health <= 0){
col = grey;
}
if ("position" in my_robots[i]){
my_robots[i]['color'] = col;
my_robots[i]['type'] = 'robot';
draw_list.push(my_robots[i]);
}
}
if (my.websocket){
var payload = JSON.stringify(instructions);
// console.log(payload);
my.websocket.send(payload);
}
if (my.target < 0 && !my.spectator){
console.log("Watching " + my.my_bots[0].id);
my.renderer.set_focus_robot(my.my_bots[0].id);
my.target = 0;
}
}
if (robots){
for (i=0; i < robots.length; i++){
// Get the color from all_bots
var col = grey;
for (var bot in all_bots){
if (all_bots[bot]['robot_id'] == robots[i]['id']){
col = all_bots[bot]['color'];
}
}
if (robots[i].health <= 0){
col = grey;
}
if ("position" in robots[i]){
robots[i]['color'] = col;
robots[i]['type'] = 'robot';
draw_list.push(robots[i]);
}
}
}
// Draw the projecticles
var projectiles = new_data['projectiles'];
if (projectiles){
for (i=0; i < projectiles.length; i++){
if ("position" in projectiles[i]){
projectiles[i]['type'] = 'bullet';
draw_list.push(projectiles[i]);
}
}
}
// Draw the projecticles
var splosions = new_data['splosions'];
if (splosions){
for (i=0; i < splosions.length; i++){
if ("position" in splosions[i]){
splosions[i]['type'] = 'explosion';
draw_list.push(splosions[i]);
}
}
}
// Draw the objects
var obj = new_data['objects'];
if (obj){
for (i=0; i < obj.length; i++){
var o = {
bounds : obj[i]
};
o['type'] = "object";
o['position'] = {x: obj[i][0], y: obj[i][1]};
draw_list.push(o);
}
}
my.stats.end();
return draw_list;
};
my.eval_input = function( input, output ){
var theResult, evalSucceeded;
try{
theResult = eval( input );
evalSucceeded = true;
}
catch(e){
output.innerHTML = e;
}
if ( evalSucceeded ) {
output.innerHTML = "";
// console.log("OK");
}
return theResult;
};
my.get_robot_code = function(){
var robot_code = editor.getSession().getValue();
var output = document.getElementById('output');
var code = "( " + robot_code + " )";
var rc = my.eval_input(code, output);
return rc.call(this);
};
my.send_game_request = function() {
game = {
"id": my.game_id,
};
console.log(my.websocket.readyState);
my.websocket.send(JSON.stringify(game));
console.log("sent clientid: " + JSON.stringify(game));
};
my.send_client_id = function() {
client_id = {
"type": my.spectator ? "spectator" : "robot",
"name": "dummy",
"id": "24601",
"useragent": "gorobots.js",
};
my.websocket.send(JSON.stringify(client_id));
};
my.parse_game_params = function(params) {
// TODO: flesh out validation?
my.width = new_data.boardsize.width;
my.height = new_data.boardsize.height;
return true;
};
my.setup_robot = function(){
var robot = my.get_robot_code();
if ('setup' in robot){
var map = {"width": my.width, "height": my.height};
var config = {
"stats": robot.setup(map),
"id": my.id
};
// console.log(config);
if (!my.spectator) {
my.websocket.send(JSON.stringify(config));
}
}
};
my.update_robot = function(data, objects){
var robot = my.get_robot_code();
var map = {"width": my.width, "height": my.height, "obj": objects};
var instructions = null;
if ('update' in robot){
var dbg = {
"msg" : function(x, y, msg){
my.renderer.debug_label(x,y,msg);
},
"msg_screen" : function(x, y, msg){
my.renderer.debug_label_screen(x,y,msg);
},
"line" : function(x, y, x2, y2){
my.renderer.debug_line(x,y,x2,y2);
},
};
instructions = robot.update(data, map, dbg);
}
return instructions;
};
my.set_spectator = function(s){
my.spectator = s;
my.target=-1;
$('body').keypress(function(e){
if (my.renderer && my.renderer.canvas.clientWidth === 0){
// dont respond to key events when canvas is not in view
return;
}
if(e.which == 116){
// t
if (my.spectator){
my.target++;
if( my.target < my.all_bots.length){
console.log("Watching " + my.all_bots[my.target]);
my.renderer.set_focus_robot(my.all_bots[my.target]);
}
else {
my.target = -1;
my.renderer.set_focus_robot(null);
}
} else {
my.target++;
if( my.target < my.my_bots.length){
console.log(my.my_bots);
console.log(my.my_bots[my.target].id);
console.log("Watching " + my.my_bots[my.target].id);
my.renderer.set_focus_robot(my.my_bots[my.target].id);
}
else {
my.target = -1;
my.renderer.set_focus_robot(null);
}
}
}
});
};
my.set_server = function(server_name, game_id){
my.server = server_name;
my.game_id = game_id;
my.state = null;
if (my.websocket){
console.log("Switching Server: " + my.server);
my.websocket.close();
my.renderer.shutdown();
}
else{
console.log("Setting Server: " + my.server);
my.websocket = my.connect(my.server);
}
};
my.init = function(){
console.log("Welcome to GoRobots");
if (webgl){
my.renderer = gorobots_render_webgl();
}
else{
my.renderer = gorobots_render_canvas();
}
my.renderer.init("battlefield");
my.stats = new Stats();
my.stats.setMode(0); // 0: fps, 1: ms
// Align top-left
my.stats.domElement.style.position = 'absolute';
my.stats.domElement.style.left = '5px';
my.stats.domElement.style.top = '120px';
document.body.appendChild( my.stats.domElement );
$(my.stats.domElement).hide();
my.paused = false;
$('body').keypress(function(e){
// alert(e.which);
if(e.which == 112){
// p
my.paused = !my.paused;
}
if (my.renderer && my.renderer.canvas.clientWidth === 0){
// dont respond to key events when canvas is not in view
return;
}
if(e.which == 100){
// d
$(my.stats.domElement).toggle();
}
});
};
my.init();
return my;
};