Sandcastle tweaks

Apps/Sandcastle/Sandcastle-header.js

@@ -1,6 +1,7 @@
 (function() {
     "use strict";
 
+    var defaultAction;
     var bucket = window.location.href;
     var pos = bucket.lastIndexOf('/');
     if (pos > 0 && pos < (bucket.length - 1)) {
@@ -15,23 +16,42 @@
         },
         registered : [],
         finishedLoading : function() {
+            window.Sandcastle.reset();
+
+            if(defaultAction) {
+                window.Sandcastle.highlight(defaultAction);
+                defaultAction();
+                defaultAction = undefined;
+            }
+
             document.body.className = document.body.className.replace(/(?:\s|^)sandcastle-loading(?:\s|$)/, ' ');
         },
         addToolbarButton : function(text, onclick, toolbarID) {
             window.Sandcastle.declare(onclick);
             var button = document.createElement('button');
             button.className = 'sandcastle-button';
             button.onclick = function() {
+                window.Sandcastle.reset();
                 window.Sandcastle.highlight(onclick);
                 onclick();
             };
             button.textContent = text;
             document.getElementById(toolbarID || 'toolbar').appendChild(button);
         },
-        addToolbarMenu : function(options, onchange, toolbarID) {
+        addDefaultToolbarButton : function(text, onclick, toolbarID) {
+            window.Sandcastle.addToolbarButton(text, onclick, toolbarID);
+            defaultAction = onclick;
+        },
+        addToolbarMenu : function(options, toolbarID) {
             var menu = document.createElement('select');
             menu.className = 'sandcastle-button';
-            menu.onchange = onchange;
+            menu.onchange = function() {
+                window.Sandcastle.reset();
+                var item = options[menu.selectedIndex];
+                if (item && typeof item.onselect === 'function') {
+                    item.onselect();
+                }
+            };
             document.getElementById(toolbarID || 'toolbar').appendChild(menu);
 
             for (var i = 0, len = options.length; i < len; ++i) {
@@ -40,6 +60,8 @@
                 option.value = options[i].value;
                 menu.appendChild(option);
             }
+        },
+        reset : function() {
         }
     };
 

Apps/Sandcastle/gallery/3D Models.html

@@ -34,14 +34,14 @@
     height = Cesium.defaultValue(height, 0.0);
 
     var modelMatrix = Cesium.Transforms.northEastDownToFixedFrame(Cesium.Cartesian3.fromDegrees(-123.0744619, 44.0503706, height));
-    
+
     scene.primitives.removeAll(); // Remove previous model
     var model = scene.primitives.add(Cesium.Model.fromGltf({
         url : url,
         modelMatrix : modelMatrix,
         minimumPixelSize : 128
     }));
-    
+
     model.readyToRender.addEventListener(function(model) {
         // Play and loop all animations at half-spead
         model.activeAnimations.addAll({
@@ -63,38 +63,37 @@
 }
 
 var handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
-handler.setInputAction(
-    function (movement) {
-        var pick = scene.pick(movement.endPosition);
-        if (Cesium.defined(pick) && Cesium.defined(pick.node) && Cesium.defined(pick.mesh)) {
-            // Output glTF node and mesh under the mouse. 
-            console.log('node: ' + pick.node.name + '. mesh: ' + pick.mesh.name);
-        }
-    },
-    Cesium.ScreenSpaceEventType.MOUSE_MOVE
-);
+handler.setInputAction(function(movement) {
+    var pick = scene.pick(movement.endPosition);
+    if (Cesium.defined(pick) && Cesium.defined(pick.node) && Cesium.defined(pick.mesh)) {
+        // Output glTF node and mesh under the mouse. 
+        console.log('node: ' + pick.node.name + '. mesh: ' + pick.mesh.name);
+    }
+}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
 
 ///////////////////////////////////////////////////////////////////////////
 
 var options = [{
-    text : 'Aircraft',
-    url : '../../SampleData/models/CesiumAir/Cesium_Air.gltf',
-    height : 5000.0
+text : 'Aircraft',
+onselect : function() {
+    createModel('../../SampleData/models/CesiumAir/Cesium_Air.gltf', 5000.0);
+    }
 }, {
-    text : 'Ground vehicle',
-    url : '../../SampleData/models/CesiumGround/Cesium_Ground.gltf'
+text : 'Ground vehicle',
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumGround/Cesium_Ground.gltf');
+    }
 }, {
     text : 'Skinned character',
-    url : '../../SampleData/models/CesiumMan/Cesium_Man.gltf'
+    onselect : function() {
+        createModel('../../SampleData/models/CesiumMan/Cesium_Man.gltf');
+    }
 }];
-createModel(options[0].url, options[0].height);
 
-Sandcastle.addToolbarMenu(options, function() {
-    var option = options[this.selectedIndex];
-    createModel(option.url, option.height);
-});
+Sandcastle.addToolbarMenu(options);
+options[0].onselect();
 //Sandcastle_End
-    Sandcastle.finishedLoading();
+Sandcastle.finishedLoading();
 }
 if (typeof Cesium !== "undefined") {
     startup(Cesium);

Apps/Sandcastle/gallery/Billboards.html

@@ -31,13 +31,8 @@
 var scene = viewer.scene;
 var primitives = scene.primitives;
 
-function reset() {
-    primitives.removeAll();
-}
-
 function addBillboard() {
     Sandcastle.declare(addBillboard);
-    reset();
 
     var billboards = scene.primitives.add(new Cesium.BillboardCollection());
     billboards.add({
@@ -48,7 +43,6 @@
 
 function setBillboardProperties() {
     Sandcastle.declare(setBillboardProperties);
-    reset();
 
     var billboards = scene.primitives.add(new Cesium.BillboardCollection());
     billboards.add({
@@ -70,7 +64,6 @@
 
 function changeBillboardProperties() {
     Sandcastle.declare(changeBillboardProperties);
-    reset();
 
     var billboards = scene.primitives.add(new Cesium.BillboardCollection());
 
@@ -87,7 +80,6 @@
 
 function addMultipleBillboards() {
     Sandcastle.declare(addMultipleBillboards);
-    reset();
 
     var logoUrl = '../images/Cesium_Logo_overlay.png';
     var facilityUrl = '../images/facility.gif';
@@ -109,7 +101,6 @@
 
 function scaleByDistance() {
     Sandcastle.declare(scaleByDistance);
-    reset();
 
     var billboards = scene.primitives.add(new Cesium.BillboardCollection());
     billboards.add({
@@ -121,7 +112,6 @@
 
 function fadeByDistance() {
     Sandcastle.declare(fadeByDistance);
-    reset();
 
     var billboards = scene.primitives.add(new Cesium.BillboardCollection());
     billboards.add({
@@ -133,7 +123,6 @@
 
 function offsetByDistance() {
     Sandcastle.declare(offsetByDistance);
-    reset();
     Cesium.when.all([
          Cesium.loadImage('../images/Cesium_Logo_overlay.png'),
          Cesium.loadImage('../images/facility.gif')
@@ -166,7 +155,6 @@
 
 function addPointBillboards() {
     Sandcastle.declare(addPointBillboards);
-    reset();
 
     // A white circle is drawn into a 2D canvas.  The canvas is used as
     // a texture for billboards, each of which applies a different color
@@ -209,7 +197,6 @@
 
 function addMarkerBillboards() {
     Sandcastle.declare(addMarkerBillboards);
-    reset();
 
     var billboards = scene.primitives.add(new Cesium.BillboardCollection());
 
@@ -248,7 +235,6 @@
 
 function inReferenceFrame() {
     Sandcastle.declare(inReferenceFrame);
-    reset();
 
     var billboards = scene.primitives.add(new Cesium.BillboardCollection());
     var center = Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883);
@@ -278,83 +264,77 @@
     });
 }
 
-function createUI() {
-    function selectMenuOption(menu, options) {
-        options[menu.selectedIndex].onselect();
+Sandcastle.addToolbarMenu([{
+    text : 'Add billboard',
+    onselect : function() {
+        addBillboard();
+        Sandcastle.highlight(addBillboard);
+    }
+}, {
+    text : 'Set billboard properties at creation',
+    onselect : function() {
+        setBillboardProperties();
+        Sandcastle.highlight(setBillboardProperties);
+    }
+}, {
+    text : 'Change billboard properties',
+    onselect : function() {
+        changeBillboardProperties();
+        Sandcastle.highlight(changeBillboardProperties);
+    }
+}, {
+    text : 'Add multiple billboards',
+    onselect : function() {
+        addMultipleBillboards();
+        Sandcastle.highlight(addMultipleBillboards);
+    }
+}, {
+    text : 'Scale by viewer distance',
+    onselect : function() {
+        scaleByDistance();
+        Sandcastle.highlight(scaleByDistance);
+    }
+}, {
+    text : 'Fade by viewer distance',
+    onselect : function() {
+        fadeByDistance();
+        Sandcastle.highlight(fadeByDistance);
     }
+}, {
+    text : 'Offset by viewer distance',
+    onselect : function() {
+        offsetByDistance();
+        Sandcastle.highlight(offsetByDistance);
+    }
+}, {
+    text : 'Add point billboards',
+    onselect : function() {
+        addPointBillboards();
+        Sandcastle.highlight(addPointBillboards);
+    }
+}, {
+    text : 'Add marker billboards',
+    onselect : function() {
+        addMarkerBillboards();
+        Sandcastle.highlight(addMarkerBillboards);
+    }
+}, {
+    text : 'Add billboards in reference frame',
+    onselect : function() {
+        inReferenceFrame();
+        Sandcastle.highlight(inReferenceFrame);
+    }
+}]);
 
-    var options = [{
-        text : 'Add billboard',
-        onselect : function() {
-            addBillboard();
-            Sandcastle.highlight(addBillboard);
-        }
-    }, {
-        text : 'Set billboard properties at creation',
-        onselect : function() {
-            setBillboardProperties();
-            Sandcastle.highlight(setBillboardProperties);
-        }
-    }, {
-        text : 'Change billboard properties',
-        onselect : function() {
-            changeBillboardProperties();
-            Sandcastle.highlight(changeBillboardProperties);
-        }
-    }, {
-        text : 'Add multiple billboards',
-        onselect : function() {
-            addMultipleBillboards();
-            Sandcastle.highlight(addMultipleBillboards);
-        }
-    }, {
-        text : 'Scale by viewer distance',
-        onselect : function() {
-            scaleByDistance();
-            Sandcastle.highlight(scaleByDistance);
-        }
-    }, {
-        text : 'Fade by viewer distance',
-        onselect : function() {
-            fadeByDistance();
-            Sandcastle.highlight(fadeByDistance);
-        }
-    }, {
-        text : 'Offset by viewer distance',
-        onselect : function() {
-            offsetByDistance();
-            Sandcastle.highlight(offsetByDistance);
-        }
-    }, {
-        text : 'Add point billboards',
-        onselect : function() {
-            addPointBillboards();
-            Sandcastle.highlight(addPointBillboards);
-        }
-    }, {
-        text : 'Add marker billboards',
-        onselect : function() {
-            addMarkerBillboards();
-            Sandcastle.highlight(addMarkerBillboards);
-        }
-    }, {
-        text : 'Add billboards in reference frame',
-        onselect : function() {
-            inReferenceFrame();
-            Sandcastle.highlight(inReferenceFrame);
-        }
-    }];
-
-    Sandcastle.addToolbarMenu(options, function() {
-        selectMenuOption(this, options);
-    });
-}
 
-createUI();
+Sandcastle.reset = function () {
+    primitives.removeAll();
+};
+
 addBillboard();
 Sandcastle.highlight(addBillboard);
 //Sandcastle_End
-    Sandcastle.finishedLoading();
+Sandcastle.finishedLoading();
 }
 if (typeof Cesium !== "undefined") {
     startup(Cesium);