vmario
/
doodle3d-client
mirror of https://github.com/Doodle3D/doodle3d-client.git
0
0
Fork 0
Code Issues Releases Wiki Activity

Save settings before connect to network / create access point and display validation errors and only close settings when settings are saved

This commit is contained in:
peteruithoven 2013-10-17 14:09:09 +02:00
parent b2191217cb
commit 53e8ccc294
2 changed files with 117 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
css/settings.css
View File

@ -93,4 +93,12 @@ form .button {
form #passwordLabel, form #password {
display: none;
}
form input.error, form textarea.error, form select.error {
border: #f00 solid 2px;
}
form .errorMsg {
color: #f00;
margin: 0 0 0 1em;
}

189
js/SettingsWindow.js
View File

@ -113,8 +113,9 @@ function SettingsWindow() {
this.submitwindow = function(e) {
e.preventDefault();
e.stopPropagation();
self.saveSettings();
self.hideSettings();
self.saveSettings(self.readForm(),function(){
self.hideSettings();
});
clearTimeout(self.retryRetrieveNetworkStatusDelay);
}
@ -162,45 +163,6 @@ function SettingsWindow() {
this.refreshNetworks();
this.retrieveNetworkStatus(false);
}
this.saveSettings = function(callback) {
console.log("Settings:saveSettings");
this.readForm();
if (communicateWithWifibox) {
$.ajax({
url: this.wifiboxURL + "/config",
type: "POST",
data: settings,
dataType: 'json',
timeout: this.timeoutTime,
success: function(data){
console.log("Settings:saveSettings response: ",data);
if(data.status == "error") {
clearTimeout(self.retrySaveSettingsDelay);
self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings() },self.retryDelay); // retry after delay
} else {
var savedSettings = data.data;
$.each(savedSettings, function(index, val) {
if (val != "ok") {
console.log("ERROR: value '" + index + "' not successfully set. Message: " + val);
}
});
// TODO something like a callback or feedback that saving went well / or failed
if (callback != undefined) {
callback();
}
}
}
}).fail(function() {
console.log("Settings:saveSettings: failed");
clearTimeout(self.retrySaveSettingsDelay);
self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings() },self.retryDelay); // retry after delay
});
}
}
this.fillForm = function() {
console.log("SettingsWindow:fillForm");
@ -232,15 +194,72 @@ function SettingsWindow() {
});
}
this.saveSettings = function(newSettings,complete) {
if (communicateWithWifibox) {
$.ajax({
url: this.wifiboxURL + "/config",
type: "POST",
data: newSettings,
dataType: 'json',
timeout: this.timeoutTime,
success: function(data){
console.log("Settings:saveSettings response: ",data);
if(data.status == "error") {
clearTimeout(self.retrySaveSettingsDelay);
self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings(settings) },self.retryDelay); // retry after delay
} else {
var savedSettings = data.data;
self.clearValidationErrors();
var validated = true;
$.each(savedSettings, function(key, val) {
if (val != "ok") {
console.log("ERROR: setting '" + key + "' not successfully set. Message: " + val);
self.displayValidationError(key,val);
validated = false;
}
});
if(complete && validated) complete();
}
}
}).fail(function() {
console.log("Settings:saveSettings: failed");
clearTimeout(self.retrySaveSettingsDelay);
self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings(settings) },self.retryDelay); // retry after delay
});
}
}
this.displayValidationError = function(key,msg) {
var formElement = self.form.find("[name|='"+key+"']");
console.log("formElement: ",formElement);
formElement.addClass("error");
var errorMsg = "<p class='errorMsg'>"+msg+"</p>"
formElement.after(errorMsg);
}
this.clearValidationErrors = function() {
console.log("clearValidationErrors");
console.log(" remove: ",self.form.find(".errorMsg").remove());
var formElements = self.form.find(".error");
console.log(" formElements: ",formElements);
formElements.each( function(index,element) {
var element = $(element);
console.log(" element: ",element);
element.removeClass("error");
});
}
this.readForm = function() {
console.log("SettingsWindow:readForm");
var selects = this.form.find("select");
//console.log("SettingsWindow:readForm");
var settings = {};
var selects = self.form.find("select");
selects.each( function(index,element) {
var element = $(element);
settings[element.attr('name')] = element.val();
if(element.attr('name') != "network.client.network") {
settings[element.attr('name')] = element.val();
}
});
var inputs = this.form.find("input");
var inputs = self.form.find("input");
inputs.each( function(index,element) {
var element = $(element);
switch(element.attr("type")) {
@ -254,15 +273,15 @@ function SettingsWindow() {
}
});
var textareas = this.form.find("textarea");
var textareas = self.form.find("textarea");
textareas.each( function(index,element) {
var element = $(element);
settings[element.attr('name')] = element.val();
});
console.log(settings);
//console.log(settings);
return settings;
}
/*
* Networks ui
*/
@ -514,26 +533,31 @@ function SettingsWindow() {
this.connectToNetwork = function() {
console.log("connectToNetwork");
if(self.selectedNetwork == undefined) return;
postData = {
var postData = {
ssid:self.selectedNetwork,
phrase:self.form.find("#password").val(),
recreate:true
}
console.log(" postData: ",postData);
if (communicateWithWifibox) {
$.ajax({
url: self.wifiboxCGIBinURL + "/network/associate",
type: "POST",
data: postData,
dataType: 'json',
timeout: self.timeoutTime,
success: function(response){
console.log("Settings:connectToNetwork response: ",response);
}
}).fail(function() {
console.log("Settings:connectToNetwork: timeout (normal behavior)");
//clearTimeout(self.retrySaveSettingsDelay);
//self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings() },self.retryDelay); // retry after delay
// save network related settings and on complete, connect to network
self.saveSettings(self.readForm(),function() {
$.ajax({
url: self.wifiboxCGIBinURL + "/network/associate",
type: "POST",
data: postData,
dataType: 'json',
timeout: self.timeoutTime,
success: function(response){
console.log("Settings:connectToNetwork response: ",response);
}
}).fail(function() {
console.log("Settings:connectToNetwork: timeout (normal behavior)");
//clearTimeout(self.retrySaveSettingsDelay);
//self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings() },self.retryDelay); // retry after delay
});
});
}
self.setClientModeState(SettingsWindow.CONNECTING,"");
@ -545,28 +569,33 @@ function SettingsWindow() {
}
this.createAP = function() {
console.log("createAP");
if (communicateWithWifibox) {
$.ajax({
url: self.wifiboxCGIBinURL + "/network/openap",
type: "POST",
dataType: 'json',
timeout: self.timeoutTime,
success: function(response){
console.log("Settings:createAP response: ",response);
// save network related settings and on complete, create access point
self.saveSettings(self.readForm(),function() {
$.ajax({
url: self.wifiboxCGIBinURL + "/network/openap",
type: "POST",
dataType: 'json',
timeout: self.timeoutTime,
success: function(response){
console.log("Settings:createAP response: ",response);
}
}).fail(function() {
console.log("Settings:createAP: timeout (normal behavior)");
//clearTimeout(self.retrySaveSettingsDelay);
//self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings() },self.retryDelay); // retry after delay
});
self.setAPModeState(SettingsWindow.CREATING_AP,"");
}
}).fail(function() {
console.log("Settings:createAP: timeout (normal behavior)");
//clearTimeout(self.retrySaveSettingsDelay);
//self.retrySaveSettingsDelay = setTimeout(function() { self.saveSettings() },self.retryDelay); // retry after delay
// after switching wifi network or creating a access point we delay the status retrieval
// because the webserver needs time to switch
clearTimeout(self.retrieveNetworkStatusDelay);
self.retrieveNetworkStatusDelay = setTimeout(function() { self.retrieveNetworkStatus(true) },self.retrieveNetworkStatusDelayTime);
});
}
self.setAPModeState(SettingsWindow.CREATING_AP,"");
// after switching wifi network or creating a access point we delay the status retrieval
// because the webserver needs time to switch
clearTimeout(self.retrieveNetworkStatusDelay);
self.retrieveNetworkStatusDelay = setTimeout(function() { self.retrieveNetworkStatus(true) },self.retrieveNetworkStatusDelayTime);
}
}