beenull/tellform
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

added validation and enter key bindings

Browse source
This commit is contained in:
David Baldwynn 2016-04-28 21:57:04 -07:00
parent ada7880bac
commit ed9eb42468
14 changed files with 84 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
public/application.js
View file

@ -33,19 +33,19 @@ angular.module(ApplicationConfiguration.applicationModuleName).run(['$rootScope'
// add previous state property
$rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState) {
$state.previous = fromState;
console.log('toState: '+toState.name);
//console.log('toState: '+toState.name);
//Redirect to listForms if user is authenticated
if(toState.name === 'home' || toState.name === 'signin' || toState.name === 'resendVerifyEmail' || toState.name === 'verify' || toState.name === 'signup' || toState.name === 'signup-success'){
if(Auth.isAuthenticated()){
event.preventDefault(); // stop current execution
console.log('go to forms');
$state.go('listForms'); // go to listForms page
//console.log('go to forms');
$state.go('listForms'); // go to listForms page
}
}
//Redirect to 'signup' route if user is not authenticated
else if(toState.name !== 'access_denied' && !Auth.isAuthenticated() && toState.name !== 'submitForm'){
console.log('go to signup');
//console.log('go to signup');
event.preventDefault(); // stop current execution
$state.go('listForms'); // go to listForms page
}
@ -72,7 +72,7 @@ angular.module(ApplicationConfiguration.applicationModuleName).run(['$rootScope'
if( (permissions != null) ){
if( !authenticator.canAccess(permissions) ){
event.preventDefault();
console.log('access denied');
//console.log('access denied');
$state.go('access_denied');
}
}

19
public/modules/forms/directives/field.client.directive.js
View file

@ -47,7 +47,21 @@ angular.module('forms').directive('fieldDirective', ['$http', '$compile', '$root
forms: '='
},
link: function(scope, element) {
console.log(scope.forms.myForm);
$rootScope.chooseDefaultOption = scope.chooseDefaultOption = function(type) {
if(type === 'yes_no'){
scope.field.fieldValue = 'true';
}else if(type === 'rating'){
scope.field.fieldValue = 0;
}else if(scope.field.fieldType === 'radio'){
console.log(scope.field);
scope.field.fieldValue = scope.field.fieldOptions[0].option_value;
console.log(scope.field.fieldValue);
}else if(type === 'legal'){
scope.field.fieldValue = 'true';
$rootScope.nextField();
}
};
scope.setActiveField = $rootScope.setActiveField;
@ -74,7 +88,8 @@ angular.module('forms').directive('fieldDirective', ['$http', '$compile', '$root
scope.field.placeholder = 'joesmith@example.com';
break;
case 'number':
scope.field.input_type = 'number';
scope.field.input_type = 'text';
scope.field.validateRegex = /^\d+$/;
break;
default:
scope.field.input_type = 'url';

7
public/modules/forms/directives/on-enter-key.client.directive.js
View file

@ -2,19 +2,18 @@
angular.module('forms').directive('onEnterKey', ['$rootScope', function($rootScope){
return {
restrict: 'A',
restrict: 'A',
link: function($scope, $element, $attrs) {
$element.bind('keydown keypress', function(event) {
var keyCode = event.which || event.keyCode;
console.log($attrs.onEnterKey);
if(keyCode === 13) {
$rootScope.$apply(function() {
$rootScope.$eval($attrs.onEnterKey);
});
event.preventDefault();
}
});
}
};
};
}]);

18
public/modules/forms/directives/submit-form.client.directive.js
View file

@ -36,7 +36,7 @@ angular.module('forms').directive('submitFormDirective', ['$http', 'TimeCounter'
};
$scope.setActiveField($scope.myform.visible_form_fields[0]._id, 0, false);
console.log($scope.selected);
//console.log($scope.selected);
//Reset Timer
TimeCounter.restartClock();
};
@ -83,13 +83,13 @@ angular.module('forms').directive('submitFormDirective', ['$http', 'TimeCounter'
*/
$scope.setActiveField = $rootScope.setActiveField = function(field_id, field_index, animateScroll) {
if($scope.selected === null || $scope.selected._id === field_id){
console.log('not scrolling');
console.log($scope.selected);
//console.log('not scrolling');
//console.log($scope.selected);
return;
}
console.log('field_id: '+field_id);
console.log('field_index: '+field_index);
console.log($scope.selected);
//console.log('field_id: '+field_id);
//console.log('field_index: '+field_index);
//console.log($scope.selected);
$scope.selected._id = field_id;
$scope.selected.index = field_index;
@ -106,7 +106,7 @@ angular.module('forms').directive('submitFormDirective', ['$http', 'TimeCounter'
};
$rootScope.nextField = $scope.nextField = function(){
console.log('nextfield');
//console.log('nextfield');
//console.log($scope.selected.index);
//console.log($scope.myform.form_fields.length-1);
if($scope.selected.index < $scope.myform.form_fields.length-1){
@ -150,14 +150,14 @@ angular.module('forms').directive('submitFormDirective', ['$http', 'TimeCounter'
setTimeout(function () {
$scope.submitPromise = $http.post('/forms/' + $scope.myform._id, form)
.success(function (data, status, headers) {
console.log('form submitted successfully');
//console.log('form submitted successfully');
$scope.myform.submitted = true;
$scope.loading = false;
})
.error(function (error) {
$scope.loading = false;
console.log(error);
//console.log(error);
$scope.error = error.message;
});
}, 500);

10
public/modules/forms/services/forms.client.service.js
View file

@ -7,7 +7,7 @@ angular.module('forms').factory('Forms', ['$resource',
formId: '@_id'
}, {
'query' : {
method: 'GET',
method: 'GET',
isArray: true,
//DAVID: TODO: Do we really need to get visible_form_fields for a Query?
// transformResponse: function(data, header) {
@ -21,11 +21,11 @@ angular.module('forms').factory('Forms', ['$resource',
// }
},
'get' : {
method: 'GET',
method: 'GET',
transformResponse: function(data, header) {
var form = angular.fromJson(data);
console.log(form);
//console.log(form);
form.visible_form_fields = _.filter(form.form_fields, function(field){
return (field.deletePreserved === false);
});
@ -40,4 +40,4 @@ angular.module('forms').factory('Forms', ['$resource',
}
});
}
]);
]);

20
public/modules/forms/views/directiveViews/field/legal.html
View file

@ -1,4 +1,6 @@
<div class="field row radio legal" ng-click="setActiveField(field._id, index, true)">
<div class="field row radio legal"
ng-click="setActiveField(field._id, index, true)"
on-enter-key="chooseDefaultOption('legal')">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}">
<h3>{{field.title}} <span class="required-error" ng-show="!field.required">optional</span></h3>
<br>
@ -6,26 +8,30 @@
</div>
<div class="col-xs-12 field-input container">
<div class="row-fluid">
<label class="btn col-xs-5">
<label class="btn col-xs-5"
ng-class="{activeBtn: field.fieldValue == 'true'}">
<input ng-focus="setActiveField(field._id, index, true)"
class="focusOn"
ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
type="radio" value="true"
type="radio"
value="true"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-click="$root.nextField()"
ng-change="$root.nextField()"
ng-disabled="field.disabled"/>
<span> I accept </span>
</label>
<label class="btn col-xs-5 col-xs-offset-1">
<label class="btn col-xs-5 col-xs-offset-1"
ng-class="{activeBtn: field.fieldValue == 'false'}">
<input ng-focus="setActiveField(field._id, index, true)"
ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
type="radio" value="false"
type="radio"
value="false"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-click="$root.nextField()"
ng-select="$root.nextField()"
ng-disabled="field.disabled"/>
<span>I don't accept </span>
</label>

16
public/modules/forms/views/directiveViews/field/natural.html
View file

@ -1,16 +0,0 @@
<div class="field row textfield natural" ng-click="setActiveField(field._id, index, true)">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}"><h3><span class="fa fa-angle-double-right"></span> {{field.title}} <span class="required-error" ng-show="!field.required">optional</span></h3></div>
<div class="col-xs-12 field-input">
<input ng-focus="setActiveField(field._id, index, true)" ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}" type="text"
class="text-field-input"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
value="field.fieldValue"
ng-required="field.required"
ng-disabled="field.disabled">
</div>
<br>
<div class="col-xs-12">
<span ng-bind="field.fieldMatchValue"></span>
</div>
</div>

6
public/modules/forms/views/directiveViews/field/password.html
View file

@ -1,6 +0,0 @@
<div class="field row" ng-click="setActiveField(field._id, index, true)">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}"><h3><span class="fa fa-angle-double-right"></span> {{field.title}} <span class="required-error" ng-show="!field.required">optional</span></h3></div>
<div class="col-xs-12 field-input">
<input ng-focus="setActiveField(field._id, index, true)" ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}" type="password" class="text-field-input" ng-model="field.fieldValue" ng-model-options="{ debounce: 250 }" value="{{field.fieldValue}}" ng-required="field.required" ng-disabled="field.disabled">
</div>
</div>

10
public/modules/forms/views/directiveViews/field/radio.html
View file

@ -1,18 +1,22 @@
<div class="field row radio" ng-click="setActiveField(field._id, index, true)" ng-if="field.fieldOptions.length > 0">
<div class="field row radio"
ng-click="setActiveField(field._id, index, true)"
ng-if="field.fieldOptions.length > 0"
on-enter-key="chooseDefaultOption()">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}"><h3><span class="fa fa-angle-double-right"></span> {{field.title}} <span class="required-error" ng-show="!field.required">optional</span></h3></div>
<div class="col-xs-12 field-input">
<div ng-repeat="option in field.fieldOptions" class="row-fluid">
<label class="btn col-xs-4"
style="margin: 0.5em; padding-left:30px"
ng-click="$root.nextField()"
ng-class="{activeBtn: field.fieldValue == field.fieldOptions[$index].option_id}">
ng-class="{activeBtn: field.fieldValue == field.fieldOptions[$index].option_value}">
<input ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
type="radio" class="focusOn"
value="{{option.option_value}}"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-disabled="field.disabled" />
ng-disabled="field.disabled"
ng-change="$root.nextField()"/>
<span ng-bind="option.option_value"></span>
</label>

4
public/modules/forms/views/directiveViews/field/rating.html
View file

@ -1,4 +1,6 @@
<div class="textfield field row" ng-click="setActiveField(field._id, index, true)">
<div class="textfield field row"
ng-click="setActiveField(field._id, index, true)"
on-enter-key="chooseDefaultOption('rating')">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}">
<h3>
<span class="fa fa-angle-double-right"></span>

5
public/modules/forms/views/directiveViews/field/statement.html
View file

@ -1,7 +1,8 @@
<div class="statement field row">
<div class="statement field row"
on-enter-key="$root.nextField()">
<div class="row field-title field-title">
<div class="col-xs-1"><i class="fa fa-quote-left fa-1"></i></div>
<h2 class="text-left col-xs-9">{{field.title}} </h2>
<h2 class="text-left col-xs-9">{{field.title}}</h2>
</div>
<div class="row field-title field-input">
<p class="col-xs-12" ng-if="field.description.length">{{field.description}} </p>

7
public/modules/forms/views/directiveViews/field/textfield.html
View file

@ -1,5 +1,5 @@
<div class="textfield field row" ng-click="setActiveField(field._id, index, true)">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}" ng-style="{'color': design.colors.questionColor}">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}">
<h3>
<span class="fa fa-angle-double-right"></span> {{field.title}}
<span class="required-error" ng-show="!field.required">
@ -11,7 +11,8 @@
<input ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
ng-focus="setActiveField(field._id, index, true)"
name="{{field.fieldType}}{{index}}"
type="{{field.input_type}}"
type="{{field.input_type}}"
ng-pattern="field.validateRegex"
placeholder="{{field.placeholder}}"
ng-class="{ 'no-border': !!field.fieldValue }"
class="focusOn text-field-input"
@ -28,7 +29,7 @@
<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
<span class="sr-only">Error:</span>
<span ng-if="field.fieldType == 'email'"> Please enter a valid email address </span>
<span ng-if="field.fieldType == 'numbers'"> Please enter valid numbers only </span>
<span ng-if="field.validateRegex"> Please enter valid numbers only </span>
<span ng-if="field.fieldType == 'link'"> Please a valid url </span>
</div>
</div>

9
public/modules/forms/views/directiveViews/field/yes_no.html
View file

@ -1,4 +1,5 @@
<div class="field row radio" ng-click="setActiveField(field._id, index, true)">
<div class="field row radio" ng-click="setActiveField(field._id, index, true)"
on-enter-key="chooseDefaultOption('yes_no')">
<div class="col-xs-12 field-title" ng-style="{'color': design.colors.questionColor}">
<h3 class="row">
<span class="fa fa-angle-double-right"></span> {{field.title}}
@ -22,7 +23,7 @@
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-click="$root.nextField()"
ng-change="$root.nextField()"
ng-disabled="field.disabled" />
<div class="letter">
Y
@ -42,11 +43,11 @@
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
ng-click="$root.nextField()"
ng-change="$root.nextField()"
ng-disabled="field.disabled"/>
<div class="letter">
N
N
</div>
<span>No</span>
<i ng-show="field.fieldValue === 'false'" class="fa fa-check" aria-hidden="true"></i>

20
public/modules/users/services/auth.client.service.js
View file

@ -1,6 +1,6 @@
'use strict';
angular.module('users').factory('Auth', ['$window',
angular.module('users').factory('Auth', ['$window',
function($window) {
var userState = {
@ -18,24 +18,24 @@ angular.module('users').factory('Auth', ['$window',
// Auth <- $http <- $resource <- LoopBackResource <- User <- Auth
ensureHasCurrentUser: function(User) {
if (service._currentUser && service._currentUser.username) {
console.log('Using local current user.');
console.log(service._currentUser);
//console.log('Using local current user.');
//console.log(service._currentUser);
return service._currentUser;
}
}
else if ($window.user){
console.log('Using cached current user.');
console.log($window.user);
//console.log('Using cached current user.');
//console.log($window.user);
service._currentUser = $window.user;
return service._currentUser;
}
else{
console.log('Fetching current user from the server.');
//console.log('Fetching current user from the server.');
User.getCurrent().then(function(user) {
// success
service._currentUser = user;
userState.isLoggedIn = true;
userState.isLoggedIn = true;
$window.user = service._currentUser;
return service._currentUser;
return service._currentUser;
},
function(response) {
userState.isLoggedIn = false;
@ -67,6 +67,6 @@ angular.module('users').factory('Auth', ['$window',
},
};
return service;
}
]);