Idea Pool

Layers

MOTIVATION

Sorting: an easy way to make sure different groups of objects are always positioned correctly on z-axis. Grouping: Perform operations on the layer (think css transforms on a div). We could even have a .each() method to perform normal operations on all the entities. Properties: make it possible to define certain properties on a per layer basis. FX, set the render system to DOM/canvas

IMPLEMENTATION

• Create a new abstraction in Crafty for creating layers and manage a three-like hierarchy.
• Create a Layer component that somehow takes care of the z-index.

Action List and Behavior

MOTIVATION

The idea is to have a way to describe AI in a composable way. A behavior is something that an entity is doing until that behavior decides it is done. Two behaviors could be “follow mouse until collision” and “eat mouse”. An action list contains a list of behaviors that the entity will perform in sequence (think pipelining a set of commands in an RTS). Behaviors can be added to front or back of the list, so if the cat sees a dog it can add a behavior to the front “run and hide until the dog is gone”. Similarly if the mouse shoots the cat with a paralyzing poison you would add a “do nothing for x seconds” behavior This idea could be really powerful if combined with a Crafty editor.

IMPLEMENTATION

The Action list could be implemented as a component that entities would require. Behaviors could be implemented as components. These components would then not be required by the entity, but consumed by the action list component. Alternatively a separate notion of a Behavior could be introduced in Crafty say, Crafty.b().

See http://sonargame.com/2011/06/05/action-lists/ I think we can create a system that is more closely integrated with the component entity system of Crafty and more intuitive to use.

Render component

MOTIVATION

Usually the choice between canvas and DOM comes down to performance. If someday we gain a webgl rendering implementation this will be even more true. This component will pick render system depending on the current platform based on some predefined algorithm, say DOM on iOS, canvas on IE10 etc. It should be possible to override this algorithm per entity and for the entire game.

Data files

It would be beneficial to be able to describe all parts of a Crafty game in individual files and have a way to bring it all back together. If we decide on a standard way to describe things like components, entities, scenes in individual files it would make it much easier to create an editor with powerful features that exploit the structure of the game.

The system described in http://sonargame.com/2011/06/28/component-based-game-objects-in-javascript/ might be of inspiration. Also mpetrovic is working on something similar https://github.com/mpetrovic/js_game/blob/master/components/data_store.js

Path movement

Provide various ways to define paths and have an entity move along this path. This could be a part of tween. Make it possible to have the entity rotated so that it always faces forward.

Developer Tools

MOTIVATION

Testing during development is tiresome using the dev tools available in browsers. Crafty should have to ability to inspect and change a lot of stuff at runtime.

I would want to:

• Click on entities and see and change values of all variables, the list of components.
• Pause the game and step through it frame by frame using keyboard shortcuts.
• Please add to this list :-)

IMPLEMENTATION

Crafty Inspector is the first implementation attempt. The approach is to create a html page that contains a lot of extra stuff that inspects the running game and crafty engine. Small changes are introduced in Crafty to facilitate this.

Multiple Canvases

MOTIVATION

Drawing a bunch of non-changing elements to a canvas (think background art) is expensive. It would be nice to be able to specify which canvas an entity is drawn to.

IMPLEMENTATION

• Add a method to Crafty to add multiple canvases
• Add a method to associate an entity with a specific canvas
• Add a property to the layer mechanism that forces a layer to be rendered on separate canvas

Inspiration

http://www.adityaravishankar.com/2011/11/command-and-conquer-programming-an-rts-game-in-html5-and-javascript/

http://www.html5rocks.com/en/tutorials/doodles/lem