Quick Guide

A GAME1 Projects need the following as a minimum.

1. Core GAME1 JS files
2. Main HTML File Including these files
3. Game JS File
4. Game statedefinitions.js file

In most cases you also want you game resources to be included. The directory structure is not fixed, but strongly recommended is to follow the example standard.

Including the core GAME1 JS files

The following example shows how this can be done, from the main index.html file.

<script src="../../../core/boot.js"></script>
<script src="../../../core/blockfont.js"></script>
<script src="../../../core/spritemover.js"></script>

Only boot.js is mandatory.

• blockfont.js is used to write color-full text on the screen
• spritemover.js is an implementation of software sprites

In this case the core files, are located under ../../../core You may put them in any place you like.

statedefinitions.js file

This file handles the moving between different states in the game. For example the title sequence is a different state then the ingame action.

Below is an example:

class StateDefinitions {

  constructor ( demo ) {

    this.startPlaybook = "demo";

    /* -----------------------------------------------------
      Playbooks
       ----------------------------------------------------- */

    this.playbooks = {
        demo: { object: demo, enter: 'load', definition: this },
    };

    /* -----------------------------------------------------
      Global state setup
       ----------------------------------------------------- */

    this.stateTypes = {
      LOADSILENT:   ['LOAD'],
      PLAY:         ['INIT','CLEANUP','RENDER','PROCESS','HANDLEINPUT'],
      WATCH:        ['INIT','CLEANUP','RENDER','PROCESS'],
      INIT:         ['INIT'],
      BRANCH:       ['BRANCH']
    };

    this.stateMethodSuffix = {
      LSRENDER:     undefined,
      LSPROCESS:    undefined,
      RENDER:       'Render',
      PROCESS:      'Run',
      HANDLEINPUT:  'Handle'
    };
	
    /* -----------------------------------------------------
      Demo playbook
       ----------------------------------------------------- */

	/* no branch functions */

	/* demo playbook */
    var demoPlaybook = this.playbooks.demo;
    demoPlaybook.states = {
		
		/* Only load, play and repeat since this is a demo, not a game */
		
        'load':    { _type: "LOADSILENT",  next: 'play'},
        'play':    { _type: "PLAY", next: 'play' },
		
		
      } ;
  }
 }

Playbooks and states

A State is a like a single Moment in the game. A Playbook is a collection of such moments. For example:

A Playbook called "title" could contain:

• State title.load
• State title.play

A Playbook called "game" could contain:

• State: game.load
• State: game.playing
• State: game.bonuslevel

States and method groups

There are different types of states. But in general states have method groups. A method group, is a number of methods in JS that are executing code for that state.

This is defined in the following way.

First let's look again at the example definition file, this section below:

    demoPlaybook.states = {
		
		/* Only load, play and repeat since this is a demo, not a game */
		
        'load':    { _type: "LOADSILENT",  next: 'play'},
        'play':    { _type: "PLAY", next: 'play' },
		
		
      } ;

Here you see that there is two states (for one playbook only).

Each state, has a type. The definition of the type is done a bit earlier like this.

    this.stateTypes = {
      LOADSILENT:   ['LOAD'],
      PLAY:         ['INIT','CLEANUP','RENDER','PROCESS','HANDLEINPUT'],
      WATCH:        ['INIT','CLEANUP','RENDER','PROCESS'],
      INIT:         ['INIT'],
      BRANCH:       ['BRANCH']
    };

    this.stateMethodSuffix = {
      LSRENDER:     undefined,
      LSPROCESS:    undefined,
      RENDER:       'Render',
      PROCESS:      'Run',
      HANDLEINPUT:  'Handle'
    };

Each type has a few (pre defined) types. For example, the PLAY state has 5 types. This means it has a method for each of these 5 types.

Each type has 1 or more methods attached to it. Simple states just one. The stateMethodSuffix record overrides standard suffixes.

The name of the method is <statename_lc>

So we have the following methods for example:

playRender playRun playHandle etc...