Skip to content

Commit 3323a21

Browse files
committed
Update README
1 parent f00ee7b commit 3323a21

File tree

1 file changed

+101
-43
lines changed

1 file changed

+101
-43
lines changed

README.md

Lines changed: 101 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,107 @@
1-
# Eco Entity Component System
1+
# Eco Entity Component Framework
22

3-
Eco is an entity component system for JavaScript/HTML5 games that lets you
3+
Eco is an entity-component framework for JavaScript/HTML5 games that lets you
44
define your components and game logic as decoupled POJO objects and functions.
55
You can use it as part of a custom game engine, and also as a glue layer to
66
keep your game logic decoupled from the game framework and libraries of your
77
choice.
88

9-
The framework is under development, but below is the API it is planned to
10-
implement.
9+
The framework is under development, but the API currently described below is
10+
feature complete.
11+
12+
## Overview
13+
14+
// Add position and movement vector components with default values
15+
eco.addComponent('position', { x: 0, y: 0 });
16+
eco.addComponent('vector', { x: 0, y: 0 });
17+
18+
// Create an entity and add these components to it
19+
eco.entity()
20+
.add('position', { x: 100 })
21+
.add('vector', { x: 1 });
22+
23+
// In your game update loop
24+
eco.filter(['position', 'vector'], function (position, vector) {
25+
// For each entity that has both the 'position' and 'vector' components,
26+
// update entity position based on the movement vector
27+
position.x += vector.x;
28+
position.y += vector.y;
29+
});
1130

1231
## Components
1332

14-
Components are data structures. They don't need to contain any logic, so you
15-
can define them either as simple objects containing default values, or as a
16-
function that returns the object data.
33+
Components are data structures that don't need to contain any logic. Eco lets
34+
you define multiple types using the eco.addComponent() method:
35+
36+
### Simple components
37+
38+
Defining a component with just a name creates a component that stores whatever
39+
data is passed to it.
1740

18-
var eco = new Eco();
41+
eco.addComponent('foo');
1942

20-
eco.createComponent(
21-
'position', // the name of the component
22-
{ // the component's default values
23-
x: 0,
24-
y: 0
25-
}
26-
);
43+
eco.entity()
44+
.add('foo', 'bar')
45+
.get('foo') // 'bar'
2746

28-
You can also define a component constructor function. The function is called
29-
each time a component is added to an entity so you can define a component as
30-
a class and return a new instance from the function.
47+
eco.entity()
48+
.add('foo', { bar: 'baz' })
49+
.get('foo') // { bar: 'baz' }
3150

32-
// Define a class
33-
var Vector = function(x, y, speed) {
51+
### Factory components
52+
53+
Defining components with a function creates a factory component. When a
54+
component is added to an entity, the data will be passed to the given
55+
function and the returned data will be stored.
56+
57+
// Create a class
58+
function Vector(x, y) {
3459
this.x = x || 0;
3560
this.y = y || 0;
36-
this.speed = speed || 1;
37-
}
38-
39-
// Define methods
40-
Vector.prototype.getVectorX = function() {
41-
return this.x * this.speed;
4261
}
4362

44-
// The function will be called each time a component is added to an entity
45-
// Each entity will therefore have a new instance of Vector
46-
eco.createComponent('vector', function(data) {
63+
// Define a factory component that returns an instance of the class
64+
eco.addComponent('vector', function (data) {
4765
return new Vector(data.x, data.y);
4866
});
4967

68+
var entity = eco.entity()
69+
.add('vector', { x: 1, y: 0 });
70+
71+
(entity.get('vector') instanceof Vector) // true
72+
73+
### Object template components
74+
75+
Defining components with an object literal defines a default set of values.
76+
When a component is added to an entity, the data is shallow merged into the
77+
defaults and the result is stored.
78+
79+
eco.addComponent('position', {
80+
x: 0,
81+
y: 0
82+
};
83+
84+
var entity = eco.entity()
85+
.add('position', { x: 100 });
86+
87+
entity.get('position').x // 100
88+
entity.get('position').y // 0
89+
90+
### Constant components
91+
92+
Defining a component with a primitive value (string, number, boolean) will
93+
treat the value as a constant that is returned for all instances.
94+
95+
eco.addComponent('isPlayer', true);
96+
97+
eco.entity()
98+
.add('isPlayer')
99+
.get('isPlayer') // true
100+
101+
eco.entity()
102+
.add('isPlayer', 'foo')
103+
.get('isPlayer') // true (note: 'foo' was ignored)
104+
50105
## Entities
51106

52107
Entities are simply a collection of components. Components can be added and
@@ -56,35 +111,38 @@ removed at runtime allowing behaviour to be changed dynamically.
56111
.add('isPlayer')
57112
.add('position', { x: 0, y: 0 })
58113
.add('vector', { x: 0, y: 0 })
59-
.add('friction', { value: -1 })
60-
.add('gravity', { value: -1 });
114+
.add('friction', { value: 1 })
115+
.add('health', { amount: 1 })
116+
.add('gravity', { value: 1 });
61117

62118
// Add components
63-
entity.add('foo', { bar: 'baz' });
119+
entity.add('gravity');
120+
entity.has('gravity'); // true
64121

65122
// Remove components
66123
entity.remove('gravity');
67124
entity.has('gravity'); // false
68125

69-
// Access components
126+
// Get components
70127
entity.get('health').amount = 100;
71128

72129
// Create an entity proxy for a given id
73-
eco.entity(123).getId(); // 123
130+
eco.entity(123)
131+
.getId(); // 123
74132

75133
Note: Eco doesn't store entity instances, only component data for entity ids.
76134
For convenience, the returned entity instances are proxy objects providing
77135
methods to work with a given entity id, and so equality comparisons should
78-
compare the ids rather than the proxy instances themselves
136+
compare the ids rather than the proxy instances themselves.
79137

80138
eco.entity(123) === eco.entity(123); // false
81139
eco.entity(123).getId() === eco.entity(123).getId(); // true
82140

83141
## Systems
84142

85-
Systems are your game logic and behaviour. Eco doesn't handle these, but
86-
provides methods to iterate through entities that have certain combinations of
87-
components.
143+
Systems are your game logic and behaviour so it's up to you how you want to
144+
implement them. Eco provides methods that let you iterate over entities
145+
containing certain combinations of components.
88146

89147
// Iterate through entities with 'position' and 'vector' components
90148
eco.filter(['position', 'vector'], function(position, vector, entity) {
@@ -100,9 +158,9 @@ components.
100158
*/
101159
});
102160

103-
/**
104-
* Get an array of entities that have at least one component.
105-
* Eco only stores component data, so entities without any
106-
* components won't be returned
107-
*/
161+
/**
162+
* Get an array of entities that have at least one component.
163+
* Eco only stores component data, so entities without any
164+
* components won't be returned
165+
*/
108166
eco.getEntities();

0 commit comments

Comments
 (0)