Merge branch 'master' into master

Playground/css/index.css

@@ -433,29 +433,6 @@ body {
 }
 
 /* Save form & co */
-
-.save-message {
-    display: none;
-    position:absolute;
-    top:40px; /* navbar top */
-    width: 100%;
-    z-index:5;
-    text-align: center;
-    font-size: 0.8em;
-    line-height: 2em;
-    cursor:pointer;
-}
-
-.save-message.light {
-    background-color: rgba(239, 239, 239, 0.9);
-    color: #7283a0;
-}
-
-.save-message.dark {
-    background-color: rgba(51, 51, 51, 0.9);
-    color: #eee;
-}
-
 .save-layer {
     display: none;
     position: absolute;

Playground/debug.html

@@ -176,9 +176,6 @@
                 </div>
             </div>
         </div>
-        <div class="save-message" id="saveMessage">
-            This PG has missing metadata. Click save to add them.
-        </div>
     </div>
 
     <div class="navbar navBar1475">
@@ -273,9 +270,6 @@
                 </div>
             </div>
         </div>
-        <div class="save-message" id="saveMessage">
-            This PG has missing metadata. Click save to add them.
-        </div>
     </div>
 
     <div class="navbar navBar1030">
@@ -363,9 +357,6 @@
                 </div>
             </div>
         </div>
-        <div class="save-message" id="saveMessage">
-            This PG has missing metadata. Click save to add them.
-        </div>
     </div>
 
     <div class="navbar navBar750">
@@ -450,9 +441,6 @@
                 </div>
             </div>
         </div>
-        <div class="save-message" id="saveMessage">
-            This PG has missing metadata. Click save to add them.
-        </div>
     </div>
 
     <div class="wrapper">

Playground/index-local.html

@@ -119,9 +119,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar1475">
@@ -215,9 +212,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar1030">
@@ -305,9 +299,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar750">
@@ -392,9 +383,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="wrapper">

Playground/index.html

@@ -154,9 +154,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar1475">
@@ -250,9 +247,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar1030">
@@ -340,9 +334,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar750">
@@ -427,9 +418,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="wrapper">

Playground/indexStable.html

@@ -144,9 +144,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar1475">
@@ -240,9 +237,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar1030">
@@ -330,9 +324,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="navbar navBar750">
@@ -417,9 +408,6 @@
                     </div>
                 </div>
             </div>
-            <div class="save-message" id="saveMessage">
-                This PG has missing metadata. Click save to add them.
-            </div>
         </div>
 
         <div class="wrapper">

Playground/js/index.js

@@ -53,8 +53,7 @@
         '.navbar .select .toDisplayBig a',
         '.navbar .select .toDisplayBig ul li',
         '.navbarBottom',
-        '.navbarBottom .links .link',
-        '.save-message'];
+        '.navbarBottom .links .link'];
 
     var run = function () {
         var blockEditorChange = false;
@@ -297,17 +296,14 @@
             }
             document.getElementById("saveFormButtons").style.display = "block";
             document.getElementById("saveFormButtonOk").style.display = "inline-block";
-            document.getElementById("saveMessage").style.display = "block";
         };
         showNoMetadata();
-        document.getElementById("saveMessage").style.display = "none";
 
         var hideNoMetadata = function () {
             document.getElementById("saveFormTitle").readOnly = true;
             document.getElementById("saveFormDescription").readOnly = true;
             document.getElementById("saveFormTags").readOnly = true;
             document.getElementById("saveFormButtonOk").style.display = "none";
-            document.getElementById("saveMessage").style.display = "none";
             setToMultipleID("metadataButton", "display", "inline-block");
         };
 
@@ -864,9 +860,6 @@
         document.getElementById("saveFormButtonCancel").addEventListener("click", function () {
             document.getElementById("saveLayer").style.display = "none";
         });
-        document.getElementById("saveMessage").addEventListener("click", function () {
-            document.getElementById("saveMessage").style.display = "none";
-        });
         document.getElementById("mainTitle").innerHTML = "v" + BABYLON.Engine.Version;
 
         var previousHash = "";

Playground/test.html

@@ -50,7 +50,4 @@
         </a>
         <ul class="dropdown-menu" id="scriptsList"></ul>
     </div>
-</div>
-<div class="save-message" id="saveMessage">
-    This PG has missing metadata. Click save to add them.
 </div>

Tools/Gulp/config.json

@@ -13,6 +13,7 @@
             "../../dist/preview release/babylon.d.ts",
             "../../dist/preview release/gui/babylon.gui.d.ts",
             "../../dist/preview release/loaders/babylon.glTF2FileLoader.d.ts",
+            "../../dist/preview release/serializers/babylon.glTF2Serializer.d.ts",
             "../../dist/preview release/gltf2Interface/babylon.glTF2Interface.d.ts"
         ],
         "outputCustomConfigurationsDirectory": "../../dist/preview release/customConfigurations",
@@ -1592,7 +1593,9 @@
                     "../../serializers/src/glTF/2.0/babylon.glTFSerializer.ts",
                     "../../serializers/src/glTF/2.0/babylon.glTFExporter.ts",
                     "../../serializers/src/glTF/2.0/babylon.glTFData.ts",
-                    "../../serializers/src/glTF/2.0/babylon.glTFMaterial.ts"
+                    "../../serializers/src/glTF/2.0/babylon.glTFMaterial.ts",
+                    "../../serializers/src/glTF/2.0/babylon.glTFAnimation.ts",
+                    "../../serializers/src/glTF/2.0/babylon.glTFUtilities.ts"
                 ],
                 "output": "babylon.glTF2Serializer.js"
             }

Tools/Gulp/gulp-validateTypedoc.js

@@ -274,9 +274,6 @@ Validate.prototype.validateTypedocNamespaces = function (namespaces) {
     for (var a in namespace.children) {
         containerNode = namespace.children[a];
 
-        // If comment contains @ignore then skip validation completely
-        if (Validate.hasTag(containerNode, 'ignore')) continue;
-
         // Account for undefined access modifiers.
         if (!containerNode.flags.isPublic &&
             !containerNode.flags.isPrivate &&
@@ -298,12 +295,10 @@ Validate.prototype.validateTypedocNamespaces = function (namespaces) {
                 "Missing text for " + containerNode.kindString + " : " + containerNode.name + " (id: " + containerNode.id + ")", Validate.position(containerNode));
         }
 
-        //if comment contains tag @ignoreChildren, then don't validate children
-        var validateChildren = !Validate.hasTag(containerNode, 'ignoreChildren');
         children = containerNode.children;
 
         //Validate Properties
-        if (validateChildren && children) {
+        if (children) {
             for (var b in children) {
                 childNode = children[b];
 
@@ -318,9 +313,6 @@ Validate.prototype.validateTypedocNamespaces = function (namespaces) {
                 // Validate Naming.
                 this.validateNaming(containerNode, childNode);
 
-                //if comment contains @ignore then skip validation completely
-                if (Validate.hasTag(childNode, 'ignore')) continue;
-
                 if (isPublic) {
                     tags = this.validateTags(childNode);
                     if (tags) {
@@ -340,9 +332,6 @@ Validate.prototype.validateTypedocNamespaces = function (namespaces) {
                         for (var c in signatures) {
                             signatureNode = signatures[c];
 
-                            //if node contains @ignore then skip validation completely
-                            if (Validate.hasTag(signatureNode, 'ignore')) continue;
-
                             if (isPublic) {
                                 if (!this.validateComment(signatureNode)) {
                                     this.errorCallback(containerNode.name,
@@ -698,7 +687,6 @@ function gulpValidateTypedoc(validationBaselineFileName, namespaceName, validate
         }
 
         var jsFile = new Vinyl({
-            cwd: process.cwd,
             base: null,
             path: validationBaselineFileName,
             contents: buffer

Tools/Gulp/gulpfile.js

@@ -884,7 +884,10 @@ gulp.task("modules", ["prepare-dependency-tree"], function () {
  */
 gulp.task("typedoc-generate", function () {
     return gulp
-        .src(["../../dist/preview release/babylon.d.ts", "../../dist/preview release/loaders/babylon.glTF2FileLoader.d.ts", "../../dist/preview release/gltf2Interface/babylon.glTF2Interface.d.ts"])
+        .src(["../../dist/preview release/babylon.d.ts", 
+            "../../dist/preview release/loaders/babylon.glTF2FileLoader.d.ts", 
+            "../../dist/preview release/serializers/babylon.glTF2Serializer.d.ts",
+            "../../dist/preview release/gltf2Interface/babylon.glTF2Interface.d.ts"])
         .pipe(typedoc({
             // TypeScript options (see typescript docs)
             mode: "modules",

dist/babylon.glTF2Interface.d.ts

@@ -144,9 +144,9 @@ declare module BABYLON.GLTF2 {
         znear: number;
     }
     interface ICameraPerspective extends IProperty {
-        aspectRatio: number;
+        aspectRatio?: number;
         yfov: number;
-        zfar: number;
+        zfar?: number;
         znear: number;
     }
     interface ICamera extends IChildRootProperty {

dist/gui/readme.md

@@ -1,7 +1,7 @@
 Babylon.js GUI module
 =====================
 
-For usage documentation please visit http://doc.babylonjs.com/overviews/gui
+For usage documentation please visit http://doc.babylonjs.com/how_to/gui
 
 # Installation instructions
 

dist/preview release/gltf2Interface/babylon.glTF2Interface.d.ts

@@ -2,251 +2,854 @@
  * @ignoreChildren
  * @ignore
  */
+declare module "babylonjs-gltf2interface" {
+    export = BABYLON.GLTF2;
+}
+/**
+ * Moduel for glTF 2.0 Interface
+ */
 declare module BABYLON.GLTF2 {
+    /**
+     * The datatype of the components in the attribute
+     */
     const enum AccessorComponentType {
+        /**
+         * Byte
+         */
         BYTE = 5120,
+        /**
+         * Unsigned Byte
+         */
         UNSIGNED_BYTE = 5121,
+        /**
+         * Short
+         */
         SHORT = 5122,
+        /**
+         * Unsigned Short
+         */
         UNSIGNED_SHORT = 5123,
+        /**
+         * Unsigned Int
+         */
         UNSIGNED_INT = 5125,
+        /**
+         * Float
+         */
         FLOAT = 5126,
     }
+    /**
+     * Specifies if the attirbute is a scalar, vector, or matrix
+     */
     const enum AccessorType {
+        /**
+         * Scalar
+         */
         SCALAR = "SCALAR",
+        /**
+         * Vector2
+         */
         VEC2 = "VEC2",
+        /**
+         * Vector3
+         */
         VEC3 = "VEC3",
+        /**
+         * Vector4
+         */
         VEC4 = "VEC4",
+        /**
+         * Matrix2x2
+         */
         MAT2 = "MAT2",
+        /**
+         * Matrix3x3
+         */
         MAT3 = "MAT3",
+        /**
+         * Matrix4x4
+         */
         MAT4 = "MAT4",
     }
+    /**
+     * The name of the node's TRS property to modify, or the weights of the Morph Targets it instantiates
+     */
     const enum AnimationChannelTargetPath {
+        /**
+         * Translation
+         */
         TRANSLATION = "translation",
+        /**
+         * Rotation
+         */
         ROTATION = "rotation",
+        /**
+         * Scale
+         */
         SCALE = "scale",
+        /**
+         * Weights
+         */
         WEIGHTS = "weights",
     }
+    /**
+     * Interpolation algorithm
+     */
     const enum AnimationSamplerInterpolation {
+        /**
+         * The animated values are linearly interpolated between keyframes
+         */
         LINEAR = "LINEAR",
+        /**
+         * The animated values remain constant to the output of the first keyframe, until the next keyframe
+         */
         STEP = "STEP",
+        /**
+         * The animation's interpolation is computed using a cubic spline with specified tangents
+         */
         CUBICSPLINE = "CUBICSPLINE",
     }
+    /**
+     * A camera's projection.  A node can reference a camera to apply a transform to place the camera in the scene
+     */
     const enum CameraType {
+        /**
+         * A perspective camera containing properties to create a perspective projection matrix
+         */
         PERSPECTIVE = "perspective",
+        /**
+         * An orthographic camera containing properties to create an orthographic projection matrix
+         */
         ORTHOGRAPHIC = "orthographic",
     }
+    /**
+     * The mime-type of the image
+     */
     const enum ImageMimeType {
+        /**
+         * JPEG Mime-type
+         */
         JPEG = "image/jpeg",
+        /**
+         * PNG Mime-type
+         */
         PNG = "image/png",
     }
+    /**
+     * The alpha rendering mode of the material
+     */
     const enum MaterialAlphaMode {
+        /**
+         * The alpha value is ignored and the rendered output is fully opaque
+         */
         OPAQUE = "OPAQUE",
+        /**
+         * The rendered output is either fully opaque or fully transparent depending on the alpha value and the specified alpha cutoff value
+         */
         MASK = "MASK",
+        /**
+         * The alpha value is used to composite the source and destination areas. The rendered output is combined with the background using the normal painting operation (i.e. the Porter and Duff over operator)
+         */
         BLEND = "BLEND",
     }
+    /**
+     * The type of the primitives to render
+     */
     const enum MeshPrimitiveMode {
+        /**
+         * Points
+         */
         POINTS = 0,
+        /**
+         * Lines
+         */
         LINES = 1,
+        /**
+         * Line Loop
+         */
         LINE_LOOP = 2,
+        /**
+         * Line Strip
+         */
         LINE_STRIP = 3,
+        /**
+         * Triangles
+         */
         TRIANGLES = 4,
+        /**
+         * Triangle Strip
+         */
         TRIANGLE_STRIP = 5,
+        /**
+         * Triangle Fan
+         */
         TRIANGLE_FAN = 6,
     }
+    /**
+     * Magnification filter.  Valid values correspond to WebGL enums: 9728 (NEAREST) and 9729 (LINEAR)
+     */
     const enum TextureMagFilter {
+        /**
+         * Nearest
+         */
         NEAREST = 9728,
+        /**
+         * Linear
+         */
         LINEAR = 9729,
     }
+    /**
+     * Minification filter.  All valid values correspond to WebGL enums
+     */
     const enum TextureMinFilter {
+        /**
+         * Nearest
+         */
         NEAREST = 9728,
+        /**
+         * Linear
+         */
         LINEAR = 9729,
+        /**
+         * Nearest Mip-Map Nearest
+         */
         NEAREST_MIPMAP_NEAREST = 9984,
+        /**
+         * Linear Mipmap Nearest
+         */
         LINEAR_MIPMAP_NEAREST = 9985,
+        /**
+         * Nearest Mipmap Linear
+         */
         NEAREST_MIPMAP_LINEAR = 9986,
+        /**
+         * Linear Mipmap Linear
+         */
         LINEAR_MIPMAP_LINEAR = 9987,
     }
+    /**
+     * S (U) wrapping mode.  All valid values correspond to WebGL enums
+     */
     const enum TextureWrapMode {
+        /**
+         * Clamp to Edge
+         */
         CLAMP_TO_EDGE = 33071,
+        /**
+         * Mirrored Repeat
+         */
         MIRRORED_REPEAT = 33648,
+        /**
+         * Repeat
+         */
         REPEAT = 10497,
     }
+    /**
+     * glTF Property
+     */
     interface IProperty {
+        /**
+         * Dictionary object with extension-specific objects
+         */
         extensions?: {
             [key: string]: any;
         };
+        /**
+         * Application-Specific data 
+         */
         extras?: any;
     }
+    /**
+     * glTF Child of Root Property
+     */
     interface IChildRootProperty extends IProperty {
+        /**
+         * The user-defined name of this object
+         */
         name?: string;
     }
+    /**
+     * Indices of those attributes that deviate from their initialization value
+     */
     interface IAccessorSparseIndices extends IProperty {
+        /**
+         * The index of the bufferView with sparse indices. Referenced bufferView can't have ARRAY_BUFFER or ELEMENT_ARRAY_BUFFER target
+         */
         bufferView: number;
+        /**
+         * The offset relative to the start of the bufferView in bytes. Must be aligned
+         */
         byteOffset?: number;
+        /**
+         * The indices data type.  Valid values correspond to WebGL enums: 5121 (UNSIGNED_BYTE), 5123 (UNSIGNED_SHORT), 5125 (UNSIGNED_INT)
+         */
         componentType: AccessorComponentType;
     }
+    /**
+     * Array of size accessor.sparse.count times number of components storing the displaced accessor attributes pointed by accessor.sparse.indices
+     */
     interface IAccessorSparseValues extends IProperty {
+        /**
+         * The index of the bufferView with sparse values. Referenced bufferView can't have ARRAY_BUFFER or ELEMENT_ARRAY_BUFFER target
+         */
         bufferView: number;
+        /**
+         * The offset relative to the start of the bufferView in bytes. Must be aligned
+         */
         byteOffset?: number;
     }
+    /**
+     * Sparse storage of attributes that deviate from their initialization value
+     */
     interface IAccessorSparse extends IProperty {
+        /**
+         * The number of attributes encoded in this sparse accessor
+         */
         count: number;
+        /**
+         * Index array of size count that points to those accessor attributes that deviate from their initialization value. Indices must strictly increase
+         */
         indices: IAccessorSparseIndices;
+        /**
+         * Array of size count times number of components, storing the displaced accessor attributes pointed by indices. Substituted values must have the same componentType and number of components as the base accessor
+         */
         values: IAccessorSparseValues;
     }
+    /**
+     * A typed view into a bufferView.  A bufferView contains raw binary data.  An accessor provides a typed view into a bufferView or a subset of a bufferView similar to how WebGL's vertexAttribPointer() defines an attribute in a buffer
+     */
     interface IAccessor extends IChildRootProperty {
+        /**
+         * The index of the bufferview
+         */
         bufferView?: number;
+        /**
+         * The offset relative to the start of the bufferView in bytes
+         */
         byteOffset?: number;
+        /**
+         * The datatype of components in the attribute
+         */
         componentType: AccessorComponentType;
+        /**
+         * Specifies whether integer data values should be normalized
+         */
         normalized?: boolean;
+        /**
+         * The number of attributes referenced by this accessor
+         */
         count: number;
+        /**
+         * Specifies if the attribute is a scalar, vector, or matrix
+         */
         type: AccessorType;
+        /**
+         * Maximum value of each component in this attribute
+         */
         max?: number[];
+        /**
+         * Minimum value of each component in this attribute
+         */
         min?: number[];
+        /**
+         * Sparse storage of attributes that deviate from their initialization value
+         */
         sparse?: IAccessorSparse;
     }
+    /**
+     * Targets an animation's sampler at a node's property
+     */
     interface IAnimationChannel extends IProperty {
+        /**
+         * The index of a sampler in this animation used to compute the value for the target
+         */
         sampler: number;
+        /**
+         * The index of the node and TRS property to target
+         */
         target: IAnimationChannelTarget;
     }
+    /**
+     * The index of the node and TRS property that an animation channel targets
+     */
     interface IAnimationChannelTarget extends IProperty {
+        /**
+         * The index of the node to target
+         */
         node: number;
+        /**
+         * The name of the node's TRS property to modify, or the weights of the Morph Targets it instantiates
+         */
         path: AnimationChannelTargetPath;
     }
+    /**
+     * Combines input and output accessors with an interpolation algorithm to define a keyframe graph (but not its target)
+     */
     interface IAnimationSampler extends IProperty {
+        /**
+         * The index of an accessor containing keyframe input values, e.g., time
+         */
         input: number;
+        /**
+         * Interpolation algorithm
+         */
         interpolation?: AnimationSamplerInterpolation;
+        /**
+         * The index of an accessor, containing keyframe output values
+         */
         output: number;
     }
+    /**
+     * A keyframe animation
+     */
     interface IAnimation extends IChildRootProperty {
+        /**
+         * An array of channels, each of which targets an animation's sampler at a node's property
+         */
         channels: IAnimationChannel[];
+        /**
+         * An array of samplers that combines input and output accessors with an interpolation algorithm to define a keyframe graph (but not its target)
+         */
         samplers: IAnimationSampler[];
     }
+    /**
+     * Metadata about the glTF asset
+     */
     interface IAsset extends IChildRootProperty {
+        /**
+         * A copyright message suitable for display to credit the content creator
+         */
         copyright?: string;
+        /**
+         * Tool that generated this glTF model.  Useful for debugging
+         */
         generator?: string;
+        /**
+         * The glTF version that this asset targets
+         */
         version: string;
+        /**
+         * The minimum glTF version that this asset targets
+         */
         minVersion?: string;
     }
+    /**
+     * A buffer points to binary geometry, animation, or skins
+     */
     interface IBuffer extends IChildRootProperty {
+        /**
+         * The uri of the buffer.  Relative paths are relative to the .gltf file.  Instead of referencing an external file, the uri can also be a data-uri
+         */
         uri?: string;
+        /**
+         * The length of the buffer in bytes
+         */
         byteLength: number;
     }
+    /**
+     * A view into a buffer generally representing a subset of the buffer
+     */
     interface IBufferView extends IChildRootProperty {
+        /**
+         * The index of the buffer
+         */
         buffer: number;
+        /**
+         * The offset into the buffer in bytes
+         */
         byteOffset?: number;
+        /**
+         * The lenth of the bufferView in bytes
+         */
         byteLength: number;
+        /**
+         * The stride, in bytes
+         */
         byteStride?: number;
     }
+    /**
+     * An orthographic camera containing properties to create an orthographic projection matrix
+     */
     interface ICameraOrthographic extends IProperty {
+        /**
+         * The floating-point horizontal magnification of the view. Must not be zero
+         */
         xmag: number;
+        /**
+         * The floating-point vertical magnification of the view. Must not be zero
+         */
         ymag: number;
+        /**
+         * The floating-point distance to the far clipping plane. zfar must be greater than znear
+         */
         zfar: number;
+        /**
+         * The floating-point distance to the near clipping plane
+         */
         znear: number;
     }
+    /**
+     * A perspective camera containing properties to create a perspective projection matrix
+     */
     interface ICameraPerspective extends IProperty {
-        aspectRatio: number;
+        /**
+         * The floating-point aspect ratio of the field of view
+         */
+        aspectRatio?: number;
+        /**
+         * The floating-point vertical field of view in radians
+         */
         yfov: number;
-        zfar: number;
+        /**
+         * The floating-point distance to the far clipping plane
+         */
+        zfar?: number;
+        /**
+         * The floating-point distance to the near clipping plane
+         */
         znear: number;
     }
+    /**
+     * A camera's projection.  A node can reference a camera to apply a transform to place the camera in the scene
+     */
     interface ICamera extends IChildRootProperty {
+        /**
+         * An orthographic camera containing properties to create an orthographic projection matrix
+         */
         orthographic?: ICameraOrthographic;
+        /**
+         * A perspective camera containing properties to create a perspective projection matrix
+         */
         perspective?: ICameraPerspective;
+        /**
+         * Specifies if the camera uses a perspective or orthographic projection
+         */
         type: CameraType;
     }
+    /**
+     * Image data used to create a texture. Image can be referenced by URI or bufferView index. mimeType is required in the latter case
+     */
     interface IImage extends IChildRootProperty {
+        /**
+         * The uri of the image.  Relative paths are relative to the .gltf file.  Instead of referencing an external file, the uri can also be a data-uri.  The image format must be jpg or png
+         */
         uri?: string;
+        /**
+         * The image's MIME type
+         */
         mimeType?: ImageMimeType;
+        /**
+         * The index of the bufferView that contains the image. Use this instead of the image's uri property
+         */
         bufferView?: number;
     }
+    /**
+     * Material Normal Texture Info
+     */
     interface IMaterialNormalTextureInfo extends ITextureInfo {
+        /**
+         * The scalar multiplier applied to each normal vector of the normal texture
+         */
         scale?: number;
     }
+    /**
+     * Material Occlusion Texture Info
+     */
     interface IMaterialOcclusionTextureInfo extends ITextureInfo {
+        /**
+         * A scalar multiplier controlling the amount of occlusion applied
+         */
         strength?: number;
     }
+    /**
+     * A set of parameter values that are used to define the metallic-roughness material model from Physically-Based Rendering (PBR) methodology
+     */
     interface IMaterialPbrMetallicRoughness {
+        /**
+         * The material's base color factor
+         */
         baseColorFactor?: number[];
+        /**
+         * The base color texture
+         */
         baseColorTexture?: ITextureInfo;
+        /**
+         * The metalness of the material
+         */
         metallicFactor?: number;
+        /**
+         * The roughness of the material
+         */
         roughnessFactor?: number;
+        /**
+         * The metallic-roughness texture
+         */
         metallicRoughnessTexture?: ITextureInfo;
     }
+    /**
+     * The material appearance of a primitive
+     */
     interface IMaterial extends IChildRootProperty {
+        /**
+         * A set of parameter values that are used to define the metallic-roughness material model from Physically-Based Rendering (PBR) methodology. When not specified, all the default values of pbrMetallicRoughness apply
+         */
         pbrMetallicRoughness?: IMaterialPbrMetallicRoughness;
+        /**
+         * The normal map texture
+         */
         normalTexture?: IMaterialNormalTextureInfo;
+        /**
+         * The occlusion map texture
+         */
         occlusionTexture?: IMaterialOcclusionTextureInfo;
+        /**
+         * The emissive map texture
+         */
         emissiveTexture?: ITextureInfo;
+        /**
+         * The RGB components of the emissive color of the material. These values are linear. If an emissiveTexture is specified, this value is multiplied with the texel values
+         */
         emissiveFactor?: number[];
+        /**
+         * The alpha rendering mode of the material
+         */
         alphaMode?: MaterialAlphaMode;
+        /**
+         * The alpha cutoff value of the material
+         */
         alphaCutoff?: number;
+        /**
+         * Specifies whether the material is double sided
+         */
         doubleSided?: boolean;
     }
+    /**
+     * Geometry to be rendered with the given material
+     */
     interface IMeshPrimitive extends IProperty {
+        /**
+         * A dictionary object, where each key corresponds to mesh attribute semantic and each value is the index of the accessor containing attribute's data
+         */
         attributes: {
             [name: string]: number;
         };
+        /**
+         * The index of the accessor that contains the indices
+         */
         indices?: number;
+        /**
+         * The index of the material to apply to this primitive when rendering
+         */
         material?: number;
+        /**
+         * The type of primitives to render. All valid values correspond to WebGL enums
+         */
         mode?: MeshPrimitiveMode;
+        /**
+         * An array of Morph Targets, each  Morph Target is a dictionary mapping attributes (only POSITION, NORMAL, and TANGENT supported) to their deviations in the Morph Target
+         */
         targets?: {
             [name: string]: number;
         }[];
     }
+    /**
+     * A set of primitives to be rendered.  A node can contain one mesh.  A node's transform places the mesh in the scene
+     */
     interface IMesh extends IChildRootProperty {
+        /**
+         * An array of primitives, each defining geometry to be rendered with a material
+         */
         primitives: IMeshPrimitive[];
+        /**
+         * Array of weights to be applied to the Morph Targets
+         */
         weights?: number[];
     }
+    /**
+     * A node in the node hierarchy
+     */
     interface INode extends IChildRootProperty {
+        /**
+         * The index of the camera referenced by this node
+         */
         camera?: number;
+        /**
+         * The indices of this node's children
+         */
         children?: number[];
+        /**
+         * The index of the skin referenced by this node
+         */
         skin?: number;
+        /**
+         * A floating-point 4x4 transformation matrix stored in column-major order
+         */
         matrix?: number[];
+        /**
+         * The index of the mesh in this node
+         */
         mesh?: number;
+        /**
+         * The node's unit quaternion rotation in the order (x, y, z, w), where w is the scalar
+         */
         rotation?: number[];
+        /**
+         * The node's non-uniform scale, given as the scaling factors along the x, y, and z axes
+         */
         scale?: number[];
+        /**
+         * The node's translation along the x, y, and z axes
+         */
         translation?: number[];
+        /**
+         * The weights of the instantiated Morph Target. Number of elements must match number of Morph Targets of used mesh
+         */
         weights?: number[];
     }
+    /**
+     * Texture sampler properties for filtering and wrapping modes
+     */
     interface ISampler extends IChildRootProperty {
+        /**
+         * Magnification filter.  Valid values correspond to WebGL enums: 9728 (NEAREST) and 9729 (LINEAR)
+         */
         magFilter?: TextureMagFilter;
+        /**
+         * Minification filter.  All valid values correspond to WebGL enums
+         */
         minFilter?: TextureMinFilter;
+        /**
+         * S (U) wrapping mode.  All valid values correspond to WebGL enums
+         */
         wrapS?: TextureWrapMode;
+        /**
+         * T (V) wrapping mode.  All valid values correspond to WebGL enums
+         */
         wrapT?: TextureWrapMode;
     }
+    /**
+     * The root nodes of a scene
+     */
     interface IScene extends IChildRootProperty {
+        /**
+         * The indices of each root node
+         */
         nodes: number[];
     }
+    /**
+     * Joints and matrices defining a skin
+     */
     interface ISkin extends IChildRootProperty {
+        /**
+         * The index of the accessor containing the floating-point 4x4 inverse-bind matrices.  The default is that each matrix is a 4x4 identity matrix, which implies that inverse-bind matrices were pre-applied
+         */
         inverseBindMatrices?: number;
+        /**
+         * The index of the node used as a skeleton root. When undefined, joints transforms resolve to scene root
+         */
         skeleton?: number;
+        /**
+         * Indices of skeleton nodes, used as joints in this skin.  The array length must be the same as the count property of the inverseBindMatrices accessor (when defined)
+         */
         joints: number[];
     }
+    /**
+     * A texture and its sampler
+     */
     interface ITexture extends IChildRootProperty {
+        /**
+         * The index of the sampler used by this texture. When undefined, a sampler with repeat wrapping and auto filtering should be used
+         */
         sampler?: number;
+        /**
+         * The index of the image used by this texture
+         */
         source: number;
     }
+    /**
+     * Reference to a texture
+     */
     interface ITextureInfo {
+        /**
+         * The index of the texture
+         */
         index: number;
+        /**
+         * The set index of texture's TEXCOORD attribute used for texture coordinate mapping
+         */
         texCoord?: number;
     }
+    /**
+     * The root object for a glTF asset
+     */
     interface IGLTF extends IProperty {
+        /**
+         * An array of accessors. An accessor is a typed view into a bufferView
+         */
         accessors?: IAccessor[];
+        /**
+         * An array of keyframe animations
+         */
         animations?: IAnimation[];
+        /**
+         * Metadata about the glTF asset
+         */
         asset: IAsset;
+        /**
+         * An array of buffers.  A buffer points to binary geometry, animation, or skins
+         */
         buffers?: IBuffer[];
+        /**
+         * An array of bufferViews.  A bufferView is a view into a buffer generally representing a subset of the buffer
+         */
         bufferViews?: IBufferView[];
+        /**
+         * An array of cameras
+         */
         cameras?: ICamera[];
+        /**
+         * Names of glTF extensions used somewhere in this asset
+         */
         extensionsUsed?: string[];
+        /**
+         * Names of glTF extensions required to properly load this asset
+         */
         extensionsRequired?: string[];
+        /**
+         * An array of images.  An image defines data used to create a texture
+         */
         images?: IImage[];
+        /**
+         * An array of materials.  A material defines the appearance of a primitive
+         */
         materials?: IMaterial[];
+        /**
+         * An array of meshes.  A mesh is a set of primitives to be rendered
+         */
         meshes?: IMesh[];
+        /**
+         * An array of nodes
+         */
         nodes?: INode[];
+        /**
+         * An array of samplers.  A sampler contains properties for texture filtering and wrapping modes
+         */
         samplers?: ISampler[];
+        /**
+         * The index of the default scene
+         */
         scene?: number;
+        /**
+         * An array of scenes
+         */
         scenes?: IScene[];
+        /**
+         * An array of skins.  A skin is defined by joints and matrices
+         */
         skins?: ISkin[];
+        /**
+         * An array of textures
+         */
         textures?: ITexture[];
     }
 }

dist/preview release/gui/babylon.gui.d.ts

@@ -152,6 +152,28 @@ declare module BABYLON.GUI {
 
 
 declare module BABYLON.GUI {
+    class MultiLinePoint {
+        private _multiLine;
+        private _x;
+        private _y;
+        private _control;
+        private _mesh;
+        private _controlObserver;
+        private _meshObserver;
+        _point: Vector2;
+        constructor(multiLine: MultiLine);
+        x: string | number;
+        y: string | number;
+        control: Nullable<Control>;
+        mesh: Nullable<AbstractMesh>;
+        translate(): Vector2;
+        private _translatePoint();
+        dispose(): void;
+    }
+}
+
+
+declare module BABYLON.GUI {
     class Control {
         name: string | undefined;
         private _alpha;
@@ -260,7 +282,7 @@ declare module BABYLON.GUI {
         readonly heightInPixels: number;
         fontFamily: string;
         fontStyle: string;
-        /** @ignore */
+        /** @hidden */
         readonly _isFontSizeInPercentage: boolean;
         readonly fontSizeInPixels: number;
         fontSize: string | number;
@@ -289,7 +311,7 @@ declare module BABYLON.GUI {
         readonly centerY: number;
         constructor(name?: string | undefined);
         protected _getTypeName(): string;
-        /** @ignore */
+        /** @hidden */
         _resetFontCache(): void;
         getLocalCoordinates(globalCoordinates: Vector2): Vector2;
         getLocalCoordinatesToRef(globalCoordinates: Vector2, result: Vector2): Control;
@@ -646,7 +668,7 @@ declare module BABYLON.GUI {
             name?: string | undefined, text?: string);
         protected _getTypeName(): string;
         private _drawText(text, textWidth, y, context);
-        /** @ignore */
+        /** @hidden */
         _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
         protected _applyStates(context: CanvasRenderingContext2D): void;
         protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
@@ -852,3 +874,39 @@ declare module BABYLON.GUI {
         static CreateDefaultLayout(): VirtualKeyboard;
     }
 }
+
+
+declare module BABYLON.GUI {
+    class MultiLine extends Control {
+        name: string | undefined;
+        private _lineWidth;
+        private _dash;
+        private _points;
+        private _minX;
+        private _minY;
+        private _maxX;
+        private _maxY;
+        constructor(name?: string | undefined);
+        dash: Array<number>;
+        getAt(index: number): MultiLinePoint;
+        onPointUpdate: () => void;
+        add(...items: (AbstractMesh | Control | {
+            x: string | number;
+            y: string | number;
+        })[]): MultiLinePoint[];
+        push(item?: (AbstractMesh | Control | {
+            x: string | number;
+            y: string | number;
+        })): MultiLinePoint;
+        remove(value: number | MultiLinePoint): void;
+        lineWidth: number;
+        horizontalAlignment: number;
+        verticalAlignment: number;
+        protected _getTypeName(): string;
+        _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        _measure(): void;
+        protected _computeAlignment(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        dispose(): void;
+    }
+}

dist/preview release/gui/babylon.gui.js

@@ -871,6 +871,119 @@ var BABYLON;
 
 //# sourceMappingURL=valueAndUnit.js.map
 
+/// <reference path="../../dist/preview release/babylon.d.ts"/>
+var BABYLON;
+(function (BABYLON) {
+    var GUI;
+    (function (GUI) {
+        var MultiLinePoint = /** @class */ (function () {
+            function MultiLinePoint(multiLine) {
+                this._multiLine = multiLine;
+                this._x = new GUI.ValueAndUnit(0);
+                this._y = new GUI.ValueAndUnit(0);
+                this._point = new BABYLON.Vector2(0, 0);
+            }
+            Object.defineProperty(MultiLinePoint.prototype, "x", {
+                get: function () {
+                    return this._x.toString(this._multiLine._host);
+                },
+                set: function (value) {
+                    if (this._x.toString(this._multiLine._host) === value) {
+                        return;
+                    }
+                    if (this._x.fromString(value)) {
+                        this._multiLine._markAsDirty();
+                    }
+                },
+                enumerable: true,
+                configurable: true
+            });
+            Object.defineProperty(MultiLinePoint.prototype, "y", {
+                get: function () {
+                    return this._y.toString(this._multiLine._host);
+                },
+                set: function (value) {
+                    if (this._y.toString(this._multiLine._host) === value) {
+                        return;
+                    }
+                    if (this._y.fromString(value)) {
+                        this._multiLine._markAsDirty();
+                    }
+                },
+                enumerable: true,
+                configurable: true
+            });
+            Object.defineProperty(MultiLinePoint.prototype, "control", {
+                get: function () {
+                    return this._control;
+                },
+                set: function (value) {
+                    if (this._control === value) {
+                        return;
+                    }
+                    if (this._control && this._controlObserver) {
+                        this._control.onDirtyObservable.remove(this._controlObserver);
+                        this._controlObserver = null;
+                    }
+                    this._control = value;
+                    if (this._control) {
+                        this._controlObserver = this._control.onDirtyObservable.add(this._multiLine.onPointUpdate);
+                    }
+                    this._multiLine._markAsDirty();
+                },
+                enumerable: true,
+                configurable: true
+            });
+            Object.defineProperty(MultiLinePoint.prototype, "mesh", {
+                get: function () {
+                    return this._mesh;
+                },
+                set: function (value) {
+                    if (this._mesh === value) {
+                        return;
+                    }
+                    if (this._mesh && this._meshObserver) {
+                        this._mesh.getScene().onAfterCameraRenderObservable.remove(this._meshObserver);
+                    }
+                    this._mesh = value;
+                    if (this._mesh) {
+                        this._meshObserver = this._mesh.getScene().onAfterCameraRenderObservable.add(this._multiLine.onPointUpdate);
+                    }
+                    this._multiLine._markAsDirty();
+                },
+                enumerable: true,
+                configurable: true
+            });
+            MultiLinePoint.prototype.translate = function () {
+                this._point = this._translatePoint();
+                return this._point;
+            };
+            MultiLinePoint.prototype._translatePoint = function () {
+                if (this._mesh != null) {
+                    return this._multiLine._host.getProjectedPosition(this._mesh.getBoundingInfo().boundingSphere.center, this._mesh.getWorldMatrix());
+                }
+                else if (this._control != null) {
+                    return new BABYLON.Vector2(this._control.centerX, this._control.centerY);
+                }
+                else {
+                    var host = this._multiLine._host;
+                    var xValue = this._x.getValueInPixel(host, Number(host._canvas.width));
+                    var yValue = this._y.getValueInPixel(host, Number(host._canvas.height));
+                    return new BABYLON.Vector2(xValue, yValue);
+                }
+            };
+            MultiLinePoint.prototype.dispose = function () {
+                this.control = null;
+                this.mesh = null;
+            };
+            return MultiLinePoint;
+        }());
+        GUI.MultiLinePoint = MultiLinePoint;
+    })(GUI = BABYLON.GUI || (BABYLON.GUI = {}));
+})(BABYLON || (BABYLON = {}));
+
+//# sourceMappingURL=multiLinePoint.js.map
+
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
 var BABYLON;
 (function (BABYLON) {
@@ -1159,7 +1272,7 @@ var BABYLON;
                 configurable: true
             });
             Object.defineProperty(Control.prototype, "_isFontSizeInPercentage", {
-                /** @ignore */
+                /** @hidden */
                 get: function () {
                     return this._fontSize.isPercentage;
                 },
@@ -1426,7 +1539,7 @@ var BABYLON;
             Control.prototype._getTypeName = function () {
                 return "Control";
             };
-            /** @ignore */
+            /** @hidden */
             Control.prototype._resetFontCache = function () {
                 this._fontSet = true;
             };
@@ -3625,7 +3738,7 @@ var BABYLON;
                 }
                 context.fillText(text, this._currentMeasure.left + x, y);
             };
-            /** @ignore */
+            /** @hidden */
             TextBlock.prototype._draw = function (parentMeasure, context) {
                 context.save();
                 this._applyStates(context);
@@ -4173,8 +4286,6 @@ var BABYLON;
     })(GUI = BABYLON.GUI || (BABYLON.GUI = {}));
 })(BABYLON || (BABYLON = {}));
 
-//# sourceMappingURL=button.js.map
-
 /// <reference path="../../../dist/preview release/babylon.d.ts"/>
 
 var BABYLON;
@@ -5137,6 +5248,207 @@ var BABYLON;
     })(GUI = BABYLON.GUI || (BABYLON.GUI = {}));
 })(BABYLON || (BABYLON = {}));
 
+/// <reference path="../../../dist/preview release/babylon.d.ts"/>
+
+var BABYLON;
+(function (BABYLON) {
+    var GUI;
+    (function (GUI) {
+        var MultiLine = /** @class */ (function (_super) {
+            __extends(MultiLine, _super);
+            function MultiLine(name) {
+                var _this = _super.call(this, name) || this;
+                _this.name = name;
+                _this._lineWidth = 1;
+                _this.onPointUpdate = function () {
+                    _this._markAsDirty();
+                };
+                _this.isHitTestVisible = false;
+                _this._horizontalAlignment = GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
+                _this._verticalAlignment = GUI.Control.VERTICAL_ALIGNMENT_TOP;
+                _this._dash = [];
+                _this._points = [];
+                return _this;
+            }
+            Object.defineProperty(MultiLine.prototype, "dash", {
+                get: function () {
+                    return this._dash;
+                },
+                set: function (value) {
+                    if (this._dash === value) {
+                        return;
+                    }
+                    this._dash = value;
+                    this._markAsDirty();
+                },
+                enumerable: true,
+                configurable: true
+            });
+            MultiLine.prototype.getAt = function (index) {
+                if (!this._points[index]) {
+                    this._points[index] = new GUI.MultiLinePoint(this);
+                }
+                return this._points[index];
+            };
+            MultiLine.prototype.add = function () {
+                var _this = this;
+                var items = [];
+                for (var _i = 0; _i < arguments.length; _i++) {
+                    items[_i] = arguments[_i];
+                }
+                return items.map(function (item) { return _this.push(item); });
+            };
+            MultiLine.prototype.push = function (item) {
+                var point = this.getAt(this._points.length);
+                if (item == null)
+                    return point;
+                if (item instanceof BABYLON.AbstractMesh) {
+                    point.mesh = item;
+                }
+                else if (item instanceof GUI.Control) {
+                    point.control = item;
+                }
+                else if (item.x != null && item.y != null) {
+                    point.x = item.x;
+                    point.y = item.y;
+                }
+                return point;
+            };
+            MultiLine.prototype.remove = function (value) {
+                var index;
+                if (value instanceof GUI.MultiLinePoint) {
+                    index = this._points.indexOf(value);
+                    if (index === -1) {
+                        return;
+                    }
+                }
+                else {
+                    index = value;
+                }
+                var point = this._points[index];
+                if (!point) {
+                    return;
+                }
+                point.dispose();
+                this._points.splice(index, 1);
+            };
+            Object.defineProperty(MultiLine.prototype, "lineWidth", {
+                get: function () {
+                    return this._lineWidth;
+                },
+                set: function (value) {
+                    if (this._lineWidth === value) {
+                        return;
+                    }
+                    this._lineWidth = value;
+                    this._markAsDirty();
+                },
+                enumerable: true,
+                configurable: true
+            });
+            Object.defineProperty(MultiLine.prototype, "horizontalAlignment", {
+                set: function (value) {
+                    return;
+                },
+                enumerable: true,
+                configurable: true
+            });
+            Object.defineProperty(MultiLine.prototype, "verticalAlignment", {
+                set: function (value) {
+                    return;
+                },
+                enumerable: true,
+                configurable: true
+            });
+            MultiLine.prototype._getTypeName = function () {
+                return "MultiLine";
+            };
+            MultiLine.prototype._draw = function (parentMeasure, context) {
+                context.save();
+                if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
+                    context.shadowColor = this.shadowColor;
+                    context.shadowBlur = this.shadowBlur;
+                    context.shadowOffsetX = this.shadowOffsetX;
+                    context.shadowOffsetY = this.shadowOffsetY;
+                }
+                this._applyStates(context);
+                if (this._processMeasures(parentMeasure, context)) {
+                    context.strokeStyle = this.color;
+                    context.lineWidth = this._lineWidth;
+                    context.setLineDash(this._dash);
+                    context.beginPath();
+                    var first = true; //first index is not necessarily 0
+                    this._points.forEach(function (point) {
+                        if (!point) {
+                            return;
+                        }
+                        if (first) {
+                            context.moveTo(point._point.x, point._point.y);
+                            first = false;
+                        }
+                        else {
+                            context.lineTo(point._point.x, point._point.y);
+                        }
+                    });
+                    context.stroke();
+                }
+                context.restore();
+            };
+            MultiLine.prototype._additionalProcessing = function (parentMeasure, context) {
+                var _this = this;
+                this._minX = null;
+                this._minY = null;
+                this._maxX = null;
+                this._maxY = null;
+                this._points.forEach(function (point, index) {
+                    if (!point) {
+                        return;
+                    }
+                    point.translate();
+                    if (_this._minX == null || point._point.x < _this._minX)
+                        _this._minX = point._point.x;
+                    if (_this._minY == null || point._point.y < _this._minY)
+                        _this._minY = point._point.y;
+                    if (_this._maxX == null || point._point.x > _this._maxX)
+                        _this._maxX = point._point.x;
+                    if (_this._maxY == null || point._point.y > _this._maxY)
+                        _this._maxY = point._point.y;
+                });
+                if (this._minX == null)
+                    this._minX = 0;
+                if (this._minY == null)
+                    this._minY = 0;
+                if (this._maxX == null)
+                    this._maxX = 0;
+                if (this._maxY == null)
+                    this._maxY = 0;
+            };
+            MultiLine.prototype._measure = function () {
+                if (this._minX == null || this._maxX == null || this._minY == null || this._maxY == null) {
+                    return;
+                }
+                this._currentMeasure.width = Math.abs(this._maxX - this._minX) + this._lineWidth;
+                this._currentMeasure.height = Math.abs(this._maxY - this._minY) + this._lineWidth;
+            };
+            MultiLine.prototype._computeAlignment = function (parentMeasure, context) {
+                if (this._minX == null || this._minY == null) {
+                    return;
+                }
+                this._currentMeasure.left = this._minX - this._lineWidth / 2;
+                this._currentMeasure.top = this._minY - this._lineWidth / 2;
+            };
+            MultiLine.prototype.dispose = function () {
+                while (this._points.length > 0) {
+                    this.remove(this._points.length - 1);
+                }
+                _super.prototype.dispose.call(this);
+            };
+            return MultiLine;
+        }(GUI.Control));
+        GUI.MultiLine = MultiLine;
+    })(GUI = BABYLON.GUI || (BABYLON.GUI = {}));
+})(BABYLON || (BABYLON = {}));
+
     
 
     return BABYLON.GUI;

dist/preview release/gui/babylon.gui.module.d.ts

@@ -157,6 +157,28 @@ declare module BABYLON.GUI {
 
 
 declare module BABYLON.GUI {
+    class MultiLinePoint {
+        private _multiLine;
+        private _x;
+        private _y;
+        private _control;
+        private _mesh;
+        private _controlObserver;
+        private _meshObserver;
+        _point: Vector2;
+        constructor(multiLine: MultiLine);
+        x: string | number;
+        y: string | number;
+        control: Nullable<Control>;
+        mesh: Nullable<AbstractMesh>;
+        translate(): Vector2;
+        private _translatePoint();
+        dispose(): void;
+    }
+}
+
+
+declare module BABYLON.GUI {
     class Control {
         name: string | undefined;
         private _alpha;
@@ -265,7 +287,7 @@ declare module BABYLON.GUI {
         readonly heightInPixels: number;
         fontFamily: string;
         fontStyle: string;
-        /** @ignore */
+        /** @hidden */
         readonly _isFontSizeInPercentage: boolean;
         readonly fontSizeInPixels: number;
         fontSize: string | number;
@@ -294,7 +316,7 @@ declare module BABYLON.GUI {
         readonly centerY: number;
         constructor(name?: string | undefined);
         protected _getTypeName(): string;
-        /** @ignore */
+        /** @hidden */
         _resetFontCache(): void;
         getLocalCoordinates(globalCoordinates: Vector2): Vector2;
         getLocalCoordinatesToRef(globalCoordinates: Vector2, result: Vector2): Control;
@@ -651,7 +673,7 @@ declare module BABYLON.GUI {
             name?: string | undefined, text?: string);
         protected _getTypeName(): string;
         private _drawText(text, textWidth, y, context);
-        /** @ignore */
+        /** @hidden */
         _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
         protected _applyStates(context: CanvasRenderingContext2D): void;
         protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
@@ -857,3 +879,39 @@ declare module BABYLON.GUI {
         static CreateDefaultLayout(): VirtualKeyboard;
     }
 }
+
+
+declare module BABYLON.GUI {
+    class MultiLine extends Control {
+        name: string | undefined;
+        private _lineWidth;
+        private _dash;
+        private _points;
+        private _minX;
+        private _minY;
+        private _maxX;
+        private _maxY;
+        constructor(name?: string | undefined);
+        dash: Array<number>;
+        getAt(index: number): MultiLinePoint;
+        onPointUpdate: () => void;
+        add(...items: (AbstractMesh | Control | {
+            x: string | number;
+            y: string | number;
+        })[]): MultiLinePoint[];
+        push(item?: (AbstractMesh | Control | {
+            x: string | number;
+            y: string | number;
+        })): MultiLinePoint;
+        remove(value: number | MultiLinePoint): void;
+        lineWidth: number;
+        horizontalAlignment: number;
+        verticalAlignment: number;
+        protected _getTypeName(): string;
+        _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        _measure(): void;
+        protected _computeAlignment(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        dispose(): void;
+    }
+}

dist/preview release/inspector/babylon.inspector.css

@@ -44,11 +44,11 @@
       font-size: 1em; }
       .insp-wrapper .insp-right-panel .top-panel .tab-panel-content {
         width: 100%;
-        height: calc(100% - 32px); }
+        height: calc(100% - 40px); }
       .insp-wrapper .insp-right-panel .top-panel .more-tabs-panel {
         position: absolute;
         z-index: 10;
-        top: 32px;
+        top: 40px;
         right: 0;
         width: 100px;
         display: none;
@@ -70,7 +70,7 @@
             background-color: #454545; }
   .insp-wrapper .tooltip {
     position: absolute;
-    top: 32px;
+    top: 40px;
     right: 0;
     color: #f29766;
     display: none;
@@ -249,7 +249,7 @@
   .insp-wrapper .insp-tree {
     overflow-y: auto;
     overflow-x: hidden;
-    height: calc(50% - 32px - 30px); }
+    height: calc(50% - 40px - 30px); }
     .insp-wrapper .insp-tree .line {
       padding: 3px;
       cursor: pointer; }
@@ -368,7 +368,7 @@
           max-width: 110px;
           max-height: 110px; }
   .insp-wrapper .tabbar {
-    height: 32px;
+    height: 40px;
     display: flex;
     align-items: center;
     border-bottom: 1px solid #383838;
@@ -377,11 +377,11 @@
     overflow-y: hidden;
     box-sizing: border-box; }
     .insp-wrapper .tabbar .tab {
-      height: calc(32px - 2px);
+      height: calc(40px - 2px);
       width: auto;
       padding: 0 10px 0 10px;
       color: #ccc;
-      line-height: 32px;
+      line-height: 40px;
       text-align: center;
       cursor: pointer;
       margin: 0 5px 0 5px;
@@ -394,8 +394,8 @@
       .insp-wrapper .tabbar .tab.active {
         border-bottom: 1px solid #f29766; }
     .insp-wrapper .tabbar .more-tabs {
-      width: 32px;
-      height: 32px;
+      width: 40px;
+      height: 40px;
       display: flex;
       justify-content: center;
       align-items: center;
@@ -412,8 +412,8 @@
   .insp-wrapper .toolbar {
     display: flex; }
     .insp-wrapper .toolbar .tool {
-      width: 32px;
-      height: 32px;
+      width: 40px;
+      height: 40px;
       display: flex;
       justify-content: center;
       align-items: center;

dist/preview release/loaders/babylon.glTF1FileLoader.d.ts

@@ -1,8 +1,8 @@
 
 declare module BABYLON {
     /**
-    * Coordinate system mode that will be used when loading from the gltf file
-    */
+     * Mode that determines the coordinate system to use.
+     */
     enum GLTFLoaderCoordinateSystemMode {
         /**
          * Automatically convert the glTF right-handed data to the appropriate system based on the current coordinate system mode of the scene.
@@ -14,8 +14,8 @@ declare module BABYLON {
         FORCE_RIGHT_HANDED = 1,
     }
     /**
-    * Animation mode that determines which animations should be started when a file is loaded
-    */
+     * Mode that determines what animations will start.
+     */
     enum GLTFLoaderAnimationStartMode {
         /**
          * No animation will start.
@@ -31,34 +31,34 @@ declare module BABYLON {
         ALL = 2,
     }
     /**
-    * Loaded gltf data
-    */
+     * Interface that contains the data for the glTF asset.
+     */
     interface IGLTFLoaderData {
         /**
-        * Loaded json string converted to an object
-        */
+         * JSON that represents the glTF.
+         */
         json: Object;
         /**
-        * Loaded ArrayBufferView
-        */
+         * The BIN chunk of a binary glTF
+         */
         bin: Nullable<ArrayBufferView>;
     }
     /**
-    * Gltf extension interface
-    */
+     * Interface for extending the loader.
+     */
     interface IGLTFLoaderExtension {
         /**
          * The name of this extension.
          */
         readonly name: string;
         /**
-         * Whether this extension is enabled.
+         * Defines whether this extension is enabled.
          */
         enabled: boolean;
     }
     /**
-    * Loading state
-    */
+     * Loader state.
+     */
     enum GLTFLoaderState {
         /**
          * The asset is loading.
@@ -74,60 +74,67 @@ declare module BABYLON {
         COMPLETE = 2,
     }
     /**
-    * GLTF loader interface
-    */
+     * Loader interface.
+     */
     interface IGLTFLoader extends IDisposable {
         /**
-        * Coordinate system that will be used when loading from the gltf file
-        */
+         * Mode that determines the coordinate system to use.
+         */
         coordinateSystemMode: GLTFLoaderCoordinateSystemMode;
         /**
-        * Animation mode that determines which animations should be started when a file is loaded
-        */
+         * Mode that determines what animations will start.
+         */
         animationStartMode: GLTFLoaderAnimationStartMode;
         /**
-        * If the materials in the file should automatically be compiled
-        */
+         * Defines if the loader should compile materials.
+         */
         compileMaterials: boolean;
         /**
-        * If a clip plane should be usede when loading meshes in the file
-        */
+         * Defines if the loader should also compile materials with clip planes.
+         */
         useClipPlane: boolean;
         /**
-        * If shadow generators should automatically be compiled
-        */
+         * Defines if the loader should compile shadow generators.
+         */
         compileShadowGenerators: boolean;
         /**
-        * Observable that fires each time a mesh is loaded
-        */
+         * Observable raised when the loader creates a mesh after parsing the glTF properties of the mesh.
+         */
         onMeshLoadedObservable: Observable<AbstractMesh>;
         /**
-        * Observable that fires each time a texture is loaded
-        */
+         * Observable raised when the loader creates a texture after parsing the glTF properties of the texture.
+         */
         onTextureLoadedObservable: Observable<BaseTexture>;
         /**
-       * Observable that fires each time a material is loaded
-       */
+         * Observable raised when the loader creates a material after parsing the glTF properties of the material.
+         */
         onMaterialLoadedObservable: Observable<Material>;
         /**
-        * Observable that fires when the load has completed
-        */
+         * Observable raised when the loader creates a camera after parsing the glTF properties of the camera.
+         */
+        onCameraLoadedObservable: Observable<Camera>;
+        /**
+         * Observable raised when the asset is completely loaded, immediately before the loader is disposed.
+         * For assets with LODs, raised when all of the LODs are complete.
+         * For assets without LODs, raised when the model is complete, immediately after the loader resolves the returned promise.
+         */
         onCompleteObservable: Observable<IGLTFLoader>;
         /**
-        * Observable that fires when the loader is disposed
-        */
+         * Observable raised after the loader is disposed.
+         */
         onDisposeObservable: Observable<IGLTFLoader>;
         /**
-        * Observable that fire when an extension is loaded
-        */
+         * Observable raised after a loader extension is created.
+         * Set additional options for a loader extension in this event.
+         */
         onExtensionLoadedObservable: Observable<IGLTFLoaderExtension>;
         /**
-        * Loader state
-        */
+         * Loader state or null if the loader is not active.
+         */
         state: Nullable<GLTFLoaderState>;
         /**
-        * Imports one or more meshes from a loaded gltf file and adds them to the scene
-        */
+         * Imports meshes from the given data and adds them to the scene.
+         */
         importMeshAsync: (meshesNames: any, scene: Scene, data: IGLTFLoaderData, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void) => Promise<{
             meshes: AbstractMesh[];
             particleSystems: ParticleSystem[];
@@ -135,122 +142,135 @@ declare module BABYLON {
             animationGroups: AnimationGroup[];
         }>;
         /**
-        * Imports all objects from a loaded gltf file and adds them to the scene
-        */
+         * Loads all objects from the given data and adds them to the scene.
+         */
         loadAsync: (scene: Scene, data: IGLTFLoaderData, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void) => Promise<void>;
     }
-    /** File loader to load gltf files into a babylon scene */
+    /**
+     * File loader for loading glTF files into a scene.
+     */
     class GLTFFileLoader implements IDisposable, ISceneLoaderPluginAsync, ISceneLoaderPluginFactory {
-        /** Creates a gltf 1.0 file loader */
+        /**
+         * Factory function that creates a glTF 1.0 loader
+         */
         static CreateGLTFLoaderV1: () => IGLTFLoader;
-        /** Creates a gltf 2.0 file loader */
+        /**
+         * Factory function that creates a glTF 2.0 loader
+         */
         static CreateGLTFLoaderV2: () => IGLTFLoader;
         /**
-         * Raised when the asset has been parsed.
-         * The data.json property stores the glTF JSON.
-         * The data.bin property stores the BIN chunk from a glTF binary or null if the input is not a glTF binary.
+         * Raised when the asset has been parsed
          */
         onParsedObservable: Observable<IGLTFLoaderData>;
         private _onParsedObserver;
-        /** Raised when the asset has been parsed. */
+        /**
+         * Raised when the asset has been parsed
+         */
         onParsed: (loaderData: IGLTFLoaderData) => void;
         /**
-         * Set this property to false to disable incremental loading which delays the loader from calling the success callback until after loading the meshes and shaders. Textures always loads asynchronously. For example, the success callback can compute the bounding information of the loaded meshes when incremental loading is disabled. Defaults to true.
+         * Set this property to false to disable incremental loading which delays the loader from calling the success callback until after loading the meshes and shaders.
+         * Textures always loads asynchronously. For example, the success callback can compute the bounding information of the loaded meshes when incremental loading is disabled.
+         * Defaults to true.
          */
         static IncrementalLoading: boolean;
         /**
-         * Set this property to true in order to work with homogeneous coordinates, available with some converters and exporters. Defaults to false. See https://en.wikipedia.org/wiki/Homogeneous_coordinates
+         * Set this property to true in order to work with homogeneous coordinates, available with some converters and exporters.
+         * Defaults to false. See https://en.wikipedia.org/wiki/Homogeneous_coordinates.
          */
         static HomogeneousCoordinates: boolean;
         /**
-         * The coordinate system mode (AUTO, FORCE_RIGHT_HANDED). Defaults to AUTO.
-         * - AUTO - Automatically convert the glTF right-handed data to the appropriate system based on the current coordinate system mode of the scene.
-         * - FORCE_RIGHT_HANDED - Sets the useRightHandedSystem flag on the scene.
+         * The coordinate system mode. Defaults to AUTO.
          */
         coordinateSystemMode: GLTFLoaderCoordinateSystemMode;
         /**
-        * The animation start mode (NONE, FIRST, ALL). Defaults to FIRST.
-        * - NONE - No animation will start.
-        * - FIRST - The first animation will start.
-        * - ALL - All animations will start.
+        * The animation start mode. Defaults to FIRST.
         */
         animationStartMode: GLTFLoaderAnimationStartMode;
         /**
-         * Set to true to compile materials before raising the success callback. Defaults to false.
+         * Defines if the loader should compile materials before raising the success callback. Defaults to false.
          */
         compileMaterials: boolean;
         /**
-         * Set to true to also compile materials with clip planes. Defaults to false.
+         * Defines if the loader should also compile materials with clip planes. Defaults to false.
          */
         useClipPlane: boolean;
         /**
-         * Set to true to compile shadow generators before raising the success callback. Defaults to false.
+         * Defines if the loader should compile shadow generators before raising the success callback. Defaults to false.
          */
         compileShadowGenerators: boolean;
         /**
-         * Raised when the loader creates a mesh after parsing the glTF properties of the mesh.
+         * Observable raised when the loader creates a mesh after parsing the glTF properties of the mesh.
          */
         readonly onMeshLoadedObservable: Observable<AbstractMesh>;
         private _onMeshLoadedObserver;
         /**
-         * Raised when the loader creates a mesh after parsing the glTF properties of the mesh. (onMeshLoadedObservable is likely desired instead.)
+         * Callback raised when the loader creates a mesh after parsing the glTF properties of the mesh.
          */
         onMeshLoaded: (mesh: AbstractMesh) => void;
         /**
-         * Raised when the loader creates a texture after parsing the glTF properties of the texture.
+         * Observable raised when the loader creates a texture after parsing the glTF properties of the texture.
          */
         readonly onTextureLoadedObservable: Observable<BaseTexture>;
         private _onTextureLoadedObserver;
         /**
-         * Method called when a texture has been loaded (onTextureLoadedObservable is likely desired instead.)
+         * Callback raised when the loader creates a texture after parsing the glTF properties of the texture.
          */
         onTextureLoaded: (texture: BaseTexture) => void;
         /**
-         * Raised when the loader creates a material after parsing the glTF properties of the material.
+         * Observable raised when the loader creates a material after parsing the glTF properties of the material.
          */
         readonly onMaterialLoadedObservable: Observable<Material>;
         private _onMaterialLoadedObserver;
         /**
-         * Method when the loader creates a material after parsing the glTF properties of the material. (onMaterialLoadedObservable is likely desired instead.)
+         * Callback raised when the loader creates a material after parsing the glTF properties of the material.
          */
         onMaterialLoaded: (material: Material) => void;
         /**
-         * Raised when the asset is completely loaded, immediately before the loader is disposed.
+         * Observable raised when the loader creates a camera after parsing the glTF properties of the camera.
+         */
+        readonly onCameraLoadedObservable: Observable<Camera>;
+        private _onCameraLoadedObserver;
+        /**
+         * Callback raised when the loader creates a camera after parsing the glTF properties of the camera.
+         */
+        onCameraLoaded: (camera: Camera) => void;
+        /**
+         * Observable raised when the asset is completely loaded, immediately before the loader is disposed.
          * For assets with LODs, raised when all of the LODs are complete.
          * For assets without LODs, raised when the model is complete, immediately after the loader resolves the returned promise.
          */
         readonly onCompleteObservable: Observable<GLTFFileLoader>;
         private _onCompleteObserver;
         /**
-         * Raised when the asset is completely loaded, immediately before the loader is disposed. (onCompleteObservable is likely desired instead.)
+         * Callback raised when the asset is completely loaded, immediately before the loader is disposed.
          */
         onComplete: () => void;
         /**
-        * Raised after the loader is disposed.
-        */
+         * Observable raised after the loader is disposed.
+         */
         readonly onDisposeObservable: Observable<GLTFFileLoader>;
         private _onDisposeObserver;
         /**
-         * Raised after the loader is disposed. (onDisposeObservable is likely desired instead.)
+         * Callback raised after the loader is disposed.
          */
         onDispose: () => void;
         /**
-         * Raised after a loader extension is created.
+         * Observable raised after a loader extension is created.
          * Set additional options for a loader extension in this event.
          */
         readonly onExtensionLoadedObservable: Observable<IGLTFLoaderExtension>;
         private _onExtensionLoadedObserver;
         /**
-         * Raised after a loader extension is created. (onExtensionLoadedObservable is likely desired instead.)
+         * Callback raised after a loader extension is created.
          */
         onExtensionLoaded: (extension: IGLTFLoaderExtension) => void;
         /**
          * Returns a promise that resolves when the asset is completely loaded.
-         * @returns A promise that resolves when the asset is completely loaded.
+         * @returns a promise that resolves when the asset is completely loaded.
          */
         whenCompleteAsync(): Promise<void>;
         /**
-         * The loader state (LOADING, READY, COMPLETE) or null if the loader is not active.
+         * The loader state or null if the loader is not active.
          */
         readonly loaderState: Nullable<GLTFLoaderState>;
         private _loader;
@@ -267,14 +287,14 @@ declare module BABYLON {
          */
         dispose(): void;
         /**
-        * Imports one or more meshes from a loaded gltf file and adds them to the scene
-        * @param meshesNames a string or array of strings of the mesh names that should be loaded from the file
-        * @param scene the scene the meshes should be added to
-        * @param data gltf data containing information of the meshes in a loaded file
-        * @param rootUrl root url to load from
-        * @param onProgress event that fires when loading progress has occured
-        * @returns a promise containg the loaded meshes, particles, skeletons and animations
-        */
+         * Imports one or more meshes from the loaded glTF data and adds them to the scene
+         * @param meshesNames a string or array of strings of the mesh names that should be loaded from the file
+         * @param scene the scene the meshes should be added to
+         * @param data the glTF data to load
+         * @param rootUrl root url to load from
+         * @param onProgress event that fires when loading progress has occured
+         * @returns a promise containg the loaded meshes, particles, skeletons and animations
+         */
         importMeshAsync(meshesNames: any, scene: Scene, data: any, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void): Promise<{
             meshes: AbstractMesh[];
             particleSystems: ParticleSystem[];
@@ -282,13 +302,13 @@ declare module BABYLON {
             animationGroups: AnimationGroup[];
         }>;
         /**
-        * Imports all objects from a loaded gltf file and adds them to the scene
-        * @param scene the scene the objects should be added to
-        * @param data gltf data containing information of the meshes in a loaded file
-        * @param rootUrl root url to load from
-        * @param onProgress event that fires when loading progress has occured
-        * @returns a promise which completes when objects have been loaded to the scene
-        */
+         * Imports all objects from the loaded glTF data and adds them to the scene
+         * @param scene the scene the objects should be added to
+         * @param data the glTF data to load
+         * @param rootUrl root url to load from
+         * @param onProgress event that fires when loading progress has occured
+         * @returns a promise which completes when objects have been loaded to the scene
+         */
         loadAsync(scene: Scene, data: string | ArrayBuffer, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void): Promise<void>;
         /**
          * Load into an asset container.
@@ -300,17 +320,17 @@ declare module BABYLON {
          */
         loadAssetContainerAsync(scene: Scene, data: string | ArrayBuffer, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void): Promise<AssetContainer>;
         /**
-         * If the data string can be loaded directly
+         * If the data string can be loaded directly.
          * @param data string contianing the file data
          * @returns if the data can be loaded directly
          */
         canDirectLoad(data: string): boolean;
         /**
-         * Rewrites a url by combining a root url and response url
+         * Rewrites a url by combining a root url and response url.
          */
         rewriteRootURL: (rootUrl: string, responseURL?: string) => string;
         /**
-         * Instantiates a gltf file loader plugin
+         * Instantiates a glTF file loader plugin.
          * @returns the created plugin
          */
         createPlugin(): ISceneLoaderPlugin | ISceneLoaderPluginAsync;
@@ -727,6 +747,7 @@ declare module BABYLON.GLTF1 {
         onMeshLoadedObservable: Observable<AbstractMesh>;
         onTextureLoadedObservable: Observable<BaseTexture>;
         onMaterialLoadedObservable: Observable<Material>;
+        onCameraLoadedObservable: Observable<Camera>;
         onCompleteObservable: Observable<IGLTFLoader>;
         onExtensionLoadedObservable: Observable<IGLTFLoaderExtension>;
         /**

dist/preview release/loaders/babylon.glTF1FileLoader.js

@@ -2,8 +2,8 @@
 var BABYLON;
 (function (BABYLON) {
     /**
-    * Coordinate system mode that will be used when loading from the gltf file
-    */
+     * Mode that determines the coordinate system to use.
+     */
     var GLTFLoaderCoordinateSystemMode;
     (function (GLTFLoaderCoordinateSystemMode) {
         /**
@@ -16,8 +16,8 @@ var BABYLON;
         GLTFLoaderCoordinateSystemMode[GLTFLoaderCoordinateSystemMode["FORCE_RIGHT_HANDED"] = 1] = "FORCE_RIGHT_HANDED";
     })(GLTFLoaderCoordinateSystemMode = BABYLON.GLTFLoaderCoordinateSystemMode || (BABYLON.GLTFLoaderCoordinateSystemMode = {}));
     /**
-    * Animation mode that determines which animations should be started when a file is loaded
-    */
+     * Mode that determines what animations will start.
+     */
     var GLTFLoaderAnimationStartMode;
     (function (GLTFLoaderAnimationStartMode) {
         /**
@@ -34,8 +34,8 @@ var BABYLON;
         GLTFLoaderAnimationStartMode[GLTFLoaderAnimationStartMode["ALL"] = 2] = "ALL";
     })(GLTFLoaderAnimationStartMode = BABYLON.GLTFLoaderAnimationStartMode || (BABYLON.GLTFLoaderAnimationStartMode = {}));
     /**
-    * Loading state
-    */
+     * Loader state.
+     */
     var GLTFLoaderState;
     (function (GLTFLoaderState) {
         /**
@@ -51,67 +51,66 @@ var BABYLON;
          */
         GLTFLoaderState[GLTFLoaderState["COMPLETE"] = 2] = "COMPLETE";
     })(GLTFLoaderState = BABYLON.GLTFLoaderState || (BABYLON.GLTFLoaderState = {}));
-    /** File loader to load gltf files into a babylon scene */
+    /**
+     * File loader for loading glTF files into a scene.
+     */
     var GLTFFileLoader = /** @class */ (function () {
         function GLTFFileLoader() {
             // #region Common options
             /**
-             * Raised when the asset has been parsed.
-             * The data.json property stores the glTF JSON.
-             * The data.bin property stores the BIN chunk from a glTF binary or null if the input is not a glTF binary.
+             * Raised when the asset has been parsed
              */
             this.onParsedObservable = new BABYLON.Observable();
             // #endregion
             // #region V2 options
             /**
-             * The coordinate system mode (AUTO, FORCE_RIGHT_HANDED). Defaults to AUTO.
-             * - AUTO - Automatically convert the glTF right-handed data to the appropriate system based on the current coordinate system mode of the scene.
-             * - FORCE_RIGHT_HANDED - Sets the useRightHandedSystem flag on the scene.
+             * The coordinate system mode. Defaults to AUTO.
              */
             this.coordinateSystemMode = GLTFLoaderCoordinateSystemMode.AUTO;
             /**
-            * The animation start mode (NONE, FIRST, ALL). Defaults to FIRST.
-            * - NONE - No animation will start.
-            * - FIRST - The first animation will start.
-            * - ALL - All animations will start.
+            * The animation start mode. Defaults to FIRST.
             */
             this.animationStartMode = GLTFLoaderAnimationStartMode.FIRST;
             /**
-             * Set to true to compile materials before raising the success callback. Defaults to false.
+             * Defines if the loader should compile materials before raising the success callback. Defaults to false.
              */
             this.compileMaterials = false;
             /**
-             * Set to true to also compile materials with clip planes. Defaults to false.
+             * Defines if the loader should also compile materials with clip planes. Defaults to false.
              */
             this.useClipPlane = false;
             /**
-             * Set to true to compile shadow generators before raising the success callback. Defaults to false.
+             * Defines if the loader should compile shadow generators before raising the success callback. Defaults to false.
              */
             this.compileShadowGenerators = false;
             /**
-             * Raised when the loader creates a mesh after parsing the glTF properties of the mesh.
+             * Observable raised when the loader creates a mesh after parsing the glTF properties of the mesh.
              */
             this.onMeshLoadedObservable = new BABYLON.Observable();
             /**
-             * Raised when the loader creates a texture after parsing the glTF properties of the texture.
+             * Observable raised when the loader creates a texture after parsing the glTF properties of the texture.
              */
             this.onTextureLoadedObservable = new BABYLON.Observable();
             /**
-             * Raised when the loader creates a material after parsing the glTF properties of the material.
+             * Observable raised when the loader creates a material after parsing the glTF properties of the material.
              */
             this.onMaterialLoadedObservable = new BABYLON.Observable();
             /**
-             * Raised when the asset is completely loaded, immediately before the loader is disposed.
+             * Observable raised when the loader creates a camera after parsing the glTF properties of the camera.
+             */
+            this.onCameraLoadedObservable = new BABYLON.Observable();
+            /**
+             * Observable raised when the asset is completely loaded, immediately before the loader is disposed.
              * For assets with LODs, raised when all of the LODs are complete.
              * For assets without LODs, raised when the model is complete, immediately after the loader resolves the returned promise.
              */
             this.onCompleteObservable = new BABYLON.Observable();
             /**
-            * Raised after the loader is disposed.
-            */
+             * Observable raised after the loader is disposed.
+             */
             this.onDisposeObservable = new BABYLON.Observable();
             /**
-             * Raised after a loader extension is created.
+             * Observable raised after a loader extension is created.
              * Set additional options for a loader extension in this event.
              */
             this.onExtensionLoadedObservable = new BABYLON.Observable();
@@ -130,7 +129,9 @@ var BABYLON;
             };
         }
         Object.defineProperty(GLTFFileLoader.prototype, "onParsed", {
-            /** Raised when the asset has been parsed. */
+            /**
+             * Raised when the asset has been parsed
+             */
             set: function (callback) {
                 if (this._onParsedObserver) {
                     this.onParsedObservable.remove(this._onParsedObserver);
@@ -142,7 +143,7 @@ var BABYLON;
         });
         Object.defineProperty(GLTFFileLoader.prototype, "onMeshLoaded", {
             /**
-             * Raised when the loader creates a mesh after parsing the glTF properties of the mesh. (onMeshLoadedObservable is likely desired instead.)
+             * Callback raised when the loader creates a mesh after parsing the glTF properties of the mesh.
              */
             set: function (callback) {
                 if (this._onMeshLoadedObserver) {
@@ -155,7 +156,7 @@ var BABYLON;
         });
         Object.defineProperty(GLTFFileLoader.prototype, "onTextureLoaded", {
             /**
-             * Method called when a texture has been loaded (onTextureLoadedObservable is likely desired instead.)
+             * Callback raised when the loader creates a texture after parsing the glTF properties of the texture.
              */
             set: function (callback) {
                 if (this._onTextureLoadedObserver) {
@@ -168,7 +169,7 @@ var BABYLON;
         });
         Object.defineProperty(GLTFFileLoader.prototype, "onMaterialLoaded", {
             /**
-             * Method when the loader creates a material after parsing the glTF properties of the material. (onMaterialLoadedObservable is likely desired instead.)
+             * Callback raised when the loader creates a material after parsing the glTF properties of the material.
              */
             set: function (callback) {
                 if (this._onMaterialLoadedObserver) {
@@ -179,9 +180,22 @@ var BABYLON;
             enumerable: true,
             configurable: true
         });
+        Object.defineProperty(GLTFFileLoader.prototype, "onCameraLoaded", {
+            /**
+             * Callback raised when the loader creates a camera after parsing the glTF properties of the camera.
+             */
+            set: function (callback) {
+                if (this._onCameraLoadedObserver) {
+                    this.onCameraLoadedObservable.remove(this._onCameraLoadedObserver);
+                }
+                this._onCameraLoadedObserver = this.onCameraLoadedObservable.add(callback);
+            },
+            enumerable: true,
+            configurable: true
+        });
         Object.defineProperty(GLTFFileLoader.prototype, "onComplete", {
             /**
-             * Raised when the asset is completely loaded, immediately before the loader is disposed. (onCompleteObservable is likely desired instead.)
+             * Callback raised when the asset is completely loaded, immediately before the loader is disposed.
              */
             set: function (callback) {
                 if (this._onCompleteObserver) {
@@ -194,7 +208,7 @@ var BABYLON;
         });
         Object.defineProperty(GLTFFileLoader.prototype, "onDispose", {
             /**
-             * Raised after the loader is disposed. (onDisposeObservable is likely desired instead.)
+             * Callback raised after the loader is disposed.
              */
             set: function (callback) {
                 if (this._onDisposeObserver) {
@@ -207,7 +221,7 @@ var BABYLON;
         });
         Object.defineProperty(GLTFFileLoader.prototype, "onExtensionLoaded", {
             /**
-             * Raised after a loader extension is created. (onExtensionLoadedObservable is likely desired instead.)
+             * Callback raised after a loader extension is created.
              */
             set: function (callback) {
                 if (this._onExtensionLoadedObserver) {
@@ -220,7 +234,7 @@ var BABYLON;
         });
         /**
          * Returns a promise that resolves when the asset is completely loaded.
-         * @returns A promise that resolves when the asset is completely loaded.
+         * @returns a promise that resolves when the asset is completely loaded.
          */
         GLTFFileLoader.prototype.whenCompleteAsync = function () {
             var _this = this;
@@ -232,7 +246,7 @@ var BABYLON;
         };
         Object.defineProperty(GLTFFileLoader.prototype, "loaderState", {
             /**
-             * The loader state (LOADING, READY, COMPLETE) or null if the loader is not active.
+             * The loader state or null if the loader is not active.
              */
             get: function () {
                 return this._loader ? this._loader.state : null;
@@ -251,18 +265,21 @@ var BABYLON;
             this.onMeshLoadedObservable.clear();
             this.onTextureLoadedObservable.clear();
             this.onMaterialLoadedObservable.clear();
+            this.onCameraLoadedObservable.clear();
+            this.onCompleteObservable.clear();
+            this.onExtensionLoadedObservable.clear();
             this.onDisposeObservable.notifyObservers(this);
             this.onDisposeObservable.clear();
         };
         /**
-        * Imports one or more meshes from a loaded gltf file and adds them to the scene
-        * @param meshesNames a string or array of strings of the mesh names that should be loaded from the file
-        * @param scene the scene the meshes should be added to
-        * @param data gltf data containing information of the meshes in a loaded file
-        * @param rootUrl root url to load from
-        * @param onProgress event that fires when loading progress has occured
-        * @returns a promise containg the loaded meshes, particles, skeletons and animations
-        */
+         * Imports one or more meshes from the loaded glTF data and adds them to the scene
+         * @param meshesNames a string or array of strings of the mesh names that should be loaded from the file
+         * @param scene the scene the meshes should be added to
+         * @param data the glTF data to load
+         * @param rootUrl root url to load from
+         * @param onProgress event that fires when loading progress has occured
+         * @returns a promise containg the loaded meshes, particles, skeletons and animations
+         */
         GLTFFileLoader.prototype.importMeshAsync = function (meshesNames, scene, data, rootUrl, onProgress) {
             var _this = this;
             return Promise.resolve().then(function () {
@@ -272,13 +289,13 @@ var BABYLON;
             });
         };
         /**
-        * Imports all objects from a loaded gltf file and adds them to the scene
-        * @param scene the scene the objects should be added to
-        * @param data gltf data containing information of the meshes in a loaded file
-        * @param rootUrl root url to load from
-        * @param onProgress event that fires when loading progress has occured
-        * @returns a promise which completes when objects have been loaded to the scene
-        */
+         * Imports all objects from the loaded glTF data and adds them to the scene
+         * @param scene the scene the objects should be added to
+         * @param data the glTF data to load
+         * @param rootUrl root url to load from
+         * @param onProgress event that fires when loading progress has occured
+         * @returns a promise which completes when objects have been loaded to the scene
+         */
         GLTFFileLoader.prototype.loadAsync = function (scene, data, rootUrl, onProgress) {
             var _this = this;
             return Promise.resolve().then(function () {
@@ -312,7 +329,7 @@ var BABYLON;
             });
         };
         /**
-         * If the data string can be loaded directly
+         * If the data string can be loaded directly.
          * @param data string contianing the file data
          * @returns if the data can be loaded directly
          */
@@ -320,7 +337,7 @@ var BABYLON;
             return ((data.indexOf("scene") !== -1) && (data.indexOf("node") !== -1));
         };
         /**
-         * Instantiates a gltf file loader plugin
+         * Instantiates a glTF file loader plugin.
          * @returns the created plugin
          */
         GLTFFileLoader.prototype.createPlugin = function () {
@@ -375,11 +392,16 @@ var BABYLON;
             loader.onMeshLoadedObservable.add(function (mesh) { return _this.onMeshLoadedObservable.notifyObservers(mesh); });
             loader.onTextureLoadedObservable.add(function (texture) { return _this.onTextureLoadedObservable.notifyObservers(texture); });
             loader.onMaterialLoadedObservable.add(function (material) { return _this.onMaterialLoadedObservable.notifyObservers(material); });
-            loader.onExtensionLoadedObservable.add(function (extension) { return _this.onExtensionLoadedObservable.notifyObservers(extension); });
+            loader.onCameraLoadedObservable.add(function (camera) { return _this.onCameraLoadedObservable.notifyObservers(camera); });
+            loader.onExtensionLoadedObservable.add(function (extension) {
+                _this.onExtensionLoadedObservable.notifyObservers(extension);
+                _this.onExtensionLoadedObservable.clear();
+            });
             loader.onCompleteObservable.add(function () {
                 _this.onMeshLoadedObservable.clear();
                 _this.onTextureLoadedObservable.clear();
                 _this.onMaterialLoadedObservable.clear();
+                _this.onCameraLoadedObservable.clear();
                 _this.onCompleteObservable.notifyObservers(_this);
                 _this.onCompleteObservable.clear();
             });
@@ -507,11 +529,14 @@ var BABYLON;
         // #endregion
         // #region V1 options
         /**
-         * Set this property to false to disable incremental loading which delays the loader from calling the success callback until after loading the meshes and shaders. Textures always loads asynchronously. For example, the success callback can compute the bounding information of the loaded meshes when incremental loading is disabled. Defaults to true.
+         * Set this property to false to disable incremental loading which delays the loader from calling the success callback until after loading the meshes and shaders.
+         * Textures always loads asynchronously. For example, the success callback can compute the bounding information of the loaded meshes when incremental loading is disabled.
+         * Defaults to true.
          */
         GLTFFileLoader.IncrementalLoading = true;
         /**
-         * Set this property to true in order to work with homogeneous coordinates, available with some converters and exporters. Defaults to false. See https://en.wikipedia.org/wiki/Homogeneous_coordinates
+         * Set this property to true in order to work with homogeneous coordinates, available with some converters and exporters.
+         * Defaults to false. See https://en.wikipedia.org/wiki/Homogeneous_coordinates.
          */
         GLTFFileLoader.HomogeneousCoordinates = false;
         return GLTFFileLoader;
@@ -1381,7 +1406,7 @@ var BABYLON;
                 var camera = gltfRuntime.cameras[node.camera];
                 if (camera) {
                     if (camera.type === "orthographic") {
-                        var orthoCamera = new BABYLON.FreeCamera(node.camera, BABYLON.Vector3.Zero(), gltfRuntime.scene);
+                        var orthoCamera = new BABYLON.FreeCamera(node.camera, BABYLON.Vector3.Zero(), gltfRuntime.scene, false);
                         orthoCamera.name = node.name || "";
                         orthoCamera.mode = BABYLON.Camera.ORTHOGRAPHIC_CAMERA;
                         orthoCamera.attachControl(gltfRuntime.scene.getEngine().getRenderingCanvas());
@@ -1389,7 +1414,7 @@ var BABYLON;
                     }
                     else if (camera.type === "perspective") {
                         var perspectiveCamera = camera[camera.type];
-                        var persCamera = new BABYLON.FreeCamera(node.camera, BABYLON.Vector3.Zero(), gltfRuntime.scene);
+                        var persCamera = new BABYLON.FreeCamera(node.camera, BABYLON.Vector3.Zero(), gltfRuntime.scene, false);
                         persCamera.name = node.name || "";
                         persCamera.attachControl(gltfRuntime.scene.getEngine().getRenderingCanvas());
                         if (!perspectiveCamera.aspectRatio) {
@@ -1947,6 +1972,7 @@ var BABYLON;
                 this.onMeshLoadedObservable = new BABYLON.Observable();
                 this.onTextureLoadedObservable = new BABYLON.Observable();
                 this.onMaterialLoadedObservable = new BABYLON.Observable();
+                this.onCameraLoadedObservable = new BABYLON.Observable();
                 this.onCompleteObservable = new BABYLON.Observable();
                 this.onExtensionLoadedObservable = new BABYLON.Observable();
                 /**

dist/preview release/what's new.md

@@ -14,7 +14,7 @@
 - Added [GlowLayer](https://doc.babylonjs.com/how_to/glow_layer) to easily support glow from emissive materials. Demo [here](http://www.babylonjs.com/demos/GlowLayer/) ([sebavan](https://github.com/sebavan))
 - New [AssetContainer](http://doc.babylonjs.com/how_to/how_to_use_assetcontainer) class and loading methods ([trevordev](https://github.com/trevordev))
 - Added [depth of field](https://www.babylonjs-playground.com/frame.html#8F5HYV#9), [MSAA, sharpening, chromatic aberration and grain effect](https://www.babylonjs-playground.com/#Y3C0HQ#146) to the default pipeline ([trevordev](https://github.com/trevordev))
-- Added support for [animation weights](http://doc.babylonjs.com/babylon101/animations#animation-weights). Demo [here](https://www.babylonjs-playground.com/#IQN716#9) ([deltakosh](https://github.com/deltakosh))
+- Added support for [animation weights](http://doc.babylonjs.com/babylon101/animations#animation-weights). Demo [here](https://www.babylonjs-playground.com/#LL5BIQ) ([deltakosh](https://github.com/deltakosh))
 - Added [sub emitters for particle system](http://doc.babylonjs.com/babylon101/particles#sub-emitters) which will spawn new particle systems when particles dies. Demo [here](https://www.babylonjs-playground.com/frame.html#9NHBCC#1) ([IbraheemOsama](https://github.com/IbraheemOsama))
 - New [Babylon.js](http://doc.babylonjs.com/resources/maya) and [glTF](http://doc.babylonjs.com/resources/maya_to_gltf) exporter for Autodesk Maya ([Noalak](https://github.com/Noalak))
 - New glTF [serializer](https://github.com/BabylonJS/Babylon.js/tree/master/serializers/src/glTF/2.0). You can now export glTF or glb files directly from a Babylon scene ([kcoley](https://github.com/kcoley))
@@ -115,6 +115,9 @@
 - (Viewer) Viewer's declaration file automatically generated ([RaananW](https://github.com/RaananW))
 - New serialize and parse functions for effect layers (Highlight and Glow layers) ([julien-moreau](https://github.com/julien-moreau))
 - GUI: Introduced `MultiLine` which will draw lines between any number of meshes, controls and points. [Documentation](http://doc.babylonjs.com/how_to/gui#multiline) ([royibernthal](https://github.com/royibernthal))
+- Added alphaCutOff support for StandardMaterial ([deltakosh](https://github.com/deltakosh))
+- Add support for sparse accessors to glTF 2.0 loader. ([bghgary](https://github.com/bghgary))
+- Add support for cameras to glTF 2.0 loader. ([bghgary](https://github.com/bghgary)]
 
 ## Bug fixes
 

gui/readme.md

@@ -2,4 +2,5 @@
 The Babylon.js GUI library is an extension you can use to generate interactive user interface.
 It is build on top of the DynamicTexture.
 
-Documentation: http://doc.babylonjs.com/overviews/gui
+Documentation: http://doc.babylonjs.com/how_to/gui
+API: http://doc.babylonjs.com/api/modules/babylon.gui

gui/src/controls/control.ts

@@ -278,7 +278,7 @@ module BABYLON.GUI {
             this._fontSet = true;
         }
 
-        /** @ignore */
+        /** @hidden */
         public get _isFontSizeInPercentage(): boolean {
             return this._fontSize.isPercentage;
         }
@@ -493,7 +493,7 @@ module BABYLON.GUI {
             return "Control";
         }
 
-        /** @ignore */
+        /** @hidden */
         public _resetFontCache(): void {
             this._fontSet = true;
         }

gui/src/controls/textBlock.ts

@@ -224,7 +224,7 @@ module BABYLON.GUI {
             context.fillText(text, this._currentMeasure.left + x, y);
         }
 
-        /** @ignore */
+        /** @hidden */
         public _draw(parentMeasure: Measure, context: CanvasRenderingContext2D): void {
             context.save();
 

inspector/sass/defines.scss

@@ -20,5 +20,5 @@ $background-lighter2: lighten($color: $background-lighter, $amount : 5%);
 $background-lighter3: lighten($color: $background-lighter2, $amount: 5%);
 
 $resizebar-width    : 10px;
-$tabbar-height      : 32px;
+$tabbar-height      : 40px;
 $searchbar-height   : 30px;

loaders/src/glTF/1.0/babylon.glTFLoader.ts

@@ -885,7 +885,7 @@ module BABYLON.GLTF1 {
 
             if (camera) {
                 if (camera.type === "orthographic") {
-                    var orthoCamera = new FreeCamera(node.camera, Vector3.Zero(), gltfRuntime.scene);
+                    var orthoCamera = new FreeCamera(node.camera, Vector3.Zero(), gltfRuntime.scene, false);
 
                     orthoCamera.name = node.name || "";
                     orthoCamera.mode = Camera.ORTHOGRAPHIC_CAMERA;
@@ -895,7 +895,7 @@ module BABYLON.GLTF1 {
                 }
                 else if (camera.type === "perspective") {
                     var perspectiveCamera: IGLTFCameraPerspective = (<any>camera)[camera.type];
-                    var persCamera = new FreeCamera(node.camera, Vector3.Zero(), gltfRuntime.scene);
+                    var persCamera = new FreeCamera(node.camera, Vector3.Zero(), gltfRuntime.scene, false);
 
                     persCamera.name = node.name || "";
                     persCamera.attachControl(<HTMLElement>gltfRuntime.scene.getEngine().getRenderingCanvas());
@@ -1573,6 +1573,7 @@ module BABYLON.GLTF1 {
         public onMeshLoadedObservable = new Observable<AbstractMesh>();
         public onTextureLoadedObservable = new Observable<BaseTexture>();
         public onMaterialLoadedObservable = new Observable<Material>();
+        public onCameraLoadedObservable = new Observable<Camera>();
         public onCompleteObservable = new Observable<IGLTFLoader>();
         public onExtensionLoadedObservable = new Observable<IGLTFLoaderExtension>();
 

loaders/src/glTF/2.0/Extensions/KHR_draco_mesh_compression.ts

@@ -1,9 +1,6 @@
 /// <reference path="../../../../../dist/preview release/babylon.d.ts"/>
 
-/** Module defining extensions to gltf */
 module BABYLON.GLTF2.Extensions {
-    // https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_draco_mesh_compression
-
     const NAME = "KHR_draco_mesh_compression";
 
     interface IKHRDracoMeshCompression {
@@ -11,10 +8,13 @@ module BABYLON.GLTF2.Extensions {
         attributes: { [name: string]: number };
     }
 
-    interface ILoaderBufferViewDraco extends ILoaderBufferView {
+    interface ILoaderBufferViewDraco extends _ILoaderBufferView {
         _dracoBabylonGeometry?: Promise<Geometry>;
     }
 
+    /**
+     * [Specification](https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_draco_mesh_compression)
+     */
     export class KHR_draco_mesh_compression extends GLTFLoaderExtension {
         public readonly name = NAME;
 
@@ -37,7 +37,7 @@ module BABYLON.GLTF2.Extensions {
             super.dispose();
         }
 
-        protected _loadVertexDataAsync(context: string, primitive: ILoaderMeshPrimitive, babylonMesh: Mesh): Nullable<Promise<Geometry>> {
+        protected _loadVertexDataAsync(context: string, primitive: _ILoaderMeshPrimitive, babylonMesh: Mesh): Nullable<Promise<Geometry>> {
             return this._loadExtensionAsync<IKHRDracoMeshCompression, Geometry>(context, primitive, (extensionContext, extension) => {
                 if (primitive.mode != undefined) {
                     if (primitive.mode !== MeshPrimitiveMode.TRIANGLE_STRIP &&

loaders/src/glTF/2.0/Extensions/KHR_lights.ts

@@ -1,8 +1,6 @@
 /// <reference path="../../../../../dist/preview release/babylon.d.ts"/>
 
 module BABYLON.GLTF2.Extensions {
-    // https://github.com/MiiBond/glTF/tree/khr_lights_v1/extensions/Khronos/KHR_lights
-
     const NAME = "KHR_lights";
 
     enum LightType {
@@ -31,10 +29,13 @@ module BABYLON.GLTF2.Extensions {
         lights: ILight[];
     }
 
+    /**
+     * [Specification](https://github.com/MiiBond/glTF/tree/khr_lights_v1/extensions/Khronos/KHR_lights) (Experimental)
+     */
     export class KHR_lights extends GLTFLoaderExtension {
         public readonly name = NAME;
 
-        protected _loadSceneAsync(context: string, scene: ILoaderScene): Nullable<Promise<void>> { 
+        protected _loadSceneAsync(context: string, scene: _ILoaderScene): Nullable<Promise<void>> { 
             return this._loadExtensionAsync<ILightReference>(context, scene, (extensionContext, extension) => {
                 const promise = this._loader._loadSceneAsync(extensionContext, scene);
 
@@ -49,7 +50,7 @@ module BABYLON.GLTF2.Extensions {
             });
         }
 
-        protected _loadNodeAsync(context: string, node: ILoaderNode): Nullable<Promise<void>> { 
+        protected _loadNodeAsync(context: string, node: _ILoaderNode): Nullable<Promise<void>> { 
             return this._loadExtensionAsync<ILightReference>(context, node, (extensionContext, extension) => {
                 const promise = this._loader._loadNodeAsync(extensionContext, node);
 

loaders/src/glTF/2.0/Extensions/KHR_materials_pbrSpecularGlossiness.ts

@@ -1,8 +1,6 @@
 /// <reference path="../../../../../dist/preview release/babylon.d.ts"/>
 
 module BABYLON.GLTF2.Extensions {
-    // https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_pbrSpecularGlossiness
-
     const NAME = "KHR_materials_pbrSpecularGlossiness";
 
     interface IKHRMaterialsPbrSpecularGlossiness {
@@ -13,10 +11,13 @@ module BABYLON.GLTF2.Extensions {
         specularGlossinessTexture: ITextureInfo;
     }
 
+    /**
+     * [Specification](https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_pbrSpecularGlossiness)
+     */
     export class KHR_materials_pbrSpecularGlossiness extends GLTFLoaderExtension {
         public readonly name = NAME;
 
-        protected _loadMaterialAsync(context: string, material: ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
+        protected _loadMaterialAsync(context: string, material: _ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
             return this._loadExtensionAsync<IKHRMaterialsPbrSpecularGlossiness>(context, material, (extensionContext, extension) => {
                 material._babylonData = material._babylonData || {};
                 let babylonData = material._babylonData[babylonDrawMode];
@@ -47,7 +48,7 @@ module BABYLON.GLTF2.Extensions {
             });
         }
 
-        private _loadSpecularGlossinessPropertiesAsync(context: string, material: ILoaderMaterial, properties: IKHRMaterialsPbrSpecularGlossiness, babylonMaterial: PBRMaterial): Promise<void> {
+        private _loadSpecularGlossinessPropertiesAsync(context: string, material: _ILoaderMaterial, properties: IKHRMaterialsPbrSpecularGlossiness, babylonMaterial: PBRMaterial): Promise<void> {
             const promises = new Array<Promise<void>>();
 
             if (properties.diffuseFactor) {

loaders/src/glTF/2.0/Extensions/KHR_materials_unlit.ts

@@ -1,14 +1,15 @@
 /// <reference path="../../../../../dist/preview release/babylon.d.ts"/>
 
 module BABYLON.GLTF2.Extensions {
-    // https://github.com/donmccurdy/glTF/tree/feat-khr-materials-cmnConstant/extensions/2.0/Khronos/KHR_materials_unlit
-
     const NAME = "KHR_materials_unlit";
 
+    /**
+     * [Specification](https://github.com/donmccurdy/glTF/tree/feat-khr-materials-cmnConstant/extensions/2.0/Khronos/KHR_materials_unlit) (Experimental)
+     */
     export class KHR_materials_unlit extends GLTFLoaderExtension {
         public readonly name = NAME;
 
-        protected _loadMaterialAsync(context: string, material: ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
+        protected _loadMaterialAsync(context: string, material: _ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
             return this._loadExtensionAsync<{}>(context, material, () => {
                 material._babylonData = material._babylonData || {};
                 let babylonData = material._babylonData[babylonDrawMode];
@@ -37,7 +38,7 @@ module BABYLON.GLTF2.Extensions {
             });
         }
 
-        private _loadUnlitPropertiesAsync(context: string, material: ILoaderMaterial, babylonMaterial: PBRMaterial): Promise<void> {
+        private _loadUnlitPropertiesAsync(context: string, material: _ILoaderMaterial, babylonMaterial: PBRMaterial): Promise<void> {
             const promises = new Array<Promise<void>>();
 
             // Ensure metallic workflow

loaders/src/glTF/2.0/Extensions/MSFT_lod.ts

@@ -1,14 +1,15 @@
 /// <reference path="../../../../../dist/preview release/babylon.d.ts"/>
 
 module BABYLON.GLTF2.Extensions {
-    // https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/MSFT_lod
-
     const NAME = "MSFT_lod";
 
     interface IMSFTLOD {
         ids: number[];
     }
 
+    /**
+     * [Specification](https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/MSFT_lod)
+     */
     export class MSFT_lod extends GLTFLoaderExtension {
         public readonly name = NAME;
 
@@ -17,13 +18,13 @@ module BABYLON.GLTF2.Extensions {
          */
         public maxLODsToLoad = Number.MAX_VALUE;
 
-        private _loadingNodeLOD: Nullable<ILoaderNode> = null;
+        private _loadingNodeLOD: Nullable<_ILoaderNode> = null;
         private _loadNodeSignals: { [nodeIndex: number]: Deferred<void> } = {};
 
-        private _loadingMaterialLOD: Nullable<ILoaderMaterial> = null;
+        private _loadingMaterialLOD: Nullable<_ILoaderMaterial> = null;
         private _loadMaterialSignals: { [materialIndex: number]: Deferred<void> } = {};
 
-        protected _loadNodeAsync(context: string, node: ILoaderNode): Nullable<Promise<void>> {
+        protected _loadNodeAsync(context: string, node: _ILoaderNode): Nullable<Promise<void>> {
             return this._loadExtensionAsync<IMSFTLOD>(context, node, (extensionContext, extension) => {
                 let firstPromise: Promise<void>;
 
@@ -71,7 +72,7 @@ module BABYLON.GLTF2.Extensions {
             });
         }
 
-        protected _loadMaterialAsync(context: string, material: ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
+        protected _loadMaterialAsync(context: string, material: _ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
             // Don't load material LODs if already loading a node LOD.
             if (this._loadingNodeLOD) {
                 return null;

loaders/src/glTF/2.0/babylon.glTFLoaderExtension.ts

@@ -2,7 +2,7 @@
 
 module BABYLON.GLTF2 {
     /**
-     * Abstract class that can be implemented to extend existing gltf loader behavior.
+     * Abstract class that can be implemented to extend existing glTF loader behavior.
      */
     export abstract class GLTFLoaderExtension implements IGLTFLoaderExtension, IDisposable {
         public enabled = true;
@@ -21,16 +21,16 @@ module BABYLON.GLTF2 {
         // #region Overridable Methods
 
         /** Override this method to modify the default behavior for loading scenes. */
-        protected _loadSceneAsync(context: string, node: ILoaderScene): Nullable<Promise<void>> { return null; }
+        protected _loadSceneAsync(context: string, node: _ILoaderScene): Nullable<Promise<void>> { return null; }
 
         /** Override this method to modify the default behavior for loading nodes. */
-        protected _loadNodeAsync(context: string, node: ILoaderNode): Nullable<Promise<void>> { return null; }
+        protected _loadNodeAsync(context: string, node: _ILoaderNode): Nullable<Promise<void>> { return null; }
 
         /** Override this method to modify the default behavior for loading mesh primitive vertex data. */
-        protected _loadVertexDataAsync(context: string, primitive: ILoaderMeshPrimitive, babylonMesh: Mesh): Nullable<Promise<Geometry>> { return null; }
+        protected _loadVertexDataAsync(context: string, primitive: _ILoaderMeshPrimitive, babylonMesh: Mesh): Nullable<Promise<Geometry>> { return null; }
 
         /** Override this method to modify the default behavior for loading materials. */
-        protected _loadMaterialAsync(context: string, material: ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> { return null; }
+        protected _loadMaterialAsync(context: string, material: _ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> { return null; }
 
         /** Override this method to modify the default behavior for loading uris. */
         protected _loadUriAsync(context: string, uri: string): Nullable<Promise<ArrayBufferView>> { return null; }
@@ -63,22 +63,22 @@ module BABYLON.GLTF2 {
         }
 
         /** Helper method called by the loader to allow extensions to override loading scenes. */
-        public static _LoadSceneAsync(loader: GLTFLoader, context: string, scene: ILoaderScene): Nullable<Promise<void>> {
+        public static _LoadSceneAsync(loader: GLTFLoader, context: string, scene: _ILoaderScene): Nullable<Promise<void>> {
             return loader._applyExtensions(extension => extension._loadSceneAsync(context, scene));
         }
 
         /** Helper method called by the loader to allow extensions to override loading nodes. */
-        public static _LoadNodeAsync(loader: GLTFLoader, context: string, node: ILoaderNode): Nullable<Promise<void>> {
+        public static _LoadNodeAsync(loader: GLTFLoader, context: string, node: _ILoaderNode): Nullable<Promise<void>> {
             return loader._applyExtensions(extension => extension._loadNodeAsync(context, node));
         }
 
         /** Helper method called by the loader to allow extensions to override loading mesh primitive vertex data. */
-        public static _LoadVertexDataAsync(loader: GLTFLoader, context: string, primitive: ILoaderMeshPrimitive, babylonMesh: Mesh): Nullable<Promise<Geometry>> {
+        public static _LoadVertexDataAsync(loader: GLTFLoader, context: string, primitive: _ILoaderMeshPrimitive, babylonMesh: Mesh): Nullable<Promise<Geometry>> {
             return loader._applyExtensions(extension => extension._loadVertexDataAsync(context, primitive, babylonMesh));
         }
 
         /** Helper method called by the loader to allow extensions to override loading materials. */
-        public static _LoadMaterialAsync(loader: GLTFLoader, context: string, material: ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
+        public static _LoadMaterialAsync(loader: GLTFLoader, context: string, material: _ILoaderMaterial, babylonMesh: Mesh, babylonDrawMode: number, assign: (babylonMaterial: Material) => void): Nullable<Promise<void>> {
             return loader._applyExtensions(extension => extension._loadMaterialAsync(context, material, babylonMesh, babylonDrawMode, assign));
         }
 
@@ -87,4 +87,10 @@ module BABYLON.GLTF2 {
             return loader._applyExtensions(extension => extension._loadUriAsync(context, uri));
         }
     }
+}
+
+/**
+ * Defines the module of the glTF 2.0 loader extensions.
+ */
+module BABYLON.GLTF2.Extensions {
 }

loaders/src/glTF/2.0/babylon.glTFLoaderInterfaces.ts

@@ -1,82 +1,59 @@
 /// <reference path="../../../../dist/preview release/babylon.d.ts"/>
 /// <reference path="../../../../dist/babylon.glTF2Interface.d.ts"/>
 
-/**
- * GLTF2 module for babylon
- */
 module BABYLON.GLTF2 {
-    /**
-     * Interface to access data and vertex buffer associated with a file
-     */
-    export interface ILoaderAccessor extends IAccessor, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderAccessor extends IAccessor, _IArrayItem {
         _data?: Promise<ArrayBufferView>;
         _babylonVertexBuffer?: Promise<VertexBuffer>;
     }
 
-    /**
-     * Loader's animation channel
-     */
-    export interface ILoaderAnimationChannel extends IAnimationChannel, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderAnimationChannel extends IAnimationChannel, _IArrayItem {
     }
 
-    /**
-     * Container for animation keyframe data
-     */
-    export interface ILoaderAnimationSamplerData {
+    /** @hidden */
+    export interface _ILoaderAnimationSamplerData {
         input: Float32Array;
         interpolation: AnimationSamplerInterpolation;
         output: Float32Array;
     }
 
-    /**
-     * Keyframe data
-     */
-    export interface ILoaderAnimationSampler extends IAnimationSampler, IArrayItem {
-        _data: Promise<ILoaderAnimationSamplerData>;
+    /** @hidden */
+    export interface _ILoaderAnimationSampler extends IAnimationSampler, _IArrayItem {
+        _data: Promise<_ILoaderAnimationSamplerData>;
     }
 
-    /**
-     * Loader animation
-     */
-    export interface ILoaderAnimation extends IAnimation, IArrayItem {
-        channels: ILoaderAnimationChannel[];
-        samplers: ILoaderAnimationSampler[];
+    /** @hidden */
+    export interface _ILoaderAnimation extends IAnimation, _IArrayItem {
+        channels: _ILoaderAnimationChannel[];
+        samplers: _ILoaderAnimationSampler[];
 
         _babylonAnimationGroup?: AnimationGroup;
     }
 
-    /**
-     * Loader buffer
-     */
-    export interface ILoaderBuffer extends IBuffer, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderBuffer extends IBuffer, _IArrayItem {
         _data?: Promise<ArrayBufferView>;
     }
 
-    /**
-     * Loader's buffer data
-     */
-    export interface ILoaderBufferView extends IBufferView, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderBufferView extends IBufferView, _IArrayItem {
         _data?: Promise<ArrayBufferView>;
         _babylonBuffer?: Promise<Buffer>;
     }
 
-    /**
-     * Loader's loaded camera data
-     */
-    export interface ILoaderCamera extends ICamera, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderCamera extends ICamera, _IArrayItem {
     }
 
-    /**
-     * Loaded image specified by url
-     */
-    export interface ILoaderImage extends IImage, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderImage extends IImage, _IArrayItem {
         _objectURL?: Promise<string>;
     }
 
-    /**
-     * Loaded material data
-     */
-    export interface ILoaderMaterial extends IMaterial, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderMaterial extends IMaterial, _IArrayItem {
         _babylonData?: {
             [drawMode: number]: {
                 material: Material;
@@ -86,83 +63,65 @@ module BABYLON.GLTF2 {
         };
     }
 
-    /**
-     * Loader mesh data
-     */
-    export interface ILoaderMesh extends IMesh, IArrayItem {
-        primitives: ILoaderMeshPrimitive[];
+    /** @hidden */
+    export interface _ILoaderMesh extends IMesh, _IArrayItem {
+        primitives: _ILoaderMeshPrimitive[];
     }
 
-    /**
-     * Loader mesh data
-     */
-    export interface ILoaderMeshPrimitive extends IMeshPrimitive, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderMeshPrimitive extends IMeshPrimitive, _IArrayItem {
     }
 
-    /**
-     * Node for traversing loader data
-     */
-    export interface ILoaderNode extends INode, IArrayItem {
-        _parent: ILoaderNode;
+    /** @hidden */
+    export interface _ILoaderNode extends INode, _IArrayItem {
+        _parent: _ILoaderNode;
         _babylonMesh?: Mesh;
         _primitiveBabylonMeshes?: Mesh[];
         _babylonAnimationTargets?: Node[];
         _numMorphTargets?: number;
     }
 
-    /**
-     * Sampler data
-     */
-    export interface ILoaderSamplerData {
+    /** @hidden */
+    export interface _ILoaderSamplerData {
         noMipMaps: boolean;
         samplingMode: number;
         wrapU: number;
         wrapV: number;
     }
 
-    /**
-     * Sampler data
-     */
-    export interface ILoaderSampler extends ISampler, IArrayItem {
-        _data?: ILoaderSamplerData;
+    /** @hidden */
+    export interface _ILoaderSampler extends ISampler, _IArrayItem {
+        _data?: _ILoaderSamplerData;
     }
 
-    /**
-     * Loader's scene
-     */
-    export interface ILoaderScene extends IScene, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderScene extends IScene, _IArrayItem {
     }
 
-    /**
-     * Loader's skeleton data
-     */
-    export interface ILoaderSkin extends ISkin, IArrayItem {
+    /** @hidden */
+    export interface _ILoaderSkin extends ISkin, _IArrayItem {
         _babylonSkeleton?: Skeleton;
         _loaded?: Promise<void>;
     }
 
-    /**
-     * Loader's texture
-     */
-    export interface ILoaderTexture extends ITexture, IArrayItem {
-    }
-
-    /**
-     * Loaded GLTF data
-     */
-    export interface ILoaderGLTF extends IGLTF {
-        accessors?: ILoaderAccessor[];
-        animations?: ILoaderAnimation[];
-        buffers?: ILoaderBuffer[];
-        bufferViews?: ILoaderBufferView[];
-        cameras?: ILoaderCamera[];
-        images?: ILoaderImage[];
-        materials?: ILoaderMaterial[];
-        meshes?: ILoaderMesh[];
-        nodes?: ILoaderNode[];
-        samplers?: ILoaderSampler[];
-        scenes?: ILoaderScene[];
-        skins?: ILoaderSkin[];
-        textures?: ILoaderTexture[];
+    /** @hidden */
+    export interface _ILoaderTexture extends ITexture, _IArrayItem {
+    }
+
+    /** @hidden */
+    export interface _ILoaderGLTF extends IGLTF {
+        accessors?: _ILoaderAccessor[];
+        animations?: _ILoaderAnimation[];
+        buffers?: _ILoaderBuffer[];
+        bufferViews?: _ILoaderBufferView[];
+        cameras?: _ILoaderCamera[];
+        images?: _ILoaderImage[];
+        materials?: _ILoaderMaterial[];
+        meshes?: _ILoaderMesh[];
+        nodes?: _ILoaderNode[];
+        samplers?: _ILoaderSampler[];
+        scenes?: _ILoaderScene[];
+        skins?: _ILoaderSkin[];
+        textures?: _ILoaderTexture[];
     }
 }

loaders/src/glTF/2.0/babylon.glTFLoaderUtilities.ts

@@ -1,14 +1,15 @@
 /// <reference path="../../../../dist/preview release/babylon.d.ts"/>
 
 module BABYLON.GLTF2 {
-    /** Array item which contains it's index in an array */
-    export interface IArrayItem {
+    /** @hidden */
+    export interface _IArrayItem {
         _index: number;
     }
-    /** Array item helper methods */
-    export class ArrayItem {
-        /** Sets the index of each array element to its index in the array */
-        public static Assign(values?: IArrayItem[]): void {
+
+    /** @hidden */
+    export class _ArrayItem {
+        /** @hidden */
+        public static Assign(values?: _IArrayItem[]): void {
             if (values) {
                 for (let index = 0; index < values.length; index++) {
                     values[index]._index = index;

loaders/src/glTF/babylon.glTFFileLoader.ts

@@ -2,8 +2,8 @@
 
 module BABYLON {
     /**
-    * Coordinate system mode that will be used when loading from the gltf file
-    */
+     * Mode that determines the coordinate system to use.
+     */
     export enum GLTFLoaderCoordinateSystemMode {
         /**
          * Automatically convert the glTF right-handed data to the appropriate system based on the current coordinate system mode of the scene.
@@ -17,8 +17,8 @@ module BABYLON {
     }
 
     /**
-    * Animation mode that determines which animations should be started when a file is loaded
-    */
+     * Mode that determines what animations will start.
+     */
     export enum GLTFLoaderAnimationStartMode {
         /**
          * No animation will start.
@@ -37,22 +37,23 @@ module BABYLON {
     }
 
     /**
-    * Loaded gltf data
-    */
+     * Interface that contains the data for the glTF asset.
+     */
     export interface IGLTFLoaderData {
         /**
-        * Loaded json string converted to an object
-        */
+         * JSON that represents the glTF.
+         */
         json: Object;
+
         /**
-        * Loaded ArrayBufferView
-        */
+         * The BIN chunk of a binary glTF
+         */
         bin: Nullable<ArrayBufferView>;
     }
 
     /**
-    * Gltf extension interface
-    */
+     * Interface for extending the loader.
+     */
     export interface IGLTFLoaderExtension {
         /**
          * The name of this extension.
@@ -60,14 +61,14 @@ module BABYLON {
         readonly name: string;
 
         /**
-         * Whether this extension is enabled.
+         * Defines whether this extension is enabled.
          */
         enabled: boolean;
     }
 
     /**
-    * Loading state
-    */
+     * Loader state.
+     */
     export enum GLTFLoaderState {
         /**
          * The asset is loading.
@@ -86,87 +87,114 @@ module BABYLON {
     }
 
     /**
-    * GLTF loader interface
-    */
+     * Loader interface.
+     */
     export interface IGLTFLoader extends IDisposable {
         /**
-        * Coordinate system that will be used when loading from the gltf file
-        */
+         * Mode that determines the coordinate system to use.
+         */
         coordinateSystemMode: GLTFLoaderCoordinateSystemMode;
+
         /**
-        * Animation mode that determines which animations should be started when a file is loaded
-        */
+         * Mode that determines what animations will start.
+         */
         animationStartMode: GLTFLoaderAnimationStartMode;
+
         /**
-        * If the materials in the file should automatically be compiled
-        */
+         * Defines if the loader should compile materials.
+         */
         compileMaterials: boolean;
+
         /**
-        * If a clip plane should be usede when loading meshes in the file
-        */
+         * Defines if the loader should also compile materials with clip planes.
+         */
         useClipPlane: boolean;
+
         /**
-        * If shadow generators should automatically be compiled
-        */
+         * Defines if the loader should compile shadow generators.
+         */
         compileShadowGenerators: boolean;
 
         /**
-        * Observable that fires each time a mesh is loaded
-        */
+         * Observable raised when the loader creates a mesh after parsing the glTF properties of the mesh.
+         */
         onMeshLoadedObservable: Observable<AbstractMesh>;
+
         /**
-        * Observable that fires each time a texture is loaded
-        */
+         * Observable raised when the loader creates a texture after parsing the glTF properties of the texture.
+         */
         onTextureLoadedObservable: Observable<BaseTexture>;
-         /**
-        * Observable that fires each time a material is loaded
-        */
+
+        /**
+         * Observable raised when the loader creates a material after parsing the glTF properties of the material.
+         */
         onMaterialLoadedObservable: Observable<Material>;
+
         /**
-        * Observable that fires when the load has completed
-        */
+         * Observable raised when the loader creates a camera after parsing the glTF properties of the camera.
+         */
+        onCameraLoadedObservable: Observable<Camera>;
+
+        /**
+         * Observable raised when the asset is completely loaded, immediately before the loader is disposed.
+         * For assets with LODs, raised when all of the LODs are complete.
+         * For assets without LODs, raised when the model is complete, immediately after the loader resolves the returned promise.
+         */
         onCompleteObservable: Observable<IGLTFLoader>;
+
         /**
-        * Observable that fires when the loader is disposed
-        */
+         * Observable raised after the loader is disposed.
+         */
         onDisposeObservable: Observable<IGLTFLoader>;
+
         /**
-        * Observable that fire when an extension is loaded
-        */
+         * Observable raised after a loader extension is created.
+         * Set additional options for a loader extension in this event.
+         */
         onExtensionLoadedObservable: Observable<IGLTFLoaderExtension>;
 
         /**
-        * Loader state
-        */
+         * Loader state or null if the loader is not active.
+         */
         state: Nullable<GLTFLoaderState>;
 
         /**
-        * Imports one or more meshes from a loaded gltf file and adds them to the scene
-        */
+         * Imports meshes from the given data and adds them to the scene.
+         */
         importMeshAsync: (meshesNames: any, scene: Scene, data: IGLTFLoaderData, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void) => Promise<{ meshes: AbstractMesh[], particleSystems: ParticleSystem[], skeletons: Skeleton[], animationGroups: AnimationGroup[] }>;
+
         /**
-        * Imports all objects from a loaded gltf file and adds them to the scene
-        */
+         * Loads all objects from the given data and adds them to the scene.
+         */
         loadAsync: (scene: Scene, data: IGLTFLoaderData, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void) => Promise<void>;
     }
-    /** File loader to load gltf files into a babylon scene */
+
+    /**
+     * File loader for loading glTF files into a scene.
+     */
     export class GLTFFileLoader implements IDisposable, ISceneLoaderPluginAsync, ISceneLoaderPluginFactory {
-        /** Creates a gltf 1.0 file loader */
+        /**
+         * Factory function that creates a glTF 1.0 loader
+         */
         public static CreateGLTFLoaderV1: () => IGLTFLoader;
-        /** Creates a gltf 2.0 file loader */
+
+        /**
+         * Factory function that creates a glTF 2.0 loader
+         */
         public static CreateGLTFLoaderV2: () => IGLTFLoader;
 
         // #region Common options
 
         /**
-         * Raised when the asset has been parsed.
-         * The data.json property stores the glTF JSON.
-         * The data.bin property stores the BIN chunk from a glTF binary or null if the input is not a glTF binary.
+         * Raised when the asset has been parsed
          */
         public onParsedObservable = new Observable<IGLTFLoaderData>();
 
         private _onParsedObserver: Nullable<Observer<IGLTFLoaderData>>;
-        /** Raised when the asset has been parsed. */
+
+        /**
+         * Raised when the asset has been parsed
+         */
         public set onParsed(callback: (loaderData: IGLTFLoaderData) => void) {
             if (this._onParsedObserver) {
                 this.onParsedObservable.remove(this._onParsedObserver);
@@ -177,13 +205,17 @@ module BABYLON {
         // #endregion
 
         // #region V1 options
+
         /**
-         * Set this property to false to disable incremental loading which delays the loader from calling the success callback until after loading the meshes and shaders. Textures always loads asynchronously. For example, the success callback can compute the bounding information of the loaded meshes when incremental loading is disabled. Defaults to true.
+         * Set this property to false to disable incremental loading which delays the loader from calling the success callback until after loading the meshes and shaders.
+         * Textures always loads asynchronously. For example, the success callback can compute the bounding information of the loaded meshes when incremental loading is disabled.
+         * Defaults to true.
          */
         public static IncrementalLoading = true;
 
         /**
-         * Set this property to true in order to work with homogeneous coordinates, available with some converters and exporters. Defaults to false. See https://en.wikipedia.org/wiki/Homogeneous_coordinates
+         * Set this property to true in order to work with homogeneous coordinates, available with some converters and exporters.
+         * Defaults to false. See https://en.wikipedia.org/wiki/Homogeneous_coordinates.
          */
         public static HomogeneousCoordinates = false;
 
@@ -192,43 +224,39 @@ module BABYLON {
         // #region V2 options
 
         /**
-         * The coordinate system mode (AUTO, FORCE_RIGHT_HANDED). Defaults to AUTO.
-         * - AUTO - Automatically convert the glTF right-handed data to the appropriate system based on the current coordinate system mode of the scene.
-         * - FORCE_RIGHT_HANDED - Sets the useRightHandedSystem flag on the scene.
+         * The coordinate system mode. Defaults to AUTO.
          */
         public coordinateSystemMode = GLTFLoaderCoordinateSystemMode.AUTO;
 
         /**
-        * The animation start mode (NONE, FIRST, ALL). Defaults to FIRST.
-        * - NONE - No animation will start.
-        * - FIRST - The first animation will start.
-        * - ALL - All animations will start.
+        * The animation start mode. Defaults to FIRST.
         */
         public animationStartMode = GLTFLoaderAnimationStartMode.FIRST;
 
         /**
-         * Set to true to compile materials before raising the success callback. Defaults to false.
+         * Defines if the loader should compile materials before raising the success callback. Defaults to false.
          */
         public compileMaterials = false;
 
         /**
-         * Set to true to also compile materials with clip planes. Defaults to false.
+         * Defines if the loader should also compile materials with clip planes. Defaults to false.
          */
         public useClipPlane = false;
 
         /**
-         * Set to true to compile shadow generators before raising the success callback. Defaults to false.
+         * Defines if the loader should compile shadow generators before raising the success callback. Defaults to false.
          */
         public compileShadowGenerators = false;
 
         /**
-         * Raised when the loader creates a mesh after parsing the glTF properties of the mesh.
+         * Observable raised when the loader creates a mesh after parsing the glTF properties of the mesh.
          */
         public readonly onMeshLoadedObservable = new Observable<AbstractMesh>();
 
         private _onMeshLoadedObserver: Nullable<Observer<AbstractMesh>>;
+
         /**
-         * Raised when the loader creates a mesh after parsing the glTF properties of the mesh. (onMeshLoadedObservable is likely desired instead.)
+         * Callback raised when the loader creates a mesh after parsing the glTF properties of the mesh.
          */
         public set onMeshLoaded(callback: (mesh: AbstractMesh) => void) {
             if (this._onMeshLoadedObserver) {
@@ -238,13 +266,14 @@ module BABYLON {
         }
 
         /**
-         * Raised when the loader creates a texture after parsing the glTF properties of the texture.
+         * Observable raised when the loader creates a texture after parsing the glTF properties of the texture.
          */
         public readonly onTextureLoadedObservable = new Observable<BaseTexture>();
 
         private _onTextureLoadedObserver: Nullable<Observer<BaseTexture>>;
+
         /**
-         * Method called when a texture has been loaded (onTextureLoadedObservable is likely desired instead.)
+         * Callback raised when the loader creates a texture after parsing the glTF properties of the texture.
          */
         public set onTextureLoaded(callback: (texture: BaseTexture) => void) {
             if (this._onTextureLoadedObserver) {
@@ -254,13 +283,14 @@ module BABYLON {
         }
 
         /**
-         * Raised when the loader creates a material after parsing the glTF properties of the material.
+         * Observable raised when the loader creates a material after parsing the glTF properties of the material.
          */
         public readonly onMaterialLoadedObservable = new Observable<Material>();
 
         private _onMaterialLoadedObserver: Nullable<Observer<Material>>;
+
         /**
-         * Method when the loader creates a material after parsing the glTF properties of the material. (onMaterialLoadedObservable is likely desired instead.)
+         * Callback raised when the loader creates a material after parsing the glTF properties of the material.
          */
         public set onMaterialLoaded(callback: (material: Material) => void) {
             if (this._onMaterialLoadedObserver) {
@@ -270,15 +300,33 @@ module BABYLON {
         }
 
         /**
-         * Raised when the asset is completely loaded, immediately before the loader is disposed.
+         * Observable raised when the loader creates a camera after parsing the glTF properties of the camera.
+         */
+        public readonly onCameraLoadedObservable = new Observable<Camera>();
+
+        private _onCameraLoadedObserver: Nullable<Observer<Camera>>;
+
+        /**
+         * Callback raised when the loader creates a camera after parsing the glTF properties of the camera.
+         */
+        public set onCameraLoaded(callback: (camera: Camera) => void) {
+            if (this._onCameraLoadedObserver) {
+                this.onCameraLoadedObservable.remove(this._onCameraLoadedObserver);
+            }
+            this._onCameraLoadedObserver = this.onCameraLoadedObservable.add(callback);
+        }
+
+        /**
+         * Observable raised when the asset is completely loaded, immediately before the loader is disposed.
          * For assets with LODs, raised when all of the LODs are complete.
          * For assets without LODs, raised when the model is complete, immediately after the loader resolves the returned promise.
          */
         public readonly onCompleteObservable = new Observable<GLTFFileLoader>();
 
         private _onCompleteObserver: Nullable<Observer<GLTFFileLoader>>;
+
         /**
-         * Raised when the asset is completely loaded, immediately before the loader is disposed. (onCompleteObservable is likely desired instead.)
+         * Callback raised when the asset is completely loaded, immediately before the loader is disposed.
          */
         public set onComplete(callback: () => void) {
             if (this._onCompleteObserver) {
@@ -288,13 +336,14 @@ module BABYLON {
         }
 
         /**
-        * Raised after the loader is disposed.
-        */
+         * Observable raised after the loader is disposed.
+         */
         public readonly onDisposeObservable = new Observable<GLTFFileLoader>();
 
         private _onDisposeObserver: Nullable<Observer<GLTFFileLoader>>;
+
         /**
-         * Raised after the loader is disposed. (onDisposeObservable is likely desired instead.)
+         * Callback raised after the loader is disposed.
          */
         public set onDispose(callback: () => void) {
             if (this._onDisposeObserver) {
@@ -304,14 +353,15 @@ module BABYLON {
         }
 
         /**
-         * Raised after a loader extension is created.
+         * Observable raised after a loader extension is created.
          * Set additional options for a loader extension in this event.
          */
         public readonly onExtensionLoadedObservable = new Observable<IGLTFLoaderExtension>();
 
         private _onExtensionLoadedObserver: Nullable<Observer<IGLTFLoaderExtension>>;
+
         /**
-         * Raised after a loader extension is created. (onExtensionLoadedObservable is likely desired instead.)
+         * Callback raised after a loader extension is created.
          */
         public set onExtensionLoaded(callback: (extension: IGLTFLoaderExtension) => void) {
             if (this._onExtensionLoadedObserver) {
@@ -322,7 +372,7 @@ module BABYLON {
 
         /**
          * Returns a promise that resolves when the asset is completely loaded.
-         * @returns A promise that resolves when the asset is completely loaded.
+         * @returns a promise that resolves when the asset is completely loaded.
          */
         public whenCompleteAsync(): Promise<void> {
             return new Promise(resolve => {
@@ -333,7 +383,7 @@ module BABYLON {
         }
 
         /**
-         * The loader state (LOADING, READY, COMPLETE) or null if the loader is not active.
+         * The loader state or null if the loader is not active.
          */
         public get loaderState(): Nullable<GLTFLoaderState> {
             return this._loader ? this._loader.state : null;
@@ -368,20 +418,23 @@ module BABYLON {
             this.onMeshLoadedObservable.clear();
             this.onTextureLoadedObservable.clear();
             this.onMaterialLoadedObservable.clear();
+            this.onCameraLoadedObservable.clear();
+            this.onCompleteObservable.clear();
+            this.onExtensionLoadedObservable.clear();
 
             this.onDisposeObservable.notifyObservers(this);
             this.onDisposeObservable.clear();
         }
 
         /**
-        * Imports one or more meshes from a loaded gltf file and adds them to the scene
-        * @param meshesNames a string or array of strings of the mesh names that should be loaded from the file
-        * @param scene the scene the meshes should be added to
-        * @param data gltf data containing information of the meshes in a loaded file
-        * @param rootUrl root url to load from
-        * @param onProgress event that fires when loading progress has occured
-        * @returns a promise containg the loaded meshes, particles, skeletons and animations
-        */
+         * Imports one or more meshes from the loaded glTF data and adds them to the scene
+         * @param meshesNames a string or array of strings of the mesh names that should be loaded from the file
+         * @param scene the scene the meshes should be added to
+         * @param data the glTF data to load
+         * @param rootUrl root url to load from
+         * @param onProgress event that fires when loading progress has occured
+         * @returns a promise containg the loaded meshes, particles, skeletons and animations
+         */
         public importMeshAsync(meshesNames: any, scene: Scene, data: any, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void): Promise<{ meshes: AbstractMesh[], particleSystems: ParticleSystem[], skeletons: Skeleton[], animationGroups: AnimationGroup[] }> {
             return Promise.resolve().then(() => {
                 const loaderData = this._parse(data);
@@ -391,13 +444,13 @@ module BABYLON {
         }
 
         /**
-        * Imports all objects from a loaded gltf file and adds them to the scene
-        * @param scene the scene the objects should be added to
-        * @param data gltf data containing information of the meshes in a loaded file
-        * @param rootUrl root url to load from
-        * @param onProgress event that fires when loading progress has occured
-        * @returns a promise which completes when objects have been loaded to the scene
-        */
+         * Imports all objects from the loaded glTF data and adds them to the scene
+         * @param scene the scene the objects should be added to
+         * @param data the glTF data to load
+         * @param rootUrl root url to load from
+         * @param onProgress event that fires when loading progress has occured
+         * @returns a promise which completes when objects have been loaded to the scene
+         */
         public loadAsync(scene: Scene, data: string | ArrayBuffer, rootUrl: string, onProgress?: (event: SceneLoaderProgressEvent) => void): Promise<void> {
             return Promise.resolve().then(() => {
                 const loaderData = this._parse(data);
@@ -431,7 +484,7 @@ module BABYLON {
         }
 
         /**
-         * If the data string can be loaded directly
+         * If the data string can be loaded directly.
          * @param data string contianing the file data
          * @returns if the data can be loaded directly
          */
@@ -440,12 +493,12 @@ module BABYLON {
         }
 
         /**
-         * Rewrites a url by combining a root url and response url
+         * Rewrites a url by combining a root url and response url.
          */
         public rewriteRootURL: (rootUrl: string, responseURL?: string) => string;
 
         /**
-         * Instantiates a gltf file loader plugin
+         * Instantiates a glTF file loader plugin.
          * @returns the created plugin
          */
         public createPlugin(): ISceneLoaderPlugin | ISceneLoaderPluginAsync {
@@ -510,12 +563,18 @@ module BABYLON {
             loader.onMeshLoadedObservable.add(mesh => this.onMeshLoadedObservable.notifyObservers(mesh));
             loader.onTextureLoadedObservable.add(texture => this.onTextureLoadedObservable.notifyObservers(texture));
             loader.onMaterialLoadedObservable.add(material => this.onMaterialLoadedObservable.notifyObservers(material));
-            loader.onExtensionLoadedObservable.add(extension => this.onExtensionLoadedObservable.notifyObservers(extension));
+            loader.onCameraLoadedObservable.add(camera => this.onCameraLoadedObservable.notifyObservers(camera));
+
+            loader.onExtensionLoadedObservable.add(extension => {
+                this.onExtensionLoadedObservable.notifyObservers(extension);
+                this.onExtensionLoadedObservable.clear();
+            });
 
             loader.onCompleteObservable.add(() => {
                 this.onMeshLoadedObservable.clear();
                 this.onTextureLoadedObservable.clear();
                 this.onMaterialLoadedObservable.clear();
+                this.onCameraLoadedObservable.clear();
 
                 this.onCompleteObservable.notifyObservers(this);
                 this.onCompleteObservable.clear();

sandbox/index.js

@@ -92,11 +92,6 @@ if (BABYLON.Engine.isSupported()) {
         // Fix for IE, otherwise it will change the default filter for files selection after first use
         htmlInput.value = "";
 
-        // removing glTF created camera
-        if (currentScene.activeCamera && currentPluginName === "gltf") {
-            currentScene.activeCamera.dispose();
-            currentScene.activeCamera = null;
-        }
         // Attach camera to canvas inputs
         if (!currentScene.activeCamera || currentScene.lights.length === 0) {
             currentScene.createDefaultCameraOrLight(true);
@@ -265,7 +260,7 @@ if (BABYLON.Engine.isSupported()) {
 
     window.addEventListener("keydown", function (evt) {
         // Press Esc to toggle footer
-        if (evt.keyCode === 27) {
+        if (evt.keyCode === 27 &&!enableDebugLayer) {
             if (footer.style.display === "none") {
                 footer.style.display = "block";
             }

serializers/src/glTF/2.0/babylon.glTFAnimation.ts

@@ -0,0 +1,710 @@
+/// <reference path="../../../../dist/babylon.glTF2Interface.d.ts"/>
+
+module BABYLON.GLTF2 {
+    /**
+     * @hidden
+     * Interface to store animation data.
+     */
+    export interface _IAnimationData {
+        /**
+         * Keyframe data.
+         */
+        inputs: number[],
+        /**
+         * Value data.
+         */
+        outputs: number[][],
+        /**
+         * Animation interpolation data.
+         */
+        samplerInterpolation: AnimationSamplerInterpolation,
+        /**
+         * Minimum keyframe value.
+         */
+        inputsMin: number,
+        /**
+         * Maximum keyframe value.
+         */
+        inputsMax: number,
+    }
+
+    /**
+     * @hidden
+     */
+    export interface _IAnimationInfo {
+        /**
+         * The target channel for the animation
+         */
+        animationChannelTargetPath: AnimationChannelTargetPath,
+        /**
+         * The glTF accessor type for the data.
+         */
+        dataAccessorType: AccessorType.VEC3 | AccessorType.VEC4,
+        /**
+         * Specifies if quaternions should be used.
+         */
+        useQuaternion: boolean
+    }
+
+    /**
+     * @hidden
+     * Enum for handling in tangent and out tangent.
+     */
+    enum _TangentType {
+        /**
+         * Specifies that input tangents are used.
+         */
+        INTANGENT,
+        /**
+         * Specifies that output tangents are used.
+         */
+        OUTTANGENT
+    }
+    /**
+     * @hidden
+     * Utility class for generating glTF animation data from BabylonJS.
+     */
+    export class _GLTFAnimation {
+        /**
+         * 
+         * Creates glTF channel animation from BabylonJS animation.
+         * @param babylonMesh - BabylonJS mesh.
+         * @param animation - animation.
+         * @param animationChannelTargetPath - The target animation channel. 
+         * @param convertToRightHandedSystem - Specifies if the values should be converted to right-handed.
+         * @param useQuaternion - Specifies if quaternions are used.
+         * @returns nullable IAnimationData
+         */
+        public static _CreateNodeAnimation(babylonMesh: BABYLON.Mesh, animation: Animation, animationChannelTargetPath: AnimationChannelTargetPath, convertToRightHandedSystem: boolean, useQuaternion: boolean, animationSampleRate: number): Nullable<_IAnimationData> {
+            const inputs: number[] = [];
+            const outputs: number[][] = [];
+            const keyFrames = animation.getKeys();
+            const minMaxKeyFrames = _GLTFAnimation.calculateMinMaxKeyFrames(keyFrames);
+            const interpolationOrBake = _GLTFAnimation._DeduceInterpolation(keyFrames, animationChannelTargetPath, useQuaternion);
+            const frameDelta = minMaxKeyFrames.max - minMaxKeyFrames.min;
+
+            const interpolation = interpolationOrBake.interpolationType;
+            const shouldBakeAnimation = interpolationOrBake.shouldBakeAnimation;
+
+            if (shouldBakeAnimation) {
+                _GLTFAnimation._CreateBakedAnimation(babylonMesh, animation, animationChannelTargetPath, minMaxKeyFrames.min, minMaxKeyFrames.max, animation.framePerSecond, animationSampleRate, inputs, outputs, minMaxKeyFrames, convertToRightHandedSystem, useQuaternion);
+            }
+            else {
+                if (interpolation === AnimationSamplerInterpolation.LINEAR || interpolation === AnimationSamplerInterpolation.STEP) {
+                    _GLTFAnimation._CreateLinearOrStepAnimation(babylonMesh, animation, animationChannelTargetPath, frameDelta, inputs, outputs, convertToRightHandedSystem, useQuaternion);
+
+                }
+                else if (interpolation === AnimationSamplerInterpolation.CUBICSPLINE) {
+                    _GLTFAnimation._CreateCubicSplineAnimation(babylonMesh, animation, animationChannelTargetPath, frameDelta, inputs, outputs, convertToRightHandedSystem, useQuaternion);
+                }
+                else {
+                    _GLTFAnimation._CreateBakedAnimation(babylonMesh, animation, animationChannelTargetPath, minMaxKeyFrames.min, minMaxKeyFrames.max, animation.framePerSecond, animationSampleRate, inputs, outputs, minMaxKeyFrames, convertToRightHandedSystem, useQuaternion);
+                }
+            }
+
+            if (inputs.length && outputs.length) {
+                const result: _IAnimationData = {
+                    inputs: inputs,
+                    outputs: outputs,
+                    samplerInterpolation: interpolation,
+                    inputsMin: shouldBakeAnimation ? minMaxKeyFrames.min : Tools.FloatRound(minMaxKeyFrames.min / animation.framePerSecond),
+                    inputsMax: shouldBakeAnimation ? minMaxKeyFrames.max : Tools.FloatRound(minMaxKeyFrames.max / animation.framePerSecond)
+                }
+
+                return result;
+            }
+
+            return null;
+        }
+
+        private static _DeduceAnimationInfo(animation: Animation): Nullable<_IAnimationInfo> {
+            let animationChannelTargetPath: Nullable<AnimationChannelTargetPath> = null;
+            let dataAccessorType = AccessorType.VEC3;
+            let useQuaternion: boolean = false;
+            let property = animation.targetProperty.split('.');
+            switch (property[0]) {
+                case 'scaling': {
+                    animationChannelTargetPath = AnimationChannelTargetPath.SCALE;
+                    break;
+                }
+                case 'position': {
+                    animationChannelTargetPath = AnimationChannelTargetPath.TRANSLATION;
+                    break;
+                }
+                case 'rotation': {
+                    dataAccessorType = AccessorType.VEC4;
+                    animationChannelTargetPath = AnimationChannelTargetPath.ROTATION;
+                    break;
+                }
+                case 'rotationQuaternion': {
+                    dataAccessorType = AccessorType.VEC4;
+                    useQuaternion = true;
+                    animationChannelTargetPath = AnimationChannelTargetPath.ROTATION;
+                    break;
+                }
+                default: {
+                    Tools.Error(`Unsupported animatable property ${property[0]}`);
+                }
+            }
+            if (animationChannelTargetPath) {
+                return { animationChannelTargetPath: animationChannelTargetPath, dataAccessorType: dataAccessorType, useQuaternion: useQuaternion };
+            }
+            else {
+                Tools.Error('animation channel target path and data accessor type could be deduced');
+            }
+            return null;
+        }
+
+        /**
+         * 
+         * @param babylonMesh 
+         * @param runtimeGLTFAnimation 
+         * @param idleGLTFAnimations 
+         * @param nodeMap 
+         * @param nodes 
+         * @param binaryWriter 
+         * @param bufferViews 
+         * @param accessors 
+         * @param convertToRightHandedSystem 
+         */
+        public static _CreateNodeAnimationFromMeshAnimations(babylonMesh: Mesh, runtimeGLTFAnimation: IAnimation, idleGLTFAnimations: IAnimation[], nodeMap: { [key: number]: number }, nodes: INode[], binaryWriter: _BinaryWriter, bufferViews: IBufferView[], accessors: IAccessor[], convertToRightHandedSystem: boolean, animationSampleRate: number) {
+            let glTFAnimation: IAnimation;
+            if (babylonMesh.animations) {
+                babylonMesh.animations.forEach(function (animation) {
+                    let animationInfo = _GLTFAnimation._DeduceAnimationInfo(animation);
+                    if (animationInfo) {
+                        glTFAnimation = {
+                            name: animation.name,
+                            samplers: [],
+                            channels: []
+                        }
+                        _GLTFAnimation.AddAnimation(`${animation.name}`,
+                            animation.hasRunningRuntimeAnimations ? runtimeGLTFAnimation : glTFAnimation,
+                            babylonMesh,
+                            animation,
+                            animationInfo.dataAccessorType,
+                            animationInfo.animationChannelTargetPath,
+                            nodeMap,
+                            binaryWriter,
+                            bufferViews,
+                            accessors,
+                            convertToRightHandedSystem,
+                            animationInfo.useQuaternion,
+                            animationSampleRate
+                        );
+                        if (glTFAnimation.samplers.length && glTFAnimation.channels.length) {
+                            idleGLTFAnimations.push(glTFAnimation);
+                        }
+                    }
+                });
+            }
+        }
+
+        /**
+         * 
+         * @param babylonScene 
+         * @param glTFAnimations 
+         * @param nodeMap 
+         * @param nodes 
+         * @param binaryWriter 
+         * @param bufferViews 
+         * @param accessors 
+         * @param convertToRightHandedSystem 
+         */
+        public static _CreateNodeAnimationFromAnimationGroups(babylonScene: Scene, glTFAnimations: IAnimation[], nodeMap: { [key: number]: number }, nodes: INode[], binaryWriter: _BinaryWriter, bufferViews: IBufferView[], accessors: IAccessor[], convertToRightHandedSystem: boolean, animationSampleRate: number) {
+            let glTFAnimation: IAnimation;
+            if (babylonScene.animationGroups) {
+                let animationGroups = babylonScene.animationGroups;
+
+                animationGroups.forEach(function (animationGroup) {
+                    glTFAnimation = {
+                        name: animationGroup.name,
+                        channels: [],
+                        samplers: []
+                    }
+                    animationGroup.targetedAnimations.forEach(function (targetAnimation) {
+                        let target = targetAnimation.target;
+                        let animation = targetAnimation.animation;
+                        if (target instanceof Mesh) {
+                            let animationInfo = _GLTFAnimation._DeduceAnimationInfo(targetAnimation.animation);
+                            if (animationInfo) {
+                                let babylonMesh = target as Mesh;
+                                _GLTFAnimation.AddAnimation(`${animation.name}`,
+                                    glTFAnimation,
+                                    babylonMesh,
+                                    animation,
+                                    animationInfo.dataAccessorType,
+                                    animationInfo.animationChannelTargetPath,
+                                    nodeMap,
+                                    binaryWriter,
+                                    bufferViews,
+                                    accessors,
+                                    convertToRightHandedSystem,
+                                    animationInfo.useQuaternion,
+                                    animationSampleRate
+                                );
+                            }
+                        }
+                    });
+                    if (glTFAnimation.channels.length && glTFAnimation.samplers.length) {
+                        glTFAnimations.push(glTFAnimation);
+                    }
+                });
+            }
+        }
+
+        private static AddAnimation(name: string, glTFAnimation: IAnimation, babylonMesh: Mesh, animation: Animation, dataAccessorType: AccessorType, animationChannelTargetPath: AnimationChannelTargetPath, nodeMap: { [key: number]: number }, binaryWriter: _BinaryWriter, bufferViews: IBufferView[], accessors: IAccessor[], convertToRightHandedSystem: boolean, useQuaternion: boolean, animationSampleRate: number) {
+            let animationData = _GLTFAnimation._CreateNodeAnimation(babylonMesh, animation, animationChannelTargetPath, convertToRightHandedSystem, useQuaternion, animationSampleRate);
+            let bufferView: IBufferView;
+            let accessor: IAccessor;
+            let keyframeAccessorIndex: number;
+            let dataAccessorIndex: number;
+            let outputLength: number;
+            let animationSampler: IAnimationSampler;
+            let animationChannel: IAnimationChannel;
+
+            if (animationData) {
+                let nodeIndex = nodeMap[babylonMesh.uniqueId];
+
+                // Creates buffer view and accessor for key frames.
+                let byteLength = animationData.inputs.length * 4;
+                bufferView = _GLTFUtilities.CreateBufferView(0, binaryWriter.getByteOffset(), byteLength, undefined, `${name}  keyframe data view`);
+                bufferViews.push(bufferView);
+
+                animationData.inputs.forEach(function (input) {
+                    binaryWriter.setFloat32(input);
+                });
+
+                accessor = _GLTFUtilities.CreateAccessor(bufferViews.length - 1, `${name}  keyframes`, AccessorType.SCALAR, AccessorComponentType.FLOAT, animationData.inputs.length, null, [animationData.inputsMin], [animationData.inputsMax]);
+                accessors.push(accessor);
+                keyframeAccessorIndex = accessors.length - 1;
+
+                // create bufferview and accessor for keyed values.
+                outputLength = animationData.outputs.length;
+                byteLength = dataAccessorType === AccessorType.VEC3 ? animationData.outputs.length * 12 : animationData.outputs.length * 16;
+
+                // check for in and out tangents
+                bufferView = _GLTFUtilities.CreateBufferView(0, binaryWriter.getByteOffset(), byteLength, undefined, `${name}  data view`);
+                bufferViews.push(bufferView);
+
+                animationData.outputs.forEach(function (output) {
+                    output.forEach(function (entry) {
+                        binaryWriter.setFloat32(entry);
+                    });
+                });
+
+                accessor = _GLTFUtilities.CreateAccessor(bufferViews.length - 1, `${name}  data`, dataAccessorType, AccessorComponentType.FLOAT, outputLength, null, null, null);
+                accessors.push(accessor);
+                dataAccessorIndex = accessors.length - 1;
+
+                // create sampler
+                animationSampler = {
+                    interpolation: animationData.samplerInterpolation,
+                    input: keyframeAccessorIndex,
+                    output: dataAccessorIndex
+                }
+                glTFAnimation.samplers.push(animationSampler);
+
+                // create channel
+                animationChannel = {
+                    sampler: glTFAnimation.samplers.length - 1,
+                    target: {
+                        node: nodeIndex,
+                        path: animationChannelTargetPath
+                    }
+                }
+                glTFAnimation.channels.push(animationChannel);
+            }
+        }
+
+        /**
+         * Create a baked animation
+         * @param babylonMesh BabylonJS mesh
+         * @param animation BabylonJS animation corresponding to the BabylonJS mesh
+         * @param animationChannelTargetPath animation target channel
+         * @param minFrame minimum animation frame
+         * @param maxFrame maximum animation frame
+         * @param fps frames per second of the animation
+         * @param inputs input key frames of the animation
+         * @param outputs output key frame data of the animation
+         * @param convertToRightHandedSystem converts the values to right-handed
+         * @param useQuaternion specifies if quaternions should be used
+         */
+        private static _CreateBakedAnimation(babylonMesh: Mesh, animation: Animation, animationChannelTargetPath: AnimationChannelTargetPath, minFrame: number, maxFrame: number, fps: number, sampleRate: number, inputs: number[], outputs: number[][], minMaxFrames: { min: number, max: number }, convertToRightHandedSystem: boolean, useQuaternion: boolean) {
+            let value: number | Vector3 | Quaternion;
+            let quaternionCache: Quaternion = Quaternion.Identity();
+            let previousTime: Nullable<number> = null;
+            let time: number;
+            let maxUsedFrame: Nullable<number> = null;
+            let currKeyFrame: Nullable<IAnimationKey> = null;
+            let nextKeyFrame: Nullable<IAnimationKey> = null;
+            let prevKeyFrame: Nullable<IAnimationKey> = null;
+            let endFrame: Nullable<number> = null;
+            minMaxFrames.min = Tools.FloatRound(minFrame / fps);
+
+            let keyFrames = animation.getKeys();
+
+            for (let i = 0, length = keyFrames.length; i < length; ++i) {
+                endFrame = null;
+                currKeyFrame = keyFrames[i];
+
+                if (i + 1 < length) {
+                    nextKeyFrame = keyFrames[i + 1];
+                    if (currKeyFrame.value.equals(nextKeyFrame.value)) {
+                        if (i === 0) { // set the first frame to itself
+                            endFrame = currKeyFrame.frame;
+                        }
+                        else {
+                            continue;
+                        }
+                    }
+                    else {
+                        endFrame = nextKeyFrame.frame;
+                    }
+                }
+                else {
+                    // at the last key frame
+                    prevKeyFrame = keyFrames[i - 1];
+                    if (currKeyFrame.value.equals(prevKeyFrame.value)) {
+                        continue;
+                    }
+                    else {
+                        endFrame = maxFrame;
+                    }
+                }
+                if (endFrame) {
+                    for (let f = currKeyFrame.frame; f <= endFrame; f += sampleRate) {
+                        time = Tools.FloatRound(f / fps);
+                        if (time === previousTime) {
+                            continue;
+                        }
+                        previousTime = time;
+                        maxUsedFrame = time;
+                        value = animation._interpolate(f, 0, undefined, animation.loopMode);
+
+                        _GLTFAnimation._SetInterpolatedValue(babylonMesh, value, time, animation, animationChannelTargetPath, quaternionCache, inputs, outputs, convertToRightHandedSystem, useQuaternion);
+                    }
+                }
+            }
+            if (maxUsedFrame) {
+                minMaxFrames.max = maxUsedFrame;
+            }
+        }
+
+        private static _ConvertFactorToVector3OrQuaternion(factor: number, babylonMesh: Mesh, animation: Animation, animationType: number, animationChannelTargetPath: AnimationChannelTargetPath, convertToRightHandedSystem: boolean, useQuaternion: boolean): Nullable<Vector3 | Quaternion> {
+            let property: string[];
+            let componentName: string;
+            let value: Nullable<Quaternion | Vector3> = null;
+            const basePositionRotationOrScale = _GLTFAnimation._GetBasePositionRotationOrScale(babylonMesh, animationChannelTargetPath, convertToRightHandedSystem, useQuaternion);
+            if (animationType === Animation.ANIMATIONTYPE_FLOAT) { // handles single component x, y, z or w component animation by using a base property and animating over a component.
+                property = animation.targetProperty.split('.');
+                componentName = property ? property[1] : ''; // x, y, or z component
+                value = useQuaternion ? BABYLON.Quaternion.FromArray(basePositionRotationOrScale).normalize() : BABYLON.Vector3.FromArray(basePositionRotationOrScale);
+
+                switch (componentName) {
+                    case 'x':
+                    case 'y': {
+                        value[componentName] = (convertToRightHandedSystem && useQuaternion) ? -factor : factor;
+                        break;
+                    }
+                    case 'z': {
+                        value[componentName] = (convertToRightHandedSystem && !useQuaternion && !(animationChannelTargetPath === AnimationChannelTargetPath.SCALE)) ? -factor : factor;
+                        break;
+                    }
+                    case 'w': {
+                        (value as Quaternion).w = factor;
+                        break;
+                    }
+                    default: {
+                        Tools.Error(`glTFAnimation: Unsupported component type "${componentName}" for scale animation!`);
+                    }
+                }
+            }
+
+            return value;
+        }
+
+        private static _SetInterpolatedValue(babylonMesh: Mesh, value: Nullable<number | Vector3 | Quaternion>, time: number, animation: Animation, animationChannelTargetPath: AnimationChannelTargetPath, quaternionCache: Quaternion, inputs: number[], outputs: number[][], convertToRightHandedSystem: boolean, useQuaternion: boolean) {
+            const animationType = animation.dataType;
+            let cacheValue: Vector3 | Quaternion;
+            inputs.push(time);
+            if (typeof value === "number") {
+                value = this._ConvertFactorToVector3OrQuaternion(value as number, babylonMesh, animation, animationType, animationChannelTargetPath, convertToRightHandedSystem, useQuaternion);
+            }
+            if (value) {
+                if (animationChannelTargetPath === AnimationChannelTargetPath.ROTATION) {
+                    if (useQuaternion) {
+                        quaternionCache = value as Quaternion;
+                    }
+                    else {
+                        cacheValue = value as Vector3;
+                        Quaternion.RotationYawPitchRollToRef(cacheValue.y, cacheValue.x, cacheValue.z, quaternionCache);
+                    }
+                    if (convertToRightHandedSystem) {
+                        quaternionCache.x *= -1;
+                        quaternionCache.y *= -1;
+                        outputs.push(quaternionCache.asArray());
+                    }
+                }
+                else {
+                    cacheValue = value as Vector3;
+                    if (convertToRightHandedSystem && (animationChannelTargetPath !== AnimationChannelTargetPath.SCALE)) {
+                        cacheValue.z *= -1;
+                    }
+
+                    outputs.push(cacheValue.asArray());
+                }
+            }
+        }
+
+        /**
+         * Creates linear animation from the animation key frames
+         * @param babylonMesh BabylonJS mesh
+         * @param animation BabylonJS animation
+         * @param animationChannelTargetPath The target animation channel
+         * @param frameDelta The difference between the last and first frame of the animation
+         * @param inputs Array to store the key frame times
+         * @param outputs Array to store the key frame data
+         * @param convertToRightHandedSystem Specifies if the position data should be converted to right handed
+         * @param useQuaternion Specifies if quaternions are used in the animation
+         */
+        private static _CreateLinearOrStepAnimation(babylonMesh: Mesh, animation: Animation, animationChannelTargetPath: AnimationChannelTargetPath, frameDelta: number, inputs: number[], outputs: number[][], convertToRightHandedSystem: boolean, useQuaternion: boolean) {
+            animation.getKeys().forEach(function (keyFrame) {
+                inputs.push(keyFrame.frame / animation.framePerSecond); // keyframes in seconds.
+                _GLTFAnimation._AddKeyframeValue(keyFrame, animation, outputs, animationChannelTargetPath, babylonMesh, convertToRightHandedSystem, useQuaternion);
+            });
+        }
+
+        /**
+         * Creates cubic spline animation from the animation key frames
+         * @param babylonMesh BabylonJS mesh
+         * @param animation BabylonJS animation
+         * @param animationChannelTargetPath The target animation channel
+         * @param frameDelta The difference between the last and first frame of the animation
+         * @param inputs Array to store the key frame times
+         * @param outputs Array to store the key frame data
+         * @param convertToRightHandedSystem Specifies if the position data should be converted to right handed
+         * @param useQuaternion Specifies if quaternions are used in the animation
+         */
+        private static _CreateCubicSplineAnimation(babylonMesh: Mesh, animation: Animation, animationChannelTargetPath: AnimationChannelTargetPath, frameDelta: number, inputs: number[], outputs: number[][], convertToRightHandedSystem: boolean, useQuaternion: boolean) {
+            animation.getKeys().forEach(function (keyFrame) {
+                inputs.push(keyFrame.frame / animation.framePerSecond); // keyframes in seconds.
+                _GLTFAnimation.AddSplineTangent(
+                    _TangentType.INTANGENT,
+                    outputs,
+                    animationChannelTargetPath,
+                    AnimationSamplerInterpolation.CUBICSPLINE,
+                    keyFrame,
+                    frameDelta,
+                    useQuaternion,
+                    convertToRightHandedSystem
+                );
+                _GLTFAnimation._AddKeyframeValue(keyFrame, animation, outputs, animationChannelTargetPath, babylonMesh, convertToRightHandedSystem, useQuaternion);
+
+                _GLTFAnimation.AddSplineTangent(
+                    _TangentType.OUTTANGENT,
+                    outputs,
+                    animationChannelTargetPath,
+                    AnimationSamplerInterpolation.CUBICSPLINE,
+                    keyFrame,
+                    frameDelta,
+                    useQuaternion,
+                    convertToRightHandedSystem
+                );
+            });
+        }
+
+        private static _GetBasePositionRotationOrScale(babylonMesh: Mesh, animationChannelTargetPath: AnimationChannelTargetPath, convertToRightHandedSystem: boolean, useQuaternion: boolean) {
+            let basePositionRotationOrScale: number[];
+            if (animationChannelTargetPath === AnimationChannelTargetPath.ROTATION) {
+                if (useQuaternion) {
+                    if (babylonMesh.rotationQuaternion) {
+                        basePositionRotationOrScale = babylonMesh.rotationQuaternion.asArray();
+                        if (convertToRightHandedSystem) {
+                            basePositionRotationOrScale[0] *= -1;
+                            basePositionRotationOrScale[1] *= -1;
+                        }
+                    }
+                    else {
+                        basePositionRotationOrScale = BABYLON.Quaternion.Identity().asArray();
+                    }
+                }
+                else {
+                    basePositionRotationOrScale = babylonMesh.rotation.asArray();
+                    basePositionRotationOrScale[2] *= -1;
+                }
+            }
+            else if (animationChannelTargetPath === AnimationChannelTargetPath.TRANSLATION) {
+                basePositionRotationOrScale = babylonMesh.position.asArray();
+                if (convertToRightHandedSystem) {
+                    basePositionRotationOrScale[2] *= -1;
+                }
+            }
+            else { // scale
+                basePositionRotationOrScale = babylonMesh.scaling.asArray();
+            }
+            return basePositionRotationOrScale;
+        }
+
+        /**
+         * Adds a key frame value
+         * @param keyFrame 
+         * @param animation 
+         * @param outputs 
+         * @param animationChannelTargetPath 
+         * @param basePositionRotationOrScale 
+         * @param convertToRightHandedSystem 
+         * @param useQuaternion 
+         */
+        private static _AddKeyframeValue(keyFrame: IAnimationKey, animation: Animation, outputs: number[][], animationChannelTargetPath: AnimationChannelTargetPath, babylonMesh: Mesh, convertToRightHandedSystem: boolean, useQuaternion: boolean) {
+            let value: number[];
+            let newPositionRotationOrScale: Nullable<Vector3 | Quaternion>;
+            const animationType = animation.dataType;
+            if (animationType === Animation.ANIMATIONTYPE_VECTOR3) {
+                value = keyFrame.value.asArray();
+                if (convertToRightHandedSystem && !(animationChannelTargetPath === AnimationChannelTargetPath.SCALE)) {
+                    value[2] *= -1;
+                }
+                if (animationChannelTargetPath === AnimationChannelTargetPath.ROTATION) {
+                    outputs.push(Vector3.FromArray(value).toQuaternion().asArray());
+                }
+                else {
+                    outputs.push(value); // scale or position vector.
+                }
+            }
+            else if (animationType === Animation.ANIMATIONTYPE_FLOAT) { // handles single component x, y, z or w component animation by using a base property and animating over a component.
+                newPositionRotationOrScale = this._ConvertFactorToVector3OrQuaternion(keyFrame.value as number, babylonMesh, animation, animationType, animationChannelTargetPath, convertToRightHandedSystem, useQuaternion)
+                if (newPositionRotationOrScale) {
+                    if (animationChannelTargetPath === AnimationChannelTargetPath.ROTATION) {
+                        useQuaternion ? outputs.push(newPositionRotationOrScale.normalize().asArray()) : outputs.push((newPositionRotationOrScale as Vector3).toQuaternion().normalize().asArray());
+                    }
+                    else {
+                        outputs.push(newPositionRotationOrScale.asArray());
+                    }
+                }
+            }
+            else if (animationType === Animation.ANIMATIONTYPE_QUATERNION) {
+                value = (keyFrame.value as Quaternion).normalize().asArray();
+
+                if (convertToRightHandedSystem) {
+                    value[0] *= -1;
+                    value[1] *= -1;
+                }
+                outputs.push(value);
+            }
+            else {
+                Tools.Error('glTFAnimation: Unsupported key frame values for animation!');
+            }
+        }
+
+        private static _DeduceInterpolation(keyFrames: IAnimationKey[], animationChannelTargetPath: AnimationChannelTargetPath, useQuaternion: boolean): { interpolationType: AnimationSamplerInterpolation, shouldBakeAnimation: boolean } {
+            let interpolationType: AnimationSamplerInterpolation | undefined;
+            let shouldBakeAnimation = false;
+            let key: IAnimationKey;
+
+            if (animationChannelTargetPath === AnimationChannelTargetPath.ROTATION && !useQuaternion) {
+                return { interpolationType: AnimationSamplerInterpolation.LINEAR, shouldBakeAnimation: true };
+            }
+
+            for (let i = 0, length = keyFrames.length; i < length; ++i) {
+                key = keyFrames[i];
+                if (key.inTangent || key.outTangent) {
+                    if (interpolationType) {
+                        if (interpolationType !== AnimationSamplerInterpolation.CUBICSPLINE) {
+                            interpolationType = AnimationSamplerInterpolation.LINEAR;
+                            shouldBakeAnimation = true;
+                            break;
+                        }
+                    }
+                    else {
+                        interpolationType = AnimationSamplerInterpolation.CUBICSPLINE;
+                    }
+                }
+                else {
+                    if (interpolationType) {
+                        if (interpolationType === AnimationSamplerInterpolation.CUBICSPLINE ||
+                            (key.interpolation && (key.interpolation === AnimationKeyInterpolation.STEP) && interpolationType !== AnimationSamplerInterpolation.STEP)) {
+                            interpolationType = AnimationSamplerInterpolation.LINEAR;
+                            shouldBakeAnimation = true;
+                            break;
+                        }
+                    }
+                    else {
+                        if (key.interpolation && (key.interpolation === AnimationKeyInterpolation.STEP)) {
+                            interpolationType = AnimationSamplerInterpolation.STEP;
+                        }
+                        else {
+                            interpolationType = AnimationSamplerInterpolation.LINEAR;
+                        }
+                    }
+                }
+            }
+            if (!interpolationType) {
+                interpolationType = AnimationSamplerInterpolation.LINEAR;
+            }
+
+            return { interpolationType: interpolationType, shouldBakeAnimation: shouldBakeAnimation };
+        }
+
+        /**
+         * Adds an input tangent or output tangent to the output data
+         * If an input tangent or output tangent is missing, it uses the zero vector or zero quaternion
+         * @param tangentType Specifies which type of tangent to handle (inTangent or outTangent)
+         * @param outputs The animation data by keyframe
+         * @param animationChannelTargetPath The target animation channel
+         * @param interpolation The interpolation type
+         * @param keyFrame The key frame with the animation data
+         * @param frameDelta Time difference between two frames used to scale the tangent by the frame delta
+         * @param useQuaternion Specifies if quaternions are used
+         * @param convertToRightHandedSystem Specifies if the values should be converted to right-handed
+         */
+        private static AddSplineTangent(tangentType: _TangentType, outputs: number[][], animationChannelTargetPath: AnimationChannelTargetPath, interpolation: AnimationSamplerInterpolation, keyFrame: IAnimationKey, frameDelta: number, useQuaternion: boolean, convertToRightHandedSystem: boolean) {
+            let tangent: number[];
+            let tangentValue: Vector3 | Quaternion = tangentType === _TangentType.INTANGENT ? keyFrame.inTangent : keyFrame.outTangent;
+            if (interpolation === AnimationSamplerInterpolation.CUBICSPLINE) {
+                if (animationChannelTargetPath === AnimationChannelTargetPath.ROTATION) {
+                    if (tangentValue) {
+                        tangent = useQuaternion ? (tangentValue as Quaternion).scale(frameDelta).asArray() : (tangentValue as Vector3).scale(frameDelta).toQuaternion().asArray();
+                        if (convertToRightHandedSystem) {
+                            tangent[0] *= -1;
+                            tangent[1] *= -1;
+                        }
+                    }
+                    else {
+                        tangent = [0, 0, 0, 0];
+                    }
+                }
+                else {
+                    if (tangentValue) {
+                        tangent = (tangentValue as Vector3).scale(frameDelta).asArray();
+                        if (convertToRightHandedSystem) {
+                            tangent[2] *= -1;
+                        }
+                    }
+                    else {
+                        tangent = [0, 0, 0];
+                    }
+                }
+
+                outputs.push(tangent);
+            }
+        }
+
+        /**
+         * Get the minimum and maximum key frames' frame values
+         * @param keyFrames animation key frames
+         * @returns the minimum and maximum key frame value
+         */
+        private static calculateMinMaxKeyFrames(keyFrames: IAnimationKey[]): { min: number, max: number } {
+            let min: number = Infinity;
+            let max: number = -Infinity;
+            keyFrames.forEach(function (keyFrame) {
+                min = Math.min(min, keyFrame.frame);
+                max = Math.max(max, keyFrame.frame);
+            });
+
+            return { min: min, max: max };
+
+        }
+    }
+}

serializers/src/glTF/2.0/babylon.glTFData.ts

@@ -4,28 +4,28 @@ module BABYLON {
     /**
      * Class for holding and downloading glTF file data
      */
-    export class _GLTFData {
+    export class GLTFData {
         /**
-         * Object which contains the file name as the key and its data as the value.
+         * Object which contains the file name as the key and its data as the value
          */
         glTFFiles: { [fileName: string]: string | Blob };
 
         /**
-         * Initializes the glTF file object.
+         * Initializes the glTF file object
          */
         public constructor() {
             this.glTFFiles = {};
         }
 
         /**
-         * Downloads the glTF data as files based on their names and data.
+         * Downloads the glTF data as files based on their names and data
          */
         public downloadFiles(): void {
             /**
-            * Checks for a matching suffix at the end of a string (for ES5 and lower).
-            * @param str - Source string.
-            * @param suffix - Suffix to search for in the source string.
-            * @returns - Boolean indicating whether the suffix was found (true) or not (false).
+            * Checks for a matching suffix at the end of a string (for ES5 and lower)
+            * @param str Source string
+            * @param suffix Suffix to search for in the source string
+            * @returns Boolean indicating whether the suffix was found (true) or not (false)
             */
             function endsWith(str: string, suffix: string): boolean {
                 return str.indexOf(suffix, str.length - suffix.length) !== -1;

serializers/src/glTF/2.0/babylon.glTFMaterial.ts

@@ -2,60 +2,66 @@
 
 module BABYLON.GLTF2 {
     /** 
-     * Interface for storing specular glossiness factors.
-    */
+     * Interface for storing specular glossiness factors
+     * @hidden
+     */
+
     interface _IPBRSpecularGlossiness {
         /** 
-         * Represents the linear diffuse factors of the material.
+         * Represents the linear diffuse factors of the material
         */
         diffuseColor: BABYLON.Color3;
         /** 
-         * Represents the linear specular factors of the material.
+         * Represents the linear specular factors of the material
         */
         specularColor: BABYLON.Color3;
         /** 
-         * Represents the smoothness of the material.
+         * Represents the smoothness of the material
         */
         glossiness: number;
     }
 
     /** 
-     * Interface for storing metallic roughness factors.
-    */
+     * Interface for storing metallic roughness factors
+     * @hidden
+     */
+
     interface _IPBRMetallicRoughness {
         /** 
-         * Represents the albedo color of the material.
+         * Represents the albedo color of the material
         */
         baseColor: BABYLON.Color3;
         /** 
-         * Represents the metallness of the material.
+         * Represents the metallness of the material
         */
         metallic: number;
         /** 
-         * Represents the roughness of the material.
+         * Represents the roughness of the material
         */
         roughness: number;
         /** 
-         * The metallic roughness texture as a base64 string.
+         * The metallic roughness texture as a base64 string
         */
         metallicRoughnessTextureBase64?: Nullable<string>;
         /** 
-         * The base color texture as a base64 string.
+         * The base color texture as a base64 string
         */
         baseColorTextureBase64?: Nullable<string>;
     }
 
     /**
-     * Utility methods for working with glTF material conversion properties.  This class should only be used internally.
+     * Utility methods for working with glTF material conversion properties.  This class should only be used internally
+     * @hidden
+
      */
     export class _GLTFMaterial {
         /**
-         * Represents the dielectric specular values for R, G and B.
+         * Represents the dielectric specular values for R, G and B
          */
         private static readonly _dielectricSpecular: Color3 = new Color3(0.04, 0.04, 0.04);
 
         /**
-         * Allows the maximum specular power to be defined for material calculations.
+         * Allows the maximum specular power to be defined for material calculations
          */
         private static _maxSpecularPower = 1024;
 
@@ -65,10 +71,10 @@ module BABYLON.GLTF2 {
         private static _epsilon = 1e-6;
 
         /**
-         * Specifies if two colors are approximately equal in value.
-         * @param color1 - first color to compare to.
-         * @param color2 - second color to compare to.
-         * @param epsilon - threshold value
+         * Specifies if two colors are approximately equal in value
+         * @param color1 first color to compare to
+         * @param color2 second color to compare to
+         * @param epsilon threshold value
          */
         private static FuzzyEquals(color1: Color3, color2: Color3, epsilon: number): boolean {
             return Scalar.WithinEpsilon(color1.r, color2.r, epsilon) &&
@@ -77,14 +83,14 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Gets the materials from a Babylon scene and converts them to glTF materials.
-         * @param scene - babylonjs scene.
-         * @param mimeType - texture mime type.
-         * @param images - array of images.
-         * @param textures - array of textures.
-         * @param materials - array of materials.
-         * @param imageData - mapping of texture names to base64 textures
-         * @param hasTextureCoords - specifies if texture coordinates are present on the material.
+         * Gets the materials from a Babylon scene and converts them to glTF materials
+         * @param scene babylonjs scene
+         * @param mimeType texture mime type
+         * @param images array of images
+         * @param textures array of textures
+         * @param materials array of materials
+         * @param imageData mapping of texture names to base64 textures
+         * @param hasTextureCoords specifies if texture coordinates are present on the material
          */
         public static _ConvertMaterialsToGLTF(babylonMaterials: Material[], mimeType: ImageMimeType, images: IImage[], textures: ITexture[], materials: IMaterial[], imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }, hasTextureCoords: boolean) {
             for (let i = 0; i < babylonMaterials.length; ++i) {
@@ -99,14 +105,14 @@ module BABYLON.GLTF2 {
                     _GLTFMaterial._ConvertPBRMaterial(babylonMaterial, mimeType, images, textures, materials, imageData, hasTextureCoords);
                 }
                 else {
-                    throw new Error("Unsupported material type: " + babylonMaterial.name);
+                    Tools.Error("Unsupported material type: " + babylonMaterial.name);
                 }
             }
         }
 
         /**
-         * Makes a copy of the glTF material without the texture parameters.
-         * @param originalMaterial - original glTF material.
+         * Makes a copy of the glTF material without the texture parameters
+         * @param originalMaterial original glTF material
          * @returns glTF material without texture parameters
          */
         public static _StripTexturesFromMaterial(originalMaterial: IMaterial): IMaterial {
@@ -129,8 +135,8 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Specifies if the material has any texture parameters present.
-         * @param material - glTF Material.
+         * Specifies if the material has any texture parameters present
+         * @param material glTF Material
          * @returns boolean specifying if texture parameters are present
          */
         public static _HasTexturesPresent(material: IMaterial): boolean {
@@ -148,9 +154,9 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Converts a Babylon StandardMaterial to a glTF Metallic Roughness Material.
+         * Converts a Babylon StandardMaterial to a glTF Metallic Roughness Material
          * @param babylonStandardMaterial 
-         * @returns - glTF Metallic Roughness Material representation
+         * @returns glTF Metallic Roughness Material representation
          */
         public static _ConvertToGLTFPBRMetallicRoughness(babylonStandardMaterial: StandardMaterial): IMaterialPbrMetallicRoughness {
             const P0 = new BABYLON.Vector2(0, 1);
@@ -159,13 +165,13 @@ module BABYLON.GLTF2 {
             const P3 = new BABYLON.Vector2(1300, 0.1);
 
             /**
-             * Given the control points, solve for x based on a given t for a cubic bezier curve.
-             * @param t - a value between 0 and 1.
-             * @param p0 - first control point.
-             * @param p1 - second control point.
-             * @param p2 - third control point.
-             * @param p3 - fourth control point.
-             * @returns - number result of cubic bezier curve at the specified t.
+             * Given the control points, solve for x based on a given t for a cubic bezier curve
+             * @param t a value between 0 and 1
+             * @param p0 first control point
+             * @param p1 second control point
+             * @param p2 third control point
+             * @param p3 fourth control point
+             * @returns number result of cubic bezier curve at the specified t
              */
             function _cubicBezierCurve(t: number, p0: number, p1: number, p2: number, p3: number): number {
                 return (
@@ -179,9 +185,9 @@ module BABYLON.GLTF2 {
             /**
              * Evaluates a specified specular power value to determine the appropriate roughness value, 
              * based on a pre-defined cubic bezier curve with specular on the abscissa axis (x-axis) 
-             * and roughness on the ordinant axis (y-axis).
-             * @param specularPower - specular power of standard material.
-             * @returns - Number representing the roughness value.
+             * and roughness on the ordinant axis (y-axis)
+             * @param specularPower specular power of standard material
+             * @returns Number representing the roughness value
              */
             function _solveForRoughness(specularPower: number): number {
                 var t = Math.pow(specularPower / P3.x, 0.333333);
@@ -210,10 +216,10 @@ module BABYLON.GLTF2 {
 
         /**
          * Computes the metallic factor
-         * @param diffuse - diffused value
-         * @param specular - specular value
-         * @param oneMinusSpecularStrength - one minus the specular strength
-         * @returns - metallic value
+         * @param diffuse diffused value
+         * @param specular specular value
+         * @param oneMinusSpecularStrength one minus the specular strength
+         * @returns metallic value
          */
         public static _SolveMetallic(diffuse: number, specular: number, oneMinusSpecularStrength: number): number {
             if (specular < _GLTFMaterial._dielectricSpecular.r) {
@@ -230,10 +236,10 @@ module BABYLON.GLTF2 {
 
         /**
          * Gets the glTF alpha mode from the Babylon Material
-         * @param babylonMaterial - Babylon Material
-         * @returns - The Babylon alpha mode value
+         * @param babylonMaterial Babylon Material
+         * @returns The Babylon alpha mode value
          */
-        public static _GetAlphaMode(babylonMaterial: Material): MaterialAlphaMode {
+        public static _GetAlphaMode(babylonMaterial: Material): Nullable<MaterialAlphaMode> {
             if (babylonMaterial instanceof StandardMaterial) {
                 const babylonStandardMaterial = babylonMaterial as StandardMaterial;
                 if ((babylonStandardMaterial.alpha != 1.0) ||
@@ -263,7 +269,8 @@ module BABYLON.GLTF2 {
                         return MaterialAlphaMode.BLEND;
                     }
                     default: {
-                        throw new Error("Unsupported alpha mode " + babylonPBRMetallicRoughness.transparencyMode);
+                        Tools.Error("Unsupported alpha mode " + babylonPBRMetallicRoughness.transparencyMode);
+                        return null;
                     }
                 }
             }
@@ -285,27 +292,28 @@ module BABYLON.GLTF2 {
                         return MaterialAlphaMode.BLEND;
                     }
                     default: {
-                        throw new Error("Unsupported alpha mode " + babylonPBRMaterial.transparencyMode);
+                        Tools.Error("Unsupported alpha mode " + babylonPBRMaterial.transparencyMode);
+                        return null;
                     }
                 }
             }
             else {
-                throw new Error("Unsupported Babylon material type");
+                Tools.Error("Unsupported Babylon material type");
+                return null;
             }
         }
 
         /**
-         * Converts a Babylon Standard Material to a glTF Material.
-         * @param babylonStandardMaterial - BJS Standard Material.
-         * @param mimeType - mime type to use for the textures.
-         * @param images - array of glTF image interfaces.
-         * @param textures - array of glTF texture interfaces.
-         * @param materials - array of glTF material interfaces.
-         * @param imageData - map of image file name to data.
-         * @param hasTextureCoords - specifies if texture coordinates are present on the submesh to determine if textures should be applied.
+         * Converts a Babylon Standard Material to a glTF Material
+         * @param babylonStandardMaterial BJS Standard Material
+         * @param mimeType mime type to use for the textures
+         * @param images array of glTF image interfaces
+         * @param textures array of glTF texture interfaces
+         * @param materials array of glTF material interfaces
+         * @param imageData map of image file name to data
+         * @param hasTextureCoords specifies if texture coordinates are present on the submesh to determine if textures should be applied
          */
         public static _ConvertStandardMaterial(babylonStandardMaterial: StandardMaterial, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], materials: IMaterial[], imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }, hasTextureCoords: boolean) {
-            Tools.Warn(babylonStandardMaterial.name + ": Standard Material is currently not fully supported/implemented in glTF serializer");
             const glTFPbrMetallicRoughness = _GLTFMaterial._ConvertToGLTFPBRMetallicRoughness(babylonStandardMaterial);
 
             const glTFMaterial: IMaterial = { name: babylonStandardMaterial.name };
@@ -366,14 +374,14 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Converts a Babylon PBR Metallic Roughness Material to a glTF Material.
-         * @param babylonPBRMetalRoughMaterial - BJS PBR Metallic Roughness Material.
-         * @param mimeType - mime type to use for the textures.
-         * @param images - array of glTF image interfaces.
-         * @param textures - array of glTF texture interfaces.
-         * @param materials - array of glTF material interfaces.
-         * @param imageData - map of image file name to data.
-         * @param hasTextureCoords - specifies if texture coordinates are present on the submesh to determine if textures should be applied.
+         * Converts a Babylon PBR Metallic Roughness Material to a glTF Material
+         * @param babylonPBRMetalRoughMaterial BJS PBR Metallic Roughness Material
+         * @param mimeType mime type to use for the textures
+         * @param images array of glTF image interfaces
+         * @param textures array of glTF texture interfaces
+         * @param materials array of glTF material interfaces
+         * @param imageData map of image file name to data
+         * @param hasTextureCoords specifies if texture coordinates are present on the submesh to determine if textures should be applied
          */
         public static _ConvertPBRMetallicRoughnessMaterial(babylonPBRMetalRoughMaterial: PBRMetallicRoughnessMaterial, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], materials: IMaterial[], imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }, hasTextureCoords: boolean) {
             const glTFPbrMetallicRoughness: IMaterialPbrMetallicRoughness = {};
@@ -436,11 +444,12 @@ module BABYLON.GLTF2 {
             }
             if (babylonPBRMetalRoughMaterial.transparencyMode != null) {
                 const alphaMode = _GLTFMaterial._GetAlphaMode(babylonPBRMetalRoughMaterial);
-
-                if (alphaMode !== MaterialAlphaMode.OPAQUE) { //glTF defaults to opaque
-                    glTFMaterial.alphaMode = alphaMode;
-                    if (alphaMode === MaterialAlphaMode.BLEND) {
-                        glTFMaterial.alphaCutoff = babylonPBRMetalRoughMaterial.alphaCutOff;
+                if (alphaMode) {
+                    if (alphaMode !== MaterialAlphaMode.OPAQUE) { //glTF defaults to opaque
+                        glTFMaterial.alphaMode = alphaMode;
+                        if (alphaMode === MaterialAlphaMode.BLEND) {
+                            glTFMaterial.alphaCutoff = babylonPBRMetalRoughMaterial.alphaCutOff;
+                        }
                     }
                 }
             }
@@ -451,14 +460,14 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Converts an image typed array buffer to a base64 image.
-         * @param buffer - typed array buffer.
-         * @param width - width of the image.
-         * @param height - height of the image.
-         * @param mimeType - mimetype of the image.
-         * @returns - base64 image string.
+         * Converts an image typed array buffer to a base64 image
+         * @param buffer typed array buffer
+         * @param width width of the image
+         * @param height height of the image
+         * @param mimeType mimetype of the image
+         * @returns base64 image string
          */
-        private static _CreateBase64FromCanvas(buffer: Uint8ClampedArray, width: number, height: number, mimeType: ImageMimeType): string {
+        private static _CreateBase64FromCanvas(buffer: Uint8ClampedArray | Float32Array, width: number, height: number, mimeType: ImageMimeType): string {
             const imageCanvas = document.createElement('canvas');
             imageCanvas.id = "WriteCanvas";
             const ctx = imageCanvas.getContext('2d') as CanvasRenderingContext2D;
@@ -474,11 +483,11 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Generates a white texture based on the specified width and height.
-         * @param width - width of the texture in pixels.
-         * @param height - height of the texture in pixels.
-         * @param scene - babylonjs scene.
-         * @returns - white texture.
+         * Generates a white texture based on the specified width and height
+         * @param width width of the texture in pixels
+         * @param height height of the texture in pixels
+         * @param scene babylonjs scene
+         * @returns white texture
          */
         private static _CreateWhiteTexture(width: number, height: number, scene: Scene): Texture {
             const data = new Uint8Array(width * height * 4);
@@ -493,11 +502,11 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Resizes the two source textures to the same dimensions.  If a texture is null, a default white texture is generated.  If both textures are null, returns null.
-         * @param texture1 - first texture to resize.
-         * @param texture2 - second texture to resize.
-         * @param scene - babylonjs scene.
-         * @returns resized textures or null.
+         * Resizes the two source textures to the same dimensions.  If a texture is null, a default white texture is generated.  If both textures are null, returns null
+         * @param texture1 first texture to resize
+         * @param texture2 second texture to resize
+         * @param scene babylonjs scene
+         * @returns resized textures or null
          */
         private static _ResizeTexturesToSameDimensions(texture1: BaseTexture, texture2: BaseTexture, scene: Scene): { "texture1": BaseTexture, "texture2": BaseTexture } {
             let texture1Size = texture1 ? texture1.getSize() : { width: 0, height: 0 };
@@ -535,14 +544,14 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Convert Specular Glossiness Textures to Metallic Roughness.
+         * Convert Specular Glossiness Textures to Metallic Roughness
          * See link below for info on the material conversions from PBR Metallic/Roughness and Specular/Glossiness
          * @link https://github.com/KhronosGroup/glTF/blob/master/extensions/2.0/Khronos/KHR_materials_pbrSpecularGlossiness/examples/convert-between-workflows-bjs/js/babylon.pbrUtilities.js
-         * @param diffuseTexture - texture used to store diffuse information.
-         * @param specularGlossinessTexture - texture used to store specular and glossiness information.
-         * @param factors - specular glossiness material factors.
-         * @param mimeType - the mime type to use for the texture.
-         * @returns pbr metallic roughness interface or null.
+         * @param diffuseTexture texture used to store diffuse information
+         * @param specularGlossinessTexture texture used to store specular and glossiness information
+         * @param factors specular glossiness material factors
+         * @param mimeType the mime type to use for the texture
+         * @returns pbr metallic roughness interface or null
          */
         private static _ConvertSpecularGlossinessTexturesToMetallicRoughness(diffuseTexture: BaseTexture, specularGlossinessTexture: BaseTexture, factors: _IPBRSpecularGlossiness, mimeType: ImageMimeType): Nullable<_IPBRMetallicRoughness> {
             if (!(diffuseTexture || specularGlossinessTexture)) {
@@ -551,7 +560,8 @@ module BABYLON.GLTF2 {
 
             const scene = diffuseTexture ? diffuseTexture.getScene() : specularGlossinessTexture.getScene();
             if (!scene) {
-                throw new Error("_ConvertSpecularGlossinessTexturesToMetallicRoughness: Scene from textures is missing!");
+                Tools.Error("_ConvertSpecularGlossinessTexturesToMetallicRoughness: Scene from textures is missing!");
+                return null;
             }
 
             const resizedTextures = this._ResizeTexturesToSameDimensions(diffuseTexture, specularGlossinessTexture, scene);
@@ -569,7 +579,8 @@ module BABYLON.GLTF2 {
                 diffuseBuffer = (resizedTextures.texture1.readPixels()) as Uint8Array;
             }
             else {
-                throw new Error("_ConvertSpecularGlossinessTexturesToMetallicRoughness: Pixel array buffer type not supported for texture: " + resizedTextures.texture1.name);
+                Tools.Error("_ConvertSpecularGlossinessTexturesToMetallicRoughness: Pixel array buffer type not supported for texture: " + resizedTextures.texture1.name);
+                return null;
             }
             pixels = resizedTextures.texture2.readPixels();
 
@@ -577,7 +588,8 @@ module BABYLON.GLTF2 {
                 specularGlossinessBuffer = (resizedTextures.texture2.readPixels()) as Uint8Array;
             }
             else {
-                throw new Error("_ConvertSpecularGlossinessTexturesToMetallicRoughness: Pixel array buffer type not supported for texture: " + resizedTextures.texture2.name);
+                Tools.Error("_ConvertSpecularGlossinessTexturesToMetallicRoughness: Pixel array buffer type not supported for texture: " + resizedTextures.texture2.name);
+                return null;
             }
 
             const byteLength = specularGlossinessBuffer.byteLength;
@@ -675,9 +687,9 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Converts specular glossiness material properties to metallic roughness.
-         * @param specularGlossiness - interface with specular glossiness material properties.
-         * @returns - interface with metallic roughness material properties.
+         * Converts specular glossiness material properties to metallic roughness
+         * @param specularGlossiness interface with specular glossiness material properties
+         * @returns interface with metallic roughness material properties
          */
         private static _ConvertSpecularGlossinessToMetallicRoughness(specularGlossiness: _IPBRSpecularGlossiness): _IPBRMetallicRoughness {
             const diffusePerceivedBrightness = _GLTFMaterial._GetPerceivedBrightness(specularGlossiness.diffuseColor);
@@ -699,9 +711,9 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Calculates the surface reflectance, independent of lighting conditions.
-         * @param color - Color source to calculate brightness from.
-         * @returns number representing the perceived brightness, or zero if color is undefined. 
+         * Calculates the surface reflectance, independent of lighting conditions
+         * @param color Color source to calculate brightness from
+         * @returns number representing the perceived brightness, or zero if color is undefined
          */
         private static _GetPerceivedBrightness(color: Color3): number {
             if (color) {
@@ -711,9 +723,9 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Returns the maximum color component value.
+         * Returns the maximum color component value
          * @param color 
-         * @returns maximum color component value, or zero if color is null or undefined.
+         * @returns maximum color component value, or zero if color is null or undefined
          */
         private static _GetMaxComponent(color: Color3): number {
             if (color) {
@@ -723,15 +735,15 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Convert a PBRMaterial (Metallic/Roughness) to Metallic Roughness factors.
-         * @param babylonPBRMaterial - BJS PBR Metallic Roughness Material.
-         * @param mimeType - mime type to use for the textures.
-         * @param images - array of glTF image interfaces.
-         * @param textures - array of glTF texture interfaces.
-         * @param glTFPbrMetallicRoughness - glTF PBR Metallic Roughness interface.
-         * @param imageData - map of image file name to data.
-         * @param hasTextureCoords - specifies if texture coordinates are present on the submesh to determine if textures should be applied.
-         * @returns - glTF PBR Metallic Roughness factors.
+         * Convert a PBRMaterial (Metallic/Roughness) to Metallic Roughness factors
+         * @param babylonPBRMaterial BJS PBR Metallic Roughness Material
+         * @param mimeType mime type to use for the textures
+         * @param images array of glTF image interfaces
+         * @param textures array of glTF texture interfaces
+         * @param glTFPbrMetallicRoughness glTF PBR Metallic Roughness interface
+         * @param imageData map of image file name to data
+         * @param hasTextureCoords specifies if texture coordinates are present on the submesh to determine if textures should be applied
+         * @returns glTF PBR Metallic Roughness factors
          */
         private static _ConvertMetalRoughFactorsToMetallicRoughness(babylonPBRMaterial: PBRMaterial, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], glTFPbrMetallicRoughness: IMaterialPbrMetallicRoughness, imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }, hasTextureCoords: boolean): _IPBRMetallicRoughness {
             const metallicRoughness = {
@@ -758,24 +770,25 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Convert a PBRMaterial (Specular/Glossiness) to Metallic Roughness factors.
-         * @param babylonPBRMaterial - BJS PBR Metallic Roughness Material.
-         * @param mimeType - mime type to use for the textures.
-         * @param images - array of glTF image interfaces.
-         * @param textures - array of glTF texture interfaces.
-         * @param glTFPbrMetallicRoughness - glTF PBR Metallic Roughness interface.
-         * @param imageData - map of image file name to data.
-         * @param hasTextureCoords - specifies if texture coordinates are present on the submesh to determine if textures should be applied.
-         * @returns - glTF PBR Metallic Roughness factors.
+         * Convert a PBRMaterial (Specular/Glossiness) to Metallic Roughness factors
+         * @param babylonPBRMaterial BJS PBR Metallic Roughness Material
+         * @param mimeType mime type to use for the textures
+         * @param images array of glTF image interfaces
+         * @param textures array of glTF texture interfaces
+         * @param glTFPbrMetallicRoughness glTF PBR Metallic Roughness interface
+         * @param imageData map of image file name to data
+         * @param hasTextureCoords specifies if texture coordinates are present on the submesh to determine if textures should be applied
+         * @returns glTF PBR Metallic Roughness factors
          */
-        private static _ConvertSpecGlossFactorsToMetallicRoughness(babylonPBRMaterial: PBRMaterial, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], glTFPbrMetallicRoughness: IMaterialPbrMetallicRoughness, imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }, hasTextureCoords: boolean): _IPBRMetallicRoughness {
+        private static _ConvertSpecGlossFactorsToMetallicRoughness(babylonPBRMaterial: PBRMaterial, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], glTFPbrMetallicRoughness: IMaterialPbrMetallicRoughness, imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }, hasTextureCoords: boolean): Nullable<_IPBRMetallicRoughness> {
             const specGloss: _IPBRSpecularGlossiness = {
                 diffuseColor: babylonPBRMaterial.albedoColor || Color3.White(),
                 specularColor: babylonPBRMaterial.reflectivityColor || Color3.White(),
                 glossiness: babylonPBRMaterial.microSurface || 1,
             };
             if (babylonPBRMaterial.reflectivityTexture && !babylonPBRMaterial.useMicroSurfaceFromReflectivityMapAlpha) {
-                throw new Error("_ConvertPBRMaterial: Glossiness values not included in the reflectivity texture currently not supported");
+                Tools.Error("_ConvertPBRMaterial: Glossiness values not included in the reflectivity texture currently not supported");
+                return null;
             }
 
             let metallicRoughnessFactors = this._ConvertSpecularGlossinessTexturesToMetallicRoughness(babylonPBRMaterial.albedoTexture, babylonPBRMaterial.reflectivityTexture, specGloss, mimeType);
@@ -803,14 +816,14 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Converts a Babylon PBR Metallic Roughness Material to a glTF Material.
-         * @param babylonPBRMaterial - BJS PBR Metallic Roughness Material.
-         * @param mimeType - mime type to use for the textures.
-         * @param images - array of glTF image interfaces.
-         * @param textures - array of glTF texture interfaces.
-         * @param materials - array of glTF material interfaces.
-         * @param imageData - map of image file name to data.
-         * @param hasTextureCoords - specifies if texture coordinates are present on the submesh to determine if textures should be applied.
+         * Converts a Babylon PBR Metallic Roughness Material to a glTF Material
+         * @param babylonPBRMaterial BJS PBR Metallic Roughness Material
+         * @param mimeType mime type to use for the textures
+         * @param images array of glTF image interfaces
+         * @param textures array of glTF texture interfaces
+         * @param materials array of glTF material interfaces
+         * @param imageData map of image file name to data
+         * @param hasTextureCoords specifies if texture coordinates are present on the submesh to determine if textures should be applied
          */
         public static _ConvertPBRMaterial(babylonPBRMaterial: PBRMaterial, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], materials: IMaterial[], imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }, hasTextureCoords: boolean) {
             const glTFPbrMetallicRoughness: IMaterialPbrMetallicRoughness = {};
@@ -826,83 +839,90 @@ module BABYLON.GLTF2 {
             else {
                 metallicRoughness = this._ConvertSpecGlossFactorsToMetallicRoughness(babylonPBRMaterial, mimeType, images, textures, glTFPbrMetallicRoughness, imageData, hasTextureCoords);
             }
+            if (metallicRoughness) {
+                if (!(this.FuzzyEquals(metallicRoughness.baseColor, Color3.White(), this._epsilon) && babylonPBRMaterial.alpha >= this._epsilon)) {
+                    glTFPbrMetallicRoughness.baseColorFactor = [
+                        metallicRoughness.baseColor.r,
+                        metallicRoughness.baseColor.g,
+                        metallicRoughness.baseColor.b,
+                        babylonPBRMaterial.alpha
+                    ];
+                }
 
-            if (!(this.FuzzyEquals(metallicRoughness.baseColor, Color3.White(), this._epsilon) && babylonPBRMaterial.alpha >= this._epsilon)) {
-                glTFPbrMetallicRoughness.baseColorFactor = [
-                    metallicRoughness.baseColor.r,
-                    metallicRoughness.baseColor.g,
-                    metallicRoughness.baseColor.b,
-                    babylonPBRMaterial.alpha
-                ];
-            }
-
-            if (metallicRoughness.metallic != null && metallicRoughness.metallic !== 1) {
-                glTFPbrMetallicRoughness.metallicFactor = metallicRoughness.metallic;
-            }
-            if (metallicRoughness.roughness != null && metallicRoughness.roughness !== 1) {
-                glTFPbrMetallicRoughness.roughnessFactor = metallicRoughness.roughness;
-            }
-
-            if (babylonPBRMaterial.backFaceCulling != null && !babylonPBRMaterial.backFaceCulling) {
-                if (!babylonPBRMaterial.twoSidedLighting) {
-                    Tools.Warn(babylonPBRMaterial.name + ": Back-face culling enabled and two-sided lighting disabled is not supported in glTF.");
+                if (metallicRoughness.metallic != null && metallicRoughness.metallic !== 1) {
+                    glTFPbrMetallicRoughness.metallicFactor = metallicRoughness.metallic;
                 }
-                glTFMaterial.doubleSided = true;
-            }
-            if (hasTextureCoords) {
-                if (babylonPBRMaterial.bumpTexture) {
-                    const glTFTexture = _GLTFMaterial._ExportTexture(babylonPBRMaterial.bumpTexture, mimeType, images, textures, imageData);
-                    if (glTFTexture) {
-                        glTFMaterial.normalTexture = glTFTexture;
+                if (metallicRoughness.roughness != null && metallicRoughness.roughness !== 1) {
+                    glTFPbrMetallicRoughness.roughnessFactor = metallicRoughness.roughness;
+                }
+
+                if (babylonPBRMaterial.backFaceCulling != null && !babylonPBRMaterial.backFaceCulling) {
+                    if (!babylonPBRMaterial.twoSidedLighting) {
+                        Tools.Warn(babylonPBRMaterial.name + ": Back-face culling enabled and two-sided lighting disabled is not supported in glTF.");
                     }
+                    glTFMaterial.doubleSided = true;
                 }
-                if (babylonPBRMaterial.ambientTexture) {
-                    const glTFTexture = _GLTFMaterial._ExportTexture(babylonPBRMaterial.ambientTexture, mimeType, images, textures, imageData);
-                    if (glTFTexture) {
-                        let occlusionTexture: IMaterialOcclusionTextureInfo = {
-                            index: glTFTexture.index
-                        };
+                if (hasTextureCoords) {
+                    if (babylonPBRMaterial.bumpTexture) {
+                        const glTFTexture = _GLTFMaterial._ExportTexture(babylonPBRMaterial.bumpTexture, mimeType, images, textures, imageData);
+                        if (glTFTexture) {
+                            glTFMaterial.normalTexture = glTFTexture;
+                        }
+                    }
+                    if (babylonPBRMaterial.ambientTexture) {
+                        const glTFTexture = _GLTFMaterial._ExportTexture(babylonPBRMaterial.ambientTexture, mimeType, images, textures, imageData);
+                        if (glTFTexture) {
+                            let occlusionTexture: IMaterialOcclusionTextureInfo = {
+                                index: glTFTexture.index
+                            };
 
-                        glTFMaterial.occlusionTexture = occlusionTexture;
+                            glTFMaterial.occlusionTexture = occlusionTexture;
 
-                        if (babylonPBRMaterial.ambientTextureStrength) {
-                            occlusionTexture.strength = babylonPBRMaterial.ambientTextureStrength;
+                            if (babylonPBRMaterial.ambientTextureStrength) {
+                                occlusionTexture.strength = babylonPBRMaterial.ambientTextureStrength;
+                            }
                         }
                     }
-                }
-                if (babylonPBRMaterial.emissiveTexture) {
-                    const glTFTexture = _GLTFMaterial._ExportTexture(babylonPBRMaterial.emissiveTexture, mimeType, images, textures, imageData);
-                    if (glTFTexture != null) {
-                        glTFMaterial.emissiveTexture = glTFTexture;
+                    if (babylonPBRMaterial.emissiveTexture) {
+                        const glTFTexture = _GLTFMaterial._ExportTexture(babylonPBRMaterial.emissiveTexture, mimeType, images, textures, imageData);
+                        if (glTFTexture != null) {
+                            glTFMaterial.emissiveTexture = glTFTexture;
+                        }
                     }
-                }       
-            }
-            if (!this.FuzzyEquals(babylonPBRMaterial.emissiveColor, Color3.Black(), this._epsilon)) {
-                glTFMaterial.emissiveFactor = babylonPBRMaterial.emissiveColor.asArray();
-            }
-            if (babylonPBRMaterial.transparencyMode != null) {
-                const alphaMode = _GLTFMaterial._GetAlphaMode(babylonPBRMaterial);
-
-                if (alphaMode !== MaterialAlphaMode.OPAQUE) { //glTF defaults to opaque
-                    glTFMaterial.alphaMode = alphaMode;
-                    if (alphaMode === MaterialAlphaMode.BLEND) {
-                        glTFMaterial.alphaCutoff = babylonPBRMaterial.alphaCutOff;
+                }
+                if (!this.FuzzyEquals(babylonPBRMaterial.emissiveColor, Color3.Black(), this._epsilon)) {
+                    glTFMaterial.emissiveFactor = babylonPBRMaterial.emissiveColor.asArray();
+                }
+                if (babylonPBRMaterial.transparencyMode != null) {
+                    const alphaMode = _GLTFMaterial._GetAlphaMode(babylonPBRMaterial);
+                    if (alphaMode) {
+                        if (alphaMode !== MaterialAlphaMode.OPAQUE) { //glTF defaults to opaque
+                            glTFMaterial.alphaMode = alphaMode;
+                            if (alphaMode === MaterialAlphaMode.BLEND) {
+                                glTFMaterial.alphaCutoff = babylonPBRMaterial.alphaCutOff;
+                            }
+                        }
                     }
                 }
+
+                glTFMaterial.pbrMetallicRoughness = glTFPbrMetallicRoughness;
+                materials.push(glTFMaterial);
             }
+        }
 
-            glTFMaterial.pbrMetallicRoughness = glTFPbrMetallicRoughness;
-            materials.push(glTFMaterial);
+        private static GetPixelsFromTexture(babylonTexture: Texture): Uint8Array | Float32Array {
+            let pixels = babylonTexture.textureType === Engine.TEXTURETYPE_UNSIGNED_INT ? babylonTexture.readPixels() as Uint8Array : babylonTexture.readPixels() as Float32Array;
+            return pixels;
         }
 
         /**
-         * Extracts a texture from a Babylon texture into file data and glTF data.
-         * @param babylonTexture - Babylon texture to extract.
-         * @param mimeType - Mime Type of the babylonTexture.
-         * @param images - Array of glTF images.
-         * @param textures - Array of glTF textures.
-         * @param imageData - map of image file name and data.
-         * @return - glTF texture info, or null if the texture format is not supported.
+         * Extracts a texture from a Babylon texture into file data and glTF data
+         * @param babylonTexture Babylon texture to extract
+         * @param mimeType Mime Type of the babylonTexture
+         * @param images Array of glTF images
+         * @param textures Array of glTF textures
+         * @param imageData map of image file name and data
+         * @return glTF texture info, or null if the texture format is not supported
          */
         private static _ExportTexture(babylonTexture: BaseTexture, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }): Nullable<ITextureInfo> {
             let textureName = "texture_" + (textures.length - 1).toString();
@@ -924,12 +944,13 @@ module BABYLON.GLTF2 {
                 extension = ".png";
             }
             else {
-                throw new Error("Unsupported mime type " + mimeType);
+                Tools.Error("Unsupported mime type " + mimeType);
+                return null;
             }
             textureName = baseFile + extension;
 
 
-            const pixels = babylonTexture.readPixels() as Uint8Array;
+            const pixels = _GLTFMaterial.GetPixelsFromTexture(babylonTexture as Texture);
 
             const size = babylonTexture.getSize();
 
@@ -939,14 +960,14 @@ module BABYLON.GLTF2 {
         }
 
         /**
-         * Builds a texture from base64 string.
-         * @param base64Texture - base64 texture string.
-         * @param textureName - Name to use for the texture.
-         * @param mimeType - image mime type for the texture.
-         * @param images - array of images.
-         * @param textures - array of textures.
-         * @param imageData - map of image data.
-         * @returns - glTF texture info, or null if the texture format is not supported.
+         * Builds a texture from base64 string
+         * @param base64Texture base64 texture string
+         * @param textureName Name to use for the texture
+         * @param mimeType image mime type for the texture
+         * @param images array of images
+         * @param textures array of textures
+         * @param imageData map of image data
+         * @returns glTF texture info, or null if the texture format is not supported
          */
         private static _GetTextureInfoFromBase64(base64Texture: string, textureName: string, mimeType: ImageMimeType, images: IImage[], textures: ITexture[], imageData: { [fileName: string]: { data: Uint8Array, mimeType: ImageMimeType } }): Nullable<ITextureInfo> {
             let textureInfo: Nullable<ITextureInfo> = null;
@@ -956,8 +977,9 @@ module BABYLON.GLTF2 {
             };
 
             const binStr = atob(base64Texture.split(',')[1]);
-            const arr = new Uint8Array(binStr.length);
-            for (let i = 0; i < binStr.length; ++i) {
+            let arrBuff = new ArrayBuffer(binStr.length);
+            const arr = new Uint8Array(arrBuff);
+            for (let i = 0, length = binStr.length; i < length; ++i) {
                 arr[i] = binStr.charCodeAt(i);
             }
             const imageValues = { data: arr, mimeType: mimeType };
@@ -967,7 +989,7 @@ module BABYLON.GLTF2 {
                 const glTFImage: IImage = {
                     uri: textureName
                 }
-                let foundIndex = -1;
+                let foundIndex: number = -1;
                 for (let i = 0; i < images.length; ++i) {
                     if (images[i].uri === textureName) {
                         foundIndex = i;

serializers/src/glTF/2.0/babylon.glTFSerializer.ts

@@ -6,12 +6,15 @@ module BABYLON {
      */
     export interface IExporterOptions {
         /**
-         * Function which indicates whether a babylon mesh should be exported or not.
-         * @param mesh - source Babylon mesh. It is used to check whether it should be 
-         * exported to glTF or not.
+         * Function which indicates whether a babylon mesh should be exported or not
+         * @param mesh source Babylon mesh. It is used to check whether it should be exported to glTF or not
          * @returns boolean, which indicates whether the mesh should be exported (true) or not (false)
          */
         shouldExportMesh?(mesh: AbstractMesh): boolean;
+        /**
+         * The sample rate to bake animation curves
+         */
+        animationSampleRate?: number;
     };
 
     /**
@@ -19,39 +22,41 @@ module BABYLON {
      */
     export class GLTF2Export {
         /**
-         * Exports the geometry of the scene to .gltf file format.
-         * @param scene - Babylon scene with scene hierarchy information.
-         * @param filePrefix - File prefix to use when generating the glTF file.
-         * @param options - Exporter options.
-         * @returns - Returns an object with a .gltf file and associates texture names
-         * as keys and their data and paths as values.
+         * Exports the geometry of the scene to .gltf file format
+         * @param scene Babylon scene with scene hierarchy information
+         * @param filePrefix File prefix to use when generating the glTF file
+         * @param options Exporter options
+         * @returns Returns an object with a .gltf file and associates texture names
+         * as keys and their data and paths as values
          */
-        public static GLTF(scene: Scene, filePrefix: string, options?: IExporterOptions): _GLTFData {
+        public static GLTF(scene: Scene, filePrefix: string, options?: IExporterOptions): Nullable<GLTFData> {
             const glTFPrefix = filePrefix.replace(/\.[^/.]+$/, "");
             const gltfGenerator = new GLTF2._Exporter(scene, options);
             if (scene.isReady) {
                 return gltfGenerator._generateGLTF(glTFPrefix);
             }
             else {
-                throw new Error("glTF Serializer: Scene is not ready!");
+                Tools.Error("glTF Serializer: Scene is not ready!");
+                return null;
             } 
         }
 
         /**
-         * Exports the geometry of the scene to .glb file format.
-         * @param scene - Babylon scene with scene hierarchy information.
-         * @param filePrefix - File prefix to use when generating glb file.
-         * @param options - Exporter options.
-         * @returns - Returns an object with a .glb filename as key and data as value
+         * Exports the geometry of the scene to .glb file format
+         * @param scene Babylon scene with scene hierarchy information
+         * @param filePrefix File prefix to use when generating glb file
+         * @param options Exporter options
+         * @returns Returns an object with a .glb filename as key and data as value
          */
-        public static GLB(scene: Scene, filePrefix: string, options?: IExporterOptions): _GLTFData {
+        public static GLB(scene: Scene, filePrefix: string, options?: IExporterOptions): Nullable<GLTFData> {
             const glTFPrefix = filePrefix.replace(/\.[^/.]+$/, "");        
             const gltfGenerator = new GLTF2._Exporter(scene, options);
             if (scene.isReady) {
                 return gltfGenerator._generateGLB(glTFPrefix);
             }
             else {
-                throw new Error("glTF Serializer: Scene is not ready!");
+                Tools.Error("glTF Serializer: Scene is not ready!");
+                return null;
             }  
         }
     }

serializers/src/glTF/2.0/babylon.glTFUtilities.ts

@@ -0,0 +1,135 @@
+/// <reference path="../../../../dist/babylon.glTF2Interface.d.ts"/>
+
+module BABYLON.GLTF2 {
+    /**
+     * @hidden
+     */
+    export class _GLTFUtilities {
+        /**
+         * Creates a buffer view based on the supplied arguments
+         * @param bufferIndex index value of the specified buffer
+         * @param byteOffset byte offset value
+         * @param byteLength byte length of the bufferView
+         * @param byteStride byte distance between conequential elements
+         * @param name name of the buffer view
+         * @returns bufferView for glTF
+         */
+        public static CreateBufferView(bufferIndex: number, byteOffset: number, byteLength: number, byteStride?: number, name?: string): IBufferView {
+            let bufferview: IBufferView = { buffer: bufferIndex, byteLength: byteLength };
+            if (byteOffset) {
+                bufferview.byteOffset = byteOffset;
+            }
+            if (name) {
+                bufferview.name = name;
+            }
+            if (byteStride) {
+                bufferview.byteStride = byteStride;
+            }
+
+            return bufferview;
+        }
+
+        /**
+         * Creates an accessor based on the supplied arguments
+         * @param bufferviewIndex The index of the bufferview referenced by this accessor
+         * @param name The name of the accessor
+         * @param type The type of the accessor
+         * @param componentType The datatype of components in the attribute
+         * @param count The number of attributes referenced by this accessor
+         * @param byteOffset The offset relative to the start of the bufferView in bytes
+         * @param min Minimum value of each component in this attribute
+         * @param max Maximum value of each component in this attribute
+         * @returns accessor for glTF 
+         */
+        public static CreateAccessor(bufferviewIndex: number, name: string, type: AccessorType, componentType: AccessorComponentType, count: number, byteOffset: Nullable<number>, min: Nullable<number[]>, max: Nullable<number[]>): IAccessor {
+            let accessor: IAccessor = { name: name, bufferView: bufferviewIndex, componentType: componentType, count: count, type: type };
+
+            if (min) {
+                accessor.min = min;
+            }
+            if (max) {
+                accessor.max = max;
+            }
+            if (byteOffset) {
+                accessor.byteOffset = byteOffset;
+            }
+
+            return accessor;
+        }
+
+        /**
+         * Calculates the minimum and maximum values of an array of position floats
+         * @param positions Positions array of a mesh
+         * @param vertexStart Starting vertex offset to calculate min and max values
+         * @param vertexCount Number of vertices to check for min and max values
+         * @returns min number array and max number array
+         */
+        public static CalculateMinMaxPositions(positions: FloatArray, vertexStart: number, vertexCount: number, convertToRightHandedSystem: boolean): { min: number[], max: number[] } {
+            const min = [Infinity, Infinity, Infinity];
+            const max = [-Infinity, -Infinity, -Infinity];
+            const positionStrideSize = 3;
+            let indexOffset: number;
+            let position: Vector3;
+            let vector: number[];
+
+            if (vertexCount) {
+                for (let i = vertexStart, length = vertexStart + vertexCount; i < length; ++i) {
+                    indexOffset = positionStrideSize * i;
+
+                    position = Vector3.FromArray(positions, indexOffset);
+                    if (convertToRightHandedSystem) {
+                        _GLTFUtilities.GetRightHandedVector3FromRef(position);
+                    }
+                    vector = position.asArray();
+
+                    for (let j = 0; j < positionStrideSize; ++j) {
+                        let num = vector[j];
+                        if (num < min[j]) {
+                            min[j] = num;
+                        }
+                        if (num > max[j]) {
+                            max[j] = num;
+                        }
+                        ++indexOffset;
+                    }
+                }
+            }
+            return { min, max };
+        }
+
+        /**
+         * Converts a new right-handed Vector3
+         * @param vector vector3 array
+         * @returns right-handed Vector3
+         */
+        public static GetRightHandedVector3(vector: Vector3): Vector3 {
+            return new Vector3(vector.x, vector.y, -vector.z);
+        }
+
+        /**
+         * Converts a Vector3 to right-handed
+         * @param vector Vector3 to convert to right-handed
+         */
+        public static GetRightHandedVector3FromRef(vector: Vector3) {
+            vector.z *= -1;
+        }
+
+        /**
+         * Converts a Vector4 to right-handed
+         * @param vector Vector4 to convert to right-handed
+         */
+        public static GetRightHandedVector4FromRef(vector: Vector4) {
+            vector.z *= -1;
+            vector.w *= -1;
+        }
+
+        /**
+         * Converts a Quaternion to right-handed
+         * @param quaternion Source quaternion to convert to right-handed
+         */
+        public static GetRightHandedQuaternionFromRef(quaternion: Quaternion) {
+            quaternion.x *= -1;
+            quaternion.y *= -1;
+        }
+    }
+}

src/Actions/babylon.action.ts

@@ -11,7 +11,7 @@
 
         /**
          * Internal only - manager for action
-         * @ignore 
+         * @hidden 
          */
         public _actionManager: ActionManager;
 
@@ -30,7 +30,9 @@
          * @param triggerOptions the trigger, with or without parameters, for the action
          * @param condition an optional determinant of action 
          */
-        constructor(public triggerOptions: any, condition?: Condition) {
+        constructor(
+            /** the trigger, with or without parameters, for the action */
+            public triggerOptions: any, condition?: Condition) {
 
             if (triggerOptions.parameter) {
                 this.trigger = triggerOptions.trigger;
@@ -45,7 +47,7 @@
 
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         public _prepare(): void {
         }
@@ -60,7 +62,7 @@
 
         /**
          * Internal only - executes current action event
-         * @ignore 
+         * @hidden 
          */
         public _executeCurrent(evt?: ActionEvent): void {
             if (this._nextActiveAction._condition) {
@@ -116,7 +118,7 @@
 
         /**
          * Adds action to chain of actions, may be a DoNothingAction
-         * @param index The index of the attribute.
+         * @param action defines the next action to execute
          * @returns The action passed in
          * @see https://www.babylonjs-playground.com/#1T30HR#0
          */
@@ -131,7 +133,7 @@
 
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         public _getProperty(propertyPath: string): string {
             return this._actionManager._getProperty(propertyPath);
@@ -139,7 +141,7 @@
 
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         public _getEffectiveTarget(target: any, propertyPath: string): any {
             return this._actionManager._getEffectiveTarget(target, propertyPath);
@@ -155,7 +157,7 @@
         
         /**
          * Internal only called by serialize
-         * @ignore 
+         * @hidden 
          */
         protected _serialize(serializedAction: any, parent?: any): any {
             var serializationObject: any = { 
@@ -189,7 +191,7 @@
         
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         public static _SerializeValueAsString = (value: any): string => {
             if (typeof value === "number") {
@@ -219,7 +221,7 @@
         
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         public static _GetTargetProperty = (target: Scene | Node) => {
             return {

src/Actions/babylon.actionManager.ts

@@ -5,20 +5,36 @@
      */
     export class ActionEvent {
         /**
-         * @param source The mesh or sprite that triggered the action.
+         * Creates a new ActionEvent
+         * @param source The mesh or sprite that triggered the action
          * @param pointerX The X mouse cursor position at the time of the event
          * @param pointerY The Y mouse cursor position at the time of the event
          * @param meshUnderPointer The mesh that is currently pointed at (can be null)
          * @param sourceEvent the original (browser) event that triggered the ActionEvent
+         * @param additionalData additional data for the event
          */
-        constructor(public source: any, public pointerX: number, public pointerY: number, public meshUnderPointer: Nullable<AbstractMesh>, public sourceEvent?: any, public additionalData?: any) {
+        constructor(
+            /** The mesh or sprite that triggered the action */
+            public source: any, 
+            /** The X mouse cursor position at the time of the event */
+            public pointerX: number, 
+            /** The Y mouse cursor position at the time of the event */
+            public pointerY: number, 
+            /** The mesh that is currently pointed at (can be null) */
+            public meshUnderPointer: Nullable<AbstractMesh>, 
+            /** the original (browser) event that triggered the ActionEvent */
+            public sourceEvent?: any, 
+            /** additional data for the event */
+            public additionalData?: any) {
 
         }
 
         /**
          * Helper function to auto-create an ActionEvent from a source mesh.
          * @param source The source mesh that triggered the event
-         * @param evt {Event} The original (browser) event
+         * @param evt The original (browser) event
+         * @param additionalData additional data for the event
+         * @returns the new ActionEvent
          */
         public static CreateNew(source: AbstractMesh, evt?: Event, additionalData?: any): ActionEvent {
             var scene = source.getScene();
@@ -26,10 +42,12 @@
         }
 
         /**
-         * Helper function to auto-create an ActionEvent from a source mesh.
+         * Helper function to auto-create an ActionEvent from a source sprite
          * @param source The source sprite that triggered the event
          * @param scene Scene associated with the sprite
-         * @param evt {Event} The original (browser) event
+         * @param evt The original (browser) event
+         * @param additionalData additional data for the event
+         * @returns the new ActionEvent
          */
         public static CreateNewFromSprite(source: Sprite, scene: Scene, evt?: Event, additionalData?: any): ActionEvent {
             return new ActionEvent(source, scene.pointerX, scene.pointerY, scene.meshUnderPointer, evt, additionalData);
@@ -38,12 +56,21 @@
         /**
          * Helper function to auto-create an ActionEvent from a scene. If triggered by a mesh use ActionEvent.CreateNew
          * @param scene the scene where the event occurred
-         * @param evt {Event} The original (browser) event
+         * @param evt The original (browser) event
+         * @returns the new ActionEvent
          */
         public static CreateNewFromScene(scene: Scene, evt: Event): ActionEvent {
             return new ActionEvent(null, scene.pointerX, scene.pointerY, scene.meshUnderPointer, evt);
         }
 
+        /**
+         * Helper function to auto-create an ActionEvent from a primitive
+         * @param prim defines the target primitive
+         * @param pointerPos defines the pointer position
+         * @param evt The original (browser) event
+         * @param additionalData additional data for the event
+         * @returns the new ActionEvent
+         */
         public static CreateNewFromPrimitive(prim: any, pointerPos: Vector2, evt?: Event, additionalData?: any): ActionEvent {
             return new ActionEvent(prim, pointerPos.x, pointerPos.y, null, evt, additionalData);
         }
@@ -52,6 +79,7 @@
     /**
      * Action Manager manages all events to be triggered on a given mesh or the global scene.
      * A single scene can have many Action Managers to handle predefined actions on specific meshes.
+     * @see http://doc.babylonjs.com/how_to/how_to_use_actions
      */
     export class ActionManager {
         // Statics
@@ -73,84 +101,159 @@
         private static _OnKeyUpTrigger = 15;
         private static _OnPickOutTrigger = 16;
 
+        /**
+         * Nothing
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get NothingTrigger(): number {
             return ActionManager._NothingTrigger;
         }
 
+        /** 
+         * On pick 
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnPickTrigger(): number {
             return ActionManager._OnPickTrigger;
         }
 
+        /** 
+         * On left pick
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnLeftPickTrigger(): number {
             return ActionManager._OnLeftPickTrigger;
         }
 
+        /** 
+         * On right pick
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnRightPickTrigger(): number {
             return ActionManager._OnRightPickTrigger;
         }
 
+        /** 
+         * On center pick 
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnCenterPickTrigger(): number {
             return ActionManager._OnCenterPickTrigger;
         }
 
+        /** 
+         * On pick down
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnPickDownTrigger(): number {
             return ActionManager._OnPickDownTrigger;
         }
 
+        /** 
+         * On double pick
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnDoublePickTrigger(): number {
             return ActionManager._OnDoublePickTrigger;
         }
 
+        /** 
+         * On pick up
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnPickUpTrigger(): number {
             return ActionManager._OnPickUpTrigger;
         }
 
-        /// This trigger will only be raised if you also declared a OnPickDown
+        /**
+         * On pick out.
+         * This trigger will only be raised if you also declared a OnPickDown
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnPickOutTrigger(): number {
             return ActionManager._OnPickOutTrigger;
         }
 
+        /** 
+         * On long press
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnLongPressTrigger(): number {
             return ActionManager._OnLongPressTrigger;
         }
 
+        /** 
+         * On pointer over
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnPointerOverTrigger(): number {
             return ActionManager._OnPointerOverTrigger;
         }
 
+        /** 
+         * On pointer out
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnPointerOutTrigger(): number {
             return ActionManager._OnPointerOutTrigger;
         }
 
+        /** 
+         * On every frame
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnEveryFrameTrigger(): number {
             return ActionManager._OnEveryFrameTrigger;
         }
 
+        /** 
+         * On intersection enter
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnIntersectionEnterTrigger(): number {
             return ActionManager._OnIntersectionEnterTrigger;
         }
 
+        /** 
+         * On intersection exit
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnIntersectionExitTrigger(): number {
             return ActionManager._OnIntersectionExitTrigger;
         }
 
+        /**
+         * On key down
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnKeyDownTrigger(): number {
             return ActionManager._OnKeyDownTrigger;
         }
 
+        /**
+         * On key up
+         * @see http://doc.babylonjs.com/how_to/how_to_use_actions#triggers
+         */
         public static get OnKeyUpTrigger(): number {
             return ActionManager._OnKeyUpTrigger;
         }
 
+        /** Gets the list of active triggers */
         public static Triggers: { [key: string]: number } = {};
 
         // Members
+        /** Gets the list of actions */
         public actions = new Array<Action>();
 
+        /** Gets the cursor to use when hovering items */
         public hoverCursor: string = '';
 
         private _scene: Scene;
 
+        /**
+         * Creates a new action manager
+         * @param scene defines the hosting scene
+         */
         constructor(scene: Scene) {
             this._scene = scene || Engine.LastCreatedScene;
 
@@ -158,6 +261,10 @@
         }
 
         // Methods
+
+        /**
+         * Releases all associated resources
+         */
         public dispose(): void {
             var index = this._scene._actionManagers.indexOf(this);
 
@@ -174,14 +281,18 @@
             }
         }
 
+        /** 
+         * Gets hosting scene 
+         * @returns the hosting scene
+         */
         public getScene(): Scene {
             return this._scene;
         }
 
         /**
          * Does this action manager handles actions of any of the given triggers
-         * @param {number[]} triggers - the triggers to be tested
-         * @return {boolean} whether one (or more) of the triggers is handeled 
+         * @param triggers defines the triggers to be tested
+         * @return a boolean indicating whether one (or more) of the triggers is handled 
          */
         public hasSpecificTriggers(triggers: number[]): boolean {
             for (var index = 0; index < this.actions.length; index++) {
@@ -221,7 +332,6 @@
 
         /**
          * Does this action manager has pointer triggers
-         * @return {boolean} whether or not it has pointer triggers
          */
         public get hasPointerTriggers(): boolean {
             for (var index = 0; index < this.actions.length; index++) {
@@ -237,7 +347,6 @@
 
         /**
          * Does this action manager has pick triggers
-         * @return {boolean} whether or not it has pick triggers
          */
         public get hasPickTriggers(): boolean {
             for (var index = 0; index < this.actions.length; index++) {
@@ -253,8 +362,7 @@
 
         /**
          * Does exist one action manager with at least one trigger 
-         * @return {boolean} whether or not it exists one action manager with one trigger
-        **/
+         **/
         public static get HasTriggers(): boolean {
             for (var t in ActionManager.Triggers) {
                 if (ActionManager.Triggers.hasOwnProperty(t)) {
@@ -266,8 +374,7 @@
 
         /**
          * Does exist one action manager with at least one pick trigger 
-         * @return {boolean} whether or not it exists one action manager with one pick trigger
-        **/
+         **/
         public static get HasPickTriggers(): boolean {
             for (var t in ActionManager.Triggers) {
                 if (ActionManager.Triggers.hasOwnProperty(t)) {
@@ -282,8 +389,8 @@
 
         /**
          * Does exist one action manager that handles actions of a given trigger
-         * @param {number} trigger - the trigger to be tested
-         * @return {boolean} whether the trigger is handeled by at least one action manager
+         * @param trigger defines the trigger to be tested
+         * @return a boolean indicating whether the trigger is handeled by at least one action manager
         **/
         public static HasSpecificTrigger(trigger: number): boolean {
             for (var t in ActionManager.Triggers) {
@@ -299,8 +406,8 @@
 
         /**
          * Registers an action to this action manager
-         * @param {BABYLON.Action} action - the action to be registered
-         * @return {BABYLON.Action} the action amended (prepared) after registration
+         * @param action defines the action to be registered
+         * @return the action amended (prepared) after registration
          */
         public registerAction(action: Action): Nullable<Action> {
             if (action.trigger === ActionManager.OnEveryFrameTrigger) {
@@ -327,8 +434,8 @@
 
         /**
          * Unregisters an action to this action manager
-         * @param action The action to be unregistered
-         * @return whether the action has been unregistered
+         * @param action defines the action to be unregistered
+         * @return a boolean indicating whether the action has been unregistered
          */
         public unregisterAction(action: Action): Boolean {
             var index = this.actions.indexOf(action);
@@ -346,8 +453,8 @@
 
         /**
          * Process a specific trigger
-         * @param {number} trigger - the trigger to process
-         * @param evt {BABYLON.ActionEvent} the event details to be processed
+         * @param trigger defines the trigger to process
+         * @param evt defines the event details to be processed
          */
         public processTrigger(trigger: number, evt?: ActionEvent): void {
             for (var index = 0; index < this.actions.length; index++) {
@@ -381,6 +488,7 @@
             }
         }
 
+        /** @hidden */
         public _getEffectiveTarget(target: any, propertyPath: string): any {
             var properties = propertyPath.split(".");
 
@@ -391,12 +499,18 @@
             return target;
         }
 
+        /** @hidden */
         public _getProperty(propertyPath: string): string {
             var properties = propertyPath.split(".");
 
             return properties[properties.length - 1];
         }
 
+        /**
+         * Serialize this manager to a JSON object
+         * @param name defines the property name to store this manager
+         * @returns a JSON representation of this manager
+         */
         public serialize(name: string): any {
             var root = {
                 children: new Array(),
@@ -441,7 +555,13 @@
             return root;
         }
 
-        public static Parse(parsedActions: any, object: Nullable<AbstractMesh>, scene: Scene) {
+        /**
+         * Creates a new ActionManager from a JSON data
+         * @param parsedActions defines the JSON data to read from
+         * @param object defines the hosting mesh
+         * @param scene defines the hosting scene
+         */
+        public static Parse(parsedActions: any, object: Nullable<AbstractMesh>, scene: Scene): void {
             var actionManager = new ActionManager(scene);
             if (object === null)
                 scene.actionManager = actionManager;
@@ -626,6 +746,11 @@
             }
         }
 
+        /**
+         * Get a trigger name by index
+         * @param trigger defines the trigger index
+         * @returns a trigger name
+         */
         public static GetTriggerName(trigger: number): string {
             switch (trigger) {
                 case 0: return "NothingTrigger";

src/Actions/babylon.condition.ts

@@ -5,19 +5,19 @@
     export class Condition {
         /**
          * Internal only - manager for action
-         * @ignore 
+         * @hidden 
          */
         public _actionManager: ActionManager;
 
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         public _evaluationId: number;
 
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         public _currentResult: boolean;
 
@@ -39,7 +39,7 @@
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         public _getProperty(propertyPath: string): string {
             return this._actionManager._getProperty(propertyPath);
@@ -47,7 +47,7 @@
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         public _getEffectiveTarget(target: any, propertyPath: string): any {
             return this._actionManager._getEffectiveTarget(target, propertyPath);
@@ -62,7 +62,7 @@
         
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         protected _serialize(serializedCondition: any): any {
             return { 
@@ -81,25 +81,25 @@
         
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         private static _IsEqual = 0;
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         private static _IsDifferent = 1;
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         private static _IsGreater = 2;
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         private static _IsLesser = 3;
 
@@ -133,25 +133,25 @@
 
         /**
          * Internal only The action manager for the condition
-         * @ignore 
+         * @hidden 
          */
         public _actionManager: ActionManager;
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         private _target: any;
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         private _effectiveTarget: any;
 
         /**
          * Internal only 
-         * @ignore 
+         * @hidden 
          */
         private _property: string;
 
@@ -241,7 +241,7 @@
         
         /**
          * Internal only - manager for action
-         * @ignore 
+         * @hidden 
          */
         public _actionManager: ActionManager;
 
@@ -272,13 +272,13 @@
         
         /**
          * Internal only - manager for action
-         * @ignore 
+         * @hidden 
          */
         public _actionManager: ActionManager;
 
         /**
          * Internal only
-         * @ignore 
+         * @hidden 
          */
         private _target: any;
 

src/Animations/babylon.animation.ts

@@ -1,8 +1,27 @@
 module BABYLON {
+    /**
+     * Represents the range of an animation
+     */
     export class AnimationRange {
-        constructor(public name: string, public from: number, public to: number) {
+        /**
+         * Initializes the range of an animation
+         * @param name The name of the animation range
+         * @param from The starting frame of the animation
+         * @param to The ending frame of the animation
+         */
+        constructor(
+            /**The name of the animation range**/
+            public name: string, 
+            /**The starting frame of the animation */
+            public from: number, 
+            /**The ending frame of the animation*/
+            public to: number) {
         }
 
+        /**
+         * Makes a copy of the animation range
+         * @returns A copy of the animation range
+         */
         public clone(): AnimationRange {
             return new AnimationRange(this.name, this.from, this.to);
         }
@@ -12,37 +31,90 @@
      * Composed of a frame, and an action function
      */
     export class AnimationEvent {
+        /**
+         * Specifies if the animation event is done
+         */
         public isDone: boolean = false;
-        constructor(public frame: number, public action: () => void, public onlyOnce?: boolean) {
+
+        /**
+         * Initializes the animation event
+         * @param frame The frame for which the event is triggered
+         * @param action The event to perform when triggered
+         * @param onlyOnce Specifies if the event should be triggered only once
+         */
+        constructor(
+            /** The frame for which the event is triggered **/
+            public frame: number,
+            /** The event to perform when triggered **/
+            public action: () => void , 
+            /** Specifies if the event should be triggered only once**/
+            public onlyOnce?: boolean ) {
         }
     }
 
+    /**
+     * A cursor which tracks a point on a path
+     */
     export class PathCursor {
+        /**
+         * Stores path cursor callbacks for when an onchange event is triggered
+         */
         private _onchange = new Array<(cursor: PathCursor) => void>();
 
+        /**
+         * The value of the path cursor
+         */
         value: number = 0;
+
+        /**
+         * The animation array of the path cursor
+         */
         animations = new Array<Animation>();
 
+        /**
+         * Initializes the path cursor
+         * @param path The path to track
+         */
         constructor(private path: Path2) {
         }
 
+        /**
+         * Gets the cursor point on the path
+         * @returns A point on the path cursor at the cursor location
+         */
         public getPoint(): Vector3 {
             var point = this.path.getPointAtLengthPosition(this.value);
             return new Vector3(point.x, 0, point.y);
         }
 
+        /**
+         * Moves the cursor ahead by the step amount
+         * @param step The amount to move the cursor forward
+         * @returns This path cursor
+         */
         public moveAhead(step: number = 0.002): PathCursor {
             this.move(step);
 
             return this;
         }
 
+        /**
+         * Moves the cursor behind by the step amount
+         * @param step The amount to move the cursor back
+         * @returns This path cursor
+         */
         public moveBack(step: number = 0.002): PathCursor {
             this.move(-step);
 
             return this;
         }
 
+        /**
+         * Moves the cursor by the step amount
+         * If the step amount is greater than one, an exception is thrown
+         * @param step The amount to move the cursor
+         * @returns This path cursor
+         */
         public move(step: number): PathCursor {
 
             if (Math.abs(step) > 1) {
@@ -56,6 +128,10 @@
             return this;
         }
 
+        /**
+         * Ensures that the value is limited between zero and one
+         * @returns This path cursor
+         */
         private ensureLimits(): PathCursor {
             while (this.value > 1) {
                 this.value -= 1;
@@ -67,13 +143,21 @@
             return this;
         }
 
-        // used by animation engine
+        /**
+         * Runs onchange callbacks on change (used by the animation engine)
+         * @returns This path cursor
+         */
         private raiseOnChange(): PathCursor {
             this._onchange.forEach(f => f(this));
 
             return this;
         }
 
+        /**
+         * Executes a function on change
+         * @param f A path cursor onchange callback
+         * @returns This path cursor
+         */
         public onchange(f: (cursor: PathCursor) => void): PathCursor {
             this._onchange.push(f);
 
@@ -81,17 +165,38 @@
         }
     }
 
+    /**
+     * Defines an interface which represents an animation key frame
+     */
     export interface IAnimationKey {
+        /**
+         * Frame of the key frame
+         */
         frame: number;
+        /**
+         * Value at the specifies key frame
+         */
         value: any;
+        /**
+         * The input tangent for the cubic hermite spline
+         */
         inTangent?: any;
+        /**
+         * The output tangent for the cubic hermite spline
+         */
         outTangent?: any;
+        /**
+         * The animation interpolation type
+         */
         interpolation?: AnimationKeyInterpolation;
     }
 
+    /**
+     * Enum for the animation key frame interpolation type
+     */
     export enum AnimationKeyInterpolation {
         /**
-         * Do not interpolate between keys and use the start key value only. Tangents are ignored.
+         * Do not interpolate between keys and use the start key value only. Tangents are ignored
          */
         STEP = 1
     }
@@ -110,21 +215,45 @@
          */
         public static AllowMatrixDecomposeForInterpolation = true;
 
+        /**
+         * Stores the key frames of the animation
+         */
         private _keys: Array<IAnimationKey>;
+
+        /**
+         * Stores the easing function of the animation
+         */
         private _easingFunction: IEasingFunction;
 
+        /**
+         * @hidden Internal use only
+         */
         public _runtimeAnimations = new Array<RuntimeAnimation>();
 
-        // The set of event that will be linked to this animation
+        /**
+         * The set of event that will be linked to this animation
+         */
         private _events = new Array<AnimationEvent>();
 
+        /**
+         * Stores an array of target property paths
+         */
         public targetPropertyPath: string[];
 
+        /**
+         * Stores the blending speed of the animation
+         */
         public blendingSpeed = 0.01;
 
+        /**
+         * Stores the animation ranges for the animation
+         */
         private _ranges: { [name: string]: Nullable<AnimationRange> } = {};
 
-        static _PrepareAnimation(name: string, targetProperty: string, framePerSecond: number, totalFrame: number,
+        /**
+         * @hidden Internal use
+         */
+        public static _PrepareAnimation(name: string, targetProperty: string, framePerSecond: number, totalFrame: number,
             from: any, to: any, loopMode?: number, easingFunction?: EasingFunction): Nullable<Animation> {
             var dataType = undefined;
 
@@ -159,10 +288,11 @@
         }
 
         /**
-		 * Sets up an animation.
-		 * @param property the property to animate
-		 * @param animationType the animation type to apply
-		 * @param easingFunction the easing function used in the animation
+		 * Sets up an animation
+		 * @param property The property to animate
+		 * @param animationType The animation type to apply
+         * @param framePerSecond The frames per second of the animation
+		 * @param easingFunction The easing function used in the animation
 		 * @returns The created animation
 		 */
         public static CreateAnimation(property: string, animationType: number, framePerSecond: number, easingFunction: EasingFunction): Animation {
@@ -179,15 +309,15 @@
 
         /**
          * Create and start an animation on a node
-         * @param {string} name defines the name of the global animation that will be run on all nodes
-         * @param {BABYLON.Node} node defines the root node where the animation will take place
-         * @param {string} targetProperty defines property to animate
-         * @param {number} framePerSecond defines the number of frame per second yo use
-         * @param {number} totalFrame defines the number of frames in total
-         * @param {any} from defines the initial value
-         * @param {any} to defines the final value
-         * @param {number} loopMode defines which loop mode you want to use (off by default)
-         * @param {BABYLON.EasingFunction} easingFunction defines the easing function to use (linear by default)
+         * @param name defines the name of the global animation that will be run on all nodes
+         * @param node defines the root node where the animation will take place
+         * @param targetProperty defines property to animate
+         * @param framePerSecond defines the number of frame per second yo use
+         * @param totalFrame defines the number of frames in total
+         * @param from defines the initial value
+         * @param to defines the final value
+         * @param loopMode defines which loop mode you want to use (off by default)
+         * @param easingFunction defines the easing function to use (linear by default)
          * @param onAnimationEnd defines the callback to call when animation end
          * @returns the animatable created for this animation
          */
@@ -206,16 +336,16 @@
 
         /**
          * Create and start an animation on a node and its descendants
-         * @param {string} name defines the name of the global animation that will be run on all nodes
-         * @param {BABYLON.Node} node defines the root node where the animation will take place
-         * @param {boolean} directDescendantsOnly if true only direct descendants will be used, if false direct and also indirect (children of children, an so on in a recursive manner) descendants will be used.
-         * @param {string} targetProperty defines property to animate
-         * @param {number} framePerSecond defines the number of frame per second yo use
-         * @param {number} totalFrame defines the number of frames in total
-         * @param {any} from defines the initial value
-         * @param {any} to defines the final value
-         * @param {number} loopMode defines which loop mode you want to use (off by default)
-         * @param {BABYLON.EasingFunction} easingFunction defines the easing function to use (linear by default)
+         * @param name defines the name of the global animation that will be run on all nodes
+         * @param node defines the root node where the animation will take place
+         * @param directDescendantsOnly if true only direct descendants will be used, if false direct and also indirect (children of children, an so on in a recursive manner) descendants will be used
+         * @param targetProperty defines property to animate
+         * @param framePerSecond defines the number of frame per second to use
+         * @param totalFrame defines the number of frames in total
+         * @param from defines the initial value
+         * @param to defines the final value
+         * @param loopMode defines which loop mode you want to use (off by default)
+         * @param easingFunction defines the easing function to use (linear by default)
          * @param onAnimationEnd defines the callback to call when an animation ends (will be called once per node)
          * @returns the list of animatables created for all nodes
          * @example https://www.babylonjs-playground.com/#MH0VLI
@@ -234,6 +364,20 @@
             return scene.beginDirectHierarchyAnimation(node, directDescendantsOnly, [animation], 0, totalFrame, (animation.loopMode === 1), 1.0, onAnimationEnd);
         }
 
+        /**
+         * Creates a new animation, merges it with the existing animations and starts it
+         * @param name Name of the animation
+         * @param node Node which contains the scene that begins the animations
+         * @param targetProperty Specifies which property to animate
+         * @param framePerSecond The frames per second of the animation
+         * @param totalFrame The total number of frames
+         * @param from The frame at the beginning of the animation
+         * @param to The frame at the end of the animation
+         * @param loopMode Specifies the loop mode of the animation
+         * @param easingFunction (Optional) The easing function of the animation, which allow custom mathematical formulas for animations
+         * @param onAnimationEnd Callback to run once the animation is complete
+         * @returns Nullable animation
+         */
         public static CreateMergeAndStartAnimation(name: string, node: Node, targetProperty: string,
             framePerSecond: number, totalFrame: number,
             from: any, to: any, loopMode?: number, easingFunction?: EasingFunction, onAnimationEnd?: () => void): Nullable<Animatable> {
@@ -250,7 +394,7 @@
         }
 
         /**
-		 * Transition property of the Camera to the target Value.
+		 * Transition property of the Camera to the target Value
 		 * @param property The property to transition
 		 * @param targetValue The target Value of the property
          * @param host The object where the property to animate belongs
@@ -258,10 +402,10 @@
          * @param frameRate Framerate (in frame/s) to use
 		 * @param transition The transition type we want to use
 		 * @param duration The duration of the animation, in milliseconds
-		 * @param onAnimationEnd Call back trigger at the end of the animation.
+		 * @param onAnimationEnd Callback trigger at the end of the animation
+         * @returns Nullable animation
 		 */
         public static TransitionTo(property: string, targetValue: any, host: any, scene: Scene, frameRate: number, transition: Animation, duration: number, onAnimationEnd: Nullable<() => void> = null): Nullable<Animatable> {
-
             if (duration <= 0) {
                 host[property] = targetValue;
                 if (onAnimationEnd) {
@@ -299,6 +443,9 @@
             return this._runtimeAnimations;
         }
 
+        /**
+         * Specifies if any of the runtime animations are currently running
+         */
         public get hasRunningRuntimeAnimations(): boolean {
             for (var runtimeAnimation of this._runtimeAnimations) {
                 if (!runtimeAnimation.isStopped) {
@@ -309,7 +456,28 @@
             return false;
         }
 
-        constructor(public name: string, public targetProperty: string, public framePerSecond: number, public dataType: number, public loopMode?: number, public enableBlending?: boolean) {
+        /**
+         * Initializes the animation
+         * @param name Name of the animation
+         * @param targetProperty Property to animate
+         * @param framePerSecond The frames per second of the animation
+         * @param dataType The data type of the animation
+         * @param loopMode The loop mode of the animation
+         * @param enableBlendings Specifies if blending should be enabled
+         */
+        constructor(
+            /**Name of the animation */
+            public name: string, 
+            /**Property to animate */
+            public targetProperty: string, 
+            /**The frames per second of the animation */
+            public framePerSecond: number, 
+            /**The data type of the animation */
+            public dataType: number,
+            /**The loop mode of the animation */ 
+            public loopMode?: number, 
+            /**Specifies if blending should be enabled */
+            public enableBlending?: boolean) {
             this.targetPropertyPath = targetProperty.split(".");
             this.dataType = dataType;
             this.loopMode = loopMode === undefined ? Animation.ANIMATIONLOOPMODE_CYCLE : loopMode;
@@ -317,7 +485,9 @@
 
         // Methods
         /**
-         * @param {boolean} fullDetails - support for multiple levels of logging within scene loading
+         * Converts the animation to a string
+         * @param fullDetails support for multiple levels of logging within scene loading
+         * @returns String form of the animation
          */
         public toString(fullDetails?: boolean): string {
             var ret = "Name: " + this.name + ", property: " + this.targetProperty;
@@ -340,7 +510,8 @@
         }
 
         /**
-         * Add an event to this animation.
+         * Add an event to this animation
+         * @param event Event to add
          */
         public addEvent(event: AnimationEvent): void {
             this._events.push(event);
@@ -348,7 +519,7 @@
 
         /**
          * Remove all events found at the given frame
-         * @param frame
+         * @param frame The frame to remove events from
          */
         public removeEvents(frame: number): void {
             for (var index = 0; index < this._events.length; index++) {
@@ -359,10 +530,20 @@
             }
         }
 
+        /**
+         * Retrieves all the events from the animation
+         * @returns Events from the animation
+         */
         public getEvents(): AnimationEvent[] {
             return this._events;
         }
 
+        /**
+         * Creates an animation range
+         * @param name Name of the animation range
+         * @param from Starting frame of the animation range
+         * @param to Ending frame of the animation
+         */
         public createRange(name: string, from: number, to: number): void {
             // check name not already in use; could happen for bones after serialized
             if (!this._ranges[name]) {
@@ -370,6 +551,11 @@
             }
         }
 
+        /**
+         * Deletes an animation range by name
+         * @param name Name of the animation range to delete
+         * @param deleteFrames Specifies if the key frames for the range should also be deleted (true) or not (false)
+         */
         public deleteRange(name: string, deleteFrames = true): void {
             let range = this._ranges[name];
             if (!range) {
@@ -391,15 +577,27 @@
 
         }
 
+        /**
+         * Gets the animation range by name, or null if not defined
+         * @param name Name of the animation range
+         * @returns Nullable animation range
+         */
         public getRange(name: string): Nullable<AnimationRange> {
             return this._ranges[name];
         }
 
-
+        /**
+         * Gets the key frames from the animation
+         * @returns The key frames of the animation
+         */
         public getKeys(): Array<IAnimationKey> {
             return this._keys;
         }
 
+        /**
+         * Gets the highest frame rate of the animation
+         * @returns Highest frame rate of the animation
+         */
         public getHighestFrame(): number {
             var ret = 0;
 
@@ -411,55 +609,278 @@
             return ret;
         }
 
-        public getEasingFunction() {
+        /**
+         * Gets the easing function of the animation
+         * @returns Easing function of the animation
+         */
+        public getEasingFunction(): IEasingFunction {
             return this._easingFunction;
         }
 
-        public setEasingFunction(easingFunction: EasingFunction) {
+        /**
+         * Sets the easing function of the animation
+         * @param easingFunction A custom mathematical formula for animation
+         */
+        public setEasingFunction(easingFunction: EasingFunction): void {
             this._easingFunction = easingFunction;
         }
 
+        /**
+         * Interpolates a scalar linearly
+         * @param startValue Start value of the animation curve
+         * @param endValue End value of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated scalar value
+         */
         public floatInterpolateFunction(startValue: number, endValue: number, gradient: number): number {
             return Scalar.Lerp(startValue, endValue, gradient);
         }
 
+        /**
+         * Interpolates a scalar cubically
+         * @param startValue Start value of the animation curve
+         * @param outTangent End tangent of the animation
+         * @param endValue End value of the animation curve
+         * @param inTangent Start tangent of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated scalar value
+         */
         public floatInterpolateFunctionWithTangents(startValue: number, outTangent: number, endValue: number, inTangent: number, gradient: number): number {
             return Scalar.Hermite(startValue, outTangent, endValue, inTangent, gradient);
         }
 
+        /**
+         * Interpolates a quaternion using a spherical linear interpolation
+         * @param startValue Start value of the animation curve
+         * @param endValue End value of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated quaternion value
+         */
         public quaternionInterpolateFunction(startValue: Quaternion, endValue: Quaternion, gradient: number): Quaternion {
             return Quaternion.Slerp(startValue, endValue, gradient);
         }
 
+        /**
+         * Interpolates a quaternion cubically
+         * @param startValue Start value of the animation curve
+         * @param outTangent End tangent of the animation curve
+         * @param endValue End value of the animation curve
+         * @param inTangent Start tangent of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated quaternion value
+         */
         public quaternionInterpolateFunctionWithTangents(startValue: Quaternion, outTangent: Quaternion, endValue: Quaternion, inTangent: Quaternion, gradient: number): Quaternion {
             return Quaternion.Hermite(startValue, outTangent, endValue, inTangent, gradient).normalize();
         }
 
+        /**
+         * Interpolates a Vector3 linearl
+         * @param startValue Start value of the animation curve
+         * @param endValue End value of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated scalar value
+         */
         public vector3InterpolateFunction(startValue: Vector3, endValue: Vector3, gradient: number): Vector3 {
             return Vector3.Lerp(startValue, endValue, gradient);
         }
 
+        /**
+         * Interpolates a Vector3 cubically
+         * @param startValue Start value of the animation curve
+         * @param outTangent End tangent of the animation
+         * @param endValue End value of the animation curve
+         * @param inTangent Start tangent of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns InterpolatedVector3 value
+         */
         public vector3InterpolateFunctionWithTangents(startValue: Vector3, outTangent: Vector3, endValue: Vector3, inTangent: Vector3, gradient: number): Vector3 {
             return Vector3.Hermite(startValue, outTangent, endValue, inTangent, gradient);
         }
 
+        /**
+         * Interpolates a Vector2 linearly
+         * @param startValue Start value of the animation curve
+         * @param endValue End value of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated Vector2 value
+         */
         public vector2InterpolateFunction(startValue: Vector2, endValue: Vector2, gradient: number): Vector2 {
             return Vector2.Lerp(startValue, endValue, gradient);
         }
 
+        /**
+         * Interpolates a Vector2 cubically
+         * @param startValue Start value of the animation curve
+         * @param outTangent End tangent of the animation
+         * @param endValue End value of the animation curve
+         * @param inTangent Start tangent of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated Vector2 value
+         */
         public vector2InterpolateFunctionWithTangents(startValue: Vector2, outTangent: Vector2, endValue: Vector2, inTangent: Vector2, gradient: number): Vector2 {
             return Vector2.Hermite(startValue, outTangent, endValue, inTangent, gradient);
         }
 
+        /**
+         * Interpolates a size linearly
+         * @param startValue Start value of the animation curve
+         * @param endValue End value of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated Size value
+         */
         public sizeInterpolateFunction(startValue: Size, endValue: Size, gradient: number): Size {
             return Size.Lerp(startValue, endValue, gradient);
         }
 
+        /**
+         * Interpolates a Color3 linearly
+         * @param startValue Start value of the animation curve
+         * @param endValue End value of the animation curve
+         * @param gradient Scalar amount to interpolate
+         * @returns Interpolated Color3 value
+         */
         public color3InterpolateFunction(startValue: Color3, endValue: Color3, gradient: number): Color3 {
             return Color3.Lerp(startValue, endValue, gradient);
         }
 
         /**
+         * @hidden Internal use only
+         */
+        public _getKeyValue(value: any): any {
+            if (typeof value === "function") {
+                return value();
+            }
+
+            return value;
+        } 
+
+        /**
+         * @hidden Internal use only
+         */
+        public _interpolate(currentFrame: number, repeatCount: number, workValue?: any, loopMode?: number, offsetValue?: any, highLimitValue?: any): any {
+            if (loopMode === Animation.ANIMATIONLOOPMODE_CONSTANT && repeatCount > 0) {
+                return highLimitValue.clone ? highLimitValue.clone() : highLimitValue;
+            }
+
+            let keys = this.getKeys();
+
+            // Try to get a hash to find the right key
+            var startKeyIndex = Math.max(0, Math.min(keys.length - 1, Math.floor(keys.length * (currentFrame - keys[0].frame) / (keys[keys.length - 1].frame - keys[0].frame)) - 1));
+
+            if (keys[startKeyIndex].frame >= currentFrame) {
+                while (startKeyIndex - 1 >= 0 && keys[startKeyIndex].frame >= currentFrame) {
+                    startKeyIndex--;
+                }
+            }
+
+            for (var key = startKeyIndex; key < keys.length; key++) {
+                var endKey = keys[key + 1];
+
+                if (endKey.frame >= currentFrame) {
+
+                    var startKey = keys[key];
+                    var startValue = this._getKeyValue(startKey.value);
+                    if (startKey.interpolation === AnimationKeyInterpolation.STEP) {
+                        return startValue;
+                    }
+
+                    var endValue = this._getKeyValue(endKey.value);
+
+                    var useTangent = startKey.outTangent !== undefined && endKey.inTangent !== undefined;
+                    var frameDelta = endKey.frame - startKey.frame;
+
+                    // gradient : percent of currentFrame between the frame inf and the frame sup
+                    var gradient = (currentFrame - startKey.frame) / frameDelta;
+
+                    // check for easingFunction and correction of gradient
+                    let easingFunction = this.getEasingFunction();
+                    if (easingFunction != null) {
+                        gradient = easingFunction.ease(gradient);
+                    }
+
+                    switch (this.dataType) {
+                        // Float
+                        case Animation.ANIMATIONTYPE_FLOAT:
+                            var floatValue = useTangent ? this.floatInterpolateFunctionWithTangents(startValue, startKey.outTangent * frameDelta, endValue, endKey.inTangent * frameDelta, gradient) : this.floatInterpolateFunction(startValue, endValue, gradient);
+                            switch (loopMode) {
+                                case Animation.ANIMATIONLOOPMODE_CYCLE:
+                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
+                                    return floatValue;
+                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
+                                    return offsetValue * repeatCount + floatValue;
+                            }
+                            break;
+                        // Quaternion
+                        case Animation.ANIMATIONTYPE_QUATERNION:
+                            var quatValue = useTangent ? this.quaternionInterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this.quaternionInterpolateFunction(startValue, endValue, gradient);
+                            switch (loopMode) {
+                                case Animation.ANIMATIONLOOPMODE_CYCLE:
+                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
+                                    return quatValue;
+                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
+                                    return quatValue.addInPlace(offsetValue.scale(repeatCount));
+                            }
+
+                            return quatValue;
+                        // Vector3
+                        case Animation.ANIMATIONTYPE_VECTOR3:
+                            var vec3Value = useTangent ? this.vector3InterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this.vector3InterpolateFunction(startValue, endValue, gradient);
+                            switch (loopMode) {
+                                case Animation.ANIMATIONLOOPMODE_CYCLE:
+                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
+                                    return vec3Value;
+                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
+                                    return vec3Value.add(offsetValue.scale(repeatCount));
+                            }
+                        // Vector2
+                        case Animation.ANIMATIONTYPE_VECTOR2:
+                            var vec2Value = useTangent ? this.vector2InterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this.vector2InterpolateFunction(startValue, endValue, gradient);
+                            switch (loopMode) {
+                                case Animation.ANIMATIONLOOPMODE_CYCLE:
+                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
+                                    return vec2Value;
+                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
+                                    return vec2Value.add(offsetValue.scale(repeatCount));
+                            }
+                        // Size
+                        case Animation.ANIMATIONTYPE_SIZE:
+                            switch (loopMode) {
+                                case Animation.ANIMATIONLOOPMODE_CYCLE:
+                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
+                                    return this.sizeInterpolateFunction(startValue, endValue, gradient);
+                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
+                                    return this.sizeInterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
+                            }
+                        // Color3
+                        case Animation.ANIMATIONTYPE_COLOR3:
+                            switch (loopMode) {
+                                case Animation.ANIMATIONLOOPMODE_CYCLE:
+                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
+                                    return this.color3InterpolateFunction(startValue, endValue, gradient);
+                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
+                                    return this.color3InterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
+                            }
+                        // Matrix
+                        case Animation.ANIMATIONTYPE_MATRIX:
+                            switch (loopMode) {
+                                case Animation.ANIMATIONLOOPMODE_CYCLE:
+                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
+                                    if (Animation.AllowMatricesInterpolation) {
+                                        return this.matrixInterpolateFunction(startValue, endValue, gradient, workValue);
+                                    }
+                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
+                                    return startValue;
+                            }
+                        default:
+                            break;
+                    }
+                    break;
+                }
+            }
+            return this._getKeyValue(keys[keys.length - 1].value);
+        }
+
+        /**
          * Defines the function to use to interpolate matrices
          * @param startValue defines the start matrix
          * @param endValue defines the end matrix
@@ -483,6 +904,10 @@
             return Matrix.Lerp(startValue, endValue, gradient);
         }
 
+        /**
+         * Makes a copy of the animation
+         * @returns Cloned animation
+         */
         public clone(): Animation {
             var clone = new Animation(this.name, this.targetPropertyPath.join("."), this.framePerSecond, this.dataType, this.loopMode);
 
@@ -507,10 +932,18 @@
             return clone;
         }
 
+        /**
+         * Sets the key frames of the animation
+         * @param values The animation key frames to set
+         */
         public setKeys(values: Array<IAnimationKey>): void {
             this._keys = values.slice(0);
         }
 
+        /**
+         * Serializes the animation to an object
+         * @returns Serialized object
+         */
         public serialize(): any {
             var serializationObject: any = {};
 
@@ -564,57 +997,122 @@
         }
 
         // Statics
+        /**
+         * Float animation type
+         */
         private static _ANIMATIONTYPE_FLOAT = 0;
+        /**
+         * Vector3 animation type
+         */
         private static _ANIMATIONTYPE_VECTOR3 = 1;
+        /**
+         * Quaternion animation type
+         */
         private static _ANIMATIONTYPE_QUATERNION = 2;
+        /**
+         * Matrix animation type
+         */
         private static _ANIMATIONTYPE_MATRIX = 3;
+        /**
+         * Color3 animation type
+         */
         private static _ANIMATIONTYPE_COLOR3 = 4;
+        /**
+         * Vector2 animation type
+         */
         private static _ANIMATIONTYPE_VECTOR2 = 5;
+        /**
+         * Size animation type
+         */
         private static _ANIMATIONTYPE_SIZE = 6;
+        /**
+         * Relative Loop Mode
+         */
         private static _ANIMATIONLOOPMODE_RELATIVE = 0;
+        /**
+         * Cycle Loop Mode
+         */
         private static _ANIMATIONLOOPMODE_CYCLE = 1;
+        /**
+         * Constant Loop Mode
+         */
         private static _ANIMATIONLOOPMODE_CONSTANT = 2;
 
+        /**
+         * Get the float animation type
+         */
         public static get ANIMATIONTYPE_FLOAT(): number {
             return Animation._ANIMATIONTYPE_FLOAT;
         }
 
+        /**
+         * Get the Vector3 animation type
+         */
         public static get ANIMATIONTYPE_VECTOR3(): number {
             return Animation._ANIMATIONTYPE_VECTOR3;
         }
 
+        /**
+         * Get the Vectpr2 animation type
+         */
         public static get ANIMATIONTYPE_VECTOR2(): number {
             return Animation._ANIMATIONTYPE_VECTOR2;
         }
 
+        /**
+         * Get the Size animation type
+         */
         public static get ANIMATIONTYPE_SIZE(): number {
             return Animation._ANIMATIONTYPE_SIZE;
         }
 
+        /**
+         * Get the Quaternion animation type
+         */
         public static get ANIMATIONTYPE_QUATERNION(): number {
             return Animation._ANIMATIONTYPE_QUATERNION;
         }
 
+        /**
+         * Get the Matrix animation type
+         */
         public static get ANIMATIONTYPE_MATRIX(): number {
             return Animation._ANIMATIONTYPE_MATRIX;
         }
 
+        /**
+         * Get the Color3 animation type
+         */
         public static get ANIMATIONTYPE_COLOR3(): number {
             return Animation._ANIMATIONTYPE_COLOR3;
         }
 
+        /**
+         * Get the Relative Loop Mode
+         */
         public static get ANIMATIONLOOPMODE_RELATIVE(): number {
             return Animation._ANIMATIONLOOPMODE_RELATIVE;
         }
 
+        /**
+         * Get the Cycle Loop Mode
+         */
         public static get ANIMATIONLOOPMODE_CYCLE(): number {
             return Animation._ANIMATIONLOOPMODE_CYCLE;
         }
 
+        /**
+         * Get the Constant Loop Mode
+         */
         public static get ANIMATIONLOOPMODE_CONSTANT(): number {
             return Animation._ANIMATIONLOOPMODE_CONSTANT;
         }
 
+        /**
+         * Parses an animation object and creates an animation
+         * @param parsedAnimation Parsed animation object
+         * @returns Animation object
+         */
         public static Parse(parsedAnimation: any): Animation {
             var animation = new Animation(parsedAnimation.name, parsedAnimation.property, parsedAnimation.framePerSecond, parsedAnimation.dataType, parsedAnimation.loopBehavior);
 
@@ -698,7 +1196,12 @@
             return animation;
         }
 
-        public static AppendSerializedAnimations(source: IAnimatable, destination: any): any {
+        /**
+         * Appends the serialized animations from the source animations
+         * @param source Source containing the animations
+         * @param destination Target to store the animations
+         */
+        public static AppendSerializedAnimations(source: IAnimatable, destination: any): void {
             if (source.animations) {
                 destination.animations = [];
                 for (var animationIndex = 0; animationIndex < source.animations.length; animationIndex++) {

src/Animations/babylon.runtimeAnimation.ts

@@ -1,28 +1,104 @@
 module BABYLON {
 
+    /**
+     * Defines a runtime animation
+     */
     export class RuntimeAnimation {
+        /**
+         * The current frame of the runtime animation
+         */
         private _currentFrame: number = 0;
+
+        /**
+         * The animation used by the runtime animation
+         */
         private _animation: Animation;
+        
+        /**
+         * The target of the runtime animation
+         */
         private _target: any;
-        private _host: Animatable;
 
+        /**
+         * The initiating animatable
+         */
+        private _host: Animatable;
+        
+        /**
+         * The original value of the runtime animation
+         */
         private _originalValue: any;
+        
+        /**
+         * The original blend value of the runtime animation
+         */
         private _originalBlendValue: any;
+        
+        /**
+         * The offsets cache of the runtime animation
+         */
         private _offsetsCache: {[key: string]: any} = {};
+        
+        /**
+         * The high limits cache of the runtime animation
+         */
         private _highLimitsCache: {[key: string]: any} = {};
+        
+        /**
+         * Specifies if the runtime animation has been stopped
+         */
         private _stopped = false;
+        
+        /**
+         * The blending factor of the runtime animation
+         */
         private _blendingFactor = 0;
+        
+        /**
+         * The BabylonJS scene
+         */
         private _scene: Scene;
 
+        /**
+         * The current value of the runtime animation
+         */
         private _currentValue: any;
-        /** @ignore */
+        
+        /** @hidden */
         public _workValue: any;
+        
+        /**
+         * The active target of the runtime animation
+         */
         private _activeTarget: any;
+        
+        /**
+         * The target path of the runtime animation
+         */
         private _targetPath: string = "";
+        
+        /**
+         * The weight of the runtime animation
+         */
         private _weight = 1.0;
 
         /**
-         * Gets the current frame
+         * The ratio offset of the runtime animation
+         */
+        private _ratioOffset = 0;
+
+        /**
+         * The previous delay of the runtime animation
+         */
+        private _previousDelay: number = 0;
+        
+        /**
+         * The previous ratio of the runtime animation
+         */
+        private _previousRatio: number = 0;
+
+        /**
+         * Gets the current frame of the runtime animation
          */
         public get currentFrame(): number {
             return this._currentFrame;
@@ -50,7 +126,7 @@
         }
 
         /**
-         * Gets the path where to store the animated value in the target
+         * Gets the target path of the runtime animation
          */
         public get targetPath(): string {
             return this._targetPath;
@@ -66,7 +142,7 @@
         /**
          * Create a new RuntimeAnimation object
          * @param target defines the target of the animation
-         * @param animation defines the source {BABYLON.Animation} object
+         * @param animation defines the source animation object
          * @param scene defines the hosting scene
          * @param host defines the initiating Animatable
          */
@@ -79,10 +155,16 @@
             animation._runtimeAnimations.push(this);
         }
 
+        /**
+         * Gets the animation from the runtime animation
+         */
         public get animation(): Animation {
             return this._animation;
         }
 
+        /**
+         * Resets the runtime animation to the beginning
+         */
         public reset(): void {
             this._offsetsCache = {};
             this._highLimitsCache = {};
@@ -91,10 +173,17 @@
             this._originalValue = null;
         }
 
+        /**
+         * Specifies if the runtime animation is stopped
+         * @returns Boolean specifying if the runtime animation is stopped
+         */
         public isStopped(): boolean {
             return this._stopped;
         }        
 
+        /**
+         * Disposes of the runtime animation
+         */
         public dispose(): void {
             let index = this._animation.runtimeAnimations.indexOf(this);
 
@@ -102,139 +191,24 @@
                 this._animation.runtimeAnimations.splice(index, 1);
             }
         }
-
-        private _getKeyValue(value: any): any {
-            if (typeof value === "function") {
-                return value();
-            }
-
-            return value;
-        }      
         
-        private _interpolate(currentFrame: number, repeatCount: number, loopMode?: number, offsetValue?: any, highLimitValue?: any) {
-            if (loopMode === Animation.ANIMATIONLOOPMODE_CONSTANT && repeatCount > 0) {
-                return highLimitValue.clone ? highLimitValue.clone() : highLimitValue;
-            }
-
+        /**
+         * Interpolates the animation from the current frame
+         * @param currentFrame The frame to interpolate the animation to
+         * @param repeatCount The number of times that the animation should loop
+         * @param loopMode The type of looping mode to use
+         * @param offsetValue Animation offset value
+         * @param highLimitValue The high limit value
+         * @returns The interpolated value
+         */
+        private _interpolate(currentFrame: number, repeatCount: number, loopMode?: number, offsetValue?: any, highLimitValue?: any): any {
             this._currentFrame = currentFrame;
 
-            let keys = this._animation.getKeys();
-
-            // Try to get a hash to find the right key
-            var startKeyIndex = Math.max(0, Math.min(keys.length - 1, Math.floor(keys.length * (currentFrame - keys[0].frame) / (keys[keys.length - 1].frame - keys[0].frame)) - 1));
-
-            if (keys[startKeyIndex].frame >= currentFrame) {
-                while (startKeyIndex - 1 >= 0 && keys[startKeyIndex].frame >= currentFrame) {
-                    startKeyIndex--;
-                }
+            if (this._animation.dataType === Animation.ANIMATIONTYPE_MATRIX && !this._workValue) {
+                this._workValue = Matrix.Zero();
             }
 
-            for (var key = startKeyIndex; key < keys.length; key++) {
-                var endKey = keys[key + 1];
-
-                if (endKey.frame >= currentFrame) {
-
-                    var startKey = keys[key];
-                    var startValue = this._getKeyValue(startKey.value);
-                    if (startKey.interpolation === AnimationKeyInterpolation.STEP) {
-                        return startValue;
-                    }
-
-                    var endValue = this._getKeyValue(endKey.value);
-
-                    var useTangent = startKey.outTangent !== undefined && endKey.inTangent !== undefined;
-                    var frameDelta = endKey.frame - startKey.frame;
-
-                    // gradient : percent of currentFrame between the frame inf and the frame sup
-                    var gradient = (currentFrame - startKey.frame) / frameDelta;
-
-                    // check for easingFunction and correction of gradient
-                    let easingFunction = this._animation.getEasingFunction();
-                    if (easingFunction != null) {
-                        gradient = easingFunction.ease(gradient);
-                    }
-
-                    switch (this._animation.dataType) {
-                        // Float
-                        case Animation.ANIMATIONTYPE_FLOAT:
-                            var floatValue = useTangent ? this._animation.floatInterpolateFunctionWithTangents(startValue, startKey.outTangent * frameDelta, endValue, endKey.inTangent * frameDelta, gradient) : this._animation.floatInterpolateFunction(startValue, endValue, gradient);
-                            switch (loopMode) {
-                                case Animation.ANIMATIONLOOPMODE_CYCLE:
-                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                    return floatValue;
-                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                    return offsetValue * repeatCount + floatValue;
-                            }
-                            break;
-                        // Quaternion
-                        case Animation.ANIMATIONTYPE_QUATERNION:
-                            var quatValue = useTangent ? this._animation.quaternionInterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this._animation.quaternionInterpolateFunction(startValue, endValue, gradient);
-                            switch (loopMode) {
-                                case Animation.ANIMATIONLOOPMODE_CYCLE:
-                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                    return quatValue;
-                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                    return quatValue.addInPlace(offsetValue.scale(repeatCount));
-                            }
-
-                            return quatValue;
-                        // Vector3
-                        case Animation.ANIMATIONTYPE_VECTOR3:
-                            var vec3Value = useTangent ? this._animation.vector3InterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this._animation.vector3InterpolateFunction(startValue, endValue, gradient);
-                            switch (loopMode) {
-                                case Animation.ANIMATIONLOOPMODE_CYCLE:
-                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                    return vec3Value;
-                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                    return vec3Value.add(offsetValue.scale(repeatCount));
-                            }
-                        // Vector2
-                        case Animation.ANIMATIONTYPE_VECTOR2:
-                            var vec2Value = useTangent ? this._animation.vector2InterpolateFunctionWithTangents(startValue, startKey.outTangent.scale(frameDelta), endValue, endKey.inTangent.scale(frameDelta), gradient) : this._animation.vector2InterpolateFunction(startValue, endValue, gradient);
-                            switch (loopMode) {
-                                case Animation.ANIMATIONLOOPMODE_CYCLE:
-                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                    return vec2Value;
-                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                    return vec2Value.add(offsetValue.scale(repeatCount));
-                            }
-                        // Size
-                        case Animation.ANIMATIONTYPE_SIZE:
-                            switch (loopMode) {
-                                case Animation.ANIMATIONLOOPMODE_CYCLE:
-                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                    return this._animation.sizeInterpolateFunction(startValue, endValue, gradient);
-                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                    return this._animation.sizeInterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
-                            }
-                        // Color3
-                        case Animation.ANIMATIONTYPE_COLOR3:
-                            switch (loopMode) {
-                                case Animation.ANIMATIONLOOPMODE_CYCLE:
-                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                    return this._animation.color3InterpolateFunction(startValue, endValue, gradient);
-                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                    return this._animation.color3InterpolateFunction(startValue, endValue, gradient).add(offsetValue.scale(repeatCount));
-                            }
-                        // Matrix
-                        case Animation.ANIMATIONTYPE_MATRIX:
-                            switch (loopMode) {
-                                case Animation.ANIMATIONLOOPMODE_CYCLE:
-                                case Animation.ANIMATIONLOOPMODE_CONSTANT:
-                                    if (Animation.AllowMatricesInterpolation) {
-                                        this._workValue = this._animation.matrixInterpolateFunction(startValue, endValue, gradient, this._workValue);
-                                        return this._workValue;
-                                    }
-                                case Animation.ANIMATIONLOOPMODE_RELATIVE:
-                                    return startValue;
-                            }
-                        default:
-                            break;
-                    }
-                    break;
-                }
-            }
-            return this._getKeyValue(keys[keys.length - 1].value);
+            return this._animation._interpolate(currentFrame, repeatCount, this._workValue, loopMode, offsetValue, highLimitValue);
         }
 
         /**
@@ -253,6 +227,12 @@
             }
         }
 
+        /**
+         * Sets the value of the runtime animation
+         * @param target The target property of the runtime animation
+         * @param currentValue The current value to use for the runtime animation
+         * @param weight The weight to use for the runtime animation (Defaults to 1.0)
+         */
         private _setValue(target: any, currentValue: any, weight = 1.0): void {
             // Set value
             var path: any;
@@ -355,6 +335,10 @@
             }
         }
 
+        /**
+         * Gets the loop pmode of the runtime animation
+         * @returns Loop Mode
+         */
         private _getCorrectLoopMode(): number | undefined {
             if ( this._target && this._target.animationPropertiesOverride) {
                 return this._target.animationPropertiesOverride.loopMode;
@@ -381,16 +365,15 @@
             this.setValue(currentValue, -1);
         }
 
+        /**
+         * @hidden Internal use only
+         */
         public _prepareForSpeedRatioChange(newSpeedRatio: number): void {
             let newRatio = this._previousDelay * (this._animation.framePerSecond * newSpeedRatio) / 1000.0;
 
             this._ratioOffset = this._previousRatio - newRatio;
         }
 
-        private _ratioOffset = 0;
-        private _previousDelay: number = 0;
-        private _previousRatio: number = 0;
-
         /**
          * Execute the current animation
          * @param delay defines the delay to add to the current frame
@@ -445,7 +428,7 @@
 
             if (((to > from && ratio > range) || (from > to && ratio < range)) && !loop) { // If we are out of range and not looping get back to caller
                 returnValue = false;
-                highLimitValue = this._getKeyValue(keys[keys.length - 1].value);
+                highLimitValue = this._animation._getKeyValue(keys[keys.length - 1].value);
             } else {
                 // Get max value if required
 

src/Audio/babylon.analyser.ts

@@ -1,9 +1,33 @@
 module BABYLON {
+    /**
+     * Class used to work with sound analyzer using fast fourier transform (FFT)
+     * @see http://doc.babylonjs.com/how_to/playing_sounds_and_music
+     */
     export class Analyser {
+        /**
+         * Gets or sets the smoothing
+         * @ignorenaming
+         */
         public SMOOTHING = 0.75;
+        /**
+         * Gets or sets the FFT table size
+         * @ignorenaming
+         */
         public FFT_SIZE = 512;
+        /**
+         * Gets or sets the bar graph amplitude
+         * @ignorenaming
+         */
         public BARGRAPHAMPLITUDE = 256;
+        /**
+         * Gets or sets the position of the debug canvas
+         * @ignorenaming
+         */
         public DEBUGCANVASPOS = { x: 20, y: 20 };
+        /**
+         * Gets or sets the debug canvas size
+         * @ignorenaming
+         */
         public DEBUGCANVASSIZE = { width: 320, height: 200 }
 
         private _byteFreqs: Uint8Array;
@@ -16,6 +40,10 @@ module BABYLON {
         private _registerFunc: Nullable<() => void>;
         private _audioEngine: AudioEngine;
 
+        /**
+         * Creates a new analyser
+         * @param scene defines hosting scene
+         */
         constructor(scene: Scene) {
             this._scene = scene;
             this._audioEngine = Engine.audioEngine;
@@ -29,6 +57,11 @@ module BABYLON {
             }
         }
 
+        /**
+         * Get the number of data values you will have to play with for the visualization
+         * @see https://developer.mozilla.org/en-US/docs/Web/API/AnalyserNode/frequencyBinCount
+         * @returns a number
+         */
         public getFrequencyBinCount(): number {
             if (this._audioEngine.canUseWebAudio) {
                 return this._webAudioAnalyser.frequencyBinCount;
@@ -38,6 +71,11 @@ module BABYLON {
             }
         }
 
+        /**
+         * Gets the current frequency data as a byte array
+         * @see https://developer.mozilla.org/en-US/docs/Web/API/AnalyserNode/getByteFrequencyData
+         * @returns a Uint8Array
+         */
         public getByteFrequencyData(): Uint8Array {
             if (this._audioEngine.canUseWebAudio) {
                 this._webAudioAnalyser.smoothingTimeConstant = this.SMOOTHING;
@@ -47,6 +85,11 @@ module BABYLON {
             return this._byteFreqs;
         }
 
+        /**
+         * Gets the current waveform as a byte array
+         * @see https://developer.mozilla.org/en-US/docs/Web/API/AnalyserNode/getByteTimeDomainData
+         * @returns a Uint8Array
+         */
         public getByteTimeDomainData(): Uint8Array {
             if (this._audioEngine.canUseWebAudio) {
                 this._webAudioAnalyser.smoothingTimeConstant = this.SMOOTHING;
@@ -56,7 +99,12 @@ module BABYLON {
             return this._byteTime;
         }
 
-        public getFloatFrequencyData(): Uint8Array {
+        /**
+         * Gets the current frequency data as a float array
+         * @see https://developer.mozilla.org/en-US/docs/Web/API/AnalyserNode/getByteFrequencyData
+         * @returns a Float32Array
+         */        
+        public getFloatFrequencyData(): Float32Array {
             if (this._audioEngine.canUseWebAudio) {
                 this._webAudioAnalyser.smoothingTimeConstant = this.SMOOTHING;
                 this._webAudioAnalyser.fftSize = this.FFT_SIZE;
@@ -65,6 +113,9 @@ module BABYLON {
             return this._floatFreqs;
         }
 
+        /**
+         * Renders the debug canvas
+         */
         public drawDebugCanvas() {
             if (this._audioEngine.canUseWebAudio) {
                 if (!this._debugCanvas) {
@@ -102,6 +153,9 @@ module BABYLON {
             }
         }
 
+        /**
+         * Stops rendering the debug canvas and removes it
+         */
         public stopDebugCanvas() {
             if (this._debugCanvas) {
                 if (this._registerFunc) {
@@ -114,6 +168,11 @@ module BABYLON {
             }
         }
 
+        /**
+         * Connects two audio nodes
+         * @param inputAudioNode defines first node to connect
+         * @param outputAudioNode defines second node to connect
+         */
         public connectAudioNodes(inputAudioNode: AudioNode, outputAudioNode: AudioNode) {
             if (this._audioEngine.canUseWebAudio) {
                 inputAudioNode.connect(this._webAudioAnalyser);
@@ -121,6 +180,9 @@ module BABYLON {
             }
         }
 
+        /**
+         * Releases all associated resources
+         */
         public dispose() {
             if (this._audioEngine.canUseWebAudio) {
                 this._webAudioAnalyser.disconnect();

src/Bones/babylon.bone.ts

@@ -23,7 +23,7 @@
         public length: number;
 
         /** 
-         * @ignore Internal only
+         * @hidden Internal only
          * Set this value to map this bone to a different index in the transform matrices
          * Set this value to -1 to exclude the bone from the transform matrices
          */
@@ -38,20 +38,20 @@
         private _parent: Nullable<Bone>;
         private _scalingDeterminant = 1;
         private _worldTransform = new Matrix();
-        
+
         private _localScaling: Vector3;
         private _localRotation: Quaternion;
         private _localPosition: Vector3;
         private _needToDecompose = true;
         private _needToCompose = false;
 
-        /** @ignore */
+        /** @hidden */
         get _matrix(): Matrix {
             this._compose();
             return this._localMatrix;
         }
 
-        /** @ignore */
+        /** @hidden */
         set _matrix(value: Matrix) {
             this._localMatrix.copyFrom(value);
             this._needToDecompose = true;
@@ -84,7 +84,9 @@
 
             this.setParent(parentBone, false);
 
-            this._updateDifferenceMatrix();
+            if (baseMatrix || localMatrix) {
+                this._updateDifferenceMatrix();
+            }
         }
 
         // Members
@@ -202,7 +204,7 @@
         public set position(newPosition: Vector3) {
             this._decompose();
             this._localPosition.copyFrom(newPosition);
-            
+
             this._markAsDirtyAndCompose();
         }
 
@@ -267,23 +269,29 @@
         }
 
         /**
-         * Update the local matrix
-         * @param matrix defines the new local matrix
+         * Update the base and local matrices
+         * @param matrix defines the new base or local matrix
          * @param updateDifferenceMatrix defines if the difference matrix must be updated
+         * @param updateLocalMatrix defines if the local matrix should be updated
          */
-        public updateMatrix(matrix: Matrix, updateDifferenceMatrix = true): void {
+        public updateMatrix(matrix: Matrix, updateDifferenceMatrix = true, updateLocalMatrix = true): void {
             this._baseMatrix.copyFrom(matrix);
-            this._localMatrix.copyFrom(matrix);
 
             if (updateDifferenceMatrix) {
                 this._updateDifferenceMatrix();
             }
 
-            this._markAsDirtyAndDecompose();
+            if (updateLocalMatrix) {
+                this._localMatrix.copyFrom(matrix);
+                this._markAsDirtyAndDecompose();
+            }
+            else {
+                this.markAsDirty();
+            }
         }
 
-        /** @ignore */
-        public _updateDifferenceMatrix(rootMatrix?: Matrix): void {
+        /** @hidden */
+        public _updateDifferenceMatrix(rootMatrix?: Matrix, updateChildren = true): void {
             if (!rootMatrix) {
                 rootMatrix = this._baseMatrix;
             }
@@ -296,8 +304,10 @@
 
             this._absoluteTransform.invertToRef(this._invertedAbsoluteTransform);
 
-            for (var index = 0; index < this.children.length; index++) {
-                this.children[index]._updateDifferenceMatrix();
+            if (updateChildren) {
+                for (var index = 0; index < this.children.length; index++) {
+                    this.children[index]._updateDifferenceMatrix();
+                }
             }
 
             this._scalingDeterminant = (this._absoluteTransform.determinant() < 0 ? -1 : 1);
@@ -318,7 +328,7 @@
         }
 
         private _markAsDirtyAndDecompose() {
-            this.markAsDirty();            
+            this.markAsDirty();
             this._needToDecompose = true;
         }
 
@@ -540,12 +550,12 @@
          * Set the bone scaling in local space
          * @param scale defines the scaling vector
          */
-        public setScale(scale: Vector3): void {          
+        public setScale(scale: Vector3): void {
             this._decompose();
             this._localScaling.copyFrom(scale);
             this._markAsDirtyAndCompose();
-        }    
-        
+        }
+
         /**
          * Gets the current scaling in local space
          * @returns the current scaling vector
@@ -562,7 +572,7 @@
         public getScaleToRef(result: Vector3) {
             this._decompose();
             result.copyFrom(this._localScaling);
-        }        
+        }
 
         /**
          * Set the yaw, pitch, and roll of the bone in local or world space
@@ -575,7 +585,7 @@
         public setYawPitchRoll(yaw: number, pitch: number, roll: number, space = Space.LOCAL, mesh?: AbstractMesh): void {
             if (space === Space.LOCAL) {
                 var quat = Bone._tmpQuat;
-                Quaternion.RotationYawPitchRollToRef(yaw, pitch, roll, quat);                
+                Quaternion.RotationYawPitchRollToRef(yaw, pitch, roll, quat);
                 this.setRotationQuaternion(quat, space, mesh);
                 return;
             }
@@ -622,7 +632,7 @@
             if (space === Space.LOCAL) {
                 var quat = Bone._tmpQuat;
                 Quaternion.RotationAxisToRef(axis, angle, quat);
-    
+
                 this.setRotationQuaternion(quat, space, mesh);
                 return;
             }
@@ -661,7 +671,7 @@
                 this._localRotation.copyFrom(quat);
 
                 this._markAsDirtyAndCompose();
-    
+
                 return;
             }
 

src/Bones/babylon.skeleton.ts

@@ -293,17 +293,17 @@
             return this._scene.beginAnimation(this, range.from, range.to, loop, speedRatio, onAnimationEnd);
         }
 
-        /** @ignore */
+        /** @hidden */
         public _markAsDirty(): void {
             this._isDirty = true;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _registerMeshWithPoseMatrix(mesh: AbstractMesh): void {
             this._meshesWithPoseMatrix.push(mesh);
         }
 
-        /** @ignore */
+        /** @hidden */
         public _unregisterMeshWithPoseMatrix(mesh: AbstractMesh): void {
             var index = this._meshesWithPoseMatrix.indexOf(mesh);
 
@@ -312,7 +312,7 @@
             }
         }
 
-        /** @ignore */
+        /** @hidden */
         public _computeTransformMatrices(targetMatrix: Float32Array, initialSkinMatrix: Nullable<Matrix>): void {
 
             this.onBeforeComputeObservable.notifyObservers(this);

src/Cameras/Inputs/babylon.freeCameraMouseInput.ts

@@ -74,14 +74,11 @@ module BABYLON {
                         }
 
                         var offsetX = evt.clientX - this.previousPosition.x;
-                        var offsetY = evt.clientY - this.previousPosition.y;
-
-                        if (this.camera.getScene().useRightHandedSystem) {
-                            this.camera.cameraRotation.y -= offsetX / this.angularSensibility;
-                        } else {
-                            this.camera.cameraRotation.y += offsetX / this.angularSensibility;
-                        }
+                        if (this.camera.getScene().useRightHandedSystem) offsetX *= -1;
+                        if (this.camera.parent && this.camera.parent._getWorldMatrixDeterminant() < 0) offsetX *= -1;
+                        this.camera.cameraRotation.y += offsetX / this.angularSensibility;
 
+                        var offsetY = evt.clientY - this.previousPosition.y;
                         this.camera.cameraRotation.x += offsetY / this.angularSensibility;
 
                         this.previousPosition = {
@@ -106,14 +103,11 @@ module BABYLON {
                 }
 
                 var offsetX = evt.movementX || evt.mozMovementX || evt.webkitMovementX || evt.msMovementX || 0;
-                var offsetY = evt.movementY || evt.mozMovementY || evt.webkitMovementY || evt.msMovementY || 0;
-
-                if (this.camera.getScene().useRightHandedSystem) {
-                    this.camera.cameraRotation.y -= offsetX / this.angularSensibility;
-                } else {
-                    this.camera.cameraRotation.y += offsetX / this.angularSensibility;
-                }
+                if (this.camera.getScene().useRightHandedSystem) offsetX *= -1;
+                if (this.camera.parent && this.camera.parent._getWorldMatrixDeterminant() < 0) offsetX *= -1;
+                this.camera.cameraRotation.y += offsetX / this.angularSensibility;
 
+                var offsetY = evt.movementY || evt.mozMovementY || evt.webkitMovementY || evt.msMovementY || 0;
                 this.camera.cameraRotation.x += offsetY / this.angularSensibility;
 
                 this.previousPosition = null;

src/Cameras/babylon.arcRotateCamera.ts

@@ -340,8 +340,8 @@
 
         private _computationVector: Vector3 = Vector3.Zero();
 
-        constructor(name: string, alpha: number, beta: number, radius: number, target: Vector3, scene: Scene) {
-            super(name, Vector3.Zero(), scene);
+        constructor(name: string, alpha: number, beta: number, radius: number, target: Vector3, scene: Scene, setActiveOnSceneIfNoneActive = true) {
+            super(name, Vector3.Zero(), scene, setActiveOnSceneIfNoneActive);
 
             this._target = Vector3.Zero();
             if (target) {
@@ -484,12 +484,11 @@
             this.inputs.checkInputs();
             // Inertia
             if (this.inertialAlphaOffset !== 0 || this.inertialBetaOffset !== 0 || this.inertialRadiusOffset !== 0) {
-
-                if (this.getScene().useRightHandedSystem) {
-                    this.alpha -= this.beta <= 0 ? -this.inertialAlphaOffset : this.inertialAlphaOffset;
-                } else {
-                    this.alpha += this.beta <= 0 ? -this.inertialAlphaOffset : this.inertialAlphaOffset;
-                }
+                let inertialAlphaOffset = this.inertialAlphaOffset;
+                if (this.beta <= 0) inertialAlphaOffset *= -1;
+                if (this.getScene().useRightHandedSystem) inertialAlphaOffset *= -1;
+                if (this.parent && this.parent._getWorldMatrixDeterminant() < 0) inertialAlphaOffset *= -1;
+                this.alpha += inertialAlphaOffset;
 
                 this.beta += this.inertialBetaOffset;
 
@@ -673,11 +672,8 @@
                     up = up.negate();
                 }
 
-                if (this.getScene().useRightHandedSystem) {
-                    Matrix.LookAtRHToRef(this.position, target, up, this._viewMatrix);
-                } else {
-                    Matrix.LookAtLHToRef(this.position, target, up, this._viewMatrix);
-                }
+                this._computeViewMatrix(this.position, target, up);
+
                 this._viewMatrix.m[12] += this.targetScreenOffset.x;
                 this._viewMatrix.m[13] += this.targetScreenOffset.y;
             }

src/Cameras/babylon.camera.ts

@@ -160,22 +160,22 @@
         private _computedViewMatrix = Matrix.Identity();
         public _projectionMatrix = new Matrix();
         private _doNotComputeProjectionMatrix = false;
-        private _worldMatrix: Matrix;
+        private _worldMatrix = Matrix.Identity();
         public _postProcesses = new Array<Nullable<PostProcess>>();
         private _transformMatrix = Matrix.Zero();
 
         public _activeMeshes = new SmartArray<AbstractMesh>(256);
 
-        private _globalPosition = Vector3.Zero();
+        protected _globalPosition = Vector3.Zero();
         private _frustumPlanes: Plane[];
         private _refreshFrustumPlanes = true;
 
-        constructor(name: string, position: Vector3, scene: Scene) {
+        constructor(name: string, position: Vector3, scene: Scene, setActiveOnSceneIfNoneActive = true) {
             super(name, scene);
 
             this.getScene().addCamera(this);
 
-            if (!this.getScene().activeCamera) {
+            if (setActiveOnSceneIfNoneActive && !this.getScene().activeCamera) {
                 this.getScene().activeCamera = this;
             }
 
@@ -435,13 +435,12 @@
         }
 
         public getWorldMatrix(): Matrix {
-            if (!this._worldMatrix) {
-                this._worldMatrix = Matrix.Identity();
+            if (this._isSynchronizedViewMatrix()) {
+                return this._worldMatrix;
             }
 
-            var viewMatrix = this.getViewMatrix();
-
-            viewMatrix.invertToRef(this._worldMatrix);
+            // Getting the the view matrix will also compute the world matrix.
+            this.getViewMatrix();
 
             return this._worldMatrix;
         }
@@ -462,29 +461,14 @@
 
             this._refreshFrustumPlanes = true;
 
-            if (!this.parent || !this.parent.getWorldMatrix) {
-                this._globalPosition.copyFrom(this.position);
-            } else {
-                if (!this._worldMatrix) {
-                    this._worldMatrix = Matrix.Identity();
-                }
-
-                this._computedViewMatrix.invertToRef(this._worldMatrix);
-
-                this._worldMatrix.multiplyToRef(this.parent.getWorldMatrix(), this._computedViewMatrix);
-                this._globalPosition.copyFromFloats(this._computedViewMatrix.m[12], this._computedViewMatrix.m[13], this._computedViewMatrix.m[14]);
-
-                this._computedViewMatrix.invert();
-
-                this._markSyncedWithParent();
-            }
-
             if (this._cameraRigParams && this._cameraRigParams.vrPreViewMatrix) {
                 this._computedViewMatrix.multiplyToRef(this._cameraRigParams.vrPreViewMatrix, this._computedViewMatrix);
             }
 
             this.onViewMatrixChangedObservable.notifyObservers(this);
 
+            this._computedViewMatrix.invertToRef(this._worldMatrix);
+
             return this._computedViewMatrix;
         }
 

src/Cameras/babylon.freeCamera.ts

@@ -106,8 +106,8 @@
         public _localDirection: Vector3;
         public _transformedDirection: Vector3;
 
-        constructor(name: string, position: Vector3, scene: Scene) {
-            super(name, position, scene);
+        constructor(name: string, position: Vector3, scene: Scene, setActiveOnSceneIfNoneActive = true) {
+            super(name, position, scene, setActiveOnSceneIfNoneActive);
             this.inputs = new FreeCameraInputsManager(this);
             this.inputs.addKeyboard().addMouse();
         }

src/Cameras/babylon.stereoscopicCameras.ts

@@ -1,53 +1,124 @@
 module BABYLON {
+    /**
+     * Camera used to simulate anaglyphic rendering (based on FreeCamera)
+     */
     export class AnaglyphFreeCamera extends FreeCamera {
+        /**
+         * Creates a new AnaglyphFreeCamera
+         * @param name defines camera name
+         * @param position defines initial position
+         * @param interaxialDistance defines distance between each color axis
+         * @param scene defines the hosting scene
+         */
         constructor(name: string, position: Vector3, interaxialDistance: number, scene: Scene) {
             super(name, position, scene);
             this.interaxialDistance = interaxialDistance;
             this.setCameraRigMode(Camera.RIG_MODE_STEREOSCOPIC_ANAGLYPH, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns AnaglyphFreeCamera
+         */
         public getClassName(): string {
             return "AnaglyphFreeCamera";
         }
     }
 
+    /**
+     * Camera used to simulate anaglyphic rendering (based on ArcRotateCamera)
+     */    
     export class AnaglyphArcRotateCamera extends ArcRotateCamera {
+
+        /**
+         * Creates a new AnaglyphArcRotateCamera
+         * @param name defines camera name
+         * @param alpha defines alpha angle (in radians)
+         * @param beta defines beta angle (in radians)
+         * @param radius defines radius
+         * @param target defines camera target 
+         * @param interaxialDistance defines distance between each color axis
+         * @param scene defines the hosting scene
+         */
         constructor(name: string, alpha: number, beta: number, radius: number, target: Vector3, interaxialDistance: number, scene: Scene) {
             super(name, alpha, beta, radius, target, scene);
             this.interaxialDistance = interaxialDistance;
             this.setCameraRigMode(Camera.RIG_MODE_STEREOSCOPIC_ANAGLYPH, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns AnaglyphArcRotateCamera
+         */        
         public getClassName(): string {
             return "AnaglyphArcRotateCamera";
         }
     }
 
+    /**
+     * Camera used to simulate anaglyphic rendering (based on GamepadCamera)
+     */       
     export class AnaglyphGamepadCamera extends GamepadCamera {
+        /**
+         * Creates a new AnaglyphGamepadCamera
+         * @param name defines camera name
+         * @param position defines initial position
+         * @param interaxialDistance defines distance between each color axis
+         * @param scene defines the hosting scene
+         */
         constructor(name: string, position: Vector3, interaxialDistance: number, scene: Scene) {
             super(name, position, scene);
             this.interaxialDistance = interaxialDistance;
             this.setCameraRigMode(Camera.RIG_MODE_STEREOSCOPIC_ANAGLYPH, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns AnaglyphGamepadCamera
+         */   
         public getClassName(): string {
             return "AnaglyphGamepadCamera";
         }
     }
 
+    /**
+     * Camera used to simulate anaglyphic rendering (based on UniversalCamera)
+     */        
     export class AnaglyphUniversalCamera extends UniversalCamera {
+        /**
+         * Creates a new AnaglyphUniversalCamera
+         * @param name defines camera name
+         * @param position defines initial position
+         * @param interaxialDistance defines distance between each color axis
+         * @param scene defines the hosting scene
+         */
         constructor(name: string, position: Vector3, interaxialDistance: number, scene: Scene) {
             super(name, position, scene);
             this.interaxialDistance = interaxialDistance;
             this.setCameraRigMode(Camera.RIG_MODE_STEREOSCOPIC_ANAGLYPH, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns AnaglyphUniversalCamera
+         */           
         public getClassName(): string {
             return "AnaglyphUniversalCamera";
         }
     }
 
+    /**
+     * Camera used to simulate stereoscopic rendering (based on FreeCamera)
+     */    
     export class StereoscopicFreeCamera extends FreeCamera {
+        /**
+         * Creates a new StereoscopicFreeCamera
+         * @param name defines camera name
+         * @param position defines initial position
+         * @param interaxialDistance defines distance between each color axis
+         * @param isStereoscopicSideBySide defines is stereoscopic is done side by side or over under
+         * @param scene defines the hosting scene
+         */
         constructor(name: string, position: Vector3, interaxialDistance: number, isStereoscopicSideBySide: boolean, scene: Scene) {
             super(name, position, scene);
             this.interaxialDistance = interaxialDistance;
@@ -55,12 +126,30 @@
             this.setCameraRigMode(isStereoscopicSideBySide ? Camera.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL : Camera.RIG_MODE_STEREOSCOPIC_OVERUNDER, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns StereoscopicFreeCamera
+         */            
         public getClassName(): string {
             return "StereoscopicFreeCamera";
         }
     }
 
+    /**
+     * Camera used to simulate stereoscopic rendering (based on ArcRotateCamera)
+     */      
     export class StereoscopicArcRotateCamera extends ArcRotateCamera {
+        /**
+         * Creates a new StereoscopicArcRotateCamera
+         * @param name defines camera name
+         * @param alpha defines alpha angle (in radians)
+         * @param beta defines beta angle (in radians)
+         * @param radius defines radius
+         * @param target defines camera target 
+         * @param interaxialDistance defines distance between each color axis
+         * @param isStereoscopicSideBySide defines is stereoscopic is done side by side or over under
+         * @param scene defines the hosting scene
+         */        
         constructor(name: string, alpha: number, beta: number, radius: number, target: Vector3, interaxialDistance: number, isStereoscopicSideBySide: boolean, scene: Scene) {
             super(name, alpha, beta, radius, target, scene);
             this.interaxialDistance = interaxialDistance;
@@ -68,12 +157,27 @@
             this.setCameraRigMode(isStereoscopicSideBySide ? Camera.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL : Camera.RIG_MODE_STEREOSCOPIC_OVERUNDER, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns StereoscopicArcRotateCamera
+         */              
         public getClassName(): string {
             return "StereoscopicArcRotateCamera";
         }
     }
 
+    /**
+     * Camera used to simulate stereoscopic rendering (based on GamepadCamera)
+     */      
     export class StereoscopicGamepadCamera extends GamepadCamera {
+        /**
+         * Creates a new StereoscopicGamepadCamera
+         * @param name defines camera name
+         * @param position defines initial position
+         * @param interaxialDistance defines distance between each color axis
+         * @param isStereoscopicSideBySide defines is stereoscopic is done side by side or over under
+         * @param scene defines the hosting scene
+         */        
         constructor(name: string, position: Vector3, interaxialDistance: number, isStereoscopicSideBySide: boolean, scene: Scene) {
             super(name, position, scene);
             this.interaxialDistance = interaxialDistance;
@@ -81,12 +185,27 @@
             this.setCameraRigMode(isStereoscopicSideBySide ? Camera.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL : Camera.RIG_MODE_STEREOSCOPIC_OVERUNDER, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns StereoscopicGamepadCamera
+         */              
         public getClassName(): string {
             return "StereoscopicGamepadCamera";
         }
     }
 
+    /**
+     * Camera used to simulate stereoscopic rendering (based on UniversalCamera)
+     */      
     export class StereoscopicUniversalCamera extends UniversalCamera {
+        /**
+         * Creates a new StereoscopicUniversalCamera
+         * @param name defines camera name
+         * @param position defines initial position
+         * @param interaxialDistance defines distance between each color axis
+         * @param isStereoscopicSideBySide defines is stereoscopic is done side by side or over under
+         * @param scene defines the hosting scene
+         */        
         constructor(name: string, position: Vector3, interaxialDistance: number, isStereoscopicSideBySide: boolean, scene: Scene) {
             super(name, position, scene);
             this.interaxialDistance = interaxialDistance;
@@ -94,6 +213,10 @@
             this.setCameraRigMode(isStereoscopicSideBySide ? Camera.RIG_MODE_STEREOSCOPIC_SIDEBYSIDE_PARALLEL : Camera.RIG_MODE_STEREOSCOPIC_OVERUNDER, { interaxialDistance: interaxialDistance });
         }
 
+        /**
+         * Gets camera class name
+         * @returns StereoscopicUniversalCamera
+         */              
         public getClassName(): string {
             return "StereoscopicUniversalCamera";
         }

src/Cameras/babylon.targetCamera.ts

@@ -27,13 +27,14 @@
         public _referencePoint = new Vector3(0, 0, 1);
         private _currentUpVector = new Vector3(0, 1, 0);
         public _transformedReferencePoint = Vector3.Zero();
-        public _lookAtTemp = Matrix.Zero();
-        public _tempMatrix = Matrix.Zero();
+
+        protected _globalCurrentTarget = Vector3.Zero();
+        protected _globalCurrentUpVector = Vector3.Zero();
 
         public _reset: () => void;
 
-        constructor(name: string, position: Vector3, scene: Scene) {
-            super(name, position, scene);
+        constructor(name: string, position: Vector3, scene: Scene, setActiveOnSceneIfNoneActive = true) {
+            super(name, position, scene, setActiveOnSceneIfNoneActive);
         }
 
         public getFrontPosition(distance: number): Vector3 {
@@ -290,13 +291,28 @@
             // Computing target and final matrix
             this.position.addToRef(this._transformedReferencePoint, this._currentTarget);
 
-            if (this.getScene().useRightHandedSystem) {
-                Matrix.LookAtRHToRef(this.position, this._currentTarget, this._currentUpVector, this._viewMatrix);
+            this._computeViewMatrix(this.position, this._currentTarget, this._currentUpVector);
+            return this._viewMatrix;
+        }
+
+        protected _computeViewMatrix(position: Vector3, target: Vector3, up: Vector3): void {
+            if (this.parent) {
+                const parentWorldMatrix = this.parent.getWorldMatrix();
+                Vector3.TransformCoordinatesToRef(this.position, parentWorldMatrix, this._globalPosition);
+                Vector3.TransformCoordinatesToRef(target, parentWorldMatrix, this._globalCurrentTarget);
+                Vector3.TransformNormalToRef(up, parentWorldMatrix, this._globalCurrentUpVector);
+                this._markSyncedWithParent();
             } else {
-                Matrix.LookAtLHToRef(this.position, this._currentTarget, this._currentUpVector, this._viewMatrix);
+                this._globalPosition.copyFrom(this.position);
+                this._globalCurrentTarget.copyFrom(target);
+                this._globalCurrentUpVector.copyFrom(up);
             }
 
-            return this._viewMatrix;
+            if (this.getScene().useRightHandedSystem) {
+                Matrix.LookAtRHToRef(this._globalPosition, this._globalCurrentTarget, this._globalCurrentUpVector, this._viewMatrix);
+            } else {
+                Matrix.LookAtLHToRef(this._globalPosition, this._globalCurrentTarget, this._globalCurrentUpVector, this._viewMatrix);
+            }
         }
 
         /**

src/Collisions/babylon.collisionCoordinator.ts

@@ -77,9 +77,13 @@ module BABYLON {
         radius: Array<number>;
     }
 
+    /** Defines supported task for worker process */
     export enum WorkerTaskType {
+        /** Initialization */
         INIT,
+        /** Update of geometry */
         UPDATE,
+        /** Evaluate collision */
         COLLIDE
     }
 
@@ -113,8 +117,11 @@ module BABYLON {
         removedGeometries: Array<string>;
     }
 
+    /** Defines kind of replies returned by worker */
     export enum WorkerReplyType {
+        /** Success */
         SUCCESS,
+        /** Unkown error */
         UNKNOWN_ERROR
     }
 

src/Engine/babylon.engine.ts

@@ -843,7 +843,7 @@
          */
         public disableUniformBuffers = false;
 
-        /** @ignore */
+        /** @hidden */
         public _uniformBuffers = new Array<UniformBuffer>();
 
         /**
@@ -890,10 +890,10 @@
             return this._webGLVersion < 2 || this.forcePOTTextures;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _badOS = false;
 
-        /** @ignore */
+        /** @hidden */
         public _badDesktopOS = false;
 
         /**
@@ -906,7 +906,7 @@
         /** 
          * Gets the audio engine 
          * @see http://doc.babylonjs.com/how_to/playing_sounds_and_music
-         * @ignoreNaming
+         * @ignorenaming
          */
         public static audioEngine: AudioEngine;
 
@@ -942,7 +942,7 @@
         public onVRRequestPresentStart = new Observable<Engine>();
 
         private _hardwareScalingLevel: number;
-        /** @ignore */
+        /** @hidden */
         protected _caps: EngineCapabilities;
         private _pointerLockRequested: boolean;
         private _isStencilEnable: boolean;
@@ -950,9 +950,9 @@
 
         private _loadingScreen: ILoadingScreen;
 
-        /** @ignore */
+        /** @hidden */
         public _drawCalls = new PerfCounter();
-        /** @ignore */
+        /** @hidden */
         public _textureCollisions = new PerfCounter();
 
         private _glVersion: string;
@@ -1000,42 +1000,42 @@
         }
 
         // States
-        /** @ignore */
+        /** @hidden */
         protected _depthCullingState = new _DepthCullingState();
-        /** @ignore */
+        /** @hidden */
         protected _stencilState = new _StencilState();
-        /** @ignore */
+        /** @hidden */
         protected _alphaState = new _AlphaState();
-        /** @ignore */
+        /** @hidden */
         protected _alphaMode = Engine.ALPHA_DISABLE;
 
         // Cache
         private _internalTexturesCache = new Array<InternalTexture>();
-        /** @ignore */
+        /** @hidden */
         protected _activeChannel = 0;
         private _currentTextureChannel = -1;    
-        /** @ignore */
+        /** @hidden */
         protected _boundTexturesCache: { [key: string]: Nullable<InternalTexture> } = {};
-        /** @ignore */
+        /** @hidden */
         protected _currentEffect: Nullable<Effect>;
-        /** @ignore */
+        /** @hidden */
         protected _currentProgram: Nullable<WebGLProgram>;
         private _compiledEffects: { [key: string]: Effect } = {}
         private _vertexAttribArraysEnabled: boolean[] = [];
-        /** @ignore */
+        /** @hidden */
         protected _cachedViewport: Nullable<Viewport>;
         private _cachedVertexArrayObject: Nullable<WebGLVertexArrayObject>;
-        /** @ignore */
+        /** @hidden */
         protected _cachedVertexBuffers: any;
-        /** @ignore */
+        /** @hidden */
         protected _cachedIndexBuffer: Nullable<WebGLBuffer>;
-        /** @ignore */
+        /** @hidden */
         protected _cachedEffectForVertexBuffers: Nullable<Effect>;
-        /** @ignore */
+        /** @hidden */
         protected _currentRenderTarget: Nullable<InternalTexture>;
         private _uintIndicesCurrentlySet = false;
         private _currentBoundBuffer = new Array<Nullable<WebGLBuffer>>();
-        /** @ignore */
+        /** @hidden */
         protected _currentFramebuffer: Nullable<WebGLFramebuffer>;
         private _currentBufferPointers = new Array<BufferPointer>();
         private _currentInstanceLocations = new Array<number>();
@@ -1805,13 +1805,13 @@
             return this._caps;
         }
 
-        /** @ignore */
+        /** @hidden */
         public get drawCalls(): number {
             Tools.Warn("drawCalls is deprecated. Please use SceneInstrumentation class");
             return 0;
         }
 
-        /** @ignore */
+        /** @hidden */
         public get drawCallsPerfCounter(): Nullable<PerfCounter> {
             Tools.Warn("drawCallsPerfCounter is deprecated. Please use SceneInstrumentation class");
             return null;
@@ -2030,7 +2030,7 @@
             }
         }
 
-        /** @ignore */
+        /** @hidden */
         public _renderLoop(): void {
             if (!this._contextWasLost) {
                 var shouldRender = true;
@@ -3123,7 +3123,7 @@
             this._gl.deleteVertexArray(vao);
         }
 
-        /** @ignore */
+        /** @hidden */
         public _releaseBuffer(buffer: WebGLBuffer): boolean {
             buffer.references--;
 
@@ -3324,7 +3324,7 @@
 
         // Shaders
         
-        /** @ignore */
+        /** @hidden */
         public _releaseEffect(effect: Effect): void {
             if (this._compiledEffects[effect._key]) {
                 delete this._compiledEffects[effect._key];
@@ -3333,7 +3333,7 @@
             }
         }
 
-        /** @ignore */
+        /** @hidden */
         public _deleteProgram(program: WebGLProgram): void {
             if (program) {
                 program.__SPECTOR_rebuildProgram = null;
@@ -4084,7 +4084,7 @@
             return null;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _createTexture(): WebGLTexture {
             let texture = this._gl.createTexture();
 
@@ -5235,12 +5235,12 @@
             return samples;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _uploadDataToTexture(target: number, lod: number, internalFormat: number, width: number, height: number, format: number, type: number, data: ArrayBufferView) {
             this._gl.texImage2D(target, lod, internalFormat, width, height, 0, format, type, data);
         }
 
-        /** @ignore */
+        /** @hidden */
         public _uploadCompressedDataToTexture(target: number, lod: number, internalFormat: number, width: number, height: number, data: ArrayBufferView) {
             this._gl.compressedTexImage2D(target, lod, internalFormat, width, height, 0, <DataView>data);
         }
@@ -5349,6 +5349,9 @@
                 }
 
                 let texture = loadData.texture as InternalTexture;
+                if(loadData.info.sphericalPolynomial){
+                    texture._sphericalPolynomial = loadData.info.sphericalPolynomial;
+                }
                 texture._dataSource = InternalTexture.DATASOURCE_CUBEPREFILTERED;
                 texture._lodGenerationScale = scale;
                 texture._lodGenerationOffset = offset;
@@ -5421,7 +5424,7 @@
                 }
             };
 
-            return this.createCubeTexture(rootUrl, scene, null, false, callback, onError, format, forcedExtension);
+            return this.createCubeTexture(rootUrl, scene, null, false, callback, onError, format, forcedExtension, true);
         }
 
         /**
@@ -5434,9 +5437,10 @@
          * @param onError defines an optional callback raised if there is an issue to load the texture
          * @param format defines the format of the data
          * @param forcedExtension defines the extension to use to pick the right loader
+         * @param createPolynomials if a polynomial sphere should be created for the cube texture
          * @returns the cube texture as an InternalTexture
          */
-        public createCubeTexture(rootUrl: string, scene: Nullable<Scene>, files: Nullable<string[]>, noMipmap?: boolean, onLoad: Nullable<(data?: any) => void> = null, onError: Nullable<(message?: string, exception?: any) => void> = null, format?: number, forcedExtension: any = null): InternalTexture {
+        public createCubeTexture(rootUrl: string, scene: Nullable<Scene>, files: Nullable<string[]>, noMipmap?: boolean, onLoad: Nullable<(data?: any) => void> = null, onError: Nullable<(message?: string, exception?: any) => void> = null, format?: number, forcedExtension: any = null, createPolynomials = false): InternalTexture {
             var gl = this._gl;
 
             var texture = new InternalTexture(this, InternalTexture.DATASOURCE_CUBE);
@@ -5527,7 +5531,10 @@
                     this._loadFile(rootUrl,
                         data => {
                             var info = DDSTools.GetDDSInfo(data);
-
+                            if(createPolynomials){
+                                info.sphericalPolynomial = new SphericalPolynomial();
+                            }
+                            
                             var loadMipmap = (info.isRGB || info.isLuminance || info.mipmapCount > 1) && !noMipmap;
 
                             this._bindTextureDirectly(gl.TEXTURE_CUBE_MAP, texture, true);
@@ -5545,7 +5552,7 @@
                             texture.height = info.height;
                             texture.isReady = true;
                             texture.type = info.textureType;
-
+                            
                             if (onLoad) {
                                 onLoad({ isDDS: true, width: info.width, info, data, texture });
                             }
@@ -5565,6 +5572,7 @@
                     var height = width;
 
                     this._prepareWorkingCanvas();
+
                     if (!this._workingCanvas || !this._workingContext) {
                         return;
                     }
@@ -6035,7 +6043,7 @@
             return rgbaData;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _releaseFramebufferObjects(texture: InternalTexture): void {
             var gl = this._gl;
 
@@ -6060,7 +6068,7 @@
             }
         }
 
-        /** @ignore */
+        /** @hidden */
         public _releaseTexture(texture: InternalTexture): void {
             var gl = this._gl;
 
@@ -6213,7 +6221,7 @@
             }
         }
 
-        /** @ignore */
+        /** @hidden */
         protected _bindTextureDirectly(target: number, texture: Nullable<InternalTexture>, forTextureDataUpdate = false, force = false): void {
             if (forTextureDataUpdate && texture && texture._designatedSlot > -1) {
                 this._activeChannel = texture._designatedSlot;
@@ -6254,7 +6262,7 @@
             }
         }
 
-        /** @ignore */
+        /** @hidden */
         public _bindTexture(channel: number, texture: Nullable<InternalTexture>): void {
             if (channel < 0) {
                 return;
@@ -6499,7 +6507,7 @@
             }
         }
 
-        /** @ignore */
+        /** @hidden */
         public _setAnisotropicLevel(target: number, texture: BaseTexture) {
             var internalTexture = texture.getInternalTexture();
 
@@ -6905,7 +6913,7 @@
             this._deltaTime = this._performanceMonitor.instantaneousFrameTime || 0;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _readTexturePixels(texture: InternalTexture, width: number, height: number, faceIndex = -1): ArrayBufferView {
             let gl = this._gl;
             if (!this._dummyFramebuffer) {
@@ -7010,7 +7018,7 @@
             return successful;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _getWebGLTextureType(type: number): number {
             if (type === Engine.TEXTURETYPE_FLOAT) {
                 return this._gl.FLOAT;
@@ -7054,7 +7062,7 @@
             return internalFormat;
         }        
 
-        /** @ignore */
+        /** @hidden */
         public _getRGBABufferInternalSizedFormat(type: number, format?: number): number {
             if (this._webGLVersion === 1) {
                 if (format) {
@@ -7092,7 +7100,7 @@
             return this._gl.RGBA;
         };
 
-        /** @ignore */
+        /** @hidden */
         public _getRGBAMultiSampleBufferFormat(type: number): number {
             if (type === Engine.TEXTURETYPE_FLOAT) {
                 return this._gl.RGBA32F;
@@ -7378,7 +7386,7 @@
             this._gl.bindBufferBase(this._gl.TRANSFORM_FEEDBACK_BUFFER, 0, value);
         }
 
-        /** @ignore */
+        /** @hidden */
         public _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, database?: Database, useArrayBuffer?: boolean, onError?: (request?: XMLHttpRequest, exception?: any) => void): IFileRequest {
             let request = Tools.LoadFile(url, onSuccess, onProgress, database, useArrayBuffer, onError);
             this._activeRequests.push(request);
@@ -7388,7 +7396,7 @@
             return request;
         }
 
-        /** @ignore */
+        /** @hidden */
         public _loadFileAsync(url: string, database?: Database, useArrayBuffer?: boolean): Promise<string | ArrayBuffer> {
             return new Promise((resolve, reject) => {
                 this._loadFile(url, (data) => {
@@ -7432,7 +7440,7 @@
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
-         * @ignoreNaming
+         * @ignorenaming
          */
         public static isSupported(): boolean {
             try {

src/Gamepad/Controllers/babylon.poseEnabledController.ts

@@ -49,7 +49,7 @@ module BABYLON {
 
     /**
      * Defines the ExtendedGamepadButton interface for a gamepad button which includes state provided by a pose controller
-     * @ignore
+     * @hidden
      */
     export interface ExtendedGamepadButton extends GamepadButton {
         /**

src/Gamepad/Controllers/babylon.windowsMotionController.ts

@@ -264,7 +264,7 @@ module BABYLON {
          * Moves the axis on the controller mesh based on its current state
          * @param axis the index of the axis
          * @param axisValue the value of the axis which determines the meshes new position
-         * @ignore
+         * @hidden
          */
         protected _lerpAxisTransform(axis: number, axisValue: number) {
             if (!this._loadedMeshInfo) {

src/Gamepad/babylon.xboxGamepad.ts

@@ -1,25 +1,46 @@
 module BABYLON {
 
+    /**
+     * Defines supported buttons for XBox360 compatible gamepads
+     */
     export enum Xbox360Button {
+        /** A */
         A,
+        /** B */
         B,
+        /** X */
         X,
+        /** Y */
         Y,
+        /** Start */
         Start,
+        /** Back */
         Back,
+        /** Left button */
         LB,
+        /** Right button */
         RB,
+        /** Left stick */
         LeftStick,
+        /** Right stick */
         RightStick
     }
 
+    /** Defines values for XBox360 DPad  */
     export enum Xbox360Dpad {
+        /** Up */
         Up,
+        /** Down */
         Down,
+        /** Left */
         Left,
+        /** Right */
         Right
     }
 
+    /**
+     * Defines a XBox360 gamepad
+     */
     export class Xbox360Pad extends Gamepad {
         private _leftTrigger: number = 0;
         private _rightTrigger: number = 0;
@@ -32,9 +53,13 @@
         private _ondpaddown: (dPadPressed: Xbox360Dpad) => void;
         private _ondpadup: (dPadReleased: Xbox360Dpad) => void;
 
+        /** Observable raised when a button is pressed */
         public onButtonDownObservable = new Observable<Xbox360Button>();
+        /** Observable raised when a button is released */
         public onButtonUpObservable = new Observable<Xbox360Button>();        
+        /** Observable raised when a pad is pressed */
         public onPadDownObservable = new Observable<Xbox360Dpad>();
+        /** Observable raised when a pad is released */
         public onPadUpObservable = new Observable<Xbox360Dpad>();        
 
         private _buttonA: number = 0;
@@ -55,20 +80,38 @@
 
         private _isXboxOnePad: boolean = false;
 
+        /**
+         * Creates a new XBox360 gamepad object
+         * @param id defines the id of this gamepad
+         * @param index defines its index
+         * @param gamepad defines the internal HTML gamepad object
+         * @param xboxOne defines if it is a XBox One gamepad
+         */
         constructor(id: string, index: number, gamepad: any, xboxOne: boolean = false) {
             super(id, index, gamepad, 0, 1, 2, 3);
             this.type = Gamepad.XBOX;
             this._isXboxOnePad = xboxOne;
         }
 
+        /**
+         * Defines the callback to call when left trigger is pressed
+         * @param callback defines the callback to use
+         */
         public onlefttriggerchanged(callback: (value: number) => void) {
             this._onlefttriggerchanged = callback;
         }
 
+        /**
+         * Defines the callback to call when right trigger is pressed
+         * @param callback defines the callback to use
+         */        
         public onrighttriggerchanged(callback: (value: number) => void) {
             this._onrighttriggerchanged = callback;
         }
-
+ 
+        /**
+         * Gets or sets left trigger value
+         */
         public get leftTrigger(): number {
             return this._leftTrigger;
         }
@@ -79,6 +122,9 @@
             this._leftTrigger = newValue;
         }
 
+        /**
+         * Gets or sets right trigger value
+         */        
         public get rightTrigger(): number {
             return this._rightTrigger;
         }
@@ -89,15 +135,34 @@
             this._rightTrigger = newValue;
         }
 
+        /**
+         * Defines the callback to call when a button is pressed
+         * @param callback defines the callback to use
+         */
         public onbuttondown(callback: (buttonPressed: Xbox360Button) => void) {
             this._onbuttondown = callback;
         }
+
+        /**
+         * Defines the callback to call when a button is released
+         * @param callback defines the callback to use
+         */        
         public onbuttonup(callback: (buttonReleased: Xbox360Button) => void) {
             this._onbuttonup = callback;
         }
+
+        /**
+         * Defines the callback to call when a pad is pressed
+         * @param callback defines the callback to use
+         */             
         public ondpaddown(callback: (dPadPressed: Xbox360Dpad) => void) {
             this._ondpaddown = callback;
         }
+
+        /**
+         * Defines the callback to call when a pad is released
+         * @param callback defines the callback to use
+         */             
         public ondpadup(callback: (dPadReleased: Xbox360Dpad) => void) {
             this._ondpadup = callback;
         }
@@ -143,90 +208,121 @@
             return newValue;
         }
 
+        /** Gets or sets value of A button */
         public get buttonA(): number {
             return this._buttonA;
         }
         public set buttonA(value) {
             this._buttonA = this._setButtonValue(value, this._buttonA, Xbox360Button.A);
         }
+
+        /** Gets or sets value of B button */
         public get buttonB(): number {
             return this._buttonB;
         }
         public set buttonB(value) {
             this._buttonB = this._setButtonValue(value, this._buttonB, Xbox360Button.B);
         }
+
+        /** Gets or sets value of X button */       
         public get buttonX(): number {
             return this._buttonX;
         }
         public set buttonX(value) {
             this._buttonX = this._setButtonValue(value, this._buttonX, Xbox360Button.X);
         }
+
+        /** Gets or sets value of Y button */        
         public get buttonY(): number {
             return this._buttonY;
         }
         public set buttonY(value) {
             this._buttonY = this._setButtonValue(value, this._buttonY, Xbox360Button.Y);
-        }
+        }        
+        
+        /** Gets or sets value of Start button  */
         public get buttonStart(): number {
             return this._buttonStart;
         }
         public set buttonStart(value) {
             this._buttonStart = this._setButtonValue(value, this._buttonStart, Xbox360Button.Start);
         }
+
+        /** Gets or sets value of Back button  */        
         public get buttonBack(): number {
             return this._buttonBack;
         }
         public set buttonBack(value) {
             this._buttonBack = this._setButtonValue(value, this._buttonBack, Xbox360Button.Back);
         }
+
+        /** Gets or sets value of Left button  */        
         public get buttonLB(): number {
             return this._buttonLB;
         }
         public set buttonLB(value) {
             this._buttonLB = this._setButtonValue(value, this._buttonLB, Xbox360Button.LB);
         }
+
+        /** Gets or sets value of Right button  */        
         public get buttonRB(): number {
             return this._buttonRB;
         }
         public set buttonRB(value) {
             this._buttonRB = this._setButtonValue(value, this._buttonRB, Xbox360Button.RB);
         }
+
+        /** Gets or sets value of left stick */  
         public get buttonLeftStick(): number {
             return this._buttonLeftStick;
         }
         public set buttonLeftStick(value) {
             this._buttonLeftStick = this._setButtonValue(value, this._buttonLeftStick, Xbox360Button.LeftStick);
         }
+
+        /** Gets or sets value of right stick */  
         public get buttonRightStick(): number {
             return this._buttonRightStick;
         }
         public set buttonRightStick(value) {
             this._buttonRightStick = this._setButtonValue(value, this._buttonRightStick, Xbox360Button.RightStick);
         }
+
+        /** Gets or sets value of DPad up */  
         public get dPadUp(): number {
             return this._dPadUp;
         }
         public set dPadUp(value) {
             this._dPadUp = this._setDPadValue(value, this._dPadUp, Xbox360Dpad.Up);
         }
+
+        /** Gets or sets value of DPad down */  
         public get dPadDown(): number {
             return this._dPadDown;
         }
         public set dPadDown(value) {
             this._dPadDown = this._setDPadValue(value, this._dPadDown, Xbox360Dpad.Down);
         }
+
+        /** Gets or sets value of DPad left */  
         public get dPadLeft(): number {
             return this._dPadLeft;
         }
         public set dPadLeft(value) {
             this._dPadLeft = this._setDPadValue(value, this._dPadLeft, Xbox360Dpad.Left);
         }
+
+        /** Gets or sets value of DPad right */  
         public get dPadRight(): number {
             return this._dPadRight;
         }
         public set dPadRight(value) {
             this._dPadRight = this._setDPadValue(value, this._dPadRight, Xbox360Dpad.Right);
         }
+
+        /**
+         * Force the gamepad to synchronize with device values
+         */
         public update() {
             super.update();
             if (this._isXboxOnePad) {

src/Helpers/babylon.environmentHelper.ts

@@ -396,37 +396,18 @@ module BABYLON {
         /**
          * Sets the primary color of all the available elements.
          * @param color the main color to affect to the ground and the background
-         * @param perceptual Specifies wether the chosen color has been set as intented to be seen e.g. in gamma space not accounting for exposure and tone mapping
          */
-        public setMainColor(color: Color3, perceptual = false): void {
+        public setMainColor(color: Color3): void {
             if (this.groundMaterial) {
-                if (perceptual) {
-                    this.groundMaterial.perceptualColor = color;
-                }
-                else {
-                    this.groundMaterial.primaryColor = color;
-                }
+                this.groundMaterial.primaryColor = color;
             }
 
             if (this.skyboxMaterial) {
-                if (perceptual) {
-                    this.skyboxMaterial.perceptualColor = color;
-                }
-                else {
-                    this.skyboxMaterial.primaryColor = color;
-                }
+                this.skyboxMaterial.primaryColor = color;
             }
 
             if (this.groundMirror) {
-                if (perceptual && this.groundMaterial) {
-                    this.groundMirror.clearColor = new Color4(this.groundMaterial.primaryColor.r, 
-                        this.groundMaterial.primaryColor.g, 
-                        this.groundMaterial.primaryColor.b, 
-                        1.0);
-                }
-                else {
-                    this.groundMirror.clearColor = new Color4(color.r, color.g, color.b, 1.0);
-                }
+                this.groundMirror.clearColor = new Color4(color.r, color.g, color.b, 1.0);
             }
         }
 

src/Instrumentation/babylon.timeToken.ts

@@ -1,4 +1,7 @@
 module BABYLON {
+    /**
+     * @hidden
+     **/    
     export class _TimeToken {
         public _startTimeQuery: Nullable<WebGLQuery>;
         public _endTimeQuery: Nullable<WebGLQuery>;

src/Layer/babylon.effectLayer.ts

@@ -602,7 +602,7 @@
 
         /**
          * Rebuild the required buffers.
-         * @ignore Internal use only.
+         * @hidden Internal use only.
          */
         public _rebuild(): void {
             let vb = this._vertexBuffers[VertexBuffer.PositionKind];

src/Lights/babylon.hemisphericLight.ts

@@ -89,7 +89,7 @@
         }
 
         /**
-         * @ignore internal use only.
+         * @hidden internal use only.
          */
         public _getWorldMatrix(): Matrix {
             if (!this._worldMatrix) {

src/Lights/babylon.light.ts

@@ -297,18 +297,18 @@ module BABYLON {
         public _shadowGenerator: Nullable<IShadowGenerator>;
 
         /**
-         * @ignore Internal use only.
+         * @hidden Internal use only.
          */
         public _excludedMeshesIds = new Array<string>();
 
         /**
-         * @ignore Internal use only.
+         * @hidden Internal use only.
          */
         public _includedOnlyMeshesIds = new Array<string>();
 
         /**
          * The current light unifom buffer.
-         * @ignore Internal use only.
+         * @hidden Internal use only.
          */
         public _uniformBuffer: UniformBuffer;
 
@@ -341,7 +341,7 @@ module BABYLON {
         public abstract transferToEffect(effect: Effect, lightIndex: string): Light;
 
         /**
-         * @ignore internal use only.
+         * @hidden internal use only.
          */
         public abstract _getWorldMatrix(): Matrix;
 
@@ -686,7 +686,7 @@ module BABYLON {
 
         /**
          * Forces the meshes to update their light related information in their rendering used effects
-         * @ignore Internal Use Only
+         * @hidden Internal Use Only
          */
         public _markMeshesAsLightDirty() {
             for (var mesh of this.getScene().meshes) {
@@ -765,7 +765,7 @@ module BABYLON {
 
         /**
          * Reorder the light in the scene according to their defined priority.
-         * @ignore Internal Use Only
+         * @hidden Internal Use Only
          */
         public _reorderLightsInScene(): void {
             var scene = this.getScene();

src/Lights/babylon.shadowLight.ts

@@ -303,7 +303,7 @@
 
         /**
          * Get the world matrix of the sahdow lights.
-         * @ignore Internal Use Only
+         * @hidden Internal Use Only
          */
         public _getWorldMatrix(): Matrix {
             if (!this._worldMatrix) {

src/Lights/babylon.spotLight.ts

@@ -116,7 +116,8 @@
         }
 
         @serializeAsTexture("projectedLightTexture")
-        private _projectionTexture: Nullable<BaseTexture>;;
+        private _projectionTexture: Nullable<BaseTexture>;
+        
         /** 
          * Gets the projection texture of the light.
         */