From 502f00f306f6374a588eef73d3b9b8f21a7c386b Mon Sep 17 00:00:00 2001
From: hpinkos <pinkos.hannah@gmail.com>
Date: Thu, 27 Apr 2017 10:18:08 -0400
Subject: [PATCH] update 3d tiles inspector

---
 Source/Scene/Batched3DModel3DTileContent.js   | 12 ++++
 Source/Scene/Cesium3DTileContent.js           | 12 ++++
 Source/Scene/Cesium3DTileFeature.js           | 15 ++++
 Source/Scene/Composite3DTileContent.js        | 12 ++++
 Source/Scene/Empty3DTileContent.js            | 12 ++++
 Source/Scene/Instanced3DModel3DTileContent.js | 12 ++++
 Source/Scene/PointCloud3DTileContent.js       | 12 ++++
 Source/Scene/Tileset3DTileContent.js          | 12 ++++
 .../Cesium3DTilesInspector.js                 |  2 +-
 .../Cesium3DTilesInspectorViewModel.js        | 69 ++++++++++++-------
 .../Cesium3DTilesInspectorViewModelSpec.js    | 10 +--
 11 files changed, 150 insertions(+), 30 deletions(-)

diff --git a/Source/Scene/Batched3DModel3DTileContent.js b/Source/Scene/Batched3DModel3DTileContent.js
index 11bf088f2f2f..018de195d56c 100644
--- a/Source/Scene/Batched3DModel3DTileContent.js
+++ b/Source/Scene/Batched3DModel3DTileContent.js
@@ -173,6 +173,18 @@ define([
             get : function() {
                 return this._readyPromise.promise;
             }
+        },
+
+        /**
+         * Gets the url of the tile's content.
+         * @memberof Cesium3DTileContent.prototype
+         * @type {String}
+         * @readonly
+         */
+        url: {
+            get: function() {
+                return this._url;
+            }
         }
     });
 
diff --git a/Source/Scene/Cesium3DTileContent.js b/Source/Scene/Cesium3DTileContent.js
index d5fe0bbdefc7..5724d73a1f3f 100644
--- a/Source/Scene/Cesium3DTileContent.js
+++ b/Source/Scene/Cesium3DTileContent.js
@@ -191,6 +191,18 @@ define([
             get : function() {
                 DeveloperError.throwInstantiationError();
             }
+        },
+
+        /**
+         * Gets the url of the tile's content.
+         * @memberof Cesium3DTileContent.prototype
+         * @type {String}
+         * @readonly
+         */
+        url: {
+            get: function() {
+                DeveloperError.throwInstantiationError();
+            }
         }
     });
 
diff --git a/Source/Scene/Cesium3DTileFeature.js b/Source/Scene/Cesium3DTileFeature.js
index c82894b8353a..88f324061b3d 100644
--- a/Source/Scene/Cesium3DTileFeature.js
+++ b/Source/Scene/Cesium3DTileFeature.js
@@ -100,6 +100,21 @@ define([
             set : function(value) {
                 this._batchTable.setColor(this._batchId, value);
             }
+        },
+
+        /**
+         * Gets the feature content.
+         *
+         * @memberof Cesium3DTileFeature.prototype
+         *
+         * @type {Cesium3DTileContent}
+         *
+         * @readonly
+         */
+        content: {
+            get: function() {
+                return this._content;
+            }
         }
     });
 
diff --git a/Source/Scene/Composite3DTileContent.js b/Source/Scene/Composite3DTileContent.js
index 7bbc5d4b7350..cdad31ab3efe 100644
--- a/Source/Scene/Composite3DTileContent.js
+++ b/Source/Scene/Composite3DTileContent.js
@@ -161,6 +161,18 @@ define([
             get : function() {
                 return this._readyPromise.promise;
             }
+        },
+
+        /**
+         * Gets the url of the tile's content.
+         * @memberof Cesium3DTileContent.prototype
+         * @type {String}
+         * @readonly
+         */
+        url: {
+            get: function() {
+                return this._url;
+            }
         }
     });
 
diff --git a/Source/Scene/Empty3DTileContent.js b/Source/Scene/Empty3DTileContent.js
index 503577a7811c..d5991944b921 100644
--- a/Source/Scene/Empty3DTileContent.js
+++ b/Source/Scene/Empty3DTileContent.js
@@ -121,6 +121,18 @@ define([
             get : function() {
                 return this._readyPromise.promise;
             }
+        },
+
+        /**
+         * Gets the url of the tile's content.
+         * @memberof Cesium3DTileContent.prototype
+         * @type {String}
+         * @readonly
+         */
+        url: {
+            get: function() {
+                return this._url;
+            }
         }
     });
 
diff --git a/Source/Scene/Instanced3DModel3DTileContent.js b/Source/Scene/Instanced3DModel3DTileContent.js
index 9e9c543b1373..369be974f885 100644
--- a/Source/Scene/Instanced3DModel3DTileContent.js
+++ b/Source/Scene/Instanced3DModel3DTileContent.js
@@ -196,6 +196,18 @@ define([
             get : function() {
                 return this._readyPromise.promise;
             }
+        },
+
+        /**
+         * Gets the url of the tile's content.
+         * @memberof Cesium3DTileContent.prototype
+         * @type {String}
+         * @readonly
+         */
+        url: {
+            get: function() {
+                return this._url;
+            }
         }
     });
 
