From 87be930a684b4ca5647cfdf3a8fbcc5ecda417fb Mon Sep 17 00:00:00 2001
From: ntoff <norahtihtzoff@gmail.com>
Date: Wed, 15 Mar 2017 02:42:12 +0100
Subject: [PATCH] timelapse tab unsaved warning and rearrange interval input
 box

Addition of a notification under the save button when there are unsaved
changes, and a notice under the save as default checkbox when unticked,
that changes are only temporary.

Also move the "interval" box up the top to position it underneath the
timelapse type dropdown list, and change the text to be a bit more
descriptive.

(cherry picked from commit 381a016)
---
 .../static/js/app/viewmodels/timelapse.js     |  5 +++++
 src/octoprint/templates/tabs/timelapse.jinja2 | 21 ++++++++++---------
 2 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/src/octoprint/static/js/app/viewmodels/timelapse.js b/src/octoprint/static/js/app/viewmodels/timelapse.js
index f50b6da1..fb24cede 100644
--- a/src/octoprint/static/js/app/viewmodels/timelapse.js
+++ b/src/octoprint/static/js/app/viewmodels/timelapse.js
@@ -21,6 +21,7 @@ $(function() {
 
         self.persist = ko.observable(false);
         self.isDirty = ko.observable(false);
+        self.isTemporary = ko.observable(true);
 
         self.isErrorOrClosed = ko.observable(undefined);
         self.isOperational = ko.observable(undefined);
@@ -30,6 +31,10 @@ $(function() {
         self.isReady = ko.observable(undefined);
         self.isLoading = ko.observable(undefined);
 
+        self.isTemporary = ko.pureComputed(function() {
+            return self.isDirty() && !self.persist();
+        });
+
         self.isBusy = ko.pureComputed(function() {
             return self.isPrinting() || self.isPaused();
         });
diff --git a/src/octoprint/templates/tabs/timelapse.jinja2 b/src/octoprint/templates/tabs/timelapse.jinja2
index e876abb5..198549a8 100644
--- a/src/octoprint/templates/tabs/timelapse.jinja2
+++ b/src/octoprint/templates/tabs/timelapse.jinja2
@@ -13,6 +13,14 @@
     <span class="help-block" data-bind="visible: timelapseType() == 'zchange'"><span class="label label-warning">{{ _('Warning') }}</span> {{ _('Do not use with spiralized ("Joris") vases or similar continuous Z models.') }}</span>
     <span class="help-block" data-bind="visible: timelapseType() == 'zchange'"><span class="label label-info">{{ _('Note') }}</span> {% trans %}Does not work when printing from the printer's SD Card (no way to detect the change in Z reliably). Use "Timed" mode for those prints instead.{% endtrans %}</span>
 
+    <div id="webcam_timelapse_timedsettings" data-bind="visible: intervalInputEnabled">
+        <label for="webcam_timelapse_interval">{{ _('Interval between snapshots (in seconds)') }}</label>
+        <div class="input-append">
+            <input type="text" class="input-mini" id="webcam_timelapse_interval" data-bind="value: timelapseTimedInterval, valueUpdate: 'afterkeydown', enable: isOperational() && !isPrinting() && loginState.isUser()">
+            <span class="add-on">{{ _('sec') }}</span>
+        </div>
+    </div>
+
     <label for="webcam_timelapse_fps">{{ _('Timelapse frame rate (in frames per second)') }}</label>
     <div class="input-append">
         <input type="text" class="input-mini" id="webcam_timelapse_fps" data-bind="value: timelapseFps, valueUpdate: 'afterkeydown', enable: isOperational() && !isPrinting() && loginState.isUser() && timelapseTypeSelected()">
@@ -31,15 +39,6 @@
         </label>
     </div>
 
-
-    <div id="webcam_timelapse_timedsettings" data-bind="visible: intervalInputEnabled">
-        <label for="webcam_timelapse_interval">{{ _('Interval') }}</label>
-        <div class="input-append">
-            <input type="text" class="input-mini" id="webcam_timelapse_interval" data-bind="value: timelapseTimedInterval, valueUpdate: 'afterkeydown', enable: isOperational() && !isPrinting() && loginState.isUser()">
-            <span class="add-on">{{ _('sec') }}</span>
-        </div>
-    </div>
-
     <div id="webcam_timelapse_retractionsettings" data-bind="visible: timelapseType() == 'zchange'">
         <label for="webcam_timelapse_retractionZHop">{{ _('Retraction Z-Hop (in mm)') }}</label>
         <div class="input-append">
@@ -51,12 +50,14 @@
 
     <div data-bind="visible: loginState.isAdmin">
         <label class="checkbox">
-            <input type="checkbox" data-bind="checked: persist"> {{ _('Save as default') }}
+            <input type="checkbox" data-bind="checked: persist, enable: saveButtonEnabled"> {{ _('Save as default') }}
+            <span class="help-block" data-bind="visible: isTemporary">{{ _('Note: Changes are only temporary, save as default to make them permanent.') }}</span>
         </label>
     </div>
 
     <div>
         <button class="btn" data-bind="click: save, enable: saveButtonEnabled">{{ _('Save config') }}</button>
+        <span class="help-block" data-bind="visible: saveButtonEnabled">{{ _('You have unsaved changes.') }}</span>
     </div>
 </div>