Skip to content

Commit 653b97b

Browse files
committed
feat: revamp phaser
1 parent 5f289e9 commit 653b97b

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+2979
-345
lines changed
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2024 Phaser Studio Inc
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.
Lines changed: 151 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,151 @@
1+
# Phaser Vite TypeScript Template
2+
3+
This is a Phaser 3 project template that uses Vite for bundling. It supports hot-reloading for quick development workflow, includes TypeScript support and scripts to generate production-ready builds.
4+
5+
**[This Template is also available as a JavaScript version.](https://github.com/phaserjs/template-vite)**
6+
7+
### Versions
8+
9+
This template has been updated for:
10+
11+
- [Phaser 3.87.0](https://github.com/phaserjs/phaser)
12+
- [Vite 5.3.1](https://github.com/vitejs/vite)
13+
- [TypeScript 5.4.5](https://github.com/microsoft/TypeScript)
14+
15+
![screenshot](screenshot.png)
16+
17+
## Requirements
18+
19+
[Node.js](https://nodejs.org) is required to install dependencies and run scripts via `npm`.
20+
21+
## Available Commands
22+
23+
| Command | Description |
24+
| --------------------- | -------------------------------------------------------------------------------------------------------- |
25+
| `npm install` | Install project dependencies |
26+
| `npm run dev` | Launch a development web server |
27+
| `npm run build` | Create a production build in the `dist` folder |
28+
| `npm run dev-nolog` | Launch a development web server without sending anonymous data (see "About log.js" below) |
29+
| `npm run build-nolog` | Create a production build in the `dist` folder without sending anonymous data (see "About log.js" below) |
30+
31+
## Writing Code
32+
33+
After cloning the repo, run `npm install` from your project directory. Then, you can start the local development server by running `npm run dev`.
34+
35+
The local development server runs on `http://localhost:8080` by default. Please see the Vite documentation if you wish to change this, or add SSL support.
36+
37+
Once the server is running you can edit any of the files in the `src` folder. Vite will automatically recompile your code and then reload the browser.
38+
39+
## Template Project Structure
40+
41+
We have provided a default project structure to get you started. This is as follows:
42+
43+
- `index.html` - A basic HTML page to contain the game.
44+
- `src` - Contains the game source code.
45+
- `src/main.ts` - The main **entry** point. This contains the game configuration and starts the game.
46+
- `src/vite-env.d.ts` - Global TypeScript declarations, provide types information.
47+
- `src/scenes/` - The Phaser Scenes are in this folder.
48+
- `public/style.css` - Some simple CSS rules to help with page layout.
49+
- `public/assets` - Contains the static assets used by the game.
50+
51+
## Handling Assets
52+
53+
Vite supports loading assets via JavaScript module `import` statements.
54+
55+
This template provides support for both embedding assets and also loading them from a static folder. To embed an asset, you can import it at the top of the JavaScript file you are using it in:
56+
57+
```js
58+
import logoImg from "./assets/logo.png";
59+
```
60+
61+
To load static files such as audio files, videos, etc place them into the `public/assets` folder. Then you can use this path in the Loader calls within Phaser:
62+
63+
```js
64+
preload();
65+
{
66+
// This is an example of an imported bundled image.
67+
// Remember to import it at the top of this file
68+
this.load.image("logo", logoImg);
69+
70+
// This is an example of loading a static image
71+
// from the public/assets folder:
72+
this.load.image("background", "assets/bg.png");
73+
}
74+
```
75+
76+
When you issue the `npm run build` command, all static assets are automatically copied to the `dist/assets` folder.
77+
78+
## Deploying to Production
79+
80+
After you run the `npm run build` command, your code will be built into a single bundle and saved to the `dist` folder, along with any other assets your project imported, or stored in the public assets folder.
81+
82+
In order to deploy your game, you will need to upload _all_ of the contents of the `dist` folder to a public facing web server.
83+
84+
## Customizing the Template
85+
86+
### Vite
87+
88+
If you want to customize your build, such as adding plugin (i.e. for loading CSS or fonts), you can modify the `vite/config.*.mjs` file for cross-project changes, or you can modify and/or create new configuration files and target them in specific npm tasks inside of `package.json`. Please see the [Vite documentation](https://vitejs.dev/) for more information.
89+
90+
## About log.js
91+
92+
If you inspect our node scripts you will see there is a file called `log.js`. This file makes a single silent API call to a domain called `gryzor.co`. This domain is owned by Phaser Studio Inc. The domain name is a homage to one of our favorite retro games.
93+
94+
We send the following 3 pieces of data to this API: The name of the template being used (vue, react, etc). If the build was 'dev' or 'prod' and finally the version of Phaser being used.
95+
96+
At no point is any personal data collected or sent. We don't know about your project files, device, browser or anything else. Feel free to inspect the `log.js` file to confirm this.
97+
98+
Why do we do this? Because being open source means we have no visible metrics about which of our templates are being used. We work hard to maintain a large and diverse set of templates for Phaser developers and this is our small anonymous way to determine if that work is actually paying off, or not. In short, it helps us ensure we're building the tools for you.
99+
100+
However, if you don't want to send any data, you can use these commands instead:
101+
102+
Dev:
103+
104+
```bash
105+
npm run dev-nolog
106+
```
107+
108+
Build:
109+
110+
```bash
111+
npm run build-nolog
112+
```
113+
114+
Or, to disable the log entirely, simply delete the file `log.js` and remove the call to it in the `scripts` section of `package.json`:
115+
116+
Before:
117+
118+
```json
119+
"scripts": {
120+
"dev": "node log.js dev & dev-template-script",
121+
"build": "node log.js build & build-template-script"
122+
},
123+
```
124+
125+
After:
126+
127+
```json
128+
"scripts": {
129+
"dev": "dev-template-script",
130+
"build": "build-template-script"
131+
},
132+
```
133+
134+
Either of these will stop `log.js` from running. If you do decide to do this, please could you at least join our Discord and tell us which template you're using! Or send us a quick email. Either will be super-helpful, thank you.
135+
136+
## Join the Phaser Community!
137+
138+
We love to see what developers like you create with Phaser! It really motivates us to keep improving. So please join our community and show-off your work 😄
139+
140+
**Visit:** The [Phaser website](https://phaser.io) and follow on [Phaser Twitter](https://twitter.com/phaser_)<br />
141+
**Play:** Some of the amazing games [#madewithphaser](https://twitter.com/search?q=%23madewithphaser&src=typed_query&f=live)<br />
142+
**Learn:** [API Docs](https://newdocs.phaser.io), [Support Forum](https://phaser.discourse.group/) and [StackOverflow](https://stackoverflow.com/questions/tagged/phaser-framework)<br />
143+
**Discord:** Join us on [Discord](https://discord.gg/phaser)<br />
144+
**Code:** 2000+ [Examples](https://labs.phaser.io)<br />
145+
**Read:** The [Phaser World](https://phaser.io/community/newsletter) Newsletter<br />
146+
147+
Created by [Phaser Studio](mailto:[email protected]). Powered by coffee, anime, pixels and love.
148+
149+
The Phaser logo and characters are &copy; 2011 - 2024 Phaser Studio Inc.
150+
151+
All rights reserved.
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { createDojoConfig } from "@dojoengine/core";
2+
3+
import manifest from "../../worlds/dojo-starter/manifest_dev.json";
4+
5+
export const dojoConfig = createDojoConfig({
6+
manifest,
7+
});
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/png" href="/favicon.png" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<link rel="stylesheet" href="/style.css" />
8+
<title>Phaser - Template</title>
9+
</head>
10+
11+
<body>
12+
<div id="app">
13+
<div id="game-container"></div>
14+
</div>
15+
<script type="module" src="/src/main.ts"></script>
16+
</body>
17+
</html>
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
const fs = require("fs");
2+
const https = require("https");
3+
4+
const main = async () => {
5+
const args = process.argv.slice(2);
6+
const packageData = JSON.parse(fs.readFileSync("./package.json", "utf8"));
7+
const event = args[0] || "unknown";
8+
const phaserVersion = packageData.dependencies.phaser;
9+
10+
const options = {
11+
hostname: "gryzor.co",
12+
port: 443,
13+
path: `/v/${event}/${phaserVersion}/${packageData.name}`,
14+
method: "GET",
15+
};
16+
17+
try {
18+
const req = https.request(options, (res) => {
19+
res.on("data", () => {});
20+
res.on("end", () => {
21+
process.exit(0);
22+
});
23+
});
24+
25+
req.on("error", (error) => {
26+
process.exit(1);
27+
});
28+
29+
req.end();
30+
} catch (error) {
31+
// Silence is the canvas where the soul paints its most profound thoughts.
32+
process.exit(1);
33+
}
34+
};
35+
36+
main();

0 commit comments

Comments
 (0)