diff --git a/Source/Scene/PointCloud3DTileContent.js b/Source/Scene/PointCloud3DTileContent.js
index 07034d7618d7..721f16658c0f 100644
--- a/Source/Scene/PointCloud3DTileContent.js
+++ b/Source/Scene/PointCloud3DTileContent.js
@@ -229,6 +229,18 @@ define([
             get : function() {
                 return this._readyPromise.promise;
             }
+        },
+
+        /**
+         * Gets the url of the tile's content.
+         * @memberof Cesium3DTileContent.prototype
+         * @type {String}
+         * @readonly
+         */
+        url: {
+            get: function() {
+                return this._url;
+            }
         }
     });
 
diff --git a/Source/Scene/Tileset3DTileContent.js b/Source/Scene/Tileset3DTileContent.js
index 4110b9cf525a..e291f5500084 100644
--- a/Source/Scene/Tileset3DTileContent.js
+++ b/Source/Scene/Tileset3DTileContent.js
@@ -119,6 +119,18 @@ define([
             get : function() {
                 return this._readyPromise.promise;
             }
+        },
+
+        /**
+         * Gets the url of the tile's content.
+         * @memberof Cesium3DTileContent.prototype
+         * @type {String}
+         * @readonly
+         */
+        url: {
+            get: function() {
+                return this._url;
+            }
         }
     });
 
