Skip to content
This repository was archived by the owner on Apr 9, 2019. It is now read-only.

Commit 978aaef

Browse files
committed
NavigationController.transitionType
1 parent 7d06627 commit 978aaef

File tree

3 files changed

+89
-54
lines changed

3 files changed

+89
-54
lines changed

README.md

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -89,9 +89,19 @@ Any valid React element (`React.PropTypes.element`)
8989

9090
Addtional options
9191

92-
##### `options.transiton` `{string|function}` `default='slide-left'`
93-
94-
Specify the type of transition: `slide-left` `slide-right` `slide-up` `slide-down`
92+
##### `options.transiton` `{number|function}` `default='slide-left'`
93+
94+
Specify the type of transition:
95+
96+
```js
97+
NavigationController.transitionType = {
98+
NONE: 0,
99+
PUSH_LEFT: 1,
100+
PUSH_RIGHT: 2,
101+
PUSH_UP: 3,
102+
PUSH_DOWN: 4
103+
};
104+
```
95105

96106
A function can be used perform a custom transition:
97107

spec/navigation-controller.jsx

Lines changed: 38 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@ const {
55
} = React.addons.TestUtils;
66

77
const NavigationController = require('../src/navigation-controller');
8+
const {
9+
transitionType
10+
} = NavigationController;
11+
812
const {
913
getVendorPrefix
1014
} = require('../src/util/dom');
@@ -98,35 +102,35 @@ describe('NavigationController', () => {
98102
});
99103
describe('#__animateViews', () => {
100104
let prevX,prevY,nextX,nextY;
101-
it('slide-left', () => {
102-
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, 'slide-left');
105+
it('PUSH_LEFT', () => {
106+
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, transitionType.PUSH_LEFT);
103107
expect(prevX).to.equal(0);
104108
expect(nextX).to.equal(100);
105-
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, 'slide-left');
109+
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, transitionType.PUSH_LEFT);
106110
expect(prevX).to.equal(-100);
107111
expect(nextX).to.equal(0);
108112
});
109-
it('slide-right', () => {
110-
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, 'slide-right');
113+
it('PUSH_RIGHT', () => {
114+
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, transitionType.PUSH_RIGHT);
111115
expect(prevX).to.equal(0);
112116
expect(nextX).to.equal(-100);
113-
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, 'slide-right');
117+
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, transitionType.PUSH_RIGHT);
114118
expect(prevX).to.equal(100);
115119
expect(nextX).to.equal(0);
116120
});
117-
it('slide-up', () => {
118-
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, 'slide-up');
121+
it('PUSH_UP', () => {
122+
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, transitionType.PUSH_UP);
119123
expect(prevY).to.equal(0);
120124
expect(nextY).to.equal(100);
121-
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, 'slide-up');
125+
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, transitionType.PUSH_UP);
122126
expect(prevY).to.equal(-100);
123127
expect(nextY).to.equal(0);
124128
});
125-
it('slide-down', () => {
126-
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, 'slide-down');
129+
it('PUSH_DOWN', () => {
130+
[prevX,prevY,nextX,nextY] = controller.__animateViews(0, transitionType.PUSH_DOWN);
127131
expect(prevY).to.equal(0);
128132
expect(nextY).to.equal(-100);
129-
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, 'slide-down');
133+
[prevX,prevY,nextX,nextY] = controller.__animateViews(1, transitionType.PUSH_DOWN);
130134
expect(prevY).to.equal(100);
131135
expect(nextY).to.equal(0);
132136
});
@@ -205,7 +209,7 @@ describe('NavigationController', () => {
205209
});
206210
it('sets and calls the completion callback', (done) => {
207211
const transitionCallbackSpy = sinon.spy();
208-
controller.__transitionViews('none', transitionCallbackSpy);
212+
controller.__transitionViews(transitionType.NONE, transitionCallbackSpy);
209213
const transitionCompleteSpy = sinon.spy(controller, '__transitionViewsComplete');
210214
requestAnimationFrame(() => {
211215
expect(transitionCompleteSpy.calledOnce).to.be.true;
@@ -216,7 +220,7 @@ describe('NavigationController', () => {
216220
it('manually runs a "none" transition', (done) => {
217221
const transformSpy = sinon.spy(controller, '__transformViews');
218222
const animateCompleteSpy = sinon.spy(controller, '__animateViewsComplete');
219-
controller.__transitionViews('none');
223+
controller.__transitionViews(transitionType.NONE);
220224
const transitionCompleteSpy = sinon.spy(controller, '__transitionViewsComplete');
221225
requestAnimationFrame(() => {
222226
expect(transformSpy.calledOnce).to.be.true;
@@ -229,7 +233,7 @@ describe('NavigationController', () => {
229233
const animateSpy = sinon.spy(controller, '__animateViews');
230234
const transformSpy = sinon.spy(controller, '__transformViews');
231235
const animateCompleteSpy = sinon.spy(controller, '__animateViewsComplete');
232-
controller.__transitionViews('slide-left', function() {
236+
controller.__transitionViews(transitionType.PUSH_LEFT, function() {
233237
expect(animateSpy.callCount).to.be.above(1);
234238
expect(transformSpy.callCount).to.be.above(1);
235239
expect(animateCompleteSpy.calledOnce).to.be.true;
@@ -286,7 +290,7 @@ describe('NavigationController', () => {
286290
});
287291
it('appends the view to state.views', (done) => {
288292
controller.__pushView(<ViewB />, {
289-
transition: 'none',
293+
transition: transitionType.NONE,
290294
onComplete() {
291295
expect(controller.state.views[1].type).to.equal(ViewB);
292296
done();
@@ -295,7 +299,7 @@ describe('NavigationController', () => {
295299
});
296300
it('sets state.transition', (done) => {
297301
controller.__pushView(<ViewB />, {
298-
transition: 'none',
302+
transition: transitionType.NONE,
299303
onComplete() {
300304
done();
301305
}
@@ -307,7 +311,7 @@ describe('NavigationController', () => {
307311
it('sets state.mountedViews', (done) => {
308312
const [prev,next] = controller.__viewIndexes;
309313
controller.__pushView(<ViewB />, {
310-
transition: 'none',
314+
transition: transitionType.NONE,
311315
onComplete() {
312316
expect(controller.state.views[1].type).to.equal(ViewB);
313317
done();
@@ -320,19 +324,19 @@ describe('NavigationController', () => {
320324
});
321325
it('transitions the views', (done) => {
322326
const spy = sinon.spy(controller, '__transitionViews');
323-
controller.__pushView(<ViewB />, { transition: 'none' });
327+
controller.__pushView(<ViewB />, { transition: transitionType.NONE });
324328
requestAnimationFrame(() => {
325329
expect(spy.calledOnce).to.be.true;
326330
done();
327331
});
328332
});
329333
it('sets __isTransitioning=true', () => {
330-
controller.__pushView(<ViewB />, { transition: 'none' });
334+
controller.__pushView(<ViewB />, { transition: transitionType.NONE });
331335
expect(controller.__isTransitioning).to.be.true;
332336
});
333337
it('calls the transitionDone callback', (done) => {
334338
controller.__pushView(<ViewB />, {
335-
transition: 'none',
339+
transition: transitionType.NONE,
336340
onComplete() {
337341
expect(true).to.be.true;
338342
done();
@@ -347,7 +351,7 @@ describe('NavigationController', () => {
347351
controller.refs[`view-${controller.__viewIndexes[0]}`].setState({
348352
foo: 'bar'
349353
});
350-
controller.__pushView(<ViewB />, { transition: 'none' });
354+
controller.__pushView(<ViewB />, { transition: transitionType.NONE });
351355
requestAnimationFrame(() => {
352356
expect(controller.__viewStates).to.have.length(1);
353357
expect(controller.__viewStates[0]).to.have.property('foo');
@@ -399,12 +403,12 @@ describe('NavigationController', () => {
399403
expect(controller.state.views[0].type).to.equal(ViewA);
400404
done();
401405
},
402-
transition: 'none'
406+
transition: transitionType.NONE
403407
});
404408
});
405409
it('sets state.transition', (done) => {
406410
controller.__popView({
407-
transition: 'none',
411+
transition: transitionType.NONE,
408412
onComplete() {
409413
done();
410414
}
@@ -416,7 +420,7 @@ describe('NavigationController', () => {
416420
it('sets state.mountedViews', (done) => {
417421
const [prev,next] = controller.__viewIndexes;
418422
controller.__popView({
419-
transition: 'none',
423+
transition: transitionType.NONE,
420424
onComplete() {
421425
done();
422426
}
@@ -428,14 +432,14 @@ describe('NavigationController', () => {
428432
});
429433
it('transitions the views', (done) => {
430434
const spy = sinon.spy(controller, '__transitionViews');
431-
controller.__popView({ transition: 'none' });
435+
controller.__popView({ transition: transitionType.NONE });
432436
requestAnimationFrame(() => {
433437
expect(spy.calledOnce).to.be.true;
434438
done();
435439
});
436440
});
437441
it('sets __isTransitioning=true', () => {
438-
controller.__popView({ transition: 'none' });
442+
controller.__popView({ transition: transitionType.NONE });
439443
expect(controller.__isTransitioning).to.be.true;
440444
});
441445
it('calls the onComplete callback', (done) => {
@@ -452,10 +456,10 @@ describe('NavigationController', () => {
452456
foo: 'bar'
453457
});
454458
controller.pushView(<ViewB />, {
455-
transition: 'none',
459+
transition: transitionType.NONE,
456460
onComplete() {
457461
controller.popView({
458-
transition: 'none',
462+
transition: transitionType.NONE,
459463
onComplete() {
460464
expect(controller.refs[`view-${controller.__viewIndexes[0]}`].state)
461465
.not.to.have.property('foo');
@@ -476,9 +480,9 @@ describe('NavigationController', () => {
476480
});
477481
controller.pushView(<ViewB />, {
478482
onComplete() {
479-
transition: 'none',
483+
transition: transitionType.NONE,
480484
controller.popView({
481-
transition: 'none',
485+
transition: transitionType.NONE,
482486
onComplete() {
483487
expect(controller.refs[`view-${controller.__viewIndexes[0]}`].state)
484488
.to.have.property('foo');
@@ -498,15 +502,15 @@ describe('NavigationController', () => {
498502
});
499503
it('pushes the last view on the stack', () => {
500504
controller.__setViews([<ViewB />], {
501-
transition: 'none',
505+
transition: transitionType.NONE,
502506
onComplete() {
503507
expect(controller.state.views).to.have.length(1);
504508
}
505509
})
506510
});
507511
it('clears the saved view states', () => {
508512
controller.__setViews([<ViewB />], {
509-
transition: 'none',
513+
transition: transitionType.NONE,
510514
onComplete() {
511515
expect(controller.__viewStates).to.have.length(0);
512516
}
@@ -542,7 +546,7 @@ describe('NavigationController', () => {
542546
});
543547
it('returns null if the next view is no longer mounted', (done) => {
544548
controller.__pushView(<ViewB />, {
545-
transition: 'none',
549+
transition: transitionType.NONE,
546550
onComplete() {
547551
expect(controller.__renderNextView()).to.be.null;
548552
done();

0 commit comments

Comments
 (0)