2018-04-03 14:35:01 +02:00
|
|
|
// import all dependencies
|
2018-04-03 11:42:35 +02:00
|
|
|
const express = require('express');
|
|
|
|
const app = express();
|
|
|
|
const http = require('http').Server(app);
|
|
|
|
const io = require('socket.io')(http);
|
2018-04-03 14:35:01 +02:00
|
|
|
const http_port = process.env.PORT || 61813;
|
|
|
|
const net = require('net');
|
|
|
|
const input_port = 1337;
|
2018-04-04 12:31:55 +02:00
|
|
|
const myip = require('quick-local-ip');
|
|
|
|
const ip4 = myip.getLocalIP4();
|
|
|
|
const ip6 = myip.getLocalIP6();
|
|
|
|
|
2018-04-03 14:35:01 +02:00
|
|
|
// define canvas
|
|
|
|
var canvas_size_x = 100;
|
|
|
|
var canvas_size_y = 100;
|
2018-04-04 11:57:43 +02:00
|
|
|
var canvas_background = 'ffffff';
|
|
|
|
var canvas_content = [];
|
2018-04-03 14:35:01 +02:00
|
|
|
|
2018-04-04 11:57:43 +02:00
|
|
|
// stats counter
|
|
|
|
var pixel_count = 0;
|
|
|
|
var pixel_count_flat = 0;
|
|
|
|
var conn_count = 0;
|
|
|
|
var conn_count_flat = 0;
|
|
|
|
|
|
|
|
// FUNCTIONS
|
|
|
|
// get color
|
|
|
|
function get_color(x, y) {
|
|
|
|
if (canvas_content[x] != undefined) {
|
|
|
|
if (canvas_content[x][y] != undefined) {
|
|
|
|
return canvas_content[x][y];
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return canvas_background;
|
|
|
|
}
|
|
|
|
|
|
|
|
// str to color
|
|
|
|
function str_to_color(color) {
|
|
|
|
color = color.trim();
|
|
|
|
color = color.toLowerCase();
|
|
|
|
if (color.match(/^[a-f0-9]{6}$/i) == color) {
|
|
|
|
return color;
|
|
|
|
}
|
|
|
|
else if (color.match(/^[a-f0-9]{8}$/i) == color) {
|
|
|
|
return color.substr(0, 6);
|
|
|
|
}
|
|
|
|
else {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// color to HTML color
|
|
|
|
function color_to_html(color) {
|
|
|
|
return '#' + color;
|
|
|
|
}
|
|
|
|
|
|
|
|
// save color to canvas content
|
|
|
|
function color_to_canvas_content(x, y, color) {
|
|
|
|
if (canvas_content[x] == undefined) {
|
|
|
|
canvas_content[x] = [];
|
|
|
|
}
|
|
|
|
canvas_content[x][y] = color;
|
|
|
|
}
|
|
|
|
|
|
|
|
// STATS
|
|
|
|
function stats() {
|
|
|
|
pixel_count_flat = pixel_count;
|
|
|
|
pixel_count = 0;
|
|
|
|
conn_count_flat = conn_count;
|
|
|
|
io.sockets.emit('stats', {pixel: pixel_count_flat, connections: conn_count_flat})
|
|
|
|
|
|
|
|
}
|
|
|
|
setInterval(() => stats(), 1000);
|
|
|
|
|
|
|
|
// CONNECTIONS
|
2018-04-03 14:35:01 +02:00
|
|
|
// define static folder
|
2018-04-03 11:42:35 +02:00
|
|
|
app.use(express.static(__dirname + '/public'));
|
|
|
|
|
2018-04-03 14:35:01 +02:00
|
|
|
// output socket
|
|
|
|
io.on('connection', function (socket){
|
|
|
|
console.log("[HTTP] new connection");
|
2018-04-04 12:31:55 +02:00
|
|
|
socket.emit('setting', {
|
|
|
|
canvas: {
|
|
|
|
size: {
|
|
|
|
x: canvas_size_x,
|
|
|
|
y: canvas_size_y
|
|
|
|
}
|
|
|
|
},
|
|
|
|
network: {
|
|
|
|
ip4: ip4,
|
|
|
|
ip6: ip6,
|
|
|
|
port: input_port
|
|
|
|
}
|
|
|
|
});
|
2018-04-04 15:48:10 +02:00
|
|
|
socket.emit('drawn', canvas_content);
|
2018-04-03 14:35:01 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
// input socket
|
|
|
|
var server = net.createServer();
|
2018-04-03 12:48:19 +02:00
|
|
|
|
2018-04-03 14:35:01 +02:00
|
|
|
server.on('connection', function (server_socket) {
|
2018-04-04 11:57:43 +02:00
|
|
|
conn_count++;
|
2018-04-03 14:35:01 +02:00
|
|
|
server_socket.setEncoding('utf8');
|
|
|
|
console.log('[INPUT] new input');
|
|
|
|
server_socket.on('data', function (data) {
|
2018-04-03 12:48:19 +02:00
|
|
|
var command = data.split(" ");
|
2018-04-04 11:57:43 +02:00
|
|
|
if (command[0] == "PX") {
|
|
|
|
var x = parseInt(command[1]);
|
|
|
|
var y = parseInt(command[2]);
|
|
|
|
if (x <= canvas_size_x && y <= canvas_size_y) {
|
2018-04-03 12:48:19 +02:00
|
|
|
if (!isNaN(x) && !isNaN(y)) {
|
2018-04-04 11:57:43 +02:00
|
|
|
if (command[3] != undefined) {
|
|
|
|
var color = str_to_color(command[3]);
|
|
|
|
if (color !== false) {
|
2018-04-04 15:48:10 +02:00
|
|
|
io.sockets.emit('draw', {type: 'pixel', x: x, y: y, color: color});
|
2018-04-04 11:57:43 +02:00
|
|
|
pixel_count++;
|
|
|
|
color_to_canvas_content(x, y, color);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
server_socket.write('PX ' + x + ' ' + y + ' ' + get_color(x, y) + '\n');
|
2018-04-03 12:48:19 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2018-04-04 11:57:43 +02:00
|
|
|
else if (command[0] == 'SIZE') {
|
|
|
|
server_socket.write('SIZE ' + canvas_size_x + ' ' + canvas_size_x + '\n');
|
|
|
|
}
|
2018-04-04 15:48:10 +02:00
|
|
|
else if (command[0] == 'STATS') {
|
2018-04-04 11:57:43 +02:00
|
|
|
server_socket.write('STATS px:' + pixel_count_flat + ' conn:' + conn_count_flat + '\n');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
server_socket.on('close', function() {
|
|
|
|
conn_count--;
|
2018-04-03 12:52:21 +02:00
|
|
|
});
|
2018-04-03 14:35:01 +02:00
|
|
|
});
|
2018-04-03 12:48:19 +02:00
|
|
|
|
2018-04-03 14:35:01 +02:00
|
|
|
// start http
|
2018-04-04 12:56:08 +02:00
|
|
|
http.listen(http_port, () => console.log('[HTTP] started server at ' + ip4 + ':' + http_port));
|
2018-04-03 11:42:35 +02:00
|
|
|
|
2018-04-03 14:35:01 +02:00
|
|
|
// start input socket
|
2018-04-04 12:56:08 +02:00
|
|
|
server.listen(input_port, () => console.log('[INPUT] started server at ' + ip4 + ':' + input_port));
|