diff --git a/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspector.js b/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspector.js
index e01bfdb9889b..8679a2f0d14e 100644
--- a/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspector.js
+++ b/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspector.js
@@ -139,7 +139,7 @@ define([
         propertiesLabel.className = 'field-label';
         propertiesLabel.appendChild(document.createTextNode('Properties: '));
         var propertiesField = document.createElement('div');
-        propertiesField.setAttribute('data-bind', 'text: propertiesText');
+        propertiesField.setAttribute('data-bind', 'text: properties');
         properties.appendChild(propertiesLabel);
         properties.appendChild(propertiesField);
         tilesetPanelContents.appendChild(properties);
diff --git a/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModel.js b/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModel.js
index f75f88b00db9..6f835e58e02f 100644
--- a/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModel.js
+++ b/Source/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModel.js
@@ -63,8 +63,8 @@ define([
             // multiple frustums.
             '<li><strong>Commands: </strong>' + stats.numberOfCommands.toLocaleString() + '</li>';
         s += '</ul>';
-        s += '<ul class="cesium-cesiumInspector-stats">';
         if (!isPick) {
+            s += '<ul class="cesium-cesiumInspector-stats">';
             s +=
                 // --- Cache/loading stats
                 '<li><strong>Requests: </strong>' + stats.numberOfPendingRequests.toLocaleString() + '</li>' +
@@ -139,6 +139,7 @@ define([
         var canvas = scene.canvas;
         this._eventHandler = new ScreenSpaceEventHandler(canvas);
         this._scene = scene;
+        this._performanceContainer = performanceContainer;
         this._canvas = canvas;
 
         this._performanceDisplay = new PerformanceDisplay({
@@ -229,17 +230,20 @@ define([
          */
         this.styleString = '{}';
 
+        this._tileset = undefined;
+        this._feature = undefined;
+
         knockout.track(this, ['performance', 'inspectorVisible', '_statsText', '_pickStatsText', '_editorError', 'showPickStats', 'showStats',
-                              'tilesetVisible', 'displayVisible', 'updateVisible', 'loggingVisible', 'styleVisible', 'styleString']);
+                              'tilesetVisible', 'displayVisible', 'updateVisible', 'loggingVisible', 'styleVisible', 'styleString', '_feature']);
 
         this._properties = knockout.observable({});
         /**
          * Gets the names of the properties in the tileset.  This property is observable.
-         * @type {String}
+         * @type {String[]}
          * @readonly
          */
-        this.propertiesText = '';
-        knockout.defineProperty(this, 'propertiesText', function() {
+        this.properties = [];
+        knockout.defineProperty(this, 'properties', function() {
             var names = [];
             var properties = that._properties();
             for (var prop in properties) {
@@ -247,7 +251,7 @@ define([
                     names.push(prop);
                 }
             }
-            return names.join(', ');
+            return names;
         });
 
         var dynamicScreenSpaceError = knockout.observable();
@@ -568,9 +572,7 @@ define([
 
         this._style = undefined;
         this._shouldStyle = false;
-        this._tileset = undefined;
-        this._feature = undefined;
-        this._definedProperties = ['propertiesText', 'dynamicScreenSpaceError', 'colorBlendMode', 'picking', 'colorize', 'wireframe', 'showBoundingVolumes',
+        this._definedProperties = ['properties', 'dynamicScreenSpaceError', 'colorBlendMode', 'picking', 'colorize', 'wireframe', 'showBoundingVolumes',
                                    'showContentBoundingVolumes', 'showRequestVolumes', 'showGeometricError', 'freezeFrame', 'maximumScreenSpaceError',
                                    'dynamicScreenSpaceErrorDensity', 'dynamicScreenSpaceErrorDensitySliderValue', 'dynamicScreenSpaceErrorFactor', 'pickActive'];
         this._removePostRenderEvent = scene.postRender.addEventListener(function() {
@@ -579,6 +581,29 @@ define([
     }
 
     defineProperties(Cesium3DTilesInspectorViewModel.prototype, {
+        /**
+         * Gets the scene
+         * @memberof Cesium3DTilesInspectorViewModel.prototype
+         * @type {Scene}
+         * @readonly
+         */
+        scene: {
+            get: function() {
+                return this._scene;
+            }
+        },
+        /**
+         * Gets the performance container
+         * @memberof Cesium3DTilesInspectorViewModel.prototype
+         * @type {HTMLElement}
+         * @readonly
+         */
+        performanceContainer: {
+            get: function() {
+                return this._performanceContainer;
+            }
+        },
+
         /**
          * Gets the stats text.  This property is observable.
          * @memberof Cesium3DTilesInspectorViewModel.prototype
@@ -638,6 +663,7 @@ define([
             set : function(tileset) {
                 this._tileset = tileset;
                 this._style = undefined;
+                this.styleString = '{}';
                 this.feature = undefined;
 
                 if (defined(tileset)) {
@@ -772,22 +798,17 @@ define([
      * Compiles the style in the style editor
      */
     Cesium3DTilesInspectorViewModel.prototype.compileStyle = function() {
-        if (!defined(this._tileset) || !defined(this._style) || this.styleString === JSON.stringify(this._style.style)) {
+        var tileset = this._tileset;
+        if (!defined(tileset) || this.styleString === JSON.stringify(tileset.style)) {
             return;
         }
-        var old = this._tileset.style;
         this._editorError = '';
         try {
             if (this.styleString.length === 0) {
                 this.styleString = '{}';
             }
-            var style = new Cesium3DTileStyle(JSON.parse(this.styleString));
-            this._tileset.style = style;
-            this._style = style;
-            this._tileset.update(this._scene.frameState);
+            this._style = new Cesium3DTileStyle(JSON.parse(this.styleString));
         } catch (err) {
-            this._tileset.style = old;
-            this._style = old;
             this._editorError = err.toString();
         }
 
@@ -849,14 +870,12 @@ define([
         }
 
         if (defined(tileset)) {
-            if (!defined(this._style) || this._style !== tileset.style) {
-                this._style = tileset.style;
-                if (defined(this._style)) {
-                    this.styleString = JSON.stringify(this._style.style, null, '  ');
-                    this.compileStyle();
-                } else {
-                    this.styleString = '{}';
-                }
+            var style = tileset.style;
+            if (defined(style) && !defined(this._style)) {
+                this._style = style;
+                this.styleString = JSON.stringify(style.style, null, '  ');
+            } else if (this._style !== tileset.style) {
+                tileset.style = this._style;
             }
             if (this._shouldStyle) {
                 tileset._styleEngine.makeDirty();
diff --git a/Specs/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModelSpec.js b/Specs/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModelSpec.js
index 1d3a859fce53..c5b9c947ba8e 100644
--- a/Specs/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModelSpec.js
+++ b/Specs/Widgets/Cesium3DTilesInspector/Cesium3DTilesInspectorViewModelSpec.js
@@ -72,10 +72,10 @@ defineSuite([
             viewModel.tileset = tileset;
             var done = when.defer();
             tileset.readyPromise.then(function() {
-                expect(viewModel.propertiesText.indexOf('id') !== -1).toBe(true);
-                expect(viewModel.propertiesText.indexOf('Longitude') !== -1).toBe(true);
-                expect(viewModel.propertiesText.indexOf('Latitude') !== -1).toBe(true);
-                expect(viewModel.propertiesText.indexOf('Height') !== -1).toBe(true);
+                expect(viewModel.properties.indexOf('id') !== -1).toBe(true);
+                expect(viewModel.properties.indexOf('Longitude') !== -1).toBe(true);
+                expect(viewModel.properties.indexOf('Latitude') !== -1).toBe(true);
+                expect(viewModel.properties.indexOf('Height') !== -1).toBe(true);
                 viewModel.destroy();
                 done.resolve();
             });
@@ -223,12 +223,14 @@ defineSuite([
         });
 
         it('recompiles style', function() {
+            viewModel._style = undefined;
             viewModel.tileset.style = style;
             viewModel._update();
             var s = JSON.parse(viewModel.styleString);
             s.color = "color('red')";
             viewModel.styleString = JSON.stringify(s);
             viewModel.compileStyle();
+            viewModel._update();
             expect(viewModel.tileset.style.style.color).toBe("color('red')");
             expect(viewModel.tileset.style.style.meta.description).toBe("'Building id ${id} has height ${Height}.'");
         });