From 73b2bc433dcaaf745d18846f8033628d6dbd85c8 Mon Sep 17 00:00:00 2001
From: David Rowe <david@ctrlaltstudio.com>
Date: Fri, 28 Oct 2016 18:03:13 +1300
Subject: [PATCH] Improve bar positions

---
 .../system/assets/images/progress-bar-hmd.svg | 26 -------------------
 scripts/system/progress.js                    | 24 ++++++++---------
 2 files changed, 11 insertions(+), 39 deletions(-)
 delete mode 100644 scripts/system/assets/images/progress-bar-hmd.svg

diff --git a/scripts/system/assets/images/progress-bar-hmd.svg b/scripts/system/assets/images/progress-bar-hmd.svg
deleted file mode 100644
index a6b555691f..0000000000
--- a/scripts/system/assets/images/progress-bar-hmd.svg
+++ /dev/null
@@ -1,26 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 4430 6" style="enable-background:new 0 0 4430 6;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:url(#SVGID_1_);}
-</style>
-<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-2.077286e-09" y1="-0.84" x2="4430.1401" y2="-0.84" gradientTransform="matrix(-1 0 0 0.5607 4430.1401 3.471)">
-	<stop  offset="0" style="stop-color:#0FE8CD"/>
-	<stop  offset="0.13" style="stop-color:#020202;stop-opacity:0"/>
-	<stop  offset="0.1515" style="stop-color:#0FE8CD"/>
-	<stop  offset="0.28" style="stop-color:#000000;stop-opacity:0"/>
-	<stop  offset="0.3" style="stop-color:#0FE8CD"/>
-	<stop  offset="0.42" style="stop-color:#000000;stop-opacity:0"/>
-	<stop  offset="0.44" style="stop-color:#0FE8CD"/>
-	<stop  offset="0.57" style="stop-color:#000000;stop-opacity:0"/>
-	<stop  offset="0.5885" style="stop-color:#0FE8CD"/>
-	<stop  offset="0.71" style="stop-color:#000000;stop-opacity:0"/>
-	<stop  offset="0.73" style="stop-color:#0FE8CD"/>
-	<stop  offset="0.85" style="stop-color:#000000;stop-opacity:0"/>
-	<stop  offset="0.869" style="stop-color:#0FE8CD"/>
-	<stop  offset="0.9831" style="stop-color:#000000;stop-opacity:0"/>
-	<stop  offset="1" style="stop-color:#0FE8CD"/>
-</linearGradient>
-<rect x="0" y="0" class="st0" width="4430.1" height="6"/>
-</svg>
diff --git a/scripts/system/progress.js b/scripts/system/progress.js
index 34dbdea7da..20023b0352 100644
--- a/scripts/system/progress.js
+++ b/scripts/system/progress.js
@@ -36,13 +36,13 @@
         BAR_DESKTOP_HEIGHT = 3,  // Display height of SVG
         BAR_DESKTOP_URL = Script.resolvePath("assets/images/progress-bar-2k.svg"),
 
-        BAR_HMD_WIDTH = 4430, // Width of SVG image in pixels. Sized for Rift with 6 visible repeats.
-        BAR_HMD_REPEAT = 585,  // Length of repeat in bar = 4430 / 7.
-        BAR_HMD_HEIGHT = 4,  // Display height of SVG
-        BAR_HMD_URL = Script.resolvePath("assets/images/progress-bar-hmd.svg"),
+        BAR_HMD_WIDTH = 2240,  // Desktop image works with HMD well.
+        BAR_HMD_REPEAT = 320,
+        BAR_HMD_HEIGHT = 3,
+        BAR_HMD_URL = Script.resolvePath("assets/images/progress-bar-2k.svg"),
 
-        BAR_Y_OFFSET_2D = -10, // Offset of progress bar while in desktop mode
-        BAR_Y_OFFSET_HMD = -300, // Offset of progress bar while in HMD
+        BAR_Y_OFFSET_DESKTOP = 0, // Offset of progress bar while in desktop mode
+        BAR_Y_OFFSET_HMD = -100, // Offset of progress bar while in HMD
 
         TEXT_HEIGHT = 32,
         TEXT_WIDTH = 256,
@@ -214,30 +214,28 @@
         isHMD = HMD.active;
 
         if (isHMD) {
-            barHMD.width = windowWidth;
 
             Overlays.editOverlay(barHMD.overlay, {
                 x: windowWidth / 2 - barHMD.width / 2,
-                y: windowHeight - 2 * barHMD.height + BAR_Y_OFFSET_HMD,
-                width: barHMD.width
+                y: windowHeight - 2 * barHMD.height + BAR_Y_OFFSET_HMD
             });
 
             Overlays.editOverlay(textHMD.overlay, {
                 x: windowWidth / 2 - textHMD.width / 2,
-                y: windowHeight - 2 * textHMD.height + BAR_Y_OFFSET_HMD
+                y: windowHeight - 2 * barHMD.height - textHMD.height + BAR_Y_OFFSET_HMD
             });
+
         } else {
-            barDesktop.width = windowWidth;
 
             Overlays.editOverlay(barDesktop.overlay, {
                 x: windowWidth / 2 - barDesktop.width / 2,
-                y: windowHeight - 2 * barDesktop.height + BAR_Y_OFFSET_2D,
+                y: windowHeight - 2 * barDesktop.height + BAR_Y_OFFSET_DESKTOP,
                 width: barDesktop.width
             });
 
             Overlays.editOverlay(textDesktop.overlay, {
                 x: windowWidth / 2 - textDesktop.width / 2,
-                y: windowHeight - 2 * textDesktop.height + BAR_Y_OFFSET_2D
+                y: windowHeight - 2 * barDesktop.height - textDesktop.height + BAR_Y_OFFSET_DESKTOP
             });
         }
     }