Mirrors/overte-thingvellir
3
0
Fork 0
mirror of https://thingvellir.net/git/overte synced 2025-03-27 23:52:03 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #7367 from ctrlaltdavid/20852

Browse source 
Restyle directory, edit, and marketplace toolbars
This commit is contained in:
Ryan Downe Karpf 2016-03-17 14:32:48 -07:00
commit 8914406987
5 changed files with 76 additions and 161 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
examples/directory.js
View file

@ -53,7 +53,6 @@ var toolBar = (function() {
browseDirectoryButton;
function initialize() {
ToolBar.SPACING = 16;
toolBar = new ToolBar(0, 0, ToolBar.VERTICAL, "highfidelity.directory.toolbar", function(windowDimensions, toolbar) {
return {
x: windowDimensions.x - 8 - toolbar.width,
@ -61,11 +60,18 @@ var toolBar = (function() {
};
});
browseDirectoryButton = toolBar.addTool({
imageURL: toolIconUrl + "directory.svg",
imageURL: toolIconUrl + "directory-01.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,
showButtonDown: true
});
toolBar.showTool(browseDirectoryButton, true);

179
examples/edit.js
View file

@ -180,7 +180,6 @@ var toolBar = (function() {
newTextButton,
newWebButton,
newZoneButton,
newPolyVoxButton,
newParticleButton
function initialize() {
@ -191,10 +190,8 @@ var toolBar = (function() {
};
});
activeButton = toolBar.addTool({
imageURL: toolIconUrl + "edit-status.svg",
imageURL: toolIconUrl + "edit-01.svg",
subImage: {
x: 0,
y: Tool.IMAGE_WIDTH,
@ -208,7 +205,7 @@ var toolBar = (function() {
}, true, false);
newModelButton = toolBar.addTool({
imageURL: toolIconUrl + "upload.svg",
imageURL: toolIconUrl + "upload-01.svg",
subImage: {
x: 0,
y: Tool.IMAGE_WIDTH,
@ -218,11 +215,12 @@ var toolBar = (function() {
width: toolWidth,
height: toolHeight,
alpha: 0.9,
showButtonDown: true,
visible: false
});
newCubeButton = toolBar.addTool({
imageURL: toolIconUrl + "add-cube.svg",
imageURL: toolIconUrl + "cube-01.svg",
subImage: {
x: 0,
y: Tool.IMAGE_WIDTH,
@ -232,11 +230,12 @@ var toolBar = (function() {
width: toolWidth,
height: toolHeight,
alpha: 0.9,
showButtonDown: true,
visible: false
});
newSphereButton = toolBar.addTool({
imageURL: toolIconUrl + "add-sphere.svg",
imageURL: toolIconUrl + "sphere-01.svg",
subImage: {
x: 0,
y: Tool.IMAGE_WIDTH,
@ -246,11 +245,12 @@ var toolBar = (function() {
width: toolWidth,
height: toolHeight,
alpha: 0.9,
showButtonDown: true,
visible: false
});
newLightButton = toolBar.addTool({
imageURL: toolIconUrl + "light.svg",
imageURL: toolIconUrl + "light-01.svg",
subImage: {
x: 0,
y: Tool.IMAGE_WIDTH,
@ -260,11 +260,12 @@ var toolBar = (function() {
width: toolWidth,
height: toolHeight,
alpha: 0.9,
showButtonDown: true,
visible: false
});
newTextButton = toolBar.addTool({
imageURL: toolIconUrl + "add-text.svg",
imageURL: toolIconUrl + "text-01.svg",
subImage: {
x: 0,
y: Tool.IMAGE_WIDTH,
@ -274,62 +275,52 @@ var toolBar = (function() {
width: toolWidth,
height: toolHeight,
alpha: 0.9,
showButtonDown: true,
visible: false
});
newWebButton = toolBar.addTool({
imageURL: "https://hifi-public.s3.amazonaws.com/images/www.svg",
imageURL: toolIconUrl + "web-01.svg",
subImage: {
x: 0,
y: 0,
width: 128,
height: 128
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 + "zonecube_text.svg",
imageURL: toolIconUrl + "zone-01.svg",
subImage: {
x: 0,
y: 128,
width: 128,
height: 128
},
width: toolWidth,
height: toolHeight,
alpha: 0.9,
visible: false
});
newPolyVoxButton = toolBar.addTool({
imageURL: toolIconUrl + "polyvox.svg",
subImage: {
x: 0,
y: 0,
width: 256,
height: 256
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.svg",
imageURL: toolIconUrl + "particle-01.svg",
subImage: {
x: 0,
y: 0,
width: 256,
height: 256
y: Tool.IMAGE_WIDTH,
width: Tool.IMAGE_WIDTH,
height: Tool.IMAGE_HEIGHT
},
width: toolWidth,
height: toolHeight,
alpha: 0.9,
showButtonDown: true,
visible: false
});
@ -379,7 +370,6 @@ var toolBar = (function() {
toolBar.showTool(newTextButton, doShow);
toolBar.showTool(newWebButton, doShow);
toolBar.showTool(newZoneButton, doShow);
toolBar.showTool(newPolyVoxButton, doShow);
toolBar.showTool(newParticleButton, doShow);
};
@ -421,7 +411,6 @@ var toolBar = (function() {
return entityID;
}
var newModelButtonDown = false;
that.mousePressEvent = function(event) {
var clickedOverlay,
url,
@ -442,14 +431,14 @@ var toolBar = (function() {
return true;
}
// Handle these two buttons in the mouseRelease event handler so that we don't suppress a mouseRelease event from
// occurring when showing a modal dialog.
if (newModelButton === toolBar.clicked(clickedOverlay)) {
newModelButtonDown = true;
url = Window.prompt("Model URL", modelURLs[Math.floor(Math.random() * modelURLs.length)]);
if (url !== null && url !== "") {
addModel(url);
}
return true;
}
if (newCubeButton === toolBar.clicked(clickedOverlay)) {
createNewEntity({
type: "Box",
@ -551,92 +540,6 @@ var toolBar = (function() {
return true;
}
if (newPolyVoxButton === toolBar.clicked(clickedOverlay)) {
var polyVoxId = createNewEntity({
type: "PolyVox",
dimensions: {
x: 10,
y: 10,
z: 10
},
voxelVolumeSize: {
x: 16,
y: 16,
z: 16
},
voxelSurfaceStyle: 2
});
for (var x = 1; x <= 14; x++) {
Entities.setVoxel(polyVoxId, {
x: x,
y: 1,
z: 1
}, 255);
Entities.setVoxel(polyVoxId, {
x: x,
y: 14,
z: 1
}, 255);
Entities.setVoxel(polyVoxId, {
x: x,
y: 1,
z: 14
}, 255);
Entities.setVoxel(polyVoxId, {
x: x,
y: 14,
z: 14
}, 255);
}
for (var y = 2; y <= 13; y++) {
Entities.setVoxel(polyVoxId, {
x: 1,
y: y,
z: 1
}, 255);
Entities.setVoxel(polyVoxId, {
x: 14,
y: y,
z: 1
}, 255);
Entities.setVoxel(polyVoxId, {
x: 1,
y: y,
z: 14
}, 255);
Entities.setVoxel(polyVoxId, {
x: 14,
y: y,
z: 14
}, 255);
}
for (var z = 2; z <= 13; z++) {
Entities.setVoxel(polyVoxId, {
x: 1,
y: 1,
z: z
}, 255);
Entities.setVoxel(polyVoxId, {
x: 14,
y: 1,
z: z
}, 255);
Entities.setVoxel(polyVoxId, {
x: 1,
y: 14,
z: z
}, 255);
Entities.setVoxel(polyVoxId, {
x: 14,
y: 14,
z: z
}, 255);
}
return true;
}
if (newParticleButton === toolBar.clicked(clickedOverlay)) {
createNewEntity({
type: "ParticleEffect",
@ -656,26 +559,8 @@ var toolBar = (function() {
return false;
};
that.mouseReleaseEvent = function(event) {
var handled = false;
if (newModelButtonDown) {
var clickedOverlay = Overlays.getOverlayAtPoint({
x: event.x,
y: event.y
});
if (newModelButton === toolBar.clicked(clickedOverlay)) {
url = Window.prompt("Model URL", modelURLs[Math.floor(Math.random() * modelURLs.length)]);
if (url !== null && url !== "") {
addModel(url);
}
handled = true;
}
}
newModelButtonDown = false;
return handled;
that.mouseReleaseEvent = function (event) {
return false;
}
Window.domainChanged.connect(function() {

38
examples/libraries/toolBars.js
View file

@ -110,12 +110,25 @@ Tool = function(properties, selectable, selected) { // selectable and selected a
}
this.select(selected);
this.isButtonDown = false;
this.buttonDown = function (down) {
if (down !== this.isButtonDown) {
properties.subImage.y = (down ? 0 : 1) * properties.subImage.height;
Overlays.editOverlay(this.overlay(), { subImage: properties.subImage });
this.isButtonDown = down;
}
}
this.baseClicked = this.clicked;
this.clicked = function(clickedOverlay, update) {
if (this.baseClicked(clickedOverlay)) {
if (selectable && update) {
this.toggle();
if (update) {
if (selectable) {
this.toggle();
} else if (properties.showButtonDown) {
this.buttonDown(true);
}
}
return true;
}
@ -131,7 +144,7 @@ ToolBar = function(x, y, direction, optionalPersistenceKey, optionalInitialPosit
this.x = x;
this.y = y;
this.width = 0;
this.height = ToolBar.TITLE_BAR_HEIGHT;
this.height = 0
this.backAlpha = 1.0;
this.back = Overlays.addOverlay("rectangle", {
color: { red: 255, green: 255, blue: 255 },
@ -327,13 +340,13 @@ ToolBar = function(x, y, direction, optionalPersistenceKey, optionalInitialPosit
}
var that = this;
this.contains = function (xOrPoint, optionalY) {
this.contains = function (xOrPoint, optionalY) { // All four margins are draggable.
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));
return ((that.x - ToolBar.SPACING) <= x) && (x <= (that.x + that.width + ToolBar.SPACING)) &&
((that.y - ToolBar.SPACING) <= y) && (y <= (that.y + that.height));
}
that.hover = function (enable) { // Can be overriden or extended by clients.
that.hover = function (enable) { // Can be overridden or extended by clients.
that.isHovering = enable;
if (that.back) {
Overlays.editOverlay(this.back, {
@ -376,6 +389,11 @@ ToolBar = function(x, y, direction, optionalPersistenceKey, optionalInitialPosit
that.mightBeDragging = false;
}
};
this.mouseReleaseEvent = function (event) {
for (var tool in that.tools) {
that.tools[tool].buttonDown(false);
}
}
this.mouseMove = function (event) {
if (!that.mightBeDragging || !event.isLeftButton) {
that.mightBeDragging = false;
@ -399,6 +417,7 @@ ToolBar = function(x, y, direction, optionalPersistenceKey, optionalInitialPosit
}
};
Controller.mousePressEvent.connect(this.mousePressEvent);
Controller.mouseReleaseEvent.connect(this.mouseReleaseEvent);
Controller.mouseMoveEvent.connect(this.mouseMove);
Script.update.connect(that.checkResize);
// This compatability hack breaks the model, but makes converting existing scripts easier:
@ -431,7 +450,6 @@ ToolBar = function(x, y, direction, optionalPersistenceKey, optionalInitialPosit
}
}
}
ToolBar.SPACING = 4;
ToolBar.SPACING = 6;
ToolBar.VERTICAL = 0;
ToolBar.HORIZONTAL = 1;
ToolBar.TITLE_BAR_HEIGHT = 10;

10
examples/marketplace.js
View file

@ -58,7 +58,6 @@ var toolBar = (function() {
browseMarketplaceButton;
function initialize() {
ToolBar.SPACING = 16;
toolBar = new ToolBar(0, 0, ToolBar.VERTICAL, "highfidelity.marketplace.toolbar", function(windowDimensions, toolbar) {
return {
x: windowDimensions.x - 8 - toolbar.width,
@ -66,11 +65,18 @@ var toolBar = (function() {
};
});
browseMarketplaceButton = toolBar.addTool({
imageURL: toolIconUrl + "marketplace.svg",
imageURL: toolIconUrl + "market-01.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,
showButtonDown: true
});
toolBar.showTool(browseMarketplaceButton, true);

BIN
interface/resources/fonts/hifi-glyphs.ttf
View file

Binary file not shown.