Update readme about adding new stuff
This commit is contained in:
parent
f65b3728ed
commit
c7b3cc1675
37
README.md
37
README.md
|
@ -55,6 +55,43 @@ The code within the engine is relatively clean with some code for the actual gam
|
|||
|
||||
This project is based on ES5. Some ES2015 features are used but most of them are too slow, especially when polyfilled. For example, `Array.prototype.forEach` is only used within non-critical loops since its slower than a plain for loop.
|
||||
|
||||
#### Adding a new component
|
||||
|
||||
1. Create the component file in `src/js/game/components/<name_lowercase>.js`
|
||||
2. Create a component class (e.g. `MyFancyComponent`) which `extends Component`
|
||||
3. Create a `static getId()` method which should return the `CamelCaseName` without component (e.g. `MyFancy`)
|
||||
4. If any data needs to be persisted, create a `static getSchema()` which should return the properties to be saved (See other components)
|
||||
5. Add a constructor. **The constructor must be called with optional parameters only!** `new MyFancyComponent({})` should always work.
|
||||
6. Add any props you need in the constructor.
|
||||
7. Add the component in `src/js/game/component_registry.js`
|
||||
8. Add the componetn in `src/js/game/entity_components.js`
|
||||
9. Done! You can use your component now
|
||||
|
||||
#### Adding a new building
|
||||
|
||||
(The easiest way is to copy an existing building)
|
||||
|
||||
1. Create your building in `src/js/game/buildings/<my_building.js>`
|
||||
2. Create the building meta class, e.g. `MetaMyFancyBuilding extends MetaBuilding`
|
||||
3. Override the methods from MetaBuilding you want to override.
|
||||
4. Most important is `setupEntityComponents`
|
||||
5. Add the building to `src/js/game/meta_building_registry.js`: You need to register it on the registry, and also call `registerBuildingVariant`.
|
||||
6. Add the building to the right toolbar, e.g. `src/js/game/hud/parts/buildings_toolbar.js`:`supportedBuildings`
|
||||
7. Add a keybinding for the building in `src/js/game/key_action_mapper.js` in `KEYMAPPINGS.buildings`
|
||||
8. In `translations/base-en.yaml` add it to two sections: `buildings.[my_building].XXX` (See other buildings) and also `keybindings.mappings.[my_building]`. Be sure to do it the same way as other buildings do!
|
||||
9. Create a icon (128x128, [prefab](https://github.com/tobspr/shapez.io-artwork/blob/master/ui/toolbar-icons.psd)) for your building and save it in `res/ui/buildings_icons` with the id of your building
|
||||
10. Create a tutorial image (600x600) for your building and save it in `res/ui/building_tutorials`
|
||||
11. In `src/css/icons.scss` add your building to `$buildings` as well as `$buildingAndVariants`
|
||||
12. Done! Optional: Add a new reward for unlocking your building at some point.
|
||||
|
||||
#### Adding a new game system
|
||||
|
||||
1. Create the class in `src/js/game/systems/<system_name>.js`
|
||||
2. Derive it from `GameSystemWithFilter` if you want it to work on certain entities only which have the given components. Otherwise use `GameSystem` to do more generic stuff.
|
||||
3. Implement the `update()` method.
|
||||
4. Add the system in `src/js/game/game_system_manager.js` (To `this.systems` and also call `add` in the `internalInitSystems()` method)
|
||||
5. If your system should draw stuff, this is a bit more complicated. Have a look at existing systems on how they do it.
|
||||
|
||||
### Assets
|
||||
|
||||
For most assets I use Adobe Photoshop, you can find them in `assets/`.
|
||||
|
|
Reference in New Issue