Skip to content

Commit 495a577

Browse files
author
jacobscarter
committed
added enter and exit validation for traversing steps that depend on information from other steps through context object
1 parent e2efecc commit 495a577

2 files changed

Lines changed: 60 additions & 13 deletions

File tree

‎src/step.js‎

100644100755
Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,9 @@ angular.module('mgo-angular-wizard').directive('wzStep', function() {
55
transclude: true,
66
scope: {
77
wzTitle: '@',
8-
title: '@'
8+
title: '@',
9+
canenter : '=',
10+
canexit : '='
911
},
1012
require: '^wizard',
1113
templateUrl: function(element, attributes) {

‎src/wizard.js‎

Lines changed: 57 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,8 @@ angular.module('mgo-angular-wizard').directive('wizard', function() {
1717

1818
//controller for wizard directive, treat this just like an angular controller
1919
controller: ['$scope', '$element', '$log', 'WizardHandler', function($scope, $element, $log, WizardHandler) {
20-
20+
//this variable allows directive to load without having to pass any step validation
21+
var firstRun = true;
2122
//creating instance of wizard, passing this as second argument allows access to functions attached to this via Service
2223
WizardHandler.addWizard($scope.name || WizardHandler.defaultName, this);
2324

@@ -28,6 +29,9 @@ angular.module('mgo-angular-wizard').directive('wizard', function() {
2829
//steps array where all the scopes of each step are added
2930
$scope.steps = [];
3031

32+
//access to context object for step validation
33+
$scope.context = {};
34+
3135
//watching changes to currentStep
3236
$scope.$watch('currentStep', function(step) {
3337
//checking to make sure currentStep is truthy value
@@ -66,18 +70,59 @@ angular.module('mgo-angular-wizard').directive('wizard', function() {
6670
};
6771

6872
$scope.goTo = function(step) {
69-
//deselect all steps so you can set fresh below
70-
unselectAll();
71-
//set the selected step to $scope of directive of that step
72-
$scope.selectedStep = step;
73-
//making sure current step is not undefined
74-
if (!_.isUndefined($scope.currentStep)) {
75-
$scope.currentStep = step.title || step.wzTitle;
73+
//if this is the first time the wizard is loading it bi-passes step validation
74+
if(firstRun){
75+
//deselect all steps so you can set fresh below
76+
unselectAll();
77+
$scope.selectedStep = step;
78+
//making sure current step is not undefined
79+
if (!_.isUndefined($scope.currentStep)) {
80+
$scope.currentStep = step.title || step.wzTitle;
81+
}
82+
//setting selected step to argument passed into goTo()
83+
step.selected = true;
84+
//emit event upwards with data on goTo() invoktion
85+
$scope.$emit('wizard:stepChanged', {step: step, index: _.indexOf($scope.steps , step)});
86+
//setting variable to false so all other step changes must pass validation
87+
firstRun = false;
88+
} else {
89+
//createing variables to capture current state that goTo() was invoked from and allow booleans
90+
var thisStep;
91+
var exitallowed = false;
92+
var enterallowed = false;
93+
//getting data for step you are transitioning out of
94+
if($scope.currentStepNumber() > 0){
95+
thisStep = $scope.currentStepNumber() - 1;
96+
} else if ($scope.currentStepNumber() === 0){
97+
thisStep = 0;
98+
}
99+
console.log('steps[thisStep] Data: ', $scope.steps[thisStep].canexit);
100+
if(typeof($scope.steps[thisStep].canexit) === 'undefined' || $scope.steps[thisStep].canexit($scope.context) === true){
101+
exitallowed = true;
102+
}
103+
if(exitallowed && step.canenter === undefined || exitallowed && step.canenter($scope.context) === true){
104+
enterallowed = true;
105+
}
106+
107+
if(exitallowed && enterallowed){
108+
//deselect all steps so you can set fresh below
109+
unselectAll();
110+
111+
//console.log('value for canExit argument: ', $scope.currentStep.canexit);
112+
$scope.selectedStep = step;
113+
//making sure current step is not undefined
114+
if (!_.isUndefined($scope.currentStep)) {
115+
$scope.currentStep = step.title || step.wzTitle;
116+
}
117+
//setting selected step to argument passed into goTo()
118+
step.selected = true;
119+
//emit event upwards with data on goTo() invoktion
120+
$scope.$emit('wizard:stepChanged', {step: step, index: _.indexOf($scope.steps , step)});
121+
console.log('current step number: ', $scope.currentStepNumber());
122+
} else {
123+
return;
124+
}
76125
}
77-
//setting selected step to argument passed into goTo()
78-
step.selected = true;
79-
//emit event upwards with data on goTo() invoktion
80-
$scope.$emit('wizard:stepChanged', {step: step, index: _.indexOf($scope.steps , step)});
81126
};
82127

83128
$scope.currentStepNumber = function() {

0 commit comments

Comments
 (0)