Просмотр исходного кода

load and send pixls via websockets.

Lucas Stadler лет назад: 12
Родитель
Сommit
575fe87640
4 измененных файлов с 60 добавлено и 1 удалено
  1. 1 0
      js/pixl/.gitignore
  2. 28 1
      js/pixl/index.html
  3. 8 0
      js/pixl/package.json
  4. 23 0
      js/pixl/server.js

+ 1 - 0
js/pixl/.gitignore

@ -0,0 +1 @@
1
/node_modules

+ 28 - 1
js/pixl/index.html

@ -30,7 +30,7 @@
30 30
		pixl.stage = document.querySelector("#stage");
31 31
		pixl.ctx = stage.getContext("2d");
32 32
		pixl.window = {w: window.innerWidth, h: window.innerHeight};
33
		pixl.world = {"0,0": {}, "-1,0": {}};
33
		pixl.world = {};
34 34
		pixl.pos = {x: 0, y: 0};
35 35
		pixl.size = 20;
36 36
@ -52,6 +52,9 @@
52 52
			var screen_pos = pixl.to_screen(pos);
53 53
			pixl.ctx.fillRect(screen_pos.x, screen_pos.y, pixl.size, pixl.size);
54 54
			pixl.world[pos.x + "," + pos.y] = {};
55
			if (pixl.online) {
56
				pixl.ws.send(JSON.stringify({x: pos.x, y: pos.y, color: color || "black"}));
57
			}
55 58
		}
56 59
57 60
		pixl.redraw = function() {
@ -138,6 +141,30 @@
138 141
				pixl.redraw();
139 142
			}
140 143
		});
144
145
		pixl.online = false;
146
		pixl.connect = function() {
147
			pixl.ws = new WebSocket('ws://localhost:8001');
148
			pixl.ws.onopen = function() { pixl.online = true; };
149
			pixl.ws.onclose = function() { pixl.online = false; };
150
			pixl.ws.onmessage = function(msg) {
151
				var obj = JSON.parse(msg.data);
152
				if (obj.length !== undefined) {
153
					obj.forEach(function(p) {
154
						pixl.world[p.x + "," + p.y] = {color: p.color};
155
						pixl.draw_pixl(p, p.color);
156
					});
157
				} else {
158
					pixl.world = obj;
159
					pixl.redraw();
160
				}
161
			};
162
		};
163
		pixl.disconnect = function () {
164
			pixl.ws.close();
165
		};
166
167
		pixl.connect();
141 168
	</script>
142 169
</body>
143 170
</html>

+ 8 - 0
js/pixl/package.json

@ -0,0 +1,8 @@
1
{
2
	"name": "pixl-server",
3
	"description": "server for a collaborative, programmable, pixel-placing game.",
4
	"version": "0.0.0-alpha",
5
	"dependencies": {
6
		"ws": "0.4.31"
7
	}
8
}

+ 23 - 0
js/pixl/server.js

@ -0,0 +1,23 @@
1
var ws = require('ws');
2
3
var server = new ws.Server({port: 8001});
4
5
var world = {};
6
7
server.on('connection', function(socket) {
8
	socket.send(JSON.stringify(world));
9
10
	socket.on('message', function(msg) {
11
		var pixl = JSON.parse(msg);
12
		world[pixl.x + "," + pixl.y] = {color: pixl.color};
13
14
		console.log(pixl);
15
16
		server.clients.forEach(function(client) {
17
			if (socket != client) {
18
				console.log('broadcasting to ', client);
19
				client.send(msg);
20
			}
21
		});
22
	});
23
});