Browse Source

Build process of docs almost complete. Proofread and updated loads of converted docs.

Mikael Säker 8 năm trước cách đây
mục cha
commit
f68ca0685e
70 tập tin đã thay đổi với 1891 bổ sung1908 xóa
  1. 7 3
      docs/en/manuals/2dgraphics.md
  2. 7 3
      docs/en/manuals/3dgraphics.md
  3. 26 28
      docs/en/manuals/android.md
  4. 80 84
      docs/en/manuals/animation.md
  5. 7 5
      docs/en/manuals/application-lifecycle.md
  6. 31 32
      docs/en/manuals/bob.md
  7. 52 28
      docs/en/manuals/building-blocks.md
  8. 8 4
      docs/en/manuals/camera.md
  9. 7 5
      docs/en/manuals/clipping.md
  10. 14 11
      docs/en/manuals/collection-factory.md
  11. 17 21
      docs/en/manuals/collection-proxy.md
  12. 34 31
      docs/en/manuals/debugging.md
  13. 30 28
      docs/en/manuals/extensions.md
  14. 24 20
      docs/en/manuals/facebook.md
  15. 19 16
      docs/en/manuals/factory.md
  16. 8 21
      docs/en/manuals/font.md
  17. 7 4
      docs/en/manuals/gui-pie.md
  18. 11 10
      docs/en/manuals/gui-spine.md
  19. 3 4
      docs/en/manuals/gui-templates.md
  20. 14 14
      docs/en/manuals/gui-text.md
  21. 68 56
      docs/en/manuals/gui.md
  22. 8 6
      docs/en/manuals/html5.md
  23. 71 76
      docs/en/manuals/iap.md
  24. BIN
      docs/en/manuals/images/iap/android_purchase.png
  25. BIN
      docs/en/manuals/images/iap/ios_confirm_purchase.png
  26. BIN
      docs/en/manuals/images/iap/ios_purchase_done.png
  27. BIN
      docs/en/manuals/images/materials/materials_vertex_constants.png
  28. 0 0
      docs/en/manuals/images/test/large.png
  29. 0 0
      docs/en/manuals/images/test/medium.png
  30. 0 0
      docs/en/manuals/images/test/small.png
  31. BIN
      docs/en/manuals/images/test/tiny.png
  32. 123 129
      docs/en/manuals/input.md
  33. 56 112
      docs/en/manuals/introduction.md
  34. 22 32
      docs/en/manuals/ios.md
  35. 26 37
      docs/en/manuals/label.md
  36. 14 12
      docs/en/manuals/layouts.md
  37. 16 17
      docs/en/manuals/libraries.md
  38. 123 122
      docs/en/manuals/live-update.md
  39. 362 381
      docs/en/manuals/lua.md
  40. 38 45
      docs/en/manuals/material.md
  41. 150 161
      docs/en/manuals/message-passing.md
  42. 9 7
      docs/en/manuals/model.md
  43. 186 188
      docs/en/manuals/modules.md
  44. 120 96
      docs/en/manuals/particlefx.md
  45. 6 8
      docs/en/manuals/physics.md
  46. 7 4
      docs/en/manuals/test.md
  47. BIN
      docs/ko/manuals/images/introduction/introduction_atlas.png
  48. BIN
      docs/ko/manuals/images/introduction/introduction_blueprint.png
  49. BIN
      docs/ko/manuals/images/introduction/introduction_collaboration.png
  50. BIN
      docs/ko/manuals/images/introduction/introduction_collection.png
  51. BIN
      docs/ko/manuals/images/introduction/introduction_component.png
  52. BIN
      docs/ko/manuals/images/introduction/introduction_editor.png
  53. BIN
      docs/ko/manuals/images/introduction/introduction_factory.png
  54. BIN
      docs/ko/manuals/images/introduction/introduction_font.png
  55. BIN
      docs/ko/manuals/images/introduction/introduction_gui.png
  56. BIN
      docs/ko/manuals/images/introduction/introduction_input_binding.png
  57. BIN
      docs/ko/manuals/images/introduction/introduction_object_file.png
  58. BIN
      docs/ko/manuals/images/introduction/introduction_object_inplace.png
  59. BIN
      docs/ko/manuals/images/introduction/introduction_particlefx.png
  60. BIN
      docs/ko/manuals/images/introduction/introduction_particles.png
  61. BIN
      docs/ko/manuals/images/introduction/introduction_tilegrid.png
  62. BIN
      docs/ko/manuals/images/introduction/introduction_tilegrid_palette.png
  63. BIN
      docs/ko/manuals/images/introduction/introduction_tilemap.png
  64. BIN
      docs/ko/manuals/images/introduction/introduction_tilemap_palette.png
  65. BIN
      docs/ko/manuals/images/introduction/introduction_tilesource.png
  66. BIN
      docs/ko/manuals/images/introduction/introduction_tilesource_animation.png
  67. BIN
      docs/ko/manuals/images/introduction/introduction_tilesource_hull.png
  68. 32 32
      docs/ko/manuals/introduction.md
  69. 18 8
      docs/sass/defold-md.sass
  70. 30 7
      gulpfile.js

+ 7 - 3
docs/en/manuals/2dgraphics.md

@@ -1,7 +1,11 @@
-2D Graphics
-===========
+---
+title = Defold 2D graphics manual
+brief = This manual details Defold's support for 2D graphical elements like sprites and Spine models.
+---
 
-2D games are commonly built by many images that are presented as is (for backgrounds or sprites), used in _flip-book animation_ (for sprites), combined and rigged to create _Spine animation_ (for sprites) or mapped out into tilemaps and used for levels or backgrounds. This manual details Defold's support for these 2D graphical elements.
+# 2D Graphics
+
+2D games are commonly built by many images that are presented as is (for backgrounds or sprites), used in _flip-book animation_ (for sprites), combined and rigged to create _Spine animation_ (for sprites) or mapped out into tilemaps and used for levels or backgrounds. 
 
 For performance reasons, images are often combined into one or a few larger images, but the small original image can still be referenced as a sub-image on the larger one. Combining smaller images into larger is especially important on mobile devices where memory and processing power is more scarce than on desktop machines or dedicated game consoles.
 

+ 7 - 3
docs/en/manuals/3dgraphics.md

@@ -1,7 +1,11 @@
-3D graphics
-===========
+---
+title = Defold 3D graphics manual
+brief = This manual outlines the 3D support in Defold.
+---
 
-Defold is at its core a 3D engine. Even when you work with 2D material only all rendering is done in 3D, but ortographically projected onto the screen. This manual outlines the 3D support in Defold.
+# 3D graphics
+
+Defold is at its core a 3D engine. Even when you work with 2D material only all rendering is done in 3D, but ortographically projected onto the screen.
 
 Defold allows you to utilize full 3D content by including 3D assets, or _Models_ into your collections. You can build games in strictly 3D with only 3D assets, or you can mix 3D and 2D content as you wish.
 

+ 26 - 28
docs/en/manuals/android.md

@@ -1,5 +1,5 @@
 ---
-title: Defold development on the Android platform
+title: Defold development for the Android platform
 brief: This manual describes how to build and run Defold applications on Android devices
 ---
 
@@ -59,18 +59,18 @@ A stand-alone version of the Defold engine is available as a ready made *.apk* f
 
 * Visit http://d.defold.com where Defold downloads can be found.
 * Click on the version you want to download to expand a list of available engine builds.
-* Select "engine/armv7-android/dmengine.apk" for a debug enabled build for the Android platform (Armv7).
+* Select *engine/armv7-android/dmengine.apk* for a debug enabled build for the Android platform (Armv7).
 
 ![Download dmengine](images/android/download_dmengine.png)
 
 Download the file, then issue the following `adb` command from the location of the *.apk*:
 
-----
+```sh
 $ adb install dmengine.apk
 4445 KB/s (8706017 bytes in 1.912s)
 	pkg: /data/local/tmp/dmengine.apk
 Success
-----
+```
 
 The development "dmengine" app is now available on the device.
 
@@ -82,14 +82,14 @@ To launch your game on your Android device, the dmengine app and editor must be
 
 1. Make sure the editor is up and running.
 2. Launch the "dmengine" app on the Android device.
-3. Select your device under *Project > Targets* in the editor.
-4. Select *Project > Build And Launch* to run the game. It may take a while for the game to start since the game content is streamed to the device over the network.
+3. Select your device under <kbd>Project ▸ Targets</kbd> in the editor.
+4. Select <kbd>Project ▸ Build And Launch</kbd> to run the game. It may take a while for the game to start since the game content is streamed to the device over the network.
 
 While the game is running, you can use [hot reloading](/manuals/debugging#anchor-hr) as usual.
 
 ## Creating an Android application bundle
 
-The editor lets you easily create a stand alone application bundle for your game. Select *Project > Bundle... > Android Application...* from the menu.
+The editor lets you easily create a stand alone application bundle for your game. Select <kbd>Project ▸ Bundle... ▸ Android Application...</kbd> from the menu.
 
 ![Signing Android bundle](images/android/sign_bundle.png)
 
@@ -101,9 +101,9 @@ The editor writes an *.apk* file which is an Android application bundle. This fi
 
 ## Debugging an application bundle
 
-A bundle built with the debug mode version of the engine (i.e. "Release mode" unchecked during bundling) will send all its console output to the Android system log. Access the log with the `adb` tool and give the "logcat" command. You probably want to filter the output by a tag ("-s [tagname]"):
+A bundle built with the debug mode version of the engine (i.e. "Release mode" unchecked during bundling) will send all its console output to the Android system log. Access the log with the `adb` tool and give the `logcat` command. You probably want to filter the output by a tag (`-s [tagname]`):
 
-----
+```sh
 $ adb logcat -s "defold"
 --------- beginning of /dev/log/system
 --------- beginning of /dev/log/main
@@ -114,20 +114,20 @@ I/defold  ( 6210): INFO:ENGINE: Initialised sound device 'default'
 I/defold  ( 6210):
 D/defold  ( 6210): DEBUG:SCRIPT: Hello there, log!
 ...
-----
+```
 
 ## Creating certificates and keys
 
-You need the to create certificates in *pem*-format and keys in *pk8*-format. You can generate these with the `openssl` tool:
+You need the to create certificates in *.pem*-format and keys in *.pk8*-format. You can generate these with the `openssl` tool:
 
-----
+```sh
 $ openssl genrsa -out key.pem 1024
 $ openssl req -new -key key.pem -out request.pem
 $ openssl x509 -req -days 9999 -in request.pem -signkey key.pem -out certificate.pem
 $ openssl pkcs8 -topk8 -outform DER -in key.pem -inform PEM -out key.pk8 -nocrypt
-----
+```
 
-This will leave you with the files "certificate.pem" and "key.pk8" that you can use to sign your application bundles:
+This will leave you with the files *certificate.pem* and *key.pk8* that you can use to sign your application bundles:
 
 ![Signing Android bundle](images/android/sign_bundle2.png)
 
@@ -137,20 +137,18 @@ Make sure that you store your certificate and key safely. If you lose them you w
 
 ## Troubleshooting
 
-## Your device does not appear in the Targets menu
-
-Make sure that your device and computer are on the same wifi network. Also, the "dmengine" app needs to be of the same version as the editor. If you have upgraded the editor, you will need to download a new "dmengine.apk" and install it on your device.
-
-## I'm getting "Failure [INSTALL_PARSE_FAILED_INCONSISTENT_CERTIFICATES]" when installing
+Your device does not appear in the Targets menu
+: Make sure that your device and computer are on the same wifi network. Also, the *dmengine* app needs to be of the same version as the editor. If you have upgraded the editor, you will need to download a new *dmengine.apk* and install it on your device.
 
-Android detects that you try to install the app with a new certificate. When bundling debug builds, each build will be signed with a temporary certificate. Uninstall the old app before installing the new version:
+I'm getting "Failure [INSTALL_PARSE_FAILED_INCONSISTENT_CERTIFICATES]" when installing
+: Android detects that you try to install the app with a new certificate. When bundling debug builds, each build will be signed with a temporary certificate. Uninstall the old app before installing the new version:
 
-----
-$ adb uninstall com.defold.examples
-Success
-$ adb install Defold\ examples.apk
-4826 KB/s (18774344 bytes in 3.798s)
-	pkg: /data/local/tmp/Defold examples.apk
-Success
-----
+  ```sh
+  $ adb uninstall com.defold.examples
+  Success
+  $ adb install Defold\ examples.apk
+  4826 KB/s (18774344 bytes in 3.798s)
+  	pkg: /data/local/tmp/Defold examples.apk
+  Success
+  ```
 

+ 80 - 84
docs/en/manuals/animation.md

@@ -1,52 +1,51 @@
-Animation
-=========
+---
+title: Animation in Defold manual
+brief: This manual describes Defold's animation support.
+---
+
+# Animation
 
 Defold has built in support for many types of animation that you can use as a source of graphics for object components:
 
 Flip-book animation
 : A flip book animation consists of a series of still images that are shown in succession. The technique is very similar to traditional cell animation (see http://en.wikipedia.org/wiki/Traditional_animation). The technique offers limitless opportunities since each frame can be manipulated individually. However, since each frame is stored in a unique image, the memory footprint can be high. The smoothness of animation is also dependent on the number of images shown each second but increasing the number of images usually also increase the amount of work. Defold flip book animations are either stored as individual images added to an Atlas, or as a Tile Source with all frames laid out in a horizontal sequence.
 
-
-![Animation sheet](images/animation/animsheet.png)
-![Run loop](images/animation/runloop.gif)
+  ![Animation sheet](images/animation/animsheet.png){.inline}
+  ![Run loop](images/animation/runloop.gif){.inline}
 
 Spine animation
 : Spine animation provides 2D _skeletal animation_ support (see http://en.wikipedia.org/wiki/Skeletal_animation). This is a fundamentally different technique that is closer to cutout animation. In cutout animation separate pieces of the animated object (e.g body parts, eyes, mouth etc) are moved individually between each frame. Spine animation let you build an invisible, virtual skeleton consisting of a hierarchy of interconnected _bones_. This skeleton, or _rig_, is then animated and individual images are attached to the bones. Defold supports animations created or exported in the [Spine JSON format](http://esotericsoftware.com/spine-json-format). Skeletal animation is very smooth since the engine can interpolate the location of each bone for each frame.
 
+  For details on how to import Spine data into a Spine model for animation, see the [Spine documentation](/manuals/spine).
 
-For details on how to import Spine data into a Spine model for animation, see the [Spine documentation](/manuals/spine).
-
-![Spine animation](images/animation/spine_animation.png)
-![Run loop](images/animation/frog_runloop.gif)
+  ![Spine animation](images/animation/spine_animation.png){.inline}
+  ![Run loop](images/animation/frog_runloop.gif){.inline}
 
 3D skinned animation
 : Skeletal animation of 3D models is similar to Spine animation but works in 3D as opposed to 2D. The 3D model is not cut into separate parts and tied to a bone like in cutout animation. Instead, the bones apply deformation to vertices in the model and you have great control over how much a bone should affect the vertices.
 
+  For details on how to import 3D data into a Model for animation, see the [3D graphics documentation](/manuals/3dgraphics).
 
-For details on how to import 3D data into a Model for animation, see the [3D graphics documentation](/manuals/3dgraphics).
-
-![Blender animation](images/animation/blender_animation.png)
-![Wiggle loop](images/animation/wiggle.gif)
+  ![Blender animation](images/animation/blender_animation.png){.inline}
+  ![Wiggle loop](images/animation/wiggle.gif){.inline}
 
 Property animation
 : All numeric properties (numbers, vector3, vector4 and quaterions) can be animated in the built in animation system, using the function `go.animate()`. The engine will automatically "tween" properties for you according to given playback modes and easing functions. You can also specify custom easing functions.
 
-
-![Property animation](images/animation/property_animation.png)
-![Bounce loop](images/animation/bounce.gif)
+  ![Property animation](images/animation/property_animation.png){.inline}
+  ![Bounce loop](images/animation/bounce.gif){.inline}
 
 ## Playing flip-book animations
 
 Sprites and GUI box nodes can play flip-book animations and you have great control over them at runtime.
 
-*Sprites*
-: To run an animation during runtime you post `[play_animation](/ref/sprite#play_animation)` messages to the Sprite component you want to animate the texture on. 
+Sprites
+: To run an animation during runtime you post [`play_animation`](/ref/sprite#play_animation)messages to the Sprite component you want to animate the texture on. 
 
-As soon as an animation is finished playing, the engine sends back a `[animation_done](/ref/sprite#animation_done)` message to the script that sent the `play_animation` message.
-
-*GUI box nodes*
-: To run an animation during runtime you use the `[gui.play_flipbook()](/ref/gui#play_flipbook) function. See below for an example.
+  As soon as an animation is finished playing, the engine sends back a [`animation_done`](/ref/sprite#animation_done) message to the script that sent the `play_animation` message.
 
+GUI box nodes
+: To run an animation during runtime you use the [`gui.play_flipbook()`](/ref/gui#play_flipbook) function. See below for an example.
 
 ## Sprite example
 
@@ -64,7 +63,6 @@ Suppose that your game has a "dodge" feature that allows the player to press a s
 "stop_dodge"
 : A play-once transition animation taking the player character from dodging back to standing.
 
-
 The following script provides the logic:
 
 ```lua
@@ -112,11 +110,11 @@ function init(self)
 end
 ```
 
-An optional function that is called on completion can be provided. It will be called on animations that are played back in any of the ONCE_* modes.
+An optional function that is called on completion can be provided. It will be called on animations that are played back in any of the `ONCE_*` modes.
 
 ## Animating Spine models
 
-To run animations on your model, simply call the `[spine.play_anim()](/ref/spine#spine.play_anim)+ function:
+To run animations on your model, simply call the [`spine.play_anim()`](/ref/spine#spine.play_anim) function:
 
 ```lua
 local function anim_done(self)
@@ -133,7 +131,7 @@ end
 
 ![Spine model in game](images/animation/spine_model_ingame.png)
 
-If an animation is played with any of the *go.PLAYBACK_ONCE_* modes and you have provided a callback function to `spine.play_anim()` the callback is run on animation complete. See below for information on callbacks.
+If an animation is played with any of the `go.PLAYBACK_ONCE_*` modes and you have provided a callback function to `spine.play_anim()` the callback is run on animation complete. See below for information on callbacks.
 
 ## Cursor animation
 
@@ -160,7 +158,7 @@ The individual bones in the Spine skeleton are represented internally as game ob
 
 ![Spine model hierarchy](images/animation/spine_model_hierarchy.png)
 
-With the bone name at hand, you are able to retrieve the instance id of the bone in runtime. The function `[spine.get_go()](/ref/spine#spine.get_go)` returns the id of the specified bone and you can, for instance, child other game objects under the animated game object:
+With the bone name at hand, you are able to retrieve the instance id of the bone in runtime. The function [`spine.get_go()`](/ref/spine#spine.get_go) returns the id of the specified bone and you can, for instance, child other game objects under the animated game object:
 
 ```lua
 -- Attach pistol game object to the hand of the heroine
@@ -187,31 +185,29 @@ Float
 String
 : A string value.
 
-
 When the animation plays and events are encountered, `spine_event` messages are sent back to the script component that called `spine.play()`. The message data contains the custom numbers and strings embedded in the event, as well as a few additional fields that are sometimes useful:
 
-t
+`t`
 : The number of seconds passed since the first frame of the animation.
 
-animation_id
+`animation_id`
 : The animation name, hashed.
 
-string
+`string`
 : The provided string value, hashed.
 
-float
+`float`
 : The provided floating point numerical value.
 
-integer
+`integer`
 : The provided integer numerical value.
 
-event_id
+`event_id`
 : The event identifier, hashed.
 
-blend_weight
+`blend_weight`
 : How much of the animation is blended in at this point. 0 means that nothing of the current animation is part of the blend yet, 1 means that the blend consists of the current animation to 100%.
 
-
 ```lua
 -- Spine animation contains events that are used to play sounds in sync with the animation.
 -- These arrive here as messages.
@@ -227,7 +223,7 @@ end
 
 ## 3D Model animation
 
-Models are animated with the `[model.play_anim()](/ref/model#model.play_anim)` function:
+Models are animated with the [`model.play_anim()`](/ref/model#model.play_anim) function:
 
 ```lua
 function init(self)
@@ -250,7 +246,7 @@ The bones in the Model skeleton are represented internally as game objects. In t
 
 ![Model hierarchy](images/animation/model_hierarchy.png)
 
-You can retrieve the instance id of the bone game object in runtime. The function `[model.get_go()](/ref/model#model.get_go)` returns the id of the specified bone.
+You can retrieve the instance id of the bone game object in runtime. The function [`model.get_go()`](/ref/model#model.get_go) returns the id of the specified bone.
 
 ```lua
 -- Get the middle bone go of our wiggler model
@@ -261,7 +257,7 @@ local bone_go = model.get_go("#wiggler", "Bone_002")
 
 ## Cursor animation
 
-Just as Spine models, 3D models can be animated by manipulating the "cursor" property:
+Just as Spine models, 3D models can be animated by manipulating the `cursor` property:
 
 ```lua
 -- Set the animation on #model but don't start it
@@ -283,20 +279,20 @@ go.set(".", "position.y", 200)
 go.animate(".", "position.y", go.PLAYBACK_LOOP_PINGPONG, 100, go.EASING_OUTBOUNCE, 2)
 ```
 
-To stop all animations of a given property, call `go.cancel_animations()`, or for GUI nodes, `gui.cancel_animation()`.:
+To stop all animations of a given property, call `go.cancel_animations()`, or for GUI nodes, `gui.cancel_animation()`:
 
 ```lua
 -- Stop euler z rotation animation on the current game object
 go.cancel_animation(".", "euler.z")
 ```
 
-If you cancel the animation of a composite property, like "position", any animations of the sub-components ("position.x", "position.y" and "position.z") will be cancelled as well.
+If you cancel the animation of a composite property, like `position`, any animations of the sub-components (`position.x`, `position.y` and `position.z`) will be cancelled as well.
 
 The [Properties Manual](/manuals/properties) contains all the available properties on game objects, components and GUI nodes.
 
 ## GUI node property animation
 
-Almost all GUI node properties are possible to animate. You can, for instance, make a node invisible by setting its "color" property to full transparency and then fade it into view by animating the color to white (i.e. no tint color).
+Almost all GUI node properties are possible to animate. You can, for instance, make a node invisible by setting its `color` property to full transparency and then fade it into view by animating the color to white (i.e. no tint color).
 
 ```lua
 local node = gui.get_node("button")
@@ -339,51 +335,51 @@ The corresponding value to use when calling `go.animate()` are `go.EASING_LINEAR
 
 For `gui.animate()` the values are named `gui.EASING_LINEAR`, `gui.EASING_INBACK`, `gui.EASING_OUTBACK` and so forth.
 
-![Linear interpolation](images/properties/easing_linear.png)
-![In back](images/properties/easing_inback.png)
-![Out back](images/properties/easing_outback.png)
-![In-out back](images/properties/easing_inoutback.png)
-![Out-in back](images/properties/easing_outinback.png)
-![In bounce](images/properties/easing_inbounce.png)
-![Out bounce](images/properties/easing_outbounce.png)
-![In-out bounce](images/properties/easing_inoutbounce.png)
-![Out-in bounce](images/properties/easing_outinbounce.png)
-![In elastic](images/properties/easing_inelastic.png)
-![Out elastic](images/properties/easing_outelastic.png)
-![In-out elastic](images/properties/easing_inoutelastic.png)
-![Out-in elastic](images/properties/easing_outinelastic.png)
-![In sine](images/properties/easing_insine.png)
-![Out sine](images/properties/easing_outsine.png)
-![In-out sine](images/properties/easing_inoutsine.png)
-![Out-in sine](images/properties/easing_outinsine.png)
-![In exponential](images/properties/easing_inexpo.png)
-![Out exponential](images/properties/easing_outexpo.png)
-![In-out exponential](images/properties/easing_inoutexpo.png)
-![Out-in exponential](images/properties/easing_outinexpo.png)
-![In circlic](images/properties/easing_incirc.png)
-![Out circlic](images/properties/easing_outcirc.png)
-![In-out circlic](images/properties/easing_inoutcirc.png)
-![Out-in circlic](images/properties/easing_outincirc.png)
-![In quadratic](images/properties/easing_inquad.png)
-![Out quadratic](images/properties/easing_outquad.png)
-![In-out quadratic](images/properties/easing_inoutquad.png)
-![Out-in quadratic](images/properties/easing_outinquad.png)
-![In cubic](images/properties/easing_incubic.png)
-![Out cubic](images/properties/easing_outcubic.png)
-![In-out cubic](images/properties/easing_inoutcubic.png)
-![Out-in cubic](images/properties/easing_outincubic.png)
-![In quartic](images/properties/easing_inquart.png)
-![Out quartic](images/properties/easing_outquart.png)
-![In-out quartic](images/properties/easing_inoutquart.png)
-![Out-in quartic](images/properties/easing_outinquart.png)
-![In quintic](images/properties/easing_inquint.png)
-![Out quintic](images/properties/easing_outquint.png)
-![In-out quintic](images/properties/easing_inoutquint.png)
-![Out-in quintic](images/properties/easing_outinquint.png)
+![Linear interpolation](images/properties/easing_linear.png){.inline}
+![In back](images/properties/easing_inback.png){.inline}
+![Out back](images/properties/easing_outback.png){.inline}
+![In-out back](images/properties/easing_inoutback.png){.inline}
+![Out-in back](images/properties/easing_outinback.png){.inline}
+![In bounce](images/properties/easing_inbounce.png){.inline}
+![Out bounce](images/properties/easing_outbounce.png){.inline}
+![In-out bounce](images/properties/easing_inoutbounce.png){.inline}
+![Out-in bounce](images/properties/easing_outinbounce.png){.inline}
+![In elastic](images/properties/easing_inelastic.png){.inline}
+![Out elastic](images/properties/easing_outelastic.png){.inline}
+![In-out elastic](images/properties/easing_inoutelastic.png){.inline}
+![Out-in elastic](images/properties/easing_outinelastic.png){.inline}
+![In sine](images/properties/easing_insine.png){.inline}
+![Out sine](images/properties/easing_outsine.png){.inline}
+![In-out sine](images/properties/easing_inoutsine.png){.inline}
+![Out-in sine](images/properties/easing_outinsine.png){.inline}
+![In exponential](images/properties/easing_inexpo.png){.inline}
+![Out exponential](images/properties/easing_outexpo.png){.inline}
+![In-out exponential](images/properties/easing_inoutexpo.png){.inline}
+![Out-in exponential](images/properties/easing_outinexpo.png){.inline}
+![In circlic](images/properties/easing_incirc.png){.inline}
+![Out circlic](images/properties/easing_outcirc.png){.inline}
+![In-out circlic](images/properties/easing_inoutcirc.png){.inline}
+![Out-in circlic](images/properties/easing_outincirc.png){.inline}
+![In quadratic](images/properties/easing_inquad.png){.inline}
+![Out quadratic](images/properties/easing_outquad.png){.inline}
+![In-out quadratic](images/properties/easing_inoutquad.png){.inline}
+![Out-in quadratic](images/properties/easing_outinquad.png){.inline}
+![In cubic](images/properties/easing_incubic.png){.inline}
+![Out cubic](images/properties/easing_outcubic.png){.inline}
+![In-out cubic](images/properties/easing_inoutcubic.png){.inline}
+![Out-in cubic](images/properties/easing_outincubic.png){.inline}
+![In quartic](images/properties/easing_inquart.png){.inline}
+![Out quartic](images/properties/easing_outquart.png){.inline}
+![In-out quartic](images/properties/easing_inoutquart.png){.inline}
+![Out-in quartic](images/properties/easing_outinquart.png){.inline}
+![In quintic](images/properties/easing_inquint.png){.inline}
+![Out quintic](images/properties/easing_outquint.png){.inline}
+![In-out quintic](images/properties/easing_inoutquint.png){.inline}
+![Out-in quintic](images/properties/easing_outinquint.png){.inline}
 
 ## Custom easing
 
-You can create custom easing curves by defining a [type]#vector# with a set of values and then provide the vector instead of one of the predefined easing constants above:
+You can create custom easing curves by defining a `vector` with a set of values and then provide the vector instead of one of the predefined easing constants above:
 
 ```lua
 local values = { 0, 0, 0, 0, 0, 0, 0, 0,

+ 7 - 5
docs/en/manuals/application-lifecycle.md

@@ -1,9 +1,11 @@
-Application lifecycle
-=====================
+---
+title: Defold application lifecycle manual
+brief: This manual details the lifecycle of Defold games and applications.
+---
 
-This document details the lifecycle of Defold games and applications.
+# Application lifecycle
 
-The lifecycle of a Defold application or game is on the large scale very simple. The engine moves through three stages of execution: initialization, the update loop (where apps and games spend most of their time) and finalization.
+The lifecycle of a Defold application or game is on the large scale simple. The engine moves through three stages of execution: initialization, the update loop (where apps and games spend most of their time) and finalization.
 
 ![Lifecycle overview](images/application_lifecycle/application_lifecycle_overview.png)
 
@@ -98,7 +100,7 @@ The last steps in the update loop involves dispatching `@system` messages (`exit
 
 ## Frame rate and collection time step
 
-The number of frame updates per seconds (which equals the number of update-loop runs per second) can be set in the project settings, or programmatically by sending an "set_update_frequency" message to the `@system` socket. In addition, it is possible to set the _time step_ for collection proxies individually by sending a `set_time_step` message to the proxy. Changing a collection's time step does not affect the frame rate. It has an effect on the physics update time step as well as the "dt" variable passed to `update().` Also note that altering the time step does not alter the number of times `update()` will be called each frame---it is always exactly once.
+The number of frame updates per seconds (which equals the number of update-loop runs per second) can be set in the project settings, or programmatically by sending an `set_update_frequency` message to the `@system` socket. In addition, it is possible to set the _time step_ for collection proxies individually by sending a `set_time_step` message to the proxy. Changing a collection's time step does not affect the frame rate. It has an effect on the physics update time step as well as the `dt` variable passed to `update().` Also note that altering the time step does not alter the number of times `update()` will be called each frame---it is always exactly once.
 
 (See the [Collection proxy manual](/manuals/collection-proxy) and [`set_time_step`](/ref/collection-proxy#set_time_step) for details)
 

+ 31 - 32
docs/en/manuals/bob.md

@@ -1,21 +1,22 @@
-Bob the builder
-===============
-:location: documentation manuals project
-:type: manual
+---
+title: Defold project builder manual
+brief: Bob is a command line tool for building Defold projects. This manual explains how to use the tool.
 
-Bob is a tool for building Defold projects outside of the normal editor workflow. This manual explains how to use the tool.
+---
 
-## Overview
+# Bob the builder
 
-Bob is able to build data (corresponding to the build step of selecting the editor menu item menu:Project[Build And Launch]), create data archives and standalone, distributable application bundles (corresponding to the editor menu item menu:Project[Bundle > *] options)
+Bob is a command line tool for building Defold projects outside of the normal editor workflow.
 
-Bob is distributed as a Java _JAR_ archive containing everything needed to build. You find the latest "bob.jar" distribution at http://d.defold.com. Select a release, then download "bob/bob.jar". To run the Bob tool, you need Java 8 installed on your computer. You can download a version of Java from https://www.java.com.
+Bob is able to build data (corresponding to the build step of selecting the editor menu item <kbd>Project ▸ Build And Launch</kbd>), create data archives and standalone, distributable application bundles (corresponding to the editor menu item <kbd>Project ▸ Bundle ▸ ...</kbd> options)
+
+Bob is distributed as a Java _JAR_ archive containing everything needed to build. You find the latest *bob.jar* distribution at http://d.defold.com. Select a release, then download *bob/bob.jar*. To run the Bob tool, you need Java 8 installed on your computer. You can download a version of Java from https://www.java.com.
 
 ## Usage
 
-Bob is run from a shell or from the command line by invoking "java" (or "java.exe" on Windows) and providing the bob java archive as argument:
+Bob is run from a shell or from the command line by invoking `java` (or `java.exe` on Windows) and providing the bob java archive as argument:
 
-----
+```sh
 $ java -jar bob.jar --help
 usage: bob [options] [commands]
  -,--identity <arg>                  Sign identity (iOS)
@@ -44,62 +45,60 @@ usage: bob [options] [commands]
  -tp,--texture-profiles <arg>        Use texture profiles
  -u,--auth <arg>                     User auth token
  -v,--verbose                        Verbose output
-----
+```
 
 Available commands:
 
-clean
+`clean`
 : Delete built files in the build directory.
 
-distclean
+`distclean`
 : Delete all files in the build directory.
 
-build
+`build`
 : Builds all project data. Add the "--archive" option to build a data archive file ("game.darc" in the build directory).
 
-bundle
-: Creates a platform specific application bundle. Bundling requires that a built archive is present ("build" with the "--archive" option) and that a target platform is specified (with the "--platform" option). Bob creates the bundle in the output directory unless a different directory is specified with the "--bundle-output" option. The bundle is named according to the project name setting in "game.project".
+`bundle`
+: Creates a platform specific application bundle. Bundling requires that a built archive is present (`build` with the `--archive` option) and that a target platform is specified (with the `--platform` option). Bob creates the bundle in the output directory unless a different directory is specified with the `--bundle-output` option. The bundle is named according to the project name setting in *game.project*.
 
-resolve
+`resolve`
 : Resolve all external library dependencies.
 
-
 Available platforms:
 
-x86-darwin
+`x86-darwin`
 : Mac OSX
 
-x86_64-darwin
+`x86_64-darwin`
 : Mac OSX 64 bit
 
-x86-win32
+`x86-win32`
 : Windows
 
-x86-linux
+`x86-linux`
 : Linux
 
-armv7-darwin
+`armv7-darwin`
 : iOS
 
-armv7-android
+`armv7-android`
 : Android
 
-js-web
+`js-web`
 : HTML5
 
+By default, Bob looks in the current directory for a project to build. If you change the current dir to a Defold project and invoke bob, it builds the data for the project in the default output directory *build/default*.
 
-By default, Bob looks in the current directory for a project to build. If you change the current dir to a Defold project and invoke bob, it builds the data for the project in the default output directory "build/default".
-
-----
+```sh
 $ cd /Applications/Defold-beta/branches/14/4/main
 $ java -jar bob.jar
 100%
 $ 
-----
+```
 
-You can string commands together to perform a sequence of tasks in one go. The following example resolves libraries, wipes the build directory, builds archive data and bundles an OSX application (named "My Game.app"):
+You can string commands together to perform a sequence of tasks in one go. The following example resolves libraries, wipes the build directory, builds archive data and bundles an OSX application (named *My Game.app*):
 
-----
+```sh
 $ java -jar bob.jar --archive --platform x86-darwin resolve distclean build bundle
 100%
 $ ls -al build/default/
@@ -118,5 +117,5 @@ drwxr-xr-x   20 sicher  staff       680  1 Dec 10:15 logic
 drwxr-xr-x   27 sicher  staff       918  1 Dec 10:15 sound
 -rw-r--r--    1 sicher  staff    131926  1 Dec 10:15 state
 $
-----
+```
 

+ 52 - 28
docs/en/manuals/building-blocks.md

@@ -1,9 +1,9 @@
-= Building blocks
-:location: documentation manuals concepts
-:order: 2
-:type: manual
+---
+title: The building blocks of Defold
+brief: This manual digs into the details of how Game objects Components and Collections work.
+---
 
-This document digs into the details of how _Game objects_, _Components_ and _Collections_ work.
+#  Building blocks
 
 Some of the design decisions made in Defold differ from other software and it may take some time to get a good grip on how and why things are put together the way they are. In order to properly understand how Defold manages and gives you access to game resources, read this document and the [Message passing documentation](/manuals/message-passing). Some or many of the things here might be unfamiliar and hard to understand at first, but don't worry. Take your time, experiment with the editor and engine and return to the documentation when you run into problems.
 
@@ -26,7 +26,7 @@ When you create a game object _file_, you create a blueprint, or a prototype, fo
 
 ![Game object file](images/building_blocks/building_blocks_gameobject_file.png)
 
-Creating a game object file does not add anything to your running game. The game object does not exist yet, only the formula to create it. To add an actual game object based on the blueprint just created, you add an instance of the game object to a collection in your project by right clicking the collection and selecting *Add Game Object File*.
+Creating a game object file does not add anything to your running game. The game object does not exist yet, only the formula to create it. To add an actual game object based on the blueprint just created, you add an instance of the game object to a collection in your project by right clicking the collection and selecting <kbd>Add Game Object File</kbd>.
 
 ![Game object instance](images/building_blocks/building_blocks_gameobject_instance.png)
 
@@ -40,15 +40,15 @@ The nice thing with this model is that if you change the game object file you ar
 
 ## Childing game objects
 
-Let's now look at a case which might seem peculiar at first. Add an instance "my_gameobject" of the above prototype file to a collection, then create another game object called "heart" _in place_ (right click and select *Add Game Object*) with some component. Finally, make "heart" the child of "my_gameobject" by dragging it onto it. You now have a collection that looks like this:
+Let's now look at a case which might seem peculiar at first. Add an instance "my_gameobject" of the above prototype file to a collection, then create another game object called "heart" _in place_ (right click and select <kbd>Add Game Object</kbd>) with some component. Finally, make "heart" the child of "my_gameobject" by dragging it onto it. You now have a collection that looks like this:
 
 ![Game object instance with child](images/building_blocks/building_blocks_gameobject_instance_child.png)
 
 You might assume that by dragging the "heart" object onto "my_gameobject" you would change the file "my_gameobject.go", but that is not what happens. The effect of the operation is that the game object _instance_ "my_gameobject" gets a child attached to it. The game object instance has two separate properties for its prototype and its children. When you add children to a game object instance you add the object to the object's *children* property -- you don't touch the prototype.
 
-If you open the collection in the text editor by right clicking and selecting *Open With > Text Editor* you can inspect the game object data structure:
+If you open the collection in the text editor by right clicking and selecting <kbd>Open With ▸ Text Editor</kbd> you can inspect the game object data structure:
 
-----
+```txt
 name: "default"
 instances {
   id: "my_gameobject"
@@ -62,7 +62,7 @@ embedded_instances {
   data: "embedded_components {\n  id: \"sprite\"\n  type: \"sprite\"\n  data: \"tile_set: \\\"/cards_example/cards_sprites.atlas\\\"\\ndefault_animation: \\\"heart\\\"\\nmaterial: \\\"/builtins/materials/sprite.material\\\"\\nblend_mode: BLEND_MODE_ALPHA\\n\"\n  position {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n  }\n  rotation {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n    w: 1.0\n  }\n}\n"
   ...
 }
-----
+```
 
 You can see clearly that the game object instance has a property *prototype* that is set to the game object file. It has another property *children* that lists "heart" as its only child. The game object "heart" is different. Since it's an in_place game object not based on a prototype, it is listed under *embedded_instances* and all its data is stored right inside the collection file.
 
@@ -70,7 +70,11 @@ You can see clearly that the game object instance has a property *prototype* tha
 Apart from making a clear distinction between game object prototypes and instances when working with them in the editor, you should also take the time to carefully study how game objects are identified with a _fixed_ id in run time and how and why the id is unaffected by childing. The [Message passing documentation](/manuals/message-passing) explains this in detail.
 :::
 
-At this point you might ask yourself _"What if I create a game object file with a game object and a child, and then remove the child after having instanced the object in a collection?"_ The answer is simply that you can't. A game object file is a blueprint for a single game object. It only makes sense to add children to instances of game objects, either at build time in the editor by editing a collection--or at runtime via `msg.post("my_object", "set_parent",  { parent_id = go.get_id("my_parent") })`.
+At this point you might ask yourself _"What if I create a game object file with a game object and a child, and then remove the child after having instanced the object in a collection?"_ The answer is simply that you can't. A game object file is a blueprint for a single game object. It only makes sense to add children to instances of game objects, either at build time in the editor by editing a collection---or at runtime via:
+
+```lua
+msg.post("my_object", "set_parent", { parent_id = go.get_id("my_parent") })
+```
 
 ## Components
 
@@ -83,13 +87,13 @@ In either of these cases you create components of a specific type. Opening that
 
 In the previous section you saw how the editor stores embedded components in a game object though the *embedded_components* property. If we instead chose to instance the component from a file reference, the data looks like this:
 
-----
+```lua
 embedded_instances {
   id: "heart2"
   data: "components {\n  id: \"sprite\"\n  component: \"/a_simple_test/my_heart.sprite\"\n  position {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n  }\n  rotation {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n    w: 1.0\n  }\n}\n"
   ...
 }
-----
+```
 
 The component specific data are stored in the component file referenced via the *component* property.
 
@@ -124,24 +128,43 @@ A detailed explanation of how script properties work and how they can be used is
 
 ![Script properties](images/building_blocks/building_blocks_properties.png)
 
-----
-  component_properties {
-    id: "script"
-    properties {
-      id: "my_property"
-      value: "4712.0"
-      type: PROPERTY_TYPE_NUMBER
-    }
+```txt
+component_properties {
+  id: "script"
+  properties {
+    id: "my_property"
+    value: "4712.0"
+    type: PROPERTY_TYPE_NUMBER
   }
-----
+}
+```
 
 Conversely, in an embedded game object, any component properties are explicitly expressed as a *properties* property in the collection file:
 
 ![Embedded script properties](images/building_blocks/building_blocks_properties_embedded.png)
 
-----
-data: "components {\n  id: \"some_script\"\n  component: \"/a_simple_test/my_thing.script\"\n  position {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n  }\n  rotation {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n    w: 1.0\n  }\n  properties {\n    id: \"my_property\"\n    value: \"4713.0\"\n    type: PROPERTY_TYPE_NUMBER\n  }\n}\ncomponents {\n  id: \"sprite\"\n  component: \"/a_simple_test/my_heart.sprite\"\n  position {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n  }\n  rotation {\n    x: 0.0\n    y: 0.0\n    z: 0.0\n    w: 1.0\n  }\n}\n"
-----
+```txt
+data: "components {\n"
+"  id: \"some_script\"\n"
+"  component: \"/a_simple_test/my_thing.script\"\n"
+"  position {\n"
+"    x: 0.0\n"
+"    y: 0.0\n"
+"    z: 0.0\n"
+"  }\n"
+"  rotation {\n"
+"    x: 0.0\n"
+"    y: 0.0\n"
+"    z: 0.0\n"
+"    w: 1.0\n"
+"  }\n"
+"  properties {\n"
+"    id: \"my_property\"\n"
+"    value: \"4713.0\"\n"
+"    type: PROPERTY_TYPE_NUMBER\n"
+"  }\n"
+"}\n"
+```
 
 ## Collections
 
@@ -152,12 +175,13 @@ Collections are Defold's mechanism for creating templates, or what in other engi
 
 ![Collection instances](images/building_blocks/building_blocks_collection_instances.png)
 
-Collections that have been placed in the editor cannot be modified. You cannot, for instance, add children to game objects that are part of the placed collection. Why you can't do that becomes clear when you look at the data that is stored for the collection instance. The data for the containing game objects is inside the _referenced_ collection file "my_collection.collection" and that is not what you're editing.
+Collections that have been placed in the editor cannot be modified. You cannot, for instance, add children to game objects that are part of the placed collection. Why you can't do that becomes clear when you look at the data that is stored for the collection instance. The data for the containing game objects is inside the _referenced_ collection file *my_collection.collection* and that is not what you're editing.
 
 While you can't modify the contents of a collection instance without editing the source collection file, the editor allows modification of property values such as script properties that are associated with components in the collection.
 
 ![Properties in a collection](images/building_blocks/building_blocks_collection_properties.png)
-----
+
+```txt
 collection_instances {
   id: "my_collection"
   collection: "/a_simple_test/my_collection.collection"
@@ -185,7 +209,7 @@ collection_instances {
     }
   }
 }
-----
+```
 
 ::: important
 A common misunderstanding is that a game object's place in the collection hierarchy is connected to the runtime parent-child hierarchy (which is altered with the `set_parent` message). It is important to realize that they are two different things. Collections are a means of managing and grouping, whereas the parent-child hierarchy dynamically alters the scene graph which allows objects to be visually attached to each other. The place a game object has in the collection hierarchy dictates its id, but the id is static throughout the lifetime of the object. A thorough description on game object addressing can be found in the [Message passing documentation](/manuals/message-passing).

+ 8 - 4
docs/en/manuals/camera.md

@@ -1,9 +1,13 @@
-Cameras
-=======
+---
+title: Camera component manual
+brief: This manual describes the functionality of the Defold camera component.
+---
 
-Defold contains a primitive camera component. This manual describes its functionality and intended use.
+# Cameras
 
-A camera is a component type that you use to provide a view into your game world. Cameras are very simple objects that in essence does the following:
+A camera in Defold is a component that changes the viewport into the game world. By default, no camera is needed, but if your game requires scrolling through a level, Defold contains a primitive camera component that you use.
+
+Cameras are very simple objects that in essence does the following:
 
 1. They have a location in space---either 2D or 3D.
 2. They can be moved around in space---by moving the containing game object.

+ 7 - 5
docs/en/manuals/clipping.md

@@ -1,9 +1,11 @@
-Clipping
-========
-:location: documentation manuals gui
-:type: manual
+---
+title: GUI clipping manual
+brief: This manual describes how to create GUI nodes that mask other nodes through stencil clipping.
+---
 
-GUI nodes with textures or text add graphics to the GUI. However, sometimes it is convenient to be able to _mask_ what is being shown, to be able to _remove_ particular parts of the graphics from the screen. This manual explains how to achieve that. 
+# Clipping
+
+GUI nodes with textures or text add graphics to the GUI. However, sometimes it is convenient to be able to _mask_ what is being shown, to be able to _remove_ particular parts of the graphics from the screen.
 
 Say, for instance, that you want to create an on-screen HUD element containing a mini-map that the player can use to help orient herself in your game.
 

+ 14 - 11
docs/en/manuals/collection-factory.md

@@ -1,8 +1,11 @@
-= Collection factories
-:location: documentation manuals resources
-:type: manual
+---
+title: Collection factory manual
+brief: This manual explains how to use collection factory components to spawn hierarchies of game objects.
+---
 
-The collection factory component is used to spawn ready made blueprint hierarchies of game objects (collections) into a running game. This manual explains how collection factories work and how to use them.
+# Collection factories
+
+The collection factory component is used to spawn ready made blueprint hierarchies of game objects (collections) into a running game.
 
 Collections provide a powerful mechanism to create reusable templates, or "prefabs" in Defold. For an overview on Collections, see the [Building blocks documentation](/manuals/building-blocks#_collections). Collections can be placed in the editor and be cloned into the game at compile-time, and they can be dynamically inserted into your game in two ways:
 
@@ -12,13 +15,13 @@ Collections provide a powerful mechanism to create reusable templates, or "prefa
 
 ## Spawning a collection
 
-For the simple case, spawning a collection is performed exactly as when spawning a game object. Suppose we creating a planet sprite and want to spawn complex astronaut figures on the planet surface. We can then simply add a *Collection factory* to the "planet" gameobject and set "astronaut.collection" (supposing it exists) as the component's *prototype*:
+For the simple case, spawning a collection is performed exactly as when spawning a game object. Suppose we creating a planet sprite and want to spawn complex astronaut figures on the planet surface. We can then simply add a *Collection factory* to the "planet" gameobject and set *astronaut.collection* (supposing it exists) as the component's *prototype*:
 
 ![Collection factory](images/collection_factory/collection_factory_factory.png)
 
 Spawning an astronaut is now a matter of sending a message to the factory:
 
-```
+```lua
 local astro = collectionfactory.create("#factory", nil, nil, {}, nil)
 ```
 
@@ -26,9 +29,9 @@ The astronaut that is spawned is a tree of game objects, and we need to be able
 
 ![Collection to spawn](images/collection_factory/collection_factory_collection.png)
 
-The regular factory component returns an id to the spawned object. The collection factory returns a table that maps a hash of the collection-local id of each object to the runtime id of each object. A prefix "/collectionNN/" is added to the id to uniquely identify each instance:
+The regular factory component returns an id to the spawned object. The collection factory returns a table that maps a hash of the collection-local id of each object to the runtime id of each object. A prefix `/collection[N]/`, where `[N]` is a counter, is added to the id to uniquely identify each instance:
 
-```
+```lua
 pprint(astro)
 -- DEBUG:SCRIPT:
 -- {
@@ -44,7 +47,7 @@ Observe that the parent-child relations between "astronaut" and "probe" is not r
 
 When spawning a collection, we can pass property parameters to each game object by constructing a table with pairs of collection-local object id:s and tables of script properties to set:
 
-```
+```lua
 -- planet.script
 --
 local props = {}
@@ -55,9 +58,9 @@ local astro = collectionfactory.create("#factory", nil, nil, props, nil)
 ...
 ```
 
-Each spawned instance of "astronaut" gets its "size" property set to the passed value and each "probe" its "color" property:
+Each spawned instance of "astronaut" gets its `size` property set to the passed value and each "probe" its `color` property:
 
-```
+```lua
 -- probe.script
 --
 go.property("color", hash("blue"))

+ 17 - 21
docs/en/manuals/collection-proxy.md

@@ -1,21 +1,17 @@
-Collection Proxies
-==================
+---
+title: Collection proxy manual
+brief: This manual explains how to dynamically load and unload collections into a running game.
+---
 
-Defold organizes all game objects in collections. This manual explains how to dynamically load and unload collections into a running game.
+# Collection Proxies
 
-A collection can contain game objects and other collections (i.e. sub-collections). When Defold starts up it loads, initiates and enables a top level collection as defined in the project settings (see [Project settings](/manuals/project-settings)). Most templates have a preset "main.collection" that loads at startup.
+Defold organizes all game objects in collections. A collection can contain game objects and other collections (i.e. sub-collections). When Defold starts up it loads, initiates and enables a top level collection as defined in the project settings (see [Project settings](/manuals/project-settings)). Most templates have a preset *main.collection* that loads at startup.
 
-For many projects, containing the whole app in the top level collection is sufficient, but there are several cases (see below) where you will need a more powerful means of organizing your project: dynamically loading and unloading top level collections within your project.
+For many projects, containing the whole app in the top level collection is sufficient, but there are several cases where you will need a more powerful means of organizing your project, for instance:
 
-Collection proxies act as an outlet that serves on behalf of a collection file—you can communicate with a collection file that is not yet loaded by proxy.  You can tell it to load, initialize, enable, disable, finalize and unload.
-
-All communication with collection proxies regarding loading and unloading is done asynchronously: however, the actual loading and unloading is not implemented as a background process, so the engine will briefly pause when the actual loading and unloading happens.
-
-## Typical use cases
-
-Many games are separated into separate levels that are played one after the other. If your level content is manually built in the editor you will end up with a group of collections, each with a level inside (consisting of tilemaps, sprites etc). Collection proxies allow you to do this separation of content and then dynamically manage them through scripting.
-
-Possible uses of collection proxies are:
+::: sidenote
+Loading/unloading ("streaming") of regions in a seamless large world is possible to implement with collection proxies, but know that the actual loading is synchronous (meaning that they do not happen in the background, but pauses the game until loading is done) and can span over several frames. Therefore, you would want to keep the world pieces small or find a way to  hide the loading pauses somehow.
+:::
 
 * Loading/unloading of game levels.
 * Loading/unloading of front end GUI.
@@ -23,9 +19,9 @@ Possible uses of collection proxies are:
 * Loading/unloading of mini-games.
 * Loading/unloading of user selected content (music, background images etc)
 
-::: sidenote
-Loading/unloading ("streaming") of regions in a seamless large world is possible to implement with collection proxies, but know that the actual loading is synchronous (meaning that they do not happen in the background, but pauses the game until loading is done) and can span over several frames. Therefore, you would want to keep the world pieces small or find a way to  hide the loading pauses somehow.
-:::
+Collection proxies allow you to keep your content separated in collections and then dynamically manage the collections through scripting. A collection proxy component act as an outlet that serves on behalf of a collection file---you can communicate with a collection file that is not yet loaded, through the proxy. You can tell a collection proxy to load, initialize, enable, disable, finalize and unload the collection it is an outlet for.
+
+All communication with collection proxies regarding loading and unloading is done asynchronously: however, the actual loading and unloading is not implemented as a background process, so the engine will briefly pause when the actual loading and unloading happens.
 
 ## Worlds
 
@@ -270,7 +266,7 @@ function init(self)
 end
 ```
 
-Any object in either "world1" or "world2" (that is loaded) can now send "acquire_input_focus" and start receiving input actions. (For more information on input, see [Input](/manuals/input))
+Any object in either "world1" or "world2" (that is loaded) can now send `acquire_input_focus` and start receiving input actions. (For more information on input, see [Input](/manuals/input))
 
 ## Time step
 
@@ -280,9 +276,9 @@ Each collection proxy can individually control the update time step in relation
 msg.post("@system:", "set_update_frequency", { frequency = 60 } )
 ```
 
-Collection proxy updates can be scaled by altering the _time step_. This means that even though the game ticks at a steady 60 FPS, a proxy can update at a higher or lower pace, affecting physics and the "dt" variable passed to `update()`. You can also set the update mode, which allows you to control if the scaling should be performed discretely (which only makes sense with a scale factor below 1.0) or continuously.
+Collection proxy updates can be scaled by altering the _time step_. This means that even though the game ticks at a steady 60 FPS, a proxy can update at a higher or lower pace, affecting physics and the `dt` variable passed to `update()`. You can also set the update mode, which allows you to control if the scaling should be performed discretely (which only makes sense with a scale factor below 1.0) or continuously.
 
-You control the scale factor and the scaling mode by sending the proxy a "set_time_step" message:
+You control the scale factor and the scaling mode by sending the proxy a `set_time_step` message:
 
 ```lua
 -- update proxy collection at one-fifth-speed.
@@ -315,7 +311,7 @@ DEBUG:SCRIPT: update() with timestep (dt) 0
 DEBUG:SCRIPT: update() with timestep (dt) 0.016666667535901
 ```
 
-`update()` is still called 60 times a second, but the "dt" value changes. We see that only 1/5 (0.2) of the calls to `update()` will have a "dt" of 1/60 (corresponding to 60 FPS)---the rest is zero. All physics simulations will also be updated according to that dt and advance only in one fifth of the frames.
+`update()` is still called 60 times a second, but the value of `dt` changes. We see that only 1/5 (0.2) of the calls to `update()` will have a `dt` of 1/60 (corresponding to 60 FPS)---the rest is zero. All physics simulations will also be updated according to that dt and advance only in one fifth of the frames.
 
 See [`set_time_step`](/ref/collection-proxy#set_time_step) for more details.
 

+ 34 - 31
docs/en/manuals/debugging.md

@@ -1,9 +1,9 @@
-Debugging
-=========
-:location: documentation manuals logic
-:type: manual
+---
+title: Debugging in Defold
+brief: This manual explains the debugging facilities present in Defold.
+---
 
-This manual explains the debugging facilities present in Defold.
+# Debugging
 
 The simplest way to debug your game in Defold is to use [print debugging](http://en.wikipedia.org/wiki/Debugging#Techniques). The technique is simply to use `print()` or [pprint()](/ref/builtins#pprint) statements to watch variables or indicate the flow of execution. If a game object without a script acts weird, you can just attach a script to it with the sole purpose of debugging.
 
@@ -29,10 +29,10 @@ Download "ZeroBrane Studio" from http://studio.zerobrane.com
 
 ## ZeroBrane configuration
 
-In order for ZeroBrane to find the files in your project, you need to point it to the location of your Defold project directory. A convenient way of finding this out is by using the *Show in Finder/Explorer* option in your Defold project.
+In order for ZeroBrane to find the files in your project, you need to point it to the location of your Defold project directory. A convenient way of finding this out is by using the <kbd>Show in Finder/Explorer</kbd> option in your Defold project.
 
-1. Right click on "game.project"
-2. Choose *Show in Finder*, for OS X users, or *Show in Explorer* for Windows users
+1. Right click on *game.project*
+2. Choose <kbd>Show in Finder</kbd>, for OS X users, or *Show in Explorer* for Windows users
 
 OS X:
 
@@ -44,7 +44,7 @@ Windows:
 
 ## To set up ZeroBrane
 
-To set up ZeroBrane, select menu:Project[Project Directory > Choose...]:
+To set up ZeroBrane, select <kbd>Project ▸ Project Directory ▸ Choose...</kbd>:
 
 ![Auto completion](images/debugging/setup.png)
 
@@ -54,7 +54,7 @@ Other recommended, but not necessary configuration changes can be found further
 
 ## Starting the debugging server
 
-Before starting a debugging session, the ZeroBrane built-in debugging server needs to be started. The menu option for starting it can be found under the menu:Project menu. Just select menu:Project[Start Debugger Server]:
+Before starting a debugging session, the ZeroBrane built-in debugging server needs to be started. The menu option for starting it can be found under the <kbd>Project</kbd> menu. Just select <kbd>Project ▸ Start Debugger Server</kbd>:
 
 ![Auto completion](images/debugging/startdebug.png)
 
@@ -62,6 +62,12 @@ Before starting a debugging session, the ZeroBrane built-in debugging server nee
 
 Debugging can be started at any point in the lifetime of the Defold application, but needs to be actively initiated from Lua script. The Lua code to start a debugging session looks like this:
 
+::: sidenote
+If your game exits when `dbg.start()` is called, it might be because ZeroBrane has detected a problem and sends the exit command to the game. For some reason, ZeroBrane needs a file opened to start the debug session, otherwise it will output:
+"Can't start debugging without an opened file or with the current file not being saved 'untitled.lua')."
+In ZeroBrane, open the file you added `dbg.start()` to fix this error.
+:::
+
 ```lua
 local dbg = require "builtins.scripts.mobdebug"
 dbg.start()
@@ -69,20 +75,18 @@ dbg.start()
 
 By inserting the above code into the application, it will connect to ZeroBrane’s debugging server (through "localhost", by default) and pause at the next statement to be executed.
 
-::: sidenote
-If your game exits when `dbg.start()` is called, it might be because ZeroBrane has detected a problem and sends the exit command to the game. For some reason, ZeroBrane needs a file opened to start the debug session, otherwise it will output:
-"Can't start debugging without an opened file or with the current file not being saved ('untitled.lua')."
-In ZeroBrane, open the file you added `dbg.start()` to fix this error.
-:::
+```txt
+Debugger server started at localhost:8172.
+Mapped remote request for '/' to '/Users/my_user/Documents/Projects/Defold_project/'.
+Debugging session started in '/Users/my_user/Documents/Projects/Defold_project'.
+```
+
+Now it it possible to use the debugging features available in ZeroBrane; you can step, inspect, add and remove breakpoints etc.
 
 ::: sidenote
 The debugging will only be enabled for the lua context from where debugging is initiated. Enabling "shared_state" in game.project means you can debug all your application no matter where you started.
 :::
 
-Debugging session started in "<defold-dir>/branches/1610/1159/Main/".
-
-Now it it possible to use the debugging features available in ZeroBrane; you can step, inspect, add and remove breakpoints etc.
-
 ![Auto completion](images/debugging/code.png)
 
 Should the connection attempt fail (possibly because the debugging server is not running), your application will continue to run as normal after the connection attempt has been made.
@@ -108,21 +112,21 @@ First step is to access the editor configuration file. Recommended is to change
 
 - Select menu:Edit[Preferences > Settings: User]
 - Add the following to the configuration file:
-+
-----
-– to automatically open files requested during debugging

-editor.autoactivate = true
-----
+
+  ```txt
+  - to automatically open files requested during debugging
+  editor.autoactivate = true
+  ```
+
 - Restart ZeroBrane
 
 ![Other recommended settings](images/debugging/otherrecommended.png)
 
-[[anchor-hr]]
 ## Hot reloading
 
 Defold allows you to perform hot reloading of resources. When developing a game this feature helps speed up certain task enormously. It allows you to change scripts in a game while it is running live. Common use-cases is to tweak gameplay parameters or to perform debugging on a running game.
 
-To reload a changed resource, simply select the menu item menu:Edit[Reload Resource] or press the corresponding shortcut on the keyboard:
+To reload a changed resource, simply select the menu item <kbd>Edit ▸ Reload Resource</kbd> or press the corresponding shortcut on the keyboard:
 
 ![Reloading resources](images/debugging/debugging_hot_reload.png)
 
@@ -131,8 +135,7 @@ Every script component can define a `on_reload()` function. If it exists it will
 ```lua
 function on_reload(self)
     -- Print the current velocity
-	print(self.velocity)
-
+    print(self.velocity)
     -- Zero the velocity
     self.velocity = vmath.vector3()
 end
@@ -145,7 +148,7 @@ The Defold engine is also able to display profiling information in a running gam
 ```lua
 function on_reload(self)
     -- Turn on profiler on hot reload.
-	msg.post("@system:", "toggle_profile")
+    msg.post("@system:", "toggle_profile")
 end
 ```
 
@@ -160,9 +163,9 @@ While running the game, a web-based profiler can be accessed that provides detai
 To access the profiler:
 
 1. Start your game on your target device.
-2. Open a web browser and point it to \http://<device IP>:8002 where <device IP> is the IP address of the device.
+2. Open a web browser and point it to `http://<device IP>:8002` where `<device IP>` is the IP address of the device.
 
-If you are running your game on your desktop computer, _http://localhost:8002_ would bring up the profiler. You can find the IP numbers of your target devices in the menu:Project[Target] menu.
+If you are running your game on your desktop computer, _http://localhost:8002_ would bring up the profiler. You can find the IP numbers of your target devices in the <kbd>Project ▸ Target</kbd> menu.
 
 ![Web profiler](images/debugging/webprofiler_page.png)
 

+ 30 - 28
docs/en/manuals/extensions.md

@@ -1,7 +1,11 @@
-Native extensions
-=================
+---
+title: Writing native extensions for Defold
+brief: This manual explains how to write a native extensions for the Defold game engine and how to compile it through the zero setup cloud builders.
+---
 
-If you need custom interaction with external software or hardware on a low level where Lua won't suffice, the Defold SDK allows you to write extensions to the engine in the C`+ language. Typical use cases for native extensions are:
+# Native extensions
+
+If you need custom interaction with external software or hardware on a low level where Lua won't suffice, the Defold SDK allows you to write extensions to the engine in the C++ language. Typical use cases for native extensions are:
 
 - Interaction with specific hardware, for instance the camera on mobile phones.
 - Interaction with external low level API:s, for instance advertising network API:s that does not allow interaction through network API:s where Luasocket could be used.
@@ -9,7 +13,7 @@ If you need custom interaction with external software or hardware on a low level
 
 ## The build platform
 
-Defold provides a zero setup entry point to native extensions with a cloud based build solution. Any native extension that is developed and added to a game project becomes part of the ordinary project content. There is no need to build special versions of the engine and distribute to team members, that is handled automatically--any team member that builds and runs the project will get a project specific engine executable with all native extensions baked in.
+Defold provides a zero setup entry point to native extensions with a cloud based build solution. Any native extension that is developed and added to a game project becomes part of the ordinary project content. There is no need to build special versions of the engine and distribute to team members, that is handled automatically---any team member that builds and runs the project will get a project specific engine executable with all native extensions baked in.
 
 ![Cloud build](images/extensions/cloud_build.png)
 
@@ -19,47 +23,42 @@ To create a new extension, create a folder in the project root. This folder will
 
 ![Project layout](images/extensions/layout.png)
 
-"ext.manifest"
-: The extension folder _must_ contain an "ext.manifest" file. This file is a YAML format file that is picked up by the extension builder. A minimal manifest file should contain the name of the extension.
-
+*ext.manifest*
+: The extension folder _must_ contain an *ext.manifest* file. This file is a YAML format file that is picked up by the extension builder. A minimal manifest file should contain the name of the extension.
 
-src
+*src*
 : This folder should contain all source code files.
 
-
-include
+*include*
 : This optional folder contains any include files.
 
-
-lib
+*lib*
 : This optional folder contains any compiled libraries that the extension depends on. Library files should be placed in subfolders named by `platform`, or `architecure-platform`, depending on what architectures are supported by your libraries. Supported platforms are `ios`, `android+ and `osx`. Supported `arc-platform` pairs are `armv7-ios`, `arm64-ios`, `armv7-android` and `x86_64-osx`.
 
-
-res
+*res*
 : This optional folder contains any extra resources that the extension depends on. Resource files should be placed in subfolders named by `platform`, or `architecure-platform` just as the "lib" subfolders. A subfolder `common` is also allowed, containing resource files common for all platforms.
 
 
 ## A simple example extension
 
-Let's build a very simple extension. First, we create a new root folder "myextension" and add a file "ext.manifest" containing the name of the extension:
+Let's build a very simple extension. First, we create a new root folder *myextension* and add a file *ext.manifest* containing the name of the extension:
 
 ![Manifest](images/extensions/manifest.png)
 
-.ext.manifest
 ```yaml
 name: "MyExtension"
 ```
 
-The extension consists of a single C`+ file, "myextension.cpp" that is created in the "src" folder.
+The extension consists of a single C++ file, *myextension.cpp* that is created in the "src" folder.
 
-The Defold editor will not open `.cpp+ files by default so if you double click the file the system editor set for that file type is used. You can use the built in text editor by right-clicking the file and selecting "Open With > Text Editor". Note that Defold has no support for C`+ files so the editing experience is minimal.
+The Defold editor will not open *.cpp* files by default so if you double click the file the system editor set for that file type is used. You can use the built in text editor by right-clicking the file and selecting <kbd>Open With ▸ Text Editor</kbd>. Note that Defold has no support for C++ files so the editing experience is minimal.
 
-![C`+ file](images/extensions/cppfile.png)
+![C++ file](images/extensions/cppfile.png)
 
 The extension source file contains the following code:
 
-.myextension.cpp
 ```cpp
+// myextension.cpp
 // Extension lib defines
 #define LIB_NAME "MyExtension"
 #define MODULE_NAME "myextension"
@@ -155,9 +154,9 @@ dmExtension::Result FinalizeMyExtension(dmExtension::Params* params)
 DM_DECLARE_EXTENSION(MyExtension, LIB_NAME, AppInitializeMyExtension, AppFinalizeMyExtension, InitializeMyExtension, 0, 0, FinalizeMyExtension)
 ```
 
-Note the macro `DM_DECLARE_EXTENSION` that is used to declare the various entry points into the extension code. For this simple example, there is no need for any "update" or "on_event" entry points, so +0+ is provided in those locations to the macro.
+Note the macro `DM_DECLARE_EXTENSION` that is used to declare the various entry points into the extension code. For this simple example, there is no need for any "update" or "on_event" entry points, so `0` is provided in those locations to the macro.
 
-Now it is just a matter of building the project ("Project > Build and Launch"). This will upload the extension to the extension builder which will produce a custom engine with the new extension included. If the builder encounters any errors, a dialog with the build errors will show.
+Now it is just a matter of building the project (<kbd>Project ▸ Build and Launch</kbd>). This will upload the extension to the extension builder which will produce a custom engine with the new extension included. If the builder encounters any errors, a dialog with the build errors will show.
 
 To test the extension, create a game object and add a script component with some test code:
 
@@ -173,7 +172,6 @@ And that's it! We have created a fully working native extension.
 
 Apart from the name of the extension, the manifest file can contain platform specific compile flags, link flags, libs and frameworks. Here is an example:
 
-.ext.manifest
 ```yaml
 name: "AdExtension"
 
@@ -195,10 +193,14 @@ platforms:
 
 ## Known issues
 
-The native extension feature is in an alpha state, meaning that not all features are in place yet.
+The native extension feature is in an alpha state, meaning that that the API:s can still change. Furthermore, not all features are in place yet.
+
+Platforms
+: We currently only support building extensions for: macOS, iOS and Android. Android lacks support for *.java* and *.jar* archives
+
+Editor
+: The editor integration. There is no build process indication. Error reporting is rudimentary.
 
-- Platforms: We currently only support building extensions for: macOS, iOS and Android
-- Android lacks support for .java and .jar archives
-- Editor: The editor integration. There is no build process indication. Error reporting is rudimentary.
-- Debugging: Currently, when building on iOS, the .dSYM files are not included in the build result
+Debugging
+: Currently, when building on iOS, the *.dSYM* files are not included in the build result
 

+ 24 - 20
docs/en/manuals/facebook.md

@@ -1,5 +1,9 @@
-Facebook
-========
+---
+title: Defold Facebook manual
+brief: This manual explains how to setup and integrate Facebook functionality in a Defold game.
+---
+
+# Facebook
 
 The Facebook APIs allows you to interact with Facebook's game connectivity features in a uniform way for games on iOS, Android and HTML5.
 
@@ -29,7 +33,7 @@ The next step is to create a Facebook application. The <kbd>My Apps</kbd> menu i
 You are presented with a selection of target platforms. Click *basic setup* to skip the wizards.
 
 ::: sidenote
-Most information provided through the wizards are irrelevant when developing on Defold. In particular, you usually don't need to edit "Info.plist" or "AndroidManifest.xml" yourself. Defold does that work for you.
+Most information provided through the wizards are irrelevant when developing on Defold. In particular, you usually don't need to edit *Info.plist* or *AndroidManifest.xml* yourself. Defold does that work for you.
 :::
 
 ![Add new app platform](images/facebook/add_new_app_platform.png)
@@ -40,7 +44,7 @@ You can easily add, remove and change platform settings in the app dashboard. Yo
 
 ![App dashboard settings](images/facebook/add_platform.png)
 
-Click the *Settings* tab. Notice the numerical *App ID*. That identifier needs to go into the [project settings](/manuals/project-settings) of your Defold game. Unfortunately this setting is hidden in the editor (this will change soon), but you easily add it. Right-click the "game.project" file in the *Project Explorer" and select "Open With > Text Editor".
+Click the *Settings* tab. Notice the numerical *App ID*. That identifier needs to go into the [project settings](/manuals/project-settings) of your Defold game. Unfortunately this setting is hidden in the editor (this will change soon), but you easily add it. Right-click the *game.project* file in the *Project Explorer* and select <kbd>Open With ▸ Text Editor</kbd>.
 
 ![Open project settings with](images/facebook/project_open_with.png)
 
@@ -54,17 +58,17 @@ Now, back in the *Settings* tab on the Facebook app page, click *+ Add Platform*
 
 ## iOS
 
-For iOS you need to specify the game's *bundle_identifier* as specified in "game.project".
+For iOS you need to specify the game's `bundle_identifier` as specified in *game.project*.
 
 ![iOS settings](images/facebook/settings_ios.png)
 
 ## Android
 
-For Android you need to specify *Google Play Package Name*, which is the game's *package* identifier specified in "game.project". You should also generate hashes of the certificate(s) you use and enter them into the *Key Hashes* field. You can generate a hash from a "certificate.pem" with openssl:
+For Android you need to specify *Google Play Package Name*, which is the game's *package* identifier specified in *game.project*. You should also generate hashes of the certificate(s) you use and enter them into the *Key Hashes* field. You can generate a hash from a *certificate.pem* with openssl:
 
-----
+```sh
 $ cat certificate.pem | openssl x509 -outform der | openssl sha1 -binary | openssl base64
-----
+```
 
 (See [Creating certificates and keys](/manuals/android/#_creating_certificates_and_keys) in the Android manual for details how to create your own signing files)
 
@@ -77,14 +81,14 @@ For HTML5 games, the process is a bit different. Facebook needs access to your g
 ![Facebook Canvas settings](images/facebook/settings_canvas.png)
 
 1. Use Facebook's *Simple Application Hosting*. Click *Yes* to select managed hosting. Select *uploaded assets* to open the hosted asset manager.
-+
-![Simple hosting](images/facebook/simple_hosting.png)
-+
-Select that you want to host a "HTML5 Bundle":
-+
-![HTML5 bundle](images/facebook/html5_bundle.png)
-+
-Compress your HTML5 bundle into a .7z or .zip archive and upload it to Facebook. Make sure to click *Push to production* to start serving the game.
+
+    ![Simple hosting](images/facebook/simple_hosting.png)
+    
+    Select that you want to host a "HTML5 Bundle":
+    
+    ![HTML5 bundle](images/facebook/html5_bundle.png)
+    
+    Compress your HTML5 bundle into a .7z or .zip archive and upload it to Facebook. Make sure to click *Push to production* to start serving the game.
 
 2. The alternative to Facebook hosting is to upload a HTML5 bundle of your game to some server of your choice that serves the game through HTTPS. Set the *Secure Canvas URL* to the URL of your game.
 
@@ -96,7 +100,7 @@ The following basic test can be used to see if things are set up properly.
 
 1. Create a new game object and attach a script component with a new script file to it.
 2. Enter the following code in the script file:
-+
+
 ```lua
 local function get_me_callback(self, id, response)
     -- The response table includes all the response data
@@ -129,7 +133,7 @@ end
 
 Running this simple test should display something like the following in the console:
 
-----
+```txt
 DEBUG:SCRIPT: 
 {
   status = 200,
@@ -150,12 +154,12 @@ DEBUG:SCRIPT:
   }
   response = {"name":"Max de Fold ","id":"14159265358979323"},
 }
-----
+```
 
 * The full Defold Facebook APIs are documented in the [Facebook reference documentation](/ref/facebook).
 * The Facebook Graph API is documented here: https://developers.facebook.com/docs/graph-api
 
 ## Development caveats
 
-When developing it is very convenient to use the dev application. Unfortunately, the Facebook API does not yet work on the dev app due to how the bundled "Info.plist" file has to be constructed. However, any debug bundle works as a dev app so the workaround is to build the game with the proper Facebook project settings, put it on the device and then connect to the running game and stream data to it from the editor as usual.
+When developing it is very convenient to use the dev application. Unfortunately, the Facebook API does not yet work on the dev app due to how the bundled *Info.plist* file has to be constructed. However, any debug bundle works as a dev app so the workaround is to build the game with the proper Facebook project settings, put it on the device and then connect to the running game and stream data to it from the editor as usual.
 

+ 19 - 16
docs/en/manuals/factory.md

@@ -1,5 +1,9 @@
-Factory components
-==================
+---
+title: Factory component manual
+brief: This manual explains how to use factory components to dynamically spawn game objects at runtime.
+---
+
+# Factory components
 
 Factory components are used to dynamically spawn game objects from a pool of objects into the running game.
 
@@ -11,8 +15,8 @@ When you add a factory component to a game object you specify in the *Prototype*
 
 To trigger the creation of a game object, call `factory.create()`:
 
-.factory.script
 ```lua
+-- factory.script
 local p = go.get_position()
 p.y = vmath.lerp(math.random(), min_y, max_y)
 local component = "#star_factory"
@@ -23,26 +27,25 @@ factory.create(component, p)
 
 `factory.create()` takes 5 parameters:
 
-url
+`url`
 : The id of the factory component that should spawn a new game object.
 
-[position]
+`[position]`
 : (optional) The world position of the new game object. This should be a `vector3`. If you do not specify a position, the game object is spawned at the position of the factory component.
 
-[rotation]
+`[rotation]`
 : (optional) The world rotation of the new game object. This should be a `quat`.
 
-[properties]
+`[properties]`
 : (optiona) A Lua table with any script property values to initiate the game object with. See the [Script property manual](/manuals/script-properties) for information on script properties.
 
-[scale]
+`[scale]`
 : (optional) The scale of the spawned game object. The scale can be expressed as a `number` (greater than 0) which specifies uniform scaling along all axis. You can also provide a `vector3` where each component specifies scaling along the corresponding axis.
 
-
 For example:
 
-.factory.script
 ```lua
+-- factory.script
 local p = go.get_position()
 p.y = vmath.lerp(math.random(), min_y, max_y)
 local component = "#star_factory"
@@ -73,8 +76,8 @@ function on_message(self, message_id, message, sender)
     end
 end
 ```
-<1> The "score" script property is defined with a default value.
-<2> Reference the "score" script property as a value stored in "self".
+1. The "score" script property is defined with a default value.
+2. Reference the "score" script property as a value stored in "self".
 
 ![Spawned game object with property and scaling](images/factory/factory_spawned2.png)
 
@@ -86,8 +89,8 @@ Defold does not currently support non uniform scaling of collision shapes. If yo
 
 When you call `factory.create()` you get back the id of the new game object, allowing you to store the id for future reference. One common use is to spawn objects and add their id:s to a table so you can delete them all at a later point, for instance when resetting a level layout:
 
-.spawner.script
 ```lua
+-- spawner.script
 self.spawned_coins = {}
 
 ...
@@ -99,8 +102,8 @@ table.insert(self.spawned_coins, id)
 
 And then later:
 
-.coin.script
 ```lua
+-- coin.script
 -- Delete all spawned coins.
 for _, coin_id = ipairs(self.spawned_coins) do
     go.delete(coin_id)
@@ -112,8 +115,8 @@ go.delete_all(self.spawned_coins)
 
 It is also common that you want the spawned object to be aware of the game object that spawned it. One case would be a some type of autonomous object that can be spawned only one at a time. The spawned object then needs to inform the spawner when it is deleted or inactivated so another one can be spawned:
 
-.spawner.script
 ```lua
+-- spawner.script
 -- Spawn a drone and set its parent to the url of this script component
 self.spawned_drone = factory.create("#dronefactory", drone_position, nil, { parent = msg.url() })
 
@@ -128,8 +131,8 @@ end
 
 And the spawned object's logic:
 
-.drone.script
 ```lua
+-- drone.script
 go.property("parent", msg.url())
 
 ...

+ 8 - 21
docs/en/manuals/font.md

@@ -1,9 +1,11 @@
-Font files
-==========
+---
+title: Fonts in Defold manual
+brief: This manual describes how Defold handles fonts and how to bring fonts onto the screen in your games.
+---
 
-Fonts are used to render label components and text nodes in GUI scenes. This manual describes how Defold handles fonts and how to bring fonts onto the screen in your games.
+# Font files
 
-Font files in TrueType, OpenType or BMFont format can be added to your project and be automatically into a graphical format that Defold can render. Two font rendering techniques are available, bitmap and distance field, each with its specific benefits and drawbacks.
+Fonts are used to render label components and text nodes in GUI scenes. Defold supports font files in TrueType, OpenType or BMFont format thad can be added to your project and automatically converted into a graphical format that Defold can render. Two font rendering techniques are available, bitmap and distance field, each with its specific benefits and drawbacks.
 
 ## Creating a font
 
@@ -20,51 +22,39 @@ Shadow rendering of fonts is currently disabled by default because of performanc
 *font*
 : In the font editor, set this property to the imported TTF, OTF or *.fnt* file (you can click the *...* button to browse for the file). The editor will immediately create the font data and show a preview in the font editor.
 
-
 *material*
 : The material to use when rendering this font. Make sure to change this if you are creating a distance field font or a BMFont (see below for more on these).
 
-
 *size*
 : The target size of the glyphs in pixels.
 
-
 *antialias*
 : If the font should be antialiased when baked onto the target bitmap. Set to 0 if you want pixel perfect font rendering.
 
-
 *alpha*
 : The value of the alpha channel. 0.0--1.0 where 0.0 means transparent and 1.0 opaque.
 
-
 *outline_alpha*
 : The value of the alpha channel for the generated outline. 0.0--1.0.
 
-
 *outline_width*
 : The width of the generated outline in pixels. Set to 0 for no outline.
 
-
 *shadow_alpha*
 : The value of the alpha channel for the generated shadow. 0.0--1.0.
 
-
 *shadow_blur*
 : The blur radius in pixels for the generated shadow.
 
-
 *shadow_x*
 : The horizontal offset of the generated shadow.
 
-
 *shadow_y*
 : The vertical offset of the generated shadow.
 
-
 *extra_characters*
 : By default the font will include the ASCII printable characters (character codes 32-126). To manually include additional characters, list them in this property field.
 
-
 *output_format*
 : This property controls the type of font that is generated.
 
@@ -74,15 +64,12 @@ Shadow rendering of fonts is currently disabled by default because of performanc
 *all_chars*
 : If you set this property to `true` all glyphs available in the source file are included in the output.
 
-
 *cache_width*
 : Set this to constrain the width of the glyph cache bitmap. When the engine renders text, it looks on the cache bitmap for a glyph. If it does not exist there it will be added to the cache before rendering. If the cache bitmap is too small to contain the glyphs the engine is asked to render, an error (`ERROR:RENDER: Out of available cache cells! Consider increasing cache_width or cache_height for the font.`) is signalled. If this value is 0 then the cache size is automatically.
 
-
 *cache_height*
 : Set this to constrain the height of the glyph cache bitmap. If this value is 0 then the cache size is automatically.
 
-
 ::: sidenote
 The ASCII printable characters are:
 space ! " # $ % & ' ( ) * + , - . / 0 1 2 3 4 5 6 7 8 9 : ; < = > ? @ A B C D E F G H I J K L M N O P Q R S T U V W X Y Z [ \ ] ^ _ ` a b c d e f g h i j k l m n o p q r s t u v w x y z { | } ~
@@ -94,7 +81,7 @@ In addition to generated bitmaps Defold supports prebaked bitmap "BMFont" format
 
 These types of fonts provide no performance improvement from bitmap fonts generated from TrueType or OpenType font files, but can include arbitrary graphics, coloring and shadows right in the image.
 
-Add the generated *.fnt* and *.png* files to your Defold project. These files should reside in the same folder. Create a new font file and set the *font* property to the *.fnt* file. Make sure that *output_format* is set to "TYPE_BITMAP". Defold will not generate a bitmap but use the one provided in the PNG.
+Add the generated *.fnt* and *.png* files to your Defold project. These files should reside in the same folder. Create a new font file and set the *font* property to the *.fnt* file. Make sure that *output_format* is set to `TYPE_BITMAP`. Defold will not generate a bitmap but use the one provided in the PNG.
 
 ::: sidenote
 To create a BMFont, you need to use a tool that can generate the appropriate files. Several options exist:
@@ -114,7 +101,7 @@ To create a distance field font, simply select `TYPE_DISTANCE_FIELD` as *output_
 
 ![Distance field font](images/font/fonts_distance_field.png)
 
-Make sure to change the *material* property of the font to "builtins/fonts/font-df.material" (or any other material that can handle the distance field data) when you create the font--or the font will not use the correct shader when it is rendered to screen.
+Make sure to change the *material* property of the font to *builtins/fonts/font-df.material* (or any other material that can handle the distance field data) when you create the font--or the font will not use the correct shader when it is rendered to screen.
 
 ![Distance field font material](images/font/fonts_distance_field_material.png)
 

+ 7 - 4
docs/en/manuals/gui-pie.md

@@ -1,5 +1,9 @@
-Pie nodes
-=========
+---
+titel: Defold GUI pie nodes
+brief: This manual explains how to use pie nodes in Defold GUI scenes.
+---
+
+# GUI pie nodes
 
 Pie nodes can be used to create circular or ellipsoid objects. In its simplest form, a pie node is simply a circle or ellipse inscribed in the node bounding box. If the width and height is identical, the circle's diameter will be that value. If the width and height differ, the node is instead an ellipse with the node width being the horizontal extent of the ellipse and the height being the vertical extent. The texture set for the node is applied straight, with the corners of the texture correlating to the corners of the node bounding box.
 
@@ -13,7 +17,7 @@ Inner radius
 : The inner radius of the node, expressed along the X axis.
 
 Outer bounds
-: Extend the node to the outer radius ("Ellipse") or to the node's bounding box ("Rectangle").
+: Extend the node to the outer radius (`Ellipse`) or to the node's bounding box (`Rectangle`).
 
 Perimeter vertices
 : The number of segments that will be used to build the shape, expressed as the number of vertices required to fully circumscribe the 360 degree perimeter of the node.
@@ -21,7 +25,6 @@ Perimeter vertices
 Pie fill angle
 : How much of the pie should be filled. Expressed as an counter-clockwise angle starting from the right.
 
-
 ![Radius and angle](images/gui/gui_pie_radius_angle.png)
 
 The *Outer bounds* extend the shape to the node bounding box. Together with an *Inner radius* and/or a *Pie fill angle*, some pretty complex shapes can be created.

+ 11 - 10
docs/en/manuals/gui-spine.md

@@ -1,5 +1,9 @@
-GUI Spine nodes
-===============
+---
+titel: Defold GUI Spine nodes
+brief: This manual explains how to use bone animated Spine nodes in Defold GUI scenes.
+---
+
+# GUI Spine nodes
 
 Spine bone animations are available in GUI animations as well as in game objects. This manual explains how to use imported Spine animation data in GUI scenes.
 
@@ -9,31 +13,28 @@ Currently, Spine nodes do not support Spine events. For game objects with *Spine
 
 Any imported Spine bone animation is available in GUI scenes as well as in game objects (through the *SpineModel* component). In order to work with Spine bone animations in Defold, you first have to import the animation data and set up a Spine Scene resource. The [Spine animation](/manuals/spine) documentation describes how to do that.
 
-To make the contents of a Spine Scene resource available in a GUI scene, add it to the scene by right-clicking the *Spine Scenes* section of the scene in the *Outline* and select menu:Add Spine Scene[]. Choose the Spine Scene you wish to use in the scene.
+To make the contents of a Spine Scene resource available in a GUI scene, add it to the scene by right-clicking the *Spine Scenes* section of the scene in the *Outline* and select <kbd>Add Spine Scene</kbd>. Choose the Spine Scene you wish to use in the scene.
 
 ![Add Spine Scene](images/gui/gui_spine_add_scene.png)
 
 ![Added Spine Scene](images/gui/gui_spine_added_scene.png)
 
-Now, if you create a Spine node (right click in the *Nodes* section of the *Outline* and select menu:Add Spine Node[]) you are able to set the properties of the new Spine node accordingly:
+Now, if you create a Spine node (right click in the *Nodes* section of the *Outline* and select <kbd>Add Spine Node</kbd>) you are able to set the properties of the new Spine node accordingly:
 
 ![Spine node](images/gui/gui_spine_node.png)
 
 Spine Scene
 : The Spine Scene to use as a data source for this node.
 
-
 Spine Default Animation
 : The animation to automatically start playing when the scene is initialized.
 
-
 Skin
 : The skin to use for the animation when the scene is initialized.
 
-
 ## Runtime animation control
 
-Spine nodes can be controlled in runtime through script. To start an animation on a node, simply call the `[gui.play_spine()](/ref/gui#gui.play_spine)` function:
+Spine nodes can be controlled in runtime through script. To start an animation on a node, simply call the [`gui.play_spine()`](/ref/gui#gui.play_spine) function:
 
 ```lua
 local catnode = gui.get_node("cat_note")
@@ -49,7 +50,7 @@ The individual bones in the Spine skeleton exist as GUI nodes. The nodes are nam
 
 ![Spine bone names](images/gui/gui_spine_bones.png)
 
-To, for instance, attach another node to an existing bone node, fetch the bone node by name with the `[gui.get_spine_bone()](/ref/gui#gui.get_spine_bone)` and attach the child:
+To, for instance, attach another node to an existing bone node, fetch the bone node by name with the [`gui.get_spine_bone()`](/ref/gui#gui.get_spine_bone) and attach the child:
 
 ```lua
 -- Attach a text node to the tail of the cat
@@ -59,7 +60,7 @@ local tail = gui.get_spine_bone(cat, "tail")
 gui.set_parent(textnode, tail)
 ```
 
-All bones are also accessible through `[go.get_node()](/ref/gui#gui.get_node)`, by the bone name prefixed by the name of the name of the Spine node and a slash "/":
+All bones are also accessible through [`go.get_node()`](/ref/gui#gui.get_node), by the bone name prefixed by the name of the name of the Spine node and a slash (`/`):
 
 ```lua
 -- Attach a text node to the tail of the cat

+ 3 - 4
docs/en/manuals/gui-templates.md

@@ -3,8 +3,7 @@ title: GUI templates manual
 brief: This manual explains the Defold GUI template system that is used to create reusable visual GUI components based on shared templates or 'prefabs'.
 ---
 
-Templates
-=========
+# GUI templates
 
 GUI templates provide a simple but powerful mechanism to create reusable visual GUI components based on shared templates or "prefabs". This manual explains the feature and how to use it.
 
@@ -16,11 +15,11 @@ Since a GUI template is a plain GUI scene, there's nothing special about how the
 
 ![Button template](images/gui-templates/gui-templates-button.png)
 
-Now we can add any number of instances of the button to another GUI scene. Create or open a new scene and select menu:Gui[Add Template Node], alternatively right-click *Nodes* in the *Outline* and select *Add Templat* from the drop-down.
+Now we can add any number of instances of the button to another GUI scene. Create or open a new scene and select <kbd>Gui ▸ Add Template Node</kbd>, alternatively right-click *Nodes* in the *Outline* and select <kbd>Add Template</kbd> from the drop-down.
 
 ![Add template](images/gui-templates/gui-templates-add-template.png)
 
-Select the GUI scene file to use as template, in this case "button.gui". You can add any number of nodes, each an instance based on the same template. If we change the template, each instance updates immediately in the editor, reflecting the changes. Notice that all nodes present in the template node is accessible in the *Outline* view. Nodes under a template node are automatically named with a prefix "[template node id]/".
+Select the GUI scene file to use as template, in this case *button.gui*. You can add any number of nodes, each an instance based on the same template. If we change the template, each instance updates immediately in the editor, reflecting the changes. Notice that all nodes present in the template node is accessible in the *Outline* view. Nodes under a template node are automatically named with a prefix "[template node id]/".
 
 ![Node instances](images/gui-templates/gui-templates-instances.png)
 

+ 14 - 14
docs/en/manuals/gui-text.md

@@ -1,11 +1,15 @@
-GUI text nodes
-==============
+---
+title: Defold GUI text nodes
+brief: This manual describes how to add text to GUI scenes.
+---
 
-Fonts are used to render text nodes in GUI scenes. This manual describes how to bring text into GUI scenes.
+# GUI text nodes
+
+Defold supports a specific type of GUI node that allows text to be rendered in a GUI scene. Any font resource added to a project can be used for text node rendering.
 
 ## Adding text nodes
 
-The fonts that you wish to use in GUI text nodes must be added to the GUI component. Either right-click the *Fonts* folder, use the *GUI* top menu or press the corresponding keyboard shortcut.
+The fonts that you wish to use in GUI text nodes must be added to the GUI component. Either right-click the *Fonts* folder, use the <kbd>GUI</kbd> top menu or press the corresponding keyboard shortcut.
 
 ![Fonts](images/gui-text/fonts.png)
 
@@ -14,28 +18,24 @@ Text nodes have a set of special properties:
 *Font*
 : Any text node you create must have the *Font* property set.
 
-
 *Text*
 : This property contains the text displayed.
 
-
 *Line Break*
 : Text alignment follows the pivot setting and setting the this property allows the text to flow over several lines. The width of the node determines where the text will wrap.
 
-
 ## Alignment
 
 By setting the node pivot you can change the adjust mode for the text.
 
 *Center*
-: If the pivot is set to "Center", "North" or "South", the text is center-aligned.
+: If the pivot is set to `Center`, `North` or `South`, the text is center-aligned.
 
 *Left*
-: If the pivot is set to any of the "West" modes, the text is left-aligned.
+: If the pivot is set to any of the `West` modes, the text is left-aligned.
 
 *Right*
-: If the pivot is set to any of the "East" modes, the text is right-aligned.
-
+: If the pivot is set to any of the `East` modes, the text is right-aligned.
 
 ![Text alignment](images/gui-text/align.png)
 
@@ -43,9 +43,9 @@ By setting the node pivot you can change the adjust mode for the text.
 
 Text nodes respond to any generic node manipulation functions for setting size, pivot, color and so forth. A few text node only functions exist:
 
-* To change the font of a text node, use the `[gui.set_font()](/ref/gui/#gui.set_font)` function.
-* To change the line break behavior of a text node, use the `[gui.set_line_break()](/ref/gui/#gui.set_line_break)` function.
-* To change the content of a text node, use the `[gui.set_text()](/ref/gui/#gui.set_text)` function.
+* To change the font of a text node, use the [`gui.set_font()`](/ref/gui/#gui.set_font) function.
+* To change the line break behavior of a text node, use the [`gui.set_line_break()`](/ref/gui/#gui.set_line_break) function.
+* To change the content of a text node, use the [`gui.set_text()`](/ref/gui/#gui.set_text) function.
 
 ```lua
 function on_message(self, message_id, message, sender)

+ 68 - 56
docs/en/manuals/gui.md

@@ -1,9 +1,11 @@
-GUI
-===
-:location: documentation manuals gui
-:type: manual
+---
+title: GUI scenes in Defold
+brief: This manual goes through the Defold GUI editor, the various types of GUI nodes and GUI scripting.
+---
 
-Defold provides you with a custom GUI editor and powerful scripting possibilities that are tailor made for the construction and implementation of user interfaces. This manual goes through those features.
+# GUI
+
+Defold provides you with a custom GUI editor and powerful scripting possibilities that are tailor made for the construction and implementation of user interfaces. 
 
 A graphical user interface in Defold is a game object component that you build and attach to a game object and place in a collection. This component has the following properties:
 
@@ -30,13 +32,13 @@ A GUI component is built from a set of nodes. A node is a visual object that is
 
 Nodes are simple and don’t contain any logic. They can be translated (moved) and ordered in parent-child hierarchies either in the editor or at runtime through scripting. 
 You have direct access to all nodes in your GUI component from the script code.
-Nodes can be animated with script (see <<anchor-a, Property animation>> below) and animation can be run on nodes (flipbook animations on Box nodes and bone animations on Spine nodes).
+Nodes can be animated with script (see [Property animation](#_property_animation) below) and animation can be run on nodes (flipbook animations on Box nodes and bone animations on Spine nodes).
 
-Add nodes by right-clicking on the "Nodes" folder and selecting either "Add Box", "Add Text", "Add Pie", "Add Template" or "Add Spine Node".
+Add nodes by right-clicking on the *Nodes* folder and selecting either <kbd>Add Box</kbd>, <kbd>Add Text</kbd>, <kbd>Add Pie</kbd>, <kbd>Add Template</kbd> or <kbd>Add Spine Node</kbd>.
 
 ![Add nodes](images/gui/gui_add_nodes.png)
 
-You can also use the GUI top menu, or the keyboard shortcuts ‘I’ and ‘O’ for box and text nodes.
+You can also use the GUI top menu, or the keyboard shortcuts <kbd>I</kbd> and <kbd>O</kbd> for box and text nodes.
 Placed nodes are moved and rotated in the same way game objects are translated in the collection editor.
 
 ## Node properties
@@ -53,11 +55,11 @@ Each node has an extensive set of properties that control its appearance:
 
 These properties can be modified in the editor's properties tab (except index and parenting), or through script (see [GUI API reference](/ref/gui)).
 
-Each of these properties can also be animated in script (see <<anchor-a, Property animation>> below).
+Each of these properties can also be animated in script (see [Property animation](#_property_animation) below).
 
 ## Textures and flip book animations
 
-You can use images and animations from texture atlases or tile sources as part of your GUI interface component. To do so, an image resource (atlas or tile source) must first be added, then all images and animations included in the resource can be applied to GUI nodes. You add textures either by right clicking the "Textures" folder, through the "GUI" top menu, or with keyboard shortcuts.
+You can use images and animations from texture atlases or tile sources as part of your GUI interface component. To do so, an image resource (atlas or tile source) must first be added, then all images and animations included in the resource can be applied to GUI nodes. You add textures either by right clicking the *Textures* folder, through the <kbd>GUI</kbd> top menu, or with keyboard shortcuts.
 
 Textures that has been added to the GUI can be applied to box and pie nodes.
 
@@ -70,10 +72,9 @@ Note that the color of the box node will tint the animation. The tint color is m
 ![Tinted texture](images/gui/gui_tinted_texture.png)
 
 ::: sidenote
-Box nodes are always rendered, even if they do not have a texture assigned to them, got an alpha set to 0 or are sized 0, 0, 0. Box nodes should always have a texture assigned to the. If you need an empty node, set its size to 0, 0, 0 and make sure to assign a texture to it.
+Box nodes are always rendered, even if they do not have a texture assigned to them, got an alpha set to `0` or are sized `0,0,0`. Box nodes should always have a texture assigned to the. If you need an empty node, set its size to `0,0,0` and make sure to assign a texture to it.
 :::
 
-[[anchor-slice9]]
 ## Slice-9 texturing
 
 Many GUIs and HUDs feature elements that are context sensitive in regards to their size. Panels and dialogs often need to be resized to fit the containing content and that will cause problems as soon as you apply texturing to the scaled node. Let's say that you want to use a large set of buttons where the width is determined by the amount of text you write on the button. Making a box node, applying a texture and then scale it will result in deformation:
@@ -104,9 +105,7 @@ It might also be tempting to use a 1 pixel wide bottom or top edge segment to sa
 
 ## Index: rendering order
 
-All nodes are rendered in the order they are listed under the "Nodes" folder. The node on top of the list is drawn first and will appear behind any other node. The last node in the list is drawn last, meaning it will appear in front of all other nodes. Drag nodes in the list to change their index order.
-
-You can also change and group the ordering of nodes with layers (see below).
+All nodes are rendered in the order they are listed under the "Nodes" folder. The node on top of the list is drawn first and will appear behind any other node. The last node in the list is drawn last, meaning it will appear in front of all other nodes. Drag nodes in the list to change their index order. You can also change and group the ordering of nodes with layers (see below).
 
 If you set the Z-value on a node the draw order will not change. The Z-values on nodes are ignored.
 
@@ -149,9 +148,9 @@ When the rendering pipeline walks through the list of nodes, it is forced to set
 
 We can do better, though. By carefully assigning layers to our nodes, we can render our buttons much more efficiently. For this example we create three layers:
 
-   . Shadow
-   . Button
-   . Text
+- Shadow
+- Button
+- Text
 
 We assign the nodes to the corresponding layer and make sure the layers are placed in correct render order in the Layers-list:
 
@@ -159,12 +158,12 @@ We assign the nodes to the corresponding layer and make sure the layers are plac
 
 Since the layer drawing order takes precedence over the regular node order the nodes are now drawn in the following order:
 
-   . play_block_shadow
-   . quit_block_shadow
-   . play_block
-   . quit_block
-   . play
-   . quit
+1. "play_block_shadow"
+2. "quit_block_shadow"
+3. "play_block"
+4. "quit_block"
+5. "play"
+6. "quit"
 
 The nodes that share atlas, blend mode or font now sit adjacent to each other and the rendering pipeline can batch these nodes into three batches instead of six. A 50% performance win.
 
@@ -172,7 +171,7 @@ Now, imagine that we scale our little example up and expand the GUI to 10 button
 
 ## Script
 
-To control the logic of your GUI and animate nodes you use Lua scripts. GUI scripts work the same as regular game object scripts, but are saved as a different file type and have access to a different set of functions: all in the "gui" module.
+To control the logic of your GUI and animate nodes you use Lua scripts. GUI scripts work the same as regular game object scripts, but are saved as a different file type and have access to a different set of functions: all in the `gui` module.
 
 You create a GUI Script File in your project and attach it to the GUI component by selecting the root GUI component in the outline view and then choosing a script file in the properties view.
 
@@ -182,22 +181,35 @@ The script file is by default equipped with functions just as game object script
 
 ```lua
 function init(self)
+   -- Add initialization code here
+   -- Remove this function if not needed
 end
 
 function final(self)
+   -- Add finalization code here
+   -- Remove this function if not needed
 end
 
 function update(self, dt)
+   -- Add update code here
+   -- Remove this function if not needed
 end
 
 function on_message(self, message_id, message, sender)
+   -- Add message-handling code here
+   -- Remove this function if not needed
 end
 
 function on_input(self, action_id, action)
+   -- Add input-handling code here
+   -- Remove this function if not needed
 end
 
 function on_reload(self)
+   -- Add input-handling code here
+   -- Remove this function if not needed
 end
+
 ```
 
 GUI components can thus receive input and messages just as game objects. You send messages to a GUI component by addressing the component in the fragment part of the URL:
@@ -211,7 +223,7 @@ msg.post("hud#gui", "set_stats", msgdata)
 
 GUI components are rendered separately and on top of other game content and there are some mechanisms in place to make life easier for game developers that target device that have screens of different resolutions and aspect ratios.
 
-Your Defold game project specifies a target resolution in the "game project" settings, however one or more of your target devices might have a different screen resolution and aspect ratio. In this case this means that your game will be up- or downscaled to fit the target screen.
+Your Defold game project specifies a target resolution in the *game project* settings, however one or more of your target devices might have a different screen resolution and aspect ratio. In this case this means that your game will be up- or downscaled to fit the target screen.
 
 Defold deals with the scaling of any GUI components differently to other game content. It also provides you with a set of simple, but powerful tools to lay out your user interface independently of resolution and/or aspect ratio.
 
@@ -231,14 +243,19 @@ You can easily simulate changes to the screen resolution and aspect ratio by cha
 
 When the window is resized and the resolution and aspect ratio is changed, all nodes are reshaped and adjusted according to how their Adjust Mode property is set. This property can be either of the following three settings:
 
-   . Fit. This is the default. The node is uniformly scaled proportionally against what would be the resized node's bounding box width or height, whichever is smallest.
-   . Zoom. The node is uniformly scaled proportionally against what would be the resized node's bounding box width or height, whichever is largest.
-   . Stretch. The node is reshaped proportionally.
+`Fit`
+: This is the default. The node is uniformly scaled proportionally against what would be the resized node's bounding box width or height, whichever is smallest.
+
+`Zoom`
+: The node is uniformly scaled proportionally against what would be the resized node's bounding box width or height, whichever is largest.
+
+`Stretch`
+: The node is reshaped proportionally.
 
 It’s perhaps easiest to understand the adjust modes by looking at the following example that contains a GUI component with a couple of nodes:
 
-- A background box node that has a grid texture for reference. This node has *Adjust Mode* set to "Stretch".
-- Three 256x256 pixel box nodes with a square Defold logo texture. One each with *Adjust Mode* "Fit", "Zoom" and "Stretch".
+- A background box node that has a grid texture for reference. This node has *Adjust Mode* set to `Stretch`.
+- Three 256x256 pixel box nodes with a square Defold logo texture. One each with *Adjust Mode* `Fit`, `Zoom` and `Stretch`.
 
 ![Adjust mode](images/gui/gui_adjust.png)
 
@@ -246,7 +263,7 @@ Now let’s see what happens to the box nodes when the window is resized:
 
 ![Resized window](images/gui/gui_adjust_resize.png)
 
-The "Stretch" node is just deformed to the new shape whereas the "Fit" and "Zoom" nodes keep their aspect ratio. The "Fit" node is fit inside the would-be reshaped bounding box (the grid square that it's in) and the "Zoom" node covers the would-be reshaped bounding box.
+The `Stretch` node is just deformed to the new shape whereas the `Fit` and `Zoom` nodes keep their aspect ratio. The `Fit` node is fit inside the would-be reshaped bounding box (the grid square that it's in) and the `Zoom` node covers the would-be reshaped bounding box.
 
 Text nodes behave in exactly the same way. The adjust mode applies to the invisible text bounding box that controls the shape of the text.
 
@@ -273,32 +290,32 @@ Similarly, if the window is shrunk and gets relatively narrower, the added heigh
 
 By setting the Xanchor and/or the Yanchor properties you can lock the position of nodes relative to the edges of the _would-be reshaped bounding box_.
 
-   * Xanchor set to "Left" will lock the horizontal position of the node against the left edge of the box.
-   * Xanchor set to "Right" will lock the horizontal position of the node against the right edge of the box.
-   * Yanchor set to "Top" will lock the vertical position of the node against the top edge of the box.
-   * Yanchor set to "Bottom" will lock the vertical position of the node against the bottom edge of the box.
+   * Xanchor set to `Left` will lock the horizontal position of the node against the left edge of the box.
+   * Xanchor set to `Right` will lock the horizontal position of the node against the right edge of the box.
+   * Yanchor set to `Top` will lock the vertical position of the node against the top edge of the box.
+   * Yanchor set to `Bottom` will lock the vertical position of the node against the bottom edge of the box.
 
-In practice this means that if you set the Xanchor property to "Right" and the Yanchor property to "Top", the node will keep its position relative to the top right corner of its reshaped box. The distance to the right edge and the top edge will be kept constant. However, the default *Pivot* is "Center" which keeps the center point. Often you want to anchor against an edge and then you should adjust the *Pivot* accordingly.
+In practice this means that if you set the Xanchor property to `Right` and the Yanchor property to `Top`, the node will keep its position relative to the top right corner of its reshaped box. The distance to the right edge and the top edge will be kept constant. However, the default *Pivot* is `Center` which keeps the center point. Often you want to anchor against an edge and then you should adjust the *Pivot* accordingly.
 
 ![Anchor top right](images/gui/gui_anchor_topright.png)
 
-This example shows a node that has "Top" and "Right" anchoring. It is "Fit" adjusted and has *Pivot* set to "North East". When the window stretch, the node is fit inside the "would-be" reshaped box (the blue dotted rectangle) and also anchored.
+This example shows a node that has `Top` and `Right` anchoring. It is `Fit` adjusted and has *Pivot* set to `North East`. When the window stretch, the node is fit inside the "would-be" reshaped box (the blue dotted rectangle) and also anchored.
 
 ## Pivot
 
 Each node has a position, scale and rotation inside the GUI coordinate system. A node is placed on that position so that its pivot is at the set coordinate and any rotation is done around that same pivot. For text nodes the text will be aligned according to the pivot setting.
 
-The default positioning and rotation of nodes happen against the center of the node—it has the *Pivot* property set to "Center". You can change the pivot of a node to any of one of the following settings:
+The default positioning and rotation of nodes happen against the center of the node—it has the *Pivot* property set to `Center`. You can change the pivot of a node to any of one of the following settings:
 
-* Center
-* North, South, East, West
-* North West, North East, South West, South East
+* `Center`
+* `North`, `South`, `East`, `West`
+* `North` West, `North East`, `South West`, `South East`
 
 The following image illustrates the position of each pivot setting:
 
 ![Pivot points](images/gui/pivot_points.png)
 
-If you change the pivot of a node, the node will be moved so that the new pivot will be at the given position. Text nodes are aligned so that "Center" sets the text center-aligned, "West" sets the text left-aligned and "East" sets the text right-aligned.
+If you change the pivot of a node, the node will be moved so that the new pivot will be at the given position. Text nodes are aligned so that `Center` sets the text center-aligned, `West` sets the text left-aligned and `East` sets the text right-aligned.
 
 ## GUI scripts
 
@@ -364,38 +381,33 @@ local new_textnode = gui.new_text_node(vmath.vector3(100, 100, 0), "Hello!")
 -- to do gui.get_node() when we already have the reference.
 ```
 
-[[anchor-a]]
 ## Property animation
 
 Several of the node properties can be fully asynchronously animated. To animate a property, you use the `gui.animate()` function and supply the following parameters:
 
-----
-gui.animate(node, property, to, easing, duration [,delay] [,complete_function] [,playback])
-----
+`gui.animate(node, property, to, easing, duration [,delay] [,complete_function] [,playback])`
 
 ::: sidenote
-See [go.animate()](/ref/go#go.animate) for details on the parameters.
+See [`go.animate()`](/ref/go#go.animate) for details on the parameters.
 :::
 
-The "property" parameter is usually given as a constant (`gui.PROP_POSITION` etc), but can also be supplied as described in the Properties guide (see [Properties](/manuals/properties)). This is handy if you want to animate just a specific component of a compound property value.
+The `property` parameter is usually given as a constant (`gui.PROP_POSITION` etc), but can also be supplied as described in the Properties guide (see [Properties](/manuals/properties)). This is handy if you want to animate just a specific component of a compound property value.
 
-For instance, the "color" property describes a, RGBA value, encoded in a vector4 value with one component for each color component red, green and blue, and the last one for alpha. The vector components are named respectively "x", "y", "z" and "w" and the alpha is thus in the "w" component.
+For instance, the `color` property describes a, RGBA value, encoded in a vector4 value with one component for each color component red, green and blue, and the last one for alpha. The vector components are named respectively `x`, `y`, `z` and `w` and the alpha is thus in the `w` component.
 
 To fade up and down the alpha value of a node we can do that with the following piece of code:
 
 ```lua
 function fadeup(self, node)
-        gui.animate(node, "color.w", 1.0, gui.EASING_LINEAR,
-0.3, 0, fadedown, gui.PLAYBACK_ONCE_FORWARD)
+   gui.animate(node, "color.w", 1.0, gui.EASING_LINEAR, 0.3, 0, fadedown, gui.PLAYBACK_ONCE_FORWARD)
 end
 
 function fadedown(self, node)
-        gui.animate(node, "color.w", 0.0, gui.EASING_LINEAR,
-0.3, 0, fadeup, gui.PLAYBACK_ONCE_FORWARD)
+   gui.animate(node, "color.w", 0.0, gui.EASING_LINEAR, 0.3, 0, fadeup, gui.PLAYBACK_ONCE_FORWARD)
 end
 ```
 
-Now we can call either `fadeup()` or `fadedown()` and supply the node we want the alpha animated on. Note that we use the "complete_function" property to supply the function to call when the animation is done, effectively chaining an endless loop of fade up and fade downs.
+Now we can call either `fadeup()` or `fadedown()` and supply the node we want the alpha animated on. Note that we set the `complete_function` parameter to supply the function to call when the animation is done, effectively chaining an endless loop of fade up and fade downs.
 
 ## Render script
 
@@ -412,7 +424,7 @@ render.draw(self.text_pred)
 ...
 ```
 
-The view is a normal identity matrix and the projection is orthographic. You can create custom render scripts for your project by copying the "default.render_script" and "default.render" render file from the "builtins/render" folder, changing them as you wish and then specifying your custom renderer under the "bootstrap" section of the project settings (see [Project settings](/manuals/project-settings)).
+The view is a normal identity matrix and the projection is orthographic. You can create custom render scripts for your project by copying the *default.render_script* and *default.render* render file from the *builtins/render* folder, changing them as you wish and then specifying your custom renderer under the *bootstrap* section of the project settings (see [Project settings](/manuals/project-settings)).
 
 To illustrate, you can render all GUI components with a 3D "camera" view and perspective projection:
 

+ 8 - 6
docs/en/manuals/html5.md

@@ -1,11 +1,13 @@
-HTML5
-=====
+---
+title: Defold development for the HTML5 platform
+brief: This manual describes the process of creating HTML5 canvas applications, along with known issues and limitations.
+---
 
-This manual describes the process of creating HTML5 canvas applications, along with known issues and limitations.
+# HTML5 development
 
-## Project configuration
+Defold supports building games for the HTML5 platform through the regular bundling menu, as well as some platform specific tools. In addition, the resulting game is embedded on a regular HTML page that can be styled through a simple template system.
 
-The "game.project" file has some settings specific to HTML5 targets: they may be found in the *html5* section:
+The *game.project* file contains the HTML5 specific settings:
 
 ![Project settings](images/html5/html5_project_settings.png)
 
@@ -27,7 +29,7 @@ You may opt to save application data within the _HTML5 application cache_ (See h
 
 ## Creating HTML5 content
 
-Creating HTML5 content with Defold is simple and follows the same pattern as all other supported platforms: select *Project > Bundle > HTML5 Application...* from the menu:
+Creating HTML5 content with Defold is simple and follows the same pattern as all other supported platforms: select <kbd>Project ▸ Bundle...​ ▸ HTML5 Application...</kbd> from the menu:
 
 ![Build HTML5](images/html5/html5_build_launch.png)
 

+ 71 - 76
docs/en/manuals/iap.md

@@ -1,9 +1,10 @@
-In-app purchases
-================
-:location: documentation manuals extensions
-:type: manual
+---
+title: In-app purchases in Defold
+brief: In-app purchases (or in-app billing) allows you to charge your players or app users for extra content or functionality. This manual explains Defold's API available for this functionality.
+---
 
-In-app purchases (or in-app billing) allows you to charge your players or app users for extra content or functionality. This manual explains Defold's API available for this functionality.
+# In-app purchases
+================
 
 Defold provides a unified, simple to use interface to Apple's iOS Appstore "in-app purchases" and Google Play's or Amazon's "in-app billing" on Android devices. Facebook Canvas "game payments" is supported for Facebook Canvas. These services gives you the opportunity to sell products as:
 
@@ -25,19 +26,18 @@ Detailed documentation from Apple, Google, Amazon and Facebook can be found here
 
 On Android it is recommended that you start implementing IAP in your app by using static responses from Google Play. This enables you to verify that everything in your app works correctly before you publish the app. Four reserved product IDs exist for testing static In-app Billing responses:
 
-android.test.purchased
+`android.test.purchased`
 : Google Play responds as though you successfully purchased an item. The response includes a JSON string, which contains fake purchase information (for example, a fake order ID).
 
-android.test.canceled
+`android.test.canceled`
 : Google Play responds as though the purchase was canceled. This can occur when an error is encountered in the order process, such as an invalid credit card, or when you cancel a user's order before it is charged.
 
-android.test.refunded
+`android.test.refunded`
 : Google Play responds as though the purchase was refunded.
 
-android.test.item_unavailable
+`android.test.item_unavailable`
 : Google Play responds as though the item being purchased was not listed in your application's product list.
 
-
 ## Setting up your app for purchases/billing
 
 The procedure on iOS and Android is similar:
@@ -45,22 +45,24 @@ The procedure on iOS and Android is similar:
 1. Make sure you are a registered Apple or Google Play developer.
 2. Set up your project so it works on your target device. See the [iOS development](/manuals/ios) and [Android development](/manuals/android) guides.
 3. Set up the app for testing:
-    * For Android, this is done on the [Google Play Developer Console](https://play.google.com/apps/publish/).
-    * For iOS, this is done on [iTunes Connect](https://itunesconnect.apple.com/). Make sure that your App ID (created in the "Member Center" on https://developer.apple.com) has "In-App Purchase" enabled.
-+
-![iTunes Connect and Google Play Dev Console](images/iap/itunes_connect_google_play.png)
-+
+
+    - For Android, this is done on the [Google Play Developer Console](https://play.google.com/apps/publish/).
+    - For iOS, this is done on [iTunes Connect](https://itunesconnect.apple.com/). Make sure that your App ID (created in the "Member Center" on https://developer.apple.com) has "In-App Purchase" enabled.
+
+    ![iTunes Connect and Google Play Dev Console](images/iap/itunes_connect_google_play.png)
+
 4. For Google Play, you need to _upload and publish_ an alpha *.apk* file. For iTunes Connect, you should _not upload_ the development binary to iTunes Connect until the application is ready for App Review approval. If you upload a not binary to iTunes Connect and it is not fully functional, Apple will likely reject it.
+
 5. Create products for your app.
-+
-![iTunes Products](images/iap/itunes_products.png)
-+
-![Google Play Products](images/iap/google_play_products.png)
-+
+
+    ![iTunes Products](images/iap/itunes_products.png)
+
+    ![Google Play Products](images/iap/google_play_products.png)
+
 6. Add test users.
-    * The iTunes Connect page *Users and Roles* allow you to add users that can do test purchases in the _sandbox environment_. You should sign your app with a Developer certificate and use the sandbox account in Appstore on the test device.
-    * On Google Play Developer Console, choose *Settings > Account Details* where you can add user emails to the License Testing section. Separate the emails by commas. This allows your testers to use test purchases that don’t actually cost real money.
-    * On Google Play, you also need to set up a Google Group for your testers. Google uses Groups to manage testers that can download your app from the Alpha and Beta stores. Click on the *Alpha Testing* tab and then *Manage list of testers* to add your Google Group as Alpha testers. The app must have passed through alpha publishing before you can see the opt-in link.
+    - The iTunes Connect page *Users and Roles* allow you to add users that can do test purchases in the _sandbox environment_. You should sign your app with a Developer certificate and use the sandbox account in Appstore on the test device.
+    - On Google Play Developer Console, choose *Settings > Account Details* where you can add user emails to the License Testing section. Separate the emails by commas. This allows your testers to use test purchases that don’t actually cost real money.
+    - On Google Play, you also need to set up a Google Group for your testers. Google uses Groups to manage testers that can download your app from the Alpha and Beta stores. Click on the *Alpha Testing* tab and then *Manage list of testers* to add your Google Group as Alpha testers. The app must have passed through alpha publishing before you can see the opt-in link.
 
 ![Alpha testers](images/iap/alpha_testers.png)
 
@@ -75,7 +77,6 @@ The procedure on Facebook:
 5. Add test users. This is done in the "Canvas Payments" section of the app dashboard.
 6. Create products for your app [Defining products](https://developers.facebook.com/docs/payments/implementation-guide/defining-products/).
 
-
 ## Asynchronous transactions
 
 The IAP API is asynchronous, meaning that after each request that your program sends to the server, the program will not halt and wait for a response. Instead, the program continues as ordinary and when the response arrives, a _callback_ function is invoked where you can react to the response data.
@@ -87,56 +88,54 @@ local COINS_ID = "com.defold.examples.coins"
 local LOGO_ID = "com.defold.examples.logo"
 
 local function product_list(self, products, error)
-	if error == nil then
-		for i,p in pairs(products) do
-			print(p.ident)
-			print(p.title)
-			print(p.description)
-			print(p.currency_code)
-			print(p.price_string)
-		end
-	else
-		print(error.error)
-	end
+    if error == nil then
+        for i,p in pairs(products) do
+            print(p.ident)
+            print(p.title)
+            print(p.description)
+            print(p.currency_code)
+            print(p.price_string)
+        end
+    else
+        print(error.error)
+    end
 end
 
 function init(self)
-	-- Initiate a fetch of products
-	iap.list({ COINS_ID, LOGO_ID }, product_list)
+    -- Initiate a fetch of products
+    iap.list({ COINS_ID, LOGO_ID }, product_list)
 end
 ```
 
 To perform actual transactions, first register a function that will listen to transaction results, then call the store function at the appropriate time:
 
 ```lua
-    local function iap_listener(self, transaction, error)
-	    if error == nil then
-            if transaction.state == iap.TRANS_STATE_PURCHASING then
-                print("Purchasing...")
-            elseif transaction.state == iap.TRANS_STATE_PURCHASED then
-                print("Purchased!")
-            elseif transaction.state == iap.TRANS_STATE_UNVERIFIED then
-                print("Unverified!")
-            elseif transaction.state == iap.TRANS_STATE_FAILED then
-                print("Failed!")
-            elseif transaction.state == iap.TRANS_STATE_RESTORED then
-                print("Restored")
-            end
-        else
-            print(error.error)
+local function iap_listener(self, transaction, error)
+    if error == nil then
+        if transaction.state == iap.TRANS_STATE_PURCHASING then
+            print("Purchasing...")
+        elseif transaction.state == iap.TRANS_STATE_PURCHASED then
+            print("Purchased!")
+        elseif transaction.state == iap.TRANS_STATE_UNVERIFIED then
+            print("Unverified!")
+        elseif transaction.state == iap.TRANS_STATE_FAILED then
+            print("Failed!")
+        elseif transaction.state == iap.TRANS_STATE_RESTORED then
+            print("Restored")
         end
+    else
+        print(error.error)
     end
+end
 
-    function on_message(self, message_id, message, sender)
-
-        ...
-    	-- Register the function that will listen to IAP transactions.
-        iap.set_listener(iap_listener)
-        -- Initiate a purchase of a coin...
-        iap.buy(COINS_ID)
-        ...
-
-    end
+function on_message(self, message_id, message, sender)
+    ...
+    -- Register the function that will listen to IAP transactions.
+    iap.set_listener(iap_listener)
+    -- Initiate a purchase of a coin...
+    iap.buy(COINS_ID)
+    ...
+end
 ```
 
 The device operating system will automatically show a pop-up window allowing the user to go through with the purchase. The interface clearly indicates when you are running in the test/sandbox environment.
@@ -167,24 +166,20 @@ The receipt is a signed chunk of data that can be sent to the App Store to verif
 
 ## Troubleshooting
 
-## Android iap.list() returns "failed to fetch product"
-
-You need to upload and publish an *.apk* on the alpha or beta channels on Google Play Developer Console. Also make sure that the _time and date_ on your device is correct.
-
-## iOS iap.list() returns nothing
-
-Make sure that you’ve requested an iOS Paid Applications account, and all proper documentation has been filed. Without proper authorization, your iOS app purchasing (even test purchases) will not work.
-
-Check that the AppId you have on the "Member Center" has in-app purchases activated and that you are signing your app (or the dev-app) with a provisioning profile that is up to date with the AppId (check the "Enabled Services:" field in the provisioning profile details in the "Certificates, Identifiers & Profiles" area of "Member Center")
+Android `iap.list()` returns "failed to fetch product"
+: You need to upload and publish an *.apk* on the alpha or beta channels on Google Play Developer Console. Also make sure that the _time and date_ on your device is correct.
 
-Wait. It can take a few hours for the In-App product IDs are propagated to the Sandbox environment.
+iOS `iap.list()` returns nothing
+: Make sure that you’ve requested an iOS Paid Applications account, and all proper documentation has been filed. Without proper authorization, your iOS app purchasing (even test purchases) will not work.
 
-## iOS iap.list() fails logging error "Unexpected callback set"
+  Check that the AppId you have on the "Member Center" has in-app purchases activated and that you are signing your app (or the dev-app) with a provisioning profile that is up to date with the AppId (check the "Enabled Services:" field in the provisioning profile details in the "Certificates, Identifiers & Profiles" area of "Member Center")
 
-iap.list does not support nested calls. Calling iap.list from an iap.list callback function will be ignored with the engine logging this error.
+  Wait. It can take a few hours for the In-App product IDs are propagated to the Sandbox environment.
 
-## On iOS, the "price_string" field contains '~' characters
+iOS `iap.list()` fails logging error "Unexpected callback set"
+: iap.list does not support nested calls. Calling iap.list from an iap.list callback function will be ignored with the engine logging this error.
 
-The '~' characters are placeholders where no matching character could be found in the font file. The "price_string" field returned in the product list when using `iap.list()` is formatted with _non breaking space_ (\u00a0) between the value and the currency denominator. If you render this string in the GUI, you need to add the character to the font's *extra_characters* field. On Mac OS X you can type non breaking spaces by pressing *Option-<SPACE>*. See http://en.wikipedia.org/wiki/Non-breaking_space for more information.
+On iOS, the "price_string" field contains '~' characters
+: The '~' characters are placeholders where no matching character could be found in the font file. The "price_string" field returned in the product list when using `iap.list()` is formatted with _non breaking space_ (`\u00a0`) between the value and the currency denominator. If you render this string in the GUI, you need to add the character to the font's *extra_characters* field. On Mac OS X you can type non breaking spaces by pressing <kbd>Option + SPACE</kbd>. See http://en.wikipedia.org/wiki/Non-breaking_space for more information.
 
 

BIN
docs/en/manuals/images/iap/android_purchase.png


BIN
docs/en/manuals/images/iap/ios_confirm_purchase.png


BIN
docs/en/manuals/images/iap/ios_purchase_done.png


BIN
docs/en/manuals/images/materials/materials_vertex_constants.png


+ 0 - 0
docs/en/manuals/images/doctest/large.png → docs/en/manuals/images/test/large.png


+ 0 - 0
docs/en/manuals/images/doctest/medium.png → docs/en/manuals/images/test/medium.png


+ 0 - 0
docs/en/manuals/images/doctest/small.png → docs/en/manuals/images/test/small.png


BIN
docs/en/manuals/images/test/tiny.png


+ 123 - 129
docs/en/manuals/input.md

@@ -1,10 +1,13 @@
-= Input
-:location: documentation manuals logic
-:type: manual
+---
+title: Device input in Defold
+brief: This manual explains how you capture input actions and create interactive script reactions.
+---
 
-This manual explains how you capture input actions and create interactive script reactions.
+# Device input
 
-Defold listens to input from a variety of devices and allows you to write script logic that matches your design. The input device types that Defold supports are:
+Defold is capable of listening to input from a variety of devices and you can set up custom mapping from device input to input *actions* that your script logic can react to. Input handling in Defold is simple and powerful, allowing you to manage input as you see fit for your game. 
+
+Defold supports the following input device types:
 
 1. Keyboard (key and text input)
 2. Mouse (including mouse wheel actions)
@@ -25,7 +28,7 @@ Depending on the components that have acquired input focus, and whether they con
 
 ## Input bindings
 
-The input bindings is a project wide table that allows you to specify how raw input should translated into meaningful *actions* before they are dispatched to your Lua scripts. The input bindings is by default named "game.input_binding" and is found in the "input" folder at the root of your project. You can, however, easily change its name and location and update the project settings so the engine will find the bindings (see [Project settings](/manuals/project-settings)).
+The input bindings is a project wide table that allows you to specify how raw input should translated into meaningful *actions* before they are dispatched to your Lua scripts. The input bindings is by default named *game.input_binding* and is found in the *input* folder at the root of your project. You can, however, easily change its name and location and update the project settings so the engine will find the bindings (see [Project settings](/manuals/project-settings)).
 
 ![Input set bindings](images/input/input_set_bindings.png)
 
@@ -37,14 +40,13 @@ There are five types of triggers that you can create. They are device specific:
 4. `touch_trigger` is for all types of touch input.
 5. `text_trigger` is for text input.
 
-Right click on a trigger type and select "Add TYPE_trigger..." to add a new trigger. Each trigger has two fields:
+Right click on a trigger type and select <kbd>Add [TYPE]_trigger...</kbd> to add a new trigger. Each trigger has two fields:
 
-input
+*input*
 : A scroll list with the available inputs to listen to.
 
-action
-: The action name given to input actions when they are created and dispatched to your scripts. It is fine to have the same action names assigned to multiple actions. For instance, it is convenient to be able to bind the <kbd>Space</kbd> key to the action "jump" and the gamepad "A" button to the same action name.
-
+*action*
+: The action name given to input actions when they are created and dispatched to your scripts. It is fine to have the same action names assigned to multiple actions. For instance, it is convenient to be able to bind the <kbd>Space</kbd> key to the action `jump` and the gamepad "A" button to the same action name.
 
 ::: sidenote
 There is a known bug where touch inputs unfortunately cannot have the same action names as other inputs.
@@ -54,20 +56,20 @@ For instance, to set up key bindings for movement left and right for a game, you
 
 ![Input key bindings](images/input/input_key_bindings.png)
 
-Here, the inputs `KEY_LEFT` (the left arrow key on the keyboard) and `KEY_RIGHT` (the right arrow key) are bound to the action names "move_left" and "move_right" respectively. The benefit of separating the hardware input from the logical actions is that if you decide later on that you want to change which hardware inputs trigger what actions, there is only one place to modify.
+Here, the inputs `KEY_LEFT` (the left arrow key on the keyboard) and `KEY_RIGHT` (the right arrow key) are bound to the action names `move_left` and `move_right` respectively. The benefit of separating the hardware input from the logical actions is that if you decide later on that you want to change which hardware inputs trigger what actions, there is only one place to modify.
 
 ## Acquiring and releasing input focus
 
-To listen to input actions, create a game object with a script (or GUI script) component. In the script, send the game object itself a message "acquire_input_focus":
+To listen to input actions, create a game object with a script (or GUI script) component. In the script, send the game object itself a message `acquire_input_focus`:
 
 ```lua
 function init(self)
-        msg.post(".", "acquire_input_focus")
+    msg.post(".", "acquire_input_focus")
 end
 ```
 
 This message instructs Defold to direct input actions to the current game object. Technically, what happens is that the object is added to an *input stack* (see below for further details).
-To stop listening to input actions, simply send a "release_input_focus" message to the game object:
+To stop listening to input actions, simply send a `release_input_focus` message to the game object:
 
 ```lua
 ...
@@ -91,30 +93,29 @@ The function takes 2 parameters (besides "self"):
 `action`
 : A Lua table containing the message data.
 
-
-To (very crudely) handle the "move_left" and "move_right" bindings we set up above, we can write the following code:
+To (very crudely) handle the `move_left` and `move_right` bindings we set up above, we can write the following code:
 
 ```lua
 function on_input(self, action_id, action)
-        if action_id == hash("move_left") and action.pressed then
-                local pos = go.get_position()
-                pos.x = pos.x - 100
-                go.set_position(pos)
-        elseif action_id == hash("move_right") and action.pressed then
-                local pos = go.get_position()
-                pos.x = pos.x + 100
-                go.set_position(pos)
-        end
+    if action_id == hash("move_left") and action.pressed then
+        local pos = go.get_position()
+        pos.x = pos.x - 100
+        go.set_position(pos)
+    elseif action_id == hash("move_right") and action.pressed then
+        local pos = go.get_position()
+        pos.x = pos.x + 100
+        go.set_position(pos)
+    end
 end
 ```
 
 ::: important
-When working with collection proxies it is imperative to understand how input is dispatched through collections. If you can't get input to work with your collection proxies, make sure to read <<anchor-iacp, Input and Collection Proxies>> below.
+When working with collection proxies it is imperative to understand how input is dispatched through collections. If you can't get input to work with your collection proxies, make sure to read "Input and Collection Proxies" below.
 :::
 
 ## Action fields
 
-The `action` parameter sent to `on_input()` for each input message is a Lua table containing useful data like the value of the input, the position of the input, whether button input was "pressed", "repeated" or "released".
+The `action` parameter sent to `on_input()` for each input message is a Lua table containing useful data like the value of the input, the position of the input, whether button input was `pressed`, `repeated` or `released`.
 
 `action.pressed`
 : `true` the first frame the input was detected, otherwise `false`.
@@ -132,7 +133,7 @@ See [on_input()](/ref/go#on_input) for details on the available action fields.
 
 ## Screen positions
 
-Mouse and touch input set fields in the `action` table for location (+x+ and +y`) as well as movement (`dx+ and `dy`). These inputs also set specific fields that are calculated against the real screen space. These fields are called:
+Mouse and touch input set fields in the `action` table for location (`x` and `y`) as well as movement (`dx` and `dy`). These inputs also set specific fields that are calculated against the real screen space. These fields are called:
 
 `screen_x` and `screen_y`
 : The real screen position
@@ -140,12 +141,11 @@ Mouse and touch input set fields in the `action` table for location (+x+ and +y`
 `screen_dx` and `screen_dy`
 : The real screen delta change since last update
 
-
 These fields are useful on devices where the screen pixel position differs from the game position--for instance if you run a lower resolution game on a retina screen that scales the game. For instance, on the iPad you can have a screen that is 1024x768 but each "logical" pixels consists of 4 real ones and maps to a physical resolution of 2048x1536.
 
 ## Key triggers
 
-Key triggers are simple one-key inputs that acts as button input. They are useful for games that needs to tie specific buttons to specific functions, like the "move_left" and "move_right" button setup above. If you need to read arbitrary key input, use text triggers (see below).
+Key triggers are simple one-key inputs that acts as button input. They are useful for games that needs to tie specific buttons to specific functions, like the `move_left` and `move_right` button setup above. If you need to read arbitrary key input, use text triggers (see below).
 
 ## Mouse triggers
 
@@ -154,19 +154,17 @@ Mouse triggers come in two forms. The first one is mouse button and wheel input
 Mouse button inputs
 : Use these to detect mouse presses.
 
-Note that the inputs "MOUSE_BUTTON_LEFT", "MOUSE_BUTTON_RIGHT" and "MOUSE_BUTTON_MIDDLE" are equivalent to "MOUSE_BUTTON_1", "MOUSE_BUTTON_2" and "MOUSE_BUTTON_3".
+  Note that the inputs `MOUSE_BUTTON_LEFT`, `MOUSE_BUTTON_RIGHT` and `MOUSE_BUTTON_MIDDLE` are equivalent to `MOUSE_BUTTON_1`, `MOUSE_BUTTON_2` and `MOUSE_BUTTON_3`.
 
 ::: sidenote
-Currently, MOUSE_BUTTON_LEFT (or MOUSE_BUTTON_1) input actions are sent for single touch inputs as well.
+Currently, `MOUSE_BUTTON_LEFT` (or `MOUSE_BUTTON_1`) input actions are sent for single touch inputs as well.
 :::
 
 Mouse wheel inputs
-: Use these to detect scroll actions. The field action.value` is `1` if the wheel is scrolled and `0` otherwise. (Scroll actions are dealt with as they were button presses. Defold do not currently support fine grained scroll input on touch pads.)
-
+: Use these to detect scroll actions. The field `action.value` is `1` if the wheel is scrolled and `0` otherwise. (Scroll actions are dealt with as they were button presses. Defold do not currently support fine grained scroll input on touch pads.)
 
 Mouse movement
-: Mouse movements cannot be bound in the input bindings, and does not set the `action_id` to a name. Instead, the `action_id` is set to `nil` and the action table is populated with the location and delta movement of the mouse position.
-
+: Mouse movements cannot be bound in the input bindings, and does not set the `action_id` to a name. Instead, the `action_id` is set to `nil` and the `action` table is populated with the location and delta movement of the mouse position.
 
 ## Gamepad triggers
 
@@ -179,7 +177,7 @@ The gamepad triggers allows you to bind standard gamepad input to game functions
 5. Start, Back and Guide buttons
 
 ::: sidenote
-Right pad usually translates to the A, B, X and Y buttons on the Xbox controller and square, circle, triangle and cross buttons on the Playstation controller.
+Right pad usually translates to the "A", "B", "X" and "Y" buttons on the Xbox controller and "square", "circle", "triangle" and "cross" buttons on the Playstation controller.
 :::
 
 Gamepad input sets the `gamepad` field of the action table to the gamepad number the
@@ -199,10 +197,10 @@ end
 
 ## Touch triggers
 
-Touch and multi-touch triggers populate a subtable in the action table called `action.touch`. The elements in the table are numbered 1-N (where N is the number of touch points) and each element contains fields with input data.
+Touch and multi-touch triggers populate a subtable in the action table called `action.touch`. The elements in the table are numbered `1`--`N` (where `N` is the number of touch points) and each element contains fields with input data.
 
 ::: sidenote
-See [on_input()](/ref/go#on_input) for details on the available touch action fields.
+See [`on_input()`](/ref/go#on_input) for details on the available touch action fields.
 :::
 
 Since the elements are in a numbered table, array-like, you can traverse it easily:
@@ -228,45 +226,43 @@ Here, a component "factory" is used to spawn a simple particle effect with `fact
 
 Text triggers allows you to read arbitrary text input. There are two types of text triggers:
 
-TEXT
+`TEXT`
 : This input triggers captures normal text input.
 
-
-A text trigger sets the "text" field of the action table to a string containing the typed character. The action is only fired at the press of the button, no "release" or "repeated" action is sent.
-
-```lua
-function on_input(self, action_id, action)
-    if action_id == hash("text") then
-        -- Concatenate the input character to the "text" node...
-        local node = gui.get_node("text")
-        local text = gui.get_text(node)
-        text = text .. action.text
-        gui.set_text(node, text)
-    end
-end
-```
-
-MARKED_TEXT
+  A text trigger sets the `text` field of the action table to a string containing the typed character. The action is only fired at the press of the button, no `release` or `repeated` action is sent.
+
+  ```lua
+  function on_input(self, action_id, action)
+      if action_id == hash("text") then
+          -- Concatenate the input character to the "text" node...
+          local node = gui.get_node("text")
+          local text = gui.get_text(node)
+          text = text .. action.text
+          gui.set_text(node, text)
+      end
+  end
+  ```
+
+`MARKED_TEXT`
 : This is used primarily for asian keyboards where multiple keypresses can map to single inputs.
 
+  For example, the iOS "Japanese-Kana" keyboard is a 10 key keyboard. The user can type combinations and the top of the keyboard will display avaliable symbols or sequences of symbols that can be entered.
 
-For example, the iOS "Japanese-Kana" keyboard is a 10 key keyboard. The user can type combinations and the top of the keyboard will display avaliable symbols or sequences of symbols that can be entered.
+  ![Input marked text](images/input/input_marked_text.png)
 
-![Input marked text](images/input/input_marked_text.png)
+  Each keypress generates a separate action and sets the action field with the series of entered keypresses in the `text` field:
 
-Each keypress generates a separate action and sets the action field with the series of entered keypresses in the "text" field:
-
-```lua
-{
-  repeated = false,
-  released = false,
-  text = た,
-  value = 0,
-  pressed = false,
-}
-```
+  ```lua
+  {
+    repeated = false,
+    released = false,
+    text = た,
+    value = 0,
+    pressed = false,
+  }
+  ```
 
-When the user selects a symbol or symbol combination, an ordinary text trigger action is sent.
+  When the user selects a symbol or symbol combination, an ordinary text trigger action is sent.
 
 ## The input stack
 
@@ -283,12 +279,12 @@ If you have a set of game objects that all acquire input, they get added to the
 ```lua
 -- in "listener1.script"
 function init(self)
-        msg.post(".", "acquire_input_focus")
+    msg.post(".", "acquire_input_focus")
 end
 
 -- in "listener2.script"
 function init(self)
-        msg.post(".", "acquire_input_focus")
+    msg.post(".", "acquire_input_focus")
 end
 ```
 
@@ -299,17 +295,17 @@ In situations where you need the listeners on the stack in a particular order yo
 ```lua
 -- in "listener1.script"
 function init(self)
-        -- We're added to the input stack first, "listener2" second.
-        msg.post(".", "acquire_input_focus")
-        msg.post("listener2", "acquire_input")
+    -- We're added to the input stack first, "listener2" second.
+    msg.post(".", "acquire_input_focus")
+    msg.post("listener2", "acquire_input")
 end
 
 -- in "listener2.scrip"
 function on_message(self, message_id, message, sender)
-        if message_id == hash("acquire_input") then
-                -- Acquire input when we get this message.
-                msg.post(".", "acquire_input_focus")
-        end
+    if message_id == hash("acquire_input") then
+        -- Acquire input when we get this message.
+        msg.post(".", "acquire_input_focus")
+    end
 end
 ```
 
@@ -342,20 +338,20 @@ The pause menu is initially hidden (disabled) and when the player touches the "P
 
 ```lua
 function init(self)
-        msg.post(".", "acquire_input_focus")
+    msg.post(".", "acquire_input_focus")
 end
 
 function on_input(self, action_id, action)
-        if action_id == hash("mouse_press") and action.pressed then
-                local x = action.x
-                local y = action.y
-                -- Get the "pause" node and see if player has pressed it.
-                local pausenode = gui.get_node("pause")
-                if gui.pick_node(pausenode, x, y) then
-                        -- Tell the pause menu to take over.
-                        msg.post("pause_menu", "show")
-                end
+    if action_id == hash("mouse_press") and action.pressed then
+        local x = action.x
+        local y = action.y
+        -- Get the "pause" node and see if player has pressed it.
+        local pausenode = gui.get_node("pause")
+        if gui.pick_node(pausenode, x, y) then
+            -- Tell the pause menu to take over.
+            msg.post("pause_menu", "show")
         end
+    end
 end
 ```
 
@@ -369,56 +365,55 @@ The pause menu GUI runs the following code:
 
 ```lua
 function init(self)
-        -- Fetch background node and disable.
-        -- Everything is childed under it.
-        local node = gui.get_node("background")
-        gui.set_enabled(node, false)
+    -- Fetch background node and disable.
+    -- Everything is childed under it.
+    local node = gui.get_node("background")
+    gui.set_enabled(node, false)
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("show") then
-                -- First, show the pause menu.
-                local node = gui.get_node("background")
-                gui.set_enabled(node, true)
-
-                -- Now, acquire input. We're gonna be on top of
-                -- the input stack. Yay!
-                msg.post(".", "acquire_input_focus")
-        end
+    if message_id == hash("show") then
+        -- First, show the pause menu.
+        local node = gui.get_node("background")
+        gui.set_enabled(node, true)
+
+        -- Now, acquire input. We're gonna be on top of
+        -- the input stack. Yay!
+        msg.post(".", "acquire_input_focus")
+    end
 end
 
 function on_input(self, action_id, action)
-        if action_id == hash("mouse_press") and action.pressed then
-                local x = action.x
-                local y = action.y
-                -- Get the nodes and see if we have pressed any.
-                local loadnode = gui.get_node("load")
-                local savenode = gui.get_node("save")
-                local resumenode = gui.get_node("resume")
-                if gui.pick_node(loadnode, x, y) then
-                        print("THE GAME WILL LOAD...")
-                elseif gui.pick_node(savenode, x, y) then
-                        print("THE GAME WILL SAVE...")
-                elseif gui.pick_node(resumenode, x, y) then
-                        -- Resume the game...
-                        -- First, hide the pause menu.
-                        local node = gui.get_node("background")
-                        gui.set_enabled(node, false)
-
-                        -- Finally, release input.
-                        msg.post(".", "release_input_focus")
-                end
+    if action_id == hash("mouse_press") and action.pressed then
+        local x = action.x
+        local y = action.y
+        -- Get the nodes and see if we have pressed any.
+        local loadnode = gui.get_node("load")
+        local savenode = gui.get_node("save")
+        local resumenode = gui.get_node("resume")
+        if gui.pick_node(loadnode, x, y) then
+            print("THE GAME WILL LOAD...")
+        elseif gui.pick_node(savenode, x, y) then
+            print("THE GAME WILL SAVE...")
+        elseif gui.pick_node(resumenode, x, y) then
+            -- Resume the game...
+            -- First, hide the pause menu.
+            local node = gui.get_node("background")
+            gui.set_enabled(node, false)
+
+            -- Finally, release input.
+            msg.post(".", "release_input_focus")
         end
+    end
 
-        -- As long as we're listening to input, we're gonna consume it.
-        -- This disables game controls while the pause menu is showing.
-        return true
+    -- As long as we're listening to input, we're gonna consume it.
+    -- This disables game controls while the pause menu is showing.
+    return true
 end
 ```
 
 The `on_input()` function of the pause menu GUI script returns `true` as long as the menu shows. This means that it will consume all input actions. The game is thus effectively paused from a user input perspective.
 
-[[anchor-iacp]]
 ## Input and Collection Proxies
 
 The input stack is actually not global--there exist a separate local input stack for each collection. If you use collection proxies to structure your game it is imperative to understand how input is dispatched through collections.
@@ -429,8 +424,7 @@ When input actions are passed on down the current collection's input stack and r
 
 It is clear now that in order for any `on_input()` component code in a dynamically loaded collection to receive input actions, the game object containing the collection proxy *must* be on the input stack.
 
-Even if the collection proxy's game object contain no `on_input()` code at all, it must still send a "acquire_input_focus" message to itself to be added on top of the input stack. Any game object inside the loaded collection must send "acquire_input_focus" to get added to the collection's input stack.
-
+Even if the collection proxy's game object contain no `on_input()` code at all, it must still send a `acquire_input_focus` message to itself to be added on top of the input stack. Any game object inside the loaded collection must send "acquire_input_focus" to get added to the collection's input stack.
 
 Note that if at any step down the input stack an `on_input()` function returns true, then it will consume the input. It does not matter where that happens, actions will not be passed on further. If necessary, a loaded collection can therefore consume input and prevent objects further down the main collection input stack from receiving any actions.
 

+ 56 - 112
docs/en/manuals/introduction.md

@@ -1,5 +1,9 @@
-Welcome to Defold
-=================
+---
+title = Introduction to Defold
+brief = A brief introduction that covers the core concepts of Defold and is intended to give an overview to the editor and the most important features.
+---
+
+# Welcome to Defold
 
 Welcome to Defold. This introduction covers the core concepts of Defold and is intended to give an overview to the editor and the most important features. All descriptions are quite brief but there are links to more thorough documentation.
 
@@ -62,143 +66,83 @@ In addition to collaborating through project branches, Defold allows you to shar
 
 This is a list of all the available building blocks for creating apps and games. They are listed together with the icon used for the type of building block in the Defold editor.
 
-## Game object
-
-![Game object](images/icons/brick.png)
-
-See above for a description of game objects.
-
-## Collection
-
-![Collection](images/icons/bricks.png)
-
-See above for a description of collections.
-
-## Script
-
-![Script](images/icons/cog.png)
-
-See above for a description of scripts.
-
-## Sound
-
-![Sound](images/icons/sound.png)
-
-The sound component is responsible for playing a specific sound. Currently, Defold supports soundfiles of the type WAV.
-
-## Collision object
-
-![Collision object](images/icons/weight.png)
-
-Collision objects are components that extend game objects with physical properties (like spatial shape, weight, friction and restitution). These properties govern how the collision object should collide with other collision objects. The most common types of collision objects are kinematic objects, dynamic objects and triggers. A kinematic object gives detailed collision information that you have to manually respond to, a dynamic object is automatically simulated by the physics engine to obey Newtonian laws of physics. Triggers are simple shapes that detect if other shapes have entered or exited the trigger.
-
-## Factory
-
-![Factory](images/icons/factory.png)
-
-See above for a description of factories.
-
-## Sprite
-
-![Sprite](images/icons/pictures.png)
-
-A sprite is a component that extends game objects with graphics. It displays an image either from a Tile source or from an Atlas. Sprites have built-in support for flip-book and bone animation. Sprites are usually used for characters and items. See the [2D graphics documentation](/manuals/2dgraphics) for more information.
-
-## Atlas
-
-![Atlas](images/icons/pictures_atlas.png)
-
-An atlas is a set of separate images that are compiled into a larger sheet for performance and memory reasons. You can store still images or flip-book animated series of images. Atlases are used by Sprite and ParticleFX components to share graphics resources. See the [2D graphics documentation](/manuals/2dgraphics) for more information.
-
-![Atlas](images/introduction/introduction_atlas.png)
-
-## Tile source
-
-![Tile source](images/icons/small_tiles.png)
-
-A tile source describes a texture that is composed of multiple smaller images, everyone with the same size. The component support flip-book animation. You can define animations over a sequence of images in the tile source. Tile sources can also automatically calculate collision shapes from image data. This is very useful for creating tiled levels that object can collide and interact with. Tile sources are used by Tile map (and Sprite and ParticleFX although Atlases are usually to prefer) components to share graphics resources. See the [2D graphics documentation](/manuals/2dgraphics) for more information.
-
-![Tile source](images/introduction/introduction_tilesource.png)
-
-![Tile source animation](images/introduction/introduction_tilesource_animation.png)
-
-![Tile source shape](images/introduction/introduction_tilesource_hull.png)
-
-## Tile map
-
-![Tile map](images/icons/layer_grid.png)
-
-Tile map components display images from a tile source in one or more overlaid grids. They are most commonly used to build game environments: ground, walls, buildings and obstacles. A tile map can display several layers aligned on top of each other with specified blend mode. This is useful to, for example, put foilage on top of grass background tiles. It is also possible to dynamically change the displayed image in a tile. That allows you to, for instance, destroy a bridge and make it impassable by simply replacing the tiles with ones depicting the broken down bridge and containing the corresponding physics shape.
-
-![Tile map](images/introduction/introduction_tilemap.png)
-
-![Tile map palette](images/introduction/introduction_tilemap_palette.png)
-
-## ParticleFX
-
-![ParticleFX](images/icons/clouds.png)
-
-Particles are very useful for creating nice visual effects, particularly in games. you can use them to create fog, smoke, fire, rain or falling leaves. Defold contains a powerful particle effects editor that allows you to build and tweak effects while you run them real time in your game. The [ParticleFX documentation](/manuals/particlefx) gives you the details on how that works.
-
-![ParticleFX](images/introduction/introduction_particlefx.png)
-
-## GUI
+Game object
+: ![Game object](images/icons/brick.png){.image-left} See above for a description of game objects.
 
-![GUI](images/icons/text_allcaps.png)
+Collection
+: ![Collection](images/icons/bricks.png){.image-left} See above for a description of collections.
 
-A GUI component contains elements used to construct user interfaces: text and colored and/or textured blocks. Elements can be organized into hierarchial structures, scripted and animated. GUI components are typically used to create heads-up displays, menu systems and on-screen notifications. GUI components are controlled with GUI scripts that defines the behavior of the GUI and controls the user interaction with it. Read more in the [GUI documentation](/manuals/gui).
+Script
+: ![Script](images/icons/cog.png){.image-left} See above for a description of scripts.
 
-![GUI](images/introduction/introduction_gui.png)
+Sound
+: ![Sound](images/icons/sound.png){.image-left} The sound component is responsible for playing a specific sound. Currently, Defold supports soundfiles of the type WAV.
 
-## GUI script
+Collision object
+: ![Collision object](images/icons/weight.png){.image-left} Collision objects are components that extend game objects with physical properties (like spatial shape, weight, friction and restitution). These properties govern how the collision object should collide with other collision objects. The most common types of collision objects are kinematic objects, dynamic objects and triggers. A kinematic object gives detailed collision information that you have to manually respond to, a dynamic object is automatically simulated by the physics engine to obey Newtonian laws of physics. Triggers are simple shapes that detect if other shapes have entered or exited the trigger.
 
-![GUI script](images/icons/cog.png)
+Factory
+: ![Factory](images/icons/factory.png){.image-left} See above for a description of factories.
 
-GUI scripts are used to define the behaviour of GUI components. They control GUI animations and how the user interacts with the GUI.
+Sprite
+: ![Sprite](images/icons/pictures.png){.image-left} A sprite is a component that extends game objects with graphics. It displays an image either from a Tile source or from an Atlas. Sprites have built-in support for flip-book and bone animation. Sprites are usually used for characters and items. See the [2D graphics documentation](/manuals/2dgraphics) for more information.
 
-## Font
+Atlas
+: ![Atlas](images/icons/pictures_atlas.png){.image-left} An atlas is a set of separate images that are compiled into a larger sheet for performance and memory reasons. You can store still images or flip-book animated series of images. Atlases are used by Sprite and ParticleFX components to share graphics resources. See the [2D graphics documentation](/manuals/2dgraphics) for more information.
 
-![Font](images/icons/font.png)
+  ![Atlas](images/introduction/introduction_atlas.png)
 
-A Font is built from a TrueType or OpenType font file. The Font specifies which size to render the font in and what type of decoration (outline and shadow) the rendered font should have. Fonts are used by GUI components.
+Tile source
+: ![Tile source](images/icons/small_tiles.png){.image-left} A tile source describes a texture that is composed of multiple smaller images, everyone with the same size. The component support flip-book animation. You can define animations over a sequence of images in the tile source. Tile sources can also automatically calculate collision shapes from image data. This is very useful for creating tiled levels that object can collide and interact with. Tile sources are used by Tile map (and Sprite and ParticleFX although Atlases are usually to prefer) components to share graphics resources. See the [2D graphics documentation](/manuals/2dgraphics) for more information.
 
-![GUI](images/introduction/introduction_font.png)
+  ![Tile source](images/introduction/introduction_tilesource.png)
 
-## Input binding
+  ![Tile source animation](images/introduction/introduction_tilesource_animation.png)
 
-![Input binding](images/icons/keyboard.png)
+  ![Tile source shape](images/introduction/introduction_tilesource_hull.png)
 
-Input binding files define how the game should interpret hardware input (mouse, keyboard, touchscreen and game pads). The file bind hardware input to high level input _actions_ like "jump" and "move_forward". In script components that listens to input you are then able to script the actions the game or app should take given certain input. See the [Input documentation](/manuals/input) for details.
+Tile map
+: ![Tile map](images/icons/layer_grid.png){.image-left} Tile map components display images from a tile source in one or more overlaid grids. They are most commonly used to build game environments: ground, walls, buildings and obstacles. A tile map can display several layers aligned on top of each other with specified blend mode. This is useful to, for example, put foilage on top of grass background tiles. It is also possible to dynamically change the displayed image in a tile. That allows you to, for instance, destroy a bridge and make it impassable by simply replacing the tiles with ones depicting the broken down bridge and containing the corresponding physics shape.
 
-![Input binding](images/introduction/introduction_input_binding.png)
+  ![Tile map](images/introduction/introduction_tilemap.png)
 
-## Camera
+  ![Tile map palette](images/introduction/introduction_tilemap_palette.png)
 
-![Camera](images/icons/camera.png)
+ParticleFX
+: ![ParticleFX](images/icons/clouds.png){.image-left} Particles are very useful for creating nice visual effects, particularly in games. you can use them to create fog, smoke, fire, rain or falling leaves. Defold contains a powerful particle effects editor that allows you to build and tweak effects while you run them real time in your game. The [ParticleFX documentation](/manuals/particlefx) gives you the details on how that works.
 
-Camera components helps to decide what part of the game world should be visible and how it should be projected. A common use case is to attach a camera to the player game object, or having a separate game object with a camera that follows the player around with some smoothing algorithm.
+  ![ParticleFX](images/introduction/introduction_particlefx.png)
 
-## Material
+GUI
+: ![GUI component](images/icons/text_allcaps.png){.image-left} A GUI component contains elements used to construct user interfaces: text and colored and/or textured blocks. Elements can be organized into hierarchial structures, scripted and animated. GUI components are typically used to create heads-up displays, menu systems and on-screen notifications. GUI components are controlled with GUI scripts that defines the behavior of the GUI and controls the user interaction with it. Read more in the [GUI documentation](/manuals/gui).
 
-![Material](images/icons/large_tiles.png)
+  ![GUI](images/introduction/introduction_gui.png)
 
-Materials define how different objects should be rendered by specifying shaders and their properties.
+GUI script
+: ![GUI script](images/icons/cog.png){.image-left} GUI scripts are used to define the behaviour of GUI components. They control GUI animations and how the user interacts with the GUI.
 
-## Render
+Font
+: ![Font file](images/icons/font.png){.image-left} A Font is built from a TrueType or OpenType font file. The Font specifies which size to render the font in and what type of decoration (outline and shadow) the rendered font should have. Fonts are used by GUI components.
 
-![Render](images/icons/paintcan.png)
+  ![Font](images/introduction/introduction_font.png)
 
-Render files contains settings used when rendering the game to the screen. Render files define which Render script to use for rendering and which materials to use.
+Input binding
+: ![Input binding](images/icons/keyboard.png){.image-left} Input binding files define how the game should interpret hardware input (mouse, keyboard, touchscreen and game pads). The file bind hardware input to high level input _actions_ like "jump" and "move_forward". In script components that listens to input you are then able to script the actions the game or app should take given certain input. See the [Input documentation](/manuals/input) for details.
 
-## Render script
+  ![Input binding](images/introduction/introduction_input_binding.png)
 
-![Render script](images/icons/cog.png)
+Camera
+: ![Camera](images/icons/camera.png){.image-left} Camera components helps to decide what part of the game world should be visible and how it should be projected. A common use case is to attach a camera to the player game object, or having a separate game object with a camera that follows the player around with some smoothing algorithm.
 
-A Render script is a Lua script that controls how the game or app should be rendered to the screen. There is a default Render script that covers most common cases, but you can write your own if you need custom lighting models and other effects.
+Material
+: ![Material](images/icons/large_tiles.png){.image-left} Materials define how different objects should be rendered by specifying shaders and their properties.
 
-## Collection proxy
+Render
+: ![Render](images/icons/paintcan.png){.image-left} Render files contains settings used when rendering the game to the screen. Render files define which Render script to use for rendering and which materials to use.
 
-![Collection proxy](images/icons/bricks_proxy.png)
+Render script
+: ![Render script](images/icons/cog.png){.image-left} A Render script is a Lua script that controls how the game or app should be rendered to the screen. There is a default Render script that covers most common cases, but you can write your own if you need custom lighting models and other effects.
 
-A Collection proxy is used to load and enable collections on the fly while an app or game is running. The most common use case for Collection proxies are to load levels as they are to be played. See the [Collection proxy documentation](/manuals/collection-proxy) for details.
+Collection proxy
+: ![Collection proxy](images/icons/bricks_proxy.png){.image-left} A Collection proxy is used to load and enable collections on the fly while an app or game is running. The most common use case for Collection proxies are to load levels as they are to be played. See the [Collection proxy documentation](/manuals/collection-proxy) for details.
 

+ 22 - 32
docs/en/manuals/ios.md

@@ -1,12 +1,9 @@
-iOS development
-===============
-:location: documentation manuals platforms
-:type: manual
-:pagetitle: Developing on the best mobile game engine for iOS | Defold
-:description: Publish your game on iOS using Defold - the ultimate free 2D game engine.
-:title: Developing games for iOS
+---
+title: Defold development for the iOS platform
+brief: This manual explains how to develop games and apps for iOS devices in Defold.
+---
 
-This manual explains how to develop games and apps on iOS devices in Defold.
+# iOS development
 
 iOS development differs from Android development in that you have to be a registered developer to be able to put apps or games on an iOS device, even during development. iOS requires that all apps that are out on a phone or tablet is signed with an Apple-issued certificate and provisioning profile.
 
@@ -21,23 +18,19 @@ The section *Certificates, Identifiers & Profiles* contains all the tools you ne
 Certificates
 : Apple issued cryptographic certificates that identifies you as a developer. You can create development or production certificates. Developer certificates allow you to test certain features such as the in-app purchase mechanism in a sandbox test environment. Production certificates are used to sign the final app for upload to the App Store. You need a certificate to sign apps before you can put them on your device for testing.
 
-
 Identifiers
-: Identifiers for various use. It is possible to register wildcard identifiers (i.e. "some.prefix.*") which can be used with several apps. App IDs can contain Application Service information, like if the app enables Passbook integration, the Game Center etc. Such App IDs cannot be wildcard identifiers. For Application Services to function, your application's "bundle identifier" must match the App ID identifier.
-
+: Identifiers for various use. It is possible to register wildcard identifiers (i.e. `some.prefix.*`) which can be used with several apps. App IDs can contain Application Service information, like if the app enables Passbook integration, the Game Center etc. Such App IDs cannot be wildcard identifiers. For Application Services to function, your application's *bundle identifier* must match the App ID identifier.
 
 Devices
 : Each development device needs to be registered with their UDID (Unique Device IDentifier). See below for details on how to find the UDID of your device.
 
-
 Provisioning Profiles
 : Provisioning profiles associate certificates with App IDs and specific devices. It basically tells which app by what developer is allowed to be on what devices.
 
-
 When signing your games and apps in Defold, you need a valid certificate and a valid provisioning profile.
 
 ::: sidenote
-Some of the things you can do on the Member Center homepage you can also perform from inside the XCode development environment--if you have that installed.
+Some of the things you can do on the Member Center homepage you can also perform from inside the XCode development environment---if you have that installed.
 :::
 
 ## Device UDID
@@ -50,7 +43,7 @@ On the *Summary* page, locate the *Serial Number*.
 
 ![Device UDID step 1](images/ios/udid.png)
 
-Click the *Serial Number* once so the field changes into *UDID*. If you click repeatedly, several pieces of information about the device will show up. Just continue to click until *UDID* shows. Right-click the long UDID string and select *Copy* to copy the identifier to the clipboard so you can easily paste it into the UDID field when registering the device on Apple's Developer Member Center.
+Click the *Serial Number* once so the field changes into *UDID*. If you click repeatedly, several pieces of information about the device will show up. Just continue to click until *UDID* shows. Right-click the long UDID string and select <kbd>Copy</kbd> to copy the identifier to the clipboard so you can easily paste it into the UDID field when registering the device on Apple's Developer Member Center.
 
 ![Device UDID step 2](images/ios/udid_2.png)
 
@@ -66,7 +59,7 @@ Currently, at least one team member needs to run OS X and be a registered Apple
 
 To upload a signed development app to the Defold Dashboard, the following steps are required:
 
-- In the editor, select to *Project > Sign App...*
+- In the editor, select to <kbd>Project ▸ Sign iOS App...</kbd>
 - Select your code signing identity.
 - Browse for your mobile provisioning file.
 - Press the *Sign and upload* button.
@@ -82,7 +75,7 @@ Each project member can now:
 
 This video shows the whole process:
 
-youtube::T_igYdHubqA[]
+<iframe width="560" height="315" src="https://www.youtube.com/embed/T_igYdHubqA" frameborder="0" allowfullscreen></iframe>
 
 ## Launching the game
 
@@ -90,33 +83,30 @@ To launch your game on your iOS device, the Defold dev app and editor must be ab
 
 - Make sure the editor is up and running.
 - Launch the Defold dev app on the iOS device.
-- Select your device under *Project > Targets* in the editor.
-- Select *Project > Build And Launch* to run the game. It may take a while for the game to start since the game content is streamed to the device over the network.
-- While the game is running, you can use [hot reloading](/manuals/debugging#anchor-hr) as usual.
+- Select your device under <kbd>Project ▸ Targets</kbd> in the editor.
+- Select <kbd>Project ▸ Build And Launch</kbd> to run the game. It may take a while for the game to start since the game content is streamed to the device over the network.
+- While the game is running, you can use [hot reloading](/manuals/debugging#_hot_reloading) as usual.
 
 ## Creating an iOS application bundle
 
-You can also easily create a stand alone application bundle for your game from the editor. Simply select *Project > Bundle... > iOS Application...* from the menu.
+You can also easily create a stand alone application bundle for your game from the editor. Simply select <kbd>Project ▸ Bundle... ▸ iOS Application...</kbd> from the menu.
 
 ![Signing iOS bundle](images/ios/sign_bundle.png)
 
 Select your code signing identity and browse for your mobile provisioning file. Press *Package* and you will then be prompted to specify where on your computer the bundle will be created.
 
-![ipa iOS application bundle](images/ios/ipa_file.png)
+![ipa iOS application bundle](images/ios/ipa_file.png){.left}
 
-The editor writes an *.ipa* file which is an iOS application bundle. This file you can drag and drop into iTunes and it will install on your device during the next sync. You can specify what icon to use for the app, the launch screen image and so forth on the "game.project" project settings file.
+The editor writes an *.ipa* file which is an iOS application bundle. This file you can drag and drop into iTunes and it will install on your device during the next sync. You can specify what icon to use for the app, the launch screen image and so forth on the *game.project* project settings file.
 
 ## Troubleshooting
 
-## Unable to download application
-
-Make sure the signer has included your UDID in the mobile provisioning  that was used for signing the app.
-
-## Your device does not appear in the Targets menu
-
-Make sure that your device is connected to the same wifi network as your computer.
+Unable to download application
+: Make sure the signer has included your UDID in the mobile provisioning  that was used for signing the app.
 
-## The game does not start with a message about mis-matching versions
+Your device does not appear in the Targets menu
+: Make sure that your device is connected to the same wifi network as your computer.
 
-This happens when you have upgraded the editor to the latest version. You need to *Sign and Upload* the app again which creates a new dev app from the current engine version. Download the app again from the dashboard on your device.
+The game does not start with a message about mis-matching versions
+: This happens when you have upgraded the editor to the latest version. You need to sign the app again (<kbd>Project ▸ Sign iOS App...</kbd>) which creates a new dev app from the current engine version. Then download the new app from the dashboard on your device.
 

+ 26 - 37
docs/en/manuals/label.md

@@ -1,7 +1,11 @@
-Label
-=====
+---
+title: Label text components in Defold
+brief: This manual explains how to use label components to use text with game objects in the game world.
+---
 
-It is quite common that you want to attach textual content to a game object. While Defold's GUI support is advanced, using it to glue information to in game objects can be a hassle. The *Label* component exists to allow you to attach text content to any game object.
+# Label
+
+The *Label* component exists to allow you to attach text content to any game object. While Defold's GUI support is advanced, using it to glue information to in game objects can be tricky since GUI:s does not live in the game world.
 
 ## Creating a label
 
@@ -9,11 +13,11 @@ A label component renders a piece of text on screen, in game space. By default i
 
 To create a Label component, either:
 
-* Add a new component in-place in an existing game object by right clicking the game object and select *Add Component*. Select *Label* and press *OK*.
-+
-![Add label](images/label/add_label.png)
-+
-* If you want to instanciate several labels from the same template you can alternatively make a new *Label File* (right click a folder in the *Project Explorer* and select "New > Label File") and then add that to one or more game objects by right clicking the game objects and select *Add Component From File* and select your new label file.
+1. Add a new component in-place in an existing game object by right clicking the game object and select *Add Component*. Select *Label* and press *OK*.
+
+  ![Add label](images/label/add_label.png)
+
+2. If you want to instanciate several labels from the same template you can alternatively make a new *Label File* (right click a folder in the *Project Explorer* and select <kbd>New ▸ Label File</kbd>) and then add that to one or more game objects by right clicking the game objects and select <kbd>Add Component From File</kbd> and select your new label file.
 
 The new label component has a set of special properties exposed that you can change in the editor or in runtime.
 
@@ -22,57 +26,44 @@ The new label component has a set of special properties exposed that you can cha
 *Size*
 : The size of the text bounding box. If *Line Break* is set below this governs at what point the text should break.
 
-
 *Text*
 : This property contains the text displayed.
 
-
 *Color*
 : The color of the text.
 
-
 *Alpha*
 : The alpha value of the text.
 
-
 *Pivot*
 : The pivot of the text. Use this to change text alignment (see below).
 
-
 *Line Break*
 : Text alignment follows the pivot setting and setting the this property allows the text to flow over several lines. The width of the component determines where the text will wrap. Note that there has to be a space in the text for it to break.
 
-
 *Leading*
 : A scaling number for the line spacing. A value of 0 gives no line spacing. Defaults to 1.
 
-
 *Tracking*
 : A scaling number for the letter spacing. Defaults to 0.
 
-
 *Outline*
 : The color of the outline.
 
-
 *Outline Alpha*
 : The value of the alpha channel for the generated outline. 0.0--1.0.
 
-
 *Shadow*
 : The color of the shadow.
 
-
 *Shadow Alpha*
 : The value of the alpha channel for the generated shadow. 0.0--1.0.
 
-
 *Font*
 : The font resource to use for this label.
 
-
 ::: sidenote
-The default material has shadow rendering disabled for performance reasons.
+Note that the default material has shadow rendering disabled for performance reasons.
 :::
 
 ## Alignment
@@ -80,14 +71,13 @@ The default material has shadow rendering disabled for performance reasons.
 By setting the pivot you can change the adjust mode for the text.
 
 *Center*
-: If the pivot is set to "Center", "North" or "South", the text is center-aligned.
+: If the pivot is set to `Center`, `North` or `South`, the text is center-aligned.
 
 *Left*
-: If the pivot is set to any of the "West" modes, the text is left-aligned.
+: If the pivot is set to any of the `West` modes, the text is left-aligned.
 
 *Right*
-: If the pivot is set to any of the "East" modes, the text is right-aligned.
-
+: If the pivot is set to any of the `East` modes, the text is right-aligned.
 
 ![Text alignment](images/label/align.png)
 
@@ -95,21 +85,20 @@ By setting the pivot you can change the adjust mode for the text.
 
 You can manipulate labels in runtime by reading and setting the label text as well as the various properties.
 
-color
-: [type]#vector4# The label color
-
-outline
-: [type]#vector4# The label outline color
+`color`
+: The label color (`vector4`)
 
-scale
-: [type]#number | vector3# The label scale, either a [type]#number# for uniform scaling or a [type]#vector3# for individual scaling along each axis.
+`outline`
+: The label outline color (`vector4`)
 
-shadow
-: [type]#vector4# The label shadow color
+`scale`
+: The label scale, either a `number` for uniform scaling or a `vector3` for individual scaling along each axis.
 
-size
-: [type]#vector3# The label size
+`shadow`
+: The label shadow color (`vector4`)
 
+`size`
+: The label size (`vector3`)
 
 ```lua
 function init(self)

+ 14 - 12
docs/en/manuals/layouts.md

@@ -1,14 +1,17 @@
-= Layouts
-:location: documentation manuals gui
-:type: manual
+---
+title: GUI layouts in Defold
+brief: Defold supports GUIs that automatically adapt to screen orientation changes on mobile devices. This document explains how the feature works.
+---
 
-Defold supports GUIs that automatically adapt to screen orientation changes on mobile devices. Using this feature allows you to design GUIs that adapt to the orientation and aspect ratio of the screen. This document explains how the feature works.
+# Layouts
+
+Defold supports GUIs that automatically adapt to screen orientation changes on mobile devices. Using this feature allows you to design GUIs that adapt to the orientation and aspect ratio of the screen.
 
 The dynamic layout of GUI:s works by matching display profiles to the current width and height of the display that the game is running on.
 
 ## Display profiles
 
-Each project contains a "builtins/render/default.display_profiles" with two profiles:
+Each project contains a `builtins/render/default.display_profiles` with two profiles:
 
 ![Default display profiles](images/layouts/layouts_display_profiles.png)
 
@@ -18,8 +21,7 @@ Landscape
 Portrait
 : 720 pixels wide and 1280 pixels high
 
-
-For devices with an aspect ratio of 16:9 these profiles suffice. Even if the actual physical dimensions of the screen is higher or lower, the engine will automatically select the a profile that is closest. If you need to alter the default profiles, simply copy the built in file to a new place within your project or create a new file, then change the setting in "project.settings" so the engine knows which profiles-file to use:
+For devices with an aspect ratio of 16:9 these profiles are probably enough. Even if the actual physical dimensions of the screen is higher or lower, the engine will automatically select the a profile that is closest. If you need to alter the default profiles, simply copy the built in file to a new place within your project or create a new file, then change the setting in `project.settings` so the engine knows which profiles-file to use:
 
 ![Project settings](images/layouts/layouts_project_settings.png)
 
@@ -31,7 +33,7 @@ The current development app for iOS does not respect the *dynamic_orientation* s
 
 ## GUI layouts
 
-The defined display profiles can then be used to create layouts in the GUI editor. When working in the editor, a *Default* layout is used by default. If you have not added any additional layout(s), the default layout will be used. To add a new layout, right-click the *Layouts* icon in the *Outline* view and select the menu:Layout[] menu item:
+The defined display profiles can then be used to create layouts in the GUI editor. When working in the editor, a *Default* layout is used by default. If you have not added any additional layout(s), the default layout will be used. To add a new layout, right-click the *Layouts* icon in the *Outline* view and select the <kbd>Layout ▸ ...</kbd> menu item:
 
 ![Add layout to scene](images/layouts/layouts_add.png)
 
@@ -55,13 +57,13 @@ When the engine switches layout as a result of device rotation, a message `layou
 
 ```lua
 function on_message(self, message_id, message, sender)
-	if message_id == hash("layout_changed") and message.id == hash("Landscape") then
-		-- switching layout to landscape
+    if message_id == hash("layout_changed") and message.id == hash("Landscape") then
+        -- switching layout to landscape
     ...
-	elseif message_id == hash("layout_changed") and message.id == hash("Portrait") then
+    elseif message_id == hash("layout_changed") and message.id == hash("Portrait") then
     -- switching layout to portrait
     ...
-	end
+    end
 end
 ```
 

+ 16 - 17
docs/en/manuals/libraries.md

@@ -1,9 +1,11 @@
-Libraries
-=========
-:location: documentation manuals project
-:type: manual
+---
+title: Working with library projects in Defold
+brief: The Libraries feature allows you to share assets between projects. This manual explains how it works.
+---
 
-The Libraries feature allows you to share assets between projects. It is a simple but very powerful mechanism that you can use in your workflow in a number of ways. This manual explains how it works.
+# Libraries
+
+The Libraries feature allows you to share assets between projects. It is a simple but very powerful mechanism that you can use in your workflow in a number of ways.
 
 Libraries is useful for the following uses:
 
@@ -13,7 +15,7 @@ Libraries is useful for the following uses:
 
 ## Setting up library sharing
 
-Suppose you want to build a library containing shared sprites and tile sources. You start by setting up a new project in the Defold dashboard (see the [Workflow documentation](/manuals/workflow) for details). Decide what folders you want to share from the project and add the names of those folders to the "include_dirs" property in the Project settings. If you want to list more than one folder, separate the names with spaces:
+Suppose you want to build a library containing shared sprites and tile sources. You start by setting up a new project in the Defold dashboard (see the [Workflow documentation](/manuals/workflow) for details). Decide what folders you want to share from the project and add the names of those folders to the *include_dirs* property in the Project settings. If you want to list more than one folder, separate the names with spaces:
 
 ![Include dirs](images/libraries/libraries_include_dirs.png)
 
@@ -27,11 +29,11 @@ Libraries are referred to via a standard URL. Each project has a Library URL tha
 
 ## Setting up library dependencies
 
-Open the project you would like to have access to the library. In the Project settings, add the URL to the "dependencies" property. You can specify multiple dependent projects if you want. Just list them separated by spaces:
+Open the project you would like to have access to the library. In the project settings, add the URL to the *dependencies* property. You can specify multiple dependent projects if you want. Just list them separated by spaces:
 
 ![Dependencies](images/libraries/libraries_dependencies.png)
 
-Now, select *Project > Fetch Libraries* to update the Library dependencies. This happens automatically whenever you open a project so you will only need to do this if the dependencies change without re-opening the project. This happens if you add or remove dependency libraries or if one of the dependency library projects are changed and synchronized by someone.
+Now, select <kbd>Project ▸ Fetch Libraries</kbd> to update library dependencies. This happens automatically whenever you open a project so you will only need to do this if the dependencies change without re-opening the project. This happens if you add or remove dependency libraries or if one of the dependency library projects are changed and synchronized by someone.
 
 ![Fetch Libraries](images/libraries/libraries_fetch_libraries.png)
 
@@ -39,19 +41,17 @@ Now the folders that you shared appears in the Project Explorer and you can use
 
 ![Library setup done](images/libraries/libraries_done.png)
 
-## Troubleshooting
-
 ## Broken references
 
 Library sharing only include files that are located under the shared folder. If you create something that reference assets that are located outside of the shared hierarchy, the referece paths will be broken.
 
-In the example, the library folder "shared_sprites" contain an atlas. The PNG images that are gathered in that atlas, however, live in a folder in the library project that is not shared.
+In the example, the library folder *shared_sprites* contain an atlas. The PNG images that are gathered in that atlas, however, live in a folder in the library project that is not shared.
 
 ![Bad references](images/libraries/libraries_bad_references.png)
 
 If you open the atlas in the Text Editor (as opposed to the default Atlas Editor), you can see the paths of the gathered images:
 
-----
+```txt
 images {
   image: "/cards_example/images/clubmaster.png"
 }
@@ -67,13 +67,12 @@ images {
 images {
   image: "/cards_example/images/heart.png"
 }
-----
+```
 
-It now becomes clear what the problem is. The atlas file references these PNG images to a path that does not exist in the local project. You can problem by adding the "/cards_example/images" folder to the list of shared folders in the library project. Another option is to create a local folder "/cards_example/images" and drop PNG files with the right names there.
+It should now be clear what the problem is. The atlas file references these PNG images to a path that does not exist in the local project. You can fix the problem by adding the */cards_example/images* folder to the list of shared folders in the library project. Another option is to create a local folder */cards_example/images* and drop PNG files with the right names there.
 
 ## Name collisions
 
-Since you can list several project URL:s in the "dependencies" Project setting you might encounter a name collision. This happens if two or more of the dependent projects share a folder with the same name in the "include_dirs" Project setting.
-
-Defold resolves name collisions by simply ignoring all but the last reference to folders of the same name in the order the project URL:s are specified in the "dependencies" list. For instance. If you list 3 library project URL:s in the dependencies and all of them share a folder named "items", only one "items" folder will show up: the one belonging to the project that is last in the URL list.
+Since you can list several project URL:s in the *dependencies* project setting you might encounter a name collision. This happens if two or more of the dependent projects share a folder with the same name in the *include_dirs* project setting.
 
+Defold resolves name collisions by simply ignoring all but the last reference to folders of the same name in the order the project URL:s are specified in the *dependencies* list. For instance. If you list 3 library project URL:s in the dependencies and all of them share a folder named *items*, only one *items* folder will show up---the one belonging to the project that is last in the URL list.

+ 123 - 122
docs/en/manuals/live-update.md

@@ -1,5 +1,9 @@
-Live update
-===========
+---
+title: Live update content in Defold
+brief: The Live update functionality provides a mechanism allowing the runtime to fetch and store resources to the application bundle that was intentionally left out of the bundle at build time. This manual explains how it works.
+---
+
+# Live update
 
 When bundling a game, Defold packs all the game resources into the resulting platform specific package. In most cases this is preferred since the running engine has instant access to all resources and can load them swiftly from storage. However, there are instances where you might want to postpone the loading of resources to a later stage. For instance:
 
@@ -15,33 +19,32 @@ Suppose we are making a game containing large, high resolution image resources.
 
 ![Mona Lisa collection](images/live-update/mona-lisa.png)
 
-To have the engine load such a collection dynamically, we can simply add a collection proxy component and point it to "monalisa.collection". Now the game can choose when to load the content in the collection from storage into memory by sending a "load" message to the collection proxy. However, we want to go further and control the loading of the resources contained in the collection ourselves.
+To have the engine load such a collection dynamically, we can simply add a collection proxy component and point it to *monalisa.collection*. Now the game can choose when to load the content in the collection from storage into memory by sending a `load` message to the collection proxy. However, we want to go further and control the loading of the resources contained in the collection ourselves.
 
-This is done by simply checking the *Exclude* checkbox in the collection proxy properties, telling the bundler to leave any content in "monalisa.collection" out when creating an application bundle.
+This is done by simply checking the *Exclude* checkbox in the collection proxy properties, telling the bundler to leave any content in *monalisa.collection* out when creating an application bundle.
 
 ![Collection proxy excluded](images/live-update/proxy-excluded.png)
 
 ## Live update settings
 
-When the bundler creates an applicatin bundle, it needs to store any excluded resources somewhere. The project settings for Live update governs the location for those resources. The settings is found under "Project > Live update Settings...".
+When the bundler creates an applicatin bundle, it needs to store any excluded resources somewhere. The project settings for Live update governs the location for those resources. The settings is found under <kbd>Project ▸ Live update Settings...</kbd>.
 
 ![Live update settings](images/live-update/aws-settings.png)
 
 There are two ways Defold can store the settings. Choose the method in the *Mode* dropdown in the settings window:
 
-Amazon
+`Amazon`
 : This option tells Defold to automatically upload excluded resources to an Amazon Web Service (AWS) S3 bucket. Fill in your AWS *Credential profile* name, select the appropriate *Bucket* and provide a *Prefix* name. [See below for details how to set up an AWS account](#_setting_up_amazon_web_service).
 
-
-Zip
+`Zip`
 : This option tells Defold to create a Zip archive file with any excluded resources. The archive is saved at location of the *Export path* setting.
 
 
 ## Scripting with excluded collection proxies
 
-A collection proxy that has been excluded from bundling works as a normal collection proxy, with one important difference. Sending it a "load" message while it still has resources not available in the bundle storage will cause it to fail.
+A collection proxy that has been excluded from bundling works as a normal collection proxy, with one important difference. Sending it a `load` message while it still has resources not available in the bundle storage will cause it to fail.
 
-So before we send it a "load", we need to check if there are any missing resources. If there are, we have to download them and then store them. The following example code assumes that the resources are stored on Amazon S3, in a bucket called "my-game-bucket" with the prefix "my-resources".
+So before we send it a `load`, we need to check if there are any missing resources. If there are, we have to download them and then store them. The following example code assumes that the resources are stored on Amazon S3, in a bucket called "my-game-bucket" with the prefix `my-resources`.
 
 ```lua
 function init(self)
@@ -88,15 +91,15 @@ function on_message(self, message_id, message, sender)
         local manifest = resource.get_current_manifest() -- <4>
         local base_url = "https://my-game-bucket.s3.amazonaws.com/my-resources/" -- <5>
         http.request(base_url .. message.resource_hash, "GET", function(self, id, response)
-                if response.status == 200 or response.status == 304 then -- <6>
-                    -- We got the response ok.
-                    print("storing " .. message.resource_hash)
-                    resource.store_resource(manifest, response.response, message.resource_hash, resource_store_response) -- <7>
-                else
-                    -- ERROR! Failed to download resource!
-                    print("Failed to download resource: " .. message.resource_hash)
-                end
-            end)
+            if response.status == 200 or response.status == 304 then -- <6>
+                -- We got the response ok.
+                print("storing " .. message.resource_hash)
+                resource.store_resource(manifest, response.response, message.resource_hash, resource_store_response) -- <7>
+            else
+                -- ERROR! Failed to download resource!
+                print("Failed to download resource: " .. message.resource_hash)
+            end
+        end)
     elseif message_id == hash("proxy_loaded") then
         msg.post(sender, "init")
         msg.post(sender, "enable")
@@ -116,7 +119,7 @@ With the loading code in place, we can test the application. However, running it
 
 ## Bundling with Live update
 
-To bundle with Live update is easy. Select "Project > Bundle" and then the platform you want to create an application bundle for. This opens the bundling dialog:
+To bundle with Live update is easy. Select <kbd>Project ▸ Bundle ▸ ...</kbd> and then the platform you want to create an application bundle for. This opens the bundling dialog:
 
 ![Bundle Live application](images/live-update/bundle-app.png)
 
@@ -130,122 +133,122 @@ To use the Defold Live update feature together with Amazon services you need an
 
 This section will explain how to create a new user with limited access on Amazon Web Services that can be used together with the Defold editor to automatically upload Live update resources when you bundle your game, as well as how to configure Amazon S3 to allow game clients to retrieve resources. For additional information about how you can configure Amazon S3, please see the [Amazon S3 documentation](http://docs.aws.amazon.com/AmazonS3/latest/dev/Welcome.html).
 
-## 1. Create a bucket for Live update resources
+1. Create a bucket for Live update resources
 
-Open up the `Services` menu and select `S3` which is located under the _Storage_ category ([Amazon S3 Console](https://console.aws.amazon.com/s3)). You will see all your existing buckets together with the option to create a new bucket. Though it is possible to use an existing bucket, we recommend that you create a new bucket for Live update resources so that you can easily restrict access.
+    Open up the `Services` menu and select `S3` which is located under the _Storage_ category ([Amazon S3 Console](https://console.aws.amazon.com/s3)). You will see all your existing buckets together with the option to create a new bucket. Though it is possible to use an existing bucket, we recommend that you create a new bucket for Live update resources so that you can easily restrict access.
 
-![Create a bucket](images/live-update/01-create-bucket.png)
+    ![Create a bucket](images/live-update/01-create-bucket.png)
 
-## 2. Add a bucket policy to your bucket
+2. Add a bucket policy to your bucket
 
-Select the bucket you wish to use, open the *Properties* panel and expand the *Permissions* option within the panel. Open up the bucket policy by clicking on the *Add bucket policy* button. The bucket policy in this example will allow an anonymous user to retrieve files from the bucket, which will allow a game client to download the Live update resources that are required by the game. For additional information about bucket policies, please see [the Amazon documentation](https://docs.aws.amazon.com/AmazonS3/latest/dev/using-iam-policies.html).
+    Select the bucket you wish to use, open the *Properties* panel and expand the *Permissions* option within the panel. Open up the bucket policy by clicking on the *Add bucket policy* button. The bucket policy in this example will allow an anonymous user to retrieve files from the bucket, which will allow a game client to download the Live update resources that are required by the game. For additional information about bucket policies, please see [the Amazon documentation](https://docs.aws.amazon.com/AmazonS3/latest/dev/using-iam-policies.html).
 
-```json
-{
-    "Version": "2012-10-17",
-    "Statement": [
-        {
-            "Sid": "AddPerm",
-            "Effect": "Allow",
-            "Principal": "*",
-            "Action": "s3:GetObject",
-            "Resource": "arn:aws:s3:::defold-liveupdate-example/*"
-        }
-    ]
-}
-```
+    ```json
+    {
+        "Version": "2012-10-17",
+        "Statement": [
+            {
+                "Sid": "AddPerm",
+                "Effect": "Allow",
+                "Principal": "*",
+                "Action": "s3:GetObject",
+                "Resource": "arn:aws:s3:::defold-liveupdate-example/*"
+            }
+        ]
+    }
+    ```
 
-![Bucket policy](images/live-update/02-bucket-policy.png)
+    ![Bucket policy](images/live-update/02-bucket-policy.png)
 
-## 3. Add a CORS configuration to your bucket (Optional)
+3. Add a CORS configuration to your bucket (Optional)
 
-[Cross-Origin Resource Sharing (CORS)](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing) is a mechanism that allows a website to retrieve a resource from a different domain using JavaScript. If you intend to publish your game as an HTML5 client, you will need to add a CORS configuration to your bucket.
+    [Cross-Origin Resource Sharing (CORS)](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing) is a mechanism that allows a website to retrieve a resource from a different domain using JavaScript. If you intend to publish your game as an HTML5 client, you will need to add a CORS configuration to your bucket.
 
-Select the bucket you wish to use, open the *Properties* panel and expand the *Permissions* option within the panel. Open up the bucket policy by clicking on the *Add CORS Configuration* button. The configuration in this example will allow access from any website by specifying a wildcard domain, though it is possible to restrict this access further if you know on which domains you will make you game available. For additional information about Amazon CORS configuration, please see [the Amazon documentation](https://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html).
+    Select the bucket you wish to use, open the *Properties* panel and expand the *Permissions* option within the panel. Open up the bucket policy by clicking on the *Add CORS Configuration* button. The configuration in this example will allow access from any website by specifying a wildcard domain, though it is possible to restrict this access further if you know on which domains you will make you game available. For additional information about Amazon CORS configuration, please see [the Amazon documentation](https://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html).
 
-```xml
-<?xml version="1.0" encoding="UTF-8"?>
-<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
-    <CORSRule>
-        <AllowedOrigin>*</AllowedOrigin>
-        <AllowedMethod>GET</AllowedMethod>
-    </CORSRule>
-</CORSConfiguration>
-```
+    ```xml
+    <?xml version="1.0" encoding="UTF-8"?>
+    <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
+        <CORSRule>
+            <AllowedOrigin>*</AllowedOrigin>
+            <AllowedMethod>GET</AllowedMethod>
+        </CORSRule>
+    </CORSConfiguration>
+    ```
 
-![CORS configuration](images/live-update/03-cors-configuration.png)
-
-## 4. Create IAM policy
-
-Open up the *Services* menu and select *IAM* which is located under the _Security, Identity & Compliance_ category ([Amazon IAM Console](https://console.aws.amazon.com/iam)). Select *Policies* in the menu to the left and you will see all your existing policies together with the option to create a new policy.
-
-Click the button *Create Policy*, and the choose to _Create Your Own Policy_. The policy in this example will allow a user to list all buckets, which is only required when configuring a Defold project for Live update. It will also allow the user to get the Access Control List (ACL) and upload resources to the specific bucket used for Live update resources. For additional information about Amazon Identity and Access Management (IAM), please see [the Amazon documentation](http://docs.aws.amazon.com/IAM/latest/UserGuide/access.html).
-
-```json
-{
-    "Version": "2012-10-17",
-    "Statement": [
-        {
-            "Effect": "Allow",
-            "Action": [
-                "s3:ListAllMyBuckets"
-            ],
-            "Resource": "arn:aws:s3:::*"
-        },
-        {
-            "Effect": "Allow",
-            "Action": [
-                "s3:GetBucketAcl"
-            ],
-            "Resource": "arn:aws:s3:::defold-liveupdate-example"
-        },
-        {
-            "Effect": "Allow",
-            "Action": [
-                "s3:PutObject"
-            ],
-            "Resource": "arn:aws:s3:::defold-liveupdate-example/*"
-        }
-    ]
-}
-```
+    ![CORS configuration](images/live-update/03-cors-configuration.png)
 
-![IAM policy](images/live-update/04-create-policy.png)
+4. Create IAM policy
 
-## 5. Create a user for programmatic access
+    Open up the *Services* menu and select *IAM* which is located under the _Security, Identity & Compliance_ category ([Amazon IAM Console](https://console.aws.amazon.com/iam)). Select *Policies* in the menu to the left and you will see all your existing policies together with the option to create a new policy.
 
-Open up the *Services* menu and select *IAM* which is located under the _Security, Identity & Compliance_ category ([Amazon IAM Console](https://console.aws.amazon.com/iam)). Select *Users* in the menu to the left and you will see all your existing users together with the option to add a new user. Though it is possible to use an existing user, we recommend that you add a new user for Live update resources so that you can easily restrict access.
+    Click the button *Create Policy*, and the choose to _Create Your Own Policy_. The policy in this example will allow a user to list all buckets, which is only required when configuring a Defold project for Live update. It will also allow the user to get the Access Control List (ACL) and upload resources to the specific bucket used for Live update resources. For additional information about Amazon Identity and Access Management (IAM), please see [the Amazon documentation](http://docs.aws.amazon.com/IAM/latest/UserGuide/access.html).
 
-Click the button *Add User*, provide a username and choose *Programmatic access* as *Access type*, then press *Next: Permissions*. Select *Attach existing policies directly* and choose the policy you created in step 4.
+    ```json
+    {
+        "Version": "2012-10-17",
+        "Statement": [
+            {
+                "Effect": "Allow",
+                "Action": [
+                    "s3:ListAllMyBuckets"
+                ],
+                "Resource": "arn:aws:s3:::*"
+            },
+            {
+                "Effect": "Allow",
+                "Action": [
+                    "s3:GetBucketAcl"
+                ],
+                "Resource": "arn:aws:s3:::defold-liveupdate-example"
+            },
+            {
+                "Effect": "Allow",
+                "Action": [
+                    "s3:PutObject"
+                ],
+                "Resource": "arn:aws:s3:::defold-liveupdate-example/*"
+            }
+        ]
+    }
+    ```
 
-When you've completed the process you will be provided with an *Access key ID* and a *Secret access key*.
+    ![IAM policy](images/live-update/04-create-policy.png)
 
-::: important
-It is *very important* that you store those keys since you will not be able to retrieve them from Amazon after you leave the page.
-:::
+5. Create a user for programmatic access
 
-## 6. Create a credentials profile file
+    Open up the *Services* menu and select *IAM* which is located under the _Security, Identity & Compliance_ category ([Amazon IAM Console](https://console.aws.amazon.com/iam)). Select *Users* in the menu to the left and you will see all your existing users together with the option to add a new user. Though it is possible to use an existing user, we recommend that you add a new user for Live update resources so that you can easily restrict access.
 
-At this point you should have created a bucket, configured a bucket policy, added a CORS configuration, created a user policy and created a new user. The only thing that remains is to create a [credentials profile file](https://aws.amazon.com/blogs/security/a-new-and-standardized-way-to-manage-credentials-in-the-aws-sdks) so that the Defold editor can access the bucket on your behalf.
+    Click the button *Add User*, provide a username and choose *Programmatic access* as *Access type*, then press *Next: Permissions*. Select *Attach existing policies directly* and choose the policy you created in step 4.
 
-Create a new directory ".aws" in your home folder, and create a file called "credentials" within the new directory.
+    When you've completed the process you will be provided with an *Access key ID* and a *Secret access key*.
 
-```bash
-$ mkdir ~/.aws
-$ touch ~/.aws/credentials
-```
+    ::: important
+    It is *very important* that you store those keys since you will not be able to retrieve them from Amazon after you leave the page.
+    :::
 
-The file "~/.aws/credentials" will contain your credentials to access Amazon Web Services through programmatic access and is a standardised way to manage AWS credentials. Open the file in a text editor and enter your *Access key ID* and *Secret access key* in the below format.
+6. Create a credentials profile file
 
-```ini
-[defold-liveupdate-example]
-aws_access_key_id = <Access key ID>
-aws_secret_access_key = <Secret access key>
-```
+    At this point you should have created a bucket, configured a bucket policy, added a CORS configuration, created a user policy and created a new user. The only thing that remains is to create a [credentials profile file](https://aws.amazon.com/blogs/security/a-new-and-standardized-way-to-manage-credentials-in-the-aws-sdks) so that the Defold editor can access the bucket on your behalf.
+
+    Create a new directory *.aws* in your home folder, and create a file called *credentials* within the new directory.
+
+    ```bash
+    $ mkdir ~/.aws
+    $ touch ~/.aws/credentials
+    ```
 
-The identifier specified within the brackets, in this example _defold-liveupdate-example_, is the same identifier that you should provide when configuring your projects Live update settings in the Defold editor.
+    The file *~/.aws/credentials* will contain your credentials to access Amazon Web Services through programmatic access and is a standardised way to manage AWS credentials. Open the file in a text editor and enter your *Access key ID* and *Secret access key* in the below format.
 
-![Live update settings](images/live-update/05-liveupdate-settings.png)
+    ```ini
+    [defold-liveupdate-example]
+    aws_access_key_id = <Access key ID>
+    aws_secret_access_key = <Secret access key>
+    ```
+
+    The identifier specified within the brackets, in this example _defold-liveupdate-example_, is the same identifier that you should provide when configuring your projects Live update settings in the Defold editor.
+
+    ![Live update settings](images/live-update/05-liveupdate-settings.png)
 
 ## The manifest
 
@@ -259,24 +262,22 @@ Currently, only the initial build manifest is available. The ability to store ne
 
 ## Development caveats
 
-## Debugging
-
-When running a bundled version of your game, you don't have direct access to a console. This causes problems for debugging. However, you can run the application from command line or by double clicking the executable in the bundle directly:
-
-![Running a bundle application](images/live-update/run-bundle.png)
+Debugging
+: When running a bundled version of your game, you don't have direct access to a console. This causes problems for debugging. However, you can run the application from command line or by double clicking the executable in the bundle directly:
 
-Now the game starts with a shell window that will output any `print()` statements:
+  ![Running a bundle application](images/live-update/run-bundle.png)
 
-![Console output](images/live-update/run-bundle-console.png)
+  Now the game starts with a shell window that will output any `print()` statements:
 
-## Forcing re-download of resources
+  ![Console output](images/live-update/run-bundle-console.png)
 
-When an application stores resources, they end up on disk on the local computer or handheld device. If you restart the application, the resources are there and ready. When developing you sometimes want to remove resources and force the application to download them again. The path returned from the function `sys.get_save_file()` gives the location where Defold stores resources. In that folder, Defold creates a folder with the name of the hash of the created bundle. If you delete the files in this folder, the application will invalidate the resources from the manifest and you can download and store them again.
+Forcing re-download of resources
+: When an application stores resources, they end up on disk on the local computer or handheld device. If you restart the application, the resources are there and ready. When developing you sometimes want to remove resources and force the application to download them again. The path returned from the function `sys.get_save_file()` gives the location where Defold stores resources. In that folder, Defold creates a folder with the name of the hash of the created bundle. If you delete the files in this folder, the application will invalidate the resources from the manifest and you can download and store them again.
 
-![Local storage](images/live-update/local-storage.png)
+  ![Local storage](images/live-update/local-storage.png)
 
 ## Known issues
 
 - At the moment you have access only to the manifest that is created at build-time. In the near future you will be able to store new manifests. This will allow you to modify existing resources, or add new resources to the game through Live update.
-- [resource.store_resource()](/ref/resource/#resource.store_resource) is currently blocking the main thread, meaning that if you store large resources you will experience hitches.
+- [`resource.store_resource()`](/ref/resource/#resource.store_resource) is currently blocking the main thread, meaning that if you store large resources you will experience hitches.
 

+ 362 - 381
docs/en/manuals/lua.md

@@ -1,15 +1,20 @@
-Lua in Defold
-=============
-:draft: Something something else.
+---
+title: Lua programming in Defold
+brief: This manual will give a quick introduction to the basics of Lua programming in general and what you need to consider when working with Lua in Defold.
+---
+
+# Lua in Defold
 
 The Defold engine has the Lua language embedded for scripting. Lua is a lightweight dynamic language that is powerful, fast, and easy to embed. It is widely used as a videogame scripting language. Lua programs are written in a simple procedural syntax. The language is dynamically typed and is run by a bytecode interpreter. It features automatic memory management with incremental garbage collection.
 
-This manual will give a fast introduction to the basics of Lua programming in general and what you need to consider when working with Lua in Defold. If you have some experience with Python, Perl, Ruby, Javascript or a similar dynamic language you will get going pretty quick. If you are totally new to programming you might want to start with a Lua book aimed at beginners. There are plenty to choose from.
+This manual will give a quick introduction to the basics of Lua programming in general and what you need to consider when working with Lua in Defold. If you have some experience with Python, Perl, Ruby, Javascript or a similar dynamic language you will get going pretty quick. If you are totally new to programming you might want to start with a Lua book aimed at beginners. There are plenty to choose from.
 
 ## Lua versions
 We aim to keep Defold the same across all platforms, but we currently have a small discrepancy between Lua versions. For HTML5 and iOS 64 bit platforms we use Lua 5.1 but for other platforms we use LuaJIT. LuaJIT is based on 5.1 but contains a few additional features.
 
-*To keep your game working cross platform we suggest you stick to Lua 5.1 features.*
+::: important
+To keep your game working cross platform we suggest you stick to Lua 5.1 features.
+:::
 
 ## Lua books and resources
 
@@ -42,347 +47,332 @@ end
 
 Lua is dynamically typed which means that variables do not have types, but values do. Unlike in typed languages, you can assign any value to any variable as you like. There are eight basic types in Lua:
 
-nil
+`nil`
 : This type only has the value `nil`. It usually represents the absence of a useful value, for example unassigned variables.
 
-
-```lua
-print(my_var) -- will print 'nil' since 'my_var' is not yet assigned a value
-```
+  ```lua
+  print(my_var) -- will print 'nil' since 'my_var' is not yet assigned a value
+  ```
 
 boolean
 : Has either the value `true` or `false`. Conditions that are `false` or `nil` are made false. Any other value makes it true.
 
-
-```lua
-flag = true
-if flag then
-    print("flag is true")
-else
-    print("flag is false")
-end
-
-if my_var then
-    print("my_var is not nil nor false!")
-end
-
-if not my_var then
-    print("my_var is either nil or false!")
-end
-```
+  ```lua
+  flag = true
+  if flag then
+      print("flag is true")
+  else
+      print("flag is false")
+  end
+  
+  if my_var then
+      print("my_var is not nil nor false!")
+  end
+  
+  if not my_var then
+      print("my_var is either nil or false!")
+  end
+  ```
 
 number
 : Numbers are internally represented as either 64 bit _integers_ or 64 bit _floating point_ numbers. Lua automatically converts between these representations as needed so you generally don't have to worry about it.
 
-
-```lua
-print(10) --> prints '10'
-print(10.0) --> '10'
-print(10.000000000001) --> '10.000000000001'
-
-a = 5 -- integer
-b = 7/3 -- float
-print(a - b) --> '2.6666666666667'
-```
+  ```lua
+  print(10) --> prints '10'
+  print(10.0) --> '10'
+  print(10.000000000001) --> '10.000000000001'
+  
+  a = 5 -- integer
+  b = 7/3 -- float
+  print(a - b) --> '2.6666666666667'
+  ```
 
 string
 : Strings are immutable sequences of bytes that can contain any 8-bit value, including embedded zeros (`\0`). Lua makes no assumptions about the contents of a string so you can store any data you like in them. String literals are written in single or double quotes. Lua converts between numbers and strings at runtime. Strings can be concatenated with the `..` operator.
 
-
-Strings can contain the following C-style escape sequences:
-
-|===
-| \a | bell
-| \b | back space
-| \f | form feed
-| \n | newline
-| \r | carriage return
-| \t | horizontal tab
-| \v | vertical tab
-| \\ | backslash
-| \" | double quote
-| \' | single quote
-| \[ | left square bracket
-| \] | right square bracket
-| \ddd | character denoted by its numeric value where ddd is a sequence of up to three _decimal_ digits
-|===
-
-```lua
-my_string = "hello"
-another_string = 'world'
-print(my_string .. another_string) --> "helloworld"
-
-print("10.2" + 1) --> 11.2
-print(my_string + 1) -- error, can't convert "hello"
-print(my_string .. 1) --> "hello1"
-
-print("one\nstring") --> one
-                     --> string
-
-print("\097bc") --> "abc"
-
-multi_line_string = [[
-Here is a chunk of text that runs over several lines. This is all
-put into the string and is sometimes very handy.
-]]
-```
+  Strings can contain the following C-style escape sequences:
+
+  | Sequence | Character |
+  | -------- | --------- |
+  | `\a`     | bell       |
+  | `\b`     | back space |
+  | `\f`     | form feed  |
+  | `\n`     | newline    |
+  | `\r`     | carriage return |
+  | `\t`     | horizontal tab |
+  | `\v`     | vertical tab   |
+  | `\\`     | backslash      |
+  | `\"`     | double quote   |
+  | `\'`     | single quote   |
+  | `\[`     | left square bracket    |
+  | `\]`     | right square bracket   |
+  | `\ddd`   | character denoted by its numeric value where ddd is a sequence of up to three _decimal_ digits |
+
+  ```lua
+  my_string = "hello"
+  another_string = 'world'
+  print(my_string .. another_string) --> "helloworld"
+  
+  print("10.2" + 1) --> 11.2
+  print(my_string + 1) -- error, can't convert "hello"
+  print(my_string .. 1) --> "hello1"
+  
+  print("one\nstring") --> one
+                       --> string
+  
+  print("\097bc") --> "abc"
+  
+  multi_line_string = [[
+  Here is a chunk of text that runs over several lines. This is all
+  put into the string and is sometimes very handy.
+  ]]
+  ```
 
 function
 : Functions are first class values in Lua, meaning that you can pass them as parameters to functions and return them as values. Variables assigned to a function contains a reference to the function. You can assign variables to anonymous functions, but Lua provides syntactic sugar (`function name(param1, param2) ... end`) for convenience.
 
-
-```lua
--- Assign 'my_plus' to function
-my_plus = function(p, q)
-    return p + q
-end
-
-print(my_plus(4, 5)) --> 9
-
--- Convenient syntax to assign function to variable 'my_mult'
-function my_mult(p, q)
-    return p * q
-end
-
-print(my_mult(4, 5)) --> 20
-
--- Takes a function as parameter 'func'
-function operate(func, p, q)
-    return func(p, q) -- Calls the provided function with parameters 'p' and 'q'
-end
-
-print(operate(my_plus, 4, 5)) --> 9
-print(operate(my_mult, 4, 5)) --> 20
-
--- Create an adder function and return it
-function create_adder(n)
-    return function(a)
-        return a + n
-    end
-end
-
-adder = create_adder(2)
-print(adder(3)) --> 5
-print(adder(10)) --> 12
-```
+  ```lua
+  -- Assign 'my_plus' to function
+  my_plus = function(p, q)
+      return p + q
+  end
+  
+  print(my_plus(4, 5)) --> 9
+  
+  -- Convenient syntax to assign function to variable 'my_mult'
+  function my_mult(p, q)
+      return p * q
+  end
+  
+  print(my_mult(4, 5)) --> 20
+  
+  -- Takes a function as parameter 'func'
+  function operate(func, p, q)
+      return func(p, q) -- Calls the provided function with parameters 'p' and 'q'
+  end
+  
+  print(operate(my_plus, 4, 5)) --> 9
+  print(operate(my_mult, 4, 5)) --> 20
+  
+  -- Create an adder function and return it
+  function create_adder(n)
+      return function(a)
+          return a + n
+      end
+  end
+  
+  adder = create_adder(2)
+  print(adder(3)) --> 5
+  print(adder(10)) --> 12
+  ```
 
 table
-: Tables are the only data-structuring type in Lua. It is an associative array _object_ that is used to represent lists, arrays, sequences, symbol tables, sets, records, graphs, trees etc. Tables are always anonymous and variables you assign a table does not contain the table itself, but a reference to it. When initializing a table as a sequence, the first index is +1`, not `0`.
-
-
-```lua
--- Initialize a table as a sequence
-weekdays = {"Sunday", "Monday", "Tuesday", "Wednesday",
-            "Thursday", "Friday", "Saturday"}
-print(weekdays[1]) --> "Sunday"
-print(weekdays[5]) --> "Thursday"
-
--- Initialize a table as a record with sequence values
-moons = { Earth = { "Moon" }, Uranus = { "Puck", "Miranda", "Ariel", "Umbriel", "Titania", "Oberon" } }
-print(moons.Uranus[3]) --> "Ariel"
-
--- Build a table from an empty constructor {}
-a = 1
-t = {}
-t[1] = "first"
-t[a ` 1] = "second"
-t.x = 1 -- same as t["x"] = 1
-
--- Iterate over the table key, value pairs
-for key, value in pairs(t) do
-    print(key, value)
-end
---> 1   first
---> 2   second
---> x   1
-
-u = t -- u now refers to the same table as t
-u[1] = "changed"
-
-for key, value in pairs(t) do -- still iterating over t!
-    print(key, value)
-end
---> 1   changed
---> 2   second
---> x   1
-```
+: Tables are the only data-structuring type in Lua. It is an associative array _object_ that is used to represent lists, arrays, sequences, symbol tables, sets, records, graphs, trees etc. Tables are always anonymous and variables you assign a table does not contain the table itself, but a reference to it. When initializing a table as a sequence, the first index is `1`, not `0`.
+
+  ```lua
+  -- Initialize a table as a sequence
+  weekdays = {"Sunday", "Monday", "Tuesday", "Wednesday",
+              "Thursday", "Friday", "Saturday"}
+  print(weekdays[1]) --> "Sunday"
+  print(weekdays[5]) --> "Thursday"
+  
+  -- Initialize a table as a record with sequence values
+  moons = { Earth = { "Moon" }, 
+            Uranus = { "Puck", "Miranda", "Ariel", "Umbriel", "Titania", "Oberon" } }
+  print(moons.Uranus[3]) --> "Ariel"
+  
+  -- Build a table from an empty constructor {}
+  a = 1
+  t = {}
+  t[1] = "first"
+  t[a ` 1] = "second"
+  t.x = 1 -- same as t["x"] = 1
+  
+  -- Iterate over the table key, value pairs
+  for key, value in pairs(t) do
+      print(key, value)
+  end
+  --> 1   first
+  --> 2   second
+  --> x   1
+  
+  u = t -- u now refers to the same table as t
+  u[1] = "changed"
+  
+  for key, value in pairs(t) do -- still iterating over t!
+      print(key, value)
+  end
+  --> 1   changed
+  --> 2   second
+  --> x   1
+  ```
 
 userdata
 : Userdata is provided to allow arbitrary C data to be stored in Lua variables. Defold uses Lua userdata objects to store Hash values (hash), URL objects (url), Math objects (vector3, vector4, matrix4, quaternion), Game objects, GUI nodes (node), Render predicates (predicate), Render targets (render_target) and Render constant buffers (constant_buffer)
 
-
 thread
 : Threads represents independent threads of execution and it is used to implement coroutines. See below for details.
 
-
 ## Operators
 
 Arithmetic operators
-: Mathematic operators +`+, `-`, `*`, `/`, the unary `-+ (negation) and exponential +^`.
+: Mathematic operators `+`, `-`, `*`, `/`, the unary `-` (negation) and exponential `^`.
 
-
-```lua
-a = -1
-print(a * 2 ` 3 / 4^5) --> -1.9970703125
-```
+  ```lua
+  a = -1
+  print(a * 2 ` 3 / 4^5) --> -1.9970703125
+  ```
 
 Relational/comparison operators
-: +<+ (less than), +>+ (greater than), `\<=` (less or equal), `>=` (greater or equal), `==` (equal), `~=` (not equal). There operators always return `true` or `false`. Values of different types are considered different. If the type is the same, they are compared according to their types. Lua compares tables, userdata, and functions by reference. Two such values are considered equal only if they refer to the same object.
-
-
-```lua
-a = 5
-b = 6
-
-if a <= b then
-    print("a is less than or equal to b")
-end
-```
-
-Logical operators: `and`, `or`, and `not`. `and` returns its first argument if it is `false`, otherwise it returns its second argument. `or` returns its first argument if it is not `false`, otherwise it returns its second argument.
-
-```lua
-print(true or false) --> true
-print(true and false) --> false
-print(not false) --> true
-
-if a == 5 and b == 6 then
-    print("a is 5 and b is 6")
-end
-```
+: `<` (less than), `>` (greater than), `<=` (less or equal), `>=` (greater or equal), `==` (equal), `~=` (not equal). There operators always return `true` or `false`. Values of different types are considered different. If the type is the same, they are compared according to their types. Lua compares tables, userdata, and functions by reference. Two such values are considered equal only if they refer to the same object.
+
+  ```lua
+  a = 5
+  b = 6
+  
+  if a <= b then
+      print("a is less than or equal to b")
+  end
+  ```
+
+Logical operators
+: `and`, `or`, and `not`. `and` returns its first argument if it is `false`, otherwise it returns its second argument. `or` returns its first argument if it is not `false`, otherwise it returns its second argument.
+
+  ```lua
+  print(true or false) --> true
+  print(true and false) --> false
+  print(not false) --> true
+  
+  if a == 5 and b == 6 then
+      print("a is 5 and b is 6")
+  end
+  ```
 
 Concatenation
 : Strings can be concatenated with the `..` operator. Numbers are converted to strings when concatenated.
 
-
-```lua
-print("donkey" .. "kong") --> "donkeykong"
-print(1 .. 2) --> "12"
-```
+  ```lua
+  print("donkey" .. "kong") --> "donkeykong"
+  print(1 .. 2) --> "12"
+  ```
 
 Length
-: The unary length operator +#`. The length of a string is its number of bytes. The length of a table is its sequence length, the number of indices that are numbered from `1+ and upwards where the value is not nil. Note: If the sequence has `nil` value "holes" in it, the length can be any index preceding a `nil` value.
-
-
-```lua
-s = "donkey"
-print(#s) --> 6
-
-t = { "a", "b", "c", "d" }
-print(#t) --> 4
-
-u = { a = 1, b = 2, c = 3 }
-print(#u) --> 0
-
-v = { "a", "b", nil }
-print(#v) --> 2
-```
+: The unary length operator `#`. The length of a string is its number of bytes. The length of a table is its sequence length, the number of indices that are numbered from `1` and upwards where the value is not `nil`. Note: If the sequence has `nil` value "holes" in it, the length can be any index preceding a `nil` value.
+
+  ```lua
+  s = "donkey"
+  print(#s) --> 6
+  
+  t = { "a", "b", "c", "d" }
+  print(#t) --> 4
+  
+  u = { a = 1, b = 2, c = 3 }
+  print(#u) --> 0
+  
+  v = { "a", "b", nil }
+  print(#v) --> 2
+  ```
 
 ## Flow control
 
 Lua provides the usual set of flow control constructs.
 
-if then else
+if---then---else
 : Test a condition, execute the `then` part if the condition is true, otherwise execute the (optional) `else` part. Instead of nesting `if` statements you can use `elseif`. This replaces a switch-statement that Lua does not have.
 
-
-```lua
-a = 5
-b = 4
-
-if a < b then
-    print("a is smaller than b")
-end
-
-if a == '1' then
-    print("a is 1")
-elseif a == '2' then
-    print("a is 2")
-elseif a == '3' then
-    print("a is 3")
-else
-    print("I have no idea what a is...")
-end
-```
+  ```lua
+  a = 5
+  b = 4
+  
+  if a < b then
+      print("a is smaller than b")
+  end
+  
+  if a == '1' then
+      print("a is 1")
+  elseif a == '2' then
+      print("a is 2")
+  elseif a == '3' then
+      print("a is 3")
+  else
+      print("I have no idea what a is...")
+  end
+  ```
 
 while
 : Test a condition and execute the block as long as it's true.
 
-
-```lua
-weekdays = {"Sunday", "Monday", "Tuesday", "Wednesday",
-            "Thursday", "Friday", "Saturday"}
-
--- Print each weekday
-i = 1
-while weekdays[i] do
-    print(weekdays[i])
-    i = i + 1
-end
-```
-
-repeat until
+  ```lua
+  weekdays = {"Sunday", "Monday", "Tuesday", "Wednesday",
+              "Thursday", "Friday", "Saturday"}
+  
+  -- Print each weekday
+  i = 1
+  while weekdays[i] do
+      print(weekdays[i])
+      i = i + 1
+  end
+  ```
+
+repeat---until
 : Repeats the block until a condition is true. The condition is tested after the body so it will execute at least once.
 
-
-```lua
-weekdays = {"Sunday", "Monday", "Tuesday", "Wednesday",
-            "Thursday", "Friday", "Saturday"}
-
--- Print each weekday
-i = 0
-repeat
-    i = i + 1
-    print(weekdays[i])
-until weekdays[i] == "Saturday"
-```
+  ```lua
+  weekdays = {"Sunday", "Monday", "Tuesday", "Wednesday",
+              "Thursday", "Friday", "Saturday"}
+  
+  -- Print each weekday
+  i = 0
+  repeat
+      i = i + 1
+      print(weekdays[i])
+  until weekdays[i] == "Saturday"
+  ```
 
 for
 : Lua has two types of `for` loop: numeric and generic. The numeric `for` takes 2 or 3 numeric values whereas the generic `for` iterates over all values returned by an _iterator_ function.
 
-
-```lua
--- Print the numbers 1 to 10
-for i = 1, 10 do
-    print(i)
-end
-
--- Print the numbers 1 to 10 and increment with 2 each time
-for i = 1, 10, 2 do
-    print(i)
-end
-
--- Print the numbers 10 to 1
-for i=10, 1, -1 do
-    print(i)
-end
-
-t = { "a", "b", "c", "d" }
--- Iterate over the sequence and print the values
-for i, v in ipairs(t) do
-    print(v)
-end
-```
+  ```lua
+  -- Print the numbers 1 to 10
+  for i = 1, 10 do
+      print(i)
+  end
+  
+  -- Print the numbers 1 to 10 and increment with 2 each time
+  for i = 1, 10, 2 do
+      print(i)
+  end
+  
+  -- Print the numbers 10 to 1
+  for i=10, 1, -1 do
+      print(i)
+  end
+  
+  t = { "a", "b", "c", "d" }
+  -- Iterate over the sequence and print the values
+  for i, v in ipairs(t) do
+      print(v)
+  end
+  ```
 
 break and return
 : Use the `break` statement to break out of an inner block of a `for`, `while` or `repeat` loop. Use `return` to return a value from a function or to finish execution of a function and return to the caller. `break` or `return` can appear only as the last statement of a block.
 
-
-```lua
-a = 1
-while true do
-    a = a + 1
-    if a >= 100 then
-        break
-    end
-end
-
-function my_add(a, b)
-    return a + b
-end
-
-print(my_add(10, 12)) --> 22
-```
+  ```lua
+  a = 1
+  while true do
+      a = a + 1
+      if a >= 100 then
+          break
+      end
+  end
+  
+  function my_add(a, b)
+      return a + b
+  end
+  
+  print(my_add(10, 12)) --> 22
+  ```
 
 ## Locals, globals and lexical scoping
 
@@ -473,7 +463,7 @@ end
 
 ## Coroutines
 
-Functions execute from beginning to end and there is no way to stop it midway through. Coroutines allow you to do that, which can be very convenient in some cases. Suppose we want to create a very specific frame-by-frame animation where we move a game object from y position +0+ to some very specific y positions frame 1 to frame 5. We could solve that with a counter in the `update()` function (see below) and a list of the positions. However, with a coroutine we get a very clean implementation that is easy to extend and work with. All state is contained within the coroutine itself.
+Functions execute from beginning to end and there is no way to stop it midway through. Coroutines allow you to do that, which can be very convenient in some cases. Suppose we want to create a very specific frame-by-frame animation where we move a game object from y position `0` to some very specific y positions frame 1 to frame 5. We could solve that with a counter in the `update()` function (see below) and a list of the positions. However, with a coroutine we get a very clean implementation that is easy to extend and work with. All state is contained within the coroutine itself.
 
 When a coroutine yields it returns control back to the caller but remembers its execution point so it can continue from there later on.
 
@@ -523,59 +513,53 @@ Render scripts
 
 ## Script execution and callbacks
 
-Defold executes Lua scripts as part of the engine lifecycle and exposes the lifecycle through a set of predefined callback functions. When you add a script component to a game object the script becomes part of the game object's and its component(s) lifecycle. The script is evaluated in the Lua context when it is loaded, then the engine executes the following functions and passes a reference to the current script component instance as parameter. You can use this "self" reference to store state in the component instance. "self" is a userdata object that acts like a Lua table but you can't iterate over it with `pairs()+ or `ipairs()`.
+Defold executes Lua scripts as part of the engine lifecycle and exposes the lifecycle through a set of predefined callback functions. When you add a script component to a game object the script becomes part of the game object's and its component(s) lifecycle. The script is evaluated in the Lua context when it is loaded, then the engine executes the following functions and passes a reference to the current script component instance as parameter. You can use this `self` reference to store state in the component instance. `self` is a userdata object that acts like a Lua table but you can't iterate over it with `pairs()` or `ipairs()`.
 
-init(self)
+`init(self)`
 : Called when the component is initialized.
 
+  ```lua
+  function init(self)
+      -- These variables are available through the lifetime of the component instance
+      self.my_var = "something"
+      self.age = 0
+  end
+  ```
 
-```lua
-function init(self)
-    -- These variables are available through the lifetime of the component instance
-    self.my_var = "something"
-    self.age = 0
-end
-```
-
-final(self)
+`final(self)`
 : Called when the component is deleted. This is useful for cleaning up purposes, for instance if you have spawned game objects that should be deleted when the component is deleted.
 
+  ```lua
+  function final(self)
+      if self.my_var == "something" then
+          -- do some cleanup
+      end
+  end
+  ```
 
-```lua
-function final(self)
-    if self.my_var == "something" then
-        -- do some cleanup
-    end
-end
-```
-
-update(self, dt)
+`update(self, dt)`
 : Called once each frame. `dt` contains the delta time since the last frame.
 
+  ```lua
+  function update(self, dt)
+      self.age = self.age + dt -- increase age with the timestep
+  end
+  ```
 
-```lua
-function update(self, dt)
-    self.age = self.age + dt -- increase age with the timestep
-end
-```
-
-on_message(self, message_id, message, sender)
-: When messages are sent to the script component through `[msg.post()](/ref/msg#msg.post)` the engine calls this function of the receiver component.
-
-
-on_input(self, action_id, action)
-: If this component has acquired input focus (see `[acquire_input_focus](/ref/go/#acquire_input_focus)`) the engine calls this function when input is registered.
-
+`on_message(self, message_id, message, sender)`
+: When messages are sent to the script component through [`msg.post()`](/ref/msg#msg.post) the engine calls this function of the receiver component.
 
-on_reload(self)
-: This function is called when the script is reloaded through the hot reload editor function ("Edit > Reload Resource"). It is very useful for debugging, testing and tweaking purposes.
+`on_input(self, action_id, action)`
+: If this component has acquired input focus (see [`acquire_input_focus`](/ref/go/#acquire_input_focus)) the engine calls this function when input is registered.
 
+`on_reload(self)`
+: This function is called when the script is reloaded through the hot reload editor function (<kbd>Edit ▸ Reload Resource</kbd>). It is very useful for debugging, testing and tweaking purposes.
 
-```lua
-function on_reload(self)
-    print(self.age) -- print the age of this game object
-end
-```
+  ```lua
+  function on_reload(self)
+      print(self.age) -- print the age of this game object
+  end
+  ```
 
 ## Reactive logic
 
@@ -587,33 +571,33 @@ Let's look at a concrete example. Suppose that you want a script component to se
 
 ```lua
 function init(self)
-        -- Counter to keep track of time.
-        self.counter = 0
-        -- We need this to keep track of our state.
-        self.state = "first"
+    -- Counter to keep track of time.
+    self.counter = 0
+    -- We need this to keep track of our state.
+    self.state = "first"
 end
 
 function update(self, dt)
-        self.counter = self.counter + dt
-        if self.counter >= 2.0 and self.state == "first" then
-                -- send message after 2 seconds
-                msg.post("some_object", "some_message")
-        end
-        if self.counter >= 5.0 and self.state == "second" then
-                -- send message 5 seconds after we received "response"
-                msg.post("another_object", "another_message")
-                -- Nil the state so we don’t reach this state block again.
-                self.state = nil
-        end
+    self.counter = self.counter + dt
+    if self.counter >= 2.0 and self.state == "first" then
+        -- send message after 2 seconds
+        msg.post("some_object", "some_message")
+    end
+    if self.counter >= 5.0 and self.state == "second" then
+        -- send message 5 seconds after we received "response"
+        msg.post("another_object", "another_message")
+        -- Nil the state so we don’t reach this state block again.
+        self.state = nil
+    end
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("response") then
-                -- “first” state done. enter next
-                self.state = "second"
-                -- zero the counter
-                self.counter = 0
-        end
+    if message_id == hash("response") then
+        -- “first” state done. enter next
+        self.state = "second"
+        -- zero the counter
+        self.counter = 0
+    end
 end
 ```
 
@@ -623,25 +607,25 @@ Even in this quite simple case we get fairly tangled up logic. It's possible to
 -- Dummy property only for timing
 go.property("dummy", 0)
 function init(self)
-        -- Wait 2s then call send_first()
-        go.animate("#", "dummy", go.PLAYBACK_ONCE_FORWARD, 0,
-                     go.EASING_LINEAR, 2.0, 0, send_first)
+    -- Wait 2s then call send_first()
+    go.animate("#", "dummy", go.PLAYBACK_ONCE_FORWARD, 0,
+                 go.EASING_LINEAR, 2.0, 0, send_first)
 end
 
 function send_first()
-        msg.post("some_object", "some_message")
+    msg.post("some_object", "some_message")
 end
 
 function send_second()
-        msg.post("another_object", "another_message")
+    msg.post("another_object", "another_message")
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("response") then
-                -- Wait 5s then call send_second()
-                go.animate("#", "dummy", go.PLAYBACK_ONCE_FORWARD, 0,
-                            go.EASING_LINEAR, 5.0, 0, send_second)
-        end
+    if message_id == hash("response") then
+        -- Wait 5s then call send_second()
+        go.animate("#", "dummy", go.PLAYBACK_ONCE_FORWARD, 0,
+                    go.EASING_LINEAR, 5.0, 0, send_second)
+    end
 end
 ```
 
@@ -649,7 +633,7 @@ This is cleaner and easier to follow. We get rid of internal state variables tha
 
 ## Lua contexts in Defold
 
-All variables that you declare are by default global, meaning that they are available through all parts of the Lua runtime context. Defold has a setting `shared_state` setting in "game.project" that controls this context. If the option is set, all scripts, GUI scripts and the render script are evaluated in the same Lua context and global variables are visible everywhere. If the option is not set, the engine executes scripts, GUI scripts and the render script in separate contexts.
+All variables that you declare are by default global, meaning that they are available through all parts of the Lua runtime context. Defold has a setting *shared_state* setting in *game.project* that controls this context. If the option is set, all scripts, GUI scripts and the render script are evaluated in the same Lua context and global variables are visible everywhere. If the option is not set, the engine executes scripts, GUI scripts and the render script in separate contexts.
 
 ![Contexts](images/lua/lua_contexts.png)
 
@@ -686,24 +670,24 @@ In a high performance game that is intended to run at a smooth 60 FPS small perf
 Beginning with the simple things. It is generally a good idea to write code that is straightforward and that does not contain unnecessary loops. Sometimes you do need to iterate over lists of things, but be careful if the list of things is sufficiently large. This example runs in slightly over 1 millisecond on a pretty decent laptop, which can make all the difference if each frame is only 16 milliseconds long (at 60 FPS) and with the engine, render script, physics simulation and so forth eating up a chunk of that.
 
 ```lua
-local t = os.clock()
+local t = socket.gettime()
 local table = {}
 for i=1,2000 do
     table[i] = vmath.vector3(i, i, i)
 end
-print((os.clock() - t) * 1000)
+print((socket.gettime() - t) * 1000)
 
--- DEBUG:SCRIPT: 1.18
+-- DEBUG:SCRIPT: 0.40388
 ```
 
-Use the value returned from `os.clock()` (seconds of CPU time for the program) to benchmark suspect code.
+Use the value returned from `socket.gettime()` (seconds since system epoch) to benchmark suspect code.
 
 ## Memory and garbage collection
 
 Lua's garbage collection runs automatically in the background by default and reclaims memory that the Lua runtime has allocated. Collecting lots of garbage can be a time consuming task so it is good to keep down the number of objects that needs to be garbage collected:
 
 * Local variables are in themselves free and will not generate garbage. (i.e. `local v = 42`)
-* Each _new unique_ string creates a new object. Writing `local s = "some_string"` will create a new object and assign +s+ to it. The local +s+ itself will not generate garbage, but the string object will. Using the same string multiple times adds no additional memory cost.
+* Each _new unique_ string creates a new object. Writing `local s = "some_string"` will create a new object and assign `s` to it. The local +s+ itself will not generate garbage, but the string object will. Using the same string multiple times adds no additional memory cost.
 * Each time a table constructor is executed (`{ ... }`) a new table is created.
 * Executing a _function statement_ creates a closure object. (i.e. executing the statement `function () ... end`, not calling a defined function)
 * Vararg functions (`function(v, ...) end`) create a table for the ellipsis each time the function is _called_ (in Lua prior to version 5.2, or if not using LuaJIT).
@@ -732,7 +716,7 @@ print(collectgarbage("count") * 1024)       -- 88611
 print(collectgarbage("count") * 1024)       -- 88633. 22 bytes allocated
 ```
 
-So a `vector3` weighs in at 70-22=48 bytes. That is not much, but if you create _one_ each frame in a 60 FPS game it's suddenly 2.8 kB of garbage per second. With 360 script components that each create one `vector3` every frame we're looking at 1 MB of garbage generated per second. The numbers can add upp very quickly. When the Lua runtime collects garbage it may eat up many precious milliseconds--especially on mobile platforms.
+So a `vector3` weighs in at 70-22=48 bytes. That is not much, but if you create _one_ each frame in a 60 FPS game it's suddenly 2.8 kB of garbage per second. With 360 script components that each create one `vector3` every frame we're looking at 1 MB of garbage generated per second. The numbers can add upp very quickly. When the Lua runtime collects garbage it may eat up many precious milliseconds---especially on mobile platforms.
 
 One way to avoid allocations is to create a `vector3` and then keep working with the same object. For instance, to reset a `vector3` we can use the following construct:
 
@@ -744,7 +728,7 @@ self.velocity.y = 0
 self.velocity.z = 0
 ```
 
-The default garbage collecting scheme may not be optimal for some time critical applications. If you see stutter in your game or app, you might want to tune how Lua collects garbage through the [collectgarbage()](http://www.lua.org/manual/5.1/manual.html#pdf-collectgarbage) Lua function. You can, for instance, run the collector for a short time every frame with a low "step" value. To get an idea how much memory your game or app is eating, you can print the current amount of garbage bytes with:
+The default garbage collecting scheme may not be optimal for some time critical applications. If you see stutter in your game or app, you might want to tune how Lua collects garbage through the [`collectgarbage()`](/ref/base/#collectgarbage) Lua function. You can, for instance, run the collector for a short time every frame with a low `step` value. To get an idea how much memory your game or app is eating, you can print the current amount of garbage bytes with:
 
 ```lua
 print(collectgarbage("count") * 1024)
@@ -754,26 +738,23 @@ print(collectgarbage("count") * 1024)
 
 A common implementation design consideration is how to structure code for shared behaviors. Several approaches are possible.
 
-## Behaviors in a module
-
-![Module](images/lua/lua_module.png)
-
-Encapsulating a behavior in a module allows you to easily share code between different game objects’ script components (and GUI scripts). When writing module functions it is generally best to write strictly functional code. There are cases where stored state or side effects is a necessity (or leads to cleaner design). If you have to store internal state in the module, be aware that components share Lua contexts. See the [Modules documentation](/manuals/modules) for details.
-
-Also, even if it is possible to have module code directly modify the internals of a game object (by passing "self" to a module function) it is strongly disencouraged to do so since you create very tight coupling.
+Behaviors in a module
+: Encapsulating a behavior in a module allows you to easily share code between different game objects’ script components (and GUI scripts). When writing module functions it is generally best to write strictly functional code. There are cases where stored state or side effects is a necessity (or leads to cleaner design). If you have to store internal state in the module, be aware that components share Lua contexts. See the [Modules documentation](/manuals/modules) for details.
 
-## A helper game object with encapsulated behavior
+  ![Module](images/lua/lua_module.png)
 
-![Helper](images/lua/lua_helper.png)
+  Also, even if it is possible to have module code directly modify the internals of a game object (by passing `self` to a module function) it is strongly disencouraged to do so since you create very tight coupling.
 
-Just like you can contain script code in a Lua module, you can contained it in a game object with a script component. The difference is that if you contain it in a game object and you communicate with it strictly through message passing.
+A helper game object with encapsulated behavior
+: Just like you can contain script code in a Lua module, you can contained it in a game object with a script component. The difference is that if you contain it in a game object and you communicate with it strictly through message passing.
 
-## Grouping game object with helper behavior object inside a collection
+  ![Helper](images/lua/lua_helper.png)
 
-![Collection](images/lua/lua_collection.png)
+Grouping game object with helper behavior object inside a collection
+: In this design you can create a behavior game object that automatically acts upon another target game object, either by a predefined name (the user has to rename the target game object to match), or through a `go.property()` URL that points to the target game object.
 
-In this design you can create a behavior game object that automatically acts upon another target game object, either by a predefined name (the user has to rename the target game object to match), or through a `go.property()` URL that points to the target game object.
+  ![Collection](images/lua/lua_collection.png)
 
-The benefit with this setup is that you can drop a behavior game object into a collection containing the target object. Zero additional code is needed.
+  The benefit with this setup is that you can drop a behavior game object into a collection containing the target object. Zero additional code is needed.
 
-In situations where you need to manage large quantities of game objects, this design is not preferable since the behavior object is duplicated for each instance and each object will cost memory.
+  In situations where you need to manage large quantities of game objects, this design is not preferable since the behavior object is duplicated for each instance and each object will cost memory.

+ 38 - 45
docs/en/manuals/material.md

@@ -1,20 +1,23 @@
-Materials
-=========
+---
+title: Defold materials manual
+brief: This manual explains how to work with materials, shader constants and samplers.
+---
 
-Materials are the Defold way of expressing how a graphical component (a sprite, tilemap, font, GUI node etc) should be rendered. This manual explains how to work with materials, shader constants and samplers.
+# Materials
 
-## Overview
+Materials are the Defold way of expressing how a graphical component (a sprite, tilemap, font, GUI node etc) should be rendered.
 
 A material holds _Tags_, information that is used in the rendering pipeline to select objects to be rendered. It also holds references to _shader programs_ that are compiled through the available graphics driver and uploaded to the graphics hardware and run when the component is rendered each frame.
 
-For an in depth explanation on shader programs, see the [Shader documentation](/manuals/shader).
+* For more information on the render pipeline, see the [Rendering documentation](/manuals/rendering).
+* For an in depth explanation on shader programs, see the [Shader documentation](/manuals/shader).
 
 ## Creating a material
 
 Let's start by creating a simple flat (with no directional light), but textured material:
 
 1. Select a target folder in the *Project Explorer*.
-2. Select the menu *File > New... > Material File*. (You can also right click in the *Project Explorer and select *New... > Material File* from the pop up menu).
+2. Select the menu <kbd>File ▸ New... ▸ Material File</kbd>. (You can also right click in the *Project Explorer* and select <kbd>New... ▸ Material File</kbd> from the pop up menu).
 3. Name the new material file.
 4. The new material will open in the *Material Editor*.
 
@@ -22,10 +25,10 @@ Let's start by creating a simple flat (with no directional light), but textured
 
 Now you need to create the vertex and fragment shader program files. Currently, the process is a little bit cumbersome:
 
-1. Create a script file by selecting *File > New... > Script File*.
-2. Rename the script file so it will have a ".vp" (Vertex Program) suffix.
+1. Create a script file by selecting <kbd>File ▸ New... ▸ Script File</kbd>.
+2. Rename the script file so it will have a *.vp* (Vertex Program) suffix.
 3. Create a second script file.
-4. Rename the script file so it will have a ".fp" (Fragment Program) suffix.
+4. Rename the script file so it will have a *.fp* (Fragment Program) suffix.
 
 Associate the two program files with the corresponding properties in the material:
 
@@ -33,7 +36,7 @@ Associate the two program files with the corresponding properties in the materia
 
 ## Material tags
 
-You need to set a tag for the material so your render script can render any component using the new material. The tags are represented in the engine as a _bitmask_ that is used by `[render.predicate()](/ref/render#render.predicate)` to collect components that should be drawn together. See the [Rendering documentation](/manuals/rendering) on how to do that.
+You need to set a tag for the material so your render script can render any component using the new material. The tags are represented in the engine as a _bitmask_ that is used by [`render.predicate()`](/ref/render#render.predicate) to collect components that should be drawn together. See the [Rendering documentation](/manuals/rendering) on how to do that.
 
 ::: important
 The maximum number of tags you can use in a project is 32.
@@ -43,27 +46,23 @@ The maximum number of tags you can use in a project is 32.
 
 ## Constants
 
-The vertex shader will need matrices so each vertex can be translated to the clipping space. You do that by setting up _vertex constants_. We set two constants.
-
-1. Call one "world" and set the type to `CONSTANT_TYPE_WORLD`. This lets the engine know that you want "world" to contain the world matrix.
-2. Call the second "view_proj" and set the type to `CONSTANT_VIEW_PROJECTION`. This lets the engine know that you want "view_proj" to contain the view matrix multiplied with the projection matrix.
+The vertex shader will need matrices so each vertex can be translated to the clipping space. You do that by setting up _vertex constants_. We add one constant "view_proj" and set the type to `CONSTANT_VIEW_PROJECTION`. This lets the engine know that you want "view_proj" to contain the view matrix multiplied with the projection matrix.
 
 ![Vertex constants](images/materials/materials_vertex_constants.png)
 
 ## Shader programs
 
-For the material to work, we have to edit the vertex and shader programs:
+For the material to work, we have to first edit the vertex shader programs:
 
-.Vertex shader ("flat.vp")
-----
+```glsl
+// flat.vp
 // view_proj and world are set as vertex constants and we
 // access them in our vertex shader program by declaring them
 // as "uniform".
 //
 uniform mediump mat4 view_proj;
-uniform mediump mat4 world;
 
-// position holds the original vertex position.
+// position holds the original vertex position, in world space.
 attribute mediump vec4 position;
 
 // texcoord0 contains the texture coordinate for this vertex.
@@ -75,22 +74,21 @@ varying mediump vec2 var_texcoord0;
 
 void main()
 {
-    // Multiply view, projection and world matrices into one.
-    mediump mat4 mvp = view_proj * world;
-
     // The varying var_texcoord0 is at texcoord0 at the position of
     // this vertex.
-	var_texcoord0 = texcoord0;
+    var_texcoord0 = texcoord0;
 
-    // Translate the vertex position with the mvp matrix.
+    // Translate the vertex position with the view_proj matrix.
     // The vec4(position.xyz, 1.0) ensures that the w component of
     // the position is always 1.0.
-    gl_Position = mvp * vec4(position.xyz, 1.0);
+    gl_Position = view_proj * vec4(position.xyz, 1.0);
 }
-----
+```
 
-.Fragment shader ("flat.fp")
-----
+Secondly, the fragment shader needs to be edited:
+
+```glsl
+// flat.fp
 // The texture coordinate for this fragment is varying between the
 // vertices.
 varying mediump vec2 var_texcoord0;
@@ -104,7 +102,7 @@ void main()
     // set the fragment color to it.
     gl_FragColor = texture2D(diffuse_texture, var_texcoord0);
 }
-----
+```
 
 ## Setting the material
 
@@ -126,19 +124,19 @@ self.constants.tint = vmath.vector4(1, 0, 0, 1) -- <2>
 ...
 render.draw(self.my_pred, self.constants) -- <3>
 ```
-<1> Create a new constants buffer
-<2> Set the "tint" constant to bright red
-<3> Draw the predicate using our custom constants
+1. Create a new constants buffer
+2. Set the `tint` constant to bright red
+3. Draw the predicate using our custom constants
 
-The buffer's constant elements can be indexed like an ordinary Lua table, but you can't iterate over them with pairs() or ipairs().
+The buffer's constant elements can be indexed like an ordinary Lua table, but you can't iterate over them with `pairs()` or `ipairs()`.
 
 ## Uniform texture samplers
 
-A declared sampler 2D is automatically bound to the texture referenced in the graphics component -- there is currently no need to specify samplers in the materials file, but you can configure samplers if you want, see below.
+A declared sampler 2D is automatically bound to the texture referenced in the graphics component---there is currently no need to specify samplers in the materials file, but you can configure samplers if you want, see below.
 
 ![Component texture](images/materials/materials_texture.png)
 
-----
+```glsl
 // The texture data for the component is accessed through a sampler2D
 uniform sampler2D diffuse_texture;
 ...
@@ -147,7 +145,7 @@ uniform sampler2D diffuse_texture;
 // set the fragment color to it.
 gl_FragColor = texture2D(diffuse_texture, var_texcoord0);
 ...
-----
+```
 
 ::: important
 Defold currently supports a single texture per material.
@@ -170,8 +168,7 @@ WRAP_MODE_MIRRORED_REPEAT
 : Texture data outside the range [0,1] will repeat but every second repetition is mirrored
 
 WRAP_MODE_CLAMP_TO_EDGE
-: Texture data for values greater than 1.0 are set to 1.0, and any values less than 0.0 are set to 0.0 - i.e. the edge pixels will be repeated to the edge
-
+: Texture data for values greater than 1.0 are set to 1.0, and any values less than 0.0 are set to 0.0---i.e. the edge pixels will be repeated to the edge
 
 ## Filter modes
 
@@ -195,12 +192,9 @@ FILTER_MODE_LINEAR_MIPMAP_NEAREST
 FILTER_MODE_LINEAR_MIPMAP_LINEAR
 : Uses linear interpolation to compute the value in each of two maps and then interpolates linearly between these two values
 
-
 ## Shader constants
 
-Uniforms are values that are passed from the engine to vertex and fragment shader programs. To use a constant you define it in the material file as either a *vertex_constant* property or a *fragment_constant* property. Corresponding `uniform` variables need to be defined in the shader program.
-
-The following constants can be set in a material:
+Uniforms are values that are passed from the engine to vertex and fragment shader programs. To use a constant you define it in the material file as either a *vertex_constant* property or a *fragment_constant* property. Corresponding `uniform` variables need to be defined in the shader program. The following constants can be set in a material:
 
 CONSTANT_TYPE_WORLD
 : The world matrix. Use to transform vertices into world space. For some component types, the vertices are already in world space when they arrive to the vertex program (due to batching). In those cases multiplying with the world matrix in the shader will yield the wrong results.
@@ -223,17 +217,16 @@ CONSTANT_TYPE_NORMAL
 CONSTANT_TYPE_USER
 : A vector4 constant that you can use for any custom data you want to pass into your shader programs. You can set the initial value of the constant in the constant definition, but it is mutable through the functions `.set_constant()` and `.reset_constant()` for each component type (`sprite`, `model`, `spine`, `particlefx` and `tilemap`)
 
-
 ## Vertex shader attributes
 
 _Attributes_ are values associated with individual vertices. Different component types has a different set of attributes. To access them, simply declare them in your shader program:
 
-----
+```glsl
 // position and texture coordinates for this vertex.
 attribute mediump vec4 position;
 attribute mediump vec2 texcoord0;
 ...
-----
+```
 
 The following attributes are available:
 

+ 150 - 161
docs/en/manuals/message-passing.md

@@ -1,17 +1,19 @@
-Message passing
-===============
-:location: documentation manuals concepts
-:type: manual
+---
+title: Message passing in Defold
+brief: Message passing is the mechanism used by Defold to permit loosely coupled objects to communicate. This manual describes this mechanism in depth.
+---
 
-Message passing is the mechanism used by Defold to permit objects to communicate without creating dependencies between them. This manual describes this mechanism in depth. It assumes that you have a basic understanding of *Game Objects*, *Components* and *Collections*.
+# Message passing
 
-When programming it is generally best to couple all objects, code modules or components [as loosely as possible](http://en.wikipedia.org/wiki/Loose_coupling). Any object that has a dependency to the inner workings of another object is considered to be _tightly coupled_ and such coupling often lead to code that is harder to maintain and is a common source of bugs--some of which can be very hard to track down.
+Message passing is the mechanism used by Defold to permit objects to communicate without creating dependencies between them. This manual assumes that you have a basic understanding of *Game Objects*, *Components* and *Collections*.
 
-Defold's Lua integration does not provide object orientation in the sense that you define your application by setting up class hierarchies with inheritance (like Java, C`+ or C#). Instead, Defold extends Lua with a simple and powerful object oriented design with the following characteristics:
+When programming it is generally best to couple all objects, code modules or components [as loosely as possible](http://en.wikipedia.org/wiki/Loose_coupling). Any object that has a dependency to the inner workings of another object is considered to be _tightly coupled_ and such coupling often lead to code that is harder to maintain and is a common source of bugs---some of which can be very hard to track down.
+
+Defold's Lua integration does not provide object orientation in the sense that you define your application by setting up class hierarchies with inheritance (like Java, C++ or C#). Instead, Defold extends Lua with a simple and powerful object oriented design with the following characteristics:
 
 * [Message passing](/manuals/message-passing) to communicate between objects.
-* All objects have their own internal state, their own memory that they control. This is done through the "self" reference.
-* You can send _any_ message to any existing object and it is up to your code how to respond to the message. This is done through the `on_message()+ function. If your code does not contain code for a particular message, nothing happens.
+* All objects have their own internal state, their own memory that they control. This is done through the `self` reference.
+* You can send _any_ message to any existing object and it is up to your code how to respond to the message. This is done through the `on_message()` function. If your code does not contain code for a particular message, nothing happens.
 
 ## Addressing and URLs
 
@@ -28,14 +30,14 @@ Here's a typical structure for that:
 
 This game consists of:
 
-* Two collections with id:s "main" and "level". "level" is placed inside "main"
-* Three game objects with id:s "hero", "enemy" and "interface"
-* "interface" is placed in "main"
-* "hero" and "enemy" are placed in "level"
-* Each game object in the example contains two components:
-    ** Game objects "hero" and "enemy" contains one script component "brain" and one sprite "body"
-    ** Game object "interface" contains one script component "control" and one GUI component "gui"
-    ** The "gui" component in "interface" has a GUI script attached to it
+- Two collections with id:s "main" and "level". "level" is placed inside "main".
+- Three game objects with id:s "hero", "enemy" and "interface".
+- "interface" is placed in "main".
+- "hero" and "enemy" are placed in "level".
+- Each game object in the example contains two components:
+    - Game objects "hero" and "enemy" contains one script component "brain" and one sprite "body".
+    - Game object "interface" contains one script component "control" and one GUI component "gui".
+    - The "gui" component in "interface" has a GUI script attached to it.
 
 Some of this game content will live in separate files in the project. For instance, collections are always stored in files so you will at least have one file for "main" collection and one for "level" collection. However, _this does not matter_. It's _really_ important to realize that file names and the location of files in your project folder is totally irrelevant. The two things that matter for addressing are:
 
@@ -46,7 +48,7 @@ The Defold editor will automatically assign unique id:s within the current colle
 
 All addresses are expressed by an *URL* that uniquely identify each message sender and receiver in the running game. The URL consists of three components and is written in the following generic format:
 
- "[socket:][path][#fragment]"
+`[socket:][path][#fragment]`
 
 For most cases, these URL components are used to designate game objects and components, but the format is general.
 
@@ -62,9 +64,7 @@ fragment
 
 The full URL string for the script in the "hero" game object above is then:
 
-----
-main:/level/hero#brain
-----
+`main:/level/hero#brain`
 
 and we can send messages to it like this:
 
@@ -75,80 +75,75 @@ msg.post("main:/level/enemy#brain", "hello")
 
 If you send a message to an unknown recipient, Defold will signal an error in the console.
 
-----
+```txt
 ERROR:GAMEOBJECT: Instance '/level/enemy' could not be found when dispatching message 'hello' sent from default:/level/hero#brain
-----
+```
 
 In most cases, the above way of writing full URL:s is unnecessary and way too specific. Let's instead look at 3 more common examples of how to write messages in our example game:
 
 ![Message passing](images/message_passing/message_passing.png)
 
 Message 1
-: A "knock" message is sent from the "hero" script component to the "enemy" script component. Since both objects live in the same place in the collection hierarchy, their socket ("world", root, or main collection) are the same. We can leave out that piece of information which gives the following call:
+: A `knock` message is sent from the "hero" script component to the "enemy" script component. Since both objects live in the same place in the collection hierarchy, their socket ("world", root, or main collection) are the same. We can leave out that piece of information which gives the following call:
 
-+
-```lua
--- Send "knock" from the script component in "hero" to script in "enemy"
-msg.post("/level/enemy#brain", "knock")
-```
-+
-By not specifying a socket part of the URL, the message is assumed to be sent to a receiver in the _same_ socket as the sender. Defold allows us to take this one step further and leave out portions of the _id_ in the path part of the URL too. Any path that starts with "/" is _absolute_. It always start from the root of the socket (usually the main collection) and must contain the full hierarchical "path" down to the game object which is reflected in the object's id. Since the id:s of "hero" and "enemy" are "/level/hero" and "/level/enemy" respectively we are allowed to eliminate the "level" part and write a _relative_, or partial, id:
-+
-```lua
--- Send "knock" from the script component in "hero" to script in "enemy"
-msg.post("enemy#brain", "knock")
-```
-+
-Notice that we do _not_ write "/enemy#brain" with a "/" at the front. Adding an initial "/" would lead to us trying to address a game object "enemy" at the root of collection "main" and no such object exists. Now, what would happen if we leave out the fragment part of the URL?
-+
-```lua
--- Send "hello" from the script component in "hero" to "enemy"
-msg.post("enemy", "knock")
-```
-+
-This is perfectly valid. By leaving out the target component, the message is _broadcast_ to all components in the specified game object. We encourage though that you do specify the component, mainly because broadcasting is less performant but also because it can lead to obscure bugs.
+  ```lua
+  -- Send "knock" from the script component in "hero" to script in "enemy"
+  msg.post("/level/enemy#brain", "knock")
+  ```
+
+  By not specifying a socket part of the URL, the message is assumed to be sent to a receiver in the _same_ socket as the sender. Defold allows us to take this one step further and leave out portions of the _id_ in the path part of the URL too. Any path that starts with "/" is _absolute_. It always start from the root of the socket (usually the main collection) and must contain the full hierarchical "path" down to the game object which is reflected in the object's id. Since the id:s of "hero" and "enemy" are "/level/hero" and "/level/enemy" respectively we are allowed to eliminate the "level" part and write a _relative_, or partial, id:
+
+  ```lua
+  -- Send "knock" from the script component in "hero" to script in "enemy"
+  msg.post("enemy#brain", "knock")
+  ```
+
+  Notice that we do _not_ write "/enemy#brain" with a "/" at the front. Adding an initial "/" would lead to us trying to address a game object "enemy" at the root of collection "main" and no such object exists. Now, what would happen if we leave out the fragment part of the URL?
+
+  ```lua
+  -- Send "hello" from the script component in "hero" to "enemy"
+  msg.post("enemy", "knock")
+  ```
+
+  This is perfectly valid. By leaving out the target component, the message is _broadcast_ to all components in the specified game object. We encourage though that you do specify the component, mainly because broadcasting is less performant but also because it can lead to obscure bugs.
 
 Message 2
-: An "increase_score" message is sent from the "hero" game object's script component to the script component of the "interface" game object.
+: An `increase_score` message is sent from the "hero" game object's script component to the script component of the "interface" game object.
 
-+
-```lua
--- Send "increase_score" from the script component in "hero" to script component in "interface"
-msg.post("/interface#controller", "increase_score")
-```
-+
-In this case it's not possible to write a relative id. From the point of view of "hero", we must write an absolute, full id (filesystem-like notation like "../interface" is _not_ allowed). However, if the script in "interface" would like to send a message back, a relative path is possible:
-+
-```lua
--- Send "increase_score_response" from the script component in "interface" to script in "hero"
-msg.post("level/hero#brain", "increase_score_response")
-```
-+
-Again, notice the lack of initial "/". By using a relative id, the sender and receiver will be able to communicate wherever they live in the collection hierarchies, which is vital when building objects and object hierarchies that are instanced multiple times or dynamically spawned.
+  ```lua
+  -- Send "increase_score" from the script component in "hero" to script component in "interface"
+  msg.post("/interface#controller", "increase_score")
+  ```
+
+  In this case it's not possible to write a relative id. From the point of view of "hero", we must write an absolute, full id (filesystem-like notation like "../interface" is _not_ allowed). However, if the script in "interface" would like to send a message back, a relative path is possible:
+
+  ```lua
+  -- Send "increase_score_response" from the script component in "interface" to script in "hero"
+  msg.post("level/hero#brain", "increase_score_response")
+  ```
+
+  Again, notice the lack of initial "/". By using a relative id, the sender and receiver will be able to communicate wherever they live in the collection hierarchies, which is vital when building objects and object hierarchies that are instanced multiple times or dynamically spawned.
 
 Message 3
-: An "update_minimap" message is sent from the "enemy" game object to the "gui" script in the "interface" game object.
+: An `update_minimap` message is sent from the "enemy" game object to the "gui" script in the "interface" game object.
 
-+
-```lua
--- Send "update_minimap" from the script component in "enemy" to the GUI script in "interface".
-msg.post("/interface#gui", "update_minimap")
-```
-+
-Here is another case where we cannot specify a relative URL. Instead we have to write the full id of the "interface" object and direct the message to the "gui" component. Script and GUI components are the only game object components that have Lua script associated with them. They can react to arbitrary messages. It is important to remember that GUI scripts must be added to the GUI scene that you add as a component to the game object. Messages between GUI scripts and other scripts works exactly the same way.
+  ```lua
+  -- Send "update_minimap" from the script component in "enemy" to the GUI script in "interface".
+  msg.post("/interface#gui", "update_minimap")
+  ```
+
+  Here is another case where we cannot specify a relative URL. Instead we have to write the full id of the "interface" object and direct the message to the "gui" component. Script and GUI components are the only game object components that have Lua script associated with them. They can react to arbitrary messages. It is important to remember that GUI scripts must be added to the GUI scene that you add as a component to the game object. Messages between GUI scripts and other scripts works exactly the same way.
 
 ## Shorthands
 
 We have seen how it is possible to leave out redundant information from the URL:s when constructing messages. In addition, Defold provides two handy shorthands that you can use:
 
-"."
+`.`
 : An URL shorthand for the current game object.
 
-
-"#"
+`#`
 : An URL shorthand for the current script.
 
-
 For example:
 
 ```lua
@@ -173,37 +168,34 @@ We want to be able to increase and decrease health and we do that by sending a m
 msg.post("hud#script", "increase_health")
 ```
 
-This will post a message with the id (or name) "increase_health" to the recipient component "script" in the object "hud". Defold will deliver the message the next time messages are dispatched, which happens within the current frame.
+This will post a message with the id (or name) `increase_health` to the recipient component "script" in the object "hud". Defold will deliver the message the next time messages are dispatched, which happens within the current frame.
 
 It is then up to the code assigned to the "hud" game object to respond to that message by increasing the score in a nicely presented manner.
 
 ```lua
 -- file: hud.script
-
 function on_message(self, message_id, message, sender)
-	if message_id == hash("increase_health") then
-		-- Let’s add one heart to the HUD with flashy animations.
-
-	end
+    if message_id == hash("increase_health") then
+        -- Let’s add one heart to the HUD with flashy animations.
+        ...
+    end
 end
 ```
 
 ## Message data
 
-The complete signature of the `msg.post()` call is
+The complete signature of the `msg.post()` call is:
 
-```lua
-msg.post(receiver, message_id[, message])
-```
+`msg.post(receiver, message_id[, message])`
 
-For convenience we add a message that sets all information on the HUD in one go. We name the message "set_stats" and attach new data in the *message* parameter:
+For convenience we add a message that sets all information on the HUD in one go. We name the message `set_stats` and attach new data in the `message` parameter:
 
 ```lua
 -- Send table data in message.
 msg.post("hud#script", "set_stats", { score = 100, stars = 2, health = 4 })
 ```
 
-The call adds a *message* parameter with additional data to the message. The argument is optional and should be a Lua table, with key-value pairs inside curly braces. Almost any type of data can be included in the message Lua table. You can pass numbers, strings, booleans, URL:s, hashes and nested tables. You can not, however, pass functions.
+The call adds a `message` parameter with additional data to the message. The argument is optional and should be a Lua table, with key-value pairs inside curly braces. Almost any type of data can be included in the message Lua table. You can pass numbers, strings, booleans, URL:s, hashes and nested tables. You can not, however, pass functions.
 
 ```lua
 -- Send table data containing a nested table
@@ -213,13 +205,15 @@ msg.post("hud#script", "set_stats", msgdata)
 ```
 
 ::: sidenote
-There is a hard limit to the *message* parameter table size. This limit is set to 2 kilobytes. There is currently no trivial way to figure out the exact memory size a table consumes but you can use `collectgarbage("count")` at before and after inserting the table to monitor memory use.
+There is a hard limit to the `message` parameter table size. This limit is set to 2 kilobytes. There is currently no trivial way to figure out the exact memory size a table consumes but you can use `collectgarbage("count")` at before and after inserting the table to monitor memory use.
 :::
 
-on_message()
-------------
+## on_message()
+
+The `on_message()` function takes four parameters:
 
-The `on_message()` function takes three parameters (apart from "self" which will contain a reference to the game object itself).
+`self`
+: A reference to the script component itself.
 
 `message_id`
 : Contains the name of the message. The name is _hashed_.
@@ -230,7 +224,6 @@ The `on_message()` function takes three parameters (apart from "self" which will
 `sender`
 : Contains the full URL of the sender.
 
-
 ```lua
 function on_message(self, message_id, message, sender)
     -- Print message id
@@ -244,7 +237,7 @@ end
 
 The console output shows the message, data and sender:
 
-----
+```txt
 DEBUG:SCRIPT: hash: [set_stats]
 DEBUG:SCRIPT: 
 {
@@ -253,65 +246,64 @@ DEBUG:SCRIPT:
   score = 100,
 }
 DEBUG:SCRIPT: url: [main:/game_controller#script]
-----
+```
 
-Here is an example on how a "hud" game object might implement a simple version of "set_stats”:
+Here is an example on how a "hud" game object might implement a simple version of `set_stats`:
 
 ```lua
 function init(self)
-        -- Duplicate GUI nodes for hearts x 10 and stars x 10
-        self.heart_nodes = {}
-        self.star_nodes = {}
-        local heart_node = gui.get_node("heart")
-        local star_node = gui.get_node("star")
-
-        -- Store all nodes in a table for easy access
-        table.insert(self.heart_nodes, heart_node)
-        -- Start with the nodes disabled
-        gui.set_enabled(heart_node, false)
-
-        for i = 1, 9 do
-                local clone = gui.clone(heart_node)
-                local pos = gui.get_position(heart_node)
-                pos.x = pos.x + i * 32
-                gui.set_position(clone, pos)
-                table.insert(self.heart_nodes, clone)
-                gui.set_enabled(clone, false)
-        end
-        table.insert(self.star_nodes, star_node)
-        gui.set_enabled(star_node, false)
-        for i = 1, 9 do
-                local clone = gui.clone(star_node)
-                local pos = gui.get_position(star_node)
-                pos.x = pos.x + i * 32
-                gui.set_position(clone, pos)
-                table.insert(self.star_nodes, clone)
-                gui.set_enabled(clone, false)
-        end
+    -- Duplicate GUI nodes for hearts x 10 and stars x 10
+    self.heart_nodes = {}
+    self.star_nodes = {}
+    local heart_node = gui.get_node("heart")
+    local star_node = gui.get_node("star")
+
+    -- Store all nodes in a table for easy access
+    table.insert(self.heart_nodes, heart_node)
+    -- Start with the nodes disabled
+    gui.set_enabled(heart_node, false)
+
+    for i = 1, 9 do
+        local clone = gui.clone(heart_node)
+        local pos = gui.get_position(heart_node)
+        pos.x = pos.x + i * 32
+        gui.set_position(clone, pos)
+        table.insert(self.heart_nodes, clone)
+        gui.set_enabled(clone, false)
+    end
+    table.insert(self.star_nodes, star_node)
+    gui.set_enabled(star_node, false)
+    for i = 1, 9 do
+        local clone = gui.clone(star_node)
+        local pos = gui.get_position(star_node)
+        pos.x = pos.x + i * 32
+        gui.set_position(clone, pos)
+        table.insert(self.star_nodes, clone)
+        gui.set_enabled(clone, false)
+    end
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("set_stats") then
-                -- Update the score GUI node
-                gui.set_text(gui.get_node("score"), message.score)
-                -- Enable the right number of heart nodes
-                for i = 1, message.health do
-                        gui.set_enabled(self.heart_nodes[i], true)
-                end
-                -- Enable the right number of star nodes
-                for i = 1, message.stars do
-                        gui.set_enabled(self.star_nodes[i], true)
-                end
+    if message_id == hash("set_stats") then
+        -- Update the score GUI node
+        gui.set_text(gui.get_node("score"), message.score)
+        -- Enable the right number of heart nodes
+        for i = 1, message.health do
+            gui.set_enabled(self.heart_nodes[i], true)
         end
+        -- Enable the right number of star nodes
+        for i = 1, message.stars do
+            gui.set_enabled(self.star_nodes[i], true)
+        end
+    end
 end
-
 ```
 
 ## Child-parent vs. collection-object hierarchies
 
 We have seen how object addressing via paths is static in Defold meaning that when you code your game logic you can always trust the integrity of object’s id.
 
-Object parent-child hierarchies is a dynamic relation affecting how objects react to transformations. Any transformation applied to an object will in turn be applied to the object’s children. You can alter an object’s parent in run-time by sending "set_parent" messages.
+Object parent-child hierarchies is a dynamic relation affecting how objects react to transformations. Any transformation applied to an object will in turn be applied to the object’s children. You can alter an object’s parent in run-time by sending `set_parent` messages.
 
 ```lua
 local parent = go.get_id("tree")
@@ -327,17 +319,14 @@ By making the hearts children of the tree, they will be affected by any _transfo
 ::: important
 Note that the paths to the heart objects inside the "hearttree" collection are unaffected by the dynamic parent-child relation we set up:
 
-- /hearttree/heart1 (_Not "/hearttree/tree/heart1"_)
-- /hearttree/heart2
-- /hearttree/heart3
-- /hearttree/heart4
+- `/hearttree/heart1` (_Not_ `/hearttree/tree/heart1`)
+- `/hearttree/heart2`
+- `/hearttree/heart3`
+- `/hearttree/heart4`
 
 The parent-child relationship is separate from the address of the object within the collection hierarchy. Thus, the parent-child relationship is _in no way_ reflected in the URL of an object.
 :::
 
-[[anchor-at]]
-## Advanced topics
-
 ## Constructing URLs
 
 In rare situations you might find the need to build URL objects programmatically. You can do it like this:
@@ -373,7 +362,7 @@ For instance, you can toggle the system profiler by sending a message `msg.post(
 
 ## Collection Proxies
 
-When Defold starts up it will automatically load and initiate the collection specified in the "main_collection" parameter under "bootstrap" in the game project settings.
+When Defold starts up it will automatically load and initiate the collection specified in the *main_collection* parameter under *bootstrap* in the game project settings.
 
 You might want to load different collections dynamically and, for example, keep different game levels in separate collections. Defold uses a specific collection proxy object that acts as proxy for a collection that can be loaded dynamically.
 
@@ -408,40 +397,40 @@ A more in depth description can be found in the [Collection Proxies](/manuals/co
 
 When posted messages are dispatched and the recipients’ `on_message()` is called, it is common that you post new messages in your reaction code. You can build long chains of messaging that the engine has to dispatch. When does this happen?
 
-The short answer is that the dispatching happens immediately. The engine has started dispatching messages and will continue to do so until the message queue is emptyeven if you continue to fill the queue by posting new messages.
+The short answer is that the dispatching happens immediately. The engine has started dispatching messages and will continue to do so until the message queue is empty---even if you continue to fill the queue by posting new messages.
 
 There is, however, a hard limit to how many times the engine tries to empty the queue, which effectively puts a limit to how long message chains you can expect to be fully dispatched within a frame. You can easily test how many dispatch passes the engine performs between each `update()` with the following script:
 
 ```lua
 function init(self)
-        -- We’re starting a long message chain during object init
-        -- and keeps it running through a number of update() steps.
-        print("INIT")
-        msg.post("#", "msg")
-        self.updates = 0
-        self.count = 0
+    -- We’re starting a long message chain during object init
+    -- and keeps it running through a number of update() steps.
+    print("INIT")
+    msg.post("#", "msg")
+    self.updates = 0
+    self.count = 0
 end
 
 function update(self, dt)
-        if self.updates < 5 then
-                self.updates = self.updates + 1
-                print("UPDATE " .. self.updates)
-                print(self.count .. " dispatch passes before this update.")
-                self.count = 0
-        end
+    if self.updates < 5 then
+        self.updates = self.updates + 1
+        print("UPDATE " .. self.updates)
+        print(self.count .. " dispatch passes before this update.")
+        self.count = 0
+    end
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("msg") then
-                self.count = self.count + 1
-                msg.post("#", "msg")
-        end
+    if message_id == hash("msg") then
+        self.count = self.count + 1
+        msg.post("#", "msg")
+    end
 end
 ```
 
 Running this script will print something like the following:
 
-----
+```txt
 DEBUG:SCRIPT: INIT
 INFO:ENGINE: Defold Engine 1.2.36 (5b5af21)
 DEBUG:SCRIPT: UPDATE 1
@@ -454,7 +443,7 @@ DEBUG:SCRIPT: UPDATE 4
 DEBUG:SCRIPT: 75 dispatch passes before this update.
 DEBUG:SCRIPT: UPDATE 5
 DEBUG:SCRIPT: 75 dispatch passes before this update.
-----
+``
 
 We see that this particular Defold engine version performs 10 dispatch passes on the message queue between `init()` and the first call to `update()`. It then performs 75 passes during each subsequent update loop.
 

+ 9 - 7
docs/en/manuals/model.md

@@ -1,9 +1,11 @@
-Model component
-===============
+---
+title: 3D models in Defold
+brief: This manual describes how to bring 3D models, skeletons and animations into your game.
+---
 
-Defold is at its core a 3D engine. Even when you work with 2D material only all rendering is done in 3D, but ortographically projected onto the screen. This manual describes how to bring 3D models, skeletons and animations into your game.
+# Model component
 
-Defold allows you to utilize full 3D content by including 3D assets, or _Models_ into your collections. You can build games in strictly 3D with only 3D assets, or you can mix 3D and 2D content as you wish.
+Defold is at its core a 3D engine. Even when you work with 2D material only all rendering is done in 3D, but ortographically projected onto the screen.  Defold allows you to utilize full 3D content by including 3D assets, or _Models_ into your collections. You can build games in strictly 3D with only 3D assets, or you can mix 3D and 2D content as you wish.
 
 ## Creating a model
 
@@ -29,8 +31,8 @@ Now, to import the model, simply drag and drop the *.dae* file and the correspon
 
 Model components are created just like any other game object component. You can do it two ways:
 
-- Create a *Model file* by right-clicking in the *Project Explorer* and select *New > Model File*
-- Create the component embedded directly into a game object by right-clicking the game object in the *Outline* view and selecting *Add Component*. Then select *Model*.
+- Create a *Model file* by right-clicking in the *Project Explorer* and select <kbd>New ▸ Model File</kbd>.
+- Create the component embedded directly into a game object by right-clicking the game object in the *Outline* view and selecting <kbd>Add Component</kbd>. Then select *Model*.
 
 ![Model in game object](images/model/model.png)
 
@@ -40,7 +42,7 @@ With the model in place you need to specify a number of properties
 : This property should refer to the Collada *.dae* file that contains the mesh to use.
 
 *Material*
-: Set this property to a material you have created that is suitable for a textured 3D object. There is a built-in "model.material" file that you can use as a starting point.
+: Set this property to a material you have created that is suitable for a textured 3D object. There is a built-in *model.material* file that you can use as a starting point.
 
 *Texture*
 : This property should point to the texture image file that you want applied to the object.

+ 186 - 188
docs/en/manuals/modules.md

@@ -1,11 +1,11 @@
-Modules
-=======
-:location: documentation manuals logic
-:type: manual
+---
+title: Lua modules in Defold
+brief: Lua modules allow you to structure your project and create reusable library code. This manual explains how to do that in Defold.
+---
 
-Lua modules allow you to structure your project and create reusable library code. This manual explains how to do that in Defold.
+# Lua modules
 
-It is generally a good idea to avoid duplication in your projects. Script code that replicates identical behavior between different game objects can simply be copied and pasted. However, if instead the script code could be shared between the game objects, any changes to the single script code instance would instantly affect both game objects.
+Lua modules allow you to structure your project and create reusable library code. It is generally a good idea to avoid duplication in your projects. Script code that replicates identical behavior between different game objects can simply be copied and pasted. However, if instead the script code could be shared between the game objects, any changes to the single script code instance would instantly affect both game objects.
 
 Defold allows you to include script files into other script files which allows you to share code. Moreover, Lua modules can be used to encapsulate functionality and data in an external script file for reuse in game object and GUI script files.
 
@@ -15,31 +15,31 @@ Suppose we are building an application featuring butterflies of different kinds.
 
 ![Blue butterfly](images/modules/modules_blue_butterfly.png)
 
-We put the following code in "blue_butterfly.script":
+We put the following code in *blue_butterfly.script*:
 
 ```lua
 require "modules_example.flying"
 
 function init(self)
-        fly_randomly()
+    fly_randomly()
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("fly_randomly_done") then
-                fly_randomly()
-        end
+    if message_id == hash("fly_randomly_done") then
+        fly_randomly()
+    end
 end
 ```
 
-The idea is that we call *fly_randomly()* at *init()* which will cause the butterfly to animate to a new random position some distance relative to its origin. When the animation is done, we get a "fly_randomly_done" message back and immediately send the butterfly to a new random position (some distance relative its origin).
+The idea is that we call `fly_randomly()` at `init()` which will cause the butterfly to animate to a new random position some distance relative to its origin. When the animation is done, we get a `fly_randomly_done` message back and immediately send the butterfly to a new random position (some distance relative its origin).
 
-The first line "require 'modules_example.flying'" reads the script file "flying.lua" in the folder "modules_example" (where the application logic is stored) into the engine.
+The first line `require 'modules_example.flying'` reads the script file *flying.lua* in the folder *modules_example* (where the application logic is stored) into the engine.
 
 ::: sidenote
 The syntax of the filename string provided to `require` is a bit special. Lua will replace '.' characters in the filename string with path separators: '/' on Mac OS X and Linux and '\' on Windows.
 :::
 
-To create "flying.lua", just add a new Lua module file to your project and name it:
+To create *flying.lua*, just add a new Lua module file to your project and name it:
 
 ![New module](images/modules/modules_new.png)
 
@@ -53,30 +53,30 @@ local origin
 -- from the original position
 -- This function sends back a "fly_randomly_done" message when it's done.
 function fly_randomly(radius)
-        -- Radius is 100 unless specified
-        radius = radius or 100
-        local go_id = go.get_id()
-        -- Store original location
-        if origin == nil then
-                origin = go.get_world_position(go_id)
-        end
-
-        -- Figure out a random position at max distance
-        -- "radius" from origin
-        local rand_angle = math.random(0, 3.141592 * 2)
-        local rand_radius = math.random(radius)
-        local offset = vmath.rotate(vmath.quat_rotation_z(rand_angle),
-                                    vmath.vector3(rand_radius, 0, 0))
-        local rand_pos = origin + offset
-        -- Set a random duration scaled against the radius to prevent
-        -- too fast animation.
-        local rand_duration = math.random(radius) / 100 + (radius / 200)
-        -- Animate, then send a message back when completed
-        go.animate(".", "position", go.PLAYBACK_ONCE_FORWARD,
-                rand_pos, go.EASING_INOUTSINE, rand_duration, 0.0,
-                function ()
-                        msg.post("#", "fly_randomly_done")
-                end)
+    -- Radius is 100 unless specified
+    radius = radius or 100
+    local go_id = go.get_id()
+    -- Store original location
+    if origin == nil then
+        origin = go.get_world_position(go_id)
+    end
+
+    -- Figure out a random position at max distance
+    -- "radius" from origin
+    local rand_angle = math.random(0, 3.141592 * 2)
+    local rand_radius = math.random(radius)
+    local offset = vmath.rotate(vmath.quat_rotation_z(rand_angle),
+                                vmath.vector3(rand_radius, 0, 0))
+    local rand_pos = origin + offset
+    -- Set a random duration scaled against the radius to prevent
+    -- too fast animation.
+    local rand_duration = math.random(radius) / 100 + (radius / 200)
+    -- Animate, then send a message back when completed
+    go.animate(".", "position", go.PLAYBACK_ONCE_FORWARD,
+        rand_pos, go.EASING_INOUTSINE, rand_duration, 0.0,
+        function ()
+            msg.post("#", "fly_randomly_done")
+        end)
 end
 ```
 
@@ -90,14 +90,14 @@ The code for flying randomly already exist, so creating the script for the yello
 require "modules_example.flying"
 
 function init(self)
-        -- Yellow butterflies have a wider flying range.
-        fly_randomly(200)
+    -- Yellow butterflies have a wider flying range.
+    fly_randomly(200)
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("fly_randomly_done") then
-                fly_randomly(200)
-        end
+    if message_id == hash("fly_randomly_done") then
+        fly_randomly(200)
+    end
 end
 ```
 
@@ -113,11 +113,11 @@ local origin
 It is defined "local" which means that it is local to the current Lua context. Since all game objects are evaluated in the same Lua context, the yellow and blue butterfly will use exactly the same variable origin. One of the butterfly objects will set the variable to its origin, then the second butterfly will use the same value for its origin:
 
 ```lua
-        -- "origin" is not set if someone in the same context
-        -- has already set it...
-        if origin == nil then
-                origin = go.get_world_position(go_id)
-        end
+-- "origin" is not set if someone in the same context
+-- has already set it...
+if origin == nil then
+    origin = go.get_world_position(go_id)
+end
 ```
 
 We’ll soon see how we can easily fix this bug, but first we should address a more subtle problem.
@@ -130,7 +130,8 @@ In our included Lua file, we define a variable origin that we use to store data.
 local flying_origin
 
 function flying_fly_randomly(radius)
-        ...
+    ...
+end
 ```
 
 This works, but Lua provides a simple and elegant way to organize script code and data: modules.
@@ -154,50 +155,50 @@ M.origins = {}
 -- from the original position
 -- This function sends back a "fly_randomly_done" message when it's done.
 function M.fly_randomly(radius)
-        -- Radius is 100 unless specified
-        radius = radius or 100
-        -- We need current object id to index the original position.
-        -- Can't use "."
-        local go_id = go.get_id()
-        -- Store origin position if it's not already stored.
-        if flying.origins[go_id] == nil then
-                flying.origins[go_id] = go.get_world_position(go_id)
-        end
-
-        -- Figure out a random position at max distance
-        -- "radius" from origin
-        local rand_angle = math.random(0, 3.141592 * 2)
-        local rand_radius = math.random(radius)
-        local offset = vmath.rotate(vmath.quat_rotation_z(rand_angle),
-                                    vmath.vector3(rand_radius, 0, 0))
-        local rand_pos = flying.origins[go_id] + offset
-        -- Set a random duration scaled against the radius to prevent
-        -- too fast animation.
-        local rand_duration = math.random(radius) / 100 + (radius / 200)
-        -- Animate, then send a message back when completed
-        go.animate(".", "position", go.PLAYBACK_ONCE_FORWARD,
-                rand_pos, go.EASING_INOUTSINE, rand_duration, 0.0,
-                function ()
-                        msg.post("#", "fly_randomly_done")
-                end)
+    -- Radius is 100 unless specified
+    radius = radius or 100
+    -- We need current object id to index the original position.
+    -- Can't use "."
+    local go_id = go.get_id()
+    -- Store origin position if it's not already stored.
+    if flying.origins[go_id] == nil then
+        flying.origins[go_id] = go.get_world_position(go_id)
+    end
+
+    -- Figure out a random position at max distance
+    -- "radius" from origin
+    local rand_angle = math.random(0, 3.141592 * 2)
+    local rand_radius = math.random(radius)
+    local offset = vmath.rotate(vmath.quat_rotation_z(rand_angle),
+                                vmath.vector3(rand_radius, 0, 0))
+    local rand_pos = flying.origins[go_id] + offset
+    -- Set a random duration scaled against the radius to prevent
+    -- too fast animation.
+    local rand_duration = math.random(radius) / 100 + (radius / 200)
+    -- Animate, then send a message back when completed
+    go.animate(".", "position", go.PLAYBACK_ONCE_FORWARD,
+        rand_pos, go.EASING_INOUTSINE, rand_duration, 0.0,
+        function ()
+            msg.post("#", "fly_randomly_done")
+        end)
 end
 
 return M
 ```
 
-The difference is that we create a table flying that we populate with our data (flying.origins) and functions (*flying.fly_randomly()*). We end the module by returning the table. To use the module we change the butterfly scripts to:
+The difference is that we create a table flying that we populate with our data (`flying.origins`) and functions (`flying.fly_randomly()`). We end the module by returning the table. To use the module we change the butterfly scripts to:
 
 ```lua
 flying = require "modules_example.flying"
 
 function init(self)
-        flying.fly_randomly()
+    flying.fly_randomly()
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("fly_randomly_done") then
-                flying.fly_randomly()
-        end
+    if message_id == hash("fly_randomly_done") then
+        flying.fly_randomly()
+    end
 end
 ```
 
@@ -213,13 +214,13 @@ Since the module returns the table containing all the module code and data we ge
 banana = require "modules_example.flying"
 
 function init(self)
-        banana.fly_randomly()
+    banana.fly_randomly()
 end
 
 function on_message(self, message_id, message, sender)
-        if message_id == hash("fly_randomly_done") then
-                banana.fly_randomly()
-        end
+    if message_id == hash("fly_randomly_done") then
+        banana.fly_randomly()
+    end
 end
 ```
 
@@ -227,11 +228,9 @@ This means that we can even use two modules with the same name--we just assign t
 
 With the module mechanism we are now fully equipped to encapsulate shared functionality and avoid any name collisions.
 
-## Best practices
-
 ## Naming conventions
 
-There are many different ways to define the module table, but we recommend using the standard of naming the table containing the public functions and values *M* (See http://lua-users.org/wiki/ModuleDefinition). The use of the name *M* helps, since it prevents mistakes like accidentally shadowing the module table by a function argument with the same name.
+There are many different ways to define the module table, but we recommend using the standard of naming the table containing the public functions and values `M` (See http://lua-users.org/wiki/ModuleDefinition). The use of the name `M` helps, since it prevents mistakes like accidentally shadowing the module table by a function argument with the same name.
 
 ```lua
 --- Module description
@@ -250,10 +249,10 @@ end
 -- then be passed to the module functions.
 -- @return Instance of foobar
 function M.create()
-        local foobar = {
-                foo = "foo"
-        }
-        return foobar
+    local foobar = {
+        foo = "foo"
+    }
+    return foobar
 end
 
 --- This function does something.
@@ -261,7 +260,7 @@ end
 -- @param foobar
 -- @return foo
 function M.do_something(foobar)
-        return foobar.foo
+    return foobar.foo
 end
 
 --- This function does something else.
@@ -269,16 +268,16 @@ end
 -- @param foobar
 -- @return foobar
 function M.do_something_else(foobar)
-        return M.do_something(foobar) + M.BAR
+    return M.do_something(foobar) + M.BAR
 end
 
 return M
 ```
 
-## Allow monkey patching
+## Allowing monkey patching
 
-[quote, Wikipedia]
-"A monkey patch is a way to extend or modify the run-time code of dynamic languages without altering the original source code."
+>   "A monkey patch is a way to extend or modify the run-time code of dynamic languages 
+>   without altering the original source code." [Wikipedia]
 
 Lua is a dynamic language and as such it is possible to modify all of the builtin modules. This is extremely powerful and very useful, primarily for testing and debugging purposes. Monkey patching easily leads to strong coupling, which is usually a bad idea. However, if you write a module, you should make it possible to monkey patch your custom modules as well. Lua allows you to do things like:
 
@@ -287,19 +286,19 @@ Lua is a dynamic language and as such it is possible to modify all of the builti
 local M = {}
 
 M.foo = function()
-  print('this is a public module function')
+    print('this is a public module function')
 end
 
 setmetatable(M, {
-  __newindex = function(m, t)
-    error('The user has tried to add the attribute ' .. t .. ' to the module!')
-  end
+    __newindex = function(m, t)
+        error('The user has tried to add the attribute ' .. t .. ' to the module!')
+    end
 })
 
 return M
 ```
 
-Tricks like the above is not a good idea. You should leave the decision on what to do to your module to the user.
+Tricks like the above is usually not a good idea. You should leave the decision on what to do to your module to the user.
 
 ## Beware of locals
 
@@ -309,15 +308,15 @@ If you decide to not define modules using the style mentioned above (by defining
 local M = {}
 
 local function sum(a, b)
-	return a + b
+    return a + b
 end
 
 local function mult(a, b)
-	local result = 0
-	for i=1,b do
-		result = sum(result, a)
-	end
-	return result
+    local result = 0
+    for i=1,b do
+        result = sum(result, a)
+    end
+    return result
 end
 
 M.sum = sum
@@ -326,7 +325,7 @@ M.mult = mult
 return M
 ```
 
-This is a very simple calculator module. Notice how the module table is assigned its public functions at the end. Also notice how the local *mult()* function uses the local *sum()* function. Doing so might be marginally faster, but it also introduces a subtle issue. If we, for some reason, were to monkey patch the module like this:
+This is a very simple calculator module. Notice how the module table is assigned its public functions at the end. Also notice how the local `mult()` function uses the local `sum()` function. Doing so might be marginally faster, but it also introduces a subtle issue. If we, for some reason, were to monkey patch the module like this:
 
 ```lua
 local summult = require("summult")
@@ -334,13 +333,13 @@ summult.sum = function(a,b) return 1 end
 print(summult.mult(5,2))
 ```
 
-Now, even after being overridden, *summult.mult(5,2)* still returns 10 (while you would expect 1). The problem is that the user changes the *sum()* function on the module table, but internally in *multi()* the local and unmodified function is still used.
+Now, even after being overridden, `summult.mult(5,2)` still returns `10` (while you would expect 1). The problem is that the user changes the `sum()` function on the module table, but internally in `multi()` the local and unmodified function is still used.
 
-## Don’t pollute the global scope and don’t leak or expose internal state
+## Don’t pollute the global scope
 
 This best practice is not specific to modules, but it’s worth reiterating the importance of not using the global scope to store state or define functions. One obvious risk of storing state in the global scope is that you expose the state of the module. Another is the risk of two modules using the same global variables (coupling). Note, though that Defold shares the Lua context only between objects in the same collection, so there is no truly global scope.
 
-It’s a good practice during development to monitor the global table and raise an *error()* whenever the global table is modified.
+It’s a good practice during development to monitor the global table and raise an `error()` whenever the global table is modified.
 
 ::: sidenote
 For more info, read the Lua Wiki page http://lua-users.org/wiki/DetectingUndefinedVariables
@@ -354,29 +353,29 @@ This code can be used to guard the global table:
 -- @module superstrict
 -- @usage
 --
---	-- Defold specific example. Allow the gameobject and gui script lifecycle functions. Also allow assignment of
---	-- facebook and iap modules for dummy implementations on desktop. The whitelist handles pattern matching and in the
---	-- example all functions prefixed with '__' will also be allowed in the global scope
--- 	local superstrict = require("superstrict")
--- 	superstrict.lock(_G, { "go", "gui", "msg", "url", "sys", "render", "factory", "particlefx", "physics", "sound", "sprite", "image", "tilemap", "vmath", "matrix4", "vector3", "vector4", "quat", "hash", "hash_to_hex", "hashmd5", "pprint", "iap", "facebook", "push", "http", "json", "spine", "zlib", "init", "final", "update", "on_input", "on_message", "on_reload", "__*" })
+--  -- Defold specific example. Allow the gameobject and gui script lifecycle functions. Also allow assignment of
+--  -- facebook and iap modules for dummy implementations on desktop. The whitelist handles pattern matching and in the
+--  -- example all functions prefixed with '__' will also be allowed in the global scope
+--  local superstrict = require("superstrict")
+--  superstrict.lock(_G, { "go", "gui", "msg", "url", "sys", "render", "factory", "particlefx", "physics", "sound", "sprite", "image", "tilemap", "vmath", "matrix4", "vector3", "vector4", "quat", "hash", "hash_to_hex", "hashmd5", "pprint", "iap", "facebook", "push", "http", "json", "spine", "zlib", "init", "final", "update", "on_input", "on_message", "on_reload", "__*" })
 --
---	-- this will be allowed
---	__allowed = "abc"
+--  -- this will be allowed
+--  __allowed = "abc"
 --
---	-- and this
---	facebook = dummy_fb
+--  -- and this
+--  facebook = dummy_fb
 --
---	-- this is ok
---	function init(self)
---	end
+--  -- this is ok
+--  function init(self)
+--  end
 --
---	-- this will throw an error
---	if foo == "bar" then
---	end
+--  -- this will throw an error
+--  if foo == "bar" then
+--  end
 --
---	-- this will also throw an error
---	function global_function_meant_to_be_local()
---	end
+--  -- this will also throw an error
+--  function global_function_meant_to_be_local()
+--  end
 --
 local M = {}
 
@@ -386,18 +385,17 @@ local whitelisted_names = {}
 -- make sure that no one messes with the error function since we need it to communicate illegal access to locked tables
 local _error = error
 
-
 --- Check if a key in a table is whitelisted or not
 -- @param t The table to check for a whitelisted name
 -- @param n Name of the variable to check
 -- @return true if n is whitelisted on t
 local function is_whitelisted(t, n)
-	for _,whitelisted_name in pairs(whitelisted_names[t] or {}) do
-		if n:find(whitelisted_name) then
-			return true
-		end
-	end
-	return false
+    for _,whitelisted_name in pairs(whitelisted_names[t] or {}) do
+        if n:find(whitelisted_name) then
+            return true
+        end
+    end
+    return false
 end
 
 --- Guarded newindex
@@ -407,12 +405,12 @@ end
 -- @param n Name of the variable to set on the table
 -- @param v The value to set
 local function lock_newindex(t, n, v)
-	if is_whitelisted(t, n) then
-		rawset(t, n, v)
-		return
-	end
+    if is_whitelisted(t, n) then
+        rawset(t, n, v)
+        return
+    end
 
-	_error("Table [" .. tostring(t) .. "] is locked. Attempting to write value to '" .. n .. "'. You must declare '" .. n .. "' as local or added it to the whitelist.", 2)
+    _error("Table [" .. tostring(t) .. "] is locked. Attempting to write value to '" .. n .. "'. You must declare '" .. n .. "' as local or added it to the whitelist.", 2)
 end
 
 --- Guarded __index
@@ -420,11 +418,11 @@ end
 -- @param t The table on which a new index is being set
 -- @param n Name of the variable to set on the table
 local function lock_index(t, n)
-	if is_whitelisted(t, n) then
-		return rawget(t, n)
-	end
+    if is_whitelisted(t, n) then
+        return rawget(t, n)
+    end
 
-	_error("Table [" .. tostring(t) .. "] is locked. Attempting to read undefined value '" .. n .. "'.", 2)
+    _error("Table [" .. tostring(t) .. "] is locked. Attempting to read undefined value '" .. n .. "'.", 2)
 end
 
 --- Lock a table. This will prevent the table from being assigned new values (functions and variables)
@@ -432,23 +430,23 @@ end
 -- @param t Table to lock
 -- @param whitelist List of names that are allowed on the table
 function M.lock(t, whitelist)
-	assert(t, "You must pass a table to lock")
-	whitelisted_names[t] = whitelist or {}
-	local mt = getmetatable(t) or {}
-	mt.__newindex = lock_newindex
-	mt.__index = lock_index
-	setmetatable(t, mt)
+    assert(t, "You must pass a table to lock")
+    whitelisted_names[t] = whitelist or {}
+    local mt = getmetatable(t) or {}
+    mt.__newindex = lock_newindex
+    mt.__index = lock_index
+    setmetatable(t, mt)
 end
 
 ---
 -- Unlock a table
 -- @param t Table to unlock
 function M.unlock(t)
-	assert(t, "You must pass a table to unlock")
-	local mt = getmetatable(t) or {}
-	mt.__newindex = rawset
-	mt.__index = rawget
-	setmetatable(t, mt)
+    assert(t, "You must pass a table to unlock")
+    local mt = getmetatable(t) or {}
+    mt.__newindex = rawset
+    mt.__index = rawget
+    setmetatable(t, mt)
 end
 
 return M
@@ -467,13 +465,13 @@ local M = {}
 local state = {}
 
 function M.do_something(foobar)
-	table.insert(state, foobar)
+    table.insert(state, foobar)
 end
 
 return M
 ```
 
-A stateless module on the other hand doesn’t keep any internal state. Instead it provides a mechanism to externalize the state into a separate table that is local to the module user. Most approaches to stateless modules rely on a constructor function within the module, often called *create()* or *new()*. The constructor function returns a table where state is stored, and depending on the implementation sometimes also the module functions themselves.
+A stateless module on the other hand doesn’t keep any internal state. Instead it provides a mechanism to externalize the state into a separate table that is local to the module user. Most approaches to stateless modules rely on a constructor function within the module, often called `create()` or `new()`. The constructor function returns a table where state is stored, and depending on the implementation sometimes also the module functions themselves.
 
 ## Stateless modules using only a state table
 
@@ -483,18 +481,18 @@ Perhaps the easiest approach is to use a constructor function that returns a new
 local M = {}
 
 local function private_function(self, bar)
-	return self.public_variable .. bar
+    return self.public_variable .. bar
 end
 
 function M.public_function(self, bar)
-	return private_function(self, bar)
+    return private_function(self, bar)
 end
 
 function M.new(foo)
-	local instance = {
-		public_variable = foo
-	}
-	return instance
+    local instance = {
+        public_variable = foo
+    }
+    return instance
 end
 
 return M
@@ -521,18 +519,18 @@ Another approach is to use a constructor function that returns a new table with
 local M = {}
 
 local function private_function(self, bar)
-	return self.public_variable .. bar
+    return self.public_variable .. bar
 end
 
 function M:public_function(bar)
-	return private_function(self, bar)
+    return private_function(self, bar)
 end
 
 function M.new(foo)
-	local instance = {
-		public_variable = foo
-	}
-	return setmetatable(instance, { __index = M })
+    local instance = {
+        public_variable = foo
+    }
+    return setmetatable(instance, { __index = M })
 end
 
 return M
@@ -548,34 +546,34 @@ print(fb:public_function(“bar”))
 ```
 
 ::: sidenote
-Note the use of the colon operator when calling and defining functions on the module. An expression like *o:foo(x)* is just another way to write *o.foo(o, x)*, that is, to call *o.foo()* adding *o* as a first extra argument. In a function declaration, a first parameter *self* is added.
+Note the use of the colon operator when calling and defining functions on the module. An expression like `o:foo(x)` is just another way to write `o.foo(o, x)`, that is, to call `o.foo()` adding `o` as a first extra argument. In a function declaration, a first parameter `self` is added.
 
 Read more here: http://www.lua.org/pil/5.html
 :::
 
 ## Stateless modules using closures
 
-A third way to define a module is by using Lua closures (See http://www.lua.org/pil/6.1.html for details). A function returns the instance and the closure contains the instance, private and public data and functions--there is no need to pass the instance as an argument (either explicitly or implicitly using the colon operator) like when using metatables. This method is also somewhat faster than using metatables since function calls does not need to go through the "__index" metamethods. One drawback is that each closure contains its own copy of the methods so memory consumption is higher. Another is that it's not possible to monkey-patch the instance methods in a clean way.
+A third way to define a module is by using Lua closures (See http://www.lua.org/pil/6.1.html for details). A function returns the instance and the closure contains the instance, private and public data and functions---there is no need to pass the instance as an argument (either explicitly or implicitly using the colon operator) like when using metatables. This method is also somewhat faster than using metatables since function calls does not need to go through the `__index` metamethods. One drawback is that each closure contains its own copy of the methods so memory consumption is higher. Another is that it's not possible to monkey-patch the instance methods in a clean way.
 
 ```lua
 local M = {}
 
 function M.new(foo)
-	local instance = {
-		public_variable = foo
-	}
+    local instance = {
+        public_variable = foo
+    }
 
-	local private_variable = ""
+    local private_variable = ""
 
-	local private_function = function(bar)
-		return instance.public_variable .. private_variable .. bar
-	end
+    local private_function = function(bar)
+        return instance.public_variable .. private_variable .. bar
+    end
 
-	instance.public_function = function(bar)
-		return private_function(bar)
-	end
+    instance.public_function = function(bar)
+        return private_function(bar)
+    end
 
-	return instance
+    return instance
 end
 
 return M
@@ -590,18 +588,18 @@ print(fb.public_variable)
 print(fb.public_function(“bar”))
 ```
 
-## Modules and module functions should have a clear purpose and behave expectedly
+## Modules should behave expectedly
 
 Modules are primarily intended to simplify reuse and to encapsulate behavior. When writing a module, it is important to design the module and name its functions in such a way that the expected behavior can be inferred simply by looking at module, function and argument names.
 
-If a function in the module account is named *login(username, password)* the expected behavior is that the function should perform a login to an account using the specified username and password--and nothing else.
-
-## Document the module and all public functions
+If a function in the module account is named `login(username, password)` the expected behavior is that the function should perform a login to an account using the specified username and password---and nothing else.
 
-When documenting a module or function, remember to write documentation only when it adds information that can’t be inferred from function and argument names. In many cases short, well named functions and well named function arguments are enough to infer how the modules works, what to use and what to expect from a function call. Document return values, preconditions and examples of usage. Write documentation using the LDoc standard.
+## Document the module
 
 ::: sidenote
 Details on the LDoc documentation standard can be found here: https://github.com/stevedonovan/LDoc
 :::
 
+When documenting a module or function, remember to write documentation only when it adds information that can’t be inferred from function and argument names. In many cases short, well named functions and well named function arguments are enough to infer how the modules works, what to use and what to expect from a function call. Document return values, preconditions and examples of usage. Write documentation using the LDoc standard.
+
 

+ 120 - 96
docs/en/manuals/particlefx.md

@@ -1,143 +1,167 @@
-Particle FX
-===========
-:location: documentation manuals resources
-:type: manual
+---
+title: Particle effects in Defold
+brief: This manual explains how the particle fx component works and how to edit it to create visual particle effects.
+---
 
-This manual explains how the particle fx component works and how to edit it to create visual particle effects.
+# Particle FX
 
-ParticleFX Overview Video
--------------------------
 It is possible to enhance the visual appeal of the game by using Particle effects. Watch this video for an introduction on how to work with particle effects in Defold.
 
-
-++`+
 <iframe width="560" height="315" src="https://www.youtube.com/embed/qzyB1lXNDKQ" frameborder="0" allowfullscreen></iframe>
-`+`+
 
 ![ParticleFX Editor](images/particlefx/effect_editor.png)
 
-Concepts
---------
+## Concepts
+
+ParticleFX
+: A component that represents a particle effect.
+
+Emitter
+: A positioned shape that emits particles uniformly distributed over the shape.
+
+Modifier
+: Affects the velocity of spawned particles (field in Maya). Acceleration, drag, radial and vortex.
 
-* *ParticleFX* - [component](/manuals/introduction#anchor-co) that represents a particle effect.
-* *Emitter* - A positioned shape that emits particles uniformly distributed over the shape.
-* *Modifier* - Affects the velocity of spawned particles (field in Maya). Acceleration, drag, radial and vortex.
-* *Tile source* - Used for adding textures and flip-book animations, see the [2D graphics documentation](/manuals/2dgraphics)
+Image (Tile source or Atlas)
+: Used for adding textures and flip-book animations, see the [2D graphics documentation](/manuals/2dgraphics)
 
 When a ParticleFX file is created and opened, it is possible to add emitters and modifiers from the context menu in the Outline-view.
 
-.ParticleFX Editor Outline
 ![ParticleFX Editor Outline](images/particlefx/effect_outline.png)
 
-.ParticleFX Emitter Properties
 ![ParticleFX Emitter Properties](images/particlefx/emitter_properties.png)
 
-Previewing
-----------
+## Previewing
 
 To preview the particle effects, the scene editor is used. It is explained in detail here: [Scene Editing](/manuals/scene-editing/).
-Use the Space key to start and stop particle effects while previewing. Whether the particle effect is playing or not, it will be updated in real-time while tweaking it.
+Use the <kbd>Space</kbd> key to start and stop particle effects while previewing. Whether the particle effect is playing or not, it will be updated in real-time while tweaking it.
 
-Value tweaking
---------------
-All number properties can be tweaked using the mouse-wheel (or scroll gesture on track-pad) when the alt-key modifier is pressed. Use the alt-key in combination with the ctrl-key to increase the speed by a factor of 10.
+## Value tweaking
 
+All number properties can be tweaked using the mouse-wheel (or scroll gesture on track-pad) when the <kbd>Alt</kbd> key modifier is pressed. Use the <kbd>Alt</kbd> key in combination with the <kbd>Ctrl</kbd> key to increase the speed by a factor of 10.
 
-Keying Properties
------------------
+## Keying properties
 
-.ParticleFX Curve Editor
 ![ParticleFX Curve Editor](images/particlefx/curve_editor.png)
 
-
 Different properties can be keyed over different time lines, which means that their value can change over time. It is possible to see which properties have this ability in the reference below.
 
-* To key a value:
-** Select Curve from the context menu in the text field you wish to key, which gives the text field a light green background.
-** Go to the Curve Editor (available among the tabs in the bottom view) and modify the curve. It is possible to click and drag the points and tangents. Double-click to add or remove points (also available from the context menu inside the Curve Editor).
-* Keyed properties can't be edited in the Properties View, only in the Curve Editor.
-* To reset a keyed property, select Curve again from the context menu in its text field.
-* To auto-zoom the Curve Editor to display all curves, press F
+To key a value:
+
+- Select Curve from the context menu in the text field you wish to key, which gives the text field a light green background.
+- Go to the Curve Editor (available among the tabs in the bottom view) and modify the curve. It is possible to click and drag the points and tangents. Double-click to add or remove points (also available from the context menu inside the Curve Editor).
 
+Keyed properties can't be edited in the Properties View, only in the Curve Editor.
+To reset a keyed property, select Curve again from the context menu in its text field.
+To auto-zoom the Curve Editor to display all curves, press <kbd>F</kbd>.
 
 Spread
-~~~~~~
-
-When a property has two fields, the first is the value and the second is the spread. The value is what you key. The spread is a variation which is applied randomly for each spawned particle. E.g. if the value is 50 and the spread is 10, each spawned particle will get 50 `/- 10 as value.
-
-Reference
----------
-
-Emitter Properties
-~~~~~~~~~~~~~~~~~~
-* Id - emitter identifier (used when setting render constants for specific emitters).
-* Mode - if the emitter should stop (once) or restart (loop) when reaching its duration.
-* Duration - for how long the emitter should emit particles.
-* Space - in which geometrical space the spawned particles will exist. World means the particles are left in the world and move independently of the emitter, Emitter means they will move relative the emitter.
-* Position/rotation - Transform of the emitter relative the ParticleFX component.
-* Tile Source - Tile Source file to use for texturing and animating the particles.
-* Animation - which animation in the tile source to use on the particles.
-* Material - material to use for shading the particles.
-* Blend Mode - available blend modes are Alpha, Add, Add Alpha and Multiply.
-* Particle Orientation - how the particles are oriented, either Default (unit orientation) or Initial Direction.
-* Inherit Velocity - how much of the velocity of the emitter the particles should inherit. This value is only available when Space is set to World. The velocity of the emitter is estimated every frame.
-* Max Particle Count - how many particles from this emitter can exist at the same time.
-* Type - shape of the emitter
-** Circle - A 2D circle which emits particles outwards from its center. Diameter is defined by Emitter Size X.
-** 2D Cone - A flattened cone which emits particles from its bottom corner directed out through the top of the cone. Emitter Size X defines the diameter of the top and Y defines the height.
-** Box - A 3D box which emits particles along its local Y-axis. Emitter Size X, Y and Z defines width, height and depth respectively.
-** Sphere - A 3D sphere which emits particles outwards from its center. Diameter is defined by Emitter Size X.
-** Cone - A 3D cone which emits particles from its bottom corner directed out through the top disc of the cone. Emitter Size X defines the diameter of the top disc and Y defines the height.
-* Start Delay - how long time to wait after the ParticleFX has been started before this emitter will start emitting particles.
-
-Keyable Emitter Properties
-~~~~~~~~~~~~~~~~~~~~~~~~~~
+: When a property has two fields, the first is the value and the second is the spread. The value is what you key. The spread is a variation which is applied randomly for each spawned particle. E.g. if the value is 50 and the spread is 10, each spawned particle will get 50 +/- 10 as value.
+
+## Emitter properties
+
+Id
+: Emitter identifier (used when setting render constants for specific emitters).
+
+Mode
+: If the emitter should stop (`Once`) or restart (`Loop`) when reaching its duration.
+
+Duration
+: For how long the emitter should emit particles.
+
+Space
+: In which geometrical space the spawned particles will exist.
+  - `World` means the particles are left in the world and move independently of the emitter;
+  - `Emitter` means they will move relative the emitter.
+
+Position/rotation
+: Transform of the emitter relative the ParticleFX component.
+
+Image
+: Image file (Tile source or Atlas) to use for texturing and animating the particles.
+
+Animation
+: Which animation in the Image file to use on the particles.
+
+Material
+: The material to use for shading the particles.
+
+Blend Mode
+: Available blend modes are `Alpha`, `Add` and `Multiply`.
+
+Particle Orientation
+: How the particles are oriented, either `Default` (unit orientation) or `Initial Direction`.
+
+Inherit Velocity
+: How much of the velocity of the emitter the particles should inherit. This value is only available when *Space* is set to `World`. The velocity of the emitter is estimated every frame.
+
+Max Particle Count
+: How many particles from this emitter can exist at the same time.
+
+Type
+: The shape of the emitter
+  - `Circle` - A 2D circle which emits particles outwards from its center. Diameter is defined by *Emitter Size X*.
+  - `2D Cone` - A flattened cone which emits particles from its bottom corner directed out through the top of the cone. *Emitter Size X* defines the diameter of the top and *Y* defines the height.
+  - `Box` - A 3D box which emits particles along its local Y-axis. *Emitter Size X*, *Y* and *Z* defines width, height and depth respectively.
+  - `Sphere` - A 3D sphere which emits particles outwards from its center. Diameter is defined by *Emitter Size X*.
+  - `Cone` - A 3D cone which emits particles from its bottom corner directed out through the top disc of the cone. *Emitter Size X* defines the diameter of the top disc and *Y* defines the height.
+
+Start Delay
+: How long time to wait after the ParticleFX has been started before this emitter will start emitting particles.
+
+## Keyable emitter properties
 
 These properties have two fields, a value and a spread. The values can be keyed over the duration of the emitter. Spread defines how much the value should randomly change for each spawned particle. Spread is added to the current value.
 
-* Spawn Rate - how many particles to emit per second.
-* Emitter Size X/Y/Z - dimensions of the emitter shape, see Type above.
-* Particle Life Time - how long each spawned particle should live.
-* Initial Speed - how fast the spawned particles should move initially.
-* Initial Size - how large the spawned particles should be.
-* Initial Red/Green/Blue/Alpha - initial color components for the particles.
+Spawn Rate
+: How many particles to emit per second.
 
-Keyable Particle Properties
-~~~~~~~~~~~~~~~~~~~~~~~~~~~
+Emitter Size X/Y/Z
+: Dimensions of the emitter shape, see Type above.
 
-These properties can be keyed over the life time of the particles.
+Particle Life Time
+: How long each spawned particle should live.
+
+Initial Speed
+: How fast the spawned particles should move initially.
 
-* Life Scale - how the particle size should be scaled.
-* Life Red/Green/Blue/Alpha - how the particle color should be tinted over its life.
+Initial Size
+: How large the spawned particles should be.
 
-Modifier Properties
-~~~~~~~~~~~~~~~~~~~
+Initial Red/Green/Blue/Alpha
+: Initial color components for the particles.
+
+## Keyable particle properties
+
+These properties can be keyed over the life time of the particles.
 
-* Position/rotation - transform of the modifier relative its parent.
-* Type
-** Acceleration - A directed acceleration with no position. Use this for things like gravity.
-** Drag - A decelerating acceleration which is proportional to the particle velocity. Use this for things like air resistance and other fluids.
-** Radial - A radial modifier either attracts or repels particles towards/from a position. Use this for things like small planets.
-** Vortex - A vortex affects particles in a circular or spiraling direction around its position. Use this for things like black holes and tornados.
-* Max Distance - the maximum distance within which particles are affected at all by this modifier. Only used for Radial and Vortex.
+Life Scale
+: How the particle size should be scaled.
 
-.Drag manipulator
-![Drag modifier](images/particlefx/drag.png)
+Life Red/Green/Blue/Alpha
+: How the particle color should be tinted over its life.
 
-.Radial manipulator
-![Radial modifier](images/particlefx/radial.png)
+## Modifier properties
 
-.Acceleration manipulator
-![Acceleration modifier](images/particlefx/acceleration.png)
+Position/rotation
+: The transform of the modifier relative its parent.
 
-.Vortex manipulator
-![Vortex modifier](images/particlefx/vortex.png)
+Type
+: The type of modifier
+  |          | Type        |
+  | -------- | ----------- |
+  | ![Acceleration modifier](images/particlefx/acceleration.png){.inline} | `Acceleration`: A directed acceleration with no position. Use this for things like gravity. |
+  | ![Drag modifier](images/particlefx/drag.png){.inline} | `Drag`: A decelerating acceleration which is proportional to the particle velocity. Use this for things like air resistance and other fluids. |
+  | ![Radial modifier](images/particlefx/radial.png){.inline} | `Radial`: A radial modifier either attracts or repels particles towards/from a position. Use this for things like small planets. |
+  | ![Vortex modifier](images/particlefx/vortex.png){.inline} | `Vortex`: A vortex affects particles in a circular or spiraling direction around its position. Use this for things like black holes and tornados. |
 
+Max Distance
+: The maximum distance within which particles are affected at all by this modifier. Only used for Radial and Vortex.
 
-Keyable Modifier Properties
-~~~~~~~~~~~~~~~~~~~~~~~~~~~
+## Keyable modifier properties
 
 These properties have two fields, a value and a spread. The values can be keyed over the duration of the emitter. Spread defines how much the value should randomly change for each spawned particle. Spread is added to the current value.
 
-* Magnitude - the amount of effect the modifier has on the particles.
+Magnitude
+: The amount of effect the modifier has on the particles.
 

+ 6 - 8
docs/en/manuals/physics.md

@@ -1,7 +1,9 @@
-= Physics
-:location: documentation manuals resources
-:type: manual
-:tags: physics
+---
+title: Physics in Defold
+brief: Defold includes physics engines for 2D and 3D. They allow you to simulate Newtonian physics interactions between different types of collision objects. This manual explains how this works.
+---
+
+# Physics
 
 Defold includes a modified version of the [Box2D](http://www.box2d.org) physics engine for 2D physics simulations. It allows you to simulate Newtonian physics interactions between different types of _collision objects_. This manual explains how this works.
 
@@ -12,19 +14,15 @@ A collision object is a component you use to extends a game object with physical
 Static objects
 : These do not react in themselves, but any other object that collides with static objects will react. These are very useful (and cheap performance-wise) for building level geometry (i.e. ground and walls) that does not move. You cannot move or otherwise change static objects.
 
-
 Dynamic objects
 : The physics engine solves all collisions for you and applies resulting forces. These are good for objects that should behave realistically, with the caveat that the only way you can manually control them is by applying forces to them.
 
-
 Kinematic objects
 : These types of objects will collide with other physics objects, but the job of resolving the collisions (or ignoring them) is yours. Kinematic objects are good when you need objects that collide and you want fine grained control over all reactions.
 
-
 Triggers
 : Triggers are objects that register simple collisions. These are good for game logic where you want some event to happen when some other object (i.e. the player character) reaches a specific spot.
 
-
 ## Editing collision objects
 
 The editor allows you to easily attach a collision object to any game object:

+ 7 - 4
docs/en/test.md → docs/en/manuals/test.md

@@ -105,10 +105,13 @@ This is a block of text that the user will not miss. Use these sparingly for thi
 
 Images are inserted in the document like this:
 
-![A large image of sorts](manuals/images/doctest/large.png)
+![A large image of sorts](images/test/large.png)
 
-Note that images are rendered inline if they are part of the same paragragh. This is useful if you want to line up several images like this:
+![A small image of sorts](images/test/tiny.png){.left} An image that is put at the start of a paragraph---inline with a class `.left`. This is useful for small images like icons and the like. The rendering of these is not optimal since the image size is needed to figure out image placement in relation to the text. Still, in some cases it can be useful, for paragraph decoration or similar.
 
-![A small image of sorts](manuals/images/doctest/small.png)
-![A small image of sorts](manuals/images/doctest/small.png)
+![A small image of sorts](images/test/tiny.png){.right} An image that is put at the start of a paragraph---inline with a class `.right`. This is useful for small images like icons and the like. The rendering of these is not optimal since the image size is needed to figure out image placement in relation to the text. Still, in some cases it can be useful, for paragraph decoration or similar.
 
+Note that images are usually rendered centered in their own paragraph. Apply class `.inline` for inline behavior if you have several images as part of the same paragragh and you want to line up several images like this:
+
+![A small image of sorts](images/test/small.png){.inline}
+![A small image of sorts](images/test/small.png){.inline}

BIN
docs/ko/manuals/images/introduction/introduction_atlas.png


BIN
docs/ko/manuals/images/introduction/introduction_blueprint.png


BIN
docs/ko/manuals/images/introduction/introduction_collaboration.png


BIN
docs/ko/manuals/images/introduction/introduction_collection.png


BIN
docs/ko/manuals/images/introduction/introduction_component.png


BIN
docs/ko/manuals/images/introduction/introduction_editor.png


BIN
docs/ko/manuals/images/introduction/introduction_factory.png


BIN
docs/ko/manuals/images/introduction/introduction_font.png


BIN
docs/ko/manuals/images/introduction/introduction_gui.png


BIN
docs/ko/manuals/images/introduction/introduction_input_binding.png


BIN
docs/ko/manuals/images/introduction/introduction_object_file.png


BIN
docs/ko/manuals/images/introduction/introduction_object_inplace.png


BIN
docs/ko/manuals/images/introduction/introduction_particlefx.png


BIN
docs/ko/manuals/images/introduction/introduction_particles.png


BIN
docs/ko/manuals/images/introduction/introduction_tilegrid.png


BIN
docs/ko/manuals/images/introduction/introduction_tilegrid_palette.png


BIN
docs/ko/manuals/images/introduction/introduction_tilemap.png


BIN
docs/ko/manuals/images/introduction/introduction_tilemap_palette.png


BIN
docs/ko/manuals/images/introduction/introduction_tilesource.png


BIN
docs/ko/manuals/images/introduction/introduction_tilesource_animation.png


BIN
docs/ko/manuals/images/introduction/introduction_tilesource_hull.png


+ 32 - 32
docs/ko/introduction.md → docs/ko/manuals/introduction.md

@@ -30,7 +30,7 @@ Defold는 단순함과 명료함을 철학으로 디자인 되었으며, 턴키(
 몇몇 상황에서는 게임오브젝트를 수동으로 컬렉션에 배치하는 것이 아니라, 동적으로 생성시켜야 할 때가 있습니다.
 예를 들어, 플레이어가 트리거를 누르면 총이 쏴지며, 총알이 동적으로 스폰되어 날아가야 할 경우 처럼 말이죠. 이처럼 게임오브젝트를 동적으로 생성하기 위해 (미리 할당된 객체 풀로부터), 당신은 팩토리 컴포넌트를 사용할 수 있습니다.
 
-![](http://www.defold.com/static/images/introduction/introduction_factory.png)
+![](images/introduction/introduction_factory.png)
 
 Defold는 2가지 타입의 팩토리를 제공합니다. 각 매뉴얼에서 자세한 내용을 읽을 수 있습니다.
 
@@ -40,7 +40,7 @@ Defold는 2가지 타입의 팩토리를 제공합니다. 각 매뉴얼에서 
 ## Collaboration(공동작업)
 대다수 게임들은 둘 이상의 공동작업으로 만들어 집니다. 우리는 함께 일하는 능력이 곧 빠른 개발 사이클의 핵심이라고 믿습니다. 그러므로 공동작업은 Defold 플랫폼의 주춧돌입니다.
 
-![](http://www.defold.com/static/images/introduction/introduction_collaboration.png)
+![](images/introduction/introduction_collaboration.png)
 
 새 프로젝트를 생성하면, 우리 서버에 자동적으로 중앙 저장소(repository)가 생성됩니다. 개발하는 동안은 이 저장소의 개인보기(personal view)에서 파일이 생성되거나 수정됩니다. 당신이 작업을 완료하고 공유할 준비가 되면, 개인보기를 중앙 저장소에 동기화합니다. 에디터는 당신의 변경사항을 업로드하고 다른 팀원이 올린 새 변경 사항을 다운로드하고 당신이나 누군가 프로젝트 데이터의 같은 조각을 수정했다면 충돌을 해결하기도 합니다. 모든 변경사항은 기록되며 당신의 프로젝트에서 발생하는 모든 히스토리가 로그에 남습니다. 당신은 백업을 걱정할 필요가 없으며 당신의 팀에게 파일들을 이메일로 보낼 필요도 없습니다. 워크플로우 문서에서 프로젝트 공동작업에 대해 더 읽어보세요.
 
@@ -53,91 +53,91 @@ Project branches(프로젝트 브랜치)를 통하여 협업하는 것 외에도
 빌딩 블록은 게임이나 앱을 만들기 위해 사용 가능한 구성요소들 입니다. 이것은 Defold 편집기에서 빌딩 블록의 타입에 따라 아이콘으로 구분됩니다. 
 
 #### Game object
-![](http://www.defold.com/static/images/icons/brick.png)
+![](images/icons/brick.png)
 게임 오브젝트에 대한 설명은 위를 참고하세요.
 
 #### Collection
-![](http://www.defold.com/static/images/icons/bricks.png)
+![](images/icons/bricks.png)
 컬렉션에 대한 설명은 위를 참고하세요.
 
 #### Script
-![](http://www.defold.com/static/images/icons/cog.png)
+![](images/icons/cog.png)
 스크립트에 대한 설명은 위를 참고하세요.
 
 #### Sound
-![](http://www.defold.com/static/images/icons/sound.png)
+![](images/icons/sound.png)
 사운드 컴포넌트는 특정 사운드를 재생합니다. 현재 Defold는 WAV 타입의 사운드파일을 지원합니다.
 
 #### Collision object
-![](http://www.defold.com/static/images/icons/weight.png)
+![](images/icons/weight.png)
 충돌 오브젝트는 게임오브젝트의 물리속성(모양, 무게, 마찰력, 반발력 등)을 담당하는 컴포넌트입니다. 이 속성들은 충돌 오브젝트가 다른 충돌 오브젝트와 어떻게 충돌하는지를 관장합니다. 충돌 오브젝트의 가장 일반적인 타입은 Kinematic objects, Dynamic objects 그리고 triggers입니다. Kinematic객체는 당신이 수동으로 반응해야 하는 상세한 충돌 정보를 제공하며, Dynamic객체는 물리엔진에 의해 뉴턴의 물리법칙을 따르게끔 자동적으로 시뮬레이트 됩니다. Trigger는 특정한 모양(Shape)이 다른 특정한 모양을 가진 트리거와 교차되거나 교차에서 벗어난 경우를 감지합니다.
 
 #### Factory
-![](http://www.defold.com/static/images/icons/factory.png)
+![](images/icons/factory.png)
 팩토리에 대한 설명은 위를 참고하세요.
 
 #### Sprite
-![](http://www.defold.com/static/images/icons/pictures.png)
+![](images/icons/pictures.png)
 스프라이트는 게임오브젝트의 그래픽 처리를 담당하는 컴포넌트입니다. 타일 소스나 아틀라스로부터 이미지를 표시합니다. 스프라이트는 flip-book이나 본 애니메이션을 위해 빌트인으로 지원하고 있습니다. 스프라이트는 일반적으로 아이템이나 캐릭터를 위해 사용됩니다. 더 자세한 정보를 위해 2D graphic 문서를 보시기 바랍니다.
 
 #### Atlas
-![](http://www.defold.com/static/images/icons/pictures_atlas.png)
+![](images/icons/pictures_atlas.png)
 아틀라스는 나누어진 이미지들의 모음입니다. 이것은 메모리나 성능을 이유로 커다란 시트로 컴파일 되었습니다. 당신은 이 이미지들이나 이미지들의 flip-book 애니메이션 시리즈를 저장할 수 있습니다. 아틀라스는 그래픽 자원을 공유하기 위해 스프라이트나 파티클FX 컴포넌트에 의해 사용됩니다. 더 자세한 정보를 위해 2D graphic 문서를 보시기 바랍니다.
-![](http://www.defold.com/static/images/introduction/introduction_atlas.png)
+![](images/introduction/introduction_atlas.png)
 
 #### Tile source
-![](http://www.defold.com/static/images/icons/small_tiles.png)
+![](images/icons/small_tiles.png)
 타일소스는 크기가 같은 여러 개의 작은 이미지로 구성된 텍스쳐를 나타냅니다. 이 컴포넌트는 플립북 애니메이션을 지원합니다. 당시는 타일 소스에서 이미지 시퀀스를 활용하여 애니메이션을 정의 할 수 있습니다. 또한 타일소스는 이미지 데이터로부터 자동으로 충돌 모양을 계산할 수도 있습니다. 이것은 오브젝트가 충돌하거나 반응하는 타일로 된 레벨을 제작하는데 매우 유용합니다. 타일 소스는 그래픽 리소스를 공유하는 타일 맵(스프라이트와 파티클FX 그리고 아틀라스가 일반적으로 선호되긴 하지만) 컴포넌트에 의해 사용됩니다. 더 많은 정보를 위해 2D graphic 문서를 보시기 바랍니다.
-![](http://www.defold.com/static/images/introduction/introduction_tilesource.png)
-![](http://www.defold.com/static/images/introduction/introduction_tilesource_animation.png)
-![](http://www.defold.com/static/images/introduction/introduction_tilesource_hull.png)
+![](images/introduction/introduction_tilesource.png)
+![](images/introduction/introduction_tilesource_animation.png)
+![](images/introduction/introduction_tilesource_hull.png)
 
 #### Tile map
-![](http://www.defold.com/static/images/icons/layer_grid.png)
+![](images/icons/layer_grid.png)
 타일 맵 컴포넌트는 타일 소스의 이미지를 하나 이상의 겹쳐진 격자로 표시합니다. 이것은 주로 바닥, 벽, 건축물, 장애물 같은 게임의 환경요소들을 만드는데 사용되곤 합니다. 타일 맵은 지정된 블렌드 모드(blend mode)로 여러 레이어들을 겹쳐서 표시 할 수 있는데, 예를 들어 잔디 타일 배경 위에 나뭇잎 등을 깔아 놓을때 유용합니다. 또한 동적으로 타일의 이미지를 바꾸는 것도 가능합니다. 예를 들어, 다리를 파괴해서 건너가지 못하게 하는 동작을 간단하게 무너진 다리의 이미지와 물리형태를 가진 타일로 교체함으로써 처리 할 수 있습니다.
-![Tile map](http://www.defold.com/static/images/introduction/introduction_tilemap.png)
-![Tile map palette](http://www.defold.com/static/images/introduction/introduction_tilemap_palette.png)
+![Tile map](images/introduction/introduction_tilemap.png)
+![Tile map palette](images/introduction/introduction_tilemap_palette.png)
 
 #### ParticleFX
-![](http://www.defold.com/static/images/icons/clouds.png)
+![](images/icons/clouds.png)
 파티클은 게임에서 특별하고 멋진 비주얼 이펙트를 생성하는데 매우 유용합니다. 당신은 안개, 연기, 불, 비, 떨어지는 낙엽같은 효과를 만들 수 있습니다. Defold는 강력한 파티클 이펙트 편집기를 포함하고 있으며 당신이 게임에서 실시간으로 실행시켜서 이펙트를 제작하거나 최적화 할 수도 있습니다. 더 많은 내용을 보시려면 파티클FX 문서를 참고 바랍니다.
-![](http://www.defold.com/static/images/introduction/introduction_particlefx.png)
+![](images/introduction/introduction_particlefx.png)
 
 #### GUI
-![](http://www.defold.com/static/images/icons/text_allcaps.png)
+![](images/icons/text_allcaps.png)
 GUI컴포넌트는 텍스트나 텍스쳐블록 같은 사용자 인터페이스를 구성하는데 사용되는 요소를 포함하고 있습니다. 각 요소들은 스크립트나 애니메이션이나 계층적인 구조로 구성할 수 있습니다. GUI컴포넌트는 일반적으로 HUD나 메뉴, 스크린 알람 등을 만드는데 사용됩니다. GUI컴포넌트는 GUI스크립트로 제어하는데 이는 GUI의 동작과 유저 상호작용을 제어하는것을 정의합니다. 더 자세한 것은 GUI documentation을 참고 바랍니다.
-![GUI](http://www.defold.com/static/images/introduction/introduction_gui.png)
+![GUI](images/introduction/introduction_gui.png)
 
 #### GUI script
-![](http://www.defold.com/static/images/icons/cog.png)
+![](images/icons/cog.png)
 GUI스크립트는 GUI컴포넌트의 동작을 정의하는데 사용됩니다. 이것은 GUI애니메이션을 제어하거나 유저가 어떻게 GUI와 상호작용하는지를 제어합니다.
 
 #### Font
-![](http://www.defold.com/static/images/icons/font.png)
+![](images/icons/font.png)
 폰트는 TrueType이나 OneType 폰트 파일을 사용할 수 있습니다. 폰트는 크기나 윤곽선과 그림자같은 꾸밈을 지정할 수 있습니다. 폰트는 GUI컴포넌트에서 사용됩니다.
-![](http://www.defold.com/static/images/introduction/introduction_font.png)
+![](images/introduction/introduction_font.png)
 
 #### Input binding
-![](http://www.defold.com/static/images/icons/keyboard.png)
+![](images/icons/keyboard.png)
 인풋바인딩 파일은 게임에서 하드웨어 입력(마우스, 키보드, 터치스크린, 게임패드 등)을 해석하는 방법을 정의합니다. 이 파일은 "jump"나 "move_formard" 같은 동작을 하드웨어 입력에 바인딩 합니다. 입력을 기다리는 스크립트 컴포넌트에서 게임이나 앱이 특정 입력을 받아야만 하는 동작을 스크립트 할 수 있습니다. 자세한 것은 Input documentation을 참고 바랍니다.
-![](http://www.defold.com/static/images/introduction/introduction_input_binding.png)
+![](images/introduction/introduction_input_binding.png)
 
 #### Camera
-![](http://www.defold.com/static/images/icons/camera.png)
+![](images/icons/camera.png)
 카메라 컴포넌트는 게임월드의 특정 부분이 보여지거나 어떻게 투영되는지 결정하는걸 도와줍니다. 일반적인 사용 사례로는 카메라에 플레이어나 플레이어 주변을 부드럽게 따라다니는 별도의 게임 오브젝트를 연결하는 것입니다.
 
 #### Material
-![](http://www.defold.com/static/images/icons/large_tiles.png)
+![](images/icons/large_tiles.png)
 메터리얼은 어떻게 각 오브젝트들이 특정 속성과 쉐이더에 의해 렌더링되는지 정의합니다.
 
 #### Render
-![](http://www.defold.com/static/images/icons/paintcan.png)
+![](images/icons/paintcan.png)
 렌더 파일에는 게임을 화면에 렌더링 할 때 사용되는 설정들이 들어 있습니다. 렌더 파일은 렌더링에 사용할 렌더링 스크립트와 메터리얼을 정의합니다.
 
 #### Render script
-![](http://www.defold.com/static/images/icons/cog.png)
+![](images/icons/cog.png)
 렌더 스크립트는 게임이나 앱이 어떻게 화면에 렌더링 되어야 하는지를 제어하는 루아 스크립트 입니다. 가장 일반적인 경우를 다루는 기본 렌더 스크립트가 있지만 커스텀 라이팅 모델이나 다른 효과가 필요하다면 직접 작성할 수 있습니다.
 
 #### Collection proxy
-![](http://www.defold.com/static/images/icons/bricks_proxy.png)
+![](images/icons/bricks_proxy.png)
 컬렉션 프록시는 게임이나 앱이 실행되는 동안 컬렉션을 동적으로 불러오고 활성화하는데 사용됩니다. 가장 일반적인 경우로는 특정 레벨을 컬렉션 프록시로 불러올 수 있습니다. 자세한 것은 컬렉션 프록시 문서를 참고 바랍니다.

+ 18 - 8
docs/sass/defold-md.sass

@@ -60,15 +60,26 @@ body
 
   img
     max-width: 100%
-
-  img
-    margin: 1.6em 0
-
-  img:only-child
     display: block
+    margin: 1.6em 0
     margin-left: auto
     margin-right: auto
 
+  img.inline
+    display: inline-block
+
+  img.left
+    display: inline-block
+    float: left
+    margin: 0.2em 0
+    margin-right: 1.4em
+
+  img.right
+    display: inline-block
+    float: right
+    margin: 0.2em 0
+    margin-left: 1.4em
+
   .anchor
     display: block
     position: relative
@@ -125,7 +136,7 @@ body
   pre
     font-family: 'Source Code Pro', monospace
     color: $text-white
-    font-size: 0.9em
+    font-size: 16px
     line-height: 1.6em
     padding: 1.4em
     background-color: $dark-grey
@@ -158,8 +169,7 @@ body
 
   code
     font-family: 'Source Code Pro', monospace
-    font-weight: 300
-    font-size: 0.92em
+    font-size: 0.9375em
 
   kbd
     font-family: Source Sans Pro, sans-serif

+ 30 - 7
gulpfile.js

@@ -9,12 +9,11 @@ var server = require('gulp-server-livereload');
 var sass = require('gulp-sass');
 var minify = require('gulp-cssnano');
 var del = require('del');
+var path = require('path');
 var mkdirp = require('mkdirp');
 var slugify = require('slugify');
 var hljs = require('highlight.js');
-
 var print = require('gulp-print');
-
 var frontmatter = require('front-matter');
 var markdown = require('markdown-it');
 var md_attrs = require('markdown-it-attrs');
@@ -93,6 +92,22 @@ md.renderer.rules.heading_close = function (tokens, idx, options, env, self) {
         return '</' + tag + '>';
 };
 
+// Images.
+md.renderer.rules.image = function (tokens, idx, options, env, self) {
+    var token = tokens[idx];
+
+    if('imgurl' in env) {
+        // Rewrite src
+        var src = token.attrs[token.attrIndex('src')][1];
+        token.attrs[token.attrIndex('src')][1] = env.imgurl + '/' + src;
+    }
+    // Set alt attribute
+    token.attrs[token.attrIndex('alt')][1] = self.renderInlineAsText(token.children, options, env);
+
+    return self.renderToken(tokens, idx, options);
+};
+
+
 // Output preview html documents
 function markdownToPreviewHtml(file) {
     var data = frontmatter(file.contents.toString());
@@ -106,26 +121,34 @@ function markdownToPreviewHtml(file) {
     return;
 }
 
+//var img_url = 'https://storage.googleapis.com/defold-doc';
+var img_url = '/_ah/gcs/defold-doc';
+
 // Build document json for storage
 function markdownToJson(file) {
+    var name = path.relative(file.base, file.path);
+    // Needs language for static image url:s
+    var m = name.match(/^(\w+)[/](\w+)[/].*$/);
+    var lang = m[1];
+    var doctype = m[2];
     var data = frontmatter(file.contents.toString());
-    var toc = {};
-    data.html = md.render(data.body, toc);
-    data.toc = toc;
+    var env = { imgurl: img_url + '/' + lang + '/' + doctype };
+    data.html = md.render(data.body, env);
+    data.toc = env.toc;
     file.contents = new Buffer(JSON.stringify(data));
     file.path = gutil.replaceExtension(file.path, '.json');
     return;
 }
 
 // Build docs
-gulp.task('build', ['clean', 'assets'], function () {
+gulp.task('build', ['assets'], function () {
     return gulp.src('docs/**/*.md')
         .pipe(tap(markdownToJson))
         .pipe(print())
         .pipe(gulp.dest("build"));
 });
 
-gulp.task('assets', [], function() {
+gulp.task('assets', ['clean'], function() {
     return gulp.src(['docs/**/*.{png,jpg,svg,gif}'])
         .pipe(gulp.dest("build"));
 });