This is the full documentation for the YORG.io 3 Codebase.
yarn install
git submodule update --init
We use gulp for almost everything. Here is what happens during the build / which steps are required:
We clear the build folder in case its there. Path: <root>/www
. It needs to be called like that because phonegap build / cordova expects it.
Atlas: Optimizes and copies the atlas
Sounds: Copies the optimized sounds. We do not optimize them in the CI, only on local builds. They are thus committed both raw and optimized into the repo.
UI Resources: Optimizes and copies the UI resources (=used by css exclusively)
Non-UI Resources: Optimizes and copies any non-UI resources (fonts + favicon)
CSS: Builds the stylesheet, this is the whole UI
Translations: Builds and generates the translation data
Javascript: Builds and optimizes the javascript code of the game
HTML: Builds the html, this generates the index.html
, which is the main entry point.
We use the GDX Texture Packer GUI to pack all non-ui game assets. There are seperate atlases, which are subject to change.
The atlases are built locally, however the generated PNG images are optimized during the build step. So we run GDX Texture Packer, but the CI still compresses the built images.
The atlases look like this:
combined: Contains the Map Resources, Buildings, Some icons, Particles, etc
sprites_lossless: Contains gradients and other sprites which must not get compressed lossly:
preview: Contains the first level sprite of every building + resources. Used within the UI:
streets: Contains the street rendering sprites since those are drawn to a seperate buffer and thus need different caching:
ui_sprites: Contains sprites which are required by the ingame ui, outside of the css:
When building the resources, the atlas is compressed lossly using imagemin
and pngquant
afterwards.
Additionally we also copy app/res/other
(to res/other
in the build folder) which contains sprites used for rendering, but only initially (E.g. the map background gets used once when loading the game, then never again - it would be a waste of space to have it in the atlas).
app/res_raw/atlas.tpproj
.app/res_raw/*
app/res/other
app/res_built/atlas
There are 2 categories: Music and SFX. Music is stored in app/res_raw/sounds/music
, and SFX is stored in app/res_raw/sounds/ui
and app/res_raw/sounds/game
.
We build the sounds locally with FFPMEG since the CI would take to long otherwise. You need ffmpeg.exe
on your path if you want to build them. There are two gulp tasks which take the sounds, strip any empty in the beginning and compress it down to a lower bitrate and monochannel.
The built sounds can be found at app/res_built/sounds
and will be copied to the final output dir.
We copy everything which matches (.png, .svg, .jpg) to the output folder. To reduce the bundle size, we compress it with gulp-imagemin and pngquant.
Files containing .lossless
(for example top_gradient.lossless.png
) will not compressed using lossy compression.
Source: app/res/ui
These are the fonts, and the favicon. They are copied 1:1.
Source: app/res/fonts
, app/res/favicon.ico
We build the CSS using SASS and postcss. The CSS documentation can be found in docs/CSS.md.
Source files: app/src/css
We use onesky to manage our translations. The project is hosted at translate.yorg.io.
The base strings are stored as YAML in app/src/translations/base
.
Because onesky can not handle YAML, the build process involves converting it into JSON. The task gulp buildTranslations
does this.
If you change any strings, make sure to upload app/src/translations/base.gen.json
to onesky. Thats the file generated by the task (Obviously run it before).
To update the translations, run gulp updateOnesky
. This will do the following:
app/src/translations/meta.gen.json
storing the available languagesapp/src/translations/data/<LANGUAGE>.js
. The file contains a string compressed with LZString so its smaller, and it will get loaded dynamically on application start.We build the JS using webpack.
Documentation: docs/JS.md
Source files: app/src/js
.
The html task does the following:
app/src/index.html
main.css?85235cd
<link rel="preload">
for all images (Atlas + UI)<link rel="prefetch">
for the APIapp/bundle-loader.js
which loads the right bundle depending on the supported features.Following typing errors appear quite often in the codebase since I always get them wrong as a non-native speaker. Hope you dont mind too much, at some point I'll do a simple string-replace of those.
recived
controll
(E.g. Controll Effects)ressources
unkown
There are some schemas in the game which need to be manually generated (Usually they open a new popup once the game is loaded if you set the debugflag to true, whose contents you then can copy).
For each savegame version there is a json schema generated and stored, as well as its corresponding interface.
You can generate a schema for the current game data by setting d.generateSavegameSchema = true
in the debugflags.
The server needs some basic knowledge about the game schema, which is why there is game_shared_data.json
. You can
regenerate it with d.generateMpSchema = true
.
gulp main.standalone.beta
app/tmp_standalone_files
Upload to steam using electron/steampipe/upload.bat
Prepare servers and api:
Push New Api
Push new game
main.deploy.beta
which will upload it to ftp