From d06451112107064854b41ca7e2e5e82073c489de Mon Sep 17 00:00:00 2001
From: David Rowe <david@ctrlaltstudio.com>
Date: Fri, 21 Apr 2017 17:01:29 +1200
Subject: [PATCH] Rearrange dialog controls

---
 scripts/system/html/css/record.css | 27 +++++++++++++--------------
 scripts/system/html/js/record.js   |  4 ++--
 scripts/system/html/record.html    | 12 ++++++------
 3 files changed, 21 insertions(+), 22 deletions(-)

diff --git a/scripts/system/html/css/record.css b/scripts/system/html/css/record.css
index ca15ccab17..33e3701aa7 100644
--- a/scripts/system/html/css/record.css
+++ b/scripts/system/html/css/record.css
@@ -29,7 +29,7 @@ body {
     height: 100%;
     position: relative;
     box-sizing: border-box;
-    padding: 48px 0 214px 0;
+    padding: 50px 0 186px 0;
     margin: 0 21px 0 21px;
 }
 
@@ -50,7 +50,7 @@ body {
 
 #recordings thead {
     position: absolute;
-    top: 19px;
+    top: 21px;
     left: 0;
     width: 100%;
     box-sizing: border-box;
@@ -93,7 +93,7 @@ body {
 
 #recordings tfoot {
     position: absolute;
-    bottom: 189px;
+    bottom: 161px;
     left: 0;
     width: 100%;
     box-sizing: border-box;
@@ -107,11 +107,6 @@ body {
     background: none;
 }
 
-#recordings #load-container {
-    position: relative;
-    top: 25px;
-}
-
 
 #spinner {
     text-align: center;
@@ -175,21 +170,25 @@ body {
 }
 
 
-#load-button {
-    margin-top: 14px;
-}
-
-
 #record-controls {
     position: absolute;
     bottom: 7px;
     width: 100%;
 }
 
-#record-controls div:first-child {
+#record-controls #load-container {
+    position: absolute;
+    left: 21px;
+}
+
+#record-controls #record-container {
     text-align: center;
 }
 
+#record-controls #checkbox-container {
+    margin-top: 33px;
+}
+
 #record-controls div.property {
     padding-left: 21px;
 }
diff --git a/scripts/system/html/js/record.js b/scripts/system/html/js/record.js
index 095c4ad777..12a95dce5f 100644
--- a/scripts/system/html/js/record.js
+++ b/scripts/system/html/js/record.js
@@ -170,8 +170,8 @@ function updateSpinner() {
 }
 
 function updateFinishOnOpenLabel() {
-    var WINDOW_FINISH_ON_OPEN_LABEL = "Finish recording when reopen dialog",
-        TABLET_FINISH_ON_OPEN_LABEL = "Finish recording when reopen dialog or tablet";
+    var WINDOW_FINISH_ON_OPEN_LABEL = "Stop recording automatically when reopen this window",
+        TABLET_FINISH_ON_OPEN_LABEL = "Stop recording automatically when reopen tablet or window";
 
     elFinishOnOpenLabel.innerHTML = isUsingToolbar ? WINDOW_FINISH_ON_OPEN_LABEL : TABLET_FINISH_ON_OPEN_LABEL;
 }
diff --git a/scripts/system/html/record.html b/scripts/system/html/record.html
index de08a593ca..a5cd933b90 100644
--- a/scripts/system/html/record.html
+++ b/scripts/system/html/record.html
@@ -58,21 +58,21 @@
                     </tfoot>
                 </table>
             </div>
-            <div id="load-container">
-                <input id="load-button" type="button" value="Load" disabled />
-            </div>
         </div>
         <div id="spinner" class="hidden">
             <img src="../../../resources/icons/loader-red-countdown-ring.gif" />
             <span id="countdown-number">3</span>
         </div>
         <div id="record-controls">
-            <div>
+            <div id="load-container">
+                <input id="load-button" type="button" value="Load" disabled />
+            </div>
+            <div id="record-container">
                 <input id="record-button" class="red" type="button" value="Record" />
             </div>
-            <div class="property checkbox">
+            <div id="checkbox-container" class="property checkbox">
                 <input type="checkbox" id="finish-on-open">
-                <label for="finish-on-open" id="finish-on-open-label">Finish recording when open dialog/tablet</label>
+                <label for="finish-on-open" id="finish-on-open-label">Stop recording automatically when ...</label>
             </div>
         </div>
         <script>