{"id":14963966,"url":"https://github.com/jerenaux/phaserquest","last_synced_at":"2025-04-05T12:08:51.964Z","repository":{"id":40524017,"uuid":"83148290","full_name":"Jerenaux/phaserquest","owner":"Jerenaux","description":"Reproduction of Mozilla's BrowserQuest using Phaser, socket.io and Node.js","archived":false,"fork":false,"pushed_at":"2022-07-23T15:49:07.000Z","size":3236,"stargazers_count":379,"open_issues_count":8,"forks_count":122,"subscribers_count":24,"default_branch":"master","last_synced_at":"2025-04-05T12:08:45.114Z","etag":null,"topics":["browserquest","game","html5","nodejs","online-game","phaser","socket-io"],"latest_commit_sha":null,"homepage":"http://www.dynetisgames.com/2017/03/18/phaser-quest/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Jerenaux.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-02-25T17:16:16.000Z","updated_at":"2025-03-21T08:36:27.000Z","dependencies_parsed_at":"2022-06-29T20:53:25.486Z","dependency_job_id":null,"html_url":"https://github.com/Jerenaux/phaserquest","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jerenaux%2Fphaserquest","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jerenaux%2Fphaserquest/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jerenaux%2Fphaserquest/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jerenaux%2Fphaserquest/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Jerenaux","download_url":"https://codeload.github.com/Jerenaux/phaserquest/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247332612,"owners_count":20921853,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["browserquest","game","html5","nodejs","online-game","phaser","socket-io"],"created_at":"2024-09-24T13:32:24.222Z","updated_at":"2025-04-05T12:08:51.941Z","avatar_url":"https://github.com/Jerenaux.png","language":"JavaScript","funding_links":["https://www.patreon.com/jeromerenaux"],"categories":[],"sub_categories":[],"readme":"# phaserquest\n\nPhaser Quest is a reproduction of Mozilla's [Browserquest](http://browserquest.mozilla.org/) using the following tools:\n- The [Phaser](https://phaser.io/) framework for the client \n- [Socket.io](http://socket.io/) and [Node.js](https://nodejs.org/en/) for the server and client-server communication\n\n:fire: If you are interested in this project, you may also be interested in [Westward](https://github.com/Jerenaux/westward), an open source Javascript MMORPG that I am working on! :rocket:\n\n## Quick tour of the code\n\n### Client\n\nThe game canvas and the game states are created in `js/client/main.js`. The `Home` state is started first, and will display the home page\nof the game. The `Game` state is started upon calling `startGame()` from the `Home` state. \n\n`js/client/game.js` contains the  `Game` object, which corresponds to the `Game` state and contains the bulk of the client code. \n`Game.init()` is automatically called first by Phaser, to initialize a few variables. `Game.preload()` is then called, to load the\nassets that haven't been loaded in the `Home` state. When all assets are loaded, Phaser calls `Game.create()` where the basics of the game\nare set up. At the end of `Game.create()`, a call is made to `Client.requestData()` (from `js/client/client.js`) to request initialization\ndata from the server. Upon reception of this data, `Game.initWorld()` is called, which finishes starting the game. The main update loop of the client is `Game.update()`. \n\n### Server and updates\n\n`server.js` is the Node.js server that supports the game. Most of the server-side game logic however is located in `js/server/GameServer.js`. Every 200ms, `GameServer.updatePlayers()` is called, and sends updates to all clients (if there are updates to send, as determined by the custom interest management system). Client-side, these updates are processed by `Game.updateWorld()` and `Game.updateSelf()`. \n\nThe code used for the custom binary protocol for the exchange of update packets can be found in `js/client/Decoder.js`, `js/server/Encoder.js` and `js/CODec.js`.\n\n## Installing and running the game\n\nFor the client, everything is included in the code (`phaser.js`, `easystar.min.js`, ...). You will need [npm](https://www.npmjs.com/) to install the Node.js packages required for the server. To run the server, you'll need to have Node.js installed, as well as [MongoDB](https://www.mongodb.com/).\n\nClone the repository. Inside the newly created directory, run `npm install` to install the Node.js packages listed in `package.json`. Make sure that you have MongoDB running, then run `node server.js` to start the game server. \nBy default, it'll listen to connections on port `8081`; you can change that behaviour by using the `-p` flag (e.g. `node server.js -p 80`). \nBy default, it'll attempt to connect to MongoDB on port `27017`; you can change that behaviour by using the `--mongoPort` flag (e.g. `node server.js --mongoPort 25000`).\n\n[Here](GETTING_STARTED.md) you will find a step-by-step guide how to run and manage the application locally.\n\n### Using Docker\n\nAlternatively, you can use the Dockerfile to create a container with all the necessary components already installed (thanks to Martin kramer for the corresponding pull request). You need to have [Docker](https://www.docker.com) installed. Then, in the directory where you clones the project, run:\n\n```\ndocker-compose build\n```\n```\ndocker-compose up -d\n```\n\nThe default port when using the Docker way is `80`, so you need to navigate to `\u003cIP_of_your_Docker_machine\u003e:80` to be able to access the game (e.g. 192.168.99.100:80). \n\n## Modifying the map\n\nIn `assets/maps/`, you can find `phaserquest_map.tmx`, which is the Tiled file of the map of the game, to be edited with the [Tiled Map Editor](http://www.mapeditor.org/). One you have made modifications in the Tiled file, you need to export it as a JSON file. But that file will contain a lot of layers, a legacy from how the original Browserquest map was designed. A lot of layers will translate to a very poor performance with Phaser, which is a shame since most of these layers contain only a few tiles. The solution is to \"flatten\" them to cram as many tiles as possible in the same layers. You can do so by running `formatMap()` from `js/server/format.js`. It will look for a `map.json` file in `assets/maps` and output two new files, the flattened map files for the client and the server.\n\n***Note:*** It is recommended to use _Tiled_ in version ***1.1.6*** or lower, which can be found here:\n\n- [https://github.com/bjorn/tiled/releases/tag/v1.1.6](https://github.com/bjorn/tiled/releases/tag/v1.1.6)\n- [https://sourceforge.net/projects/tiled/files/v1.1.6/](https://sourceforge.net/projects/tiled/files/v1.1.6/)\n\nMap JSON format has changed in _Tiled_ in higher versions. Cause of that provided `tmx` map won't be exported to JSON format supported by `format.js` script.\n\n## Further documentation\n\nI have written and will keep writing articles about some development aspects of the game. The full list of existing articles is available [here](http://www.dynetisgames.com/tag/phaser-quest/).\n\nHere is the detail of the topics covered so far:\n- [Clients synchronization](http://www.dynetisgames.com/2017/03/19/client-updates-phaser-quest/)\n- [Latency estimation](http://www.dynetisgames.com/2017/03/19/latency-estimation-phaser-quest/)\n- [Interest management](http://www.dynetisgames.com/2017/04/05/interest-management-mog/) (the \"AOI\" stuff you might encounter in the code)\n- [Custom Binary Protocol](http://www.dynetisgames.com/2017/06/14/custom-binary-protocol-javascript/)\n\n## Donate\n\nIf you want to support me to make more open-source projects like Phaser Quest, consider having a look at my [donation page](https://www.dynetisgames.com/donate/). In particular, take a minute to have a look at my [Patreon page](https://www.patreon.com/jeromerenaux), where you can find a listing of rewards for various levels of recurring contributions!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjerenaux%2Fphaserquest","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjerenaux%2Fphaserquest","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjerenaux%2Fphaserquest/lists"}