├── .github
└── workflows
│ └── release.yaml
├── .gitignore
├── .parcelrc
├── README.md
├── assets
├── ball1.png
├── ball2.png
├── blue1.png
├── blue2.png
├── breakout.json
├── breakout.png
├── breakout.tps
├── button.png
├── buttonOver.png
├── green1.png
├── green2.png
├── license.txt
├── paddle1.png
├── paddle2.png
├── particle1.png
├── particle2.png
├── particle3.png
├── purple1.png
├── purple2.png
├── red1.png
├── red2.png
├── silver1.png
├── silver2.png
├── yellow1.png
└── yellow2.png
├── index.html
├── js
├── breakout.js
└── phaser.min.js
├── package-lock.json
└── package.json
/.github/workflows/release.yaml:
--------------------------------------------------------------------------------
1 | name: Release
2 | on:
3 | # manual trigger
4 | workflow_dispatch:
5 |
6 | jobs:
7 | bump_version:
8 | name: Bump Version
9 | runs-on: ubuntu-latest
10 | outputs:
11 | new_tag: ${{ steps.github_tag_action.outputs.new_tag }}
12 | changelog: ${{ steps.github_tag_action.outputs.changelog }}
13 | steps:
14 | - name: Checkout
15 | uses: actions/checkout@v1
16 |
17 | - name: Bump version and push tag
18 | id: github_tag_action
19 | uses: mathieudutour/github-tag-action@v4.5
20 | with:
21 | github_token: ${{ secrets.GITHUB_TOKEN }}
22 | release_branches: .*
23 |
24 | create_release:
25 | name: Create Release
26 | runs-on: ubuntu-latest
27 | needs: bump_version
28 | if: ${{ needs.bump_version.outputs.new_tag != null }}
29 | steps:
30 | - name: Checkout
31 | uses: actions/checkout@v1
32 |
33 | - uses: actions/setup-node@v1
34 | with:
35 | node-version: '12'
36 | always-auth: true
37 | registry-url: https://registry.npmjs.org
38 |
39 | - name: Install dependencies
40 | run: npm install
41 |
42 | - name: Build the IPFS bundle
43 | run: yarn build
44 |
45 | - name: Pin to IPFS
46 | id: upload
47 | uses: anantaramdas/ipfs-pinata-deploy-action@39bbda1ce1fe24c69c6f57861b8038278d53688d
48 | with:
49 | pin-name: game ${{ needs.bump_version.outputs.new_tag }}
50 | path: './dist'
51 | pinata-api-key: ${{ secrets.PINATA_API_KEY }}
52 | pinata-secret-api-key: ${{ secrets.PINATA_API_SECRET_KEY }}
53 |
54 | - name: Convert CIDv0 to CIDv1
55 | id: convert_cidv0
56 | uses: uniswap/convert-cidv0-cidv1@v1.0.0
57 | with:
58 | cidv0: ${{ steps.upload.outputs.hash }}
59 |
60 | - name: Create GitHub Release
61 | id: create_release
62 | uses: actions/create-release@v1.1.0
63 | env:
64 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
65 | with:
66 | tag_name: ${{ needs.bump_version.outputs.new_tag }}
67 | release_name: Release ${{ needs.bump_version.outputs.new_tag }}
68 | body: |
69 | IPFS hash of the deployment:
70 | - CIDv0: `${{ steps.upload.outputs.hash }}`
71 | - CIDv1: `${{ steps.convert_cidv0.outputs.cidv1 }}`
72 |
73 | You can access the game directly from an IPFS gateway.
74 |
75 | Preferred URLs:
76 | - https://${{ steps.convert_cidv0.outputs.cidv1 }}.ipfs.dweb.link/
77 | - https://${{ steps.convert_cidv0.outputs.cidv1 }}.ipfs.cf-ipfs.com/
78 | - [ipfs://${{ steps.upload.outputs.hash }}/](ipfs://${{ steps.upload.outputs.hash }}/)
79 |
80 | Other IPFS gateways:
81 | - https://cloudflare-ipfs.com/ipfs/${{ steps.upload.outputs.hash }}/
82 | - https://ipfs.infura.io/ipfs/${{ steps.upload.outputs.hash }}/
83 | - https://ipfs.io/ipfs/${{ steps.upload.outputs.hash }}/
84 |
85 | ${{ needs.bump_version.outputs.changelog }}
86 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # System and IDE files
2 | Thumbs.db
3 | .DS_Store
4 | .idea
5 | *.suo
6 | *.sublime-project
7 | *.sublime-workspace
8 |
9 | # Build Files
10 | dist
11 | .parcel-cache
12 |
13 | # Vendors
14 | node_modules/
--------------------------------------------------------------------------------
/.parcelrc:
--------------------------------------------------------------------------------
1 | {
2 | "extends": ["@parcel/config-default"],
3 | "reporters": ["...", "parcel-reporter-static-files-copy"]
4 | }
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # decentralized-game-template
2 |
3 | Fork this repo or click the `Use this template` button above to start using the template.
4 |
5 |
6 |
7 | Installation
8 | ====
9 |
10 |
11 |
12 | * Make sure you have Node.js ≥ 12 installed (https://nodejs.org)
13 | * Install dependencies: `npm install`
14 |
15 | Running The Example Game
16 | ==============
17 |
18 | The repo includes the example Breakout game from Phaser 3.0.
19 |
20 | * `npm start`: Run the game locally
21 |
22 | Deployment
23 | ================
24 |
25 | ### Deploying on Github Pages
26 |
27 | The game can be easily deployed via the Github Pages Settings Page, using the root folder.
28 |
29 | ### Deploying on IPFS
30 |
31 | To deploy on IPFS we need to do the following steps:
32 |
33 | * Retrieve API keys from [Pinata](https://pinata.cloud/)
34 |
35 | * PINATA_API_KEY
36 | * PINATA_API_SECRET_KEY
37 |
38 | * Input these keys as Repository Secrets
39 |
40 | * Go to the Release Workflow on Github Actions and click `Run Workflow`
41 |
42 | * The game is now deployed and can be accessed using the IPFS gateways listed on the Release Notes
43 |
44 |
45 | Contributing
46 | =====================
47 |
48 | We hope to improve the template with your help! The Github Discussions is a great way to get started.
49 |
50 |
--------------------------------------------------------------------------------
/assets/ball1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/ball1.png
--------------------------------------------------------------------------------
/assets/ball2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/ball2.png
--------------------------------------------------------------------------------
/assets/blue1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/blue1.png
--------------------------------------------------------------------------------
/assets/blue2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/blue2.png
--------------------------------------------------------------------------------
/assets/breakout.json:
--------------------------------------------------------------------------------
1 | {"frames": {
2 |
3 | "ball1":
4 | {
5 | "frame": {"x":452,"y":2,"w":22,"h":22},
6 | "rotated": false,
7 | "trimmed": false,
8 | "spriteSourceSize": {"x":0,"y":0,"w":22,"h":22},
9 | "sourceSize": {"w":22,"h":22}
10 | },
11 | "ball2":
12 | {
13 | "frame": {"x":476,"y":2,"w":22,"h":22},
14 | "rotated": false,
15 | "trimmed": false,
16 | "spriteSourceSize": {"x":0,"y":0,"w":22,"h":22},
17 | "sourceSize": {"w":22,"h":22}
18 | },
19 | "blue1":
20 | {
21 | "frame": {"x":386,"y":2,"w":64,"h":32},
22 | "rotated": false,
23 | "trimmed": false,
24 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
25 | "sourceSize": {"w":64,"h":32}
26 | },
27 | "blue2":
28 | {
29 | "frame": {"x":108,"y":53,"w":64,"h":32},
30 | "rotated": false,
31 | "trimmed": false,
32 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
33 | "sourceSize": {"w":64,"h":32}
34 | },
35 | "button":
36 | {
37 | "frame": {"x":2,"y":2,"w":190,"h":49},
38 | "rotated": false,
39 | "trimmed": false,
40 | "spriteSourceSize": {"x":0,"y":0,"w":190,"h":49},
41 | "sourceSize": {"w":190,"h":49}
42 | },
43 | "buttonOver":
44 | {
45 | "frame": {"x":194,"y":2,"w":190,"h":49},
46 | "rotated": false,
47 | "trimmed": false,
48 | "spriteSourceSize": {"x":0,"y":0,"w":190,"h":49},
49 | "sourceSize": {"w":190,"h":49}
50 | },
51 | "green1":
52 | {
53 | "frame": {"x":2,"y":79,"w":64,"h":32},
54 | "rotated": false,
55 | "trimmed": false,
56 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
57 | "sourceSize": {"w":64,"h":32}
58 | },
59 | "green2":
60 | {
61 | "frame": {"x":174,"y":53,"w":64,"h":32},
62 | "rotated": false,
63 | "trimmed": false,
64 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
65 | "sourceSize": {"w":64,"h":32}
66 | },
67 | "paddle1":
68 | {
69 | "frame": {"x":386,"y":36,"w":104,"h":24},
70 | "rotated": false,
71 | "trimmed": false,
72 | "spriteSourceSize": {"x":0,"y":0,"w":104,"h":24},
73 | "sourceSize": {"w":104,"h":24}
74 | },
75 | "paddle2":
76 | {
77 | "frame": {"x":2,"y":53,"w":104,"h":24},
78 | "rotated": false,
79 | "trimmed": false,
80 | "spriteSourceSize": {"x":0,"y":0,"w":104,"h":24},
81 | "sourceSize": {"w":104,"h":24}
82 | },
83 | "particle1":
84 | {
85 | "frame": {"x":492,"y":26,"w":10,"h":10},
86 | "rotated": false,
87 | "trimmed": false,
88 | "spriteSourceSize": {"x":0,"y":0,"w":10,"h":10},
89 | "sourceSize": {"w":10,"h":10}
90 | },
91 | "particle2":
92 | {
93 | "frame": {"x":492,"y":38,"w":10,"h":10},
94 | "rotated": false,
95 | "trimmed": false,
96 | "spriteSourceSize": {"x":0,"y":0,"w":10,"h":10},
97 | "sourceSize": {"w":10,"h":10}
98 | },
99 | "particle3":
100 | {
101 | "frame": {"x":68,"y":79,"w":20,"h":19},
102 | "rotated": false,
103 | "trimmed": true,
104 | "spriteSourceSize": {"x":0,"y":1,"w":20,"h":19},
105 | "sourceSize": {"w":20,"h":21}
106 | },
107 | "purple1":
108 | {
109 | "frame": {"x":240,"y":53,"w":64,"h":32},
110 | "rotated": false,
111 | "trimmed": false,
112 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
113 | "sourceSize": {"w":64,"h":32}
114 | },
115 | "purple2":
116 | {
117 | "frame": {"x":306,"y":53,"w":64,"h":32},
118 | "rotated": false,
119 | "trimmed": false,
120 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
121 | "sourceSize": {"w":64,"h":32}
122 | },
123 | "red1":
124 | {
125 | "frame": {"x":372,"y":62,"w":64,"h":32},
126 | "rotated": false,
127 | "trimmed": false,
128 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
129 | "sourceSize": {"w":64,"h":32}
130 | },
131 | "red2":
132 | {
133 | "frame": {"x":438,"y":62,"w":64,"h":32},
134 | "rotated": false,
135 | "trimmed": false,
136 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
137 | "sourceSize": {"w":64,"h":32}
138 | },
139 | "silver1":
140 | {
141 | "frame": {"x":90,"y":87,"w":64,"h":32},
142 | "rotated": false,
143 | "trimmed": false,
144 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
145 | "sourceSize": {"w":64,"h":32}
146 | },
147 | "silver2":
148 | {
149 | "frame": {"x":156,"y":87,"w":64,"h":32},
150 | "rotated": false,
151 | "trimmed": false,
152 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
153 | "sourceSize": {"w":64,"h":32}
154 | },
155 | "yellow1":
156 | {
157 | "frame": {"x":222,"y":87,"w":64,"h":32},
158 | "rotated": false,
159 | "trimmed": false,
160 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
161 | "sourceSize": {"w":64,"h":32}
162 | },
163 | "yellow2":
164 | {
165 | "frame": {"x":288,"y":87,"w":64,"h":32},
166 | "rotated": false,
167 | "trimmed": false,
168 | "spriteSourceSize": {"x":0,"y":0,"w":64,"h":32},
169 | "sourceSize": {"w":64,"h":32}
170 | }},
171 | "meta": {
172 | "app": "http://www.codeandweb.com/texturepacker",
173 | "version": "1.0",
174 | "image": "breakout.png",
175 | "format": "RGBA8888",
176 | "size": {"w":504,"h":121},
177 | "scale": "1",
178 | "smartupdate": "$TexturePacker:SmartUpdate:001f51c9029c40bfd47dffb21081606f:e188858ff10f5876d9b056ceae3435f7:aa94e37632703bccd6a813800bf3159a$"
179 | }
180 | }
181 |
--------------------------------------------------------------------------------
/assets/breakout.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/breakout.png
--------------------------------------------------------------------------------
/assets/breakout.tps:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | fileFormatVersion
5 | 4
6 | texturePackerVersion
7 | 4.5.0
8 | fileName
9 | D:/wamp/www/phaser3-examples/public/assets/games/breakout/breakout.tps
10 | autoSDSettings
11 |
12 |
13 | scale
14 | 1
15 | extension
16 |
17 | spriteFilter
18 |
19 | acceptFractionalValues
20 |
21 | maxTextureSize
22 |
23 | width
24 | -1
25 | height
26 | -1
27 |
28 |
29 |
30 | allowRotation
31 |
32 | shapeDebug
33 |
34 | dpi
35 | 72
36 | dataFormat
37 | phaser-json-hash
38 | textureFileName
39 |
40 | flipPVR
41 |
42 | pvrCompressionQuality
43 | PVR_QUALITY_NORMAL
44 | atfCompressData
45 |
46 | mipMapMinSize
47 | 32768
48 | etc1CompressionQuality
49 | ETC1_QUALITY_LOW_PERCEPTUAL
50 | etc2CompressionQuality
51 | ETC2_QUALITY_LOW_PERCEPTUAL
52 | dxtCompressionMode
53 | DXT_PERCEPTUAL
54 | jxrColorFormat
55 | JXR_YUV444
56 | jxrTrimFlexBits
57 | 0
58 | jxrCompressionLevel
59 | 0
60 | ditherType
61 | NearestNeighbour
62 | backgroundColor
63 | 0
64 | libGdx
65 |
66 | filtering
67 |
68 | x
69 | Linear
70 | y
71 | Linear
72 |
73 |
74 | shapePadding
75 | 2
76 | jpgQuality
77 | 80
78 | pngOptimizationLevel
79 | 0
80 | webpQualityLevel
81 | 101
82 | textureSubPath
83 |
84 | atfFormats
85 |
86 | textureFormat
87 | png
88 | borderPadding
89 | 2
90 | maxTextureSize
91 |
92 | width
93 | 2048
94 | height
95 | 2048
96 |
97 | fixedTextureSize
98 |
99 | width
100 | -1
101 | height
102 | -1
103 |
104 | algorithmSettings
105 |
106 | algorithm
107 | MaxRects
108 | freeSizeMode
109 | Best
110 | sizeConstraints
111 | AnySize
112 | forceSquared
113 |
114 | maxRects
115 |
116 | heuristic
117 | Best
118 |
119 | basic
120 |
121 | sortBy
122 | Best
123 | order
124 | Ascending
125 |
126 | polygon
127 |
128 | alignToGrid
129 | 1
130 |
131 |
132 | andEngine
133 |
134 | minFilter
135 | Linear
136 | packageName
137 | Texture
138 | wrap
139 |
140 | s
141 | Clamp
142 | t
143 | Clamp
144 |
145 | magFilter
146 | MagLinear
147 |
148 | dataFileNames
149 |
156 | multiPack
157 |
158 | forceIdenticalLayout
159 |
160 | outputFormat
161 | RGBA8888
162 | alphaHandling
163 | ClearTransparentPixels
164 | contentProtection
165 |
166 | key
167 |
168 |
169 | autoAliasEnabled
170 |
171 | trimSpriteNames
172 |
173 | prependSmartFolderName
174 |
175 | autodetectAnimations
176 |
177 | globalSpriteSettings
178 |
179 | scale
180 | 1
181 | scaleMode
182 | Smooth
183 | extrude
184 | 0
185 | trimThreshold
186 | 16
187 | trimMargin
188 | 1
189 | trimMode
190 | Trim
191 | tracerTolerance
192 | 200
193 | heuristicMask
194 |
195 | defaultPivotPoint
196 | 0.5,0.5
197 | writePivotPoints
198 |
199 |
200 | individualSpriteSettings
201 |
296 | fileList
297 |
298 | silver2.png
299 | yellow1.png
300 | yellow2.png
301 | ball1.png
302 | ball2.png
303 | blue1.png
304 | blue2.png
305 | button.png
306 | buttonOver.png
307 | green1.png
308 | green2.png
309 | paddle1.png
310 | paddle2.png
311 | particle1.png
312 | particle2.png
313 | particle3.png
314 | purple1.png
315 | purple2.png
316 | red1.png
317 | red2.png
318 | silver1.png
319 |
320 | ignoreFileList
321 |
322 | replaceList
323 |
324 | ignoredWarnings
325 |
326 | commonDivisorX
327 | 1
328 | commonDivisorY
329 | 1
330 | packNormalMaps
331 |
332 | autodetectNormalMaps
333 |
334 | normalMapFilter
335 |
336 | normalMapSuffix
337 |
338 | normalMapSheetFileName
339 |
340 | exporterProperties
341 |
342 |
343 |
344 |
--------------------------------------------------------------------------------
/assets/button.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/button.png
--------------------------------------------------------------------------------
/assets/buttonOver.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/buttonOver.png
--------------------------------------------------------------------------------
/assets/green1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/green1.png
--------------------------------------------------------------------------------
/assets/green2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/green2.png
--------------------------------------------------------------------------------
/assets/license.txt:
--------------------------------------------------------------------------------
1 | The assets in this folder come from http://kenney.nl/assets/puzzle-pack
--------------------------------------------------------------------------------
/assets/paddle1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/paddle1.png
--------------------------------------------------------------------------------
/assets/paddle2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/paddle2.png
--------------------------------------------------------------------------------
/assets/particle1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/particle1.png
--------------------------------------------------------------------------------
/assets/particle2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/particle2.png
--------------------------------------------------------------------------------
/assets/particle3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/particle3.png
--------------------------------------------------------------------------------
/assets/purple1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/purple1.png
--------------------------------------------------------------------------------
/assets/purple2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/purple2.png
--------------------------------------------------------------------------------
/assets/red1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/red1.png
--------------------------------------------------------------------------------
/assets/red2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/red2.png
--------------------------------------------------------------------------------
/assets/silver1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/silver1.png
--------------------------------------------------------------------------------
/assets/silver2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/silver2.png
--------------------------------------------------------------------------------
/assets/yellow1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/yellow1.png
--------------------------------------------------------------------------------
/assets/yellow2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/alto-io/decentralized-game-template/c6755d76fc7a6fc0b0bca3caa888dc902bfa2beb/assets/yellow2.png
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Decentralized Game Example
6 |
7 |
8 |
9 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
--------------------------------------------------------------------------------
/js/breakout.js:
--------------------------------------------------------------------------------
1 | var Breakout = new Phaser.Class({
2 |
3 | Extends: Phaser.Scene,
4 |
5 | initialize:
6 |
7 | function Breakout ()
8 | {
9 | Phaser.Scene.call(this, { key: 'breakout' });
10 |
11 | this.bricks;
12 | this.paddle;
13 | this.ball;
14 | },
15 |
16 | preload: function ()
17 | {
18 | this.load.atlas('assets', 'assets/breakout.png', 'assets/breakout.json');
19 | },
20 |
21 | create: function ()
22 | {
23 | // Enable world bounds, but disable the floor
24 | this.physics.world.setBoundsCollision(true, true, true, false);
25 |
26 | // Create the bricks in a 10x6 grid
27 | this.bricks = this.physics.add.staticGroup({
28 | key: 'assets', frame: [ 'blue1', 'red1', 'green1', 'yellow1', 'silver1', 'purple1' ],
29 | frameQuantity: 10,
30 | gridAlign: { width: 10, height: 6, cellWidth: 64, cellHeight: 32, x: 112, y: 100 }
31 | });
32 |
33 | this.ball = this.physics.add.image(400, 500, 'assets', 'ball1').setCollideWorldBounds(true).setBounce(1);
34 | this.ball.setData('onPaddle', true);
35 |
36 | this.paddle = this.physics.add.image(400, 550, 'assets', 'paddle1').setImmovable();
37 |
38 | // Our colliders
39 | this.physics.add.collider(this.ball, this.bricks, this.hitBrick, null, this);
40 | this.physics.add.collider(this.ball, this.paddle, this.hitPaddle, null, this);
41 |
42 | // Input events
43 | this.input.on('pointermove', function (pointer) {
44 |
45 | // Keep the paddle within the game
46 | this.paddle.x = Phaser.Math.Clamp(pointer.x, 52, 748);
47 |
48 | if (this.ball.getData('onPaddle'))
49 | {
50 | this.ball.x = this.paddle.x;
51 | }
52 |
53 | }, this);
54 |
55 | this.input.on('pointerup', function (pointer) {
56 |
57 | if (this.ball.getData('onPaddle'))
58 | {
59 | this.ball.setVelocity(-75, -300);
60 | this.ball.setData('onPaddle', false);
61 | }
62 |
63 | }, this);
64 | },
65 |
66 | hitBrick: function (ball, brick)
67 | {
68 | brick.disableBody(true, true);
69 |
70 | if (this.bricks.countActive() === 0)
71 | {
72 | this.resetLevel();
73 | }
74 | },
75 |
76 | resetBall: function ()
77 | {
78 | this.ball.setVelocity(0);
79 | this.ball.setPosition(this.paddle.x, 500);
80 | this.ball.setData('onPaddle', true);
81 | },
82 |
83 | resetLevel: function ()
84 | {
85 | this.resetBall();
86 |
87 | this.bricks.children.each(function (brick) {
88 |
89 | brick.enableBody(false, 0, 0, true, true);
90 |
91 | });
92 | },
93 |
94 | hitPaddle: function (ball, paddle)
95 | {
96 | var diff = 0;
97 |
98 | if (ball.x < paddle.x)
99 | {
100 | // Ball is on the left-hand side of the paddle
101 | diff = paddle.x - ball.x;
102 | ball.setVelocityX(-10 * diff);
103 | }
104 | else if (ball.x > paddle.x)
105 | {
106 | // Ball is on the right-hand side of the paddle
107 | diff = ball.x -paddle.x;
108 | ball.setVelocityX(10 * diff);
109 | }
110 | else
111 | {
112 | // Ball is perfectly in the middle
113 | // Add a little random X to stop it bouncing straight up!
114 | ball.setVelocityX(2 + Math.random() * 8);
115 | }
116 | },
117 |
118 | update: function ()
119 | {
120 | if (this.ball.y > 600)
121 | {
122 | this.resetBall();
123 | }
124 | }
125 |
126 | });
127 |
128 | var config = {
129 | type: Phaser.WEBGL,
130 | width: 800,
131 | height: 600,
132 | parent: 'phaser-example',
133 | scene: [ Breakout ],
134 | physics: {
135 | default: 'arcade'
136 | }
137 | };
138 |
139 | var game = new Phaser.Game(config);
140 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "decentralized-game-template",
3 | "version": "0.0.1",
4 | "description": "Decentralized Game Example",
5 | "scripts": {
6 | "serve": "sirv",
7 | "start": "parcel index.html --open",
8 | "build": "npm run clean && parcel build index.html --dist-dir ./dist",
9 | "clean": "rimraf ./dist ./parcel-cache"
10 | },
11 | "repository": {
12 | "type": "git",
13 | "url": "git+https://github.com/alto-io/decentralized-game-example"
14 | },
15 | "author": "outplay.games",
16 | "license": "ISC",
17 | "bugs": {
18 | "url": "https://github.com/alto-io/decentralized-game-example/issues"
19 | },
20 | "homepage": "https://github.com/alto-io/decentralized-game-example#readme",
21 | "devDependencies": {
22 | "@parcel/config-default": "2.0.0-beta.1",
23 | "parcel": "2.0.0-beta.1",
24 | "parcel-reporter-static-files-copy": "^1.2.2",
25 | "sirv-cli": "^1.0.11"
26 | },
27 | "dependencies": {},
28 | "staticFiles": {
29 | "staticPath": "assets",
30 | "staticOutPath": "assets",
31 | "watcherGlob": "**"
32 | }
33 | }
34 |
--------------------------------------------------------------------------------