directory.js - icon is now movable and persistent

examples/directory.js

@@ -9,89 +9,117 @@
 //  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
 //
 
-Script.include("libraries/globals.js");
+Script.include([
+    "libraries/toolBars.js",
+]);
 
-var directory = (function () {
+HIFI_PUBLIC_BUCKET = "http://s3.amazonaws.com/hifi-public/";
+var toolIconUrl = HIFI_PUBLIC_BUCKET + "images/tools/";
 
-    var DIRECTORY_URL = "https://metaverse.highfidelity.com/directory",
+var DIRECTORY_WINDOW_URL = "https://metaverse.highfidelity.com/directory";
-        directoryWindow,
+var directoryWindow = new OverlayWebWindow({
-        DIRECTORY_BUTTON_URL = HIFI_PUBLIC_BUCKET + "images/tools/directory.svg",
+    title: 'directory',
-        BUTTON_WIDTH = 50,
+    source: "about:blank",
-        BUTTON_HEIGHT = 50,
+    width: 900,
-        BUTTON_ALPHA = 0.9,
+    height: 700,
-        BUTTON_MARGIN = 8,
+    visible: false
-        directoryButton,
+});
-        EDIT_TOOLBAR_BUTTONS = 10,  // Number of buttons in edit.js toolbar
-        viewport;
 
-    function updateButtonPosition() {
+var toolHeight = 50;
-        Overlays.editOverlay(directoryButton, {
+var toolWidth = 50;
-            x: viewport.x - BUTTON_WIDTH - BUTTON_MARGIN,
+
-            y: (viewport.y - (EDIT_TOOLBAR_BUTTONS + 1) * (BUTTON_HEIGHT + BUTTON_MARGIN) - BUTTON_MARGIN) / 2 - 1
+
+function showDirectory() {
+    directoryWindow.setURL(DIRECTORY_WINDOW_URL);
+    directoryWindow.setVisible(true);
+}
+
+function hideDirectory() {
+    directoryWindow.setVisible(false);
+    directoryWindow.setURL("about:blank");
+}
+
+function toggleDirectory() {
+    if (directoryWindow.visible) {
+        hideDirectory();
+    } else {
+        showDirectory();
+    }
+}
+
+var toolBar = (function() {
+    var that = {},
+        toolBar,
+        browseDirectoryButton;
+
+    function initialize() {
+        toolBar = new ToolBar(0, 0, ToolBar.VERTICAL, "highfidelity.directory.toolbar", function(windowDimensions, toolbar) {
+            return {
+                x: windowDimensions.x - 8 - toolbar.width,
+                y: 100
+            };
         });
+        browseDirectoryButton = toolBar.addTool({
+            imageURL: toolIconUrl + "directory.svg",
+            width: toolWidth,
+            height: toolHeight,
+            alpha: 0.9,
+            visible: true,
+        });
+
+        toolBar.showTool(browseDirectoryButton, true);
     }
 
-    function onMousePressEvent(event) {
+    var browseDirectoryButtonDown = false;
-        var clickedOverlay;
+    that.mousePressEvent = function(event) {
+        var clickedOverlay,
+            url,
+            file;
 
-        clickedOverlay = Overlays.getOverlayAtPoint({ x: event.x, y: event.y });
+        if (!event.isLeftButton) {
-
+            // if another mouse button than left is pressed ignore it
-        if (clickedOverlay === directoryButton) {
+            return false;
-            if (directoryWindow.url !== DIRECTORY_URL) {
-                directoryWindow.setURL(DIRECTORY_URL);
-            }
-            directoryWindow.setVisible(true);
-            directoryWindow.raise();
         }
-    }
 
-    function onDomainChanged() {
+        clickedOverlay = Overlays.getOverlayAtPoint({
-        directoryWindow.setVisible(false);
+            x: event.x,
-    }
+            y: event.y
+        });
 
-    function onScriptUpdate() {
-        var oldViewport = viewport;
 
-        viewport = Controller.getViewportDimensions();
 
-        if (viewport.x !== oldViewport.x || viewport.y !== oldViewport.y) {
+        if (browseDirectoryButton === toolBar.clicked(clickedOverlay)) {
-            updateButtonPosition();
+            toggleDirectory();
+            return true;
         }
+
+        return false;
+    };
+
+    that.mouseReleaseEvent = function(event) {
+        var handled = false;
+
+
+        if (browseDirectoryButtonDown) {
+            var clickedOverlay = Overlays.getOverlayAtPoint({
+                x: event.x,
+                y: event.y
+            });
+        }
+
+        newModelButtonDown = false;
+        browseDirectoryButtonDown = false;
+
+        return handled;
     }
 
-    function setUp() {
+    that.cleanup = function() {
-        viewport = Controller.getViewportDimensions();
+        toolBar.cleanup();
+    };
 
-        directoryWindow = new OverlayWebWindow({
+    initialize();
-            title: 'Directory', 
+    return that;
-            source: DIRECTORY_URL, 
-            width: 900, 
-            height: 700,
-            visible: false      
-        });
-
-        directoryButton = Overlays.addOverlay("image", {
-            imageURL: DIRECTORY_BUTTON_URL,
-            width: BUTTON_WIDTH,
-            height: BUTTON_HEIGHT,
-            x: viewport.x - BUTTON_WIDTH - BUTTON_MARGIN,
-            y: BUTTON_MARGIN,
-            alpha: BUTTON_ALPHA,
-            visible: true
-        });
-
-        updateButtonPosition();
-
-        Controller.mousePressEvent.connect(onMousePressEvent);
-        Window.domainChanged.connect(onDomainChanged);
-
-        Script.update.connect(onScriptUpdate);
-    }
-
-    function tearDown() {
-        Overlays.deleteOverlay(directoryButton);
-    }
-
-    setUp();
-    Script.scriptEnding.connect(tearDown);
 }());
+
+Controller.mousePressEvent.connect(toolBar.mousePressEvent)
+Script.scriptEnding.connect(toolBar.cleanup);

examples/marketplace.js

@@ -1,3 +1,14 @@
+//
+//  marketplace.js
+//  examples
+//
+//  Created by Eric Levin on 8 Jan 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
 Script.include([
     "libraries/toolBars.js",
 ]);
@@ -26,7 +37,6 @@ function showMarketplace(marketplaceID) {
     print("setting marketplace URL to " + url);
     marketplaceWindow.setURL(url);
     marketplaceWindow.setVisible(true);
-    marketplaceWindow.raise();
 }
 
 function hideMarketplace() {
@@ -48,7 +58,7 @@ var toolBar = (function() {
         browseMarketplaceButton;
 
     function initialize() {
-        toolBar = new ToolBar(0, 0, ToolBar.VERTICAL, "", function(windowDimensions, toolbar) {
+        toolBar = new ToolBar(0, 0, ToolBar.VERTICAL, "highfidelity.marketplace.toolbar", function(windowDimensions, toolbar) {
             return {
                 x: windowDimensions.x - 8 - toolbar.width,
                 y: 150
@@ -67,7 +77,6 @@ var toolBar = (function() {
 
     var browseMarketplaceButtonDown = false;
     that.mousePressEvent = function(event) {
-        print("CLICKED")
         var clickedOverlay,
             url,
             file;