Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix($navButtons): Fix bug with next/prev being hidden #46

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

fix($navButtons): Fix bug with next/prev being hidden #46

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
114 changes: 54 additions & 60 deletions dist/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,6 @@ Object.defineProperty(exports, "__esModule", {
value: true
});

var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
Expand Down Expand Up @@ -172,72 +170,68 @@ var StepZilla = function (_Component) {
// a child step wants to invoke a jump between steps. in this case 'evt' is the numeric step number and not the JS event
this.setNavState(evt);
} else {
var _ret = function () {
// the main navigation step ui is invoking a jump between steps
if (!_this3.props.stepsNavigation || evt.target.value == _this3.state.compState) {
// if stepsNavigation is turned off or user clicked on existing step again (on step 2 and clicked on 2 again) then ignore
evt.preventDefault();
evt.stopPropagation();

return {
v: void 0
};
}
// the main navigation step ui is invoking a jump between steps
if (!this.props.stepsNavigation || evt.target.value == this.state.compState) {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please use strict equality operator ===

// if stepsNavigation is turned off or user clicked on existing step again (on step 2 and clicked on 2 again) then ignore
evt.preventDefault();
evt.stopPropagation();

evt.persist(); // evt is a react event so we need to persist it as we deal with aync promises which nullifies these events (https://facebook.github.io/react/docs/events.html#event-pooling)
return;
}

var movingBack = evt.target.value < _this3.state.compState; // are we trying to move back or front?
var passThroughStepsNotValid = false; // if we are jumping forward, only allow that if inbetween steps are all validated. This flag informs the logic...
var proceed = false; // flag on if we should move on
evt.persist(); // evt is a react event so we need to persist it as we deal with aync promises which nullifies these events (https://facebook.github.io/react/docs/events.html#event-pooling)

_this3.abstractStepMoveAllowedToPromise(movingBack).then(function () {
var valid = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
// validation was a success (promise or sync validation). In it was a Promise's resolve() then proceed will be undefined, so make it true. Or else 'proceed' will carry the true/false value from sync v
proceed = valid;
var movingBack = evt.target.value < this.state.compState; // are we trying to move back or front?
var passThroughStepsNotValid = false; // if we are jumping forward, only allow that if inbetween steps are all validated. This flag informs the logic...
var proceed = false; // flag on if we should move on

if (!movingBack) {
_this3.updateStepValidationFlag(proceed);
}
this.abstractStepMoveAllowedToPromise(movingBack).then(function () {
var valid = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
// validation was a success (promise or sync validation). In it was a Promise's resolve() then proceed will be undefined, so make it true. Or else 'proceed' will carry the true/false value from sync v
proceed = valid;

if (proceed) {
if (!movingBack) {
// looks like we are moving forward, 'reduce' a new array of step>validated values we need to check and 'some' that to get a decision on if we should allow moving forward
passThroughStepsNotValid = _this3.props.steps.reduce(function (a, c, i) {
if (i >= _this3.state.compState && i < evt.target.value) {
a.push(c.validated);
}
return a;
}, []).some(function (c) {
return c === false;
});
}
}
}).catch(function (e) {
// Promise based validation was a fail (i.e reject())
if (!movingBack) {
_this3.updateStepValidationFlag(proceed);
}

if (proceed) {
if (!movingBack) {
_this3.updateStepValidationFlag(false);
}
}).then(function () {
// this is like finally(), executes if error no no error
if (proceed && !passThroughStepsNotValid) {
if (evt.target.value === _this3.props.steps.length - 1 && _this3.state.compState === _this3.props.steps.length - 1) {
_this3.setNavState(_this3.props.steps.length);
} else {
_this3.setNavState(evt.target.value);
}
}
}).catch(function (e) {
if (e) {
// see note below called "CatchRethrowing"
// ... plus the finally then() above is what throws the JS Error so we need to catch that here specifically
setTimeout(function () {
throw e;
// looks like we are moving forward, 'reduce' a new array of step>validated values we need to check and 'some' that to get a decision on if we should allow moving forward
passThroughStepsNotValid = _this3.props.steps.reduce(function (a, c, i) {
if (i >= _this3.state.compState && i < evt.target.value) {
a.push(c.validated);
}
return a;
}, []).some(function (c) {
return c === false;
});
}
});
}();

if ((typeof _ret === 'undefined' ? 'undefined' : _typeof(_ret)) === "object") return _ret.v;
}
}).catch(function (e) {
// Promise based validation was a fail (i.e reject())
if (!movingBack) {
_this3.updateStepValidationFlag(false);
}
}).then(function () {
var stepIndex = evt.target.value || evt.target.parentElement.value;

// this is like finally(), executes if error no no error
if (proceed && !passThroughStepsNotValid) {
if (stepIndex === _this3.props.steps.length - 1 && _this3.state.compState === _this3.props.steps.length - 1) {
_this3.setNavState(_this3.props.steps.length);
} else {
_this3.setNavState(stepIndex);
}
}
}).catch(function (e) {
if (e) {
// see note below called "CatchRethrowing"
// ... plus the finally then() above is what throws the JS Error so we need to catch that here specifically
setTimeout(function () {
throw e;
});
}
});
}
}

Expand Down
6 changes: 4 additions & 2 deletions src/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,14 +167,16 @@ export default class StepZilla extends Component {
}
})
.then(() => {
const stepIndex = evt.target.value || evt.target.parentElement.value;

// this is like finally(), executes if error no no error
if (proceed && !passThroughStepsNotValid) {
if (evt.target.value === (this.props.steps.length - 1) &&
if (stepIndex === (this.props.steps.length - 1) &&
this.state.compState === (this.props.steps.length - 1)) {
this.setNavState(this.props.steps.length);
}
else {
this.setNavState(evt.target.value);
this.setNavState(stepIndex);
}
}
})
Expand Down