IT4Change/ohmyform
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

moved from on('scroll' to using duScroll for tracking activeField

Browse Source
This commit is contained in:
David Baldwynn 2017-11-13 18:14:52 -08:00
parent 15a508cca7
commit 6848b740b3
10 changed files with 29 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
public/form_modules/forms/base/config/forms.client.config.js
View File

@ -28,9 +28,7 @@ angular.module('view-form')
}
return 0;
};
});
angular.module('view-form').value('supportedFields', [
}).value('supportedFields', [
'textfield',
'textarea',
'date',
@ -44,7 +42,11 @@ angular.module('view-form').value('supportedFields', [
'yes_no',
'number',
'natural'
]);
]).constant('VIEW_FORM_URL', '/forms/:formId/render');
angular.module('view-form').constant('VIEW_FORM_URL', '/forms/:formId/render');
//Angular-Scroll Settings
angular.module('view-form').value('duScrollActiveClass', 'activeField')
.value('duScrollGreedy', true)
.value('duScrollOffset', 100)
.value('duScrollSpyWait', 0);

28
public/form_modules/forms/base/directives/submit-form.client.directive.js
View File

@ -168,7 +168,6 @@ angular.module('view-form').directive('submitFormDirective', ['$http', 'TimeCoun
$scope.selected._id = field_id;
$scope.selected.index = field_index;
var nb_valid = $filter('formValidity')($scope.myform);
$scope.translateAdvancementData = {
done: nb_valid,
@ -202,14 +201,18 @@ angular.module('view-form').directive('submitFormDirective', ['$http', 'TimeCoun
if(oldValue !== newValue && newValue < $scope.myform.form_fields.length){
//Only send analytics data if form has not been submitted
if(!$scope.myform.submitted){
console.log('SendVisitorData.send()');
SendVisitorData.send($scope.myform, newValue, TimeCounter.getTimeElapsed());
//SendVisitorData.send($scope.myform, newValue, TimeCounter.getTimeElapsed());
}
}
});
$rootScope.$on('duScrollspy:becameActive', function($event, $element, $target){
console.log($element);
//$scope.setActiveField($element.prop('id'), null, false);
});
//Fire event when window is scrolled
$window.onscroll = function(){
/*$window.onscroll = function(){
if(!NOSCROLL){
var scrollTop = $(window).scrollTop();
@ -230,6 +233,14 @@ angular.module('view-form').directive('submitFormDirective', ['$http', 'TimeCoun
var fractionToJump = 0.9;
console.log("fieldBottom < elemHeight * fractionToJump: "+fieldBottom + " < " + elemHeight * fractionToJump);
console.log("fieldTop > elemHeight * fractionToJump: "+fieldTop + " > " + elemHeight * fractionToJump);
console.log('fieldTop: '+fieldTop);
console.log('fieldBottom: '+fieldBottom);
console.log('scrollPosition: '+scrollPosition)
//Focus on field above submit form button
if($scope.selected.index === $scope.myform.visible_form_fields.length){
if(scrollTop < scrollPosition){
@ -237,15 +248,13 @@ angular.module('view-form').directive('submitFormDirective', ['$http', 'TimeCoun
$scope.setActiveField(null, field_index, false);
}
}
//Focus on submit form button
else if($scope.selected.index === $scope.myform.visible_form_fields.length-1 && scrollTop > scrollPosition){
field_index = $scope.selected.index+1;
$scope.setActiveField(FORM_ACTION_ID, field_index, false);
}
//If we scrolled bellow the current field, move to next field
else if(fieldBottom < elemHeight * fractionToJump && $scope.selected.index < $scope.myform.visible_form_fields.length-1 ){
else if(fieldBottom < elemHeight * fractionToJump && $scope.selected.index < $scope.myform.visible_form_fields.length-1){
field_index = $scope.selected.index+1;
$scope.setActiveField(null, field_index, false);
}
@ -257,7 +266,9 @@ angular.module('view-form').directive('submitFormDirective', ['$http', 'TimeCoun
}
$scope.$apply();
};
};*/
$rootScope.nextField = $scope.nextField = function(){
if($scope.selected && $scope.selected.index > -1){
@ -281,7 +292,6 @@ angular.module('view-form').directive('submitFormDirective', ['$http', 'TimeCoun
//If selected is not defined go to the first field
$rootScope.setActiveField(null, 0, true);
}
};
$rootScope.prevField = $scope.prevField = function(){

1
public/form_modules/forms/base/views/directiveViews/field/date.html
View File

@ -16,7 +16,6 @@
<div class="col-xs-12 field-input">
<div class="control-group input-append">
<input class="focusOn"
ng-focus="setActiveField(field._id, null, false)"
ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
ng-class="{ 'no-border': !!field.fieldValue }"
ui-date="dateOptions"

1
public/form_modules/forms/base/views/directiveViews/field/dropdown.html
View File

@ -16,7 +16,6 @@
<div class="col-xs-12 field-input">
<ui-select ng-model="field.fieldValue"
class="dropdown"
ng-focus="setActiveField(field._id, null, false)"
theme="selectize"
search-enabled="true"
ng-required="field.required"

1
public/form_modules/forms/base/views/directiveViews/field/radio.html
View File

@ -26,7 +26,6 @@
{{$index+1}}
</div>
<input ng-style="{'color': design.colors.answerColor, 'border-color': design.colors.answerColor}"
ng-focus="setActiveField(field._id, null, false)"
type="radio" class="focusOn"
value="{{option.option_value}}"
ng-model="field.fieldValue"

1
public/form_modules/forms/base/views/directiveViews/field/textarea.html
View File

@ -18,7 +18,6 @@
{{ 'ADD_NEW_LINE_INSTR' | translate }}
</small>
<textarea class="textarea focusOn" type="text"
ng-focus="setActiveField(field._id, null, false)"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-class="{ 'no-border': !!field.fieldValue }"

1
public/form_modules/forms/base/views/directiveViews/field/textfield.html
View File

@ -26,7 +26,6 @@
placeholder="{{placeholder}}"
ng-class="{ 'no-border': !!field.fieldValue }"
class="focusOn text-field-input"
ng-focus="setActiveField(field._id, null, false)"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
value="field.fieldValue"

2
public/form_modules/forms/base/views/directiveViews/field/yes_no.html
View File

@ -28,7 +28,6 @@
<input type="radio" value="true"
class="focusOn"
style="opacity: 0; margin-left: 0px;"
ng-focus="setActiveField(field._id, null, false)"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"
@ -47,7 +46,6 @@
<input type="radio" value="false"
style="opacity:0; margin-left:0px;"
ng-focus="setActiveField(field._id, null, false)"
ng-model="field.fieldValue"
ng-model-options="{ debounce: 250 }"
ng-required="field.required"

5
public/form_modules/forms/base/views/directiveViews/form/submit-form.client.view.html
View File

@ -41,12 +41,11 @@
<div class="row form-field-wrapper">
<form name="forms.myForm" novalidate class="submission-form">
<div ng-repeat="field in myform.form_fields" ng-if="!field.deletePreserved" data-index="{{$index}}" data-id="{{field._id}}" ng-class="{activeField: selected._id == field._id }" class="row field-directive">
<div ng-repeat="field in myform.form_fields" ng-if="!field.deletePreserved" data-index="{{$index}}" data-id="{{field._id}}" id="{{field._id}}" class="row field-directive" du-scrollspy="{{field._id}}">
<field-directive field="field" design="myform.design" index="$index" forms="forms">
</field-directive>
</div>
<div class="row form-actions" id="submit_field" ng-class="{activeField: selected._id == 'submit_field' }"
<div class="row form-actions" id="submit_field" du-scrollspy="submit_field"
ng-style="{ 'background-color':myform.design.colors.buttonColor}" style="border-top: 1px solid #ddd; margin-top: 30vh; height: 100vh; margin-left: 1%; margin-right: 1%;"
on-tab-and-shift-key="prevField()"
on-tab-key="nextField()"

2
public/form_modules/forms/forms.client.module.js
View File

@ -2,5 +2,5 @@
// Use Application configuration module to register a new module
ApplicationConfiguration.registerModule('view-form', [
'ngFileUpload', 'ui.date', 'angular-input-stars'
'ui.date', 'angular-input-stars', 'duScroll'
]);