Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-08-08 13:58:51 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Make updates to the hmd progress bar

Browse source
This commit is contained in:
Ryan Huffman 2016-07-29 17:17:59 -07:00
parent 9f6da23b15
commit 5d50389e29
2 changed files with 152 additions and 92 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
scripts/system/assets/images/progress-bar-background.svg
View file

@ -1,5 +1,5 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full" width="520" height="50" viewBox="0 0 520.00 60.00" enable-background="new 0 0 540.00 90.00" xml:space="preserve"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" baseProfile="full" width="520" height="50" viewBox="0 0 520.00 50.00" enable-background="new 0 0 540.00 50.00" xml:space="preserve">
<rect x="0" y="0" rx="8" ry="8" width="520" height="50" style="fille:black;opacity:0.6" /> <rect x="0" y="0" rx="8" ry="8" width="520" height="50" style="fille:black;opacity:0.6" />
</svg> </svg>

154
scripts/system/progress.js
View file

@ -33,7 +33,7 @@
BACKGROUND_WIDTH = 520, BACKGROUND_WIDTH = 520,
BACKGROUND_HEIGHT = 50, BACKGROUND_HEIGHT = 50,
BACKGROUND_URL = Script.resolvePath("assets/images/progress-bar-background.svg"), BACKGROUND_URL = Script.resolvePath("assets/images/progress-bar-background.svg"),
isOnHMD = false, use3DOverlay = false,
windowWidth = 0, windowWidth = 0,
windowHeight = 0, windowHeight = 0,
background2D = {}, background2D = {},
@ -45,10 +45,10 @@
PROGRESS_3D_DIRECTION = 0.0, // Degrees from avatar orientation. PROGRESS_3D_DIRECTION = 0.0, // Degrees from avatar orientation.
PROGRESS_3D_DISTANCE = 0.602, // Horizontal distance from avatar position. PROGRESS_3D_DISTANCE = 0.602, // Horizontal distance from avatar position.
PROGRESS_3D_ELEVATION = -0.8, // Height of top middle of top notification relative to avatar eyes. PROGRESS_3D_ELEVATION = -0.8, // Height of top middle of top notification relative to avatar eyes.
PROGRESS_3D_ELEVATION = -0.0, // Height of top middle of top notification relative to avatar eyes. PROGRESS_3D_ELEVATION = -0.2, // Height of top middle of top notification relative to avatar eyes.
PROGRESS_3D_YAW = 0.0, // Degrees relative to notifications direction. PROGRESS_3D_YAW = 0.0, // Degrees relative to notifications direction.
PROGRESS_3D_PITCH = -0.0, // Degrees from vertical. PROGRESS_3D_PITCH = -0.0, // Degrees from vertical.
SCALE_3D = 0.0011, // Scale the bar SVG for 3D display. SCALE_3D = 0.0004, // Scale the bar SVG for 3D display.
BACKGROUND_3D_SIZE = { BACKGROUND_3D_SIZE = {
x: 0.76, x: 0.76,
y: 0.08 y: 0.08
@ -66,9 +66,7 @@
if (alpha < 0) { if (alpha < 0) {
alpha = 0; alpha = 0;
} } else if (alpha > 1) {
if (alpha > 1) {
alpha = 1; alpha = 1;
} }
@ -81,9 +79,9 @@
visible = false; visible = false;
} }
if (isOnHMD) { if (use3DOverlay) {
Overlays.editOverlay(background3D.overlay, { Overlays.editOverlay(background3D.overlay, {
backgroundAlpha: alpha * BACKGROUND_3D_ALPHA, alpha: alpha,
visible: visible visible: visible
}); });
} else { } else {
@ -92,7 +90,7 @@
visible: visible visible: visible
}); });
} }
Overlays.editOverlay(isOnHMD ? bar3D.overlay : bar2D.overlay, { Overlays.editOverlay(use3DOverlay ? bar3D.overlay : bar2D.overlay, {
alpha: alpha, alpha: alpha,
visible: visible visible: visible
}); });
@ -105,7 +103,12 @@
displayProgress = 0; displayProgress = 0;
} }
Window.domainChanged.connect(resetProgress); Window.domainChanged.connect(function() {
hasShownOnThisDomain = false;
resetProgress();
});
var hasShownOnThisDomain = false;
var maxSeen = 0; var maxSeen = 0;
var bestRawProgress = 0; var bestRawProgress = 0;
@ -114,7 +117,7 @@
function onDownloadInfoChanged(info) { function onDownloadInfoChanged(info) {
var i; var i;
print("PROGRESS: DOwnload info changed ", info.downloading.length, info.pending, maxSeen); print("PROGRESS: Download info changed ", info.downloading.length, info.pending, maxSeen);
// Update raw progress value // Update raw progress value
if (info.downloading.length + info.pending === 0) { if (info.downloading.length + info.pending === 0) {
wasActive = false; wasActive = false;
@ -142,34 +145,41 @@
} }
function createOverlays() { function createOverlays() {
if (isOnHMD) { background3D.overlay = Overlays.addOverlay("image3d", {
url: BACKGROUND_URL,
background3D.overlay = Overlays.addOverlay("rectangle3d", { subImage: {
size: BACKGROUND_3D_SIZE, x: 0,
color: BACKGROUND_3D_COLOR, y: 0,
alpha: BACKGROUND_3D_ALPHA, width: BACKGROUND_WIDTH,
solid: true, height: BACKGROUND_HEIGHT
},
scale: SCALE_3D * BACKGROUND_WIDTH,
isFacingAvatar: false, isFacingAvatar: false,
visible: false, visible: false,
ignoreRayIntersection: true alpha: 1.0,
ignoreRayIntersection: true,
emissive: true,
isFacingAvatar: true,
drawInFront: true
}); });
bar3D.overlay = Overlays.addOverlay("image3d", { bar3D.overlay = Overlays.addOverlay("image3d", {
url: BAR_URL, url: BAR_URL,
subImage: { subImage: {
x: 0, x: 0,
y: 0, y: 0,
width: 480, width: BAR_WIDTH,
height: BAR_HEIGHT height: BAR_HEIGHT
}, },
scale: SCALE_3D * BAR_WIDTH, scale: SCALE_3D * BAR_WIDTH,
isFacingAvatar: false, isFacingAvatar: false,
visible: false, visible: false,
alpha: 0.0, alpha: 1.0,
ignoreRayIntersection: true ignoreRayIntersection: true,
emissive: true,
isFacingAvatar: true,
drawInFront: true
}); });
} else {
background2D.overlay = Overlays.addOverlay("image", { background2D.overlay = Overlays.addOverlay("image", {
imageURL: BACKGROUND_URL, imageURL: BACKGROUND_URL,
width: background2D.width, width: background2D.width,
@ -191,30 +201,31 @@
alpha: 0.0 alpha: 0.0
}); });
} }
}
function deleteOverlays() { function deleteOverlays() {
Overlays.deleteOverlay(isOnHMD ? background3D.overlay : background2D.overlay); Overlays.deleteOverlay(background3D.overlay);
Overlays.deleteOverlay(isOnHMD ? bar3D.overlay : bar2D.overlay); Overlays.deleteOverlay(bar3D.overlay);
Overlays.deleteOverlay(background2D.overlay);
Overlays.deleteOverlay(bar2D.overlay);
} }
var b = 0; var b = 0;
var worldOverlayOn = false;
var currentOrientation = null;
function update() { function update() {
cooldown -= 16; cooldown -= 30;
var viewport, var viewport,
eyePosition, eyePosition,
avatarOrientation; avatarOrientation;
hmdActive = HMD.active; if (use3DOverlay !== worldOverlayOn) {
// if (isOnHMD !== HMD.active) { use3DOverlay = !use3DOverlay;
// deleteOverlays(); }
// isOnHMD = !isOnHMD;
// createOverlays();
// }
if (displayProgress < rawProgress) { if (displayProgress < rawProgress) {
var diff = rawProgress - displayProgress; var diff = rawProgress - displayProgress;
if (diff < 0.1) { if (diff < 0.5) {
displayProgress = rawProgress; displayProgress = rawProgress;
} else { } else {
displayProgress += diff * 0.05; displayProgress += diff * 0.05;
@ -222,7 +233,6 @@
} }
//print('PROGRESS:', displayProgress); //print('PROGRESS:', displayProgress);
// Update state // Update state
if (!visible) { // Not visible because no recent downloads if (!visible) { // Not visible because no recent downloads
if (displayProgress < 100) { // Have started downloading so fade in if (displayProgress < 100) { // Have started downloading so fade in
@ -257,11 +267,19 @@
} }
} }
if (use3DOverlay) {
Overlays.editOverlay(background2D.overlay, { visible: false });
Overlays.editOverlay(bar2D.overlay, { visible: false });
} else {
Overlays.editOverlay(background3D.overlay, { visible: false });
Overlays.editOverlay(bar3D.overlay, { visible: false });
}
if (visible) { if (visible) {
// Update progress bar // Update progress bar
Overlays.editOverlay(isOnHMD ? bar3D.overlay : bar2D.overlay, { Overlays.editOverlay(use3DOverlay ? bar3D.overlay : bar2D.overlay, {
visible: visible, visible: true,
subImage: { subImage: {
x: BAR_WIDTH * (1 - displayProgress / 100), x: BAR_WIDTH * (1 - displayProgress / 100),
y: 0, y: 0,
@ -270,19 +288,27 @@
}, },
}); });
Overlays.editOverlay(use3DOverlay ? background3D.overlay : background2D.overlay, {
visible: true,
});
// Update position // Update position
if (isOnHMD) { if (use3DOverlay) {
print("HERE");
// Update 3D overlays to maintain positions relative to avatar // Update 3D overlays to maintain positions relative to avatar
eyePosition = MyAvatar.getDefaultEyePosition(); eyePosition = MyAvatar.getDefaultEyePosition();
avatarOrientation = MyAvatar.orientation; avatarOrientation = Camera.orientation;
currentOrientation = Quat.slerp(currentOrientation, avatarOrientation, 0.10);
avatarOrientation = currentOrientation;
Overlays.editOverlay(background3D.overlay, { Overlays.editOverlay(background3D.overlay, {
position: Vec3.sum(eyePosition, Vec3.multiplyQbyV(avatarOrientation, background3D.offset)), position: Vec3.sum(eyePosition, Vec3.multiplyQbyV(avatarOrientation, background3D.offset)),
rotation: Quat.multiply(avatarOrientation, background3D.orientation) //rotation: Quat.multiply(avatarOrientation, background3D.orientation)
}); });
Overlays.editOverlay(bar3D.overlay, { Overlays.editOverlay(bar3D.overlay, {
position: Vec3.sum(eyePosition, Vec3.multiplyQbyV(avatarOrientation, bar3D.offset)), position: Vec3.sum(eyePosition, Vec3.multiplyQbyV(avatarOrientation, bar3D.offset)),
rotation: Quat.multiply(avatarOrientation, bar3D.orientation) //rotation: Quat.multiply(avatarOrientation, bar3D.orientation)
}); });
} else { } else {
@ -290,10 +316,32 @@
viewport = Controller.getViewportDimensions(); viewport = Controller.getViewportDimensions();
if (viewport.x !== windowWidth || viewport.y !== windowHeight) { if (viewport.x !== windowWidth || viewport.y !== windowHeight) {
updateProgressBarLocation();
}
}
}
}
function updateProgressBarLocation() {
viewport = Controller.getViewportDimensions();
windowWidth = viewport.x; windowWidth = viewport.x;
windowHeight = viewport.y; windowHeight = viewport.y;
var yOffset = hmdActive ? -300 : -10; var yOffset = HMD.active ? -300 : -10;
yOffset += yAdjust;
// if (hmdActive) {
// if (true) { //hasShownOnThisDomain) {
// yOffset = -100;
// SCALE_2D = 1.0/3;
// } else {
// yOffset = -300;
// SCALE_2D = 2.0/3;
// }
// }
background2D.width = SCALE_2D * BACKGROUND_WIDTH;
background2D.height = SCALE_2D * BACKGROUND_HEIGHT;
bar2D.width = SCALE_2D * BAR_WIDTH;
bar2D.height = SCALE_2D * BAR_HEIGHT;
Overlays.editOverlay(background2D.overlay, { Overlays.editOverlay(background2D.overlay, {
x: windowWidth / 2 - background2D.width / 2, x: windowWidth / 2 - background2D.width / 2,
@ -305,9 +353,6 @@
y: windowHeight - background2D.height - bar2D.height + (background2D.height - bar2D.height) / 2 + yOffset y: windowHeight - background2D.height - bar2D.height + (background2D.height - bar2D.height) / 2 + yOffset
}); });
} }
}
}
}
function setProgressBar(progress) { function setProgressBar(progress) {
} }
@ -339,10 +384,25 @@
deleteOverlays(); deleteOverlays();
} }
var yAdjust = 0;
function keyPress(event) {
print("Key event: ", event.text);
if (event.text == '.') {
yAdjust -= 10;
updateProgressBarLocation();
} else if (event.text == ',') {
yAdjust += 10;
updateProgressBarLocation();
} else if (event.text == 'SPACE') {
worldOverlayOn = !worldOverlayOn;
}
}
setUp(); setUp();
GlobalServices.downloadInfoChanged.connect(onDownloadInfoChanged); GlobalServices.downloadInfoChanged.connect(onDownloadInfoChanged);
GlobalServices.updateDownloadInfo(); GlobalServices.updateDownloadInfo();
//Script.update.connect(update); //Script.update.connect(update);
Script.setInterval(update, 16); Script.setInterval(update, 1000/60);
Script.scriptEnding.connect(tearDown); Script.scriptEnding.connect(tearDown);
Controller.keyPressEvent.connect(keyPress);
}()); }());