Mirrors/overte-Armored-Dragon
3
0
Fork 0
mirror of https://github.com/Armored-Dragon/overte.git synced 2025-03-11 16:13:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

text overlays for consistency

Browse source
This commit is contained in:
Wayne Chen 2018-10-01 16:11:27 -07:00
parent 5f05be554f
commit 69b547a9fe
2 changed files with 164 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

64
scripts/system/interstitialPage.js
View file

@ -38,7 +38,6 @@
var button = null; var button = null;
var errorConnectingToDomain = false; var errorConnectingToDomain = false;
var resettingError = false;
// Tips have a character limit of 69 // Tips have a character limit of 69
var userTips = [ var userTips = [
@ -128,7 +127,7 @@
localPosition: { x: 0.0 , y: -1.6, z: 0.0 }, localPosition: { x: 0.0 , y: -1.6, z: 0.0 },
text: toolTip, text: toolTip,
textAlpha: 1, textAlpha: 1,
backgroundAlpha: 1, backgroundAlpha: 0.00393,
lineHeight: 0.13, lineHeight: 0.13,
visible: isVisible, visible: isVisible,
ignoreRayIntersection: true, ignoreRayIntersection: true,
@ -138,17 +137,47 @@
parentID: anchorOverlay parentID: anchorOverlay
}); });
var loadingToTheSpotID = Overlays.addOverlay("image3d", { var loadingToTheSpotText = Overlays.addOverlay("text3d", {
name: "Loading-Destination-Card-Text", name: "Loading-Destination-Card-Text",
localPosition: { x: 0.0 , y: -1.5, z: -0.3 }, localPosition: { x: 0.0 , y: -1.687, z: -0.3 },
url: Script.resourcesPath() + "images/interstitialPage/goTo_button.png", text: "Go To TheSpot",
textAlpha: 1,
backgroundAlpha: 0.00393,
lineHeight: 0.10,
visible: isVisible,
ignoreRayIntersection: true,
dimensions: {x: 1, y: 0.17},
drawInFront: true,
grabbable: false,
localOrientation: Quat.fromVec3Degrees({ x: 0, y: 180, z: 0 }),
parentID: anchorOverlay
});
var loadingToTheSpotID = Overlays.addOverlay("image3d", {
name: "Loading-Destination-Card-GoTo-Image",
localPosition: { x: 0.0 , y: -1.75, z: -0.3 },
url: Script.resourcesPath() + "images/interstitialPage/button.png",
alpha: 1, alpha: 1,
visible: isVisible, visible: isVisible,
emissive: true, emissive: true,
ignoreRayIntersection: false, ignoreRayIntersection: false,
drawInFront: true, drawInFront: true,
grabbable: false, grabbable: false,
localOrientation: Quat.fromVec3Degrees({ x: 0.0, y: 180.0, z: 0.0 }), localOrientation: Quat.fromVec3Degrees({ x: 0, y: 180, z: 0 }),
parentID: anchorOverlay
});
var loadingToTheSpotHoverID = Overlays.addOverlay("image3d", {
name: "Loading-Destination-Card-GoTo-Image-Hover",
localPosition: { x: 0.0 , y: -1.75, z: -0.3 },
url: Script.resourcesPath() + "images/interstitialPage/button_hover.png",
alpha: 1,
visible: false,
emissive: true,
ignoreRayIntersection: false,
drawInFront: true,
grabbable: false,
localOrientation: Quat.fromVec3Degrees({ x: 0, y: 180, z: 0 }),
parentID: anchorOverlay parentID: anchorOverlay
}); });
@ -268,7 +297,7 @@
domainName = name.charAt(0).toUpperCase() + name.slice(1); domainName = name.charAt(0).toUpperCase() + name.slice(1);
var doRequest = true; var doRequest = true;
if (name.length === 0 && location.href === "file:///~/serverless/tutorial.json") { if (name.length === 0 && location.href === "file:///~/serverless/tutorial.json") {
domainName = "Serveless Domain (Tutorial)"; domainName = "Serverless Domain (Tutorial)";
doRequest = false; doRequest = false;
} }
var domainNameLeftMargin = getLeftMargin(domainNameTextID, domainName); var domainNameLeftMargin = getLeftMargin(domainNameTextID, domainName);
@ -319,8 +348,10 @@
var THE_PLACE = (HifiAbout.buildVersion === "dev") ? "hifi://TheSpot-dev": "hifi://TheSpot"; var THE_PLACE = (HifiAbout.buildVersion === "dev") ? "hifi://TheSpot-dev": "hifi://TheSpot";
function clickedOnOverlay(overlayID, event) { function clickedOnOverlay(overlayID, event) {
if (loadingToTheSpotID === overlayID) { if (loadingToTheSpotHoverID === overlayID) {
location.handleLookupString(THE_PLACE); location.handleLookupString(THE_PLACE);
Overlays.editOverlay(loadingToTheSpotHoverID, {visible: false});
Overlays.editOverlay(loadingToTheSpotID, {visible: true});
} }
} }
@ -353,6 +384,7 @@
renderViewTask.getConfig("LightingModel")["enableDirectionalLight"] = physicsEnabled; renderViewTask.getConfig("LightingModel")["enableDirectionalLight"] = physicsEnabled;
renderViewTask.getConfig("LightingModel")["enablePointLight"] = physicsEnabled; renderViewTask.getConfig("LightingModel")["enablePointLight"] = physicsEnabled;
Overlays.editOverlay(loadingSphereID, mainSphereProperties); Overlays.editOverlay(loadingSphereID, mainSphereProperties);
Overlays.editOverlay(loadingToTheSpotText, properties);
Overlays.editOverlay(loadingToTheSpotID, properties); Overlays.editOverlay(loadingToTheSpotID, properties);
Overlays.editOverlay(domainNameTextID, properties); Overlays.editOverlay(domainNameTextID, properties);
Overlays.editOverlay(domainDescription, domainTextProperties); Overlays.editOverlay(domainDescription, domainTextProperties);
@ -475,13 +507,15 @@
Overlays.mouseReleaseOnOverlay.connect(clickedOnOverlay); Overlays.mouseReleaseOnOverlay.connect(clickedOnOverlay);
Overlays.hoverEnterOverlay.connect(function(overlayID, event) { Overlays.hoverEnterOverlay.connect(function(overlayID, event) {
if (overlayID === loadingToTheSpotID) { if (overlayID === loadingToTheSpotID) {
Overlays.editOverlay(loadingToTheSpotID, { color: greyColor }); Overlays.editOverlay(loadingToTheSpotID, {visible: false});
Overlays.editOverlay(loadingToTheSpotHoverID, {visible: true});
} }
}); });
Overlays.hoverLeaveOverlay.connect(function(overlayID, event) { Overlays.hoverLeaveOverlay.connect(function(overlayID, event) {
if (overlayID === loadingToTheSpotID) { if (overlayID === loadingToTheSpotHoverID) {
Overlays.editOverlay(loadingToTheSpotID, { color: whiteColor }); Overlays.editOverlay(loadingToTheSpotHoverID, {visible: false});
Overlays.editOverlay(loadingToTheSpotID, {visible: true});
} }
}); });
@ -510,9 +544,17 @@
}); });
} }
// set left margin of text.
var loadingTextProperties = {
leftMargin: getLeftMargin(loadingToTheSpotText, "Go To TheSpot") + 0.045
};
Overlays.editOverlay(loadingToTheSpotText, loadingTextProperties);
function cleanup() { function cleanup() {
Overlays.deleteOverlay(loadingSphereID); Overlays.deleteOverlay(loadingSphereID);
Overlays.deleteOverlay(loadingToTheSpotID); Overlays.deleteOverlay(loadingToTheSpotID);
Overlays.deleteOverlay(loadingToTheSpotHoverID);
Overlays.deleteOverlay(domainNameTextID); Overlays.deleteOverlay(domainNameTextID);
Overlays.deleteOverlay(domainDescription); Overlays.deleteOverlay(domainDescription);
Overlays.deleteOverlay(domainToolTip); Overlays.deleteOverlay(domainToolTip);

132
scripts/system/redirectOverlays.js
View file

@ -43,15 +43,15 @@
leftMargin: 0.538373570564886, leftMargin: 0.538373570564886,
visible: false, visible: false,
emissive: true, emissive: true,
ignoreRayIntersection: false, ignoreRayIntersection: true,
dimensions: oopsDimensions, dimensions: oopsDimensions,
grabbable: false, grabbable: false,
}); });
var tryAgainImage = Overlays.addOverlay("image3d", { var tryAgainImageNeutral = Overlays.addOverlay("image3d", {
name: "tryAgainImage", name: "tryAgainImage",
localPosition: {x: -0.6, y: -0.6, z: 0.0}, localPosition: {x: -0.6, y: -0.6, z: 0.0},
url: Script.resourcesPath() + "images/interstitialPage/button_tryAgain.png", url: Script.resourcesPath() + "images/interstitialPage/button.png",
alpha: 1, alpha: 1,
visible: false, visible: false,
emissive: true, emissive: true,
@ -61,10 +61,10 @@
parentID: redirectOopsText parentID: redirectOopsText
}); });
var backImage = Overlays.addOverlay("image3d", { var tryAgainImageHover = Overlays.addOverlay("image3d", {
name: "backImage", name: "tryAgainImageHover",
localPosition: {x: 0.6, y: -0.6, z: 0.0}, localPosition: {x: -0.6, y: -0.6, z: 0.0},
url: Script.resourcesPath() + "images/interstitialPage/button_back.png", url: Script.resourcesPath() + "images/interstitialPage/button_hover.png",
alpha: 1, alpha: 1,
visible: false, visible: false,
emissive: true, emissive: true,
@ -74,6 +74,62 @@
parentID: redirectOopsText parentID: redirectOopsText
}); });
var tryAgainText = Overlays.addOverlay("text3d", {
name: "tryAgainText",
localPosition: {x: -0.6, y: -0.962, z: 0.0},
text: "Try Again",
textAlpha: 1,
backgroundAlpha: 0.00393,
lineHeight: 0.08,
visible: false,
emissive: true,
ignoreRayIntersection: true,
grabbable: false,
orientation: Overlays.getProperty(redirectOopsText, "orientation"),
parentID: redirectOopsText
});
var backImageNeutral = Overlays.addOverlay("image3d", {
name: "backImage",
localPosition: {x: 0.6, y: -0.6, z: 0.0},
url: Script.resourcesPath() + "images/interstitialPage/button.png",
alpha: 1,
visible: false,
emissive: true,
ignoreRayIntersection: false,
grabbable: false,
orientation: Overlays.getProperty(redirectOopsText, "orientation"),
parentID: redirectOopsText
});
var backImageHover = Overlays.addOverlay("image3d", {
name: "backImageHover",
localPosition: {x: 0.6, y: -0.6, z: 0.0},
url: Script.resourcesPath() + "images/interstitialPage/button_hover.png",
alpha: 1,
visible: false,
emissive: true,
ignoreRayIntersection: false,
grabbable: false,
orientation: Overlays.getProperty(redirectOopsText, "orientation"),
parentID: redirectOopsText
});
var backText = Overlays.addOverlay("text3d", {
name: "backText",
localPosition: {x: 0.6, y: -0.962, z: 0.0},
text: "Back",
textAlpha: 1,
backgroundAlpha: 0.00393,
lineHeight: 0.08,
visible: false,
emissive: true,
ignoreRayIntersection: true,
grabbable: false,
orientation: Overlays.getProperty(redirectOopsText, "orientation"),
parentID: redirectOopsText
});
function toggleOverlays(isInErrorState) { function toggleOverlays(isInErrorState) {
if (!isInErrorState) { if (!isInErrorState) {
var properties = { var properties = {
@ -81,8 +137,10 @@
}; };
Overlays.editOverlay(redirectOopsText, properties); Overlays.editOverlay(redirectOopsText, properties);
Overlays.editOverlay(tryAgainImage, properties); Overlays.editOverlay(tryAgainImageNeutral, properties);
Overlays.editOverlay(backImage, properties); Overlays.editOverlay(tryAgainImageHover, properties);
Overlays.editOverlay(backImageNeutral, properties);
Overlays.editOverlay(backImageHover, properties);
return; return;
} }
var oopsText = getOopsText(); var oopsText = getOopsText();
@ -104,9 +162,29 @@
leftMargin: (textOverlayWidth - textWidth) / 2 leftMargin: (textOverlayWidth - textWidth) / 2
}; };
var tryAgainTextWidth = Overlays.textSize(tryAgainText, "Try Again").width;
var tryAgainImageWidth = Overlays.getProperty(tryAgainImageNeutral, "dimensions").x;
var tryAgainTextProperties = {
visible: overlaysVisible,
leftMargin: (tryAgainImageWidth - tryAgainTextWidth) / 2
};
var backTextWidth = Overlays.textSize(backText, "Back").width;
var backImageWidth = Overlays.getProperty(backImageNeutral, "dimensions").x;
var backTextProperties = {
visible: overlaysVisible,
leftMargin: (backImageWidth - backTextWidth) / 2
};
Overlays.editOverlay(redirectOopsText, oopsTextProperties); Overlays.editOverlay(redirectOopsText, oopsTextProperties);
Overlays.editOverlay(tryAgainImage, properties); Overlays.editOverlay(tryAgainImageNeutral, properties);
Overlays.editOverlay(backImage, properties); Overlays.editOverlay(backImageNeutral, properties);
Overlays.editOverlay(tryAgainImageHover, {visible: false});
Overlays.editOverlay(backImageHover, {visible: false});
Overlays.editOverlay(tryAgainText, tryAgainTextProperties);
Overlays.editOverlay(backText, backTextProperties);
} }
@ -115,9 +193,9 @@
// don't allow right-clicks. // don't allow right-clicks.
return; return;
} }
if (tryAgainImage === overlayID) { if (tryAgainImageHover === overlayID) {
location.goToLastAddress(); location.goToLastAddress();
} else if (backImage === overlayID) { } else if (backImageHover === overlayID) {
location.goBack(); location.goBack();
} }
} }
@ -126,24 +204,36 @@
Script.clearInterval(timer); Script.clearInterval(timer);
timer = null; timer = null;
Overlays.deleteOverlay(redirectOopsText); Overlays.deleteOverlay(redirectOopsText);
Overlays.deleteOverlay(tryAgainImage); Overlays.deleteOverlay(tryAgainImageNeutral);
Overlays.deleteOverlay(backImage); Overlays.deleteOverlay(backImageNeutral);
Overlays.deleteOverlay(tryAgainImageHover);
Overlays.deleteOverlay(backImageHover);
Overlays.deleteOverlay(tryAgainText);
Overlays.deleteOverlay(backText);
} }
toggleOverlays(true); toggleOverlays(true);
var whiteColor = {red: 255, green: 255, blue: 255};
var greyColor = {red: 125, green: 125, blue: 125};
Overlays.mouseReleaseOnOverlay.connect(clickedOnOverlay); Overlays.mouseReleaseOnOverlay.connect(clickedOnOverlay);
Overlays.hoverEnterOverlay.connect(function(overlayID, event) { Overlays.hoverEnterOverlay.connect(function(overlayID, event) {
if (overlayID === backImage || overlayID === tryAgainImage) { if (overlayID === backImageNeutral) {
Overlays.editOverlay(overlayID, { color: greyColor }); Overlays.editOverlay(backImageNeutral, {visible: false});
Overlays.editOverlay(backImageHover, {visible: true});
}
if (overlayID === tryAgainImageNeutral) {
Overlays.editOverlay(tryAgainImageNeutral, {visible: false});
Overlays.editOverlay(tryAgainImageHover, {visible: true});
} }
}); });
Overlays.hoverLeaveOverlay.connect(function(overlayID, event) { Overlays.hoverLeaveOverlay.connect(function(overlayID, event) {
if (overlayID === backImage || overlayID === tryAgainImage) { if (overlayID === backImageHover) {
Overlays.editOverlay(overlayID, { color: whiteColor }); Overlays.editOverlay(backImageHover, {visible: false});
Overlays.editOverlay(backImageNeutral, {visible: true});
}
if (overlayID === tryAgainImageHover) {
Overlays.editOverlay(tryAgainImageHover, {visible: false});
Overlays.editOverlay(tryAgainImageNeutral, {visible: true});
} }
}); });