ignacioxd / ragin-mages Goto Github PK
View Code? Open in Web Editor NEWJavaScript MOBA game built with Phaser 3
Home Page: https://raginmages.net
JavaScript MOBA game built with Phaser 3
Home Page: https://raginmages.net
Keys that are bound to controls (WASD, arrows) are not being recognized when entering a player name in multiplayer mode (DOMModal).
I need a list to help keep track of what I need to fix.
mage
knight
priest
fire monster
ice monster
spider monster
golem monster
goblin monster (don't know what type he'll be... maybe an archer?)
soldier (don't know what type he'll be... I can turn him into a thief)
Comment here if there's something I missed!
Opening this issue in the interest of small tasks. Need a leader board on the server to track current players kill counts and relative position on the leader board. initial requirements are:
After the leader board is working we can add the messages and save the data on the client side when the message is received.
Issue #76 will store and display the highest standing when the player dies.
We currently don't have an licensing on this project. Do we want to assign a licensing such as MIT license to the game?
We need to add two buttons to the main screen: one to start the game in single player mode, and the second to start it in multiplayer mode. These buttons will open the character selection screen (see #35), but they need to pass in the game mode that the user requested as data.
Not much more to say!
We currently have the leaderboard functionality working in the background. The game receives leaderboard updates when there are any. We need a way to display the leaderboard during gameplay.
There are a couple of ways to go about this that come to mind: 1) a DOM-based HUD (similar to the DOMModal), and 2) an overlay Phaser scene (similar to the other modals and mobile joystick).
Any ideas?
Track the following stats and then display on the screen for respawning when they die:
The stats will reset when the character respawns.
Player health bars should use the offsets listed in characters.json. The offsets should be adjusted for the sprites to display correctly.
Do we want the health bars just below the name as currently done or below character?
It would be great if we could register/unregister the service worker on the title screen. Maybe we can have a checkbox on the bottom-right corner to toggle this.
I will be working on this with a new member to our group, kySuga. We will also be working on adding a health status bar to the game screen.
Right now, when a projectile is fired, it is only destroyed if it hits another player. We need to be able to limit the range of these projectiles. This should be a per-character setting, to allow different character classes to have different ranges.
We need a way to load assets from a master JSON file, instead of manually modifying the Loader scene for every new asset. The format of this JSON file should also make it possible for a service worker to identify the assets that need to be cached.
Currently, the game is having the "continue walking" problem. The issue is there could be a delay between client/server. To improve this, we're planning on client firing off location if the vector > 0 every 0.25s. If the vector changes to 0, broadcast position only once.
Title says it all. Any thoughts?
noticed during development. After user is killed if they select "exit game" then chooses a new character and re-enters multi-player battle the old character is still on the field. They aren't removed from "existing players" list, and gets added as a new player.
Steps to recreate:
A basic map is currently loaded in the game. We need to create a more interesting first map that can be used to test the game mechanics. The use of Tiled is recommended to generate the JSON file required to load the map. The current map can be used as a starting template.
This is related to #8. We need to incorporate Phaser's grid alignment system so that each character is always aligned to a cell.
Once a target cell is identified (see #8), we need a pathfinding algorithm that calculates the best path in this grid with only vertical and horizontal movement. This algorithm should be able to calculate how many cells are needed to reach a destination along the chosen path.
When the option for the service worker to reload is set active, the website fails to load.
The error in the console is:
The FetchEvent for "https://raginmages.net/" resulted in a network error response: an object that was not a Response was passed to respondWith().
When I hit down and spacebar (fire) together, the game hung up.
This is dependent on #37
We need a way to display in-game dialogs. We can start with something simple like pressing a key to show the instructions and clicking on a button on the dialog to close it.
I saw mention that the player kill count is not being tallied/reported. I have investigated this issue and I've found 2 issues that are causing this:
socket.emit('setId', this.id);
(currently sending socket.id)clientId
on the GameScene server
is undefined.There are several possible solutions to item 2. Among them are (these are untested, just throwing possibilities out there - some may not actually work):
server
class to return clientId
if assigned (that also won't fail if off-line/not connected. Pass this ID to subsequent Scenes that will assign clientID to their server.There are probably other solutions, but these are the one I can think of right now.
What are people's thoughts? One we have consensus I can go in and fix or someone else can.
Before joining the game, either in single or multiplayer mode, the player should choose a character to play. We need to create a scene right after the title screen and before the game for this. Once a selection is made, this scene should pass the character as data to the game scene.
This will be very similar to what is currently being done for the Phaser engine in Gulp.
If that is the behavior we end up wanting, we could just make points outside of the player character's x and y location and draw a vector from each to see which is closest to the mouse, and animate the character from there, returning to its previous animation direction after firing.
Any thoughts?
There are several ways we could approach this, this article explains some options we could use: http://www.netexl.com/blog/making-of-a-responsive-game-in-phaser-part-1/
This is definitely the easiest where we shrink the view to the size of the screen, preserving the aspect ratio but not the apparent size of our assets.
Stretch our view across the entire display and make it look distorted.
This is the best, but also most complex option would calculate how much screen real estate is available and render our assets at a size that would appear nearly identical on all screens. That while visually would look best might limit the visibility of players on mobile devices compared to their desktop rivals.
I'd like to implement 3, but I'm worried it might be more complex than I'm thinking, but also that it limits players with less real estate in terms if being able to see what is going on around them. So while I like 3 perhaps 1 is the best for now? Or maybe some sort of combo of the two?
I think there's going to be a bunch of people joining in quickly without realizing the set name option. There's going to be a bunch of 'no names' in the game. How about we have 'player' with a random number or in sequential order as default. So for example, it'll be 'player3' 'player4' and so on...
While testing it appears that shot accuracy was simply reported as 0. Since it now takes more than 1 shot to kill someone I think we should add a number of hits given and
accuracy = hits given/shots
Need to determine if user is online or offline, which will decide whether multiplayer option is available to user or not.
I was working with tween
s today as an alternative to the timer approach. Here is a sample of a tween projectile that fades with time. Using tweens we can add different effects, such as a fireball that gets bigger as it goes. or a scatter gun.
ProjectileExample.zip
The code is simple:
let tween= scene.add.tween({
targets: this,
alpha: 0,
ease: 'Linear',
delay: 400,
duration: 750,
onComplete: this._rangeReached,
onCompleteParams: [ this ]
});
and
_rangeReached(tween, targets, projectile) {
console.log('Kill message received');
// this.timedEvent.remove(false);
projectile.destroy();
}
You can see an example on my fork the game-dev-projectile-upgrade branch.
https://github.com/AtlantaDancer/gosch-game/blob/game-dev-projectile-upgrade/game/src/js/objects/Projectile.js
Right now we have no limit on the length of player names. We should add something long enough to be useful, but not unlimited.
I am running the DEV build on my local system. I select multi-player. When the character selection screen comes up I get the following error:
This happens multiple times eventually it will load without errors. I'm guessing it's a delay in actually loading characters.json into the cache or retrieving it from the cache so that we call the character creation before the data is available.
We need to define the messages the game will send via websockets, including the payloads sent by each one, if applicable. The basic features that must be supported for the first milestone are:
Later versions of the game will support other features, such as collecting power-ups or healing.
We have an asset manifest file (assets.json
) that contains all of the assets the game requires, and also includes supporting files to be cached (e.g., index.html
, CSS, etc.) The service worker should use this file to determine what to cache, as opposed to having hard-coded file paths.
It might be useful in some cases to use the util/ServiceWorker.js
file to post a message to sw.js
passing in the manifest object that the game already loads. The service worker could also load the manifest directly as a first step.
It would be awesome to use the Wiki to document the game, both the design/architecture/implementation, and the game idea and mechanics. We can also create a user's manual.
Allow variation in key stats between character classes for balanced play. Here are some initial thoughts of properties that we can vary. Looking for input of the list we want to implement.
Player health and damage reduction initially have the same affect. Although if damage reduction is due to an item that can be damaged it would later be removed if the item goes away and then the character wouldn't receive the benefit anymore.
This is my initial brain dump of options. Some are easier to implement than others. Looking for input on which we want to implement first, later, never.
When the game is loaded on a small display like a phone the character selection screen should scale so the options are all displayed.
The title screen should also scale a bit to display the options appropriately.
This is a suggestion. Health could regenerate slowly to keep players in the arena longer?
I'm going to assume it's a lot like the title page?
I'll work on this tomorrow (Tuesday).
Comment here if there's something I should know. Or on slack...
For ease of development/testing and then deployment the use of config files would be convenient. This allows us to have a DEV config file pointing to localhost and a production config that can point to the deployment IP address.
I currently have a version on my computer that uses config files to generate the static files for DEV or PRODUCTION. I can do a pull request hopefully tomorrow with that code. I will look to adapt that code to use https://github.com/henrikjoreteg/getconfig or something like it to dynamically read the a config JSON file with the socket IO port.
In one of my first matches I was able to move my sprite out of the grid and into the surrounding black area. Eventually the AI could also follow me outside.
To Reproduce
Move sprite to the upper right hand corner of the arena. Try attacking a few times and then move sprite up and down. Return to the upper right hand corner and you should be able to move off grid
Need to create an AI for the single player campaign / offline version of the game.
We currently have a separate class/file for each possible character. We could consolidate. Have a single character class that has a constructor that individualizes the character. The config information can be stored in a config json file - probably assets.json. When we want to create the character we can either pass in configuration or key identifier and then set properties. Current character properties are:
With the list of characters in a json file we can pass the character list into buildAnimations
instead of having the defined list in the routine.
If a new json file is used BootScene
has an example of loading the json into the cache and is where the new json can be loaded. LoaderScene
has an example of pulling information from the cached json file and then using the information.
Adding a new character won't require code - simply adding assets and adding character information to the json file.
The game will be grid-based, where each character will occupy one cell on the grid. As a first step to enable this functionality, we need the ability to highlight the cell that is under the mouse pointer, and identify when this cell is clicked. Highlighting the cell can be done by dynamically drawing a box around the cell, or by overlaying an asset (e.g., a hollow frame).
Right now, the map tiles are 32x32 pixels, but this can be changed if needed. It would be ideal to make the grid align with these map tiles.
Anyone else getting this? All of my animations stop and the character no longer moves, and no shooting. Game-dev branch
I will be working on this with a new member to our group, kySuga. We will also be working on adding HP functionality to the game.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.