Refactored PrinterPanel into using FormPanel superclass

js/api/ConfigAPI.js

@@ -40,6 +40,25 @@ function ConfigAPI() {
 			failedHandler();
 		});
 	};
+	this.load = function(targetSettings,completeHandler,failedHandler) {
+			console.log("ConfigAPI:load");
+			$.ajax({
+				url: _wifiboxURL + "/config/",
+				type: "GET",
+				dataType: 'json',
+				data: targetSettings,
+				timeout: _timeoutTime,
+				success: function(response){
+					if(response.status == "error" || response.status == "fail") {
+						failedHandler();
+					} else {
+						completeHandler(response.data);
+					}
+				}
+			}).fail(function() {
+				failedHandler();
+			});
+		};
 	this.save = function(newSettings,completeHandler,failedHandler) {
 		console.log("ConfigAPI:save");
 		$.ajax({

js/settings/FormPanel.js

@@ -17,7 +17,6 @@ function FormPanel() {
 	var _self;
 	
 	FormPanel.prototype.init = function(wifiboxURL,wifiboxCGIBinURL,panelElement) {
-		console.log("FormPanel:init");
 		// make _self the scope of which init was called?
 		// needed to have the subclass instance access the same counter 
 		_self = this; 
@@ -27,7 +26,6 @@ function FormPanel() {
 	
 	//this.readForm = function(form) {
 	FormPanel.prototype.readForm = function(form) {
-		console.log("FormPanel:readForm");
 		if(!form) form = _element; // if no form specified, read whole panel form
 		//console.log("FormPanel");
 		var settings = {};
@@ -62,15 +60,12 @@ function FormPanel() {
 			var elem = $(element);
 			settings[elem.attr('name')] = elem.val();
 		});
-		console.log("  settings: ",settings);
 		return settings;
 	};
 	
-	this.fillForm = function(settings,form) { 
+	FormPanel.prototype.fill = function(settings,form) { 
-		console.log("FormPanel:fillForm");
 		if(!form) form = _element; // if no form specified, fill whole panel form
-		console.log("  settings: ",settings);
+		
-		console.log("  form: ",form);
 		//fill form with loaded settings
 		var selects = form.find("select");
 		selects.each( function(index,element) {
@@ -132,4 +127,8 @@ function FormPanel() {
 		_element.find(".errorMsg").remove();
 		_element.find(".error").removeClass("error");
 	};
+	
+	this.loadSettings = function(targetSettings,complete) {
+		_configAPI.load(targetSettings,complete);
+	};
 }

js/settings/PrinterPanel.js

@@ -6,79 +6,52 @@
  * See file LICENSE.txt or visit http://www.gnu.org/licenses/gpl.html for full license details.
  */
 
+// prototype inheritance 
+// http://robertnyman.com/2008/10/06/javascript-inheritance-how-and-why/
+PrinterPanel.prototype = new FormPanel();
 function PrinterPanel() {
-	this.wifiboxURL;
-	this.element;
-	
-	this.retryDelay 					= 1000; 
-	this.retryDelayer; 									// setTimout instance
-	//this.timeoutTime 					= 3000;
 	
 	this.printerType;
-	this.printerSettingsNames;
 	
-	var self = this;
+	// ui elements
+	var _element;
+	var _printerSelector;
+	var _printerSettings;
+	
+	var _self = this;
 
-	this.init = function(wifiboxURL,element) {
+	this.init = function(wifiboxURL,wifiboxCGIBinURL,panelElement) {
-		self.wifiboxURL = wifiboxURL;
+		console.log("PrinterPanel:init");
-		self.element = element;
+		console.log("  panelElement: ",panelElement);
+		console.log("  _self: ",_self);
+		// super call:
+		_self.constructor.prototype.init.call(_self,wifiboxURL,wifiboxCGIBinURL,panelElement);
 		
-		self.printerSelector 	= element.find("#printerType");
+		_element = panelElement;
-		self.printerSelector.change(self.printerSelectorChanged);
 		
-		var formElements = element.find("[name]");
+		_printerSelector 	= _element.find("#printerType");
-		self.printerSettingsNames = [];
+		_printerSelector.change(_self.printerSelectorChanged);
-		formElements.each( function(index,element) {
-			self.printerSettingsNames.push(element.name);
-		});
 		
-		var gcodePanel = element.find("#gcodePanel");
+		// we use readForm to get all the settings we need to 
+		// reload after changing printer type 
+		_printerSettings = _self.readForm();
+		console.log("  _printerSettings: ",_printerSettings);
+		
+		var gcodePanel = _element.find("#gcodePanel");
 		gcodePanel.coolfieldset({collapsed:true});
 	}
 	this.printerSelectorChanged = function(e) {
-		console.log("PrinterPanel:printerSelectorChanged");
+		//console.log("PrinterPanel:printerSelectorChanged");
-		console.log("self: ", self);
+		_self.printerType = _printerSelector.find("option:selected").val();
-		self.printerType = self.printerSelector.find("option:selected").val();
+		//_self.savePrinterType(self.loadPrinterSettings);
-		self.savePrinterType(self.loadPrinterSettings);
+		var settings = {}; 
-	}
+		settings[_printerSelector.attr("name")] = _self.printerType;
-	
+		
-	this.savePrinterType = function(complete) {
+		_self.saveSettings(settings,function(validated) {
-		console.log("PrinterPanel:savePrinterType");
+			if(!validated) return;
-		var postData = {}; 
+			_self.loadSettings(_printerSettings,function(settings) {
-		postData[self.printerSelector.attr("name")] = self.printerType;
+				_self.fill(settings);
-		console.log("postData: ",postData);
+			});
-		$.ajax({
-			url: self.wifiboxURL + "/config/",
-			type: "POST",
-			dataType: 'json',
-			data: postData,
-			success: function(response){
-				console.log("PrinterPanel:savePrinterType response: ",response);
-				if(complete) complete();
-			}
-		}).fail(function() {
-			console.log("PrinterPanel:savePrinterType: failed");
-		});
-	}
-	this.loadPrinterSettings = function() {
-		console.log("PrinterPanel:loadPrinterSettings");
-		console.log("  self.printerSettingsNames: ",self.printerSettingsNames);
-		var getData = {}; 
-		$.each(self.printerSettingsNames, function(key, val) {
-			getData[val] = "";
-		});
-		console.log("getData: ",getData);
-		$.ajax({
-			url: self.wifiboxURL + "/config/",
-			dataType: 'json',
-			data: getData,
-			success: function(response){
-				console.log("PrinterPanel:loadPrinterSettings response: ",response);
-				
-				self.fillForm(response.data,self.element);
-			}
-		}).fail(function() {
-			console.log("PrinterPanel:loadPrinterSettings: failed");
 		});
 	}
 }

js/settings/SettingsWindow.js

@@ -93,7 +93,7 @@ function SettingsWindow() {
 
 					// printer panel
 					var $printerPanelElement = self.form.find("#printerPanel");
-					self.printerPanel.init(wifiboxURL,$printerPanelElement);
+					self.printerPanel.init(wifiboxURL,wifiboxCGIBinURL,$printerPanelElement);
 					self.printerPanel.fillForm = self.fillForm;