Move edit.js to new toolbar API

scripts/system/edit.js

@@ -16,7 +16,6 @@ HIFI_PUBLIC_BUCKET = "http://s3.amazonaws.com/hifi-public/";
 Script.include([
     "libraries/stringHelpers.js",
     "libraries/dataViewHelpers.js",
-    "libraries/toolBars.js",
     "libraries/progressDialog.js",
 
     "libraries/entitySelectionTool.js",
@@ -50,11 +49,6 @@ selectionManager.addEventListener(function() {
     lightOverlayManager.updatePositions();
 });
 
-var toolIconUrl = Script.resolvePath("assets/images/tools/");
-var toolHeight = 50;
-var toolWidth = 50;
-var TOOLBAR_MARGIN_Y = 0;
-
 var DEGREES_TO_RADIANS = Math.PI / 180.0;
 var RADIANS_TO_DEGREES = 180.0 / Math.PI;
 var epsilon = 0.001;
@@ -104,6 +98,7 @@ IMPORTING_SVO_OVERLAY_WIDTH = 144;
 IMPORTING_SVO_OVERLAY_HEIGHT = 30;
 IMPORTING_SVO_OVERLAY_MARGIN = 5;
 IMPORTING_SVO_OVERLAY_LEFT_MARGIN = 34;
+
 var importingSVOImageOverlay = Overlays.addOverlay("image", {
     imageURL: Script.resolvePath("assets") + "/images/hourglass.svg",
     width: 20,
@@ -168,241 +163,19 @@ function toggleMarketplace() {
 }
 
 var toolBar = (function() {
+    var EDIT_SETTING = "io.highfidelity.isEditting"; // for communication with other scripts
+    var TOOL_ICON_URL = Script.resolvePath("assets/images/tools/");
     var that = {},
         toolBar,
-        activeButton,
-        newModelButton,
-        newCubeButton,
-        newSphereButton,
-        newLightButton,
-        newTextButton,
-        newWebButton,
-        newZoneButton,
-        newParticleButton
-
-    function initialize() {
-        toolBar = new ToolBar(0, 0, ToolBar.HORIZONTAL, "highfidelity.edit.toolbar", function(windowDimensions, toolbar) {
-            return {
-                x: (windowDimensions.x / 2) + (Tool.IMAGE_WIDTH * 2),
-                y: windowDimensions.y
-            };
-        }, {
-            x: toolWidth,
-            y: -TOOLBAR_MARGIN_Y - toolHeight
-        });
-
-        activeButton = toolBar.addTool({
-            imageURL: toolIconUrl + "edit.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            visible: true
-        }, true, false);
-
-        newModelButton = toolBar.addTool({
-            imageURL: toolIconUrl + "model-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        newCubeButton = toolBar.addTool({
-            imageURL: toolIconUrl + "cube-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        newSphereButton = toolBar.addTool({
-            imageURL: toolIconUrl + "sphere-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        newLightButton = toolBar.addTool({
-            imageURL: toolIconUrl + "light-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        newTextButton = toolBar.addTool({
-            imageURL: toolIconUrl + "text-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        newWebButton = toolBar.addTool({
-            imageURL: toolIconUrl + "web-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        newZoneButton = toolBar.addTool({
-            imageURL: toolIconUrl + "zone-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        newParticleButton = toolBar.addTool({
-            imageURL: toolIconUrl + "particle-01.svg",
-            subImage: {
-                x: 0,
-                y: Tool.IMAGE_WIDTH,
-                width: Tool.IMAGE_WIDTH,
-                height: Tool.IMAGE_HEIGHT
-            },
-            width: toolWidth,
-            height: toolHeight,
-            alpha: 0.9,
-            showButtonDown: true,
-            visible: false
-        });
-
-        that.setActive(false);
-    }
-
-    that.clearEntityList = function() {
-        entityListTool.clearEntityList();
-    };
-
-    var EDIT_SETTING = "io.highfidelity.isEditting"; // for communication with other scripts
-    Settings.setValue(EDIT_SETTING, false);
-    that.setActive = function(active) {
-        if (active != isActive) {
-            if (active && !Entities.canRez() && !Entities.canRezTmp()) {
-                Window.alert(INSUFFICIENT_PERMISSIONS_ERROR_MSG);
-            } else {
-                Messages.sendLocalMessage("edit-events", JSON.stringify({
-                    enabled: active
-                }));
-                isActive = active;
-                Settings.setValue(EDIT_SETTING, active);
-                if (!isActive) {
-                    entityListTool.setVisible(false);
-                    gridTool.setVisible(false);
-                    grid.setEnabled(false);
-                    propertiesTool.setVisible(false);
-                    selectionManager.clearSelections();
-                    cameraManager.disable();
-                    selectionDisplay.triggerMapping.disable();
-                } else {
-                    UserActivityLogger.enabledEdit();
-                    hasShownPropertiesTool = false;
-                    entityListTool.setVisible(true);
-                    gridTool.setVisible(true);
-                    grid.setEnabled(true);
-                    propertiesTool.setVisible(true);
-                    // Not sure what the following was meant to accomplish, but it currently causes
-                    selectionDisplay.triggerMapping.enable();
-                    // everybody else to think that Interface has lost focus overall. fogbugzid:558
-                    // Window.setFocus();
-                }
-                that.showTools(isActive);
-            }
-        }
-        toolBar.selectTool(activeButton, isActive);
-        lightOverlayManager.setVisible(isActive && Menu.isOptionChecked(MENU_SHOW_LIGHTS_IN_EDIT_MODE));
-        Entities.setDrawZoneBoundaries(isActive && Menu.isOptionChecked(MENU_SHOW_ZONES_IN_EDIT_MODE));
-    };
-
-    // Sets visibility of tool buttons, excluding the power button
-    that.showTools = function(doShow) {
-        toolBar.showTool(newModelButton, doShow);
-        toolBar.showTool(newCubeButton, doShow);
-        toolBar.showTool(newSphereButton, doShow);
-        toolBar.showTool(newLightButton, doShow);
-        toolBar.showTool(newTextButton, doShow);
-        toolBar.showTool(newWebButton, doShow);
-        toolBar.showTool(newZoneButton, doShow);
-        toolBar.showTool(newParticleButton, doShow);
-    };
-
-    var RESIZE_INTERVAL = 50;
-    var RESIZE_TIMEOUT = 120000; // 2 minutes
-    var RESIZE_MAX_CHECKS = RESIZE_TIMEOUT / RESIZE_INTERVAL;
-
-    function addModel(url) {
-        var entityID = createNewEntity({
-            type: "Model",
-            modelURL: url
-        }, false);
-
-        if (entityID) {
-            print("Model added: " + url);
-            selectionManager.setSelections([entityID]);
-        }
-    }
-
+        systemToolbar,
+        activeButton;
+        
     function createNewEntity(properties, dragOnCreate) {
+        Settings.setValue(EDIT_SETTING, false);
+
         // Default to true if not passed in
-        dragOnCreate = dragOnCreate == undefined ? true : dragOnCreate;
+        // dragOnCreate = dragOnCreate == undefined ? true : dragOnCreate;
+        dragOnCreate = false;
 
         var dimensions = properties.dimensions ? properties.dimensions : DEFAULT_DIMENSIONS;
         var position = getPositionToCreateEntity();
@@ -426,35 +199,69 @@ var toolBar = (function() {
         return entityID;
     }
 
-    that.mousePressEvent = function(event) {
-        var clickedOverlay,
-            url,
-            file;
-
-        if (!event.isLeftButton) {
-            // if another mouse button than left is pressed ignore it
-            return false;
+    function cleanup() {
+        that.setActive(false);
+    }
+    
+    function addButton(name, image, handler) {
+        var imageUrl = TOOL_ICON_URL + image;
+        var button = toolBar.addButton({
+            objectName: name,
+            imageURL: imageUrl, 
+            buttonState: 1,
+            alpha: 0.9,
+            visible: true,
+        });
+        if (handler) {
+            button.clicked.connect(function(){
+                Script.setTimeout(handler, 100);
+            });
         }
+        return button;
+    }
 
-        clickedOverlay = Overlays.getOverlayAtPoint({
-            x: event.x,
-            y: event.y
+    function initialize() {
+        print("QQQ creating edit toolbar");
+        Script.scriptEnding.connect(cleanup);
+        
+        Window.domainChanged.connect(function() {
+            that.setActive(false);
+            that.clearEntityList();
         });
 
-        if (activeButton === toolBar.clicked(clickedOverlay)) {
-            that.setActive(!isActive);
-            return true;
-        }
-
-        if (newModelButton === toolBar.clicked(clickedOverlay)) {
-            url = Window.prompt("Model URL");
-            if (url !== null && url !== "") {
-                addModel(url);
+        Entities.canAdjustLocksChanged.connect(function(canAdjustLocks) {
+            if (isActive && !canAdjustLocks) {
+                that.setActive(false);
             }
-            return true;
-        }
+        });
 
-        if (newCubeButton === toolBar.clicked(clickedOverlay)) {
+        systemToolbar = Toolbars.getToolbar("com.highfidelity.interface.toolbar.system");
+        activeButton = systemToolbar.addButton({
+            objectName: "activeButton",
+            imageURL: TOOL_ICON_URL + "edit.svg",
+            visible: true,
+            buttonState: 1,
+            alpha: 0.9,
+        });
+        activeButton.clicked.connect(function(){
+            that.setActive(!isActive);
+            activeButton.writeProperty("buttonState", isActive ? 0 : 1);
+        });
+
+        toolBar = Toolbars.getToolbar("com.highfidelity.interface.toolbar.edit");
+        toolBar.writeProperty("shown", false);
+
+        addButton("newModelButton", "model-01.svg", function(){
+            var url = Window.prompt("Model URL");
+            if (url !== null && url !== "") {
+                createNewEntity({
+                    type: "Model",
+                    modelURL: url
+                }, false);
+            }
+        });
+
+        addButton("newCubeButton", "cube-01.svg", function(){
             createNewEntity({
                 type: "Box",
                 dimensions: DEFAULT_DIMENSIONS,
@@ -464,11 +271,9 @@ var toolBar = (function() {
                     blue: 0
                 }
             });
+        });
 
-            return true;
-        }
-
-        if (newSphereButton === toolBar.clicked(clickedOverlay)) {
+        addButton("newSphereButton", "sphere-01.svg", function(){
             createNewEntity({
                 type: "Sphere",
                 dimensions: DEFAULT_DIMENSIONS,
@@ -478,11 +283,9 @@ var toolBar = (function() {
                     blue: 0
                 }
             });
+        });
 
-            return true;
-        }
-
-        if (newLightButton === toolBar.clicked(clickedOverlay)) {
+        addButton("newLightButton", "light-01.svg", function(){
             createNewEntity({
                 type: "Light",
                 dimensions: DEFAULT_LIGHT_DIMENSIONS,
@@ -499,11 +302,9 @@ var toolBar = (function() {
                 exponent: 0,
                 cutoff: 180, // in degrees
             });
+        });
 
-            return true;
-        }
-
-        if (newTextButton === toolBar.clicked(clickedOverlay)) {
+        addButton("newTextButton", "text-01.svg", function(){
             createNewEntity({
                 type: "Text",
                 dimensions: {
@@ -524,11 +325,9 @@ var toolBar = (function() {
                 text: "some text",
                 lineHeight: 0.06
             });
+        });
 
-            return true;
-        }
-
-        if (newWebButton === toolBar.clicked(clickedOverlay)) {
+        addButton("newWebButton", "web-01.svg", function(){
             createNewEntity({
                 type: "Web",
                 dimensions: {
@@ -538,11 +337,9 @@ var toolBar = (function() {
                 },
                 sourceUrl: "https://highfidelity.com/",
             });
+        });
 
-            return true;
-        }
-
-        if (newZoneButton === toolBar.clicked(clickedOverlay)) {
+        addButton("newZoneButton", "zone-01.svg", function(){
             createNewEntity({
                 type: "Zone",
                 dimensions: {
@@ -551,11 +348,9 @@ var toolBar = (function() {
                     z: 10
                 },
             });
+        });
 
-            return true;
-        }
-
-        if (newParticleButton === toolBar.clicked(clickedOverlay)) {
+        addButton("newParticleButton", "particle-01.svg", function(){
             createNewEntity({
                 type: "ParticleEffect",
                 isEmitting: true,
@@ -577,33 +372,65 @@ var toolBar = (function() {
                 emitRate: 100,
                 textures: "https://hifi-public.s3.amazonaws.com/alan/Particles/Particle-Sprite-Smoke-1.png",
             });
-        }
+        });
 
-        return false;
+        that.setActive(false);
+    }
+    
+    that.clearEntityList = function() {
+        entityListTool.clearEntityList();
     };
 
-    that.mouseReleaseEvent = function(event) {
-        return false;
-    }
-
-    Window.domainChanged.connect(function() {
-        that.setActive(false);
-        that.clearEntityList();
-    });
-
-    Entities.canAdjustLocksChanged.connect(function(canAdjustLocks) {
-        if (isActive && !canAdjustLocks) {
-            that.setActive(false);
+    that.setActive = function(active) {
+        if (active == isActive) {
+            return;
         }
-    });
-
-    that.cleanup = function() {
-        toolBar.cleanup();
+        if (active && !Entities.canRez() && !Entities.canRezTmp()) {
+            Window.alert(INSUFFICIENT_PERMISSIONS_ERROR_MSG);
+            return;
+        }
+        Messages.sendLocalMessage("edit-events", JSON.stringify({
+            enabled: active
+        }));
+        isActive = active;
+        Settings.setValue(EDIT_SETTING, active);
+        if (!isActive) {
+            entityListTool.setVisible(false);
+            gridTool.setVisible(false);
+            grid.setEnabled(false);
+            propertiesTool.setVisible(false);
+            selectionManager.clearSelections();
+            cameraManager.disable();
+            selectionDisplay.triggerMapping.disable();
+        } else {
+            UserActivityLogger.enabledEdit();
+            hasShownPropertiesTool = false;
+            entityListTool.setVisible(true);
+            gridTool.setVisible(true);
+            grid.setEnabled(true);
+            propertiesTool.setVisible(true);
+            // Not sure what the following was meant to accomplish, but it currently causes
+            selectionDisplay.triggerMapping.enable();
+            // everybody else to think that Interface has lost focus overall. fogbugzid:558
+            // Window.setFocus();
+        }
+        // Sets visibility of tool buttons, excluding the power button
+        toolBar.writeProperty("shown", active);
+        var visible = toolBar.readProperty("visible");
+        if (active && !visible) { 
+            toolBar.writeProperty("visible", false);
+            toolBar.writeProperty("shown", false);
+            toolBar.writeProperty("visible", true);
+            toolBar.writeProperty("shown", true);
+        }
+        //toolBar.selectTool(activeButton, isActive);
+        lightOverlayManager.setVisible(isActive && Menu.isOptionChecked(MENU_SHOW_LIGHTS_IN_EDIT_MODE));
+        Entities.setDrawZoneBoundaries(isActive && Menu.isOptionChecked(MENU_SHOW_ZONES_IN_EDIT_MODE));
     };
 
     initialize();
     return that;
-}());
+})();
 
 
 function isLocked(properties) {
@@ -712,7 +539,7 @@ function mousePressEvent(event) {
     mouseHasMovedSincePress = false;
     mouseCapturedByTool = false;
 
-    if (propertyMenu.mousePressEvent(event) || toolBar.mousePressEvent(event) || progressDialog.mousePressEvent(event)) {
+    if (propertyMenu.mousePressEvent(event) || progressDialog.mousePressEvent(event)) {
         mouseCapturedByTool = true;
         return;
     }
@@ -796,8 +623,7 @@ function mouseReleaseEvent(event) {
         mouseMove(lastMouseMoveEvent);
         lastMouseMoveEvent = null;
     }
-    if (propertyMenu.mouseReleaseEvent(event) || toolBar.mouseReleaseEvent(event)) {
-
+    if (propertyMenu.mouseReleaseEvent(event)) {
         return true;
     }
     if (placingEntityID) {
@@ -1094,7 +920,6 @@ Script.scriptEnding.connect(function() {
     Settings.setValue(SETTING_SHOW_ZONES_IN_EDIT_MODE, Menu.isOptionChecked(MENU_SHOW_ZONES_IN_EDIT_MODE));
 
     progressDialog.cleanup();
-    toolBar.cleanup();
     cleanupModelMenus();
     tooltip.cleanup();
     selectionDisplay.cleanup();