Get ebook downloads in full at ebookname.

com

Phaser Game Prototyping Building 100s of games

using HTML5 Phaser js Gaming Frameworks 6th
Edition

https://ebookname.com/product/phaser-game-prototyping-
building-100s-of-games-using-html5-phaser-js-gaming-
frameworks-6th-edition/

OR CLICK BUTTON

DOWNLOAD EBOOK

Explore and download more ebook at https://ebookname.com

Instant digital products (PDF, ePub, MOBI) available
Download now and explore formats that suit you...

HTML5 Game Programming with enchant js 1st Edition

Brandon Mcinnis

https://ebookname.com/product/html5-game-programming-with-
enchant-js-1st-edition-brandon-mcinnis-2/

HTML5 game programming with enchant js 1st Edition

Brandon Mcinnis

https://ebookname.com/product/html5-game-programming-with-
enchant-js-1st-edition-brandon-mcinnis/

The Essential Guide to HTML5 Using Games to learn HTML5

and JavaScript 1st Edition Jeanine Meyer

https://ebookname.com/product/the-essential-guide-to-html5-using-
games-to-learn-html5-and-javascript-1st-edition-jeanine-meyer/

Elementary geometry for college students 5th ed Edition

Alexander

https://ebookname.com/product/elementary-geometry-for-college-
students-5th-ed-edition-alexander/
Uncovering The Grumman F 14 Tomcat 1st Edition Danny
Coremans

https://ebookname.com/product/uncovering-the-
grumman-f-14-tomcat-1st-edition-danny-coremans/

Practical Algorithms in Pediatric Gastroenterology 1st

Edition Ron Shaoul

https://ebookname.com/product/practical-algorithms-in-pediatric-
gastroenterology-1st-edition-ron-shaoul/

Galilean mechanics and thermodynamics of continua 1st

Edition Géry De Saxcé

https://ebookname.com/product/galilean-mechanics-and-
thermodynamics-of-continua-1st-edition-gery-de-saxce/

Plant Pathology Concepts and Laboratory Exercises 3rd

Edition Bonnie H. Ownley

https://ebookname.com/product/plant-pathology-concepts-and-
laboratory-exercises-3rd-edition-bonnie-h-ownley/

Design Optimization of Active and Passive Structural

Control Systems 1st Edition Nikos D. Lagaros

https://ebookname.com/product/design-optimization-of-active-and-
passive-structural-control-systems-1st-edition-nikos-d-lagaros/
To the Things Themselves Essays on the Discourse and
Practice of the Phenomenology of Religion Arvind Sharma

https://ebookname.com/product/to-the-things-themselves-essays-on-
the-discourse-and-practice-of-the-phenomenology-of-religion-
arvind-sharma/
Phaser Game Prototyping
Building 100s of games using HTML5 & Phaser.js Gaming
Frameworks (6th Edition includes v2.x.x & v3.24+)

Stephen Gose
This book is for sale at http://leanpub.com/LoRD

This version was published on 2021-05-28

ISBN 978-1-952635-04-5

This is a Leanpub book. Leanpub empowers authors and publishers with the Lean
Publishing process. Lean Publishing is the act of publishing an in-progress ebook
using lightweight tools and many iterations to get reader feedback, pivot until you
have the right book and build traction once you do.

© Copyright, 1972 - 2017, Stephen Gose. All rights reserved.

Tweet This Book!
Please help Stephen Gose by spreading the word about this book on Twitter!
The suggested tweet for this book is:
I’m making HTML games using Phaser Game Prototyping workbook.
The suggested hashtag for this book is #PBMCube.
Find out what other people are saying about the book by clicking on this link to
search for this hashtag on Twitter:
#PBMCube
 For my students

@ Culpeper Public Schools, Culpeper, VA;

@ ITT Technical Institute, Tempe, AZ;

@ Early Career Academy, Tempe, AZ; and

@ University of Advancing Technology (UAT), Tempe, AZ

CONTENTS

Contents

Distribution Permission . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . i
Supporting website . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . i

Forwards . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ii

Disclosures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . iii

Disclaimer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . iv

About this Workbook: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . v

Viewing the Source Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vi
Links and References . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vi
Who should use this workbook? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vii
Your newly obtained skills… . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . viii

Game Design System™ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . x

Game Studio - Book Series . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . x
Game Studio - Online Courses . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xi
“Making Browser Games” - Books Series . . . . . . . . . . . . . . . . . . . . . . . . . xii
“Making Browser Games” Series - online Courses . . . . . . . . . . . . . . . . . . . xiii
Programming Courses . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xiii
“Walk-Thru Tutorial” Series - Online Courses . . . . . . . . . . . . . . . . . . . . . . xiii

Part I: Product Management . . . . . . . . . . . . . . . . . . 1

1. Game Studio & Project Preparations . . . . . . . . . . . . . . . . . . . . . . . . . . 1
1.1 Workstation Setup . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
Batteries not included … Web Server Required . . . . . . . . . . . . . . . . 3
Deeper Dive: Testing “MMoGs” Locally??! . . . . . . . . . . . . . . . . . . . . 4
Development Tools . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.2 Project Setup . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
Deeper Dive: Project Data Structure . . . . . . . . . . . . . . . . . . . . . . . 7
Deeper Dive: And its name shall be called … . . . . . . . . . . . . . . . . . . 8
Project Directories & Files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.3 Game Project “Concept & Design” . . . . . . . . . . . . . . . . . . . . . . . . . 14

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

Introduction to Game Design System™ . . . . . . . . . . . . . . . . . . . . . 14

What makes a Good Game? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
1.4 Preparing a “Gaming Product” . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Why are you doing this? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
What are you making? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
What technology will you use? . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
“Loose lips sink ships” … and revenues! . . . . . . . . . . . . . . . . . . . . . 23
What features are included? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
What features are mandatory? . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
How will you encode it? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
1.5 Game Design Architecture . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
“Oh! Oh!” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
“Top-down” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
“Bottom-up” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
“Oh! Oh!” vs. Top-Down vs. Bottom-Up vs. OLOO . . . . . . . . . . . . . . . 37
1.6 Game Project Summarized: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
Concept Development: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
Design: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
Production Encoding: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
1.7 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
1.8 Chapter References: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41

2. Building a Game Prototype . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42

2.1 Creating Prototype Mechanisms — 4-Step method . . . . . . . . . . . . . 45
Step 0) Preparation and Research . . . . . . . . . . . . . . . . . . . . . . . . . 46
Step 1) Generate Game Phases (as needed). . . . . . . . . . . . . . . . . . . 47
Step 2) Generate code for triggering events. . . . . . . . . . . . . . . . . . . 47
Step 3) Generate transition . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48
Step 4) Create your Game’s Core & auxiliary functions . . . . . . . . . . . 49
2.2 Using “Box” Graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
2.3 Game Practicum: Box Prototyping . . . . . . . . . . . . . . . . . . . . . . . . 54
Phaser III Code Review . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
Phaser v2.x.x Code Review . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59
2.4 3D Prototypes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
2.5 “ToTo, … we’re not in Kansas anymore” — Dorothy . . . . . . . . . . . . . 64
2.6 Starting Your “Game Recipe”™ . . . . . . . . . . . . . . . . . . . . . . . . . . . . 66
Step #0) the Front-Door . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 66
Task #1-1 Instructions: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67
Compare your code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
Mobile “Single Web Page Applications” (SWPA) . . . . . . . . . . . . . . . . . 69
Cocoon.js - Cloud Alternatives . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
Task #2: Launching a Game . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72
Deeper Dive: Launching a Phaser III Game. . . . . . . . . . . . . . . . . . . . 77

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

Game “Config” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
2.7 Deeper Dive: To Infinity and Beyond! . . . . . . . . . . . . . . . . . . . . . . . 80
2.8 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81
2.9 Chapter References: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81

3. Game Phases, Scenes & Roses. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83

3.1 Bare-Bones Prototypes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83
3.2 Using a Phaser Scene as a “Game Phase” . . . . . . . . . . . . . . . . . . . . 85
3.3 9 Essential Functions of a Phaser “Scene” . . . . . . . . . . . . . . . . . . . . 86
3.4 Game Phases as Modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91
“Phaser.Game” — One File to Rule them all … . . . . . . . . . . . . . . . . . 91
Main.js (aka “launch” or index.js) . . . . . . . . . . . . . . . . . . . . . . . . . . 92
Boot.js . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93
Preload.js . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
Deeper Dive: Artwork & Resources Security . . . . . . . . . . . . . . . . . . 94
Deeper Dive: Phaser Cache . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95
Deeper Dive: Loader Examples . . . . . . . . . . . . . . . . . . . . . . . . . . . 97
Splash.js or Language.js? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99
Main Menu.js . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .102
Play.js . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .105
Deeper Dive: JS Modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .105
3.5 Step #1 of 4: Generate Game Phases . . . . . . . . . . . . . . . . . . . . . . . 107
Dynamically Including Game Phases . . . . . . . . . . . . . . . . . . . . . . .108
Deeper Dive: D.R.Y. Stand-alone . . . . . . . . . . . . . . . . . . . . . . . . . .110
Step #3 of 4: Game Phase Transitions . . . . . . . . . . . . . . . . . . . . . . 111
Deeper Dive: The CMS “Game Shell” . . . . . . . . . . . . . . . . . . . . . . .112
Deeper Dive: When to use a game shell . . . . . . . . . . . . . . . . . . . . .113
3.6 Encoding Phaser Scenes as a “Game Phase” . . . . . . . . . . . . . . . . . . . 114
Vanilla, Chocolate, or Strawberry Creme-filled? . . . . . . . . . . . . . . . . 114
Overriding Essential Functions inside Phaser.Scene . . . . . . . . . . . . .116
Creating Scenes using ES5 Prototypes . . . . . . . . . . . . . . . . . . . . . .116
Creating Scenes using Phaser.Class . . . . . . . . . . . . . . . . . . . . . . . .118
Creating Scenes by extending Phaser.Class . . . . . . . . . . . . . . . . . .118
ES6 Considerations: “Strawberry” . . . . . . . . . . . . . . . . . . . . . . . . .119
Creating Scene Configuration files . . . . . . . . . . . . . . . . . . . . . . . .120
Deeper Dive: Defining Other Scene Properties . . . . . . . . . . . . . . . . 121
Deeper Dive: ES9 Modules . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 124
3.7 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .125
3.8 Chapter References: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .126

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

Part II: Mechanisms vs. Mechanics . . . . . . . . . . .127

4. Building Game Prototypes, Mechanisms & Tools . . . . . . . . . . . . . . . . .128

