From a66bc791a3e2248c7dca777df513388628abceb4 Mon Sep 17 00:00:00 2001 From: ericrius1 Date: Fri, 8 Jan 2016 16:33:51 -0800 Subject: [PATCH] directory.js - icon is now movable and persistent --- examples/directory.js | 166 +++++++++++++++++++++++----------------- examples/marketplace.js | 15 +++- 2 files changed, 109 insertions(+), 72 deletions(-) diff --git a/examples/directory.js b/examples/directory.js index 8d9993ffda..69db3a4d89 100644 --- a/examples/directory.js +++ b/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", - directoryWindow, - DIRECTORY_BUTTON_URL = HIFI_PUBLIC_BUCKET + "images/tools/directory.svg", - BUTTON_WIDTH = 50, - BUTTON_HEIGHT = 50, - BUTTON_ALPHA = 0.9, - BUTTON_MARGIN = 8, - directoryButton, - EDIT_TOOLBAR_BUTTONS = 10, // Number of buttons in edit.js toolbar - viewport; +var DIRECTORY_WINDOW_URL = "https://metaverse.highfidelity.com/directory"; +var directoryWindow = new OverlayWebWindow({ + title: 'directory', + source: "about:blank", + width: 900, + height: 700, + visible: false +}); - function updateButtonPosition() { - Overlays.editOverlay(directoryButton, { - x: viewport.x - BUTTON_WIDTH - BUTTON_MARGIN, - y: (viewport.y - (EDIT_TOOLBAR_BUTTONS + 1) * (BUTTON_HEIGHT + BUTTON_MARGIN) - BUTTON_MARGIN) / 2 - 1 +var toolHeight = 50; +var toolWidth = 50; + + +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 clickedOverlay; + var browseDirectoryButtonDown = false; + that.mousePressEvent = function(event) { + var clickedOverlay, + url, + file; - clickedOverlay = Overlays.getOverlayAtPoint({ x: event.x, y: event.y }); - - if (clickedOverlay === directoryButton) { - if (directoryWindow.url !== DIRECTORY_URL) { - directoryWindow.setURL(DIRECTORY_URL); - } - directoryWindow.setVisible(true); - directoryWindow.raise(); + if (!event.isLeftButton) { + // if another mouse button than left is pressed ignore it + return false; } - } - function onDomainChanged() { - directoryWindow.setVisible(false); - } + clickedOverlay = Overlays.getOverlayAtPoint({ + x: event.x, + y: event.y + }); - function onScriptUpdate() { - var oldViewport = viewport; - viewport = Controller.getViewportDimensions(); - if (viewport.x !== oldViewport.x || viewport.y !== oldViewport.y) { - updateButtonPosition(); + if (browseDirectoryButton === toolBar.clicked(clickedOverlay)) { + 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() { - viewport = Controller.getViewportDimensions(); + that.cleanup = function() { + toolBar.cleanup(); + }; - directoryWindow = new OverlayWebWindow({ - title: 'Directory', - source: DIRECTORY_URL, - width: 900, - height: 700, - visible: false - }); + initialize(); + return that; +}()); - 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); -}()); \ No newline at end of file +Controller.mousePressEvent.connect(toolBar.mousePressEvent) +Script.scriptEnding.connect(toolBar.cleanup); diff --git a/examples/marketplace.js b/examples/marketplace.js index 074966c196..4583492c58 100644 --- a/examples/marketplace.js +++ b/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;