Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Place for questions and answers for all newcomers and new coders. This is a free for all forum, no question is too stupid and to noob.
Post Reply
Thaywood
Posts: 17
Joined: Fri May 01, 2015 8:36 pm

Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by Thaywood »

Dear all

I am currently building a browser based game and using html5 canvas, JavaScript, node.js and socket.io. I am currently building the multiplayer part and I have got a way of doing it but don't know the code. Please can someone write an, JavaScript file for client and a server file with socket.io, that follows this format.

When someone changes player location, client messages server to broadcast new location to all the other clients in same room

When someone joins room adds them to player list.

When someone changes their data number it broadcasts that to others in room to change the player list.

When some else leaves the room it tells client to remove them from player list

When you leave room it wipes the player list on client.

When the server is messaged with new players loc or stats it saves it in its own array or backs it up into a database

If you have any questions please let me know.



Here is an example of the array that stores player list of other players in room.

Players {
Name : "Username",
Locationx: 12, // limit of 40
Locationy: 6, // limit of 20
Stat1: 2,
Stat2: 7,
Stat3: 3,
Stat4: 9
}

Thanks for your time,
Thomas
Thaywood
Posts: 17
Joined: Fri May 01, 2015 8:36 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by Thaywood »

Can some one reply???

All i need is to get the server to post to clients in the room a list of clients and their data when ever someone joins room or changes their data

Can someone reply, if i need to re-think this as this is a matter of urgency????

Thomas
User avatar
Jackolantern
Posts: 10893
Joined: Wed Jul 01, 2009 11:00 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by Jackolantern »

This is asking a lot, as what you are asking it not trivial. A better way to get help would probably be to post what you already have done and we can help with any problem pieces.
The indelible lord of tl;dr
User avatar
hallsofvallhalla
Site Admin
Posts: 12031
Joined: Wed Apr 22, 2009 11:29 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by hallsofvallhalla »

you have several options, either build the NodeJs client the same as your "class" above or pass that data to functions to your client to control. You can add any properties to your Nodejs client like a class. So add Name as a property to the client Id instance then you can find it via that property and make changes as needed. Simply pass the info back to the browser client to make the changes. Node has a Room feature that handles all that as well.
Thaywood
Posts: 17
Joined: Fri May 01, 2015 8:36 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by Thaywood »

I have now dropped socket.io and using php to gather the player data, Currently it dumps the data into the html page like this:

Code: Select all

<script>  var player =  "john" </script>
how could i do this so it sets this directly within the java script file
User avatar
a_bertrand
Posts: 1537
Joined: Mon Feb 25, 2013 1:46 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by a_bertrand »

yes you could load direcly JSON from within JS... check out what jquery can do for example.
Creator of Dot World Maker
Mad programmer and annoying composer
User avatar
Jackolantern
Posts: 10893
Joined: Wed Jul 01, 2009 11:00 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by Jackolantern »

Remember that on the server-side (the side where your PHP lives and runs), Javascript is nothing but text. So you can actually use PHP to write Javascript. You can do something like this:

Code: Select all

<script>
    var playerName = <?php echo $player; ?>;
</script>
The indelible lord of tl;dr
Thaywood
Posts: 17
Joined: Fri May 01, 2015 8:36 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by Thaywood »

Is it possible if I could add this directly into my js file instead of having it in my html code??? Also what would I do when I want to update this, would I need to use a function as I need it to update other players data every second. I thought to use socket.io as you won't be using that much connections. I just wanted it to update when ever someone in the room moves, then broadcast to the room as it's more efficient

Thomas
User avatar
Jackolantern
Posts: 10893
Joined: Wed Jul 01, 2009 11:00 pm

Re: Brosser game JAVASCRIPT,HTML CANVAS, NODE.JS,SOCKET.IO

Post by Jackolantern »

Yes, you will need to do it dynamically through Socket.io if you need the server to notify players who have already downloaded the page.
The indelible lord of tl;dr
Post Reply

Return to “Beginner Help and Support”