4.1 Task #3: Mini-Me . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .129
Creating an Avatar - “visual display” . . . . . . . . . . . . . . . . . . . . . . . .129
Deeper Dive: Display selected frames from a sprite-sheet. . . . . . . . .132
Deeper Dive: Using Base64 Images . . . . . . . . . . . . . . . . . . . . . . . .133
Creating an Avatar’s metadata . . . . . . . . . . . . . . . . . . . . . . . . . . . 134
Deeper Dive 3.19+ Tweens . . . . . . . . . . . . . . . . . . . . . . . . . . . . .136
4.2 Task #4: Moving Game Elements . . . . . . . . . . . . . . . . . . . . . . . . . 137
Deeper Dive: Phaser III Input Manager . . . . . . . . . . . . . . . . . . . . . .140
Deeper Dive: Future Proofing your source code. . . . . . . . . . . . . . . . 141
Deeper Dive: Configuring the Keyboard (Phaser v3.16+ updated) . . . .143
4.3 Task #5: Things that go bump … . . . . . . . . . . . . . . . . . . . . . . . . . .143
Walls and Camera boundaries . . . . . . . . . . . . . . . . . . . . . . . . . . .143
Interior Decoration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .145
Deeper Dive on Game Objects hit areas. . . . . . . . . . . . . . . . . . . . . 147
Doors, Knobs, and Buttons . . . . . . . . . . . . . . . . . . . . . . . . . . . . .149
Deeper Dive: Writing Optimized Code . . . . . . . . . . . . . . . . . . . . . . 154
Deeper Dive: Buttons as a “Class” or “Scenes”?!!? . . . . . . . . . . . . . . .155
Deeper Dive: Button size considerations . . . . . . . . . . . . . . . . . . . .155
Deeper Dive: Adding Buttons & Mobile Touch . . . . . . . . . . . . . . . . .156
4.4 Task #6: When Worlds Collide … . . . . . . . . . . . . . . . . . . . . . . . . . . 157
4.5 Task #7: It’s curtains for you … . . . . . . . . . . . . . . . . . . . . . . . . . . . 161
4.6 Other Game Mechanics Categories . . . . . . . . . . . . . . . . . . . . . . . .165
4.7 The Finish Line: You’re AWESOME … Gloat, Gloat … . . . . . . . . . . . . .169
4.8 Chapter Source Code & Demo . . . . . . . . . . . . . . . . . . . . . . . . . . .170
4.9 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171
4.10 Chapter References . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .172

5. Dem’s fightin’ words . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .173

5.1 Launching Web Sockets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .173
5.2 Dynamic Combat Menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .175
5.3 So, Give Me Some Space … . . . . . . . . . . . . . . . . . . . . . . . . . . . . .178
Melee Weapons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181
Ranged Weapons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181
5.4 OO!, OW! AH!, OW! Stayin’ alive! Stayin’ alive! . . . . . . . . . . . . . . . . .185
Grid-less Combat . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .185
Grid-ed Combat . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .188
5.5 Tactical Tiled-Maps . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .188
5.6 Squares and Checkered Grids . . . . . . . . . . . . . . . . . . . . . . . . . . .189
Deeper Dive: Phaser III Grids . . . . . . . . . . . . . . . . . . . . . . . . . . . .192
Hexagonal Grids . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 194

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

Deeper Dive: Real hexagonal grids . . . . . . . . . . . . . . . . . . . . . . . .195

Squishes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .196
5.7 Rules of Engagement: Take 5 paces, turn, and … . . . . . . . . . . . . . . .196
Been there … done that … . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .196
5.8 “Where’s the beef?” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 197
Click-fest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .198
Guitar hero - Time to get it Right! . . . . . . . . . . . . . . . . . . . . . . . . .200
Days of our Lives - Drama Theater . . . . . . . . . . . . . . . . . . . . . . . . 201
SCA Virtual “Fighter Practice” by Steve Echos . . . . . . . . . . . . . . . . . .202
En Guard method . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204
Yeap! Ya betcha’ ‘ur life! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .205
5.9 Story narrative . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .206
5.10 Frisking, Fondling, or Groping . . . . . . . . . . . . . . . . . . . . . . . . . . . 207
5.11 Chapter Source Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 207
5.12 Complete Combat Prototypes . . . . . . . . . . . . . . . . . . . . . . . . . . .208
5.13 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .208
5.14 Footnotes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .209

6. Game Mechanism Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 211

6.1 Phaser III inline script - Reviewed . . . . . . . . . . . . . . . . . . . . . . . . . 211
Phaser v2.x.x inline script - Reviewed . . . . . . . . . . . . . . . . . . . . . .212
Adding Display objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .212
Adding Control Mechanisms . . . . . . . . . . . . . . . . . . . . . . . . . . . .218
Adding Buttons & Mobile Touch . . . . . . . . . . . . . . . . . . . . . . . . . .219
Phaser III “Actions” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 221
Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .222
DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224
Game Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224
System Components . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224
6.2 Tile Map . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .225
Tilemap Rendering - new Dynamic method . . . . . . . . . . . . . . . . . .225
Tilemap Rendering - new Static method . . . . . . . . . . . . . . . . . . . . .226
6.3 Phaser III Systems . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 227
v3 Boot . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 227
v3 Cache . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 231
v3 Device Manager . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .232
v3 Events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .232
v3 Input Manager . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234
Deeper Dive: v3.16+ New Keyboard rewrite! . . . . . . . . . . . . . . . . . .235
v3 Loader . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237
v3 Sound . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .239
v3 Scene Manager . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .240
v3 Texture Manager . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .243

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

v3 Tween Manager . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 244

Deeper Dive 3.19+ Tweens . . . . . . . . . . . . . . . . . . . . . . . . . . . . .245
6.4 Phaser3 Finish Line: You’re AWESOME … Gloat!, Gloat! . . . . . . . . . . .245
Phaser v3 Source Code & Demos . . . . . . . . . . . . . . . . . . . . . . . . .245
6.5 v3 Animations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .246
Deeper Dive: History of Animation . . . . . . . . . . . . . . . . . . . . . . . .248
Animation Today . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .249
Animation Recommendations . . . . . . . . . . . . . . . . . . . . . . . . . . .250
Frame Rates Recommendations . . . . . . . . . . . . . . . . . . . . . . . . . . 251
Tweens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .252
6.6 Camera & Viewports . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .253
6.7 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .256
6.8 Chapter Footnotes: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .256

7. Whazzz-sUP! …. HUD Development . . . . . . . . . . . . . . . . . . . . . . . . . . .258

7.1 HUD Housing Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . .259
7.2 HUD as Panels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .263
7.3 HUD Panels outside the Canvas?!? . . . . . . . . . . . . . . . . . . . . . . . . 264
7.4 HUD Demos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .266
7.5 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .268
7.6 Footnotes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .268

8. Don’t make me think or “Artificial Intelligence for Dummies” . . . . . . . .269

8.1 The “6 of 9” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .269
8.2 Chasing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .270
8.3 Evading . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .270
8.4 Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271
8.5 Fuzzy logic . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .273
8.6 Finite State Machines (FSM) . . . . . . . . . . . . . . . . . . . . . . . . . . . . .273
FSM Resolving Combat Outcomes . . . . . . . . . . . . . . . . . . . . . . . . .275
FSM Resolving AI behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 277
8.7 Recursive World Feedback . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .279
Probability Data Tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .280
8.8 Complete AI Prototypes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281
8.9 Chapter Source Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281
8.10 Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281
8.11 Footnotes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .282

Part III: “Walk-thru” Tutorials & Resources .283

9. Game Prototype Libraries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 284

