Added shake movements on errors for better visual feedback, closing #5
This commit is contained in:
parent
0c4bb7e127
commit
bda3384ad7
|
@ -22,6 +22,8 @@ $(document).ready(function() {
|
||||||
saveData(function(id) {
|
saveData(function(id) {
|
||||||
location.assign("edit-master.php#" + id);
|
location.assign("edit-master.php#" + id);
|
||||||
});
|
});
|
||||||
|
} else {
|
||||||
|
shake($('#zone-button-add'));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -75,3 +77,19 @@ function saveData(callback) {
|
||||||
"json"
|
"json"
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function shake(element){
|
||||||
|
var interval = 50;
|
||||||
|
var distance = 5;
|
||||||
|
var times = 6;
|
||||||
|
|
||||||
|
$(element).css('position','relative');
|
||||||
|
|
||||||
|
for(var iter=0;iter<(times+1);iter++){
|
||||||
|
$(element).animate({
|
||||||
|
left:((iter%2===0 ? distance : distance*-1))
|
||||||
|
},interval);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(element).animate({ left: 0},interval);
|
||||||
|
}
|
|
@ -36,6 +36,8 @@ $(document).ready(function() {
|
||||||
if(validateSoaData()) {
|
if(validateSoaData()) {
|
||||||
saveSoaData();
|
saveSoaData();
|
||||||
$('#soa button[type=submit]').prop("disabled", true);
|
$('#soa button[type=submit]').prop("disabled", true);
|
||||||
|
} else {
|
||||||
|
shake($('#soa button[type=submit]'));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -273,6 +275,7 @@ function saveRecord() {
|
||||||
var tableRow = $(this).parent().parent();
|
var tableRow = $(this).parent().parent();
|
||||||
|
|
||||||
if(!validateLine.call(this)) {
|
if(!validateLine.call(this)) {
|
||||||
|
shake($(this));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -324,6 +327,7 @@ function saveRecord() {
|
||||||
|
|
||||||
function addRecord() {
|
function addRecord() {
|
||||||
if(!validateLine.call(this)) {
|
if(!validateLine.call(this)) {
|
||||||
|
shake($('#addButton'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -451,3 +455,19 @@ function remoteClicked() {
|
||||||
var recordId = $(this).parent().siblings().eq(0).text();
|
var recordId = $(this).parent().siblings().eq(0).text();
|
||||||
location.assign("edit-remote.php#" + recordId);
|
location.assign("edit-remote.php#" + recordId);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function shake(element){
|
||||||
|
var interval = 50;
|
||||||
|
var distance = 5;
|
||||||
|
var times = 6;
|
||||||
|
|
||||||
|
$(element).css('position','relative');
|
||||||
|
|
||||||
|
for(var iter=0;iter<(times+1);iter++){
|
||||||
|
$(element).animate({
|
||||||
|
left:((iter%2===0 ? distance : distance*-1))
|
||||||
|
},interval);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(element).animate({ left: 0},interval);
|
||||||
|
}
|
|
@ -103,6 +103,7 @@ function resetFields() {
|
||||||
function addPassword() {
|
function addPassword() {
|
||||||
if($('#data-password-password').val() != $('#data-password-password2').val() || $('#data-password-password').val().length <= 0) {
|
if($('#data-password-password').val() != $('#data-password-password2').val() || $('#data-password-password').val().length <= 0) {
|
||||||
$('#data-password-password2').parent().addClass("has-error");
|
$('#data-password-password2').parent().addClass("has-error");
|
||||||
|
shake($('#data-password-confirm'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -128,6 +129,7 @@ function addPassword() {
|
||||||
function addKey() {
|
function addKey() {
|
||||||
if($('#data-key-key').val().length <= 0) {
|
if($('#data-key-key').val().length <= 0) {
|
||||||
$('#data-key-key').parent().addClass("has-error");
|
$('#data-key-key').parent().addClass("has-error");
|
||||||
|
shake($('#data-key-confirm'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -266,3 +268,19 @@ function changeKey() {
|
||||||
"json"
|
"json"
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function shake(element){
|
||||||
|
var interval = 50;
|
||||||
|
var distance = 5;
|
||||||
|
var times = 6;
|
||||||
|
|
||||||
|
$(element).css('position','relative');
|
||||||
|
|
||||||
|
for(var iter=0;iter<(times+1);iter++){
|
||||||
|
$(element).animate({
|
||||||
|
left:((iter%2===0 ? distance : distance*-1))
|
||||||
|
},interval);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(element).animate({ left: 0},interval);
|
||||||
|
}
|
|
@ -99,12 +99,15 @@ function addUser() {
|
||||||
if($('#user-password').val().length <= 0) {
|
if($('#user-password').val().length <= 0) {
|
||||||
$('#user-password').parent().addClass("has-error");
|
$('#user-password').parent().addClass("has-error");
|
||||||
$('#user-password2').parent().addClass("has-error");
|
$('#user-password2').parent().addClass("has-error");
|
||||||
|
shake($('#user-button-add'));
|
||||||
}
|
}
|
||||||
|
|
||||||
if($('#user-name').parent().hasClass("has-error")) {
|
if($('#user-name').parent().hasClass("has-error")) {
|
||||||
|
shake($('#user-button-add'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if($('#user-password2').parent().hasClass("has-error")) {
|
if($('#user-password2').parent().hasClass("has-error")) {
|
||||||
|
shake($('#user-button-add'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -146,6 +149,16 @@ function getUserData() {
|
||||||
}
|
}
|
||||||
|
|
||||||
function saveUserChanges() {
|
function saveUserChanges() {
|
||||||
|
|
||||||
|
if($('#user-name').parent().hasClass("has-error")) {
|
||||||
|
shake($('#user-button-add'));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if($('#user-password2').parent().hasClass("has-error")) {
|
||||||
|
shake($('#user-button-add'));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
var data = {
|
var data = {
|
||||||
id: location.hash.substring(1),
|
id: location.hash.substring(1),
|
||||||
name: $('#user-name').val(),
|
name: $('#user-name').val(),
|
||||||
|
@ -234,3 +247,19 @@ function addPermissions() {
|
||||||
"json"
|
"json"
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function shake(element){
|
||||||
|
var interval = 50;
|
||||||
|
var distance = 5;
|
||||||
|
var times = 6;
|
||||||
|
|
||||||
|
$(element).css('position','relative');
|
||||||
|
|
||||||
|
for(var iter=0;iter<(times+1);iter++){
|
||||||
|
$(element).animate({
|
||||||
|
left:((iter%2===0 ? distance : distance*-1))
|
||||||
|
},interval);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(element).animate({ left: 0},interval);
|
||||||
|
}
|
|
@ -41,6 +41,7 @@ function savePassword() {
|
||||||
$('#user-password2').parent().addClass("has-error");
|
$('#user-password2').parent().addClass("has-error");
|
||||||
}
|
}
|
||||||
if($('#user-password2').parent().hasClass("has-error")) {
|
if($('#user-password2').parent().hasClass("has-error")) {
|
||||||
|
shake($('#saveChanges'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -61,3 +62,18 @@ function savePassword() {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function shake(element){
|
||||||
|
var interval = 50;
|
||||||
|
var distance = 5;
|
||||||
|
var times = 6;
|
||||||
|
|
||||||
|
$(element).css('position','relative');
|
||||||
|
|
||||||
|
for(var iter=0;iter<(times+1);iter++){
|
||||||
|
$(element).animate({
|
||||||
|
left:((iter%2===0 ? distance : distance*-1))
|
||||||
|
},interval);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(element).animate({ left: 0},interval);
|
||||||
|
}
|
Loading…
Reference in a new issue