Update form improvements

- Reversed retain interface
- Moved installed logic to UpdateAPI
- No retain warning
- Removed separate beta page

js/UpdatePage.js

@@ -11,7 +11,7 @@
 	var _form;
 	var _statusField;
 	var _infoField;
-	var _retainConfigurationCheckbox;
+	var _noRetainCheckbox;
 	var _includeBetasCheckbox;
 	var _submitButton;
 	
@@ -30,11 +30,11 @@
 		_statusField = _page.find("#status");
 		_infoField = _page.find("#info");
 		_form = _page.find("form");
-		_retainConfigurationCheckbox = _form.find("#retainConfiguration");
+		_noRetainCheckbox = _form.find("#noRetainConfiguration");
 		_includeBetasCheckbox = _form.find("#includeBetas");
 		_submitButton = _form.find("input[type=submit]");
 		
-		_retainConfigurationCheckbox.change(retainConfigurationChanged);
+		_noRetainCheckbox.change(noRetainCheckboxChanged);
 		_includeBetasCheckbox.change(includeBetasChanged);
 		_form.submit(update);
 		
@@ -130,7 +130,7 @@
 	}
 	function updateButton(data) {
 		console.log(PAGE_ID+":updateButton");
-		var retain = _retainConfigurationCheckbox.prop('checked');
+		var noRetain = _noRetainCheckbox.prop('checked');
 		
 		var buttonText = "Update";
 		_submitButton.button('disable');
@@ -139,21 +139,21 @@
 			case UpdateAPI.STATUS.IMAGE_READY:
 			case UpdateAPI.STATUS.DOWNLOAD_FAILED:
 			case UpdateAPI.STATUS.INSTALL_FAILED:
-				if(data.can_update || !retain) {
+				if(data.can_update || noRetain) {
 					_submitButton.button('enable');
 					if (data.newest_version_is_beta) {
-						if(retain) {
+						if(noRetain) {
-							buttonText = "Update to beta";
-						} else {
 							buttonText = "Clean update to beta";
+						} else {
+							buttonText = "Update to beta";
 						}
 					} else if (data.current_version_is_beta && !data.newest_version_is_newer) {
-						if(retain) {
+						if(noRetain) {
-							buttonText = "Revert to latest stable release";
-						} else {
 							buttonText = "Clean revert to latest stable release";
+						} else {
+							buttonText = "Revert to latest stable release";
 						}
-					} else if (!retain){
+					} else if (noRetain){
 						if(data.newest_version_is_newer) {
 							buttonText = "Clean update";
 						} else {
@@ -174,8 +174,8 @@
 		var abbrMonths = [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Sep', 'Aug', 'Oct', 'Nov', 'Dec' ];
 		return abbrMonths[fields[1] - 1] + " " + fields[2] + ", " + fields[0];
 	}
-	function retainConfigurationChanged () {
+	function noRetainCheckboxChanged () {
-		console.log(PAGE_ID+":retainConfigurationChanged");
+		//console.log(PAGE_ID+":noRetainCheckboxChanged");
 		updateButton(_updateStatus);
 	}
 	function includeBetasChanged () {
@@ -184,7 +184,7 @@
 		var settings = {};
 		settings[_includeBetasCheckbox.attr('name')] = _includeBetasCheckbox.prop('checked');
 		_configAPI.save(settings,function() {
-			console.log("  saved");
+			//console.log("  saved");
 			retrieveUpdateStatus();
 		});
 	}

js/UpdatingPage.js

@@ -15,11 +15,10 @@
 	var _configAPI = new ConfigAPI();
 	var _pageData = {};
 	var _formData = {};
-	var _updateStatus = {};
 	var _installing = false;
 	var UPDATED_REDIRECT_DELAY = 5000;
 	var _updatedRedirectDelay;
-	
+	var _no_retain;
 	var PAGE_ID = "#updating";
 	
 	var _self = this;
@@ -31,7 +30,7 @@
 		_descriptionField = _page.find("#description");
   });
 	$.mobile.document.on( "pagebeforeshow", PAGE_ID, function( event, data ) {
-		console.log(PAGE_ID+":pagebeforeshow");
+		//console.log(PAGE_ID+":pagebeforeshow");
 		_pageData = d3d.util.getPageParams(PAGE_ID);
 		var form = data.prevPage.find("form");
 		// check if there are url params and 
@@ -42,6 +41,7 @@
 			return;
 		}
 		_formData = d3d.util.getFormData(form);
+		//console.log("  _formData: ",_formData);
 		var boxURL = "http://"+_pageData.localip;
 		_updateAPI.init(boxURL);
 		_updateAPI.refreshing = onRefreshing;
@@ -58,17 +58,15 @@
 	
 	
 	function downloadUpdate() {
-		console.log(PAGE_ID+":downloadUpdate");
+		//console.log(PAGE_ID+":downloadUpdate");
 		_updateAPI.download();
-		// override state
-		_updateStatus.state_code = UpdateAPI.STATUS.DOWNLOADING;
-		updatePage(_updateStatus);
 	}
 	function installUpdate() {
-		console.log(PAGE_ID+":installUpdate");
+		//console.log(PAGE_ID+":installUpdate");
-		var no_retain = !(_formData.retain);
+		//console.log("  _formData: ",_formData);
-		console.log("  no_retain: ",no_retain);
+		_no_retain = (_formData.no_retain)? true : false;
-		_updateAPI.install(no_retain);
+		//console.log("  no_retain: ",_no_retain);
+		_updateAPI.install(_no_retain);
 		_installing = true;
 	}
 	
@@ -78,37 +76,33 @@
 		d3d.util.showLoader(true);
 	}
 	function onStatusUpdated(data) {
-		console.log(PAGE_ID+": onStatusUpdated ");
+		//console.log(PAGE_ID+": onStatusUpdated ");
-		console.log("  state_code: ",data.state_code," text: ",data.state_text);
+		//console.log("  state_code: ",data.state_code," text: ",data.state_text);
+		updatePage(data);
+		
 		switch(data.state_code) {
 			case UpdateAPI.STATUS.IMAGE_READY: 
-				console.log("  _installing: ",_installing);
 				if(!_installing) {
 					installUpdate();
-					data.state_code = UpdateAPI.STATUS.INSTALLING;
 				}
 				break;
-			case UpdateAPI.STATUS.NONE: 
+			case UpdateAPI.STATUS.INSTALLED: 
-				console.log("  _installing: ",_installing);
+				_updateAPI.stopAutoRefresh();
-				if(_installing) {
+				clearTimeout(_updatedRedirectDelay);
-					data.state_code = UpdateAPI.STATUS.INSTALLED;
+				_updatedRedirectDelay = setTimeout(function () {
-					_updateAPI.stopAutoRefresh();
+					if(_no_retain) {
-					clearTimeout(_updatedRedirectDelay);
+						//console.log("  redirect to boxes");
-					_updatedRedirectDelay = setTimeout(function () {
+						$.mobile.changePage("#boxes");
-						// redirect to box page
+					} else {
-						console.log("  redirect to box");
+						//console.log("  redirect to box");
 						// replace this page with boxes page in history
 						window.history.replaceState(null, "", "#boxes");
-						var link = "#box";
+						var link = d3d.util.replaceURLParameters("#box",_pageData);
-						link = d3d.util.replaceURLParameters(link,_pageData);
 						$.mobile.changePage(link);
-					},UPDATED_REDIRECT_DELAY);
+					}
-					
+				},UPDATED_REDIRECT_DELAY);
-				}
 				break;
 		}
-		updatePage(data);
-		_updateStatus = data;
 	}
 	function updatePage(data) {
 		console.log(PAGE_ID+": updatePage state: ",data.state_code);
@@ -141,6 +135,9 @@
 		switch(data.state_code){
 			case UpdateAPI.STATUS.INSTALLING:
 				description = "Do not remove power from the WiFi-Box.";
+				if(_no_retain) {
+					description += "<br/><small>Because you didn’t preserve your personal sketches and settings you will need to reconnect your WiFi-Box to your WiFi network. <br/>After an estimated update time you will be redirected to the boxes page. When it does, please connect your device to the WiFi network of the WiFi-Box and return to the boxes page. </small>";
+				}
 				break;
 			case UpdateAPI.STATUS.DOWNLOAD_FAILED:
 			case UpdateAPI.STATUS.INSTALL_FAILED:
@@ -148,7 +145,7 @@
 				break;
 		}
 		console.log("  description: ",description);
-		_descriptionField.text(description);
+		_descriptionField.html(description);
 	}
 	
 })(window);

www/index.html

@@ -1,4 +1,3 @@
-
 <!DOCTYPE html> 
 <html>
 <head>
@@ -192,10 +191,14 @@
 		<form data-ajax="false" data-target="#updating">
 			<fieldset class="" data-role="collapsible">
 				<h3>Options</h3>
-				<input id="retainConfiguration" type="checkbox" name="retain" value="retainConfiguration" checked="true">
+				<input id="noRetainConfiguration" type="checkbox" name="no_retain" value="noRetainConfiguration" />
-				<label for="retainConfiguration">Preserve personal sketches and settings</label>
+				<label for="noRetainConfiguration">Remove sketches and settings<small class="warning">You're personal sketches and settings will be removed when you update, this will mean you’ll need to reconnect your WiFi-Box to your WiFi network. </small></label>
- 				<input id="includeBetas" type="checkbox" name="doodle3d.update.includeBetas" value="includeBetas">
+ 				<input id="includeBetas" type="checkbox" name="doodle3d.update.includeBetas" value="includeBetas" />
- 				<label for="includeBetas">Include beta releases (<a href="#beta_info">more info</a>)</label>
+ 				<label for="includeBetas">Include beta releases <!--(<a href="#beta_info">more info</a>)-->
+					<small class="warning">You'll get the latest features that are still under development. <br/>
+						This allows you give us earlier feedback. The more people that test these versions the more stable the regular version will be. Only use this when you're prepared to deal with some issues. 
+					</small>
+				</label>
 			</fieldset>
 			<input type=submit value="Update">
 		</form>
@@ -229,20 +232,6 @@
 	</div><!-- /content -->
 </div><!-- /page -->
 
-
-<div data-role="page" id="beta_info">
-	<a href="#boxes" id="logo"><img src="img/logo_full.png"></a>
-	<div data-role="header">
-		<a href="../toolbar/" data-rel="back" class="ui-btn ui-btn-left ui-nodisc-icon ui-corner-all ui-btn-icon-notext ui-icon-carat-l">Back</a>
-		<h1>Beta info</h1>
-	</div><!-- /header -->
-	<div role="main" class="ui-content">
-		<p>You can subscribe for Doodle3D beta software, this means you'll get the latest versions that are still under development. Only use this when you're prepared to deal with some bugs.</p>
-		<p>This allows you to test new features and give us earlier feedback. The more people that test these versions the more stable the regular version will be.</p>
-	</div><!-- /content -->
-</div><!-- /page -->
- 
-
 	<script>
 		$(function(){
 			$( "[data-role='header'], [data-role='footer']" ).toolbar();