Search the Community

Showing results for tags 'socket.io'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda.js
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 27 results

  1. Hi all! I'm newbie to game development. I just complete my first game, a simple game using HTML5 canvas, socket.io and express. I have NodeJS npm installed and i run my game locally in my PC as npm game.js. The question is that now i want this game to upload to a server where different users from different devices play the game. Is it works like we upload normal sites to domains or different. Please help! Thanks.
  2. Hello everybody! I can create single player games with phaser and now I want to start making multiplayer games using socket.io + node.js So unfortunately I haven't found any tutorials about how to create games on phaser with phaser. I have never had projects with serverpart(so I have no experience in it) So that's all I could understand and write myself :[ SERVER PART var express = require('express'); var app = express(); var serv = require('http').Server(app); var counter = 0; app.get('/', function(req, res) { res.sendFile(__dirname + '/client/index.html'); }); app.use('/client', express.static('/client')); serv.listen(2000); console.log('server started'); var io = require('socket.io')(serv); io.sockets.on('connection', function(socket) { counter++; console.log('connection #' + counter); }); Client <script> var socket = io(); var sendInfo = function() { socket.emit('objAppear'); } </script> <button id="btn" onclick="sendInfo();">Appear</button> Of course that's the simplest thing to create using node + socket.io So now I want to create multiplayer in games I've already created. But how?!?! I can't find any tutorials. Can you please help me. Server part is too hard for me
  3. Hi, Infinitris - A massively multiplayer online falling block puzzle game, created using Phaser, React, Socket.io and Koa. Here it is: Infinitris.io Controls: Arrow keys and spacebar. Current Features: Classic .io style: Instant join - only specify your nickname and you're ready to play. Ingame chat (Press [Enter]) Grid that expands and collapses based on how many players are in the game. Horizontal wrapping when the grid is larger than the screen. Scoreboard Invalid block placement detection (needs work) Features to add: Spectator mode AFK detection Touch controls Minimap Mobile fullscreen Multiple game rooms Block collections and themes User registration to secure your nickname Facebook: https://www.facebook.com/infinitris Twitter: https://twitter.com/infinitris_io Blog: https://infinitrisblog.wordpress.com/ Please give it a try and let me know what you think! Pyre
  4. Ranger Steve is a web (phaser) based realtime 2d shooter that let's you have instant lan parties with your friends. Ranger Steve: Buffalo Invasion YouTube Teaser Trailer Fast paced, intense shooter, explosions This is a realtime, "shoot em up", explosive multiplayer game that makes playing with your friends as simple as sharing a link. Made with: Phaser.io, ReactJS, NodeJS, Socket.io, and Redux.
  5. Hi guys, I'd like to show my last game: PressBall. Yo can see the game info and play here: Info and Play Game available for exclusive or non-exclusive licensing. If you are interested, feel free to write via: contact@ninjabitsgames.com It's my first time using socket.io and phaser, any feedback is welcome!
  6. As I don't have an external server at the moment, I'm trying to fake a bit of latency using SetTimeout. The code is based on Gabriel Gambetta's code for handling an authoritative server: http://www.gabrielgambetta.com/fpm_live.html And yeah. I know the code is very ugly and prototypish, no handling of multiple users, etc. etc.. I am sending inputs as well as the time the key is pressed, as a way of making it time-independent, but I have no sanity checks. If I keep the networkLatency at 0, it seems to run very smoothly, and both reconciliation and prediction works very well. However, if I add a delay, of say, 200 ms, it behaves strangely, and I can't really see why. This is the code handling the updating of the position, and the prediction based on previously saved inputs, and as far as I can see, this should work: iosocket.on('updatePOS', function(message) { setTimeout(function () { sphereBody.position.x = message.x; sphereBody.position.y = message.y; sphereBody.position.z = message.z; ghostSphere.position.x = message.x; ghostSphere.position.y = message.y; ghostSphere.position.z = message.z; lastSequence = message.last; console.log(lastSequence); for (var x in pending_inputs){ if (x <= lastSequence){ console.log(x); delete pending_inputs[x]; pending_inputs.splice(x, 1); delete inputsToSend[x]; inputsToSend.splice(x, 1); } else { //console.log(x); // console.log(pending_inputs[x]); applyInputs(pending_inputs[x]); } } }, networkLatency); }); Even with a delay/latency, the function should still take into consideration the saved inputs, and apply these when the new positional updates are received. So even when apllying updates as old as 200ms, the result should be the same as the predicted state. If someone can spot where the issue is, that would be awesome. If someone has a VPS with some real latency, a test of that woulld be appreciated too. index.html: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Babylon - Basic scene</title> <style> html, body { overflow: hidden; width: 100%; height: 100%; margin: 0; padding: 0; } #renderCanvas { width: 100%; height: 100%; touch-action: none; } </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/babylonjs/2.4.0/babylon.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.8/socket.io.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/cannon.js/0.6.2/cannon.js"></script> <!-- optional physics engine --> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> </head> <body> <canvas id="renderCanvas"></canvas> <script type="text/javascript"> var sphere, inputs = []; var globalGravity = new CANNON.Vec3(0,-30,0); var camera; var lastSequence = 0; var client = {}; client.left = false; client.right = false; client.forward = false; client.back = false; pending_inputs = []; inputsToSend = []; input_sequence_number = -1; var networkLatency = 0; // var keys; // keys.left=1; this.playerDirection = [0,0,0,0]; quat = new CANNON.Quaternion(); var iosocket = io.connect("http://localhost:8080"); iosocket.on('connect', function () { console.log("connect"); iosocket.on('message', function(message) { // console.log(message); }); iosocket.on('updatePOS', function(message) { setTimeout(function () { sphereBody.position.x = message.x; sphereBody.position.y = message.y; sphereBody.position.z = message.z; ghostSphere.position.x = message.x; ghostSphere.position.y = message.y; ghostSphere.position.z = message.z; lastSequence = message.last; console.log(lastSequence); for (var x in pending_inputs){ if (x <= lastSequence){ console.log(x); delete pending_inputs[x]; pending_inputs.splice(x, 1); delete inputsToSend[x]; inputsToSend.splice(x, 1); } else { //console.log(x); // console.log(pending_inputs[x]); applyInputs(pending_inputs[x]); } } }, networkLatency); }); iosocket.on('spawnPlayer', function(player) { console.log("Spawning Player"); }); iosocket.on('disconnect', function() { }); }); var canvas = document.querySelector("#renderCanvas"); var engine = new BABYLON.Engine(canvas, true); // setTimeout(sendInput, 2000); function sendInput(){ console.log("2 sek"); for (var x in inputsToSend){ iosocket.emit('input', inputsToSend[x]); } setTimeout(sendInput, 2000); } var createScene = function () { this.playerDirection = [0,0,0,0]; // Now create a basic Babylon Scene object var scene = new BABYLON.Scene(engine); scene.debugLayer.show(); // Change the scene background color to green. scene.clearColor = new BABYLON.Color3(0, 1, 0); // This creates and positions a free camera camera = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 5, -10), scene); // This targets the camera to scene origin camera.setTarget(BABYLON.Vector3.Zero()); // This attaches the camera to the canvas camera.attachControl(canvas, false); // This creates a light, aiming 0,1,0 - to the sky. var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene); // Dim the light a small amount light.intensity = .5; // Let's try our built-in 'sphere' shape. Params: name, subdivisions, size, scene this.sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 2, scene); this.sphere.quaternion = new CANNON.Quaternion(0,0,0,0); this.box = BABYLON.MeshBuilder.CreateBox("box", {height: 5}, scene); // Move the sphere upward 1/2 its height this.sphere.position.y = 2; this.box.position.y = 2.5; this.box.position.z = 2; this.box.parent = this.sphere; ghostSphere = BABYLON.Mesh.CreateSphere("ghost", 16, 2, scene); var ghostMat = new BABYLON.StandardMaterial("texture1", scene); ghostMat.diffuseColor = new BABYLON.Color3(0.5, 0.2, 0.7); ghostMat.alpha = 0.6; ghostSphere.material = ghostMat; // Let's try our built-in 'ground' shape. Params: name, width, depth, subdivisions, scene this.ground = BABYLON.Mesh.CreateGround("ground1", 6, 6, 2, scene); this.ground.rotation = new CANNON.Vec3(-0,0,0); BABYLON.SceneLoader.ImportMesh("", "https://raw.githubusercontent.com/RaggarDK/Baby/baby/", "height.babylon", scene, function (newMeshes) { setTimeout(function () { ground = newMeshes[1]; var material = new BABYLON.StandardMaterial("texture1", scene); //window.ground = ground; //ground.parent = undefined; ground.scaling.copyFromFloats(.3, .3, .3); ground.bakeCurrentTransformIntoVertices(); material.diffuseTexture = new BABYLON.Texture("https://raw.githubusercontent.com/RaggarDK/Baby/baby/plan.png", scene); ground.material = material; //ground.physicsImpostor = new BABYLON.PhysicsImpostor(ground, BABYLON.PhysicsEngine.HeightmapImpostor, { mass: 0 }, scene); createHeightmap(newMeshes[1]); }, 2000) }); // window.addEventListener("keydown", handleKeyDown, false); // window.addEventListener("keyup", handleKeyUp, false); window.addEventListener("mousemove", function(e) { // console.log("mouse"); event = e; var movementX = event.movementX || event.mozMovementX || event.webkitMovementX || 0; var movementY = event.movementY || event.mozMovementY || event.webkitMovementY || 0; //this.sphereBody.quaternion.y += movementX * 0.002; // this.sphereBody.quaternion.x += movementY * 0.002; sphereBody.rotation.y += movementX * 0.008; sphereBody.rotation.x += movementY * 0.008; }); seq = 0; function handleKeyDown(evt){ seq += 1; if (evt.keyCode==16){ if(inputs){ console.log(inputs); } } if (evt.keyCode==65){ inputs[seq] = {left:1, rot:sphereBody.rotation}; this.playerDirection[0] = 1; applyInput(seq, "left", sphereBody.rotation); console.log(seq); // iosocket.emit('input', { left:1, rot:sphereBody.rotation}); // shootBullet(sphereBody.rotation.y, sphereBody.position); } if (evt.keyCode==68){ sphereBody.position.x += .1; inputs[seq] = {right:1, rot:sphereBody.rotation}; this.playerDirection[1] = 1; //applyInput(seq, "right", sphereBody.rotation); //iosocket.emit('input', { right:1, rot:sphereBody.rotation}); } if (evt.keyCode==87){ inputs[seq] = {forward:1, rot:sphereBody.rotation}; applyInput(seq, "forward", sphereBody.rotation); this.playerDirection[2] = 1; // iosocket.emit('input', { forward:1, rot:sphereBody.rotation}); } if (evt.keyCode==83){ inputs[seq] = {back:1, rot:sphereBody.rotation}; this.playerDirection[3] = 1; applyInput(seq, "back", sphereBody.rotation); // iosocket.emit('input', { back:1, rot:sphereBody.rotation}); } } function handleKeyUp(evt){ if (evt.keyCode==65){ this.playerDirection[0] = 0; // iosocket.emit('input', { left:0}); } if (evt.keyCode==68){ // iosocket.emit('input', { right:0}); this.playerDirection[1] = 0; } if (evt.keyCode==87){ // iosocket.emit('input', { forward:0}); this.playerDirection[2] = 0; } if (evt.keyCode==83){ // iosocket.emit('input', { back:0}); this.playerDirection[3] = 0; } } var keyHandler = function(e) { e = e || window.event; if (e.keyCode == 65) { console.log("Lefty"); client.left = (e.type == "keydown"); } if (e.keyCode == 68) { console.log("righty"); client.right = (e.type == "keydown"); } if (e.keyCode == 87) { console.log("forward"); client.forward = (e.type == "keydown"); } else if (e.keyCode == 83) { client.back = (e.type == "keydown"); console.log("back"); } }; window.addEventListener("keydown", keyHandler, false); window.addEventListener("keyup", keyHandler, false); return scene; }; var createPhysics = function(){ console.log("createPhysicsFunction Called!"); world = new CANNON.World(); world.gravity.set(0,-30,0); world.broadphase = new CANNON.NaiveBroadphase(); var mass = 5, radius = 1; sphereShape = new CANNON.Sphere(radius); // Step 1 sphereBody = new CANNON.Body({mass: 1, shape: sphereShape}); // Step 2 sphereBody.position.set(0,2,2); sphereBody.rotation = new CANNON.Vec3(); world.add(sphereBody); // Step 3 console.log("sphereBodyPosition0: " + sphereBody.position); sphereBody.quaternion.setFromAxisAngle(new CANNON.Vec3(1,0,0),-Math.PI/2); groundShape = new CANNON.Plane(); groundBody = new CANNON.Body({ mass: 0, shape: groundShape }); console.log(groundBody.rotation); groundBody.quaternion.setFromAxisAngle(new CANNON.Vec3(1,0,0),-Math.PI/2); console.log(groundBody.quaternion); world.add(groundBody); timeStep = 1.0 / 60.0; // seconds velocity = sphereBody.velocity; sphereBody.velocity = new CANNON.Vec3(0,0,0); return world; } var scene = createScene(); this.world = createPhysics(); var zeroVel = new CANNON.Vec3(0,0,0); var inputVelocity = new CANNON.Vec3(); var lastTime = (new Date()).getTime(); var currentTime = 0; var delta = 0; engine.runRenderLoop(function () { currentTime = (new Date()).getTime(); delta = (currentTime - lastTime) / 1000; // console.log(delta); processInputs(); scene.render(); world.step(1.0 / 60.0); velocity = sphereBody.velocity; this.sphere.position = sphereBody.position; this.sphere.rotation = sphereBody.rotation; moveSpeed = .1; // camera.position.x = sphereBody.position.x // camera.position.z = sphereBody.position.z // camera.rotation = sphereBody.rotation; //sphereBody.position.z += moveSpeed; //console.log(sphereBody.position.x); velocity.x = inputVelocity.x; velocity.z = inputVelocity.z; lastTime = currentTime; }); window.addEventListener("resize", function () { engine.resize(); }); function processInputs() { // Compute delta time since last update. var now_ts = +new Date(); var last_ts = this.last_ts || now_ts; var dt_sec = (now_ts - last_ts) / 1000.0; this.last_ts = now_ts; // Package player's input. var input; if (client.right) { input = {dir:"right", press_time: dt_sec }; }else if (client.forward && client.left) { input = {dir:"sfLeft", press_time: dt_sec }; } else if (client.left) { input = {dir:"left", press_time: dt_sec }; }else if (client.forward) { input = {dir:"forward", press_time: dt_sec }; }else if (client.back) { input = {dir:"back", press_time: dt_sec }; } else { // Nothing interesting happened. return; } // Send the input to the server. input.input_sequence_number = input_sequence_number++; console.log(input.input_sequence_number); // input.entity_id = this.entity_id; applyInputs(input); inputsToSend.push(input); iosocket.emit('input', input); // Save this input for later reconciliation. pending_inputs.push(input); } function applyInputs(input) { // console.log(input.dir); if (input.dir == "left"){ sphereBody.position.x += -input.press_time*5; } if (input.dir == "right"){ sphereBody.position.x += input.press_time*5; } if (input.dir == "forward"){ sphereBody.position.z += input.press_time*5; } if (input.dir == "back"){ sphereBody.position.z += -input.press_time*5; } if (input.dir == "sfLeft"){ sphereBody.position.z += input.press_time*2.5; sphereBody.position.x += -input.press_time*2.5; } } function createHeightmap (object, pointDepth) { var pos = object.getVerticesData(BABYLON.VertexBuffer.PositionKind); var matrix = []; //For now pointDepth will not be used and will be automatically calculated. //Future reference - try and find the best place to add a reference to the pointDepth variable. var arraySize = pointDepth || ~~(Math.sqrt(pos.length / 3) - 1); var dim = Math.min(object.getBoundingInfo().boundingBox.extendSize.x, object.getBoundingInfo().boundingBox.extendSize.z); var elementSize = dim * 2 / arraySize; var minY = object.getBoundingInfo().boundingBox.extendSize.y; for (var i = 0; i < pos.length; i = i + 3) { var x = Math.round((pos[i + 0]) / elementSize + arraySize / 2); var z = Math.round(((pos[i + 2]) / elementSize - arraySize / 2) * -1); var y = pos[i + 1] + minY; if (!matrix[x]) { matrix[x] = []; } if (!matrix[x][z]) { matrix[x][z] = y; } matrix[x][z] = Math.max(y, matrix[x][z]); } for (var x = 0; x <= arraySize; ++x) { if (!matrix[x]) { var loc = 1; while (!matrix[(x + loc) % arraySize]) { loc++; } matrix[x] = matrix[(x + loc) % arraySize].slice(); } for (var z = 0; z <= arraySize; ++z) { if (!matrix[x][z]) { var loc = 1; var newValue; while (newValue === undefined) { newValue = matrix[x][(z + loc++) % arraySize]; } matrix[x][z] = newValue; } } } var shape = new CANNON.Heightfield(matrix, { elementSize: elementSize }); console.log(elementSize); //Output Matrix Info for Node.js console.log(matrix.length); for (i=0;i<matrix.length;i++){ //GET MATRIX DATA //console.info(JSON.stringify(matrix[0], null, ' ')) console.log("\n" + "matrix2[" + i + "] = " + JSON.stringify(matrix[i], null, ' ')) } heightBody = new CANNON.Body({mass: 0, shape: shape}); // Step 2 heightBody.position.y = -4.5; heightBody.position.x = -30; heightBody.position.z = 30; heightBody.quaternion.setFromAxisAngle(new CANNON.Vec3(1,0,0),-Math.PI/2); console.log(heightBody.position); world.add(heightBody); }; </script> </body> </html> server.js: /* Copyright (c) 2012 Sven "FuzzYspo0N" Bergström http://underscorediscovery.com MIT Licensed. See LICENSE for full license. Usage : node simplest.app.js */ var gameport = process.env.PORT || 4004, CANNON = require('cannon'), io = require('socket.io'), socketio = require('socket.io'), express = require('express'), UUID = require('node-uuid'), fs = require('fs'), gameloop = require('node-gameloop'), verbose = false; var fs = require('fs') , http = require('http') , socketio = require('socket.io'); var server = http.createServer(function(req, res) { res.writeHead(200, { 'Content-type': 'text/html'}); res.end(fs.readFileSync(__dirname + '/index.html')); }).listen(8080, function() { console.log('Listening at: http://localhost:8080'); }); timeStep = 1.0 / 60.0; moveSpeed = .1; lastProcessedInput = -1; socketio.listen(server).on('connection', function (socket) { socket.emit('spawnPlayer'); var testLat = 0; var networkLoop = gameloop.setGameLoop(function(delta) { //socket.emit('news', { x: sphereBody.position.x, y: sphereBody.position.y, z: sphereBody.position.z, last:lastProcessedInput}); socket.emit('updatePOS', { x: sphereBody.position.x, y: sphereBody.position.y, z: sphereBody.position.z, last:lastProcessedInput}); }, 1000 / 10); socket.on('input', function (inp) { applyInput(inp); console.log(inp.input_sequence_number); }); sphereBody.velocity = new CANNON.Vec3(0,0,0); /*socket.on('arrayInput', function (ainput) { for (var input in ainput){ if (ainput.input_sequence_number > lastProcessedInput){ applyInput(ainput[input]); } } }); */ }); function applyInput(inp){ sphereBody.velocity.x = 0; if (inp.dir == "right"){ sphereBody.position.x += inp.press_time*5; } if (inp.dir == "sfLeft"){ sphereBody.position.z += inp.press_time*2.5; sphereBody.position.x += -inp.press_time*2.5; } if (inp.dir == "left"){ sphereBody.position.x += -inp.press_time*5; } if (inp.dir == "forward"){ sphereBody.position.z += inp.press_time*5; } if (inp.dir == "back"){ sphereBody.position.z += -inp.press_time*5; } lastProcessedInput = inp.input_sequence_number; console.log(lastProcessedInput); } var initPhysics = function() { world = new CANNON.World(); world.gravity.set(0,-30,0); world.broadphase = new CANNON.NaiveBroadphase(); var mass = 5, radius = 1; sphereShape = new CANNON.Sphere(radius); sphereBody = new CANNON.Body({mass: 1, shape: sphereShape}); sphereBody.position.set(0,2,2); sphereBody.rotation = new CANNON.Vec3(); world.add(sphereBody); sphereBody.quaternion.setFromAxisAngle(new CANNON.Vec3(1,0,0),-Math.PI/2); createHeightfield(); } var frameCount = 0; var mainLoop = gameloop.setGameLoop(function(delta) { // console.log('Hi there! (frame=%s, delta=%s)', frameCount++, delta); world.step(timeStep); // console.log(sphereBody.position); if (sphereBody){ velocity = sphereBody.velocity; //sphereBody.velocity.z = 0; var inputVelocity = new CANNON.Vec3(); sphereBody.velocity.x = 0; sphereBody.velocity.z = 0; velocity.x = inputVelocity.x; velocity.z = inputVelocity.z; } }, 1000 / 60); function createHeightfield(){ matrix2 = []; elementSize = 2.9999426007270813; matrix2[0] = [ 10.294134842548655, 10.294077302543254, 10.294019762537854, 10.293962222532453, 10.293904682527053, 10.293847142521653, 10.293789602516252, 10.293732062510852, 10.293674522505452, 10.293616982500051, 10.29355944249465, 10.29350190248925, 10.29344436248385, 10.29338682247845, 10.29332928247305, 10.293271742467649, 10.293214202462249, 10.293156662456848, 10.293099122451448, 10.293041582446047, 10.292984042440647 ]; matrix2[1] = [ 10.294134842548655, 10.294077302543254, 10.294019762537854, 10.293962222532453, 10.293904682527053, 10.293847142521653, 10.293789602516252, 10.293732062510852, 10.293674522505452, 10.293616982500051, 10.29355944249465, 10.29350190248925, 10.29344436248385, 10.29338682247845, 10.29332928247305, 10.293271742467649, 10.293214202462249, 10.293156662456848, 10.293099122451448, 10.293041582446047, 10.292984042440647 ]; matrix2[2] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[3] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[4] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[5] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 1.260629979194317, 1.2605724391889166, 1.2605148991835162, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[6] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 1.260629979194317, 1.2605724391889166, 1.2605148991835162, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[7] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 1.260629979194317, 1.2605724391889166, 1.2605148991835162, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[8] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[9] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 4.516292111633966, 4.516234571628566 ]; matrix2[10] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 4.516292111633966, 4.516234571628566 ]; matrix2[11] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 4.516292111633966, 4.516234571628566 ]; matrix2[12] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[13] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[14] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 7.674529389168344, 7.674471849162944, 7.674414309157544, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[15] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 7.674529389168344, 7.674471849162944, 7.674414309157544, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[16] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 7.674529389168344, 7.674471849162944, 7.674414309157544, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[17] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[18] = [ 10.294134842548655, 10.294077302543254, 4.517270291725772, 4.517212751720372, 4.517155211714972, 4.517097671709571, 4.517040131704171, 4.5169825916987705, 4.51692505169337, 4.51686751168797, 4.516809971682569, 4.516752431677169, 4.516694891671769, 4.516637351666368, 4.516579811660968, 4.5165222716555675, 4.516464731650167, 4.516407191644767, 4.516349651639366, 10.293041582446047, 10.292984042440647 ]; matrix2[19] = [ 10.294134842548655, 10.294077302543254, 10.294019762537854, 10.293962222532453, 10.293904682527053, 10.293847142521653, 10.293789602516252, 10.293732062510852, 10.293674522505452, 10.293616982500051, 10.29355944249465, 10.29350190248925, 10.29344436248385, 10.29338682247845, 10.29332928247305, 10.293271742467649, 10.293214202462249, 10.293156662456848, 10.293099122451448, 10.293041582446047, 10.292984042440647 ]; matrix2[20] = [ 10.294134842548655, 10.294077302543254, 10.294019762537854, 10.293962222532453, 10.293904682527053, 10.293847142521653, 10.293789602516252, 10.293732062510852, 10.293674522505452, 10.293616982500051, 10.29355944249465, 10.29350190248925, 10.29344436248385, 10.29338682247845, 10.29332928247305, 10.293271742467649, 10.293214202462249, 10.293156662456848, 10.293099122451448, 10.293041582446047, 10.292984042440647 ]; shape = new CANNON.Heightfield(matrix2, { elementSize: elementSize }); heightBody = new CANNON.Body({mass: 0, shape: shape}); // Step 2 heightBody.position.y = -4.5; heightBody.position.x = -30; heightBody.position.z = 30; heightBody.quaternion.setFromAxisAngle(new CANNON.Vec3(1,0,0),-Math.PI/2); console.log(heightBody.position); world.add(heightBody); } initPhysics(); Node.js for the server.js Chrome for the index.html WASD to move around.
  7. Hello my gamedevelopers friends I write this post because I have a issue, but I don't know how to solve it. I developing a multiplayer HTML5 game with Phaser. Well, is not entirely multiplayer because the players doesn't play among them but they interact with a datebase. The game consists in find riddles around a map with the mouse or touches. When the user find the riddle and write the correct answer the backend must be send to client a update of score. That I can't find because my solution doesn't work I work with socket.io and NodeJs because I need some connection between the client and the server. I tried the following: //SERVER socket.on("connection",function(socket){ socket.emit("websocket",dateJSON); //dateJSON is a date brought from the datebase, for example the username console.log("The server send a message to client"); }); //CLIENT var UserName; var socket = io.connect("http://localhost:8000"); socket.on("websocket",function(date){ UserName = date[0].username; //Like that because I need the username from the JSON }); console.log(UserName); If I execute the ultimate instrucction console.log(UserName), I will give get "Undefined"... I don't know why That was a example of what I want do. I need set a variables of client with date sent from the server. Before that, I will display that values in my game. The update of scores when the player win a riddle I want do the same way, but I need find the solutions. I have a week in this problem. If you know the solution or another way to solve it. Please help me :'( the game will be very fun and that is all I need to finish. Greetings!!!
  8. Hi everybody, I'm back after more or less one year :D. I 've been very busy with a lots of universiy exams, but now I have some time, so I've decided to made this simple real-time multiplayer game. Here is the code : Real-time-multiplayer-game-with-BabylonJS-and-socket.io Wht do you think about that? In your opinion, the logic behind the creation of the meshes is correct? This not the best game ever , but it is just an experiment and a way to learn how socket.io and BabylonJs can work togheter. Thanks a lot for all the previous support. Cheers, DellaFree p.s. It's my first project on github, so feel free to correct and modify whatever you want
  9. I made a simple multiplayer top-down shooter. Please try to play and give me a feedback. https://bykanov.ru/multiwar Description. Play against other players. Shoot and kill. Let blown body of your enemies sprinkle this battlefield. Control. Use the arrows on your keyboard to move and the mouse for aiming. Click or hold left mouse button to shoot. How it works. There is phaser.js on the client side. Nodejs, nginx - on the server side. I picked socket.io as a connection mechanism.
  10. I am tinkering with a simple 2D top down multi-player space "shooter" and have figured out enough from the Phaser documentation to build something that works with socket.io. My issue now is that when opening the game in two tabs both players starting co-ordinates should be identical as they are set via game.world.centerX and game.world.centerY. However players appear to be offset from one another. I am transmitting player.body.x and player.body.y. I have attached a screen grab of what I am seeing, any help would be very much appreciated.
  11. Hey, Initially I used https://github.com/belohlavek/phaser-es6-boilerplate for the boilerplate of my game. I configured Gulpfile.js for my taste a bit and everything worked properly. However, I needed to rely on NodeJS/socket.io to develop a backend server so I could add multiplayer functionality. I watched some tutorials/read some guides and eventually came up with a solution. (Actually, checked some open source Github repos and tried to learn from them.) This brought me an issue that I can't solve without having knowledge about NodeJS ecosystem. Right now, when I start developing: 1. I enter mygameclient folder, run npm start, and some plugin in this file (https://github.com/belohlavek/phaser-es6-boilerplate/blob/master/gulpfile.js) hosts my game at port 3000. 2. I enter mygameserver folder, run npm start, a plugin called Nodemon executes server.js, server.js runs on port 8080 which contains socket.io listeners/static endpoints for Express. (https://gist.github.com/sogko/b53d33d4f3b40d3b4b2e) The whole thing became a mess. I want to make sure NodeJS runs on port 80, loads index.html when I enter localhost:80/index.html. Questions 1. Should I ditch Browsersync and rely on Nodemon? What is Nodemon? Can I just rely on a basic NodeJS server instead? Can I host everything (game files, socket.io connections) on port 80? 2. How do you install a NodeJS as a production backend? Do you need to rely on web services such as Nginx? 3. Right now my game makes a socket connection on Phaser.update, which means it transfers data 60 times per second. Would that be overkill or this is how it is supposed to work? 4. Is it possible to "Observe" player.x and player.y data, and run an event whenever those attributes are changed? (e.g player.moving((player) => this.socket.emit("moving", player)); 5. When I develop monsters, should I develop every monster related information on backend? For example, "A monster cannot go out of world bounds in Phaser." if I configure it. But, a monster must be syncronized between all clients so it's data must be kept in backend. In this case, do I need to develop "A monster cannot go out of world bounds" feature on backend? How is it being done generally? First client hosts the monsters/AI and others just see what first client sees? Thanks alot.
  12. A multiplayer space combat game written in 48 hours with phaser, nodejs, and socket.io Transform your ship into three different configurations for speed, combat, or mining. Direct link Entry page with source
  13. Hi guys, So I'm trying to expand the game I'm making to be a multiplayer game using Node.js and Socket.io. The connection between server-side and client-side is working, however I don't know how to update the positions of the players. This is how it goes, whenever a player moves the socket.sessionid and coordinates are send to the server. The server then broadcasts this data to all the other clients except the client which sent the data. In the client-side that information gets decoded and stored in 2 variables (at this moment), a player variable (with the id), and a X variable (with the x value, duh). At this moment I really don't know how to update the positions of a certain sprite in the game. Are there any examples on how to create a basic multiplayer Phaser game using websockets? I'm kinda stuck. The code I'm using on the client side is as follows, it is very dirty atm since I'm experimenting.. The 'xChanged' function sends the new position to the server, and 'posChanged' reads the data that gets sent from the server. var game = new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.AUTO, '', { preload: preload, create: create, update: update});function preload() { game.load.spritesheet('player', 'img/ally_sprite.png', 64, 64); game.load.image('boss', 'img/boss.png'); game.load.image('bullet', 'img/bullet.png');}var player, boss, cursors, x, y, z, xTouch, yTouch, fireButton, bullets, bulletTime = 50, text, bulletsCount = 30;var players = {};var io = io.connect('http://192.168.0.13:3000');// server ipvar xPos, yPos, label, sock;function create() { game.renderer.clearBeforeRender = false; game.renderer.roundPixels = true; game.physics.startSystem(Phaser.Physics.ARCADE); player = game.add.sprite(game.world.centerX, game.world.centerY, 'player'); player.anchor.setTo(.5,.5); player.animations.add('fly'); player.animations.play('fly', 10, true); game.physics.enable(player, Phaser.Physics.ARCADE); player.enableBody = true; player.body.collideWorldBounds = true; // new player var pos = JSON.stringify({ player: io.socket.sessionid, x: game.world.centerX, y: game.world.centerY, angle: 0 }); socket.emit('newPos', pos); boss = game.add.sprite(game.centerX, game.centerY, 'boss'); boss.enableBody = true; boss.physicsBodyType = Phaser.Physics.ARCADE; bullets = game.add.group(); bullets.enableBody = true; bullets.physicsBodyType = Phaser.Physics.ARCADE; bullets.createMultiple(30, 'bullet'); bullets.setAll('anchor.x', 0.5); bullets.setAll('anchor.y', 1); bullets.setAll('outOfBoundsKill', true); game.stage.backgroundColor = '#ccc'; game.input.addPointer(); fireButton = game.input.pointer1; if(isMobile.any) { if(gyro.hasFeature('devicemotion')) { console.log('gyrojs loaded'); if(gyro.getFeatures().length > 0) { gyro.frequency = 10; gyro.startTracking(function(o) { var anglePlayer = Math.atan2(o.y, o.x); angleRadians = anglePlayer * Math.PI/180; anglePlayer *= 180/Math.PI; anglePlayer = 180 - anglePlayer; player.angle = game.math.wrapAngle(anglePlayer, false); if(fireButton.isDown) { fire(); } if(o.z < 9.5 || o.z > 10) { player.body.velocity.x -= o.x * 20; player.body.velocity.y += o.y * 20; } else { player.angle = 0; } console.log(player.body.velocity.x); // Send new position to server var newPos = JSON.stringify({ player: io.socket.sessionid, x: player.body.velocity.x, y: player.body.velocity.y, angle: player.angle }); socket.emit('newPos', newPos); }); } } else { // fallback als gyro.js niet werkt.. console.log('gyrojs not loaded'); window.addEventListener('devicemotion', function(event) { x = event.accelerationIncludingGravity.x; y = event.accelerationIncludingGravity.y; z = event.accelerationIncludingGravity.z; var anglePlayer = Math.atan2(y, x); anglePlayer *= 180/Math.PI; anglePlayer = 180 - anglePlayer; player.angle = game.math.wrapAngle(anglePlayer, false); if(fireButton.isDown) { fire(); } if(z < 9.5 || z > 10) { player.body.velocity.x -= x * 40; player.body.velocity.y += y * 40; } else { player.angle = 0; } // Send new position to server var newPos = JSON.stringify({ player: io.socket.sessionid, x: player.body.velocity.x, y: player.body.velocity.y, angle: player.angle }); socket.emit('newPos', newPos); var interval = 10; }); } } else { // Niet mobiel, bewegingen omzetten in keys console.log('Niet Mobiel'); cursors = game.input.keyboard.createCursorKeys(); } text = game.add.text(game.world.centerX, 50, "Bullets: 30", { font: "65px Arial", fill: "#000000", align: "center" }); text.anchor.setTo(0.5, 0.5); // Add new players to the screen socket.on('newPlayerwithPos', function(data) { var obj = JSON.parse(data); var xNew = obj.x; var yNew = obj.y; console.log(xNew, yNew); var p = game.add.sprite(xNew, yNew, 'player'); p.anchor.setTo(.5,.5); p.animations.add('fly'); p.animations.play('fly', 10, true); game.physics.enable(p, Phaser.Physics.ARCADE); p.enableBody = true; p.body.collideWorldBounds = true; });}function update() { player.body.velocity.setTo(0,0); if(!isMobile.any) { if(cursors.left.isDown) { player.body.velocity.x -= 40; } else if(cursors.right.isDown) { player.body.velocity.x += 40; var newPos = JSON.stringify({ x: player.x, player: io.socket.sessionid }); } if(game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR).isDown) { fire(); } } // Get new positions from all other players socket.on('updatePos', function(data) { for(var playerData in data) { // update array of players var player = {}; player.name = data[playerData].sessionID; player.x = data[playerData].x; player.y = data[playerData].y; player.angle = data[playerData].angle; players[player.name] = player; } }); // loop through all players and draw sprites for(var playerData in players) { var p = ''; var playerX = players[playerData].x; var playerY = players[playerData].y; var playerAngle = players[playerData].angle; var p = game.add.sprite(playerX, playerY, 'player'); game.physics.enable(p, Phaser.Physics.ARCADE); p.enableBody = true; p.body.velocity.x -= playerX; p.body.velocity..y += playerY; p.angle = playerAngle; }}function fire() { if(game.time.now > bulletTime) { bullet = bullets.getFirstExists(false); if(bullet) { bullet.reset(player.body.x + 32, player.body.y + 32); bullet.rotation = player.rotation; game.physics.arcade.velocityFromRotation(player.rotation, 400, bullet.body.velocity); bulletTime = game.time.now + 50; // Update bullet counter bulletsCount --; text.setText("Bullets: " + bulletsCount); } }}
  14. Hello Guys, I am developing a html5 based mobile game, multiplayer. It will be a simple card game with lobby etc. I was wondering if Phaser is the right choice to develop the game or something else will be better for this purpose. As for multiplayer part i need to know which is a good service I can use out there. I need a service. I have heard that firebase is good, but i am not sure if it will be the best choice for this kind of game. Any suggestions for both front end and the server part are welcome. Thanks
  15. Hey all, have another game for you to check out It's just a quick little timing game to see what kind of simple yet fun real time interactions can be achieved using pixi, spine, node, cocoon, and socket.io. Hit start then press Go to make your shinobi run and Hit to make him slash. You have to slash your opponent. If you slash and miss, you lose. Good luck, it's actually decently hard. If you queue up within two seconds of someone else, you fight each other live! It's pretty fun if you play with people in your immediate vicinity. Google Play https://play.google.com/store/apps/details?id=com.chimera.chimerashinobishowdown Facebook https://apps.facebook.com/nobulljustshinobi/ The art is simple and there's almost 0 polish added. The point was to pump out a game as fast as possible that utilized these technologies. We will probably update the art and possibly add a persistent score and leaderboard. It's not super innovative or pretty, but that's the point. It is decently cute and fun *Screen shots are from phone*
  16. Hello! I've been using phaser and socket.io to create a multiplayer game for about 5 days now. However, a weird error is happening: 'players' is a key for a image that I'm using to show other players (it's not the same of your player). Because I'm a newbie with phaser, maybe I'm missing something very basic, but until now I don't have idea of what it is. Here is the start of my code: var game = new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.AUTO, 'kabar', {preload: preload, create: create, update: update});function preload(){ var loadingLabel = game.add.text(window.innerWidth / 2 - 85, window.innerHeight / 2 - 10, 'Loading...', {font: '30px Courier', fill: '#fff'}); game.load.image('player', 'assets/player/player.png'); game.load.image('players', 'assets/player/players.png'); game.load.image('bullet', 'assets/bullet1.png'); game.load.image('space', 'assets/space.gif'); game.load.start(); // I tried without this line too, didn't work }And here are both sockets where I load these images and the error happens: var socket = io(); socket.on('newPlayer', function (data){ var uID = data.uID; players[uID] = new EnemyPlayer(data.oPlayers[uID].id, data.oPlayers[uID].x, data.oPlayers[uID].y, data.oPlayers[uID].angle); players[uID].id = data.oPlayers[uID].id; players[uID] = game.add.sprite(0, 0, 'players'); players[uID].anchor.setTo(0.5, 0.5); game.physics.enable(players[uID], Phaser.Physics.ARCADE); players[uID].body.drag.set(0.2); players[uID].body.maxVelocity.setTo(400, 400); players[uID].body.collideWorldBounds = true; }); socket.on('update', function (data){ playerQuantity = data.playerQuantity if (userID == playerQuantity && userID > 1){ players = data.oPlayers; for (var i = 1; i < playerQuantity; i++){ if (i != userID){ players[i] = new EnemyPlayer(players[i].id, players[i].x, players[i].y, players[i].angle); players[i].id = players[i].id; players[i] = game.add.sprite(players[i].x, players[i].y, 'players'); players[i].anchor.setTo(0.5, 0.5); game.physics.enable(players[i], Phaser.Physics.ARCADE); players[i].body.drag.set(0.2); players[i].body.maxVelocity.setTo(400, 400); players[i].body.collideWorldBounds = true; players[i].position.x = players[i].x; players[i].position.y = players[i].y; players[i].angle = players[i].angle; } } } });(The socket 'New Player' is called for an existing player when a new player joins, while the socket 'Update' is called for the new player to draw all the other players) Could it be an error involving socket.io? Or is it something that I'm missing?
  17. It is regularly ask so I suggest that I use as server NodeJS + socket.IO. this therefore create a master server and workers according to the number of heart of the machine. This solution allows to distribute the load. Here is the Serveur.js var cluster = require('cluster'), _portSocket = 8080, _portRedis = 6379, _HostRedis = 'localhost'; if (cluster.isMaster) { var server = require('http').createServer(), socketIO = require('socket.io').listen(server), redis = require('socket.io-redis'); socketIO.adapter(redis({ host: _HostRedis, port: _portRedis })); var numberOfCPUs = require('os').cpus().length; for (var i = 0; i < numberOfCPUs; i++) { cluster.fork(); } cluster.on('fork', function(worker) { console.log('Travailleur %s créer', worker.id); }); cluster.on('online', function(worker) { console.log('Travailleur %s en ligne', worker.id); }); cluster.on('listening', function(worker, addr) { console.log('Travailleur %s écoute sur %s:%d', worker.id, addr.address, addr.port); }); cluster.on('disconnect', function(worker) { console.log('Travailleur %s déconnecter', worker.id); }); cluster.on('exit', function(worker, code, signal) { console.log('Travailleur %s mort (%s)', worker.id, signal || code); if (!worker.suicide) { console.log('Nouveau travailleur %s créer', worker.id); cluster.fork(); } }); } if (cluster.isWorker) { var http = require('http'); http.globalAgent.maxSockets = Infinity; var app = require('express')(), ent = require('ent'), fs = require('fs'), server = http.createServer(app).listen(_portSocket), socketIO = require('socket.io').listen(server), redis = require('socket.io-redis'); socketIO.adapter(redis({ host: _HostRedis, port: _portRedis })); app.get('/', function (req, res) { res.emitfile(__dirname + '/interface.php');}); socketIO.sockets.on('connection', function(socket, pseudo) { socket.setNoDelay(true); socket.on('nouveau_client', function(pseudo) { pseudo = ent.encode(pseudo); socket.pseudo = pseudo; try { socket.broadcast.to(socket.room).emit('nouveau_client', pseudo); } catch(e) { socket.to(socket.room).emit('nouveau_client', pseudo); } console.log('L\'utilisateur : '+socket.pseudo+' s\'est connecter'); }); socket.on('message', function(data) { socket.broadcast.to(socket.room).emit('dispatch', data); }); socket.on('exit', function(data) { socket.close();}); socket.on('room', function(newroom) { socket.room = newroom; socket.join(newroom); console.log('Le membre '+socket.pseudo+' a rejoint le domaine '+socket.room); socket.broadcast.to(socket.room).emit('dispatch', 'L\'utilisateur : '+socket.pseudo+' a rejoint le domaine : '+socket.room); }); }); } And to install Node: and install Redis server: and modules: The server runs. ------------------------ Client: <head> <script type="text/javascript" src="http://localhost:8080/socket.io/socket.io.js"></script> </head> <body> <script> var socket = null; try { socket = io.connect(); console.log("socket: Ok!"); } catch(err) { console.error("Socket is out of service!"); } if(socket != null) { socket.emit('new_client', 'admin'); // use variable php (COOKIES, SESSION...) socket.on('message', function(data) { $('#zone_chat').prepend('' + data.pseudo + ': ' + data.message + '<br />'); }); socket.on('new_client', function(pseudo) { $('#zone_chat').prepend('<em>' + pseudo + ' a rejoint le chat !</em><br />'); }); socket.on('moveObjet', function(data) { mesh = scene.getMeshByName(data.name); mesh.position = new BABYLON.Vector3(data.position); mesh.rotation = new BABYLON.Vector3(data.rotation); }); } </script> </body> The client runs.
  18. Hi guys, I think we should create a plugin for real-time games with Phaser Framework, using Socket.io with Node.js or SignalR with ASP.NET. What do you think everyone? It would be great all work together and do it... sorry for my bad english hahaha Regards, Nicholls
  19. Hi everybody, I'm a web developer and I created a framework that enables users to play html5 games using their mobile devices as a controller. You can check out a demo at http://dillo.cc. It's really easy to use, so check it out It's an open-source project so feel free to contribute! You can find the source code on github https://github.com/wietsedevries/armadillo. If you have any comments or tips, feel free to contact me!
  20. Hello folks, im developing a multiplayer beat'em up for mobile devices. the server is a nodejs server and the connection via socket.io. playing the game is fine with any desktop computer: ping* to local server is 1ms and ping to internet server is 15 ms which is quite good. but playing with either the bluestacks emulator or with a real mobile device ping to local server is still good (10ms) but ping to a internet server differs from 20ms to 70ms (using wifi/same connection as above). ive also noticed that the package received by the server has almost no delay, but the package then received by the client from the server is far higher than it should be. question now is: what could be the problem? socket.iophonegapnode.jsmobile devicesthanks for your help and time *simple roundtriptime from client to server via socket.io
  21. Hey Guys, I have a problem with a function call with Phaser. I am a Javascript Noob and don´t know what I do wrong. Here is the critical Part of my Code, the whole Code is in one Scene. BasicGame.Multiplayer.prototype = {create: function(){ this.socket = io.connect('localhost:3010'); this.socket.on('startGame', function () { console.log('ShouldStartGame'); this.createActualGame(); });...},createActualGame: function(){// Define constants...}}My problem is that the function this.createActualGame is not called with the error: "TypeError: this.createActualGame is not a function". But the console log works fine. Thanks for your help! With kind regards, SirSandmann
  22. Hello! I've got a dilemma, what should I use. I am creating an application with user logging, email notifications, admin section, game etc., so there will be a lot of different views. Game will be without animations, just simple browser clickable strategy with pop-up dialogs, world map, user inputs, placing building (something like travian, goodgame empire, ...). Because of an app complexity, I have found mean.js stack usefull, but then I found out that AngularJS doesn't work well with canvas I know, that I will use node.js, mongoDB and socket.io, but what else?
  23. So I have my server running and I can't figure out how to send to the specific socket.ID. The code in dispatchGameMessage may look funny bcuz I been trying various things to send to the 2 people in the Game. Google isn't helping much with this. And now some code snipplets: // varsvar express = require('express');var app = express();var server = require('http').createServer(app);var io = require('socket.io')(server);var port = 3000; server.listen(port, function () { console.log('Server listening at port %d', port);}); // Routingapp.use(express.static(__dirname)); // usernames which are currently connected to the chatvar i = 0;var channels = {};var channelRefs = {};var numUsers = 0;var clientHoles = new Array();var found = false; io.on('connection', function (socket) { // when the client emits "C" - Create Channel/Join, this listens and executes socket.on('C', function (data) { console.log("Data Connect" + socket.id, port); found = false;//increase # of clients connected++numUsers; // we store the numUsers as socket session usernamesocket.username = data; addedUser = true; //first user connectedif(numUsers == 1){channels[data] = socket.id;socket.emit('W', "W");}else{//go through every connection availablefor(i = 1; i < numUsers; i++){console.log(channels[data], port);//if channel has a player in itif(channels.hasOwnProperty(data) && channels[data] != -1){socket.emit('W', socket.id);channelRefs[data] = {id1: channels[data], id2: socket.id};channels[data] = -1; //game in progress/finished//this may also be the problemdispatchGameMessage(data, "S", socket);found = true;break;}} //if channel not found, create itif(found == false){socket.emit('W', socket.id);channels[data] = socket.id;}}}); });}); //the problem is in here =]// Sends game command to channel (Game In Progress)function dispatchGameMessage (chan_name, data, sock) {//channelRefs[chan_name].id1 and channelRefs[chan_name].id2 are different if(data == "C"){console.log("ID 1 = " + channelRefs[chan_name].id1);console.log("ID 2 = " + channelRefs[chan_name].id2);}//bleeeeeeeeeeeeif(data.length == 1){//sock.broadcast(data, data);sock.socket(channelRefs[chan_name].id2).emit(data, channelRefs[chan_name].id2); sock.socket(socket(channelRefs[chan_name].id1)).emit(data, channelRefs[chan_name].id1); }} No matter what I do, it sends the message be the client(socketID) that sent the message.
  24. Hi there, A while ago I created a realtime(ish) multiplayer game for a university assignment using Phaser, Node and Web-sockets. I haven't been able to put it anywhere before it was marked, but now that it has been people can take a look This was the first proper game I have made and for some crazy reason I decided to attempt a multiplayer game. I didn't really have a clue how to implement multiplayer so there is probably (definitely) a lot of insane stuff going on in my networking code but it seems to work not too badly. Eventually I will upgrade the networking code to follow more along the lines of this valve article https://developer.valvesoftware.com/wiki/Source_Multiplayer_Networking I have previously detailed how my networking works in this post: http://www.html5gamedevs.com/topic/5798-updating-players-positions-using-nodejs-and-socketio-multiplayer/#entry34974 Anyway, the game is essentially a racing game with flappy bird mechanics. Get the the hive first while avoiding the obstacles. The backend is powered by node.js which handles starting the games etc. I also randomly generate a level each game so that the obstacles are in different positions/ move at different speeds/ etc etc each round. There are a few elements of the game that are in there just to fulfil the spec set by my uni, like the little video at the end of the course, and I may remove these if I get time. The game is a little buggy in places I know, but worked well enough to get me very good marks hehe Currently it is running on a single digital ocean server, and to be honest I have no clue how many clients it can handle before things start to go boom, so it might be interesting to find out! I have tested it with around 5 with no problems. How laggy the other players appear seems to depend a lot on your distances from the server which is located in Amsterdam. Here in Brighton UK the lag doesn't seem too bad. I created all the graphics myself, but they were greatly inspired by Chasing Aura. I am pleased with how the game looks, and think that it could benefit from a few more obstacle types along the course. One pretty big issue with this game is that the server is not authoritative, meaning that it relies on the clients to inform it about their positions accurately and truthfully. This in theory means anyone with a little bit of js know how can cheat by modifying the code client side. I'm not really sure of a good way to get around this with this sort of game so if anyone has ideas let me know! Anyway, you can take a look at the game here: http://188.226.161.72 I would love to know what you think, if you have any suggestions on how it could be improved etc. Likewise if you have any questions about how the game works please ask and I will do my best to explain! Bye for now Zef
  25. Hi all, I`m new to game development and I want present you my first project. Conquest Online is a very early version which I started to make about half year ago. It`s a turn based strategy browser game with gameplay similar to Heroes of Might and Magic or King`s Bounty series. The game already has all core features like: - building cities - recruiting army - gathering resources - battles At the beginning i planned to make small experimental version to get familiar with some game dev technologies. However, since then game became relatively big and playable, so I have to decide whether to develop it further. There are lot need to be done before the complete version could be released. Most important features which i plan to implement are: - multiplayer with PvP battles - quests - ranged units and mounted units - generals - items - new buildings in city Game is avaiable here. At this stage of development i`ll be very grateful for Your opinion.