.gitignore

@@ -18,11 +18,18 @@ img/logo/logo_smaller.png
 img/logo/logo_smaller_8bit.png
 img/logo/logo_smaller_wide_8bit.png
 img/logo/logo_smallest.png
+css/_backup20131010/*
+css/_backup20131011/*
 d3d_btns.css
+index.html.orig
+js/Thermometer.js.orig
+js/buttonbehaviors.js.orig
+js/gcodeGenerating_v01.js.orig
+js/init_layout backup20130918.js
 js/main.js.orig
+js/previewRendering_v02.js.orig
 less/verticalshapes.css
 less/verticalshapes_backup.css
 __settings.html
 css/_settings.css
 node_modules/*
-js/main.js.out

.settings/.jsdtscope

@@ -1,16 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<classpath>
-	<classpathentry excluding="node_modules/|www/" kind="src" path="">
-		<attributes>
-			<attribute name="provider" value="org.eclipse.wst.jsdt.web.core.internal.project.ModuleSourcePathProvider"/>
-		</attributes>
-	</classpathentry>
-	<classpathentry kind="con" path="org.eclipse.wst.jsdt.launching.JRE_CONTAINER"/>
-	<classpathentry kind="con" path="org.eclipse.wst.jsdt.launching.baseBrowserLibrary"/>
-	<classpathentry kind="con" path="org.eclipse.wst.jsdt.launching.WebProject">
-		<attributes>
-			<attribute name="hide" value="true"/>
-		</attributes>
-	</classpathentry>
-	<classpathentry kind="output" path=""/>
-</classpath>

.settings/com.eclipsesource.jshint.ui.prefs

@@ -1,2 +0,0 @@
-eclipse.preferences.version=1
-included=//*.js

.settings/org.eclipse.wst.jsdt.ui.prefs

@@ -1,2 +0,0 @@
-eclipse.preferences.version=1
-org.eclipse.wst.jsdt.ui.text.custom_code_templates=<?xml version\="1.0" encoding\="UTF-8" standalone\="no"?><templates/>

.settings/org.eclipse.wst.jsdt.ui.superType.container

@@ -1 +0,0 @@
-org.eclipse.wst.jsdt.launching.baseBrowserLibrary

.settings/org.eclipse.wst.jsdt.ui.superType.name

@@ -1 +0,0 @@
-Window

Gruntfile.js

@@ -10,32 +10,6 @@ module.exports = function(grunt) {
       '<%= pkg.homepage ? "* " + pkg.homepage + "\\n" : "" %>' +
       '* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>;' +
       ' Licensed <%= _.pluck(pkg.licenses, "type").join(", ") %> */\n',
-    gitinfo: {
-    	options: {},
-      commands: { 'tag': ['tag', '--points-at', 'HEAD'] }
-    },
-    template: {
-    	'add_build_info': {
-    		options: {
-    			data: function() {
-    				grunt.task.requires('gitinfo');
-    				var gi = grunt.config('gitinfo');
-    				var lbc = gi.local.branch.current;
-
-    				var tags = (gi.tag == '') ? 'no_tag' : gi.tag;
-            tags = tags.split('\n').join(',');
-    				var commitMsg = lbc.lastCommitMessage.slice(1, -1).split('\n')[0].replace(/"/g, '\\\"');
-
-    				var buildInfo = lbc.shortSHA + "/" + lbc.name + "/" + tags +
-    						" (" + lbc.lastCommitTime.slice(1, -1) + "; \'" + commitMsg + "'";
-    				return { 'build_info': buildInfo };
-    			}
-    		},
-    		files: {
-    			'js/main.js.out': ['js/main.js']
-    		}
-    	}
-    },
     concat: {
       options: {
 //         separator: ';'
@@ -48,8 +22,7 @@ module.exports = function(grunt) {
           'js/*.js',
           // make sure we put main.js last
           '!js/main.js',
-          'js/main.js.out'
+          'js/main.js',         ],
-        ],
         dest: 'www/js/<%= pkg.name %>.js'
       }
     },
@@ -156,8 +129,6 @@ module.exports = function(grunt) {
   });
 
   // These plugins provide necessary tasks.
-  grunt.loadNpmTasks('grunt-gitinfo');
-  grunt.loadNpmTasks('grunt-template');
   grunt.loadNpmTasks('grunt-contrib-less');
   grunt.loadNpmTasks('grunt-contrib-concat');
   grunt.loadNpmTasks('grunt-contrib-uglify');