9.1 Walk-through Tutorial Series . . . . . . . . . . . . . . . . . . . . . . . . . . . . 284
Introductory (Difficulty Rating #1) . . . . . . . . . . . . . . . . . . . . . . . . . 284

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

Intermediate (Difficulty Rating #2 to #3) . . . . . . . . . . . . . . . . . . . . .285

Advanced — “The Full Monty!” (Difficulty Rating #4) . . . . . . . . . . . . .285
9.2 References: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 287

10. What’s next? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .288

10.1 Game Distribution & Marketing . . . . . . . . . . . . . . . . . . . . . . . . . .288
Introduction: 8-Step Deployment Method. . . . . . . . . . . . . . . . . . . .288
10.2 Book Review Protocol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .290
10.3 Tell the world about your game! . . . . . . . . . . . . . . . . . . . . . . . . . .292

Appendix . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .293

More Resources . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294

JavaScript Garden . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294
Additional Appendices . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294
Other resources: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .295
Selling your Game Assets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296

Appendix: Online Game Development . . . . . . . . . . . . . . . . . . . . . . . . . . .298

Appendix: Making WebXR Games! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .299

Appendix: Phaser III Plugins . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 301

Appendix: Network Concepts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .302

Security Concerns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .303
Protecting Game Assets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .303
Use of <iframe> . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 304
Bad Bot! . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .305
Other Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 307
Game Services (Back-end) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 307
CMS - Server-side Frameworks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .310
Index Page (Non-Traditional Method) . . . . . . . . . . . . . . . . . . . . . . . . . . . 311
High Scores Services . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .312
Membership Login . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .313
Production release version. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 314
CodeIgniter & Phaser Integrated CMS . . . . . . . . . . . . . . . . . . . . . . . . . .315
CodeIgniter Prep Step-by-Step . . . . . . . . . . . . . . . . . . . . . . . . . . .318
Game Shell (click dummy) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .320
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .323
Chapter Footnotes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .323

Appendix: “How to Start a WebSocket” . . . . . . . . . . . . . . . . . . . . . . . . . . . 324

Testing Your Browser . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .326

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

WebSocket Protocol Handshake . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 327

Deeper Dive: WebSocket API . . . . . . . . . . . . . . . . . . . . . . . . . . . .328
Sample Source Code: Client-side WebSocket . . . . . . . . . . . . . . . . . . . . . . 334
Step #1: Game index page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .336
Step #2: Generate Event handlers . . . . . . . . . . . . . . . . . . . . . . . . . 337

Appendix: Project Mgmt Methods . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .343

Prototyping . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .346
Basic Principles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .346
Strengths: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 347
Weaknesses: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .348
Situations where most appropriate: . . . . . . . . . . . . . . . . . . . . . . . .349
Situations where least appropriate: . . . . . . . . . . . . . . . . . . . . . . . .350
Incremental . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .350
Basic Principles: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .350
Strengths: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 351
Weaknesses: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .352
Situations where most appropriate: . . . . . . . . . . . . . . . . . . . . . . . .352
Situations where least appropriate: . . . . . . . . . . . . . . . . . . . . . . . .352
Spiral . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .353
Basic Principles: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .353
Strengths: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 354
Weaknesses: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 354
Situations where most appropriate: . . . . . . . . . . . . . . . . . . . . . . . .355
Situations where least appropriate: . . . . . . . . . . . . . . . . . . . . . . . .355
Rapid Application Development (RAD) . . . . . . . . . . . . . . . . . . . . . . . . . .355
Basic Principles:** . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .356
Strengths: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 357
Weaknesses: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .358
Situations where most appropriate: . . . . . . . . . . . . . . . . . . . . . . .359
Situations where least appropriate: . . . . . . . . . . . . . . . . . . . . . . . .360
Test-Driven Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 361
Basic Principles: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 361
Expected Benefits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 361
Common Pitfalls . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .362
Typical team pitfalls include: . . . . . . . . . . . . . . . . . . . . . . . . . . . .362
Signs of Use . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .362
Skill Levels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .362
Further Reading on Test Driven Development . . . . . . . . . . . . . . . . .363
Game Project Management Foot Notes: . . . . . . . . . . . . . . . . . . . . . . . . .363

Appendix: Consolidated Phaser Examples . . . . . . . . . . . . . . . . . . . . . . . . 364

Phaser III (1st to 6th editions): . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 364

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

Demonstrations: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 364
Searching for Game Mechanics and Mechanisms. . . . . . . . . . . . . . . 364
Content Management System embedded in HTML5 <canvas> tag. . . . 364
Phaser III Examples . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .365
Phaser III Game Prototyping Demonstrations . . . . . . . . . . . . . . . . .366
Game Mechanics & Mechanisms identified . . . . . . . . . . . . . . . . . . . 367
WebSockets, Dynamic Menus, Combat, and FSM . . . . . . . . . . . . . . . 367

Appendix: Game Automation Tools . . . . . . . . . . . . . . . . . . . . . . . . . . . . .369

Deeper Dive: Database Protection Considerations . . . . . . . . . . . . . . . . . . 371
Database Schema Construction (Copyright-able!!) . . . . . . . . . . . . . . . . . . 371
Database Record Construction . . . . . . . . . . . . . . . . . . . . . . . . . . .373
Database structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 374
Remote Codebase Using AppML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 374
Building an AppML application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .376
Sample AppML codebase (Public Access) . . . . . . . . . . . . . . . . . . . . . . . .376
Remote codebase Using JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 377
Per-user storage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 377
Chapter Source Code & Demo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .379
Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .380
Chapter References . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 381

Appendix: OLOO - Safe JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .382

Deeper Dive: JS Delegation (aka “Inheritance”?) . . . . . . . . . . . . . . . . . . . . 384
The old way . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .385
Objects Linking to Other Objects (OLOO) . . . . . . . . . . . . . . . . . . . . . . . . 391
Compare your code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .392
Object.create . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .392
Exercise Lesson 9: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 394
Game Singletons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .395
Deeper Dive: Object Manipulation objects in ES5/6 . . . . . . . . . . . . . . . . . . 397
Lesson Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .398
Resource References: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .398

Appendix: Common Pitfalls . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .399

Lacking Debugging Tools? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .399
Deeper Dive: Console Commands . . . . . . . . . . . . . . . . . . . . . . . . .400
Same “Name-spaces” . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 407
Callbacks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 407
Missing Documentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .408
Deeper Dive: What is Dragon Speak . . . . . . . . . . . . . . . . . . . . . . .409

Copyright © 1972-2017 Stephen Gose. All rights reserved.

CONTENTS

Answers to Exercises . . . . . . . . . . . . . . . . . . . . . . . . . . . .410

Appendix . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .410
Appendix: OLOO - Safe JavaScript . . . . . . . . . . . . . . . . . . . . . . . . .410

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Distribution Permission i

Distribution Permission
All rights are reserved under the Pan-American and International Copyright Con-
ventions. You may not reproduce this book, in whole or in part, in any form or by
any means electronic or mechanical, including photocopying, recording, or by any
information storage and retrieval system that is now known or hereafter invented,
without written permission from the author. Brief quotations in critical reviews or
articles are permitted without the author’s permission.

Supporting website

https://makingbrowsergames.com/

Thank you for your patronage! I truly appreciate it.

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Forwards ii

Forwards
• by Terry Paton: — “Copying or imitating is an awesome way to learn how to
do something, traditional artists have done it for centuries. This practice was
generally considered a tribute, not forgery 1 , — If you want to get better at
something, then trying to do it like those who already have mastered it.
Look at the choices they have made and consider why they made those decisions,
often important things are hidden in subtlety, and the only way we learn those
subtleties is by creating the same thing. The balance here is stealing versus
inspiration. “Ripping off” ideas from someone else in a way that harms their
hard work compared to producing something which is inspired by their work.
If you plan on publicly releasing something, I recommend you should inject some
of your own vision into any game you make, take a concept but then extend or
change it to create something of your own.”

1 http://en.wikipedia.org/wiki/Art_forgery

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Disclosures iii

Disclosures
• Stephen Gose LLC reserves the right, at any time and without notice, to change
modify or correct the information contained in this publication.
• I refer to “Phaser v3.16+” under a moniker of “Phaser III” to distinguish it as a
clear demarcation from previous versions.

In this book, I am not paid to recommend any of the tools or services presented
but I do use affiliate links. Here’s how it works. When I find a tool, service, author’s
content, idea, or product I admire, I investigate if they have an affiliate program. If it
exists, I get a special link and when you click it or confirm a purchase I receive a small
percentage from that activity. In short, it’s the same methods everyone finds on any
typical website; only now, those links are available inside ebooks as substitute for
“crowd-funding”.

I think everyone, with any business savvy 2 , should do this too; especially when you
recommend your own books, services, and tools. Amazon and others offer affiliate
links. Whenever you recommend anything (hopefully this book? hint, hint!), use
your affiliate links.

By law, I must disclose that I am are using affiliate links. Amazon, in particular, requires
the following.

“We are a participant in the Amazon Services LLC Associates Program, an affiliate
advertising program designed to provide a means for us to earn fees by linking
to Amazon.com and affiliated sites.”

2 https://www.inc.com/neil-patel/11-mental-habits-that-will-improve-your-business-savvy.html

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Disclaimer iv

Disclaimer
• All the information, contained within, is for the convenience of its readers. It
is accurate, as can be reasonably verified, at the time of original publication.
However, this content may not reflect migrating industry recommendations after
the original publication date for ECMA-2623 (also known as (aka) “JavaScript”,
ES5, ES6, ES7, ES8, ES9 or ES10) or for any version of the Phaser.JS Gaming
Frameworks.
• All websites listed herein are accurate at the time of publication but may
change in the future or cease to exist. It is best to research these “dead
websites” links in “The WayBack Machine” 4 . The website references does not
imply my endorsement of a site’s contents.
• There are no guarantees nor warranties stated nor implied by the distribution
of this educational information. Using this information is at the reader’s own
risk, and no liability shall carry to the author. Any damage or loss is the sole
responsibility of the reader.

Warning: The Phaser newsletter dated 21 September 2018 includes projected

development on Phaser III. In August 2017, many features in pre-v3.16.x
were removed. There were many business decisions on why they were re-
moved based on financial support and sponsorship deadlines imposed. Phaser
v3.14.0 (released OCT 2018) saw the return of many deleted features. In other
words, Phaser v3.14.0 returns to the original vision of January 2017 after
several rewrites. Phaser v3.15+ was the next massive re-write (released OCT
2018); followed by v3.16.0 DEC 2018. Phaser v3.5 is nearing completion with
more “breaking changes”.

My best guess is that any books, tutorials, blogs, and “how-to” articles — written
before to Phaser v3.16+ (NOV 2018) — are not fully functional with Phaser III and
should be re-written to the Phaser v3.24+ minimum standard baseline. Hence the
reason this book is dedicated and updated to the official Phaser III (release v3.24+)
and has removed any references to previously released versions. (See newsletter
#139 dated 20190211) “Breaking Changes”5
3 http://www.ecma-international.org/publications/standards/Ecma-262.htm
4 https://web.archive.org/
5 https://madmimi.com/p/f0b3bd

Copyright © 1972-2017 Stephen Gose. All rights reserved.

About this Workbook: v

About this Workbook:

This 6th edition offers additional production methods, beyond the former editions,
I call the Game Design System™ from which we’ll create Game Recipes™. Expert
game developers understand the “Don’t Repeat Yourself” (D.R.Y.) concept, yet few
have taken a step back to the “10,000-foot view” 6 (i.e., “Executive level thinking”) on
their game production pipelines. We’ll do that aerial view in this book as we build
gaming prototypes, linked to “Headless” Game DesignTM7 mechanics, and artwork.
Then, “nose dive head-first” directly into game prototyping. I believe you will be
surprised how quickly and easily we can build 100s of games using this Game Design
System™ with its Game Recipes™ tools.

This workbook is intended to be a hands-on guide for “HTML5 Game Development”

with an emphasis on the Phaser JavaScript Gaming Frameworks. Yet, our game
production and project management could apply to any browser-based gaming
framework! It’s not exclusive to the Phaser III JS Gaming Framework.

I’m assuming you already have a “working knowledge” of the “Front-end” technolo-
gies8 — specifically HTML59 , CSS310 , and JavaScript11 — in your arsenal. I know that
many senior “full-stack” and “front-end” developers do; but, I have received dozen
of emails about this book’s former editions as being “… too difficult for those
just starting their own game studios.” Therefore, if learning any of these web
development technologies12 is what you’re initially seeking, then I recommend
a quick visit to W3Schools13 as your first FREE starting point. By following their
instructions, you will learn a complete foundation in HTML5, CSS, and JavaScript in
a matter of hours! … then, return to this workbook and learn how to combine
those technologies into your own game creations.
6 https://en.wikipedia.org/wiki/Business_acumen#Executive_level_thinking
7 https://leanpub.com/hgd
8 https://roadmap.sh/frontend
9 http://amzn.to/2nAYjxr
10 http://amzn.to/2mG01Zv
11 https://amzn.to/2Iw9RZj
12 https://github.com/kamranahmedse/developer-roadmap
13 http://www.w3schools.com/js/default.asp

Copyright © 1972-2017 Stephen Gose. All rights reserved.

About this Workbook: vi

Viewing the Source Code

This e-Book includes source code which is optimally viewed in single-column, land-
scape mode with the font size adjusted to a comfortable setting.

Links and References

The Internet is a living, dynamic resource of information that doubles every 35 days!
There are several reasons this book points to external content. Because —

1. It provides you the “research path” I took to develop and present my ideas. It
takes all the guess-working and personal research out of it. This saves you 100s
of hours of your personal free-time searching for supporting facts and opinions.
2. It avoids copyright infringements and provides the required acknowledgments
to “Open-source authors” for use of their contributions and resources under the
various licenses and EULA14 .
3. It provides external authors an opportunity to recant or update their content.
(Kindly review Phaser v3 DevLogs as an example.) Technology is a fast-moving
target, and what was once “cutting edge” becomes obsolete. For example, the
use of “window.onload“ was recanted by its originator back in 2014 as an unsafe
method for launching browser applications. (see Phaser Game Design Workbook,
pages 15-2215 for complete details. )
4. It reduces your initial purchase price from the reams of “padded source code
content” — don’t make me embarrass those authors who do this — while
keeping your investment in this book’s information “fresh”. This book would be
triple the size and “4x” the price if I had embedded all of the source code tutorial’s
as many others do.

All the source code is written in “pure” JavaScript (JS) and the Phaser.js Gaming
Frameworks; it doesn’t use any additional “abstraction layers” such as “TypeScript”,
“CoffeeScript”, or “JQuery” for obvious reasons.

You’ll find your Bonus content, source code, and references in …

• the footnotes links,

14 https://choosealicense.com/licenses/
15 http://leanpub.com/phaserjsgamedesignworkbook/

Copyright © 1972-2017 Stephen Gose. All rights reserved.

About this Workbook: vii

• external reference links, and in the file which are available directly from the
supporting website — without registration nor private logon thus keeping your
personal information safe!
• or from the latest and most current updates inside your LeanPub.com personal
library (assuming that you’re a LeanPub patron16 ).

Who should use this workbook?

This workbook targets both the learning novices17 — those who enjoy “learning by
doing” using “deliberate practice” 18 — and the experienced expert programmers19
in web-application development; and, of course, those who want a finished game
from their own designs and efforts. If you are interested in making browser games,
especially for the Mobile/WebXR markets20 , then this book is a perfect choice
along with its companion volumes: the Headless HTML5 Game DesignTM21 , Phaser
Game Starter Kit Collection22 , Phaser Game Design Workbook 23 , and Phaser Game
Prototyping 24 . With this in mind, you will do a lot of writing, thinking, and coding in
JavaScript throughout this workbook. You may prefer using paper (external physical-
or soft-“paper”) to organize your development ideas and processes.

I’ve “gone to great lengths” 25 to make this book “skim-friendly” — even for my
International customers by emphasizing important concepts in bold font type. I have
provided links to “English (American) Jargon phrases” 26 that will help translate this
content directly into your native language. I use “Notes”, “Tips”, “Warning” and “Best
Practices” icons to encapsulate those ancillary topics for your further education from
other experts in the gaming industry.

I further assume that many readers will want to use this book to quickly build
their bespoke27 game products. So, I’ve included references to other similar game
examples, gaming engines, frameworks, GUI game kits28 , indie developers, authors,
their “open-source” contributions, articles, books, artwork 29 , application tools, and
their wisdom.
16 https://leanpub.com/u/pbmcube
17 https://www.nap.edu/read/9853/chapter/5
18 https://www.nateliason.com/notes/peak-anders-ericsson-robert-pool
19 https://www.nateliason.com/blog/become-expert-dreyfus
20 https://immersiveweb.dev/
21 http://leanpub.com/hgd
22 https://leanpub.com/p3gskc
23 https://leanpub.com/phaser3gamedesignworkbook
24 https://leanpub.com/phaser3gameprototyping
25 https://dictionary.cambridge.org/us/dictionary/english/go-to-great-lengths
26 https://www.smartling.com/blog/40-american-slang-words-and-phrases-you-need-to-know/
27 https://www.urbandictionary.com/define.php?term=bespoke
28 https://craftpix.net/categorys/2d-game-kits/?affiliate=112238
29 https://www.gamedevmarket.net/?ally=GVgAVsoJ

Copyright © 1972-2017 Stephen Gose. All rights reserved.

About this Workbook: viii

In summary, if you are a hobbyist, independent game developer, student, teacher,

or start-up game studio you will find a wealth of information on both product
and project management, game design, game mechanisms, game mechanics, and
“insider’s tips” about the Phaser JavaScript Gaming Frameworks.

If you’d like a link to your finished games in future updates, please use my
contact information on LeanPub.com30 or Amazon.com Author’s page31 .

Your newly obtained skills…

By the end of this workbook, you’ll have integrated into your own bespoke32 game
design:

• Step-by-step methods migrating older Phaser v2.x.x into III.

• Built “future-proof” and flexible game architectures.
• Used the “Headless” Game Design System™ which creates Game Recipes™33
from automated tools.
• Demystified Web Sockets for optimized game deployments.
• Adopted processes for business product/project management and “extreme
programming” 34 .
• Organized a standardized file structure for general game developments;
• Used a blank game template to scaffold further game projects;
• Converted and adopted new changes in the Phaser III API.
• Managed groups and layers of game objects with Phaser Frameworks;
• Imported resources and game assets;
• Displayed, animated, and moved game avatars on various screen renderings;
• Incorporated sound effects (sfx) and theme music across various game phases;
• Deployed “heads-up display” (HUD) on game scenes both inside and outside the
canvas;
• Used customized web fonts;
• Incorporated multiple game-inputs (touch, multi-touch, accelerometer, mouse,
and keyboard);
• Implemented several physics systems in both Phaser Gaming Frameworks;
• Created and managed various game deployments (CMS, PWA, & SWPA);
30 https://leanpub.com/u/pbmcube
31 https://www.amazon.com/kindle-dbs/entity/author/B01N780CUF?_encoding=UTF8&node=283155&offset=0&
pageSize=12&sort=author-pages-popularity-rank&page=1&langFilter=default#formatSelectorHeader
32 https://www.urbandictionary.com/define.php?term=bespoke
33 https://www.nateliason.com/blog/become-expert-dreyfus
34 https://en.wikipedia.org/wiki/Extreme_programming

Copyright © 1972-2017 Stephen Gose. All rights reserved.

About this Workbook: ix

• Managed permanent cache assets across game phases;

• Optimized games for various mobile devices;
• Integrated several 3rd-party scripts and services.

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Design System™ x

Game Design System™

“Game Recipe™” Courses (purchased separately on specific gaming mechanics) us-
ing the Game Design System™ management method and concepts. These courses
enhance your skills and are available from my educational websites (hosted by
LeanPub.com35 ) or Training By Blackboard, Books, and Browsers36 .

You can earn your Game Development Certifications from my online courses37 ,
from Udemy (102-pages of online courses!)38 or Zenva (my personal favorite!)39 ; to
enhance your resume.

Game Studio - Book Series

Learn to build a Gaming Studio for passive (or secondary) income!

• Game Studio Starter Kit Bundle40 — Start your own Game Studio for passive or
secondary income! This bundle shows you how to develop product and project
management in the gaming industry from my 23 years of experience. You’ll learn
how to quickly build game prototypes in any genre, launch, and then distribute
your games. You’ll also have 16+ popular game genres to choose for your product
line with 19 subgenres to to expand upon. Learn how to capture various game
industry market shares.
• Headless HTML5 Game Design (Vol. I)41 — Creating Cloud-based “Content-as-a-
Service” (CaaS) games for Any Gaming Device.
• Making Massive Multi-Player Online games (Vol. II)42 — Creating Multi-Player
Online games using the Full-stack, White-labeled, and “Content-as-a-Service”
(CaaS) Architectures.
35 https://leanpub.com/u/pbmcube
36 http://tbcube.com./
37 https://leanpub.com/u/pbmcube
38 https://click.linksynergy.com/deeplink?id=pmlyJRiRsYE&mid=39197&murl=https%3A%2F%2Fptop.only.wip.la%3A443%2Fhttps%2Fwww.udemy.com%
2Fcourses%2Fdevelopment%2Fgame-development%2F%3Fsearch-query%game%2Bdevelopment
39 https://academy.zenva.com/?a=47&campaign=RPGCaaS
40 https://leanpub.com/b/gssk
41 https://leanpub.com/hgd
42 https://leanpub.com/mmmog

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Design System™ xi

• Making Multi-Player Online games43 — A Game Development Workbook for any

Phaser JavaScript Gaming Framework. This book is a thorough review of MMoG
mechanics for both client- and server-side APIs using Block-chain, WebRTC, RPC,
MoM, SSE, Cloud Services, and Web Sockets (Berkeley). I do not recommended
for entry-level developers; mastery of several IT technologies44 is required.
• Phaser JS Game Design Workbook 45 — 6th Edition for v2.x.x and v3.16+ —
guidance on project and product management in the gaming industry.
• Phaser Game Prototyping 46 — 6th Edition for v2.x.x and v3.16+
• Phaser Game Starter Kit Collection47 — 6th Edition for v2.x.x only.
• Phaser III Game Prototyping 48 — 6th Edition for v3.16+ only.
• Phaser III Game Starter Kit Collection49 — 6th Edition for v3.16+ only.

Game Studio - Online Courses

• Phaser Game Design Workshop Course50 — guidance on programming your first

game in v2.x.x.
• Phaser Starter Kit Game Collection51 for either Phaser v2.x.x or Phaser III.
• Phaser III Game Design Workshop Course52 — guidance on programming your
first game in v3.16+.
• Game Studio Starter Kit Collection (basic)53 — 3 courses are included in this
Business starter kit for Game Studios … “Making Dating & Quiz Browser games”,
“Making Online Dress-UP Fashion games”, and “Making Puzzle Browser games”
with Phaser v2.x.x.
• Ultimate Game Studio Starter Kit Collection54 — 6 course-set are included in this
Business starter kit for Game Studios. Build your own Game Studio business for
as little as $17.99.
43 https://leanpub.com/rrgamingsystem
44 https://github.com/kamranahmedse/developer-roadmap
45 https://leanpub.com/phaserjsgamedesignworkbook
46 https://leanpub.com/LoRD
47 https://leanpub.com/pgskc
48 https://leanpub.com/phaser3gameprototyping
49 https://leanpub.com/p3gskc
50 https://leanpub.com/c/phasergamedesignworkshop
51 https://makingbrowsergames.com/p3gskc/
52 https://leanpub.com/c/p3gdc
53 https://leanpub.com/set/leanpub/gsskit
54 https://leanpub.com/set/leanpub/ugsskitc

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Design System™ xii

“Making Browser Games” - Books Series

Individual Chapters — sold separately from the “Phaser Starter Kit Game Collections
books”55 — contain both the Phaser v2.x.x and Phaser “III” (3.16+) examples, source
code, and game license. Find and select your favorite game genre.

Chapter 1 — Action & Arcade56

Chapter 2 — Adventure Mazes & Story Plots57
Chapter 3 — Collapsing Blocks58
Chapter 4 — Connect 4 & Go59
Chapter 5 — Dating Simulations & Quizzes60
Chapter 6 — Defensive Towers61 — the typical tower-defense constructions with two
innovative variations.
Chapter 7 — Dress-Up & Fashion62
Chapter 8 — Hidden Objects63
Chapter 9 — “Jump to Capture” 64
Chapter 10 — MahJong — available only in the “Phaser Starter Kit Game Collec-
tions” 65 volumes or the “Memory Match” mega-chapter.
Chapter 11 — Match-3 & Trace 3+66
Chapter 12 — Memory Match67 for Pairs (either “Open” or “Hidden”) & Sequence
matching — a “mega-chapter” with 5 games and licenses.
Chapter 13 — Music & Rhythm68
Chapter 14 — Puzzle (both Jigsaw & Sliders)69
Chapter 15 — Role-Playing Character Development — available only in the “Phaser
Starter Kit Game Collection” 70 volumes. Role Playing Content-as-a-Service (CaaS)71
— a “mega-chapter” developing content for B2B, Affiliate Syndicates, and clients is
NOT available in the “Phaser Starter Kit Game Collections” 72 volumes.
Chapter 16 — Simulations — available only in the “Phaser Starter Kit Game
55 https://makingbrowsergames.com/p3gskc/
56 https://leanpub.com/mbg-action-arcade
57 https://leanpub.com/mbg-adventure
58 https://leanpub.com/mbg-collapse
59 https://leanpub.com/mbg-connect4
60 https://leanpub.com/mbg-dating
61 https://leanpub.com/mbg-towers
62 https://leanpub.com/mbg-dressup
63 https://leanpub.com/mbg-hidden
64 https://leanpub.com/makingjump2capturebrowsergames
65 https://makingbrowsergames.com/p3gskc/
66 https://leanpub.com/mbg-match3
67 https://leanpub.com/mbg-memory
68 https://leanpub.com/mbg-music
69 https://leanpub.com/mbg-puzzle
70 https://makingbrowsergames.com/p3gskc/
71 https://leanpub.com/mbg-rpg
72 https://makingbrowsergames.com/p3gskc/

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Design System™ xiii

Collections” 73 volumes.
Chapter 17 — Strategy & Tactics74

“Making Browser Games” Series - online Courses

• Making Browser games — Tower Defense75 with Phaser v2x.x and v3.16+.
• Making Dating & Quiz Browser games76 with Phaser v2x.x.
• Making Online Dress-UP Fashion games77 with Phaser v2x.x.
• Making Peg Solitaire Browser games78 with Phaser v2x.x.
• Making Phaser III Peg Solitaire Browser games79 with Phaser v3.16+.
• Making Puzzle Browser games80 with Phaser v2x.x.
• Making RPG Browser games81 with Phaser v2x.x.

Programming Courses

See the growing catalog of courses for college credit, home schooling or personal
skills development at Training by Blackboard, Books & Browsers82

• Using JavaScript OLOO in game development83 (learn JavaScript development)

“Walk-Thru Tutorial” Series - Online Courses

These courses are “step-by-step” guides to create specifically designed games with
some explanation as to why we do this (which is typically found in most online
tutorials).

• “Walk-Thru Tutorial Series” - Blood Pit™ (IGM)84

73 https://makingbrowsergames.com/p3gskc/
74 https://leanpub.com/mbg-strategy
75 https://leanpub.com/c/mbg-p2p3-towerdefenses
76 https://leanpub.com/c/mbg-dating
77 https://leanpub.com/c/mbg-dressup-p2
78 https://leanpub.com/c/mbg-peg-p2
79 https://leanpub.com/c/mbg-peg-p3
80 https://leanpub.com/c/mbg-puzzle-p2
81 https://leanpub.com/c/mbg-rpg-p2
82 https://www.tbcube.com/
83 https://leanpub.com/c/jsoloo
84 https://leanpub.com/c/bloodpit-wtts

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Design System™ xiv

• “Walk-Thru Tutorial Series” - Blood Pit II™85

• “Walk-Thru Tutorial Series” - Mozart’s Music Match™86
• “Walk-Thru Tutorial Series” - Rogue Prince QuestsTM (IGM)87

85 https://leanpub.com/c/wtts-bloodpit2-mmog
86 https://leanpub.com/c/wtts-mmm
87 https://leanpub.com/c/arrp

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Part I: Product Management

Part I Introduction to Game Design System™

I’m skipping to my 3rd “Product Management Phase” and we’ll create a single-player
prototype in both Phaser v2.x.x & v3.24+. More detailed information about the
“Product/Project Management” phases — Concept, Design and Distribution — are
available now only in these “Game Studio” series companions:

• Phaser.js Game Design Workbook (6th edition)88 .

• Headless Game Design89 a “Product Management” workbook for “Content-as-a-
Service”.

88 https://leanpub.com/phaserjsgamedesignworkbook
89 https://leanpub.com/hgd
 2

Part I is a brief excerpt from Phaser.js Game Design Workbook (6th edition)90 explain-
ing the Game Design System™ and its Game Recipe™ construction. Our goal is to build
several fully-functional “Phaser Game Prototypes”. There are several step-by-step
instructions and file downloads. We’ll catalog and create various “Game Framework
Mechanism” (GFM)91 components — those “visual elements” that are separate from
our core “Game Mechanics” (GM) genres and Artwork theme components. From this
simple foundation, we’ll learn to combine these “building blocks” into various game
products as easily as a child would use “Lego”™ blocks to construct a toy castle.
Furthermore, you can review this construction process throughout “Phaser Game
Starter Kit Collections” 92 — a workbook of 16+ popular game genre mechanics and
19 sub-genres. By the end of “Part I”, we’ll have created everything a game prototype
uses:

• Creating visual avatars and their associated metadata structures;

• Collecting a player’s input;
• Detecting collisions and interactions among various elements;
• Migrating to dynamic game phases;
• Monitoring the gaming loop;
• Creating and Updating heads-up displays (aka “HUD”).
• Reviewing the massive overhaul of the “Tween” System in the v3.19+;
• Events and Call-backs &mdash where and when to use;
• Sound effects (sfx); and
• Sprite Animation(s).

90 https://leanpub.com/phaserjsgamedesignworkbook
91 http://www.michael-richardson.com/processes/rup_for_sqa/core.base_rup/guidances/concepts/component_
A2E2B3B1.html
92 https://leanpub.com/p3gskc

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Studio & Project Preparations 1

1. Game Studio & Project Preparations

This chapter is focused on organizing the project’s file structure and setting up your
workstation environment. It will allow us to:

• have the software tools available for game production

• maintain an organized file structure;
• facilitate project creation, and
• test various aspects of our game

The first impressions you’ll develop while reading this chapter is: THERE’S NO FRONT-
END BUILD TOOLS “Why is that?”, you’re thinking? My goal is to provide a direct “no
non-sense” approach in game construction. In many competing tutorials and books,
you’ll read chapterS(!) on working with “node.js”, “grunt”, “bower”, “yeoman”, “webpack”,
“brunch”, “gulp”, etc. (ad nauseam)1 . The shame, of all this, is that folks are beginning
to write such articles as “I finally made sense of front end build tools. You can, too.” 2
Another popular game developer, Andrezej Mazur of Enclave Game, stated my same
sentiments in this way …

“Everything changed so much over the years. I feel like grandpa right now —
back in my days, we typed pure CSS and used jQuery in a Notepad. Right now,
to start a new project, you need a few days to chose the right tools, configure
the build process, have proper configs and settings, preprocessors in place,
etc. I would really need at least a few solid months to go through the most
popular tool-chain. … That’s why I think I’ll end up using the “quick and dirty”
approach — I’ll do a research about using a common template or a starter
(kit)3 and will expand from it.” (quoted from https://dev.end3r.com/2018/
11/gamedev-versus-front-end/)

ACTUALLY START THE DAMN GAME …

“Writing your idea down is not starting the damn game. Writing a design document
is not starting the damn game. Assembling a team is not starting the damn game.
Even doing graphics or music is not starting the damn game. It’s easy to confuse

1 https://en.wikipedia.org/wiki/Ad_nauseam
2 https://medium.freecodecamp.org/making-sense-of-front-end-build-tools-3a1b3a87043b
3 https://makingbrowsergames.com/book/standalone.zip

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Studio & Project Preparations 2

“preparing to start the damn game” (ed.: and all those “FRONT-END BUILD TOOLS”!)
with “starting the damn game”. Just remember: a damn game can be played, and if
you have not created something that can be played, it’s not a damn game!

So dammit, even creating a game engine is not necessarily starting the damn game.
Which brings me to the next tip…” Read more such advice here …a
a http://makegames.tumblr.com/post/1136623767/finishing-a-game

Well, … Ok then, let’s get our game “prototype” started and finished; then, we’ll
address those “Front-end Building Tools” 4 in later chapters. BUT first, we need a
workstation to build stuff …

Hint: Google and Mozilla both provide excellent resources for Game5 and Web
Developers.6

1.1 Workstation Setup

Let’s take an inventory of what you currently have on-hand. Do you have:

• A browser that is HTML5 compliant7 ; now-a-days, most browsers are compli-

ant. But you can double-check using this site: https://caniuse.com/#search=ES6
(NOTE: bookmark this site for use latter.)
• A separate directory (i.e., Microsoft “folder”) to save and review each game
projects’ development files. Check you disk space8 now. This becomes your
“software workspace” 9 . (See Project Setup below)
• A “text editor” or “Integrated Develop Environment” (IDE) of your choice. (See
Development Tools below)
• An operational web server? (Coming next …)
4 https://developers.google.com/web/tools/setup/setup-buildtools
5 https://developer.mozilla.org/en-US/docs/Games
6 https://developers.google.com/web/tools/
7 https://caniuse.com/#search=html5
8 https://www.wikihow.com/Check-Your-Hard-Disk-Space
9 https://en.wikipedia.org/wiki/Workspace

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Studio & Project Preparations 3

Batteries not included … Web Server Required

“Why do I need a web server? Can’t I just open the html files with my browser?”

Answer: All JavaScript games, that load assets and files, require launching itself from a
web server — either locally inside your workstation or remotely from the Internet.10
It’s all about browser security and the same-origin policies11 — prohibiting files load-
ing from different “domains” 12 and the protocols used to access your locally stored
files. When you request anything from the Internet you’re typically using the “hyper-
text transfer protocol” (“http://” or “https://”). From a web server, security policies
ensure you only access files that you are authorized to use. When you open any
HTML file from your local operating system, your browser uses the “file://“ protocol.
(technically a different protocol 13 than “http://”), massive restrictions are triggered
inside your browser, for the following obvious reasons. Under the “file://“ protocol,
no concept of domains nor “server-level security policies” exists, just your computer’s
“raw file system” and its operating system — identified as the localhost14 — using
a local IP address(es) (0.0.0.0 or IPv6 ::1 or IPv4 127.0.0.0/8 to 127.255.255.255/8)15
per RFC 990, November 1986.16 This means that your HTML pages are not running
on any domain nor public Internet IP address at all, and thus JavaScript is unable
to load any game assets dynamically. Do you really want JavaScript to have that
much control — to load anything from anywhere — off your computer? Well, I’m
guessing your answer should be “… not ever!”. If JavaScript had unrestricted access
using the “file://“ protocol, nothing could stop it from tapping into your information
and sending it anywhere to anyone.

Exercise: Read more about browser security from the Chromium Blog 17

Hint: “127.0.0.1” or “localhost” are IP addresses that default to your local

workstation. The packet path never reaches the Network Interface Card (NIC).
This is an important concept when creating web sockets and Multi-Player
games.

10 http://gose-internet-services.net/data-centers/uk-data-center/
11 https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy
12 https://en.wikipedia.org/wiki/Domain_Master_Browser
13 https://www.w3.org/Addressing/
14 https://en.wikipedia.org/wiki/Localhost
15 https://www.lifewire.com/network-computer-special-ip-address-818385
16 http://tools.ietf.org/html/rfc990#page-6
17 https://blog.chromium.org/2008/12/security-in-depth-local-web-pages.html

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Studio & Project Preparations 4

Deeper Dive: Testing “MMoGs” Locally??!

There’s a trend to give your “localhost“ a “top-level domain” (TLD) name of ”.dev”. Stop!
Don’t! WHY?!? Because in 2017, Google has the TLD registration of several thousand
of these commonly used domains that developers once used. ( See this article18 . )

Exercise: Learn which TLD names are still available here19 .

Locally Testing MMoGs

Wikipedia statesa , “The processing of any packets sent to a loop-back address is
implemented in the link layer of the TCP/IP stack. Such packets are never delivered
to any network interface controller (NIC) or device driver, which permits testing of
software in the absence of any hardware network interfaces.

Like any other packets traversing the TCP/IP stack, looped-back packets convey
the IP address and port number they were addressed to. Thus, the services that
ultimately receive them can respond according to the specified loop-back destination.
For example, an HTTP service could route packets addressed to 127.0.0.99:80 and
127.0.0.100:80 to different Web servers, or to a single server that would return
different web pages. (ed.: one browser window to another browser window which
is NOT true testing of any MMoG game.) To simplify such testing, the host’s file can
be modified to provide appropriate aliases for each such address.”
a https://en.wikipedia.org/wiki/Localhost

“So then! What’s a girl to do?!” The solution really is simple. Run your game develop-
ment files from a local web server or remotely from the Internet20 . Depending on
your workstation operating system (and what you have installed already), there are
several ways to launch web pages from a “web service” 21 .

• Some text editors and Integrated Development Environments (IDE) already

include a local web server. Brackets22 is one such example.
18 http://fossilgeek.jasonbaier.com/posts/google-chrome-63-forcing-dev-domains-to-https
19 https://iyware.com/dont-use-dev-for-development/
20 http://gose-internet-services.net/data-centers/uk-data-center/
21 http://www.webopedia.com/TERM/W/Web_Services.html
22 http://brackets.io/

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Game Studio & Project Preparations 5

• Another simple solution I discovered is the Google’s Chrome Web Server.23 Once
you install this application, you can launch any web page(s) directly from Chrome.
Simply point it at your URI path and project folder.24
• The official Phaser instructions (and sanctioned method) are …

Quote: “We would recommend either WAMP Server 25 or XAMPP26 and both
have easy set-up guides available. WAMP specifically installs an icon into
your system-tray from which you can stop and restart the services, as well
as modify Apache settings such as creating a new folder alias for a project.”
Read more details here27 . (overlooked was MAMP or MAMP Pro28 available
for those with MAC OS X.)

Exercise: Use this Google Chrome Web Server Install Instructions (movie: 1:51
minutes)29 to setup a webserver.

Development Tools

Although Phaser web site has a well-documented section on “how to get started” 30 .
I recommend you test and develop your game using an Integrated Development
Environment (IDE) editor of your choice. I use several: Mighty Editor (now open
source)31 , Phaser Editor 2D32 , the (FREE) NotePad++33 ; although, Brackets34 editor
runs a close second in my daily web-site construction. Do not use any word processing
applications such as Microsoft Word; this is not a “hate statement” against Microsoft.
Word processing applications add invisible formatting to your source code that will
lead to problems. If you do not have a favorite text editor, I have some recommenda-
tions based on your status:
23 https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb?hl=en
24 http://uri.thephpleague.com/4.0/components/overview/
25 http://www.wampserver.com/en/
26 http://www.apachefriends.org/en/xampp.html
27 https://phaser.io/tutorials/getting-started-phaser3/part2
28 https://www.mamp.info/en/
29 https://www.youtube.com/watch?v=AK6swHiPtew
30 https://phaser.io/tutorials/getting-started-phaser3
31 https://github.com/TheMightyFingers/mightyeditor
32 https://phasereditor2d.com/
33 https://notepad-plus-plus.org/
34 http://brackets.io/

Copyright © 1972-2017 Stephen Gose. All rights reserved.

Discovering Diverse Content Through
Random Scribd Documents
Poble: Que visca Andrónica!

Nikelas: (avansant ell sol.) En nom del Emperant! Ohíume!

Sergi: Ohímlo.

Alexis: Escoltém!

Matheu: Escoltémlo!

Nikelas: Oh poble: os prega l'Emperant que sortiu d'aquestas salas!

Sergi: A Andrónica esperém! Volém que sía per sobre nostra rassa
ella l'Augusta! Que al monastir no torni!

Poble: No! May!

Nikelas: Poble: si m'escoltéu, aqueixa dona al claustre maymés hi

tornará, que vol que's trenquin l'Emperant los seus vots, fets en mal
hora. Mes sabéu que aquets vots sols pot trencarlos la Iglesia
soberana!

Sergi: Per la terra Deu deixá'l cel y fins doná la vida: qu'ella deixi'l
sagrat en be dels nostres.

Nikelas: Poble d'Albia: Nicéfor se refía de vosaltres. (Remors.)

Ohíume! Aqueixa dona quan la lluyta ha finat per sa ardidesa, los
seus parpres ha clos, y esgroguehida anava á caure com qui's mor, si
als brassos no hagués serrat l'August son cos puríssim; y ab ella's va
acostant, demunt del poltro estrenyentla son pit; y ve en silenci
l'estol voltantlos dels guerrers, puig saben que duhen un cos sant.
(S'ha de sentir lo trepitj dels cavalls que s'acostan, en mitj del
silenci.) Sentíu?! Ja arriban.

(Emoció del poble, mes sens cridar.)

Sergi: Germans: ara á la Iglesia ab tot lo poble. Y als sacerdots

diguémlos que te d'esser, sobretot y tothom, aquesta santa de Nicéfor
la esposa.

Nikelas: Anéu. Ja pujan.

Sergi: A la Iglesia, companys!

Jordi: Tots!

Alexis: A la Iglesia!

(Han sortit tots, parlant baix, per la galería, banda dreta.)

Escena V

(Andrónica, Nicéfor y altres caballers. De primer vindrán alguns

caballers, y després Nicéfor portant als brassos á Andrónica. Tots
entran rápidament.)

Nicéfor: (entrant.) Fora tothom d'aquí! Tothom! Jo y ella! (Tothom

surt rápidament per diferentas portas. Nicéfor deixa á Andrónica
mitj estesa en un seti de pedra.) Jo com esclau, com ca fidel, que
aspira son dols alé per respirar! Andrónica, llum de la terra, rosa y
llir de l'ánima, riu d'amor que't glassares, párlam, míram. Coratje.'M
sents? Tots han fugit com ombras. L'has tingut, oh, ma vida, en la
batalla, y ara't perleja de rosada'l rostre y esbategas com tórtora
poruga! Oh Andrónica! Oh ma Andrónica: desperta, que'l dia ja es
per tot! Lo sol camina matiner per besarte, y tot es gloria al teu
voltant, qu'ets centre de la terra.

Andrónica: (tornant á la vida.) Ah! Deu meu! Hont me trobo?…

Nicéfor: Hont sols la ditxa t'espera, oh'l meu orgull, hont tot de gala
se va vestint perque tú hi ets.

Andrónica: (alsantse.) No'm trobo dintre ma casa!

Nicéfor: Si ets ab mí!

Andrónica: Que'm dugan al Monastir, al meu sagrat! Ma celda! Mont

Crist, hont es!

Nicéfor: (per son pit, obrint los brassos.) Aquí, sobre aquesta ara,
brassos estesos; com es ell fet home!

Andrónica: Tot ha finat, Nicéfor!

Nicéfor: Tot comensa per tú y per mí: pels dos, que s'ha vessada
tanta de sanch perque'ns juntém.

Andrónica: (va á caure.) Se clohuen altra volta mos ulls!

Nicéfor: (sostenintla.) Oh Deu!

Andrónica: (anant á perdre'ls sentits.) Ma celda! Soch morta pera tú!

Nicéfor: Ah no, no! Escolta. Som á l'hora suprema de la vida, no sols
tu y jo, sino aquest poble: déixam, y tanta sanch ha corregut debadas.
Bisanci tornará, que prou arriba son tronar que no es lluny, y ab
nostres odis nos trobará enfeblits! Y ay! jo sens esma me veuré sol;
cauré vensut, y esclava l'Anatolia jeurá. Mes si tú pujas al trono ab
mí, ni que la terra escupi tots los morts de la rassa bisantina en
contra meu, los morts y'ls vius cent voltas vensuts serán: maymés hi
haurá cadenas que á aquest poble engrillonin. Será lliure l'Anatolia
per sempre; un cant de gloria se bressará en l'espay, y á tú, l'Augusta,
se deurá tanta ditxa! Y quan los tanqui la mort tos ulls, s'aixecará per
sobre de ton cos fins tocar á las estrellas com montanyas de flors… Y
benehida será l'ánima teva fins al últim dia del món per tota la
nissaga.

Andrónica: Oh, sí, sí; benehida per mon poble per tot mon poble, sí!
(Aturantse ab espant.) Mes malehida per nostre Deu! Horror! Oh!
Mas despullas eternament envoltas d'embaumadas flors del bell
temps, y l'ánima captiva al infern abrusantse!

Nicéfor: Ah no!

Andrónica: Vinguéres tart á trobarme, que un instant va endúrsem

de ton amor, Nicéfor! Ay, jo fora pera sempre ta esposa; mes los
diables en contra nostra's van juntar, y he d'esser sols la esposa d'un
Deu! (Resolta.) Nicéfor, guíam: lo monastir hont es!

Nicéfor: Jo no puch! Rómpres sento tot dintre meu!

Andrónica: (senyalant al cel.) Allá es que ho volen! Fins á maymés!

Jo sola!…
(Va á fugir.)

Nicéfor: Be está: allúnyat! Fins á maymés! Ja está, mes jo la vida

sense tú no la vuy, que un'altra volta jo'l monstre no'l vuy ser! Viure
sens ánima maymés, maymés! Apártat! Que'l cop últim seré'l tirá;
mes contra meu. Va, fora ma vida miserable!…

(Anantse á treure un'arma.)

Andrónica: Oh no, Nicéfor!

Nicéfor: (anantse á ferir.) Jo vuy morir!

Andrónica: Ah no! Jo vuy que viscas! Nicéfor: jo t'estimo!

Nicéfor: Oh, calla, Andrónica!

Andrónica: T'estimo! Ah, no puch més!… Si tú finavas finaría ab tú

jo! Si ets meu! Si ho sento que tot jo ho va dihent! Y es tot que ho
crida: l'ayre, la llum: “Es seu, es seu Nicéfor!” Si jo t'he fet com ets! Si
la teva ánima (Per son pit.) la he enmotllada jo aquí dintre la meva.

Nicéfor: Sí, sí: soch vida teva! Mes tú, mira: la pau no haurías lluny
de mí. Perjura foras al claustre, que las reixas clouhen no més lo cos;
que l'esperit revelas á homes y á Deus! Y tú't revelas! Dígamho que á
mí'm vols, sols á mí. Parla ó só'l monstre, y contra terra y cel, á la
teva ánima la confessió li haig d'arrencar á trossos.

(Nicéfor, com una fera, la rebrega entre sos brassos.)

Andrónica: Sí, sí, mátam dihente que t'estimo sobretot y tothom de

cels y terras!
Nicéfor: Ara soch l'Emperant! Perque m'estimas tinch tot lo mon!
Que vingan á arrencarla de sobre de mon cor la gloria meva!

Andrónica: Oh Nicéfor, Nicéfor!

(Se senten las campanas.)

Nicéfor: Las campanas! Las campanas! Las sents? Y'ls clams del
poble! Ja va tornant lo nostre poble, míral.

(Mirant á fora, cap á la dreta.)

Andrónica: Que alegre'l poble, sí! Mírals; tots duhen sanch de la

lluyta en los vestits encara!

Nicéfor: Sanch per tú que han vessat! Qué no farían per véuret ma
muller, si es que la Iglesia s'hi negava? Mes no, qu'ella es ben nostra.

Andrónica: Lo poble m'encoratja.

Nicéfor: Al temple! Vina!

(La agafa per la má per anar á sortir.)

Escena VI

(Andrónica, Nicéfor y Nikelas)

Nikelas: Senyor!…

Nicéfor: Parla, Nikelas.

Nikelas: Vinch á durvos una nova. Senyor…

(No gosant.)

Nicéfor: Y qué es? (Pausa.) Que parlis.

Nikelas: De baix en baix molts caballers conversan y surten del

palau. Sé que s'ajuntan dintre'l Castell Major.

Nicéfor: (seré.) A tots que vingan, que'ls crida l'Emperant. Tothom

alegre dintre Albia avuy, Nikelas!

Nikelas: Es que corre qu'Heráclias es qui'ls mana per la vila.

Nicéfor: Heráclias! (Rient.) Diu Andrónica qu'Heráclias es altre cop

qui dirigeix mas tropas. Un mort mana altres morts!

Andrónica: Senyor, que jegui en pau!

Nicéfor: Y ab molta terra!…

Nikelas: Aquesta espasa li vaig clavar ben fonda.

Nicéfor: Oh sí, Nikelas. Tú m'has tret aqueix cranch que á mas

entranyas era arrapat. Vaig fer justicia. Vinga tothom assí. Mos
caballers, lo poble. Tothom á vora vostre. (Surt Nikelas.) Aném al
temple seguintnos la nissaga que t'estima, y á mí perque tú'm vols.

Andrónica: Qué puch donarte més, oh August, si fins á Deu jo't

dono?

Nicéfor: Angel del cel, coratje.

(Agafantla per la má pera sortir.)

Escena VII

(Andrónica, Nicéfor, Sergi, Alexis, Matheu, Jordi y poble. De cop

Sergi y Alexis; després los altres.)

Sergi: Senyor!

Nicéfor: Vinga mon poble avora nostre.

(Van á sortir.)

Sergi: Oh Senyor!

Nicéfor: Puja ab ella al trono la nissaga entera. L'Augusta es

l'Anatolia, que s'encarna en lo cos d'esta verge.

Sergi: y'l poble, (que va entrant.) Oh, sí, sí Andrónica!

Andrónica: Poble, jo t'aymo! Oh poble meu, defensa l'Emperant fins

morir.

Sergi: Oh escolta, Augusta! A la Iglesia li hem dut lo desitj nostre, y't

vením á cercar pera que't sacrin esposa del August!

Nicéfor: Oh rassa ferma, gracias per mí y per ella! Aném Andrónica.

(Agafantla per la má se dirigeixen cap al poble.) Ona santa del poble,
óbrans tas ayguas y endúnsen al mitj teu!

Andrónica: Aném!
Sergi: Assobre del pit com una mare.

Nicéfor: (anant á marxar en mitj del poble.) Aném!

Sergi y poble: Voltémlos!

Escena VIII

(Andrónica, Nicéfor, Sergi, Alexis, Matheu, Jordi, poble, alguns

caballers ab Nikelas y l'abat de Sant Thimur y altres monjos y
sacerdots.)

Abat: Aturéuvos, Senyor!

Nicéfor: Aném á l'ara, que aquí us duch á esta santa, perque sía en lo
tálam l'Augusta esposa meva! Oh Andrónica, seguím!

Abat: (aturantlos.) Ah, Senyor… gracia. (S'aturan.) Sou l'August,

l'Emperant de l'Anatolia: mes per sobre de vos hi ha lleys que dicta
Deu tot sol, y per ell la Iglesia parla.

Andrónica: (Oh, quin esglay!)

Nicéfor: Que parli, donchs, la Iglesia.

Abat: L'August: en nom de Deu, la qu'es sa esposa á reclamar vením!

(Andrónica deixa la má de Nicéfor y abaixa'l cap.)

Nicéfor: Per durla á l'ara y ferla esposa meva. Perque sía sobretot y
tothom!
Abat: Pera que torni á la casa de Deu; qu'es desposada ab Deu Nostre
Senyor.

(Remor del poble.)

Nicéfor: Oh, no! Per péndremela no hi ha poder al mon!

Abat: Deu la reclama.

Andrónica: (Oh, cor meu!)

Nicéfor: No, Deu no! No es Deu qui lliga los sers per destrossarlos!
Esta dona Deu me l'ha dat sobre del camp de guerra. Es meva, tota
meva!

Abat: Va jurarho ser de Deu!

Nicéfor: No!

Abat: Que ho diga! Que responga!

Andrónica: Sí, vaig jurar!

Nicéfor: Tot s'ha desfet! Onadas de sanch han esborrat aquesta jura!
Y si més sanch calgués, pera que sía esborrat fins lo rastre, altra de
negra ona gegant faría ab la sanch vostra!

Andrónica: No, Nicéfor!

Nicéfor: Oh inichs! Traydors! Venuda l'Anatolia teníu á aqueix

Bisanci qu'esventaré com pols! (A Andrónica.) Aquí están, mírals: ja
ho portan en los ulls! Son traydors! Hienas qu'ensuman la carn
morta! En cementiris tornarían los pobles, morrejanthi fins dintre
las entranyas, hont engendran las mares á sos fills! Oh vils! Oh
monstres! Jo tancaré la vostra negra turba mateix que'ls escorpits, de
foch voltantvos, que al cel s'enfili, y vostre Deu que us tregui!

Sergi: Al foch ab ells!

Poble: Al foch!

Nikelas: (á Nicéfor.) Senyor, arriban caballers rebelats!

Escena IX

(Andrónica, Nicéfor, abat de Sant Thimur, Nikelas, Sergi, Alexis,

Matheu, Jordi, Heráclias, caballers, poble, sacerdots y monjos.
Heráclias no's deixará veure en mitj dels caballers fins que s'indiqui.)

Nicéfor: Ah no, que al trono mos nobles son lleals! (A ells.)

Caballers…

Abat: Mira qui fa de guía als caballers, Nicéfor!

(Al dividirse'ls caballers se veu al mitj d'ells inmoble, groch, com la

cera, de cara y mans, á Heráclias.)

Poble: (molt soptat.) Heráclias!

Nicéfor: Es un somni!

Andrónica: (abrassantse á Nicéfor.) Heráclias!

Nicéfor: Tornan los morts á aquesta vida?!

Poble: (ab terror.) Un mort!

Nicéfor: (á Andrónica, desvariejant.) S'enganyan mos ulls? Míral! Es

ell? Es que'ls sepulcres gitan sos morts contra nosaltres? Míral! Com
lo cor me fa batre! Guspirejan sos ulls de condempnat! Lo cap se'm
torba! Estol d'osseras devant meu batallan!

(Xisclant com boig.)

Andrónica: (volguentlo fer tornar á la rahó.) No, no, Nicéfor! Ah,

Nicéfor!

(Lo poble remoreja.)

Nicéfor: Lluytan tots contra mí, y sos darts al cor m'arriban!

Andrónica: No, no!

Nicéfor: (com arrencantse'ls darts.) Tots fora! Fora'ls darts que'm

matan!

Andrónica: Deu meu! Deu meu!

Heráclias: Nicéfor!

Andrónica: (crit d'horror, sentintlo.) Ah!

(Remor creixent del poble.)

Heráclias: Nicéfor!
Nicéfor: (estúpidament.) Qué? Qué?

Heráclias: Tot ha finit per tú! Vaig durte jo assobre'l trono, y jo te'n
trech!

(Andrónica segueix abrassada á Nicéfor.)

Abat: Oh poble! que't rebelas á Deu y á sos ministres!… (Lleuger

remor del poble.) Fills d'Anatolia, dempnació á la rassa!

(Remor creixent del poble.)

Andrónica: (avansant al mitj y agenollantse.) Misericordia!

Abat: No! Jo beneheixo qui mati á aquesta dona!

Heráclias: (ferintla.) Jo! Te, móret!

Andrónica: Ah!

Nicéfor: (sostenintla.) Andrónica!

Alexis: Malvat!

Sergi: Arrosseguémlo!

(Desapareixen Heráclias, l'Abat y'ls sacerdots emportats per una

onada del poble que anirá ferintlos y donant crits de mort. Altra gran
onada, també ab las armas enlayre, volta á Andrónica, sostinguda per
Nicéfor y Sergi.)

Matheu: (venint del fons.) Los bisantins!

Jordi: (id.) La vila es plena tota de soldats de Bisanci;'ls nostres
perden!

Abat: (desde dintre.) Visca Bisanci!

Andrónica: (agonitzant.) Oh! No!

Nicéfor: No! L'Anatolia!

(Lo poble va desesperat d'un lloch al altre de la escena. Gran soroll

de batalla á fora.)

Alexis: La vila está cremant! Y es de Bisanci!

Andrónica: No; no morir! Triomfar!

(Fent esforsos pera sortir de la escena sostinguda per Nicéfor.)

Nicéfor: A triomfar!

Sergi: Guerra fins a l'últim alé!

Andrónica: (anant á caure.) No puch! Als brassos! Duyéumhi!

Nicéfor: Oh, sí!…

Andrónica: Aixequéume!… Sosteníume!…

(Entre Sergi y Nicéfor se la enduhen ben alta, dominantho tot. Gran

afany de viure en ella.)

Nicéfor: Guerra á Bisanci!

Sergi: Guerra!

Andrónica: (perque la posin més alta.) Enlayre! Enlayre! Més! Més!

Nicéfor: Companys: avant!

Andrónica: Enlayre!'M moro!

(Mor Andrónica y ells segueixen avansant cap á la galería portantla

enlayre, morta.)

Nicéfor: Símbol de ma nissaga, triomfa morta!

Sergi: Visca Andrónica!

Poble: Visca! Visca Andrónica!

(Lo soroll de campanas y clarins, los crits y la fressa d'armas s'han de

sostenir, lo mateix que la resplandor del incendi y la fumareda, fins
al últim moment.)

Teló
 *** END OF THE PROJECT GUTENBERG EBOOK ANDRÓNICA ***

Updated editions will replace the previous one—the old editions will
be renamed.

Creating the works from print editions not protected by U.S.

copyright law means that no one owns a United States copyright in
these works, so the Foundation (and you!) can copy and distribute it
in the United States without permission and without paying
copyright royalties. Special rules, set forth in the General Terms of
Use part of this license, apply to copying and distributing Project
Gutenberg™ electronic works to protect the PROJECT GUTENBERG™
concept and trademark. Project Gutenberg is a registered trademark,
and may not be used if you charge for an eBook, except by following
the terms of the trademark license, including paying royalties for use
of the Project Gutenberg trademark. If you do not charge anything
for copies of this eBook, complying with the trademark license is
very easy. You may use this eBook for nearly any purpose such as
creation of derivative works, reports, performances and research.
Project Gutenberg eBooks may be modified and printed and given
away—you may do practically ANYTHING in the United States with
eBooks not protected by U.S. copyright law. Redistribution is subject
to the trademark license, especially commercial redistribution.

START: FULL LICENSE

THE FULL PROJECT GUTENBERG LICENSE
 PLEASE READ THIS BEFORE YOU DISTRIBUTE OR USE THIS WORK

To protect the Project Gutenberg™ mission of promoting the free

distribution of electronic works, by using or distributing this work (or
any other work associated in any way with the phrase “Project
Gutenberg”), you agree to comply with all the terms of the Full
Project Gutenberg™ License available with this file or online at
www.gutenberg.org/license.

Section 1. General Terms of Use and

Redistributing Project Gutenberg™
electronic works
1.A. By reading or using any part of this Project Gutenberg™
electronic work, you indicate that you have read, understand, agree
to and accept all the terms of this license and intellectual property
(trademark/copyright) agreement. If you do not agree to abide by all
the terms of this agreement, you must cease using and return or
destroy all copies of Project Gutenberg™ electronic works in your
possession. If you paid a fee for obtaining a copy of or access to a
Project Gutenberg™ electronic work and you do not agree to be
bound by the terms of this agreement, you may obtain a refund
from the person or entity to whom you paid the fee as set forth in
paragraph 1.E.8.

1.B. “Project Gutenberg” is a registered trademark. It may only be

used on or associated in any way with an electronic work by people
who agree to be bound by the terms of this agreement. There are a
few things that you can do with most Project Gutenberg™ electronic
works even without complying with the full terms of this agreement.
See paragraph 1.C below. There are a lot of things you can do with
Project Gutenberg™ electronic works if you follow the terms of this
agreement and help preserve free future access to Project
Gutenberg™ electronic works. See paragraph 1.E below.
1.C. The Project Gutenberg Literary Archive Foundation (“the
Foundation” or PGLAF), owns a compilation copyright in the
collection of Project Gutenberg™ electronic works. Nearly all the
individual works in the collection are in the public domain in the
United States. If an individual work is unprotected by copyright law
in the United States and you are located in the United States, we do
not claim a right to prevent you from copying, distributing,
performing, displaying or creating derivative works based on the
work as long as all references to Project Gutenberg are removed. Of
course, we hope that you will support the Project Gutenberg™
mission of promoting free access to electronic works by freely
sharing Project Gutenberg™ works in compliance with the terms of
this agreement for keeping the Project Gutenberg™ name associated
with the work. You can easily comply with the terms of this
agreement by keeping this work in the same format with its attached
full Project Gutenberg™ License when you share it without charge
with others.

1.D. The copyright laws of the place where you are located also
govern what you can do with this work. Copyright laws in most
countries are in a constant state of change. If you are outside the
United States, check the laws of your country in addition to the
terms of this agreement before downloading, copying, displaying,
performing, distributing or creating derivative works based on this
work or any other Project Gutenberg™ work. The Foundation makes
no representations concerning the copyright status of any work in
any country other than the United States.

1.E. Unless you have removed all references to Project Gutenberg:

1.E.1. The following sentence, with active links to, or other

immediate access to, the full Project Gutenberg™ License must
appear prominently whenever any copy of a Project Gutenberg™
work (any work on which the phrase “Project Gutenberg” appears,
or with which the phrase “Project Gutenberg” is associated) is
accessed, displayed, performed, viewed, copied or distributed:
 This eBook is for the use of anyone anywhere in the United
States and most other parts of the world at no cost and with
almost no restrictions whatsoever. You may copy it, give it
away or re-use it under the terms of the Project Gutenberg
License included with this eBook or online at
www.gutenberg.org. If you are not located in the United
States, you will have to check the laws of the country where
you are located before using this eBook.

1.E.2. If an individual Project Gutenberg™ electronic work is derived

from texts not protected by U.S. copyright law (does not contain a
notice indicating that it is posted with permission of the copyright
holder), the work can be copied and distributed to anyone in the
United States without paying any fees or charges. If you are
redistributing or providing access to a work with the phrase “Project
Gutenberg” associated with or appearing on the work, you must
comply either with the requirements of paragraphs 1.E.1 through
1.E.7 or obtain permission for the use of the work and the Project
Gutenberg™ trademark as set forth in paragraphs 1.E.8 or 1.E.9.

1.E.3. If an individual Project Gutenberg™ electronic work is posted

with the permission of the copyright holder, your use and distribution
must comply with both paragraphs 1.E.1 through 1.E.7 and any
additional terms imposed by the copyright holder. Additional terms
will be linked to the Project Gutenberg™ License for all works posted
with the permission of the copyright holder found at the beginning
of this work.

1.E.4. Do not unlink or detach or remove the full Project

Gutenberg™ License terms from this work, or any files containing a
part of this work or any other work associated with Project
Gutenberg™.

1.E.5. Do not copy, display, perform, distribute or redistribute this

electronic work, or any part of this electronic work, without
prominently displaying the sentence set forth in paragraph 1.E.1
with active links or immediate access to the full terms of the Project
Gutenberg™ License.

1.E.6. You may convert to and distribute this work in any binary,
compressed, marked up, nonproprietary or proprietary form,
including any word processing or hypertext form. However, if you
provide access to or distribute copies of a Project Gutenberg™ work
in a format other than “Plain Vanilla ASCII” or other format used in
the official version posted on the official Project Gutenberg™ website
(www.gutenberg.org), you must, at no additional cost, fee or
expense to the user, provide a copy, a means of exporting a copy, or
a means of obtaining a copy upon request, of the work in its original
“Plain Vanilla ASCII” or other form. Any alternate format must
include the full Project Gutenberg™ License as specified in
paragraph 1.E.1.

1.E.7. Do not charge a fee for access to, viewing, displaying,

performing, copying or distributing any Project Gutenberg™ works
unless you comply with paragraph 1.E.8 or 1.E.9.

1.E.8. You may charge a reasonable fee for copies of or providing

access to or distributing Project Gutenberg™ electronic works
provided that:

• You pay a royalty fee of 20% of the gross profits you derive
from the use of Project Gutenberg™ works calculated using the
method you already use to calculate your applicable taxes. The
fee is owed to the owner of the Project Gutenberg™ trademark,
but he has agreed to donate royalties under this paragraph to
the Project Gutenberg Literary Archive Foundation. Royalty
payments must be paid within 60 days following each date on
which you prepare (or are legally required to prepare) your
periodic tax returns. Royalty payments should be clearly marked
as such and sent to the Project Gutenberg Literary Archive
Foundation at the address specified in Section 4, “Information
 about donations to the Project Gutenberg Literary Archive
Foundation.”

• You provide a full refund of any money paid by a user who

notifies you in writing (or by e-mail) within 30 days of receipt
that s/he does not agree to the terms of the full Project
Gutenberg™ License. You must require such a user to return or
destroy all copies of the works possessed in a physical medium
and discontinue all use of and all access to other copies of
Project Gutenberg™ works.

• You provide, in accordance with paragraph 1.F.3, a full refund of

any money paid for a work or a replacement copy, if a defect in
the electronic work is discovered and reported to you within 90
days of receipt of the work.

• You comply with all other terms of this agreement for free
distribution of Project Gutenberg™ works.

1.E.9. If you wish to charge a fee or distribute a Project Gutenberg™

electronic work or group of works on different terms than are set
forth in this agreement, you must obtain permission in writing from
the Project Gutenberg Literary Archive Foundation, the manager of
the Project Gutenberg™ trademark. Contact the Foundation as set
forth in Section 3 below.

1.F.

1.F.1. Project Gutenberg volunteers and employees expend

considerable effort to identify, do copyright research on, transcribe
and proofread works not protected by U.S. copyright law in creating
the Project Gutenberg™ collection. Despite these efforts, Project
Gutenberg™ electronic works, and the medium on which they may
be stored, may contain “Defects,” such as, but not limited to,
incomplete, inaccurate or corrupt data, transcription errors, a
copyright or other intellectual property infringement, a defective or
damaged disk or other medium, a computer virus, or computer
codes that damage or cannot be read by your equipment.

1.F.2. LIMITED WARRANTY, DISCLAIMER OF DAMAGES - Except for

the “Right of Replacement or Refund” described in paragraph 1.F.3,
the Project Gutenberg Literary Archive Foundation, the owner of the
Project Gutenberg™ trademark, and any other party distributing a
Project Gutenberg™ electronic work under this agreement, disclaim
all liability to you for damages, costs and expenses, including legal
fees. YOU AGREE THAT YOU HAVE NO REMEDIES FOR
NEGLIGENCE, STRICT LIABILITY, BREACH OF WARRANTY OR
BREACH OF CONTRACT EXCEPT THOSE PROVIDED IN PARAGRAPH
1.F.3. YOU AGREE THAT THE FOUNDATION, THE TRADEMARK
OWNER, AND ANY DISTRIBUTOR UNDER THIS AGREEMENT WILL
NOT BE LIABLE TO YOU FOR ACTUAL, DIRECT, INDIRECT,
CONSEQUENTIAL, PUNITIVE OR INCIDENTAL DAMAGES EVEN IF
YOU GIVE NOTICE OF THE POSSIBILITY OF SUCH DAMAGE.

1.F.3. LIMITED RIGHT OF REPLACEMENT OR REFUND - If you

discover a defect in this electronic work within 90 days of receiving
it, you can receive a refund of the money (if any) you paid for it by
sending a written explanation to the person you received the work
from. If you received the work on a physical medium, you must
return the medium with your written explanation. The person or
entity that provided you with the defective work may elect to provide
a replacement copy in lieu of a refund. If you received the work
electronically, the person or entity providing it to you may choose to
give you a second opportunity to receive the work electronically in
lieu of a refund. If the second copy is also defective, you may
demand a refund in writing without further opportunities to fix the
problem.

1.F.4. Except for the limited right of replacement or refund set forth
in paragraph 1.F.3, this work is provided to you ‘AS-IS’, WITH NO
OTHER WARRANTIES OF ANY KIND, EXPRESS OR IMPLIED,
INCLUDING BUT NOT LIMITED TO WARRANTIES OF
MERCHANTABILITY OR FITNESS FOR ANY PURPOSE.

1.F.5. Some states do not allow disclaimers of certain implied

warranties or the exclusion or limitation of certain types of damages.
If any disclaimer or limitation set forth in this agreement violates the
law of the state applicable to this agreement, the agreement shall be
interpreted to make the maximum disclaimer or limitation permitted
by the applicable state law. The invalidity or unenforceability of any
provision of this agreement shall not void the remaining provisions.

1.F.6. INDEMNITY - You agree to indemnify and hold the Foundation,

the trademark owner, any agent or employee of the Foundation,
anyone providing copies of Project Gutenberg™ electronic works in
accordance with this agreement, and any volunteers associated with
the production, promotion and distribution of Project Gutenberg™
electronic works, harmless from all liability, costs and expenses,
including legal fees, that arise directly or indirectly from any of the
following which you do or cause to occur: (a) distribution of this or
any Project Gutenberg™ work, (b) alteration, modification, or
additions or deletions to any Project Gutenberg™ work, and (c) any
Defect you cause.

Section 2. Information about the Mission

of Project Gutenberg™
Project Gutenberg™ is synonymous with the free distribution of
electronic works in formats readable by the widest variety of
computers including obsolete, old, middle-aged and new computers.
It exists because of the efforts of hundreds of volunteers and
donations from people in all walks of life.

Volunteers and financial support to provide volunteers with the

assistance they need are critical to reaching Project Gutenberg™’s
goals and ensuring that the Project Gutenberg™ collection will
remain freely available for generations to come. In 2001, the Project
Gutenberg Literary Archive Foundation was created to provide a
secure and permanent future for Project Gutenberg™ and future
generations. To learn more about the Project Gutenberg Literary
Archive Foundation and how your efforts and donations can help,
see Sections 3 and 4 and the Foundation information page at
www.gutenberg.org.

Section 3. Information about the Project

Gutenberg Literary Archive Foundation
The Project Gutenberg Literary Archive Foundation is a non-profit
501(c)(3) educational corporation organized under the laws of the
state of Mississippi and granted tax exempt status by the Internal
Revenue Service. The Foundation’s EIN or federal tax identification
number is 64-6221541. Contributions to the Project Gutenberg
Literary Archive Foundation are tax deductible to the full extent
permitted by U.S. federal laws and your state’s laws.

The Foundation’s business office is located at 809 North 1500 West,

Salt Lake City, UT 84116, (801) 596-1887. Email contact links and up
to date contact information can be found at the Foundation’s website
and official page at www.gutenberg.org/contact

Section 4. Information about Donations to

the Project Gutenberg Literary Archive
Foundation
Project Gutenberg™ depends upon and cannot survive without
widespread public support and donations to carry out its mission of
increasing the number of public domain and licensed works that can
be freely distributed in machine-readable form accessible by the
widest array of equipment including outdated equipment. Many
small donations ($1 to $5,000) are particularly important to
maintaining tax exempt status with the IRS.

The Foundation is committed to complying with the laws regulating

charities and charitable donations in all 50 states of the United
States. Compliance requirements are not uniform and it takes a
considerable effort, much paperwork and many fees to meet and
keep up with these requirements. We do not solicit donations in
locations where we have not received written confirmation of
compliance. To SEND DONATIONS or determine the status of
compliance for any particular state visit www.gutenberg.org/donate.

While we cannot and do not solicit contributions from states where

we have not met the solicitation requirements, we know of no
prohibition against accepting unsolicited donations from donors in
such states who approach us with offers to donate.

International donations are gratefully accepted, but we cannot make

any statements concerning tax treatment of donations received from
outside the United States. U.S. laws alone swamp our small staff.

Please check the Project Gutenberg web pages for current donation
methods and addresses. Donations are accepted in a number of
other ways including checks, online payments and credit card
donations. To donate, please visit: www.gutenberg.org/donate.

Section 5. General Information About

Project Gutenberg™ electronic works
Professor Michael S. Hart was the originator of the Project
Gutenberg™ concept of a library of electronic works that could be
freely shared with anyone. For forty years, he produced and
distributed Project Gutenberg™ eBooks with only a loose network of
volunteer support.
Project Gutenberg™ eBooks are often created from several printed
editions, all of which are confirmed as not protected by copyright in
the U.S. unless a copyright notice is included. Thus, we do not
necessarily keep eBooks in compliance with any particular paper
edition.

Most people start at our website which has the main PG search
facility: www.gutenberg.org.

This website includes information about Project Gutenberg™,

including how to make donations to the Project Gutenberg Literary
Archive Foundation, how to help produce our new eBooks, and how
to subscribe to our email newsletter to hear about new eBooks.