add start of client rendering

public/css/styles.css

@@ -1,6 +1,12 @@
+@font-face {
+    font-family: 'FreePixel';
+    src: url('/css/FreePixel.ttf');
+}
+
 * {
     margin: 0;
     padding: 0;
+	font-family: FreePixel;
 }
 
 body {

public/index.html

@@ -10,6 +10,7 @@
     </title>
 
     <script src="js/lib/socket.io.js"></script>
+    <script src="https://rawgit.com/Asraelite/pallet.js/master/pallet.js"></script>
 
     <script src="starbugs.min.js"></script>
 </head>

public/js/starbugs/main.js

@@ -2,8 +2,28 @@
 
 window.addEventListener('load', init);
 
-var socket;
+var game;
 
 function init() {
-	socket = io.connect('http://localhost:8080');
+	game = new Game();
+
+	game.tick();
+
+	game.net.connect();
+}
+
+function Game() {
+	var self = this;
+
+	this.connected = false;
+	this.state = 'connecting';
+
+	this.net = new Net();
+	this.renderer = new Renderer();
+
+	this.tick = function() {
+		self.renderer.render(self.state);
+
+		requestAnimationFrame(self.tick);
+	}
 }

public/js/starbugs/net.js

@@ -0,0 +1,17 @@
+function Net() {
+	this.socket;
+
+	this.connect = function() {
+		this.socket = io.connect('http://localhost:8080');
+
+		this.socket.on('connect', function() {
+			game.connected = true;
+			game.state = 'connected';
+		});
+
+		this.socket.on('disconnect', function() {
+			game.connected = false;
+			game.state = 'disconnected';
+		});
+	};
+}

public/js/starbugs/render/render.js

@@ -0,0 +1,24 @@
+function Renderer() {
+	var self = this;
+
+	var canvas = document.getElementsByTagName('canvas')[0];
+	var context = canvas.getContext('2d');
+	var pallet = new Pallet();
+
+	this.render = function(state) {
+		if (state == 'connecting' || state == 'disconnected') {
+			pallet.clear();
+			pallet.fill('#111');
+			var str = state == 'connecting' ? 'Connecting' : 'Shit\'s ' +
+			'diconnected, yo!';
+			pallet.text(str, canvas.width / 2, canvas.height / 2, '#fff', 'FreePixel', 16, 'center', 'middle');
+			return;
+		}
+
+		pallet.clear();
+		pallet.fill('#000');
+	}
+
+	pallet.fillScreen();
+	window.addEventListener('resize', pallet.fillScreen);
+}

public/js/starbugs/world/player.js

@@ -0,0 +1,5 @@
+function Player(own, name, ship) {
+	this.name = name;
+	this.ship = ship;
+	this.own = own;
+}

server/game/net/connection.js

@@ -1,8 +1,51 @@
 'use strict';
 
 class Connection {
-	constructor() {
+	constructor(net, socket) {
+		this.net = net;
+		this.connections = net.connections;
+		this.io = net.io;
+		this.socket = socket;
 
+		this.player = false;
+		this._room = false;
+		this.name = '';
+		this.chatCooldown = 0;
+
+		socket.on('chat', data => {
+			this.chat(data);
+		});
+
+		socket.on('setName', data => {
+			this.player.name = data.name;
+		});
+
+		this.room = 'egg';
+	}
+
+	chat(data) {
+		console.log(this.room);
+		if(this.chatCooldown > 5 || !this.room) return;
+
+		this.chatCooldown++;
+		this.io.to(this.room).emit('chat', {
+			name: this.player.name,
+			msg: data.msg.slice(0, 100)
+		});
+	}
+
+	tick() {
+		this.chatCooldown -= 1;
+	}
+
+	get room() {
+		return this._room;
+	}
+
+	set room(str) {
+		this.socket.leave(this._room);
+		this.socket.join(str);
+		this._room = str;
 	}
 }
 

server/game/net/index.js

@@ -7,16 +7,20 @@ const Connection = require('./connection.js');
 class GameNet {
 	constructor() {
 		this.io = socketio(starbugs.webServer.appServer);
+
+		this.connections = new Map();
 	}
 
 	listen() {
 		let io = this.io;
+		let cons = this.connections;
 
 		this.io.on('connection', socket => {
-			console.log('connection');
+			let id = socket.id;
+			cons.set(id, new Connection(this, socket));
 
-			socket.on('other event', data => {
+			socket.on('disconnect', _ => {
-				console.log(data);
+				cons.delete(id);
 			});
 		});
 	}