Merge pull request #3154 from BabylonJS/master

Nightly

Viewer/dist/viewer.js

@@ -77808,6 +77808,171 @@ module.exports = g;
 
 Object.defineProperty(exports, "__esModule", { value: true });
 var babylonjs_1 = __webpack_require__(0);
+var helper_1 = __webpack_require__(3);
+var HTMLMapper = (function () {
+    function HTMLMapper() {
+    }
+    HTMLMapper.prototype.map = function (element) {
+        var config = {};
+        var _loop_1 = function (attrIdx) {
+            var attr = element.attributes.item(attrIdx);
+            var split = attr.nodeName.split('.');
+            split.reduce(function (currentConfig, key, idx) {
+                var camelKey = helper_1.kebabToCamel(key);
+                if (idx === split.length - 1) {
+                    var val = attr.nodeValue;
+                    if (val === "true") {
+                        val = true;
+                    }
+                    else if (val === "false") {
+                        val = false;
+                    }
+                    else {
+                        var number = parseFloat(val);
+                        if (!isNaN(number)) {
+                            val = number;
+                        }
+                    }
+                    currentConfig[camelKey] = val;
+                }
+                else {
+                    currentConfig[camelKey] = currentConfig[camelKey] || {};
+                }
+                return currentConfig[camelKey];
+            }, config);
+        };
+        for (var attrIdx = 0; attrIdx < element.attributes.length; ++attrIdx) {
+            _loop_1(attrIdx);
+        }
+        return config;
+    };
+    return HTMLMapper;
+}());
+var JSONMapper = (function () {
+    function JSONMapper() {
+    }
+    JSONMapper.prototype.map = function (rawSource) {
+        return JSON.parse(rawSource);
+    };
+    return JSONMapper;
+}());
+var DOMMapper = (function () {
+    function DOMMapper() {
+    }
+    DOMMapper.prototype.map = function (baseElement) {
+        var htmlMapper = new HTMLMapper();
+        var config = htmlMapper.map(baseElement);
+        var traverseChildren = function (element, partConfig) {
+            var children = element.children;
+            if (children.length) {
+                for (var i = 0; i < children.length; ++i) {
+                    var item = children.item(i);
+                    var configMapped = htmlMapper.map(item);
+                    var key = helper_1.kebabToCamel(item.nodeName.toLowerCase());
+                    if (item.attributes.getNamedItem('array') && item.attributes.getNamedItem('array').nodeValue === 'true') {
+                        partConfig[key] = [];
+                    }
+                    else {
+                        if (element.attributes.getNamedItem('array') && element.attributes.getNamedItem('array').nodeValue === 'true') {
+                            partConfig.push(configMapped);
+                        }
+                        else if (partConfig[key]) {
+                            element.setAttribute('array', 'true');
+                            var oldItem = partConfig[key];
+                            partConfig = [oldItem, configMapped];
+                        }
+                        else {
+                            partConfig[key] = configMapped;
+                        }
+                    }
+                    traverseChildren(item, partConfig[key] || configMapped);
+                }
+            }
+            return partConfig;
+        };
+        traverseChildren(baseElement, config);
+        return config;
+    };
+    return DOMMapper;
+}());
+var MapperManager = (function () {
+    function MapperManager() {
+        this.mappers = {
+            "html": new HTMLMapper(),
+            "json": new JSONMapper(),
+            "dom": new DOMMapper()
+        };
+    }
+    MapperManager.prototype.getMapper = function (type) {
+        if (!this.mappers[type]) {
+            babylonjs_1.Tools.Error("No mapper defined for " + type);
+        }
+        return this.mappers[type] || this.mappers[MapperManager.DefaultMapper];
+    };
+    MapperManager.prototype.registerMapper = function (type, mapper) {
+        this.mappers[type] = mapper;
+    };
+    MapperManager.DefaultMapper = 'json';
+    return MapperManager;
+}());
+exports.MapperManager = MapperManager;
+exports.mapperManager = new MapperManager();
+exports.default = exports.mapperManager;
+
+
+/***/ }),
+/* 3 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", { value: true });
+function isUrl(urlToCheck) {
+    if (urlToCheck.indexOf('http') === 0 || urlToCheck.indexOf('/') === 0 || urlToCheck.indexOf('./') === 0 || urlToCheck.indexOf('../') === 0) {
+        return true;
+    }
+    return false;
+}
+exports.isUrl = isUrl;
+function loadFile(url) {
+    return new Promise(function (resolve, reject) {
+        var xhr = new XMLHttpRequest();
+        xhr.open('GET', url);
+        xhr.send();
+        xhr.onreadystatechange = function () {
+            var DONE = 4;
+            var OK = 200;
+            if (xhr.readyState === DONE) {
+                if (xhr.status === OK) {
+                    resolve(xhr.responseText);
+                }
+            }
+            else {
+                console.log('Error: ' + xhr.status, url);
+                reject('Error: ' + xhr.status);
+            }
+        };
+    });
+}
+exports.loadFile = loadFile;
+function kebabToCamel(s) {
+    return s.replace(/(\-\w)/g, function (m) { return m[1].toUpperCase(); });
+}
+exports.kebabToCamel = kebabToCamel;
+function camelToKebab(str) {
+    return !str ? null : str.replace(/([A-Z])/g, function (g) { return '-' + g[0].toLowerCase(); });
+}
+exports.camelToKebab = camelToKebab;
+
+
+/***/ }),
+/* 4 */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", { value: true });
+var babylonjs_1 = __webpack_require__(0);
 var ViewerManager = (function () {
     function ViewerManager() {
         this.viewers = {};
@@ -77830,6 +77995,10 @@ var ViewerManager = (function () {
     ViewerManager.prototype.getViewerPromiseById = function (id) {
         var _this = this;
         return new Promise(function (resolve, reject) {
+            var localViewer = _this.getViewerById(id);
+            if (localViewer) {
+                return resolve(localViewer);
+            }
             var viewerFunction = function (viewer) {
                 if (viewer.getBaseId() === id) {
                     resolve(viewer);
@@ -77849,7 +78018,7 @@ exports.viewerManager = new ViewerManager();
 
 
 /***/ }),
-/* 3 */
+/* 5 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -77865,7 +78034,7 @@ var __extends = (this && this.__extends) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
-var viewer_1 = __webpack_require__(4);
+var viewer_1 = __webpack_require__(6);
 var babylonjs_1 = __webpack_require__(0);
 var BABYLON = __webpack_require__(0);
 window['BABYLON'] = BABYLON;
@@ -78248,13 +78417,13 @@ exports.DefaultViewer = DefaultViewer;
 
 
 /***/ }),
-/* 4 */
+/* 6 */
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
 
 Object.defineProperty(exports, "__esModule", { value: true });
-var viewerManager_1 = __webpack_require__(2);
+var viewerManager_1 = __webpack_require__(4);
 var templateManager_1 = __webpack_require__(17);
 var loader_1 = __webpack_require__(19);
 var babylonjs_1 = __webpack_require__(0);
@@ -78377,171 +78546,6 @@ exports.AbstractViewer = AbstractViewer;
 
 
 /***/ }),
-/* 5 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-Object.defineProperty(exports, "__esModule", { value: true });
-function isUrl(urlToCheck) {
-    if (urlToCheck.indexOf('http') === 0 || urlToCheck.indexOf('/') === 0 || urlToCheck.indexOf('./') === 0 || urlToCheck.indexOf('../') === 0) {
-        return true;
-    }
-    return false;
-}
-exports.isUrl = isUrl;
-function loadFile(url) {
-    return new Promise(function (resolve, reject) {
-        var xhr = new XMLHttpRequest();
-        xhr.open('GET', url);
-        xhr.send();
-        xhr.onreadystatechange = function () {
-            var DONE = 4;
-            var OK = 200;
-            if (xhr.readyState === DONE) {
-                if (xhr.status === OK) {
-                    resolve(xhr.responseText);
-                }
-            }
-            else {
-                console.log('Error: ' + xhr.status, url);
-                reject('Error: ' + xhr.status);
-            }
-        };
-    });
-}
-exports.loadFile = loadFile;
-function kebabToCamel(s) {
-    return s.replace(/(\-\w)/g, function (m) { return m[1].toUpperCase(); });
-}
-exports.kebabToCamel = kebabToCamel;
-function camelToKebab(str) {
-    return !str ? null : str.replace(/([A-Z])/g, function (g) { return '-' + g[0].toLowerCase(); });
-}
-exports.camelToKebab = camelToKebab;
-
-
-/***/ }),
-/* 6 */
-/***/ (function(module, exports, __webpack_require__) {
-
-"use strict";
-
-Object.defineProperty(exports, "__esModule", { value: true });
-var babylonjs_1 = __webpack_require__(0);
-var helper_1 = __webpack_require__(5);
-var HTMLMapper = (function () {
-    function HTMLMapper() {
-    }
-    HTMLMapper.prototype.map = function (element) {
-        var config = {};
-        var _loop_1 = function (attrIdx) {
-            var attr = element.attributes.item(attrIdx);
-            var split = attr.nodeName.split('.');
-            split.reduce(function (currentConfig, key, idx) {
-                var camelKey = helper_1.kebabToCamel(key);
-                if (idx === split.length - 1) {
-                    var val = attr.nodeValue;
-                    if (val === "true") {
-                        val = true;
-                    }
-                    else if (val === "false") {
-                        val = false;
-                    }
-                    else {
-                        var number = parseFloat(val);
-                        if (!isNaN(number)) {
-                            val = number;
-                        }
-                    }
-                    currentConfig[camelKey] = val;
-                }
-                else {
-                    currentConfig[camelKey] = currentConfig[camelKey] || {};
-                }
-                return currentConfig[camelKey];
-            }, config);
-        };
-        for (var attrIdx = 0; attrIdx < element.attributes.length; ++attrIdx) {
-            _loop_1(attrIdx);
-        }
-        return config;
-    };
-    return HTMLMapper;
-}());
-var JSONMapper = (function () {
-    function JSONMapper() {
-    }
-    JSONMapper.prototype.map = function (rawSource) {
-        return JSON.parse(rawSource);
-    };
-    return JSONMapper;
-}());
-var DOMMapper = (function () {
-    function DOMMapper() {
-    }
-    DOMMapper.prototype.map = function (baseElement) {
-        var htmlMapper = new HTMLMapper();
-        var config = htmlMapper.map(baseElement);
-        var traverseChildren = function (element, partConfig) {
-            var children = element.children;
-            if (children.length) {
-                for (var i = 0; i < children.length; ++i) {
-                    var item = children.item(i);
-                    var configMapped = htmlMapper.map(item);
-                    var key = helper_1.kebabToCamel(item.nodeName.toLowerCase());
-                    if (item.attributes.getNamedItem('array') && item.attributes.getNamedItem('array').nodeValue === 'true') {
-                        partConfig[key] = [];
-                    }
-                    else {
-                        if (element.attributes.getNamedItem('array') && element.attributes.getNamedItem('array').nodeValue === 'true') {
-                            partConfig.push(configMapped);
-                        }
-                        else if (partConfig[key]) {
-                            element.setAttribute('array', 'true');
-                            var oldItem = partConfig[key];
-                            partConfig = [oldItem, configMapped];
-                        }
-                        else {
-                            partConfig[key] = configMapped;
-                        }
-                    }
-                    traverseChildren(item, partConfig[key] || configMapped);
-                }
-            }
-            return partConfig;
-        };
-        traverseChildren(baseElement, config);
-        return config;
-    };
-    return DOMMapper;
-}());
-var MapperManager = (function () {
-    function MapperManager() {
-        this.mappers = {
-            "html": new HTMLMapper(),
-            "json": new JSONMapper(),
-            "dom": new DOMMapper()
-        };
-    }
-    MapperManager.prototype.getMapper = function (type) {
-        if (!this.mappers[type]) {
-            babylonjs_1.Tools.Error("No mapper defined for " + type);
-        }
-        return this.mappers[type] || this.mappers[MapperManager.DefaultMapper];
-    };
-    MapperManager.prototype.registerMapper = function (type, mapper) {
-        this.mappers[type] = mapper;
-    };
-    MapperManager.DefaultMapper = 'json';
-    return MapperManager;
-}());
-exports.MapperManager = MapperManager;
-exports.mapperManager = new MapperManager();
-exports.default = exports.mapperManager;
-
-
-/***/ }),
 /* 7 */
 /***/ (function(module, exports) {
 
@@ -78590,11 +78594,13 @@ module.exports = "Error loading the model";
 "use strict";
 /* WEBPACK VAR INJECTION */(function(global) {
 Object.defineProperty(exports, "__esModule", { value: true });
-var viewerManager_1 = __webpack_require__(2);
+var mappers_1 = __webpack_require__(2);
+exports.mapperManager = mappers_1.mapperManager;
+var viewerManager_1 = __webpack_require__(4);
 exports.viewerManager = viewerManager_1.viewerManager;
-var defaultViewer_1 = __webpack_require__(3);
+var defaultViewer_1 = __webpack_require__(5);
 exports.DefaultViewer = defaultViewer_1.DefaultViewer;
-var viewer_1 = __webpack_require__(4);
+var viewer_1 = __webpack_require__(6);
 exports.AbstractViewer = viewer_1.AbstractViewer;
 __webpack_require__(0);
 __webpack_require__(30);
@@ -104846,7 +104852,7 @@ if (!root['OIMO']) {
 
 Object.defineProperty(exports, "__esModule", { value: true });
 var babylonjs_1 = __webpack_require__(0);
-var helper_1 = __webpack_require__(5);
+var helper_1 = __webpack_require__(3);
 var TemplateManager = (function () {
     function TemplateManager(containerElement) {
         this.containerElement = containerElement;
@@ -105056,7 +105062,7 @@ function getTemplateAsHtml(templateConfig) {
         }
         else {
             location_1 = location_1.replace('#', '');
-            var element = document.getElementById('#' + location_1);
+            var element = document.getElementById(location_1);
             if (element) {
                 return Promise.resolve(element.innerHTML);
             }
@@ -105119,7 +105125,7 @@ var f=g.nameLookup(e,b[c],a);return d?[" && ",f]:[" != null ? ",f," : ",e]})},re
 "use strict";
 
 Object.defineProperty(exports, "__esModule", { value: true });
-var mappers_1 = __webpack_require__(6);
+var mappers_1 = __webpack_require__(2);
 var types_1 = __webpack_require__(20);
 var merge = __webpack_require__(27);
 var ConfigurationLoader = (function () {
@@ -107707,8 +107713,8 @@ this._uniformBuffer.updateMatrix("diffuseMatrix",this._diffuseTexture.getTexture
 "use strict";
 
 Object.defineProperty(exports, "__esModule", { value: true });
-var defaultViewer_1 = __webpack_require__(3);
-var mappers_1 = __webpack_require__(6);
+var defaultViewer_1 = __webpack_require__(5);
+var mappers_1 = __webpack_require__(2);
 function InitTags(selector) {
     if (selector === void 0) { selector = 'babylon'; }
     var elements = document.querySelectorAll(selector);

Viewer/package.json

@@ -23,7 +23,7 @@
     },
     "homepage": "https://github.com/BabylonJS/Babylon.js#readme",
     "devDependencies": {
-        "@types/node": "^8.0.51",
+        "@types/node": "^8.0.52",
         "base64-image-loader": "^1.2.0",
         "html-loader": "^0.5.1",
         "json-loader": "^0.5.7",
@@ -34,15 +34,15 @@
         "webpack-dev-server": "^2.9.4"
     },
     "dependencies": {
-        "babylonjs": "^3.1.0-beta1.1.1",
-        "babylonjs-loaders": "^3.1.0-beta1.1",
-        "babylonjs-materials": "^3.1.0-beta1.1",
-        "babylonjs-post-process": "^3.1.0-beta1.1",
-        "babylonjs-procedural-textures": "^3.1.0-beta1.1",
+        "babylonjs": "^3.1.0-beta3",
+        "babylonjs-loaders": "^3.1.0-beta3",
+        "babylonjs-materials": "^3.1.0-beta3",
+        "babylonjs-post-process": "^3.1.0-beta3",
+        "babylonjs-procedural-textures": "^3.1.0-beta3",
         "es6-promise": "^4.1.1",
         "handlebars": "^4.0.11",
         "lodash": "^4.17.4",
         "lodash.merge": "^4.6.0",
         "promise-polyfill": "^6.0.2"
     }
-}
+}

Viewer/src/configuration/configuration.ts

@@ -44,14 +44,12 @@ export interface ViewerConfiguration {
         scaling?: { x: number, y: number, z: number };
         parentObjectIndex?: number; // the index of the parent object of the model in the loaded meshes array.
 
-        [propName: string]: any; // further configuration, like title and creator
-    } | string,
-
-    description?: string | {
         title: string;
         subtitle?: string;
         thumbnail?: string; // URL or data-url
-    };
+
+        [propName: string]: any; // further configuration, like title and creator
+    } | string;
 
     scene?: {
         debug?: boolean;

Viewer/src/index.ts

@@ -1,3 +1,4 @@
+import { mapperManager } from './configuration/mappers';
 import { viewerManager } from './viewer/viewerManager';
 import { DefaultViewer } from './viewer/defaultViewer';
 import { AbstractViewer } from './viewer/viewer';
@@ -27,4 +28,4 @@ setTimeout(() => {
 });
 
 // public API for initialization
-export { InitTags, DefaultViewer, AbstractViewer, viewerManager };
+export { InitTags, DefaultViewer, AbstractViewer, viewerManager, mapperManager };

Viewer/src/templateManager.ts

@@ -297,7 +297,7 @@ export function getTemplateAsHtml(templateConfig: ITemplateConfiguration): Promi
             return loadFile(location);
         } else {
             location = location.replace('#', '');
-            let element = document.getElementById('#' + location);
+            let element = document.getElementById(location);
             if (element) {
                 return Promise.resolve(element.innerHTML);
             } else {

Viewer/src/viewer/viewerManager.ts

@@ -32,6 +32,10 @@ class ViewerManager {
 
     public getViewerPromiseById(id: string): Promise<AbstractViewer> {
         return new Promise((resolve, reject) => {
+            let localViewer = this.getViewerById(id)
+            if (localViewer) {
+                return resolve(localViewer);
+            }
             let viewerFunction = (viewer: AbstractViewer) => {
                 if (viewer.getBaseId() === id) {
                     resolve(viewer);

dist/preview release/babylon.max.js

@@ -1767,17 +1767,27 @@ var BABYLON;
             return vector;
         };
         Vector3.Unproject = function (source, viewportWidth, viewportHeight, world, view, projection) {
+            var result = Vector3.Zero();
+            Vector3.UnprojectToRef(source, viewportWidth, viewportHeight, world, view, projection, result);
+            return result;
+        };
+        Vector3.UnprojectToRef = function (source, viewportWidth, viewportHeight, world, view, projection, result) {
+            Vector3.UnprojectFloatsToRef(source.x, source.y, source.z, viewportWidth, viewportHeight, world, view, projection, result);
+        };
+        Vector3.UnprojectFloatsToRef = function (sourceX, sourceY, sourceZ, viewportWidth, viewportHeight, world, view, projection, result) {
             var matrix = MathTmp.Matrix[0];
             world.multiplyToRef(view, matrix);
             matrix.multiplyToRef(projection, matrix);
             matrix.invert();
-            var screenSource = new Vector3(source.x / viewportWidth * 2 - 1, -(source.y / viewportHeight * 2 - 1), 2 * source.z - 1.0);
-            var vector = Vector3.TransformCoordinates(screenSource, matrix);
+            var screenSource = MathTmp.Vector3[0];
+            screenSource.x = sourceX / viewportWidth * 2 - 1;
+            screenSource.y = sourceY / viewportHeight * 2 - 1;
+            screenSource.z = 2 * sourceZ - 1.0;
+            Vector3.TransformCoordinatesToRef(screenSource, matrix, result);
             var num = screenSource.x * matrix.m[3] + screenSource.y * matrix.m[7] + screenSource.z * matrix.m[11] + matrix.m[15];
             if (BABYLON.Scalar.WithinEpsilon(num, 1.0)) {
-                vector = vector.scale(1.0 / num);
+                result.scaleInPlace(1.0 / num);
             }
-            return vector;
         };
         Vector3.Minimize = function (left, right) {
             var min = left.clone();
@@ -4443,7 +4453,7 @@ var BABYLON;
          * Returns the updated Path2.
          */
         Path2.prototype.addLineTo = function (x, y) {
-            if (closed) {
+            if (this.closed) {
                 //Tools.Error("cannot add lines to closed paths");
                 return this;
             }
@@ -4459,7 +4469,7 @@ var BABYLON;
          */
         Path2.prototype.addArcTo = function (midX, midY, endX, endY, numberOfSegments) {
             if (numberOfSegments === void 0) { numberOfSegments = 36; }
-            if (closed) {
+            if (this.closed) {
                 //Tools.Error("cannot add arcs to closed paths");
                 return this;
             }
@@ -8512,7 +8522,7 @@ var BABYLON;
         });
         Object.defineProperty(Engine, "Version", {
             get: function () {
-                return "3.1-beta-3";
+                return "3.1-beta-4";
             },
             enumerable: true,
             configurable: true
@@ -20984,6 +20994,12 @@ var BABYLON;
         // Picking
         Scene.prototype.createPickingRay = function (x, y, world, camera, cameraViewSpace) {
             if (cameraViewSpace === void 0) { cameraViewSpace = false; }
+            var result = BABYLON.Ray.Zero();
+            this.createPickingRayToRef(x, y, world, result, camera, cameraViewSpace);
+            return result;
+        };
+        Scene.prototype.createPickingRayToRef = function (x, y, world, result, camera, cameraViewSpace) {
+            if (cameraViewSpace === void 0) { cameraViewSpace = false; }
             var engine = this._engine;
             if (!camera) {
                 if (!this.activeCamera)
@@ -20995,12 +21011,17 @@ var BABYLON;
             // Moving coordinates to local viewport world
             x = x / this._engine.getHardwareScalingLevel() - viewport.x;
             y = y / this._engine.getHardwareScalingLevel() - (this._engine.getRenderHeight() - viewport.y - viewport.height);
-            return BABYLON.Ray.CreateNew(x, y, viewport.width, viewport.height, world ? world : BABYLON.Matrix.Identity(), cameraViewSpace ? BABYLON.Matrix.Identity() : camera.getViewMatrix(), camera.getProjectionMatrix());
-            //       return BABYLON.Ray.CreateNew(x / window.devicePixelRatio, y / window.devicePixelRatio, viewport.width, viewport.height, world ? world : BABYLON.Matrix.Identity(), camera.getViewMatrix(), camera.getProjectionMatrix());
+            result.update(x, y, viewport.width, viewport.height, world ? world : BABYLON.Matrix.Identity(), cameraViewSpace ? BABYLON.Matrix.Identity() : camera.getViewMatrix(), camera.getProjectionMatrix());
+            return this;
         };
         Scene.prototype.createPickingRayInCameraSpace = function (x, y, camera) {
+            var result = BABYLON.Ray.Zero();
+            this.createPickingRayInCameraSpaceToRef(x, y, result, camera);
+            return result;
+        };
+        Scene.prototype.createPickingRayInCameraSpaceToRef = function (x, y, result, camera) {
             if (!BABYLON.PickingInfo) {
-                return null;
+                return this;
             }
             var engine = this._engine;
             if (!camera) {
@@ -21014,7 +21035,8 @@ var BABYLON;
             // Moving coordinates to local viewport world
             x = x / this._engine.getHardwareScalingLevel() - viewport.x;
             y = y / this._engine.getHardwareScalingLevel() - (this._engine.getRenderHeight() - viewport.y - viewport.height);
-            return BABYLON.Ray.CreateNew(x, y, viewport.width, viewport.height, identity, identity, camera.getProjectionMatrix());
+            result.update(x, y, viewport.width, viewport.height, identity, identity, camera.getProjectionMatrix());
+            return this;
         };
         Scene.prototype._internalPick = function (rayFunction, predicate, fastCheck) {
             if (!BABYLON.PickingInfo) {
@@ -21108,7 +21130,13 @@ var BABYLON;
          */
         Scene.prototype.pick = function (x, y, predicate, fastCheck, camera) {
             var _this = this;
-            return this._internalPick(function (world) { return _this.createPickingRay(x, y, world, camera || null); }, predicate, fastCheck);
+            if (!this._tempPickingRay) {
+                this._tempPickingRay = BABYLON.Ray.Zero();
+            }
+            return this._internalPick(function (world) {
+                _this.createPickingRayToRef(x, y, world, _this._tempPickingRay, camera || null);
+                return _this._tempPickingRay;
+            }, predicate, fastCheck);
         };
         /** Launch a ray to try to pick a sprite in the scene
          * @param x position on screen
@@ -21118,11 +21146,11 @@ var BABYLON;
          * @param camera camera to use for computing the picking ray. Can be set to null. In this case, the scene.activeCamera will be used
          */
         Scene.prototype.pickSprite = function (x, y, predicate, fastCheck, camera) {
-            var ray = this.createPickingRayInCameraSpace(x, y, camera);
-            if (!ray) {
-                return null;
+            if (!this._tempPickingRay) {
+                this._tempPickingRay = BABYLON.Ray.Zero();
             }
-            return this._internalPickSprites(ray, predicate, fastCheck, camera);
+            this.createPickingRayInCameraSpaceToRef(x, y, this._tempPickingRay, camera);
+            return this._internalPickSprites(this._tempPickingRay, predicate, fastCheck, camera);
         };
         /** Use the given ray to pick a mesh in the scene
          * @param ray The ray to use to pick meshes
@@ -21137,7 +21165,7 @@ var BABYLON;
                 }
                 world.invertToRef(_this._pickWithRayInverseMatrix);
                 if (!_this._cachedRayForTransform) {
-                    _this._cachedRayForTransform = new BABYLON.Ray(BABYLON.Vector3.Zero(), BABYLON.Vector3.Zero());
+                    _this._cachedRayForTransform = BABYLON.Ray.Zero();
                 }
                 BABYLON.Ray.TransformToRef(ray, _this._pickWithRayInverseMatrix, _this._cachedRayForTransform);
                 return _this._cachedRayForTransform;
@@ -21167,7 +21195,7 @@ var BABYLON;
                 }
                 world.invertToRef(_this._pickWithRayInverseMatrix);
                 if (!_this._cachedRayForTransform) {
-                    _this._cachedRayForTransform = new BABYLON.Ray(BABYLON.Vector3.Zero(), BABYLON.Vector3.Zero());
+                    _this._cachedRayForTransform = BABYLON.Ray.Zero();
                 }
                 BABYLON.Ray.TransformToRef(ray, _this._pickWithRayInverseMatrix, _this._cachedRayForTransform);
                 return _this._cachedRayForTransform;
@@ -43984,13 +44012,20 @@ var BABYLON;
             }
             return -1;
         };
+        Ray.prototype.update = function (x, y, viewportWidth, viewportHeight, world, view, projection) {
+            BABYLON.Vector3.UnprojectFloatsToRef(x, y, 0, viewportWidth, viewportHeight, world, view, projection, this.origin);
+            BABYLON.Vector3.UnprojectFloatsToRef(x, y, 1, viewportWidth, viewportHeight, world, view, projection, BABYLON.Tmp.Vector3[0]);
+            BABYLON.Tmp.Vector3[0].subtractToRef(this.origin, this.direction);
+            this.direction.normalize();
+            return this;
+        };
         // Statics
+        Ray.Zero = function () {
+            return new Ray(BABYLON.Vector3.Zero(), BABYLON.Vector3.Zero());
+        };
         Ray.CreateNew = function (x, y, viewportWidth, viewportHeight, world, view, projection) {
-            var start = BABYLON.Vector3.Unproject(new BABYLON.Vector3(x, y, 0), viewportWidth, viewportHeight, world, view, projection);
-            var end = BABYLON.Vector3.Unproject(new BABYLON.Vector3(x, y, 1), viewportWidth, viewportHeight, world, view, projection);
-            var direction = end.subtract(start);
-            direction.normalize();
-            return new Ray(start, direction);
+            var result = Ray.Zero();
+            return result.update(x, y, viewportWidth, viewportHeight, world, view, projection);
         };
         /**
         * Function will create a new transformed ray starting from origin and ending at the end point. Ray's length will be set, and ray will be
@@ -58146,8 +58181,8 @@ var BABYLON;
                 if (!material) {
                     return;
                 }
-                // Culling
-                engine.setState(material.backFaceCulling);
+                // Culling and reverse (right handed system)
+                engine.setState(material.backFaceCulling, 0, false, scene.useRightHandedSystem);
                 // Managing instances
                 var batch = mesh._getInstancesRenderList(subMesh._id);
                 if (batch.mustReturn) {
@@ -75162,6 +75197,41 @@ var BABYLON;
             this.zoomOnBoundingInfo(boundingBox.minimumWorld, boundingBox.maximumWorld, focusOnOriginXZ, onAnimationEnd);
         };
         /**
+         * Targets the given mesh with its children and updates zoom level accordingly.
+         * @param mesh  The mesh to target.
+         * @param radius Optional. If a cached radius position already exists, overrides default.
+         * @param framingPositionY Position on mesh to center camera focus where 0 corresponds bottom of its bounding box and 1, the top
+         * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
+         * @param onAnimationEnd Callback triggered at the end of the framing animation
+         */
+        FramingBehavior.prototype.zoomOnMeshHierarchy = function (mesh, focusOnOriginXZ, onAnimationEnd) {
+            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = false; }
+            if (onAnimationEnd === void 0) { onAnimationEnd = null; }
+            mesh.computeWorldMatrix(true);
+            var boundingBox = mesh.getHierarchyBoundingVectors(true);
+            this.zoomOnBoundingInfo(boundingBox.min, boundingBox.max, focusOnOriginXZ, onAnimationEnd);
+        };
+        /**
+         * Targets the given meshes with their children and updates zoom level accordingly.
+         * @param meshes  The mesh to target.
+         * @param radius Optional. If a cached radius position already exists, overrides default.
+         * @param framingPositionY Position on mesh to center camera focus where 0 corresponds bottom of its bounding box and 1, the top
+         * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
+         * @param onAnimationEnd Callback triggered at the end of the framing animation
+         */
+        FramingBehavior.prototype.zoomOnMeshesHierarchy = function (meshes, focusOnOriginXZ, onAnimationEnd) {
+            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = false; }
+            if (onAnimationEnd === void 0) { onAnimationEnd = null; }
+            var min = new BABYLON.Vector3(Number.MAX_VALUE, Number.MAX_VALUE, Number.MAX_VALUE);
+            var max = new BABYLON.Vector3(-Number.MAX_VALUE, -Number.MAX_VALUE, -Number.MAX_VALUE);
+            for (var i = 0; i < meshes.length; i++) {
+                var boundingInfo = meshes[i].getHierarchyBoundingVectors(true);
+                BABYLON.Tools.CheckExtends(boundingInfo.min, min, max);
+                BABYLON.Tools.CheckExtends(boundingInfo.max, min, max);
+            }
+            this.zoomOnBoundingInfo(min, max, focusOnOriginXZ, onAnimationEnd);
+        };
+        /**
          * Targets the given mesh and updates zoom level accordingly.
          * @param mesh  The mesh to target.
          * @param radius Optional. If a cached radius position already exists, overrides default.

dist/preview release/customConfigurations/minimalGLTFViewer/babylon.max.js

@@ -1767,17 +1767,27 @@ var BABYLON;
             return vector;
         };
         Vector3.Unproject = function (source, viewportWidth, viewportHeight, world, view, projection) {
+            var result = Vector3.Zero();
+            Vector3.UnprojectToRef(source, viewportWidth, viewportHeight, world, view, projection, result);
+            return result;
+        };
+        Vector3.UnprojectToRef = function (source, viewportWidth, viewportHeight, world, view, projection, result) {
+            Vector3.UnprojectFloatsToRef(source.x, source.y, source.z, viewportWidth, viewportHeight, world, view, projection, result);
+        };
+        Vector3.UnprojectFloatsToRef = function (sourceX, sourceY, sourceZ, viewportWidth, viewportHeight, world, view, projection, result) {
             var matrix = MathTmp.Matrix[0];
             world.multiplyToRef(view, matrix);
             matrix.multiplyToRef(projection, matrix);
             matrix.invert();
-            var screenSource = new Vector3(source.x / viewportWidth * 2 - 1, -(source.y / viewportHeight * 2 - 1), 2 * source.z - 1.0);
-            var vector = Vector3.TransformCoordinates(screenSource, matrix);
+            var screenSource = MathTmp.Vector3[0];
+            screenSource.x = sourceX / viewportWidth * 2 - 1;
+            screenSource.y = sourceY / viewportHeight * 2 - 1;
+            screenSource.z = 2 * sourceZ - 1.0;
+            Vector3.TransformCoordinatesToRef(screenSource, matrix, result);
             var num = screenSource.x * matrix.m[3] + screenSource.y * matrix.m[7] + screenSource.z * matrix.m[11] + matrix.m[15];
             if (BABYLON.Scalar.WithinEpsilon(num, 1.0)) {
-                vector = vector.scale(1.0 / num);
+                result.scaleInPlace(1.0 / num);
             }
-            return vector;
         };
         Vector3.Minimize = function (left, right) {
             var min = left.clone();
@@ -4443,7 +4453,7 @@ var BABYLON;
          * Returns the updated Path2.
          */
         Path2.prototype.addLineTo = function (x, y) {
-            if (closed) {
+            if (this.closed) {
                 //Tools.Error("cannot add lines to closed paths");
                 return this;
             }
@@ -4459,7 +4469,7 @@ var BABYLON;
          */
         Path2.prototype.addArcTo = function (midX, midY, endX, endY, numberOfSegments) {
             if (numberOfSegments === void 0) { numberOfSegments = 36; }
-            if (closed) {
+            if (this.closed) {
                 //Tools.Error("cannot add arcs to closed paths");
                 return this;
             }
@@ -8512,7 +8522,7 @@ var BABYLON;
         });
         Object.defineProperty(Engine, "Version", {
             get: function () {
-                return "3.1-beta-3";
+                return "3.1-beta-4";
             },
             enumerable: true,
             configurable: true
@@ -20984,6 +20994,12 @@ var BABYLON;
         // Picking
         Scene.prototype.createPickingRay = function (x, y, world, camera, cameraViewSpace) {
             if (cameraViewSpace === void 0) { cameraViewSpace = false; }
+            var result = BABYLON.Ray.Zero();
+            this.createPickingRayToRef(x, y, world, result, camera, cameraViewSpace);
+            return result;
+        };
+        Scene.prototype.createPickingRayToRef = function (x, y, world, result, camera, cameraViewSpace) {
+            if (cameraViewSpace === void 0) { cameraViewSpace = false; }
             var engine = this._engine;
             if (!camera) {
                 if (!this.activeCamera)
@@ -20995,12 +21011,17 @@ var BABYLON;
             // Moving coordinates to local viewport world
             x = x / this._engine.getHardwareScalingLevel() - viewport.x;
             y = y / this._engine.getHardwareScalingLevel() - (this._engine.getRenderHeight() - viewport.y - viewport.height);
-            return BABYLON.Ray.CreateNew(x, y, viewport.width, viewport.height, world ? world : BABYLON.Matrix.Identity(), cameraViewSpace ? BABYLON.Matrix.Identity() : camera.getViewMatrix(), camera.getProjectionMatrix());
-            //       return BABYLON.Ray.CreateNew(x / window.devicePixelRatio, y / window.devicePixelRatio, viewport.width, viewport.height, world ? world : BABYLON.Matrix.Identity(), camera.getViewMatrix(), camera.getProjectionMatrix());
+            result.update(x, y, viewport.width, viewport.height, world ? world : BABYLON.Matrix.Identity(), cameraViewSpace ? BABYLON.Matrix.Identity() : camera.getViewMatrix(), camera.getProjectionMatrix());
+            return this;
         };
         Scene.prototype.createPickingRayInCameraSpace = function (x, y, camera) {
+            var result = BABYLON.Ray.Zero();
+            this.createPickingRayInCameraSpaceToRef(x, y, result, camera);
+            return result;
+        };
+        Scene.prototype.createPickingRayInCameraSpaceToRef = function (x, y, result, camera) {
             if (!BABYLON.PickingInfo) {
-                return null;
+                return this;
             }
             var engine = this._engine;
             if (!camera) {
@@ -21014,7 +21035,8 @@ var BABYLON;
             // Moving coordinates to local viewport world
             x = x / this._engine.getHardwareScalingLevel() - viewport.x;
             y = y / this._engine.getHardwareScalingLevel() - (this._engine.getRenderHeight() - viewport.y - viewport.height);
-            return BABYLON.Ray.CreateNew(x, y, viewport.width, viewport.height, identity, identity, camera.getProjectionMatrix());
+            result.update(x, y, viewport.width, viewport.height, identity, identity, camera.getProjectionMatrix());
+            return this;
         };
         Scene.prototype._internalPick = function (rayFunction, predicate, fastCheck) {
             if (!BABYLON.PickingInfo) {
@@ -21108,7 +21130,13 @@ var BABYLON;
          */
         Scene.prototype.pick = function (x, y, predicate, fastCheck, camera) {
             var _this = this;
-            return this._internalPick(function (world) { return _this.createPickingRay(x, y, world, camera || null); }, predicate, fastCheck);
+            if (!this._tempPickingRay) {
+                this._tempPickingRay = BABYLON.Ray.Zero();
+            }
+            return this._internalPick(function (world) {
+                _this.createPickingRayToRef(x, y, world, _this._tempPickingRay, camera || null);
+                return _this._tempPickingRay;
+            }, predicate, fastCheck);
         };
         /** Launch a ray to try to pick a sprite in the scene
          * @param x position on screen
@@ -21118,11 +21146,11 @@ var BABYLON;
          * @param camera camera to use for computing the picking ray. Can be set to null. In this case, the scene.activeCamera will be used
          */
         Scene.prototype.pickSprite = function (x, y, predicate, fastCheck, camera) {
-            var ray = this.createPickingRayInCameraSpace(x, y, camera);
-            if (!ray) {
-                return null;
+            if (!this._tempPickingRay) {
+                this._tempPickingRay = BABYLON.Ray.Zero();
             }
-            return this._internalPickSprites(ray, predicate, fastCheck, camera);
+            this.createPickingRayInCameraSpaceToRef(x, y, this._tempPickingRay, camera);
+            return this._internalPickSprites(this._tempPickingRay, predicate, fastCheck, camera);
         };
         /** Use the given ray to pick a mesh in the scene
          * @param ray The ray to use to pick meshes
@@ -21137,7 +21165,7 @@ var BABYLON;
                 }
                 world.invertToRef(_this._pickWithRayInverseMatrix);
                 if (!_this._cachedRayForTransform) {
-                    _this._cachedRayForTransform = new BABYLON.Ray(BABYLON.Vector3.Zero(), BABYLON.Vector3.Zero());
+                    _this._cachedRayForTransform = BABYLON.Ray.Zero();
                 }
                 BABYLON.Ray.TransformToRef(ray, _this._pickWithRayInverseMatrix, _this._cachedRayForTransform);
                 return _this._cachedRayForTransform;
@@ -21167,7 +21195,7 @@ var BABYLON;
                 }
                 world.invertToRef(_this._pickWithRayInverseMatrix);
                 if (!_this._cachedRayForTransform) {
-                    _this._cachedRayForTransform = new BABYLON.Ray(BABYLON.Vector3.Zero(), BABYLON.Vector3.Zero());
+                    _this._cachedRayForTransform = BABYLON.Ray.Zero();
                 }
                 BABYLON.Ray.TransformToRef(ray, _this._pickWithRayInverseMatrix, _this._cachedRayForTransform);
                 return _this._cachedRayForTransform;
@@ -43984,13 +44012,20 @@ var BABYLON;
             }
             return -1;
         };
+        Ray.prototype.update = function (x, y, viewportWidth, viewportHeight, world, view, projection) {
+            BABYLON.Vector3.UnprojectFloatsToRef(x, y, 0, viewportWidth, viewportHeight, world, view, projection, this.origin);
+            BABYLON.Vector3.UnprojectFloatsToRef(x, y, 1, viewportWidth, viewportHeight, world, view, projection, BABYLON.Tmp.Vector3[0]);
+            BABYLON.Tmp.Vector3[0].subtractToRef(this.origin, this.direction);
+            this.direction.normalize();
+            return this;
+        };
         // Statics
+        Ray.Zero = function () {
+            return new Ray(BABYLON.Vector3.Zero(), BABYLON.Vector3.Zero());
+        };
         Ray.CreateNew = function (x, y, viewportWidth, viewportHeight, world, view, projection) {
-            var start = BABYLON.Vector3.Unproject(new BABYLON.Vector3(x, y, 0), viewportWidth, viewportHeight, world, view, projection);
-            var end = BABYLON.Vector3.Unproject(new BABYLON.Vector3(x, y, 1), viewportWidth, viewportHeight, world, view, projection);
-            var direction = end.subtract(start);
-            direction.normalize();
-            return new Ray(start, direction);
+            var result = Ray.Zero();
+            return result.update(x, y, viewportWidth, viewportHeight, world, view, projection);
         };
         /**
         * Function will create a new transformed ray starting from origin and ending at the end point. Ray's length will be set, and ray will be
@@ -57992,8 +58027,8 @@ var BABYLON;
                 if (!material) {
                     return;
                 }
-                // Culling
-                engine.setState(material.backFaceCulling);
+                // Culling and reverse (right handed system)
+                engine.setState(material.backFaceCulling, 0, false, scene.useRightHandedSystem);
                 // Managing instances
                 var batch = mesh._getInstancesRenderList(subMesh._id);
                 if (batch.mustReturn) {
@@ -75008,6 +75043,41 @@ var BABYLON;
             this.zoomOnBoundingInfo(boundingBox.minimumWorld, boundingBox.maximumWorld, focusOnOriginXZ, onAnimationEnd);
         };
         /**
+         * Targets the given mesh with its children and updates zoom level accordingly.
+         * @param mesh  The mesh to target.
+         * @param radius Optional. If a cached radius position already exists, overrides default.
+         * @param framingPositionY Position on mesh to center camera focus where 0 corresponds bottom of its bounding box and 1, the top
+         * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
+         * @param onAnimationEnd Callback triggered at the end of the framing animation
+         */
+        FramingBehavior.prototype.zoomOnMeshHierarchy = function (mesh, focusOnOriginXZ, onAnimationEnd) {
+            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = false; }
+            if (onAnimationEnd === void 0) { onAnimationEnd = null; }
+            mesh.computeWorldMatrix(true);
+            var boundingBox = mesh.getHierarchyBoundingVectors(true);
+            this.zoomOnBoundingInfo(boundingBox.min, boundingBox.max, focusOnOriginXZ, onAnimationEnd);
+        };
+        /**
+         * Targets the given meshes with their children and updates zoom level accordingly.
+         * @param meshes  The mesh to target.
+         * @param radius Optional. If a cached radius position already exists, overrides default.
+         * @param framingPositionY Position on mesh to center camera focus where 0 corresponds bottom of its bounding box and 1, the top
+         * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
+         * @param onAnimationEnd Callback triggered at the end of the framing animation
+         */
+        FramingBehavior.prototype.zoomOnMeshesHierarchy = function (meshes, focusOnOriginXZ, onAnimationEnd) {
+            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = false; }
+            if (onAnimationEnd === void 0) { onAnimationEnd = null; }
+            var min = new BABYLON.Vector3(Number.MAX_VALUE, Number.MAX_VALUE, Number.MAX_VALUE);
+            var max = new BABYLON.Vector3(-Number.MAX_VALUE, -Number.MAX_VALUE, -Number.MAX_VALUE);
+            for (var i = 0; i < meshes.length; i++) {
+                var boundingInfo = meshes[i].getHierarchyBoundingVectors(true);
+                BABYLON.Tools.CheckExtends(boundingInfo.min, min, max);
+                BABYLON.Tools.CheckExtends(boundingInfo.max, min, max);
+            }
+            this.zoomOnBoundingInfo(min, max, focusOnOriginXZ, onAnimationEnd);
+        };
+        /**
          * Targets the given mesh and updates zoom level accordingly.
          * @param mesh  The mesh to target.
          * @param radius Optional. If a cached radius position already exists, overrides default.

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

@@ -459,7 +459,7 @@ var BABYLON;
             AdvancedDynamicTexture.CreateFullscreenUI = function (name, foreground, scene) {
                 if (foreground === void 0) { foreground = true; }
                 if (scene === void 0) { scene = null; }
-                var result = new AdvancedDynamicTexture(name, 0, 0, scene);
+                var result = new AdvancedDynamicTexture(name, 0, 0, scene, false, BABYLON.Texture.BILINEAR_SAMPLINGMODE);
                 // Display
                 var layer = new BABYLON.Layer(name + "_layer", null, scene, !foreground);
                 layer.texture = result;

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

@@ -183,6 +183,14 @@ declare module INSPECTOR {
         'Scene': {
             type: typeof BABYLON.Scene;
         };
+        'TransformNode': {
+            type: typeof BABYLON.TransformNode;
+            format: (m: BABYLON.TransformNode) => string;
+        };
+        'AbstractMesh': {
+            type: typeof BABYLON.AbstractMesh;
+            format: (m: BABYLON.AbstractMesh) => string;
+        };
         'Mesh': {
             type: typeof BABYLON.Mesh;
             format: (m: BABYLON.Mesh) => string;

dist/preview release/inspector/babylon.inspector.js

@@ -441,6 +441,14 @@ var INSPECTOR;
         'Scene': {
             type: BABYLON.Scene,
         },
+        'TransformNode': {
+            type: BABYLON.TransformNode,
+            format: function (m) { return m.name; }
+        },
+        'AbstractMesh': {
+            type: BABYLON.AbstractMesh,
+            format: function (m) { return m.name; }
+        },
         'Mesh': {
             type: BABYLON.Mesh,
             format: function (m) { return m.name; },
@@ -1065,7 +1073,7 @@ var INSPECTOR;
             this._obj.isVisible = b;
         };
         MeshAdapter.prototype.isVisible = function () {
-            return this._obj.isEnabled() && this._obj.isVisible;
+            return this._obj.isEnabled() && (this._obj.isVisible === undefined || this._obj.isVisible);
         };
         MeshAdapter.prototype.isBoxVisible = function () {
             return this._obj.showBoundingBox;

gui/src/advancedDynamicTexture.ts

@@ -509,7 +509,7 @@ module BABYLON.GUI {
         }
 
         public static CreateFullscreenUI(name: string, foreground: boolean = true, scene: Nullable<Scene> = null): AdvancedDynamicTexture {
-            var result = new AdvancedDynamicTexture(name, 0, 0, scene);
+            var result = new AdvancedDynamicTexture(name, 0, 0, scene, false, Texture.BILINEAR_SAMPLINGMODE);
 
             // Display
             var layer = new BABYLON.Layer(name + "_layer", null, scene, !foreground);

inspector/src/adapters/MeshAdapter.ts

@@ -51,7 +51,7 @@ module INSPECTOR {
             this._obj.isVisible = b;
         }
         public isVisible(): boolean {
-            return this._obj.isEnabled() && this._obj.isVisible;
+            return this._obj.isEnabled() && (this._obj.isVisible === undefined || this._obj.isVisible);
         }
         public isBoxVisible(): boolean {
             return (this._obj as BABYLON.AbstractMesh).showBoundingBox;

inspector/src/properties.ts

@@ -90,6 +90,14 @@ module INSPECTOR {
         'Scene': {
             type: BABYLON.Scene,
         },
+        'TransformNode': {
+            type: BABYLON.TransformNode,
+            format: (m: BABYLON.TransformNode): string => { return m.name; }
+        },        
+        'AbstractMesh': {
+            type: BABYLON.AbstractMesh,
+            format: (m: BABYLON.AbstractMesh): string => { return m.name; }
+        },          
         'Mesh': {
             type: BABYLON.Mesh,
             format: (m: BABYLON.Mesh): string => { return m.name; },

src/Behaviors/Cameras/babylon.framingBehavior.ts

@@ -229,6 +229,42 @@ module BABYLON {
 		}
 
 		/**
+		 * Targets the given mesh with its children and updates zoom level accordingly.
+		 * @param mesh  The mesh to target.
+		 * @param radius Optional. If a cached radius position already exists, overrides default.
+		 * @param framingPositionY Position on mesh to center camera focus where 0 corresponds bottom of its bounding box and 1, the top
+		 * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
+		 * @param onAnimationEnd Callback triggered at the end of the framing animation
+		 */
+		public zoomOnMeshHierarchy(mesh: AbstractMesh, focusOnOriginXZ: boolean = false, onAnimationEnd: Nullable<() => void> = null): void {
+			mesh.computeWorldMatrix(true);
+
+			let boundingBox = mesh.getHierarchyBoundingVectors(true);
+			this.zoomOnBoundingInfo(boundingBox.min, boundingBox.max, focusOnOriginXZ, onAnimationEnd);
+		}
+
+		/**
+		 * Targets the given meshes with their children and updates zoom level accordingly.
+		 * @param meshes  The mesh to target.
+		 * @param radius Optional. If a cached radius position already exists, overrides default.
+		 * @param framingPositionY Position on mesh to center camera focus where 0 corresponds bottom of its bounding box and 1, the top
+		 * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
+		 * @param onAnimationEnd Callback triggered at the end of the framing animation
+		 */
+		public zoomOnMeshesHierarchy(meshes: AbstractMesh[], focusOnOriginXZ: boolean = false, onAnimationEnd: Nullable<() => void> = null): void {
+			let min = new BABYLON.Vector3(Number.MAX_VALUE, Number.MAX_VALUE, Number.MAX_VALUE);
+            let max = new BABYLON.Vector3(-Number.MAX_VALUE, -Number.MAX_VALUE, -Number.MAX_VALUE);
+            
+			for (let i = 0; i < meshes.length; i++) {
+				let boundingInfo = meshes[i].getHierarchyBoundingVectors(true);
+				BABYLON.Tools.CheckExtends(boundingInfo.min, min, max);
+                BABYLON.Tools.CheckExtends(boundingInfo.max, min, max);
+			}
+	
+			this.zoomOnBoundingInfo(min, max, focusOnOriginXZ, onAnimationEnd);
+		}
+
+		/**
 		 * Targets the given mesh and updates zoom level accordingly.
 		 * @param mesh  The mesh to target.
 		 * @param radius Optional. If a cached radius position already exists, overrides default.

src/Engine/babylon.engine.ts

@@ -531,7 +531,7 @@
         }
 
         public static get Version(): string {
-            return "3.1-beta-3";
+            return "3.1-beta-4";
         }
 
         // Updatable statics so stick with vars here

src/Math/babylon.math.ts

@@ -4721,7 +4721,7 @@
          * Returns the updated Path2.   
          */
         public addLineTo(x: number, y: number): Path2 {
-            if (closed) {
+            if (this.closed) {
                 //Tools.Error("cannot add lines to closed paths");
                 return this;
             }
@@ -4737,7 +4737,7 @@
          * Returns the updated Path2.  
          */
         public addArcTo(midX: number, midY: number, endX: number, endY: number, numberOfSegments = 36): Path2 {
-            if (closed) {
+            if (this.closed) {
                 //Tools.Error("cannot add arcs to closed paths");
                 return this;
             }

src/Rendering/babylon.depthRenderer.ts

@@ -34,8 +34,8 @@
                     return;
                 }
 
-                // Culling
-                engine.setState(material.backFaceCulling);
+                // Culling and reverse (right handed system)
+                engine.setState(material.backFaceCulling, 0, false, scene.useRightHandedSystem);
 
                 // Managing instances
                 var batch = mesh._getInstancesRenderList(subMesh._id);

tests/validation/config.json

@@ -188,6 +188,48 @@
       "referenceImage": "gltfnormals.png"
     },
     {
+      "title": "GLTF Material",
+      "renderCount": 20,
+      "scriptToRun": "/Demos/GLTFTests/index.js",
+      "functionToCall": "createMaterialScene",
+      "referenceImage": "gltfMaterial.png"
+    },
+    {
+      "title": "GLTF Material Alpha",
+      "renderCount": 20,
+      "scriptToRun": "/Demos/GLTFTests/index.js",
+      "functionToCall": "createMaterialAlphaScene",
+      "referenceImage": "gltfMaterialAlpha.png"
+    },
+    {
+      "title": "GLTF Primitive Attribute",
+      "renderCount": 20,
+      "scriptToRun": "/Demos/GLTFTests/index.js",
+      "functionToCall": "createPrimitiveAttributeScene",
+      "referenceImage": "gltfPrimitiveAttribute.png"
+    },
+    {
+      "title": "GLTF Metallic Roughness",
+      "renderCount": 20,
+      "scriptToRun": "/Demos/GLTFTests/index.js",
+      "functionToCall": "createMaterialMetallicRoughnessScene",
+      "referenceImage": "gltfMaterialMetallicRoughness.png"
+    },
+    {
+      "title": "GLTF Specular Glossiness",
+      "renderCount": 20,
+      "scriptToRun": "/Demos/GLTFTests/index.js",
+      "functionToCall": "createMaterialSpecularGlossinessScene",
+      "referenceImage": "gltfMaterialSpecularGlossiness.png"
+    },
+    {
+      "title": "GLTF Texture Sampler",
+      "renderCount": 20,
+      "scriptToRun": "/Demos/GLTFTests/index.js",
+      "functionToCall": "createTextureSamplerScene",
+      "referenceImage": "gltfTextureSampler.png"
+    },
+    {
       "title": "PBR glossy",
       "renderCount": 20,
       "replace": "engine.setHardwareScalingLevel, //engine.setHardwareScalingLevel",