Mirrors/overte-lubosz
3
0
Fork 0
mirror of https://github.com/lubosz/overte.git synced 2025-04-08 20:22:34 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Draggable toolBar.js, with persistence, and update some scripts for it.

Browse source
This commit is contained in:
Howard Stearns 2015-06-11 16:19:54 -07:00
parent 24fda9a733
commit e6bafb9bf1
5 changed files with 119 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
examples/controllers/hydra/gun.js
View file

@ -99,6 +99,13 @@ var NUM_BUTTONS = 3;
var screenSize = Controller.getViewportDimensions();
var startX = screenSize.x / 2 - (NUM_BUTTONS * (BUTTON_SIZE + PADDING)) / 2;
Script.include(["../../libraries/toolBars.js"]);
const persistKey = "highfidelity.gun.toolbar.position";
var toolBar = new ToolBar(0, 0, ToolBar.HORIZONTAL);
toolBar.save = function () {
Settings.setValue(persistKey, JSON.stringify([toolBar.x, toolBar.y]));
};
var old = JSON.parse(Settings.getValue(persistKey) || '0');
var reticle = Overlays.addOverlay("image", {
x: screenSize.x / 2 - (BUTTON_SIZE / 2),
y: screenSize.y / 2 - (BUTTON_SIZE / 2),
@ -108,9 +115,9 @@ var reticle = Overlays.addOverlay("image", {
alpha: 1
});
var offButton = Overlays.addOverlay("image", {
x: startX,
y: screenSize.y - (BUTTON_SIZE + PADDING),
var offButton = toolBar.addOverlay("image", {
x: old ? old[0] : startX,
y: old ? old[1] : (screenSize.y - (BUTTON_SIZE + PADDING)),
width: BUTTON_SIZE,
height: BUTTON_SIZE,
imageURL: HIFI_PUBLIC_BUCKET + "images/gun/close.svg",
@ -118,7 +125,7 @@ var offButton = Overlays.addOverlay("image", {
});
startX += BUTTON_SIZE + PADDING;
var platformButton = Overlays.addOverlay("image", {
var platformButton = toolBar.addOverlay("image", {
x: startX,
y: screenSize.y - (BUTTON_SIZE + PADDING),
width: BUTTON_SIZE,
@ -128,7 +135,7 @@ var platformButton = Overlays.addOverlay("image", {
});
startX += BUTTON_SIZE + PADDING;
var gridButton = Overlays.addOverlay("image", {
var gridButton = toolBar.addOverlay("image", {
x: startX,
y: screenSize.y - (BUTTON_SIZE + PADDING),
width: BUTTON_SIZE,
@ -493,10 +500,8 @@ function mousePressEvent(event) {
}
function scriptEnding() {
Overlays.deleteOverlay(reticle);
Overlays.deleteOverlay(offButton);
Overlays.deleteOverlay(platformButton);
Overlays.deleteOverlay(gridButton);
Overlays.deleteOverlay(reticle);
toolBar.cleanup();
Overlays.deleteOverlay(pointer[0]);
Overlays.deleteOverlay(pointer[1]);
Overlays.deleteOverlay(text);

24
examples/dice.js
View file

@ -3,6 +3,7 @@
// examples
//
// Created by Philip Rosedale on February 2, 2015
// Persist toolbar by HRS 6/11/15.
// Copyright 2015 High Fidelity, Inc.
//
// Press the dice button to throw some dice from the center of the screen.
@ -31,9 +32,16 @@ var screenSize = Controller.getViewportDimensions();
var BUTTON_SIZE = 32;
var PADDING = 3;
var offButton = Overlays.addOverlay("image", {
x: screenSize.x / 2 - BUTTON_SIZE * 2 + PADDING,
y: screenSize.y - (BUTTON_SIZE + PADDING),
Script.include(["libraries/toolBars.js"]);
var toolBar = new ToolBar(0, 0, ToolBar.HORIZONTAL);
const persistKey = "highfidelity.dice.toolbar.position";
toolBar.save = function () {
Settings.setValue(persistKey, JSON.stringify([toolBar.x, toolBar.y]));
};
var old = JSON.parse(Settings.getValue(persistKey) || '0');
var offButton = toolBar.addOverlay("image", {
x: old ? old[0] : (screenSize.x / 2 - BUTTON_SIZE * 2 + PADDING),
y: old ? old[1] : (screenSize.y - (BUTTON_SIZE + PADDING)),
width: BUTTON_SIZE,
height: BUTTON_SIZE,
imageURL: HIFI_PUBLIC_BUCKET + "images/close.png",
@ -45,7 +53,7 @@ var offButton = Overlays.addOverlay("image", {
alpha: 1
});
var deleteButton = Overlays.addOverlay("image", {
var deleteButton = toolBar.addOverlay("image", {
x: screenSize.x / 2 - BUTTON_SIZE,
y: screenSize.y - (BUTTON_SIZE + PADDING),
width: BUTTON_SIZE,
@ -59,7 +67,7 @@ var deleteButton = Overlays.addOverlay("image", {
alpha: 1
});
var diceButton = Overlays.addOverlay("image", {
var diceButton = toolBar.addOverlay("image", {
x: screenSize.x / 2 + PADDING,
y: screenSize.y - (BUTTON_SIZE + PADDING),
width: BUTTON_SIZE,
@ -140,10 +148,8 @@ function mousePressEvent(event) {
}
function scriptEnding() {
Overlays.deleteOverlay(offButton);
Overlays.deleteOverlay(diceButton);
Overlays.deleteOverlay(deleteButton);
toolBar.cleanup();
}
Controller.mousePressEvent.connect(mousePressEvent);
Script.scriptEnding.connect(scriptEnding);
Script.scriptEnding.connect(scriptEnding);

11
examples/edit.js
View file

@ -2,6 +2,7 @@
// examples
//
// Created by Brad Hefta-Gaub on 10/2/14.
// Persist toolbar by HRS 6/11/15.
// Copyright 2014 High Fidelity, Inc.
//
// This script allows you to edit entities with a new UI/UX for mouse and trackpad based editing
@ -320,6 +321,7 @@ var toolBar = (function () {
}
}
const persistKey = "highfidelity.edit.toolbar.position";
that.move = function () {
var newViewPort,
toolsX,
@ -330,6 +332,15 @@ var toolBar = (function () {
if (toolBar === undefined) {
initialize();
toolBar.save = function () {
Settings.setValue(persistKey, JSON.stringify([toolBar.x, toolBar.y]));
};
var old = JSON.parse(Settings.getValue(persistKey) || '0');
if (old) {
windowDimensions = newViewPort;
toolBar.move(old[0], old[1]);
return;
}
} else if (windowDimensions.x === newViewPort.x &&
windowDimensions.y === newViewPort.y) {
return;

70
examples/libraries/toolBars.js
View file

@ -236,6 +236,7 @@ ToolBar = function(x, y, direction) {
y: y - ToolBar.SPACING
});
}
this.save();
}
this.setAlpha = function(alpha, tool) {
@ -313,9 +314,8 @@ ToolBar = function(x, y, direction) {
this.cleanup = function() {
for(var tool in this.tools) {
this.tools[tool].cleanup();
delete this.tools[tool];
}
if (this.back != null) {
Overlays.deleteOverlay(this.back);
this.back = null;
@ -327,7 +327,71 @@ ToolBar = function(x, y, direction) {
this.width = 0;
this.height = 0;
}
var that = this;
this.contains = function (xOrPoint, optionalY) {
var x = (optionalY === undefined) ? xOrPoint.x : xOrPoint,
y = (optionalY === undefined) ? xOrPoint.y : optionalY;
return (that.x <= x) && (x <= (that.x + that.width)) &&
(that.y <= y) && (y <= (that.y + that.height));
}
that.hover = function (enable) {
that.isHovering = enable;
if (that.back) {
if (enable) {
that.oldAlpha = Overlays.getProperty(that.back, 'backgroundAlpha');
}
Overlays.editOverlay(this.back, {
visible: enable,
backgroundAlpha: enable ? 0.5 : that.oldAlpha
});
}
};
// These are currently only doing that which is necessary for toolbar hover and toolbar drag.
// They have not yet been extended to tool hover/click/release, etc.
this.mousePressEvent = function (event) {
if (!that.contains(event)) {
that.mightBeDragging = false;
return;
}
that.mightBeDragging = true;
that.dragOffsetX = that.x - event.x;
that.dragOffsetY = that.y - event.y;
};
this.mouseMove = function (event) {
if (!that.mightBeDragging || !event.isLeftButton) {
that.mightBeDragging = false;
if (!that.contains(event)) {
if (that.isHovering) {
that.hover(false);
}
return;
}
if (!that.isHovering) {
that.hover(true);
}
return;
}
that.move(that.dragOffsetX + event.x, that.dragOffsetY + event.y);
};
Controller.mousePressEvent.connect(this.mousePressEvent);
Controller.mouseMoveEvent.connect(this.mouseMove);
// Called on move. A different approach would be to have all this on the prototype,
// and let apps extend where needed. Ex. app defines its toolbar.move() to call this.__proto__.move and then save.
this.save = function () { };
// This compatability hack breaks the model, but makes converting existing scripts easier:
this.addOverlay = function (ignored, oldSchoolProperties) {
var properties = JSON.parse(JSON.stringify(oldSchoolProperties)); // a copy
if (that.numberOfTools() === 0) {
that.move(properties.x, properties.y);
}
delete properties.x;
delete properties.y;
var index = that.addTool(properties);
var id = that.tools[index].overlay();
return id;
}
}
ToolBar.SPACING = 4;
ToolBar.VERTICAL = 0;
ToolBar.HORIZONTAL = 1;
ToolBar.HORIZONTAL = 1;

16
examples/pointer.js
View file

@ -3,6 +3,7 @@
//
// Created by Seth Alves on May 15th
// Modified by Eric Levin on June 4
// Persist toolbar by HRS 6/11/15.
// Copyright 2015 High Fidelity, Inc.
//
// Provides a pointer with option to draw on surfaces
@ -31,9 +32,16 @@ HIFI_PUBLIC_BUCKET = "http://s3.amazonaws.com/hifi-public/";
var screenSize = Controller.getViewportDimensions();
var userCanPoint = false;
var pointerButton = Overlays.addOverlay("image", {
x: screenSize.x / 2 - BUTTON_SIZE * 2 + PADDING,
y: screenSize.y - (BUTTON_SIZE + PADDING),
Script.include(["libraries/toolBars.js"]);
const persistKey = "highfidelity.pointer.toolbar.position";
var toolBar = new ToolBar(0, 0, ToolBar.HORIZONTAL);
toolBar.save = function () {
Settings.setValue(persistKey, JSON.stringify([toolBar.x, toolBar.y]));
};
var old = JSON.parse(Settings.getValue(persistKey) || '0');
var pointerButton = toolBar.addOverlay("image", {
x: old ? old[0] : screenSize.x / 2 - BUTTON_SIZE * 2 + PADDING,
y: old ? old[1] : screenSize.y - (BUTTON_SIZE + PADDING),
width: BUTTON_SIZE,
height: BUTTON_SIZE,
imageURL: HIFI_PUBLIC_BUCKET + "images/laser.png",
@ -150,4 +158,4 @@ Script.scriptEnding.connect(cleanup);
Controller.mouseMoveEvent.connect(mouseMoveEvent);
Controller.mousePressEvent.connect(mousePressEvent);
Controller.mouseReleaseEvent.connect(mouseReleaseEvent);
Controller.mouseReleaseEvent.connect(mouseReleaseEvent);