Mirrors/overte-JulianGro
3
0
Fork 0
mirror of https://github.com/JulianGro/overte.git synced 2025-04-19 13:44:20 +02: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 errorConnectingToDomain = false;
var resettingError = false;
// Tips have a character limit of 69
var userTips = [
@ -128,7 +127,7 @@
localPosition: { x: 0.0 , y: -1.6, z: 0.0 },
text: toolTip,
textAlpha: 1,
backgroundAlpha: 1,
backgroundAlpha: 0.00393,
lineHeight: 0.13,
visible: isVisible,
ignoreRayIntersection: true,
@ -138,17 +137,47 @@
parentID: anchorOverlay
});
var loadingToTheSpotID = Overlays.addOverlay("image3d", {
var loadingToTheSpotText = Overlays.addOverlay("text3d", {
name: "Loading-Destination-Card-Text",
localPosition: { x: 0.0 , y: -1.5, z: -0.3 },
url: Script.resourcesPath() + "images/interstitialPage/goTo_button.png",
localPosition: { x: 0.0 , y: -1.687, z: -0.3 },
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,
visible: isVisible,
emissive: true,
ignoreRayIntersection: false,
drawInFront: true,
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
});
@ -268,7 +297,7 @@
domainName = name.charAt(0).toUpperCase() + name.slice(1);
var doRequest = true;
if (name.length === 0 && location.href === "file:///~/serverless/tutorial.json") {
domainName = "Serveless Domain (Tutorial)";
domainName = "Serverless Domain (Tutorial)";
doRequest = false;
}
var domainNameLeftMargin = getLeftMargin(domainNameTextID, domainName);
@ -319,8 +348,10 @@
var THE_PLACE = (HifiAbout.buildVersion === "dev") ? "hifi://TheSpot-dev": "hifi://TheSpot";
function clickedOnOverlay(overlayID, event) {
if (loadingToTheSpotID === overlayID) {
if (loadingToTheSpotHoverID === overlayID) {
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")["enablePointLight"] = physicsEnabled;
Overlays.editOverlay(loadingSphereID, mainSphereProperties);
Overlays.editOverlay(loadingToTheSpotText, properties);
Overlays.editOverlay(loadingToTheSpotID, properties);
Overlays.editOverlay(domainNameTextID, properties);
Overlays.editOverlay(domainDescription, domainTextProperties);
@ -475,13 +507,15 @@
Overlays.mouseReleaseOnOverlay.connect(clickedOnOverlay);
Overlays.hoverEnterOverlay.connect(function(overlayID, event) {
if (overlayID === loadingToTheSpotID) {
Overlays.editOverlay(loadingToTheSpotID, { color: greyColor });
Overlays.editOverlay(loadingToTheSpotID, {visible: false});
Overlays.editOverlay(loadingToTheSpotHoverID, {visible: true});
}
});
Overlays.hoverLeaveOverlay.connect(function(overlayID, event) {
if (overlayID === loadingToTheSpotID) {
Overlays.editOverlay(loadingToTheSpotID, { color: whiteColor });
if (overlayID === loadingToTheSpotHoverID) {
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() {
Overlays.deleteOverlay(loadingSphereID);
Overlays.deleteOverlay(loadingToTheSpotID);
Overlays.deleteOverlay(loadingToTheSpotHoverID);
Overlays.deleteOverlay(domainNameTextID);
Overlays.deleteOverlay(domainDescription);
Overlays.deleteOverlay(domainToolTip);

132
scripts/system/redirectOverlays.js
View file

@ -43,15 +43,15 @@
leftMargin: 0.538373570564886,
visible: false,
emissive: true,
ignoreRayIntersection: false,
ignoreRayIntersection: true,
dimensions: oopsDimensions,
grabbable: false,
});
var tryAgainImage = Overlays.addOverlay("image3d", {
var tryAgainImageNeutral = Overlays.addOverlay("image3d", {
name: "tryAgainImage",
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,
visible: false,
emissive: true,
@ -61,10 +61,10 @@
parentID: redirectOopsText
});
var backImage = Overlays.addOverlay("image3d", {
name: "backImage",
localPosition: {x: 0.6, y: -0.6, z: 0.0},
url: Script.resourcesPath() + "images/interstitialPage/button_back.png",
var tryAgainImageHover = Overlays.addOverlay("image3d", {
name: "tryAgainImageHover",
localPosition: {x: -0.6, y: -0.6, z: 0.0},
url: Script.resourcesPath() + "images/interstitialPage/button_hover.png",
alpha: 1,
visible: false,
emissive: true,
@ -74,6 +74,62 @@
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) {
if (!isInErrorState) {
var properties = {
@ -81,8 +137,10 @@
};
Overlays.editOverlay(redirectOopsText, properties);
Overlays.editOverlay(tryAgainImage, properties);
Overlays.editOverlay(backImage, properties);
Overlays.editOverlay(tryAgainImageNeutral, properties);
Overlays.editOverlay(tryAgainImageHover, properties);
Overlays.editOverlay(backImageNeutral, properties);
Overlays.editOverlay(backImageHover, properties);
return;
}
var oopsText = getOopsText();
@ -104,9 +162,29 @@
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(tryAgainImage, properties);
Overlays.editOverlay(backImage, properties);
Overlays.editOverlay(tryAgainImageNeutral, 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.
return;
}
if (tryAgainImage === overlayID) {
if (tryAgainImageHover === overlayID) {
location.goToLastAddress();
} else if (backImage === overlayID) {
} else if (backImageHover === overlayID) {
location.goBack();
}
}
@ -126,24 +204,36 @@
Script.clearInterval(timer);
timer = null;
Overlays.deleteOverlay(redirectOopsText);
Overlays.deleteOverlay(tryAgainImage);
Overlays.deleteOverlay(backImage);
Overlays.deleteOverlay(tryAgainImageNeutral);
Overlays.deleteOverlay(backImageNeutral);
Overlays.deleteOverlay(tryAgainImageHover);
Overlays.deleteOverlay(backImageHover);
Overlays.deleteOverlay(tryAgainText);
Overlays.deleteOverlay(backText);
}
toggleOverlays(true);
var whiteColor = {red: 255, green: 255, blue: 255};
var greyColor = {red: 125, green: 125, blue: 125};
Overlays.mouseReleaseOnOverlay.connect(clickedOnOverlay);
Overlays.hoverEnterOverlay.connect(function(overlayID, event) {
if (overlayID === backImage || overlayID === tryAgainImage) {
Overlays.editOverlay(overlayID, { color: greyColor });
if (overlayID === backImageNeutral) {
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) {
if (overlayID === backImage || overlayID === tryAgainImage) {
Overlays.editOverlay(overlayID, { color: whiteColor });
if (overlayID === backImageHover) {
Overlays.editOverlay(backImageHover, {visible: false});
Overlays.editOverlay(backImageNeutral, {visible: true});
}
if (overlayID === tryAgainImageHover) {
Overlays.editOverlay(tryAgainImageHover, {visible: false});
Overlays.editOverlay(tryAgainImageNeutral, {visible: true});
}
});