Phaser III (v3.24+)

Table of Content:

Open the bareBonesIndex.html and game.js in your favorite text editor.
Use your browser's "developers Tools -> Console" to watch and monitor the live code. Search inside the file for "Example n.n" where "n" is the number of the example. Other examples are externally loaded files.

Phaser III (1st to 6th editions):

• https://makingbrowsergames.com/p3gp-book/_p3-demos/

Searching for Game Mechanics and Mechanisms.

• https://makingbrowsergames.com/p3gp-book/_p3-demos/game.js
• https://makingbrowsergames.com/p3gp-book/_p3-demos/game-noNameSpace.js
• https://makingbrowsergames.com/p3gp-book/_p3-demos/Ch5-game.js

Content Management System (CMS)
embedded in a HTML5 <canvas> tag.

• https://makingbrowsergames.com/p3design/project-starterKit-demo/

Phaser III Examples.

Example: 1.1 Creating Name-space for games
Sample: Bare Bones Index.html
Sample: Bare Bones with no name-space
Sample: Mobile Index.html

Example: 2.1 Prototyping Graphics (Lines 876 to 889)
Example 2.2: Starting the Game.js (Preload Game Phase)

Example: 3.1 Creating Game Phases (traditional method)
Example: 3.1a Creating Game Phase Continued - Game.js (traditional method)
Example: 3.2 Additional Phaser Properties JS (Lines 218 to 270)
Example 3.3: Additional Phaser Properties

Phaser III Game Prototyping Demonstrations

Building 100s of games using HTML5 and Phaser v3.24+ JavaScript Framework (new revised and expanded 6th Edition) Open the the index.html in your favorite text editor. Use your browser's "developers Tools -> Console" to watch and monitor the live code. Reference the book explanations and find the embedded sourced code in the html as script tags.

• Table of Contents
• Example: 4.1: Prototyping a Visual Avatars
• Example: 4.2: Loading a Game
• Example: 4.3: Creating Game Mechanics
• Example: 4.4: Creating and Moving Avatars
• Example: 4.5: Arrow Keys Movement Integration
• Example: 4.6: World Boundaries Integration
• Example: 4.7: Interior Walls Integration
• Example: 4.8: Doors as Buttons
• Example: 4.9: Collision Detection Integration
• Example: 4.10: Collision Results Determination
• Example: 4.11: New Game Over State
• Example: 4.11a: Collecting User Input
• Example: 4.11b: Responding to User Input
• Example: 4.12: Elementary HUD Creation

Game Mechanics and Mechanisms identified

Instructions: Search inside this file for "GM" where game mechanics and mechanisms are identified according to Schell's definitions.

Example: 6: Identifying Schell's Game Mechanics

WebSockets, Dynamic Menus, Combat, and FSM

Open the the index.html in your favorite text editor. Use your browser's "developers Tools -> Console" to watch and monitor the live code. Reference the book explanations and find the embedded sourced code in the html as script tags.

• Example: 7.1: Launching Web Sockets ( see Appendix for details)
• Example: 7.2: Dynamic Combat Menus
• Example: 7.3: Dynamic Combat Menus supporting function
• Sample: Projectile Templates (Phaser v3.5+)
• Example: 7.4: Combat Grid (checker-board using Phaser III grid feature)
• Example: 7.5: Grid-less Combat Encounter Demo
• Example: 7.6: Hexagonal Combat Grid (Lines 216 to 233; using Phaser III Shapes feature as hexagonal vertical-align)
• Sample: 7.7: Simple AI reactions (see AI chapter)
• Sample: Combat Finite State Machine (see AI chapter)
• Example: SCAVT game: lines 292-318
• Example: Dynamic Story Narrative (from "Dating Veronica Darlene")
• Example: Combat Story Narrative

Sample: 8.1: Prototyping a HUD (in book)
Sample: 8.2: Heads Up Display Plugin (in book)
Example: 8.3: HUD Menu Grouping (in book)

Sample: 9.1: Combat Pseudo Code (in book)
Sample: 9.2: Combat Pseudo Code (in book)
Example: 9.3: Enemy mirrored movement
Sample: 9.4: Combat Pseudo Code (in book)
Sample: 9.5: New Combat States Module Added (in book)