@@ -168,8 +139,6 @@ module.exports = function(grunt) {
 
   // Default task.
   grunt.registerTask('default', [
-    'gitinfo',
-    'template',
     'less',
     'autoprefixer',
     'cssmin',

Makefile

@@ -34,7 +34,6 @@ endef
 
 define Build/Prepare
 	mkdir -p $(PKG_BUILD_DIR)
-	$(CP) js $(PKG_BUILD_DIR)/
 	$(CP) less $(PKG_BUILD_DIR)/
 	$(CP) www $(PKG_BUILD_DIR)/
 	$(CP) Gruntfile.js $(PKG_BUILD_DIR)/
@@ -44,22 +43,16 @@ define Build/Prepare
 endef
 
 define Build/Compile
-	# We're running grunt in the shared folder, so
-	# grunt can access git info
 	npm install
 ifeq ($(CONFIG_DOODLE3D_CLIENT_MINIFY_JS),y)
-	grunt gitinfo template less autoprefixer cssmin concat uglify
+		grunt less autoprefixer cssmin concat uglify
 else
-	grunt gitinfo template less autoprefixer cssmin concat
+		grunt less autoprefixer cssmin concat
 endif
-	# Copy compiled files to build dir
-	$(CP) www $(PKG_BUILD_DIR)/
 endef
 
 define Package/doodle3d-client/install
-
 	$(INSTALL_DIR) $(1)/www
-	$(INSTALL_DIR) $(1)/www/filemanager
 	$(INSTALL_DIR) $(1)/www/css
 	$(INSTALL_DIR) $(1)/www/img
 	#$(INSTALL_DIR) $(1)/www/js
@@ -70,14 +63,12 @@ define Package/doodle3d-client/install
 	$(CP) $(PKG_BUILD_DIR)/www/settings.html $(1)/www/
 	$(CP) $(PKG_BUILD_DIR)/www/helpcontent.html $(1)/www/
 	$(CP) $(PKG_BUILD_DIR)/www/redirect.html $(1)/www/
-	$(CP) $(PKG_BUILD_DIR)/www/404.html $(1)/www/
 	
 	$(CP) $(PKG_BUILD_DIR)/www/css/debug.min.css $(1)/www/css/
 	$(CP) $(PKG_BUILD_DIR)/www/css/settings.min.css $(1)/www/css/
 	$(CP) $(PKG_BUILD_DIR)/www/css/styles.min.css $(1)/www/css/
 	
 	$(CP) $(PKG_BUILD_DIR)/www/img/* $(1)/www/img/
-	$(CP) $(PKG_BUILD_DIR)/www/filemanager/* $(1)/www/filemanager/
 	
 ifeq ($(CONFIG_DOODLE3D_CLIENT_MINIFY_JS),y)
 		$(CP) $(PKG_BUILD_DIR)/www/js/doodle3d-client.min.js $(1)/www/js/

README.md

@@ -5,10 +5,9 @@ Doodle3D client app
 # How to build
 
 ## Prerequisites
-- install npm, the Node.js package manager: `sudo port install npm`
+- get `npm`, the Node.js package manager, for instance using macports on OSX.
-- install Grunt: `sudo npm install -g grunt-cli`
+- (prerequisite) install Grunt: `sudo pm install -g grunt-cli`.
-- run `npm install` in the **project root** to install project dependencies
+- run `npm install` in the project root to install project dependencies
 
-## Build
+Finally run grunt to build minified css and js files. By default, it will keep
-- run `grunt` in the project root to to build minified css and js files. By default, it will keep
 running to automatically rebuild when source files are changed.

js/AddScanDialog.js

@@ -1,41 +0,0 @@
-//var shapeResolution=3;
-var shapePopup;
-
-function initScanDialog() {
-  scanPopup = new Popup($("#popupScan"), $("#popupMask"));
-  $("#btnScanOk").on("onButtonClick", onBtnScanOk);
-  $("#btnCloseScan").on("onButtonClick", onBtnCloseScan);
-}
-
-function onBtnCloseScan() {
-  $('#imgGuide').hide();
-  $('#btnCloseScan').hide();
-}
-
-function onBtnScanOk() {
-  scanPopup.commit();
-}
-
-function showScanDialog() {
-  scanPopup.open();
-}
-
-function readURL(input) {
-
-    if (input.files && input.files[0]) {
-        var reader = new FileReader();
-
-        reader.onload = function (e) {
-          $('#imgGuide').attr('src', e.target.result);
-          $('#imgGuide').show();
-          $('#btnCloseScan').show();
-          scanPopup.commit();
-        }
-
-        reader.readAsDataURL(input.files[0]);
-    }
-}
-
-$("#fileScan").change(function(){
-    readURL(this);
-});

js/Keyboard.js

@@ -49,8 +49,8 @@ function initKeyboard() {
 		var ch = String.fromCharCode(event.which);
 
 		switch (ch) {
-			case 'c': newSketch(); break;
+			case 'c': clearDoodle(); break;
-			case 'n': newSketch(); break;
+			case 'n': clearDoodle(); break;
 			case 'p': print(); break;
 			case 'u': oopsUndo(); break;
 			case 'g': settingsWindow.downloadGcode(); break;
@@ -59,14 +59,13 @@ function initKeyboard() {
 			case 'h': previewUp(true); break;
 			case 'H': previewDown(true); break;
 			case 's': saveSketch(); break;
-			case 'L': nextSketch(); break;
+			case 'L': nextDoodle(); break;
-			case 'l': prevSketch(); break;
+			case 'l': prevDoodle(); break;
 			case '[': previewTwistLeft(); break;
 			case ']': previewTwistRight(); break;
 			case '|': resetTwist(); break;
 			case 't': showWordArtDialog(); break;
 			case 'i': showShapeDialog(); break;
-			case 'T': showScanDialog(); break;
 			
 			case ';': moveShape(-5,0); break;
 			case '\'': moveShape(5,0); break;

js/Message.js

@@ -25,7 +25,7 @@ function Message() {
     this.$element = $element;
  	}
 	this.set = function(contents,mode,autoHide,disableEffect) {
-		//console.log("Message:set: ",contents,mode,autoHide,disableEffect);
+		console.log("Message:set: ",contents,mode,autoHide,disableEffect);
 		if(disableEffect) {
 			self.fill(contents,mode,autoHide)
 		} else{

js/Printer.js

@@ -19,7 +19,6 @@ function setPrintprogress(val) {
 //*/
 
 function Printer() {
-  /* CONSTANTS */
 
 	Printer.WIFIBOX_DISCONNECTED_STATE	= "wifibox disconnected";
 	Printer.UNKNOWN_STATE				= "unknown";				// happens when a printer is connection but there isn't communication yet
@@ -33,29 +32,11 @@ function Printer() {
 
 	Printer.ON_BEFORE_UNLOAD_MESSAGE = "You're doodle is still being sent to the printer, leaving will result in a incomplete 3D print";
 
-  //after buffer full message has been received, wait until the buffer load is below this ratio before sending new data
-  Printer.GCODE_BUFFER_WAIT_LOAD_RATIO = 0.75;
-  Printer.BUFFER_SPACE_WAIT_TIMEOUT = 30000; // how often to recheck buffer load
-  
-  //time to wait when wifibox connection is lost while printing
-  Printer.DISCONNECTED_RETRY_DELAY = 5000;
-  
-  Printer.MAX_LINES_PER_POST = 500; // max amount of gcode lines per post (limited because WiFi box can't handle too much)
-  Printer.MAX_GCODE_SIZE = 10; // max size of gcode in MB's (estimation)
-
-  // Events
-  Printer.UPDATE = "update";
-
-  
-  /* MEMBER VARIABLES */
-
 	this.temperature 		= 0;
 	this.targetTemperature 	= 0;
 	this.currentLine 		= 0;
 	this.totalLines			= 0;
 	this.bufferedLines		= 0;
-	this.bufferSize = 0;
-	this.maxBufferSize = 0;
 	this.state				= Printer.UNKNOWN_STATE;
 	this.hasControl			= true;	// whether this client has control access
 
@@ -66,8 +47,8 @@ function Printer() {
 	this.timeoutTime = 3000;
 	this.sendPrintPartTimeoutTime = 5000;
 
-	this.gcode = []; // gcode to be printed
+	this.gcode; 							// gcode to be printed
-	this.gcodeNumChunks = 0; //number of chunks to be sent (used for sequence numbering)
+	this.sendLength = 500; 					// max amount of gcode lines per post (limited because WiFi box can't handle too much)
 
 	this.retryDelay = 2000; 				// retry setTimout delay
 	this.retrySendPrintPartDelay; 			// retry setTimout instance
@@ -75,10 +56,12 @@ function Printer() {
 	this.retryStopDelay;					// retry setTimout instance
 	this.retryPreheatDelay;					// retry setTimout instance
 
+	Printer.MAX_GCODE_SIZE = 10;			// max size of gcode in MB's (estimation)
+
 	this.stateOverruled = false;
 
-	
+	// Events
-	/* FUNCTIONS */
+	Printer.UPDATE = "update";
 
 	var self = this;
 
@@ -137,7 +120,6 @@ function Printer() {
 
 		this.sendIndex = 0;
 		this.gcode = gcode;
-		this.gcodeNumChunks = Math.ceil(this.gcode.length / Printer.MAX_LINES_PER_POST);
 
 		//console.log("  gcode[20]: ",gcode[20]);
 		var gcodeLineSize = this.byteSize(gcode[20]);
@@ -160,7 +142,7 @@ function Printer() {
 
 		//this.targetTemperature = settings["printer.temperature"]; // slight hack
 
-		this.sendPrintPart(this.sendIndex, Printer.MAX_LINES_PER_POST);
+		this.sendPrintPart(this.sendIndex, this.sendLength);
 	}
 
 	this.byteSize = function(s){
@@ -168,43 +150,26 @@ function Printer() {
 	}
 
 	this.sendPrintPart = function(sendIndex,sendLength) {
-		var self = this;
+		console.log("Printer:sendPrintPart sendIndex: " + sendIndex + "/" + this.gcode.length + ", sendLength: " + sendLength);
-		// Abort if stopping
+
-		// sendPrintPart can be called by delayed retry after request timeout for example
+
-		if (self.state === Printer.STOPPING_STATE) return;
+		var sendPercentage = Math.round(sendIndex/this.gcode.length*100);
+		message.set("Sending doodle to printer: "+sendPercentage+"%",Message.NOTICE,false,true);
+
+		var firstOne = (sendIndex == 0)? true : false;
+		var start = firstOne; // start printing right away
 
 		var completed = false;
 		if (this.gcode.length < (sendIndex + sendLength)) {
+			console.log("  sending less than max sendLength (and last)");
 			sendLength = this.gcode.length - sendIndex;
+			//lastOne = true;
 			completed = true;
 		}
+		var gcodePart = this.gcode.slice(sendIndex, sendIndex+sendLength);
 
-
+		var postData = { gcode: gcodePart.join("\n"), first: firstOne, start: start};
-		/* prepare post data */
+		var self = this;
-
-		var gcodePart = this.gcode.slice(sendIndex, sendIndex + sendLength);
-		var firstOne = (sendIndex == 0) ? true : false;
-		var start = firstOne; // start printing right away
-		var seqNum = Math.floor(sendIndex / Printer.MAX_LINES_PER_POST);
-		var postData = {
-				gcode: gcodePart.join("\n"), total_lines: this.gcode.length,
-				clear: firstOne, start: start,
-				seq_number: seqNum, seq_total: this.gcodeNumChunks
-		};
-
-		
-		/* inform user what's going on */
-
-		var lessThanMaxText = completed ? " (last one, max=" + Printer.MAX_LINES_PER_POST + ")" : "";
-		console.log("Printer:sendPrintPart: sendIndex=" + sendIndex + "/" + this.gcode.length +
-				", sendLength=" + sendLength + lessThanMaxText +
-				", sequence numbers: " + seqNum + "/" + this.gcodeNumChunks);
-
-		var sendPercentage = Math.round(sendIndex / this.gcode.length * 100);
-		message.set("Sending doodle to printer: " + sendPercentage + "%", Message.NOTICE, false, true);
-
-		
-		/* send data */
 		if (communicateWithWifibox) {
 			$.ajax({
 				url: this.wifiboxURL + "/printer/print",
@@ -213,13 +178,13 @@ function Printer() {
 				dataType: 'json',
 				timeout: this.sendPrintPartTimeoutTime,
 				success: function(data){
-					//console.log("Printer:sendPrintPart success response: ", data);
+					console.log("Printer:sendPrintPart response: ",data);
 
 					if(data.status == "success") {
 						if (completed) {
-							console.log("Printer:sendPrintPart: gcode sending completed");
+							console.log("Printer:sendPrintPart:gcode sending completed");
 							this.gcode = [];
-							this.gcodeNumChunks = 0;
+							btnStop.css("display","block"); // hack
 							self.removeLeaveWarning();
 							message.set("Doodle has been sent to printer...",Message.INFO,true);
 							//self.targetTemperature = settings["printer.temperature"]; // slight hack
@@ -230,48 +195,23 @@ function Printer() {
 							if(self.state == Printer.PRINTING_STATE || self.state == Printer.BUFFERING_STATE) {
 								//console.log("Printer:sendPrintPart:sending next part");
 								self.sendPrintPart(sendIndex + sendLength, sendLength);
-							} else if (Printer.WIFIBOX_DISCONNECTED_STATE) {
-								console.warn("Printer:sendPrintPart: wifibox connection lost while printing, retrying in " + (Printer.DISCONNECTED_RETRY_DELAY / 1000) + " seconds");
-								clearTimeout(self.retrySendPrintPartDelay);
-								self.retrySendPrintPartDelay = setTimeout(function() {
-									console.log("Printer:sendPrintPart: retrying after wifibox disconnect was detected");
-									self.sendPrintPart(sendIndex, sendLength);
-								}, Printer.DISCONNECTED_RETRY_DELAY);
 							}
 						}
-					} else if (data.status == "fail") {
-					  if (data.data.status == "buffer_full") {
-					  	console.log("Printer:sendPrintPart: print server reported buffer full, pausing data transmission");
-					    //this will wait in a setTimeout loop until enough room is available and then call sendPrintPart again.
-					    self.waitForBufferSpace(sendIndex, sendLength);
-					  } else if (data.data.status == "seq_num_mismatch" && data.data.seq_number == seqNum) {
-				  		console.warn("Printer:sendPrintPart: received sequence error, server is one chunk ahead. Proceeding with next chunk...");
-				  		self.sendPrintPart(sendIndex + sendLength, sendLength);
-					  } else {
-					    console.error("Printer:sendPrintPart: unexpected failure response for API endpoint printer/print (" +
-					    		data.data.status + ", current server seq. info: " + data.data.seq_number + "/" + data.data.seq_total + ")");
-					    //sequence errors should not occur, except perhaps when 'stop' was clicked while still sending (https://github.com/Doodle3D/doodle3d-client/issues/226).
-					    if (self.state != Printer.STOPPING_STATE) {
-					    	message.set("Unexpected error sending doodle to printer (" + data.data.status + "), please retry", Message.ERROR, false, true);
-					    }
-					  }
 					}
-
+					// after we know the first gcode packed has bin received or failed
-					// after we know the first gcode part has been received or failed
 					// (and the driver had time to update the printer.state)
 					// we start checking the status again
 					if(sendIndex == 0) {
 						self.startStatusCheckInterval();
 					}
 				}
-			}).fail(function(jqXHr, textStatus, errorThrown) {
+			}).fail(function() {
-				console.error("Printer:sendPrintPart: failed (AJAX status: '" + textStatus + "') AJAX exception (if any):", errorThrown);
+				console.log("Printer:sendPrintPart: failed");
-				console.warn("Printer:sendPrintPart: retrying in " + (Printer.DISCONNECTED_RETRY_DELAY / 1000) + " seconds");
 				clearTimeout(self.retrySendPrintPartDelay);
 				self.retrySendPrintPartDelay = setTimeout(function() {
-					console.log("Printer:sendPrintPart: retrying after AJAX failure");
+					console.log("request printer:sendPrintPart failed retry");
 					self.sendPrintPart(sendIndex, sendLength)
-				}, Printer.DISCONNECTED_RETRY_DELAY);
+				},self.retryDelay); // retry after delay
 
 				// after we know the gcode packed has bin received or failed
 				// (and the driver had time to update the printer.state)
@@ -283,46 +223,12 @@ function Printer() {
 		}
 	}
 
-	/*
-	 * Called by sendPrintPart when a buffer_full fail response is received.
-	 * This function keeps calling itself until the GCodeBuffer's load ratio
-	 * drops below a predefined value and then calls sendPrintPart again.
-	 */
-	this.waitForBufferSpace = function(sendIndex,sendLength) {
-    var fillRatio = this.bufferSize / this.maxBufferSize;
-    var self = this;
-
-    //console.log("buffer fill state: " + self.bufferSize + "/" + self.maxBufferSize + " (" + fillPercent + "%)");
-
-    if (fillRatio >= Printer.GCODE_BUFFER_WAIT_LOAD_RATIO) {
-      var fillPercent = (fillRatio * 100).toFixed(2);
-      console.log("Printer:waitForBufferSpace: waiting until gcode buffer load ratio is below " +
-          (Printer.GCODE_BUFFER_WAIT_LOAD_RATIO * 100) + "% (current: " + fillPercent + "% of " +
-          (self.maxBufferSize / 1024) + "KiB)");
-      self.waitForBufferSpaceDelay = setTimeout(function() { self.waitForBufferSpace(sendIndex, sendLength); }, Printer.BUFFER_SPACE_WAIT_TIMEOUT);
-    } else {
-      if(self.state == Printer.PRINTING_STATE || self.state == Printer.BUFFERING_STATE) {
-        console.log("Printer:waitForBufferSpace: load ratio dropped below " + (Printer.GCODE_BUFFER_WAIT_LOAD_RATIO * 100) + "%, calling sendPrintPart...");
-        self.sendPrintPart(sendIndex, sendLength);
-      } else {
-        console.log("Printer:waitForBufferSpace: load ratio dropped far enough but printer state is not printing or buffering anymore, not resuming.");
-      }
-    }
-	}
-
 	this.stop = function() {
 		console.log("Printer:stop");
-		var self = this;
-		if (self.retrySendPrintPartDelay !== undefined) {
-			clearTimeout(self.retrySendPrintPartDelay);
-		}
-		if (self.waitForBufferSpaceDelay !== undefined) {
-			clearTimeout(self.waitForBufferSpaceDelay);
-		}
-
 		endCode = generateEndCode();
 		console.log("  endCode: ",endCode);
 		var postData = { gcode: endCode.join("\n")};
+		var self = this;
 		if (communicateWithWifibox) {
 			$.ajax({
 				url: this.wifiboxURL + "/printer/stop",
@@ -419,9 +325,7 @@ function Printer() {
 			// progress
 			self.currentLine = data.current_line;
 			self.totalLines = data.total_lines;
-			self.bufferedLines = data.buffered_lines;
+			self.bufferedLines = data.buffered_lines
-			self.bufferSize = data.buffer_size;
-			self.maxBufferSize = data.max_buffer_size;
 
 			// access
 			self.hasControl = data.has_control;

js/Shape.js

@@ -25,7 +25,7 @@ function shapeMoveTo(x,y) {
   _points.push([x, y, true]);
   adjustBounds(x, y);
   adjustPreviewTransformation();
-  draw(x, y, -1);
+  draw(x, y, .5);
 }
 
 function shapeLineTo(x,y) {

js/Svg.js

@@ -56,8 +56,6 @@ function loadFromSvg(svgData) {
 
 	clearDoodle();
 
-	svgData = svgData.replace("M0,0 ",""); //RC: hack
-
 	var p = svgData.indexOf("<path");
 	if (p == -1) { console.log("loadFromSvg: could not find parsing start point"); return false; }
 	p = svgData.indexOf('d="', p);
@@ -75,17 +73,7 @@ function loadFromSvg(svgData) {
 				return true;
 			} else { //something else, must be a pair of coordinates...
 				var tx = 0, ty = 0, numberEnd = 0, len = 0;
-				// var firstComma = svgData.indexOf(',', p);
-				// var firstSpace = svgData.indexOf(' ', p);
-
 				numberEnd = svgData.indexOf(',', p);
-
-				////// RC: if instead of a comma a space is used between a pair use that as a separator
-				var firstSpace = svgData.indexOf(' ', p);
-				if (firstSpace<numberEnd) numberEnd=firstSpace;   
-				//console.log('numberEnd',numberEnd,firstSpace);
-				////////////////
-
 				if (numberEnd == -1) { console.log("could not find comma in coordinate pair"); return false; }
 				len = numberEnd - p;
 				tx = parseFloat(svgData.substr(p, len));
@@ -116,7 +104,7 @@ function loadFromSvg(svgData) {
 				adjustBounds(x, y);
 				adjustPreviewTransformation();
 
-				if (isMove) draw(x, y, -1);
+				if (isMove) draw(x, y, .5);
 				else draw(x, y);
 			}
 			p++;

js/buttonbehaviors.js

@@ -13,7 +13,6 @@ var btnSettings, btnWordArt;
 var btnToggleEdit, buttonGroupEdit, btnZoom, btnMove, btnRotate;
 var btnToggleVerticalShapes, btnHeight, btnTwist, btnShape, btnConv, btnStraight, btnSine, btnDiv;
 var buttonGroupAdd, popupWordArt;
-var btnScan, popupScan;
 
 var state;
 var prevState;
@@ -44,10 +43,8 @@ function initButtonBehavior() {
 	buttonGroupAdd = $("#buttonGroupAdd");
 	btnShape = new Button("#btnShape");
 	btnWordArt = new Button("#btnWordArt");
-    btnScan = new Button("#btnScan");
 	popupWordArt = $("#popupWordArt");
 	popupShape = $("#popupShape");
-    popupScan = $("#popupScan");
 	popupMask = $("#popupMask");
 	logoPanel = $("#logopanel");
 	btnToggleEdit = new Button("#btnToggleEdit");
@@ -72,12 +69,11 @@ function initButtonBehavior() {
 	btnAdd.on("onButtonClick", onBtnAdd);
 	btnWordArt.on("onButtonClick", onBtnWordArt);
 	btnShape.on("onButtonClick", onBtnShape);
-    btnScan.on("onButtonClick", onBtnScan);
 	btnPrint.on("onButtonClick", print);
 	btnStop.on("onButtonClick", stopPrint);
 	btnSave.on("onButtonClick", saveSketch);
-	btnPrevious.on("onButtonClick", previousSketch);
+	btnPrevious.on("onButtonClick", prevDoodle);
-	btnNext.on("onButtonClick", nextSketch);
+	btnNext.on("onButtonClick", nextDoodle);
 	btnOops.on("onButtonHold", onBtnOops);
 	// vertical shape buttons
 	btnToggleVerticalShapes.on("onButtonClick", onBtnToggleVerticalShapes);
@@ -93,10 +89,8 @@ function initButtonBehavior() {
 	btnZoom.on("onButtonHold", onBtnZoom);
 	btnRotate.on("onButtonHold", onBtnRotate);
 
-	//getSavedSketchStatus();
+	getSavedSketchStatus();
-	listSketches();
+	setSketchModified(false);
-	// setSketchModified(false);
-	// updateSketchButtonStates();
 
 	function onBtnToggleVerticalShapes() {
 		var btnImg;
@@ -185,7 +179,7 @@ function initButtonBehavior() {
 	}
 
 	function onBtnNew(e) {
-		newSketch();
+		clearDoodle();
 	}
 
 	function onBtnWordArt(e) {
@@ -197,11 +191,6 @@ function initButtonBehavior() {
 		buttonGroupAdd.fadeOut();
 	}
 
-    function onBtnScan(e) {
-        showScanDialog();
-		buttonGroupAdd.fadeOut();
-    }
-    
 	btnSettings.on("onButtonClick", openSettingsWindow);
 
 	// 29-okt-2013 - we're not doing help for smartphones at the moment
@@ -232,6 +221,8 @@ function print(e) {
 		//setState(Printer.BUFFERING_STATE,printer.hasControl);
 		printer.overruleState(Printer.BUFFERING_STATE);
 
+		btnStop.css("display","none"); // hack
+
 		// we put the gcode generation in a little delay
 		// so that for example the print button is disabled right away
 		clearTimeout(gcodeGenerateDelayer);
@@ -356,7 +347,7 @@ function setState(newState,newHasControl) {
 
 	prevState = state;
 
-	console.log("setState: " + prevState + " > " + newState + " ( " + newHasControl + ")");
+	console.log("setState: ",prevState," > ",newState," ( ",newHasControl,")");
 	setDebugText("State: "+newState);
 
 	// print button
@@ -423,9 +414,8 @@ function setState(newState,newHasControl) {
 		btnSave.disable();
 		break;
 	default:
-		// updatePrevNextButtonState();
+		updatePrevNextButtonState();
-		updateSketchButtonStates();
+	if (isModified) btnSave.enable();
-		if (isModified) btnSave.enable();
 	break;
 	}
 

js/canvasDrawing.js

@@ -97,66 +97,52 @@ function initDoodleDrawing() {
  *  CANVAS DRAWING FUNCTION
  *
  * * * * * * * * * */
-
-//If _width is not specified, it is calculated from the distance between this and the previous point.
-//If _width is negative, the path is 'floating', and only drawn if the setting printer.bottomEnableTraveling is true.
 function draw(_x, _y, _width) {
-  //console.log("canvasDrawing:draw");
+	//console.log("canvasDrawing:draw");
-  //console.log("f:draw() >> _width: " + _width);
+  //    console.log("f:draw() >> _width: " + _width);
 
-  if (prevX == 0 && prevY == 0) {
+  if (prevX == 0 && prevY ==0) {
     prevX = _x;
     prevY = _y;
   }
 
   ctx.beginPath();
   ctx.moveTo(prevX, prevY);
+  ctx.lineTo(_x, _y);
 
-  var lineWeight = null;
+  if (_width != undefined) {
-  if (_width != undefined && _width < 0) {
+    ctx.lineWidth = _width;
-    if (settings['printer.bottomEnableTraveling']) {
-      ctx.moveTo(_x, _y);
-    } else {
-      lineWeight = 0.5;
-    }
   } else {
-    if (_width != undefined) {
+    if (drawVariableLineWeight) {
-      lineWeight = _width;
+      var dist = Math.sqrt(Math.pow((prevX - _x), 2) + Math.pow((prevY - _y), 2));
-    } else {
+      if (dist < 10) {
-      if (drawVariableLineWeight) {
+        lineweight += .25;
-        var dist = Math.sqrt(Math.pow((prevX - _x), 2) + Math.pow((prevY - _y), 2));
+      } else if (dist < 20) {
-        if (dist < 10) {
+        lineweight += .5;
-          lineWeight += .25;
+      } else if (dist < 30) {
-        } else if (dist < 20) {
+        lineweight += .75;
-          lineWeight += .5;
+      } else if (dist < 50) {
-        } else if (dist < 30) {
+        lineweight += 1;
-          lineWeight += .75;
+      } else if (dist < 80) {
-        } else if (dist < 50) {
+        lineweight += 1.5;
-          lineWeight += 1;
+      } else if (dist < 120) {
-        } else if (dist < 80) {
+        lineweight += 2.25;
-          lineWeight += 1.5;
+      } else if (dist < 170) {
-        } else if (dist < 120) {
+        lineweight += 3.5;
-          lineWeight += 2.25;
-        } else if (dist < 170) {
-          lineWeight += 3.5;
-        } else {
-          lineWeight += 2;
-        }
-        lineWeight = Math.min(lineWeight, 30);
-        lineWeight *= 0.90;
-        lineWeight = Math.max(lineWeight, 1.0);
       } else {
-        lineWeight = 2;
+        lineweight += 2;
       }
+      lineweight = Math.min(lineweight, 30);
+      lineweight *= 0.90;
+      lineweight = Math.max(lineweight, 1.0);
+    } else {
+      lineweight = 2;
     }
-  }
 
-  if (lineWeight != null) {
+    ctx.lineWidth = lineweight;
-    ctx.lineCap = 'round';
-    ctx.lineWidth = lineWeight;
-    ctx.lineTo(_x, _y);
-    ctx.stroke();
   }
+  ctx.lineCap = 'round';
+  ctx.stroke();
 
   prevX = _x;
   prevY = _y;
@@ -171,7 +157,7 @@ function draw(_x, _y, _width) {
 function clearDoodle() {
   //console.log("f:clearDoodle");
 
-  //updatePrevNextButtonStateOnClear();
+  updatePrevNextButtonStateOnClear();
 
   _points = [];
 
@@ -191,7 +177,6 @@ function clearDoodle() {
   resetVerticalShapes();
 
   setSketchModified(false);
-  // updateSketchButtonStates();
 }
 
 function redrawDoodle(recalcBoundsAndTransforms) {
@@ -216,7 +201,7 @@ function redrawDoodle(recalcBoundsAndTransforms) {
   for (var i = 0; i < _points.length; i++) {
     //      console.log("     drawing points " + _points[i]);
     if (_points[i][2] == true) {
-      draw(_points[i][0], _points[i][1], -1);
+      draw(_points[i][0], _points[i][1], 0.5);
     } else {
       draw(_points[i][0], _points[i][1]);
     }
@@ -315,7 +300,7 @@ function onCanvasMouseDown(e) {
   _points.push([x, y, true]);
   adjustBounds(x, y);
   adjustPreviewTransformation();
-  draw(x, y, -1);
+  draw(x, y, 0.5);
 }
 
 var prevPoint = {x:-1, y:-1};
@@ -337,9 +322,18 @@ function onCanvasMouseMove(e) {
     y = e.layerY;
   }
 
-  var prevPresent = prevPoint.x != -1 || prevPoint.y != -1;
+  if (prevPoint.x != -1 || prevPoint.y != -1) {
-  var dist = prevPresent ? Math.sqrt(Math.pow((prevPoint.x - x), 2) + Math.pow((prevPoint.y - y), 2)) : undefined;
+    var dist = Math.sqrt(((prevPoint.x - x) * (prevPoint.x - x)) + ((prevPoint.y - y) * (prevPoint.y - y)));
-  if (!prevPresent || dist > 5) { // replace dist check by setting: doodle3d.simplify.minDistance
+    if (dist > 5) { // replace by setting: doodle3d.simplify.minDistance
+      _points.push([x, y, false]);
+      adjustBounds(x, y);
+      adjustPreviewTransformation();
+      draw(x, y);
+      prevPoint.x = x;
+      prevPoint.y = y;
+    }
+  } else {
+    // this is called once, every time you start to draw a line
     _points.push([x, y, false]);
     adjustBounds(x, y);
     adjustPreviewTransformation();
@@ -406,7 +400,7 @@ function onCanvasTouchDown(e) {
   _points.push([x, y, true]);
   adjustBounds(x, y);
   adjustPreviewTransformation();
-  draw(x, y, -1);
+  draw(x, y, .5);
 
   movementCounter = 0;
 
@@ -429,11 +423,19 @@ function onCanvasTouchMove(e) {
 
   //console.log("f:onCanvasTouchMove >> x,y = "+x+","+y+" , e: " , e);
 
-  var prevPresent = prevPoint.x != -1 || prevPoint.y != -1;
+  if (prevPoint.x != -1 || prevPoint.y != -1) {
-  var dist = prevPresent ? Math.sqrt(Math.pow((prevPoint.x - x), 2) + Math.pow((prevPoint.y - y), 2)) : undefined;
+    var dist = Math.sqrt(Math.pow((prevPoint.x - x), 2) + Math.pow((prevPoint.y - y), 2));
-  if (!prevPresent || dist > 5) { // replace dist check by setting: doodle3d.simplify.minDistance
+    if (dist > 5) {
+      _points.push([x, y, false]);
+      adjustBounds(x, y)
+      adjustPreviewTransformation();
+      draw(x, y);
+      prevPoint.x = x;
+      prevPoint.y = y;
+    }
+  } else {
     _points.push([x, y, false]);
-    adjustBounds(x, y);
+    adjustBounds(x, y)
     adjustPreviewTransformation();
     draw(x, y);
     prevPoint.x = x;
@@ -486,3 +488,8 @@ function onCanvasTouchEnd(e) {
 function prevent(e) {
   e.preventDefault();
 }
+
+
+
+
+

js/gcodeGenerating.js

@@ -20,7 +20,6 @@ function generate_gcode() {
   var bottomSpeed 			      = settings["printer.bottomLayerSpeed"];
   var firstLayerSlow			  = settings["printer.firstLayerSlow"];
   var bottomFlowRate			  = settings["printer.bottomFlowRate"];
-  var bottomEnableTraveling		  = settings["printer.bottomEnableTraveling"];
   var travelSpeed 			      = settings["printer.travelSpeed"]
   var filamentThickness       = settings["printer.filamentThickness"];
   var wallThickness 		      = settings["printer.wallThickness"];
@@ -160,10 +159,8 @@ function generate_gcode() {
         var isTraveling = !isLoop && i==0;
         var doRetract = retractionEnabled && prev.distance(to) > retractionminDistance;
 
-        //Always travel to first point, then optionally disable traveling for first two layers and use settings for remainder of print.
         var firstPointEver = (layer == 0 && i == 0 && j == 0);
-        var travelingAllowed = firstPointEver || bottomEnableTraveling || layer > 2;
+        if (firstPointEver || layer > 2 && enableTraveling && isTraveling) { //always travel to first point, then disable traveling for first two layers and use settings for remainder of print
-        if (travelingAllowed && enableTraveling && isTraveling) {
           if (!firstPointEver && doRetract) gcode.push("G0 E" + (extruder - retractionamount).toFixed(3) + " F" + (retractionspeed * 60).toFixed(3)); //retract
           gcode.push("G0 X" + to.x.toFixed(3) + " Y" + to.y.toFixed(3) + " Z" + z.toFixed(3) + " F" + (travelSpeed * 60).toFixed(3));
           if (!firstPointEver && doRetract) gcode.push("G0 E" + extruder.toFixed(3) + " F" + (retractionspeed * 60).toFixed(3)); // return to normal
@@ -221,8 +218,6 @@ function subsituteVariables(gcode) {
     case "makerbot_replicator2x": printerType = "r2x"; break;
     case "makerbot_thingomatic": printerType = "t6"; break;
     case "makerbot_generic": printerType = "r2"; break;
-    case "wanhao_duplicator4": printerType = "r2x"; break;
-    case "_3Dison_plus": printerType = "r2"; break;
   }
   var heatedBedReplacement = (heatedbed)? "" : ";";
 

js/main.js

@@ -34,8 +34,7 @@ var POPUP_SHOW_DURATION = 175;
 var BUTTON_GROUP_SHOW_DURATION = 80;
 
 $(function() {
-  console.log("Doodle3D client ready");
+  console.log("ready");
-  console.log("Build information - <%= build_info %>)");
   
   if (getURLParameter("d") != "null") debugMode = (getURLParameter("d") == "1");
   if (getURLParameter("p") != "null") sendPrintCommands = (getURLParameter("p") == "1");
@@ -43,26 +42,15 @@ $(function() {
   if (getURLParameter("r") != "null") wifiboxIsRemote = (getURLParameter("r") == "1");
   if (getURLParameter("u") != "null") autoUpdate = (getURLParameter("u") == "1");
 
-  var hostname;
+	if (wifiboxIsRemote) {
-  if (wifiboxIsRemote) hostname = 'http://192.168.5.1';
+    // var hostname = "http://10.0.0.45";
-  if (getURLParameter("wifiboxURL") != "null") hostname = getURLParameter("wifiboxURL");
+    var hostname = "http://192.168.5.1";
-  if (!hostname) hostname = "http://" + window.location.host;
+		wifiboxURL = hostname+"/d3dapi";
-
+		wifiboxCGIBinURL = hostname+"/cgi-bin/d3dapi";
-  wifiboxURL = hostname+"/d3dapi";
+	} else {
-  wifiboxCGIBinURL = hostname+"/cgi-bin/d3dapi";
+		wifiboxURL = "http://" + window.location.host + "/d3dapi";
-
+		wifiboxCGIBinURL = "http://" + window.location.host + "/cgi-bin/d3dapi";
-  
+	}
-  //var api = wifiboxURL+'/d3dapi/sketch/';
-
-	// if (wifiboxIsRemote) {
- //    // var hostname = "http://10.0.0.45";
- //    var hostname = "http://192.168.5.1";
-	// 	wifiboxURL = hostname+"/d3dapi";
-	// 	wifiboxCGIBinURL = hostname+"/cgi-bin/d3dapi";
-	// } else {
-	// 	wifiboxURL = "http://" + window.location.host + "/d3dapi";
-	// 	wifiboxCGIBinURL = "http://" + window.location.host + "/cgi-bin/d3dapi";
-	// }
 
   if (!communicateWithWifibox) {
     sendPrintCommands = false; // 'communicateWithWifibox = false' implies this
@@ -86,7 +74,6 @@ $(function() {
   // initVerticalShapes();
   initWordArt();
   initShapeDialog();
-  initScanDialog();
 
   disableDragging();
   

js/settings/NetworkPanel.js

@@ -145,9 +145,6 @@ function NetworkPanel() {
 	this.retrieveNetworkStatus = function(connecting) {
 		//console.log("NetworkPanel:retrieveNetworkStatus");
 		_api.status(function(data) {
-			if(data.status === "") {
-				data.status = NetworkAPI.STATUS.CREATED.toString();
-			}
 			if(typeof data.status === 'string') {
 				data.status = parseInt(data.status);
 			}

js/settings/SettingsWindow.js

@@ -34,8 +34,7 @@ function SettingsWindow() {
 	var _networkPanel = new NetworkPanel();
 	var _networkAPI = new NetworkAPI();
 	
-	var _restoreStateField;
+	var _restoreStateField
-	var _initialLogLevel = undefined;
 	
 	var self = this;
 
@@ -116,10 +115,6 @@ function SettingsWindow() {
 				settingsPopup.close();
 				self.signin();
 			}
-			
-			//FIXME: instead of this rather ugly call, implement events for changes to settings so we can keep code decoupled
-			redrawDoodle(false);
-      
 			_btnOK.removeAttr("disabled");
 		});
 	};
@@ -128,12 +123,6 @@ function SettingsWindow() {
 		_form.loadAllSettings(function(loadedSettings){
 			console.log("Settings:loaded settings: ",loadedSettings);
 			settings = loadedSettings;
-			
-			//only set the initial level once, to make behaviour of restart warning as correctly as possible
-			if (_initialLogLevel == undefined)
-				_initialLogLevel = loadedSettings['system.log.level'];
-			updateLogLevelWarningsVisibility();
-			
 			_form.fillForm(settings);
 			$(document).trigger(SettingsWindow.SETTINGS_LOADED);
 			if(complete) complete();
@@ -187,35 +176,6 @@ function SettingsWindow() {
 			saveAs(blob, "doodle3d.svg");
 		}
 	};
-
-	this.openFileManager = function() {
-		location.href = "filemanager/"+location.search;
-	}
-
-	this.logLevelChanged = function() {
-		updateLogLevelWarningsVisibility();
-	}
-
-
-	/***** LOCAL FUNCTIONS *****/
-
-	function updateLogLevelWarningsVisibility() {
-		var showHideAnimDuration = 100;
-		newLevel = $('#logLevel').val();
-		if (_initialLogLevel != newLevel) {
-			$('#logging-restart-warning').show(showHideAnimDuration);
-		} else {
-			$('#logging-restart-warning').hide(showHideAnimDuration);
-		}
-
-		switch (newLevel) {
-		case "verbose": case "bulk":
-			$('#logging-verbose-warning').show(showHideAnimDuration);
-			break;
-		default:
-			$('#logging-verbose-warning').hide(showHideAnimDuration);
-		}
-	}
 }
 
 /*************************

js/settings/UpdatePanel.js

@@ -204,7 +204,7 @@ function UpdatePanel() {
 	this.setState = function(newState,refresh) {
 		//console.log("UpdatePanel:setState");
 		if(!refresh && this.state == newState) return;
-		console.log("UpdatePanel:setState: " + this.state + " > " + newState + "(" + this.stateText + ") (in Access Point Mode: " + _inAccessPointMode + ") (newestVersion: " + self.newestVersion + ") (refresh: " + refresh + ")");
+		console.log("UpdatePanel:setState: ",this.state," > ",newState,"(",this.stateText,") (in Access Point Mode: ",_inAccessPointMode,") (newestVersion: ",self.newestVersion,") (refresh: ",refresh,")");
 		this.state = newState;
 
 		// should personal sketches and settings be retained over update?
@@ -314,7 +314,7 @@ function UpdatePanel() {
 		var fields = [ ts.substr(0, 4), ts.substr(4, 2), ts.substr(6, 2) ];
 		if (!fields || fields.length != 3 || fields[1] > 12) return null;
 
-		var abbrMonths = [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ];
+		var abbrMonths = [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Sep', 'Aug', 'Oct', 'Nov', 'Dec' ];
 		return abbrMonths[fields[1] - 1] + " " + fields[2] + ", " + fields[0];
 	}
 

js/sketches.js

@@ -6,95 +6,158 @@
  * See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
  */
 
-var curSketch = 0;
+var currentSketchId = 0;
-var sketches = []; //contains fileIDs
+var numSavedSketches = 0;
 
-function previousSketch(e) {
+function getSavedSketchStatus() {
-	loadSketch(curSketch-1);
+	$.ajax({
-}
+		url: wifiboxURL + "/sketch/status",
-
+		dataType: 'json',
-function nextSketch(e) {
+		type: 'GET',
-	loadSketch(curSketch+1);
+		//timeout: this.timeoutTime,
-}
+		success: function(response) {
-
+			if (response.status == 'error' || response.status == 'fail') {
-function newSketch(e) {
+				console.log("getSavedSketchStatus fail/error: " + response.msg + " -- ", response);
-	clearDoodle();
+			} else {
-	curSketch = sketches.length; //index of the last item + 1
+				console.log("getSavedSketchStatus success: num. saved: " + response.data.number_of_sketches + ", space available: " + response.data.available);
-	updateSketchButtonStates();
+				numSavedSketches = response.data.number_of_sketches;
-}
+				updatePrevNextButtonStateOnClear();
-
+			}
-function listSketches() {
-	console.log('listSketches')
-	$.get(wifiboxURL + "/sketch/list", function(data) {
-		if (data.status=='success') {
-			sketches = data.data.list;
-			curSketch = sketches.length-1;
-			setSketchModified(false);
-			updateSketchButtonStates();
 		}
-	})
+	}).fail(function() {
+		console.log("getSavedSketchStatus failed");
+	});
 }
 
-function setSketchModified(_isModified) {
+function setSketchModified(_isModified, doNotClearCurrent) {
 	isModified = _isModified;
-	updateSketchButtonStates();
+
+	// alert("isModified: " + isModified);
+	//console.log("setModified: " + isModified + (typeof(doNotClearCurrent) !== 'undefined' ? " (doNotClearCurrent: "+doNotClearCurrent+")" : "")); //TEMP
+
+	if (isModified) btnSave.enable();
+	else btnSave.disable();
+
+	//if (typeof(doNotClearCurrent) !== 'undefined' && !doNotClearCurrent) setCurrentSketchId(-1);
+
+	
+	//sketchModified  = isModified; /// ERROR?
 }
 
-function updateSketchButtonStates() {
+function setCurrentSketchId(sId) {
-	console.log('sketch: isModified: ' + isModified + ', curSketch: ' + curSketch + ', sketches.length: ' + sketches.length);
+	console.log("setCurrentSketchId: " + sId + " / " + numSavedSketches);
+	// var enablePrev = false;
+	// var enableNext = false;
 
-	if (isModified) {
+	currentSketchId = sId;
-		btnSave.enable();
-	}
-	else {
-		btnSave.disable();
-	}
 
-	if (curSketch<sketches.length-1) {
+	//clamp
-		btnNext.enable();
+	if (currentSketchId > numSavedSketches) currentSketchId = numSavedSketches;
-	} else {
+	if (currentSketchId < 1) currentSketchId = 1;
-		btnNext.disable();
-	}
 
-	if (curSketch>0) {
+	//update textbox
-		btnPrevious.enable();
+	//$("#txtSketch").val(currentSketchId);
-	} else {
+	
+	updatePrevNextButtonState();
+}
+
+function updatePrevNextButtonStateOnClear() {
+	if (numSavedSketches > 0) btnPrevious.enable();
+	btnNext.disable();
+	currentSketchId = numSavedSketches+1; //after the end of the list
+	btnSave.disable();
+}
+
+function updatePrevNextButtonState() {
+
+	//btnPrevious state
+	if (numSavedSketches==0 || currentSketchId < 2) {
 		btnPrevious.disable();
+	} else {
+		btnPrevious.enable();
 	}
 
+	//btnNext state
+	if (numSavedSketches==0 || currentSketchId >= numSavedSketches) {
+		btnNext.disable();
+	} else {
+		btnNext.enable();
+	}
 }
 
-function loadSketch(_curSketch) {
+function loadSketch(sketchId) {
-	curSketch = _curSketch;
 
-	if (curSketch<0) curSketch=0;
+	$.ajax({
-	if (curSketch>sketches.length-1) curSketch=sketches.length-1;
+		url: wifiboxURL + "/sketch/" + sketchId,
-
+		dataType: 'json',
-	var id = sketches[curSketch];
+		type: 'GET',
-
+//			timeout: this.timeoutTime,
-	console.log('sketch: loadSketch curSketch:' + curSketch + ', id: ' + id);
+		success: function(response) {
-
+			if (response.status == 'error' || response.status == 'fail') {
-	$.get(wifiboxURL + "/sketch", {id:id}, function(response) {
+				console.log("loadSketch fail/error: " + response.msg + " -- ", response);
-		if (response.status=='success') {
+			} else {
-			console.log('sketch: loaded',response);
+				console.log("loadSketch success: loaded id #" + response.data.id, response);
-			var svgData = response.data.data;
+				//console.log("sketch content:\n" + response.data.data);
-			loadFromSvg(svgData);
+				if (loadFromSvg(response.data.data)) {
-			setSketchModified(false);
+					setSketchModified(false, true);
-		} else {
+					setCurrentSketchId(response.data.id);
-			console.log('error loading sketch: ',response);
+				}
-			listSketches();
+			}
 		}
-		
+	}).fail(function() {
-	})
+		console.log("loadSketch failed: ", response);
+	});
 }
 
 function saveSketch() {
-	console.log("sketch: saveSketch");
+	svg = saveToSvg();
-	var svgData = saveToSvg();
+	console.log("generated SVG [" + _points.length + " points, " + svg.length + " bytes]:\n" + svg);
-
-	$.post(wifiboxURL + "/sketch", {data: svgData}, function(response) {
-		console.log("sketch: saveSketch: response",response);
-		listSketches();
-	})
 
+	$.ajax({
+		url: wifiboxURL + "/sketch",
+		dataType: 'json',
+		type: 'POST',
+		data: { data: svg },
+		//timeout: this.timeoutTime,
+		success: function(response) {
+			if (response.status == 'error' || response.status == 'fail') {
+				console.log("saveSketch fail/error: " + response.msg + " -- ", response);
+			} else {
+				console.log("saveSketch success: saved with id #" + response.data.id, response);
+				setSketchModified(false, true);
+				numSavedSketches = response.data.id;
+				setCurrentSketchId(response.data.id);
+			}
+		}
+	}).fail(function() {
+		console.log("saveSketch failed: ", response);
+	});
+}
+
+function prevDoodle(e) {
+  console.log("f:prevDoodle(): " + currentSketchId + " / " + numSavedSketches);
+  //alert('prev ' + numSavedSketches);
+  //return;
+
+  //TODO: if (enabled) {
+	  var sketchId = (currentSketchId > 0) ? currentSketchId : numSavedSketches;
+	  if (sketchId > 1) sketchId--;
+
+
+	  //alert(sketchId);
+
+	  loadSketch(sketchId);
+  //}
+}
+
+function nextDoodle(e) {
+  console.log("f:nextDoodle()");
+  //alert('next ' + numSavedSketches);
+  //return;
+
+  //TODO: if (enabled) {
+	  var sketchId = (currentSketchId > 0) ? currentSketchId : numSavedSketches;
+	  if (sketchId < numSavedSketches) sketchId++;
+	  loadSketch(sketchId);
+  //}
 }

less/404.less

@@ -6,35 +6,9 @@
 		position: absolute;
 		top: 50%;
 		left: 50%;
-		height: 200px;
+		height: 250px;
-		width: 30em;
+		width: 500px;
-		margin: -85px 0px 0px -16em;
+		margin: -125px 0 0 -250px;
-		
-		background-color: #FCFCFC;
-		padding: 0px 1em;
-	}
-}
-@media screen and (max-width: 485px) {
-	#page404 {
-		overflow-y: auto;
-		#message404 {
-			position: relative;	
-			left: 0px;
-			top: 0px;
-			margin: 10% 0;
-			padding: 0;
-			width: 100%;
-			height: auto;
-			p, ul {
-				margin: 1em;
-			}
-		}
-		#landscape {
-			box-shadow: none;
-			.bgContainer {
-				display: none;
-			}
-		}
 	}
 }
 

less/base.less

@@ -47,20 +47,18 @@ body {
   left: 0px;
   //z-index: -5;
 }
+
 #bgTop {
   top: 0px;
 }
+
 #bgMiddle {
   top: 30%;
 }
+
 #bgBottom {
   bottom: 0px;
 }
-@media  only screen and (max-height: 700px) {
-  #bgMiddle {
-  	display: none;
-  }
-}
 
 @import "base_centerpanel.less";
 @import "base_leftpanel.less";

less/base_centerpanel.less

@@ -57,7 +57,6 @@
   left: 0;
   width: 78%;
   height: 100%;
-  text-align: center;
 }
 
 #mycanvas {
@@ -128,24 +127,4 @@
 
 }
 
-#mycanvas {
-  position: absolute;
-  left: 0px;
-  top: 0px;
-}
-#imgGuide {
-  // z-index: -1000;
-  // position: absolute;
-  // -webkit-filter: contrast(400%);   
-  //-webkit-filter: brightness(100%);
-  // opacity: 50%;
-  opacity: 0.4;
-  filter: alpha(opacity=40);
-  pointer-events:none;
-  
-  max-width: 100%;
-  max-height: 100%;
-  height: auto;
-  margin-left: auto;
-}
 

less/buttons.less

@@ -130,16 +130,6 @@
   left: 4px;
   position: absolute;
 }
-
-#btnCloseScan {
-  top: 4px;
-  right: 8px;
-  position: absolute; 
-  display: none;
-  opacity: 0.7;
-  filter: alpha(opacity=70);
-}
-
 #buttonGroupEdit {
   position: absolute;
   top: 5px;
@@ -173,10 +163,10 @@
   margin-top: -60%;
   margin-left: 70%;
   width: 200%;
-  max-width: 240px;    /*fixme: can this grow based on it's content?*/ 
+  max-width: 140px;    /*fixme: can this grow based on it's content?*/ 
   padding: 5% 0 5% 5%;
-  #btnWordArt, #btnShape, #btnScan {
+  #btnWordArt, #btnShape {
-    width: 30%;
+    width: 45%;
   }
 }
 

less/popup.less

@@ -47,21 +47,6 @@
 	}
 }
 
-#popupScan {
-  width: 330px;
-	height:210px;
-	margin-left: -165px;
-	margin-top: -105px;
-	
-	input[type="file"] {
-		width: 98%;
-	}
-	#btnScanOk {
-		float: right;
-		margin: 15px 0 0 0;
-	}
-}
-
 #popupShape {
 	width: 310px;
 	margin-left: -155px;

less/settingsPopup.less

@@ -3,16 +3,6 @@
   SETTINGS POPUP
 
 */
-.warn-box {
-  color: #bb0;
-  border: 1px solid #bb0;
-  width: 99%;
-  border-radius: 5px;
-  margin: 7px 0;
-  padding: 2px;
-  display: none;
-}
-
 #popupSettings {
   top: 0;
   left: 0;

license-spec.lua

@@ -1,10 +1,8 @@
 local M = {
-	BASE_PATH = 'js',
+	BASE_PATH = 'js_src',
 	EXCLUDE_FILES = {},
 	PROCESS_FILES = {
-		['js/[^/]*%.js'] = 'cstyle',
+		['js_src/[^/]*%.js'] = 'cstyle'
-		['js/api/[^/]*%.js'] = 'cstyle',
-		['js/settings/[^/]*%.js'] = 'cstyle'
 	},
 	IGNORE_GIT_CHANGED = false
 }

package.json

@@ -9,7 +9,7 @@
   "author": "Peter Uithoven, Adriaan Wormgoor, Rick Companje, Wouter Reckman",
   "readmeFilename": "README.md",
   "devDependencies": {
-    "grunt": "~0.4.5",
+    "grunt": "~0.4.1",
     "grunt-cli": "~0.1.9",
     "grunt-contrib-less": "~0.7.0",
     "grunt-contrib-watch": "~0.5.3",
@@ -17,11 +17,6 @@
     "grunt-contrib-jshint": "~0.6.4",
     "grunt-autoprefixer": "~0.4.0",
     "grunt-contrib-cssmin": "~0.6.2",
-    "grunt-contrib-concat": "~0.3.0",
+    "grunt-contrib-concat": "~0.3.0"
-    "grunt-gitinfo": "~0.1.7",
-    "grunt-template": "~0.2.3"
-  },
-  "scripts": {
-    "start": "grunt"
   }
 }

www/404.html

@@ -1,30 +0,0 @@
-<div id="landscape" class="clearfix">
-
-  <!-- background images -->
-  <div class="bgContainer">
-    <img id="bgTop"    src="img/bg_top.png" />
-    <img id="bgMiddle" src="img/bg_middle.png" />
-    <img id="bgBottom" src="img/bg_bottom.png" />
-  </div>
-
-  <!-- center panel -->
-  <div id="centerpanel">
-    <div id="logopanel" class="btn">
-      <img id="pencil" src="img/logo/pencil.png"/>
-      <img id="logo" src="img/logo/doodle3d.png"/>
-    </div>
-  </div>
-  <div id="message404">
-    <p>
-    	You're probably trying to go to a website on the internet, but you're currently only connected to the Doodle3D WiFi box, which means you're not connected to the internet.<br/>
-    	You could:
-    	<ul>
-    		<li>Reconnect to the WiFi you normally use.</li>
-    	  	<li>Configure the WiFi box to connect to that WiFi in client mode. You can do this trough the settings screen.</li>
-    	</ul>
-    </p>
-  </div>
-</div>
-<div id="portrait">
-  <img id="vertImage" src="img/bg_vertical.png"/>
-</div>

www/css/settings.css

@@ -17,7 +17,6 @@ body,th,td {
 	/*min-width: 370px;*/
 	width: 100%;
 	height: 100%;
-	overflow: scroll;
 }
 /*form#settingsForm {*/
 /*width: 100% auto;*/
@@ -76,10 +75,6 @@ form fieldset.collapsed legend {
 		center left;
 }
 
-#debugPanel label {
-	min-width: 59px;
-}
-
 form label {
 	min-width: 150px;
 	display: block;

www/filemanager/css/style.css

@@ -1,49 +0,0 @@
-body {
-  font-family: Helvetica, Abel, Arial;
-  font-size: 1em;
-
-  -webkit-user-select: none; /* webkit (safari, chrome) browsers */
-  -moz-user-select: none; /* mozilla browsers */
-  -khtml-user-select: none; /* webkit (konqueror) browsers */
-  -ms-user-select: none; /* IE10+ */
-}
-
-button {
-  font-size: 1em;
-}
-
-div.item {
-  width:150px;
-  height:130px;
-  border:1px solid black;
-  display: inline-block;
-  overflow: hidden;
-  background-color: white;
-  margin-right: 5px;
-}
-
-div.item.selected {
-  background-color: #7cf;
-}
-
-div.item input[type='checkbox'] {
-  position: absolute;
-}
-
-#frmUpload {
-  display: inline;
-}
-
-input[type='file'] {
-  width: 1px;
-  opacity:0    
-}
-
-#txtInfo {
-  float: right;
-  /*display: inline-block;*/
-}
-
-img#logo {
-  cursor: pointer;
-}

www/filemanager/index.html

@@ -1,30 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <title>Doodle3D</title>
-  <link href="css/style.css" rel="stylesheet" media="screen">
-</head>
-<body>
-
-<img id="logo" src="../img/logo/doodle3d.png" height="25">
-<hr>
-<button id="btnSelectAll">Select all</button>
-<button id="btnDeselectAll">Deselect all</button>
-<button id="btnDelete">Delete</button>
-<button id="btnDownload">Download</button> <!-- <a id="link" href="#">Download</a> -->
-
-<form id="frmUpload"><button id="btnUpload">Upload</button><input id="uploads" type="file" accept="image/svg+xml" multiple/></form>
-
-<span id="txtInfo"></span>
-
-<hr>
-<form>
-<div id="svgContainer"></div>
-</form>
-
-<script src="../js/libs/jquery-1-9-1.min.js"></script>
-<script src="js/main.js"></script>
-
-
-</body>
-</html>

www/filemanager/js/main.js

@@ -1,267 +0,0 @@
-/*
- * This file is part of the Doodle3D project (http://doodle3d.com).
- *
- * Copyright (c) 2014, Doodle3D
- * This software is licensed under the terms of the GNU GPL v2 or later.
- * See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
- */
-
-// http://stackoverflow.com/questions/1403888/get-url-parameter-with-jquery
-function getURLParameter(name) {
-  return decodeURI((new RegExp('[&?]'+name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]);
-}
-
-var wifiboxURL = "";
-
-if (getURLParameter("r") != "null") wifiboxURL = 'http://192.168.5.1';
-if (getURLParameter("wifiboxURL") != "null") wifiboxURL = getURLParameter("wifiboxURL");
-
-var api = wifiboxURL+'/d3dapi/sketch/';
-
-$("#logo").click(onLogoClick)
-$("#btnDelete").click(deleteSelectedSketches);
-$("#btnSelectAll").click(selectAll);
-$("#btnDeselectAll").click(deselectAll);
-$("#uploads").change(upload);
-$("#btnDownload").click(download);
-
-$("#btnUpload").click(function(e) {
-  e.preventDefault();
-  $("#uploads").trigger('click');
-});
-
-var isBusy = true;
-
-updateButtonStates();
-
-$.get(api+'list', function(data) { //?id=00003
-
-  if (data.status=='success') {
-    var list = data.data.list;
-    // list.reverse();
-
-    isBusy = true;
-    updateButtonStates();
-    updateStatusMessage('loading '+list.length+' sketches...');
-
-    loadSketch(list, function() {
-      console.log('done');
-      isBusy = false;
-      updateFreeSpace();
-      updateButtonStates();
-    });
-
-  } else {
-    console.log('failure',data)
-  }
-
-}).fail(function(status) {
-  alert("Error ("+status.status+") connecting to "+api+'list');
-  console.log(status);
-});
-
-function onLogoClick() {
-  location.href='/'+location.search;
-}
-
-function loadSketch(list,cb) {
-  var id = list.pop();
-  
-  $.get(api+'?id='+id, function(data) {
-
-    if (data.status=='success') {
-      addItem(id,data.data.data);
-    }
-
-    updateStatusMessage('loading '+list.length+' sketches...');
-
-    if (list.length>0) {
-      loadSketch(list,function() {
-        cb();
-      })
-    } else {
-      cb();
-    }
-  });
-}
-
-function addItem(id,svgData,doPrepend) {
-  var path;
-
-  if (!svgData) path = "";
-  else if (typeof(svgData)!='string') path = "";
-  else if (svgData.indexOf("CDATA")==-1) path = "";
-  else path = svgData.split('d="')[1].split('"')[0]; 
-
-  var item = $('<div class="item" data="'+id+'" title="'+id+'">');
-  var svg = '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 640 540"><path fill="none" stroke="black" stroke-width="2" d="'+path+'"></path></svg>';
-  
-  item.click(function() {
-    $(this).toggleClass('selected');
-    console.log($(this).attr("data"));
-    updateButtonStates();
-  })
-  item.append(svg);
-
-  if (doPrepend) $('#svgContainer').prepend(item);
-  else $('#svgContainer').append(item);
-  item.hide().fadeIn();
-
-  updateButtonStates();
-}
-
-function deleteSketches(list,cb) {
-  var id = list.pop();
-  
-  $.post(api+'delete', {id:id}, function(data) {
-
-    $('.item[data='+id+']').fadeOut('slow',function() {
-      $(this).remove(); //remove when effect is finished
-    });
-
-    updateStatusMessage("Deleting " + list.length + ' sketches...');
-
-    if (list.length>0) {
-      deleteSketches(list,cb);
-    } else {
-      cb();
-    }
-
-  });
-}
-
-function deleteSelectedSketches() {
-  if (confirm('Do you want to delete '+$('.item.selected').length+' drawings?')) {
-
-    var ids = [];
-    $('.item.selected').map(function(){
-      ids.push($(this).attr('data'));
-    });
-
-    isBusy = true;
-    updateButtonStates();
-
-    deleteSketches(ids,function() {
-      console.log('done deleting sketches');
-      isBusy = false;
-      updateButtonStates();
-      updateFreeSpace();
-    });
-
-    deselectAll();
-    updateButtonStates();
-  }
-}
-
-function selectAll() {
-  $('.item').addClass('selected');
-  updateButtonStates();
-}
-
-function deselectAll() {
-  $('.item').removeClass('selected');
-  updateButtonStates();
-}
-
-function updateButtonStates() {
-  var numItems = $('.item').length;
-  var numSelected = $('.item.selected').length;
-  var noSelection = numSelected==0;
-
-  $("#btnDelete").attr("disabled",isBusy || noSelection);
-  $("#btnDownload").attr("disabled",isBusy || noSelection);
-  $("#btnDeselectAll").attr("disabled",isBusy || noSelection);
-  $("#btnSelectAll").attr("disabled",isBusy || numItems==0);
-  $("#btnUpload").attr("disabled",isBusy || !noSelection);
-  $("#btnDelete").text("Delete" + (noSelection ? "" :  " ("+numSelected+")"));
-  $("#btnDownload").text("Download" + (noSelection ? "" :  " ("+numSelected+")"));
-}
-
-function uploadFile(files, index, next) {
-  var reader = new FileReader();
-  reader.readAsText(files[index], "UTF-8");
-  reader.onload = function (evt) {
-    console.log("onload",index); //,files[index],evt.target);
-
-    //process file
-    var svg = convertSvg(evt.target.result);
-
-    $.post(api, {data:svg}, function(data) {
-      if (data.status=='success') {
-        var id = data.data.id;
-        addItem(id,svg,true);
-
-        updateStatusMessage('uploading '+(files.length-index)+' sketches...');
-
-        if (index<files.length-1) {
-          uploadFile(files, index+1, next);
-        } else {
-          next(); //no more files, call back
-        }
-      }
-    });
-
-  }
-
-  reader.onerror = function (evt) {
-    console.log("onerror");
-    next(); //stop processing file(s), call back/
-  }
-}
-
-function upload() {
-  var files = $("#uploads")[0].files
-  var reader = new FileReader();
-  var cur = 0;
-  isBusy = true;
-  updateButtonStates();
-  updateStatusMessage("Uploading " + files.length + " files");
-
-  uploadFile(files, cur, function() {
-    console.log("done");
-    isBusy = false;
-    updateButtonStates();
-    updateFreeSpace();
-    $("#frmUpload")[0].reset();
-  })
-}
-
-function updateFreeSpace() {
-  $.get(api+'status', function(data) { //?id=00003
-    if (data.status=='success') {
-      var numSketches = data.data.number_of_sketches;
-      var freeKb = Math.round(data.data.available/1024);
-      updateStatusMessage(numSketches+" sketches, "+freeKb+"k bytes free");
-    }
-  });
-}
-
-function updateStatusMessage(msg) {
-  $("#txtInfo").text(msg);
-}
-
-function convertSvg(svg) {
-  if (!svg) return "";
-  if (typeof(svg)!='string') return "";
-  if (svg.indexOf("CDATA")>-1) return svg; //assume this SVG is already ok
-
-  //this fixes SVG's created by the kunstcentraal app
-  var re = /([a-zA-Z])\s?([0-9]{1,}) ([0-9]{1,})/g;
-  svg = svg.replace(re,"$1$2,$3");
-  re = /<\/svg>/g;
-  svg = svg.replace(re,"<!--<![CDATA[d3d-keys {\"height\":5,\"outlineShape\":\"none\",\"twist\":0}]]>-->\n</svg>");
-
-  svg = svg.replace("M0,0 ",""); //RC: hack
-
-  return svg;
-}
-
-function download() {
-  $('.item.selected').each(function() {
-    var id = $(this).attr('data');
-    var svgData = $(this).html();
-    console.log('downloading',id);
-    $('<a target="_blank" href="data:image/svg+xml,'+encodeURIComponent(svgData)+'" download="'+id+'.svg">')[0].click();
-  });
-}
-

www/helpcontent.html

@@ -22,7 +22,7 @@
   </li>
   <li data-id="btnsPrevNext" data-button="Next" data-options="tipLocation:right;tipAdjustmentY:-25">
     <h2>View saved doodles</h2>
-    <p>Use the buttons '&lt;' and '&gt;' to flip through all the saved doodles on your Wi-Fi box.</p>
+    <p>Use the buttons '<' and '>' to flip through all the saved doodles on your Wi-Fi box.</p>
   </li>
   <li data-id="btnOops" data-button="Next" data-options="tipLocation:right">
     <h2>Oops</h2>

www/index.html

@@ -40,7 +40,6 @@
     <div id="buttonGroupAdd" class="buttonGroup">
       <img id="btnWordArt" class="btn" src="img/buttons/btnWordArt.png" />
       <img id="btnShape" class="btn" src="img/buttons/btnShape.png" />
-      <img id="btnScan" class="btn" src="img/buttons/btnGuide.png" />
     </div>
 
   </div>
@@ -76,12 +75,10 @@
     </div>
 
     <div id="drawareacontainer">
-      <div id="canvasContainers">
 
+      <div id="canvasContainers">
         <div id="mycanvasContainer">
-          <img id="imgGuide">
           <canvas id="mycanvas"></canvas>
-          <img id="btnCloseScan" class="btn" src="img/buttons/btnClose.png" />
         </div>
 
         <div id="previewContainer">
@@ -129,15 +126,6 @@
     </div>
   </div>
 
-  <div class="popup" id="popupScan">
-    <div class="content">
-      <h1>Use photo as a guide</h1>
-      <input id="fileScan" type="file"/>
-      <!-- <input id="txtDummy" type="text"/> -->
-      <img id="btnScanOk" class="btn" src="img/buttons/btnOk.png">
-    </div>
-  </div>
-
   <div class="popup" id="popupShape">
     <div class="content">
       <h1>Add a new shape</h1>

www/redirect.html

@@ -1,29 +1,50 @@
 <!DOCTYPE html>
 <html>
 <head>
-  <title>Success</title>
+  <title>Doodle3D 404</title>
-
 
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   <meta name="apple-mobile-web-app-capable" content="yes" />
   <meta name="apple-mobile-web-app-status-bar-style" content="black" />
-  <meta name="mobile-web-app-capable" content="yes" />
+  <link rel="icon" type="image/ico" href="favicon_alt.ico"/>
-  <meta id="Viewport" name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui">
+  <link href="./img/webpage_icons/apple-touch-icon-144x144-precomposed.png" rel="apple-touch-icon-precomposed" sizes="144x144" />
-
+  <meta id="Viewport" name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
-  <link rel="icon" type="image/ico" href="./favicon_alt.ico"/>
-  <link rel="apple-touch-icon-precomposed" href="./img/webpage_icons/apple-touch-icon-144x144-precomposed.png"/>
-  <link rel="apple-touch-icon-precomposed" href="./img/webpage_icons/apple-touch-icon-144x144-precomposed.png" sizes="144x144" />
 
   <link href="css/styles.min.css" rel="stylesheet" media="screen">
   <link href="css/debug.min.css" rel="stylesheet" media="screen">
   
 </head>
 <body id="page404">
-Success
+
-  <script src="js/libs/jquery-1-9-1.min.js"></script>
+<div id="landscape" class="clearfix">
-  <script>
+
-    $(document.body).load("404.html");
+  <!-- background images -->
-    document.title = "Doodle3D 404"
+  <div class="bgContainer">
-  </script>
+    <img class="bgTop"    src="img/bg_top.png" />
+    <img class="bgMiddle" src="img/bg_middle.png" />
+    <img class="bgBottom" src="img/bg_bottom.png" />
+  </div>
+
+  <!-- center panel -->
+  <div class="centerpanel">
+    <div class="logopanel">
+      <div class="d3dlogo" onclick="location.reload()"></div>
+    </div>
+  </div>
+  <div id="message404">
+    <p>
+    	You're probably trying to go to a website on the internet, but you're currently only connected to the Doodle3D WiFi box, which means you're not connected to the internet.<br/>
+    	You could:
+    	<ul>
+    		<li>Reconnect to the WiFi you normally use.</li>
+    	  	<li>Configure the WiFi box to connect to that WiFi in client mode. You can do this trough the settings screen.</li>
+    	</ul>
+    </p>
+  </div>
+</div>
+<div id="portrait">
+  <img class="vertImage" src="img/bg_vertical.png"/>
+</div>
+
 </body>
 </html>

www/settings.html

@@ -60,7 +60,6 @@
       <label for="printerDimensionsZ"></label>
       z:<input id="printerDimensionsZ" type="number" class="small" name="printer.dimensions.z" placeholder="z">mm<br>
       <label for="heatedBed">Heated bed:</label><input id="heatedBed" type="checkbox" name="printer.heatedbed" value="heatedbed"><br>
-      <label for="filamentThickness">Filament thickness:</label><input id="filamentThickness" step="0.01" type="number" class="small" name="printer.filamentThickness">mm<br>
       <fieldset id="gcodePanel">
  		<legend>GCODE settings</legend>
  		<div>
@@ -92,6 +91,7 @@
       <legend>Print settings</legend>
       <label for="layerHeight">Layer height:</label><input id="layerHeight" type="number" step="0.01" class="small" name="printer.layerHeight">mm<br>
       <label for="wallThickness">Wall thickness:</label><input id="wallThickness" type="number" step="0.1" class="small" name="printer.wallThickness">mm<br>
+      <label for="filamentThickness">Filament thickness:</label><input id="filamentThickness" step="0.01" type="number" class="small" name="printer.filamentThickness">mm<br>
       <label for="temperature">Temperature:</label><input id="temperature" type="number" class="small" name="printer.temperature">degrees C<br>
       <label for="bedTemperature">Bed temperature:</label><input id="bedTemperature" type="number" class="small" name="printer.bed.temperature">degrees C<br>
       <br>
@@ -99,7 +99,6 @@
       <label for="bottomLayerSpeed">Bottom layer speed:</label><input id="bottomLayerSpeed" type="number" name="printer.bottomLayerSpeed" class="small">mm/s<br>
       <label for="travelSpeed">Travel speed:</label><input id="travelSpeed" type="number" name="printer.travelSpeed" class="small">mm/s<br>
       <label for="enableTraveling">Enable traveling:</label><input id="enableTraveling" type="checkbox" name="printer.enableTraveling" value="enableTraveling"><br>
-      <label for="bottomEnableTraveling">Bottom layers traveling:</label><input id="bottomEnableTraveling" type="checkbox" name="printer.bottomEnableTraveling" value="bottomEnableTraveling"><br>
       <label for="firstLayerSlow">Bottom layers slow:</label><input id="firstLayerSlow" type="checkbox" name="printer.firstLayerSlow" value="firstLayerSlow"><br>
       <label for="bottomFlowRate">Bottom layers flow rate*:</label><input id="bottomFlowRate" type="number" name="printer.bottomFlowRate" class="small"><br>
       <small>* Multiplier for extrusion rate in first few layers</small>
@@ -174,36 +173,14 @@
         <small id="updateInfo"></small>
  	</fieldset>
 
-  <fieldset id="extraPanel">
+    <fieldset id="debugPanel">
-    <legend>Sketches</legend>
+ 		<legend>Debug</legend>
-    <input type="button" onclick="settingsWindow.openFileManager()" name="btnFileMgr" value="Open FileManager" class="button" id="btnFileMgr"/>
+ 		<input type="button" onclick="settingsWindow.downloadlogs()" name="downloadlogs" value="Download logs" class="button" id="downloadlogs"/>
     <input type="button" onclick="settingsWindow.downloadGcode()" name="downloadGcode" value="Download GCODE" class="button" id="downloadGcode"/>
     <input type="button" onclick="settingsWindow.downloadSvg()" name="downloadSvg" value="Download SVG" class="button" id="downloadSvg"/>
-  </fieldset>
+    </fieldset>
 
-  <fieldset id="debugPanel">
+    <fieldset id="restorePanel">
- 		<legend>Debug</legend>
- 		<label for="logLevel">Log level:</label>
-		<select id="logLevel" name="system.log.level" onchange="settingsWindow.logLevelChanged()">
-			<option value="" disabled="disabled" selected="selected">Please choose a log level</option>
-			<option value="quiet">Quiet</option>
-			<option value="error">Error</option>
-			<option value="warning">Warning</option>
-			<option value="info">Info</option>
-			<option value="verbose">Verbose</option>
-			<option value="bulk">Bulk</option>
- 		</select><br/>
- 		<div id="logging-restart-warning" class="warn-box">
-  			Restart the wifibox for the new log level to take effect.
-  		</div>
-  		<div id="logging-verbose-warning" class="warn-box">
-  			<em>Be careful</em>: when setting a log level higher than info, the Wifibox may quickly run out of memory, causing crashes and other unwanted behaviour.
-  		</div>
- 		<br/>
- 		<input type="button" onclick="settingsWindow.downloadlogs()" name="downloadlogs" value="Download logs" class="button" id="downloadlogs"/>
-  </fieldset>
-  
-  <fieldset id="restorePanel">
  		<legend>Restore</legend>
  		<input type="button" name="restoresettings" value="Restore settings to defaults" class="button" id="restoreSettings"/>
  		<span id="restoreState"></span>