This repository has been archived by the owner on Jan 3, 2023. It is now read-only.
-
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
eea685a
commit 9b8bea4
Showing
12 changed files
with
251 additions
and
68 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
import Ember from 'ember'; | ||
|
||
export default Ember.Mixin.create({ | ||
debounce(handler) { | ||
return (...args) => { | ||
if (!this.isScheduled) { | ||
this.isScheduled = true; | ||
|
||
window.requestAnimationFrame(() => { | ||
this.isScheduled = false; | ||
|
||
if (this.get('isDestroyed')) return; | ||
|
||
Ember.run(this, handler, ...args); | ||
}); | ||
} | ||
}; | ||
} | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
import Ember from 'ember'; | ||
import DebouncedResponse from './debounced-response'; | ||
|
||
function noop() { } | ||
|
||
// Debounces browser event, triggers 'scroll' event and calls 'scroll' handler. | ||
export default Ember.Mixin.create( | ||
Ember.Evented, | ||
DebouncedResponse, | ||
{ | ||
|
||
scroll: noop, | ||
|
||
didInsertElement: function() { | ||
this._super(...arguments); | ||
|
||
this.scrollHandler = this.debounce((...args) => { | ||
this.trigger('scroll', ...args); | ||
this.scroll(...args); | ||
}); | ||
|
||
window.addEventListener('scroll', this.scrollHandler); | ||
}, | ||
|
||
willDestroyElement: function() { | ||
this._super(...arguments); | ||
|
||
window.removeEventListener('scroll', this.scrollHandler); | ||
} | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,38 @@ | ||
function whichTransitionEvent() { | ||
let t; | ||
const el = document.createElement('fakeelement'); | ||
|
||
const transitions = { | ||
'transition': 'transitionend', | ||
'OTransition': 'oTransitionEnd', | ||
'MozTransition': 'transitionend', | ||
'WebkitTransition': 'webkitTransitionEnd' | ||
}; | ||
|
||
for (t in transitions) { | ||
if (el.style[t] !== undefined) { | ||
return transitions[t]; | ||
} | ||
} | ||
} | ||
|
||
const getScrollTop = function() { | ||
return (window.pageYOffset !== undefined) ? | ||
window.pageYOffset : | ||
(document.documentElement || document.body.parentNode || document.body).scrollTop; | ||
}; | ||
|
||
const oneTimeTransitionEvent = function(element, callback) { | ||
const transitionEvent = whichTransitionEvent(); | ||
const customFunction = (e) => { | ||
e.target.removeEventListener(transitionEvent, customFunction); | ||
return callback(e); | ||
}; | ||
|
||
element.addEventListener(transitionEvent, customFunction); | ||
}; | ||
|
||
export { | ||
getScrollTop, | ||
oneTimeTransitionEvent | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,58 +1,68 @@ | ||
import Ember from 'ember'; | ||
import { click, find, findAll, scrollTo, visit } from 'ember-native-dom-helpers'; | ||
import { getScrollTop } from 'ember-3d-nav/utils'; | ||
import { test } from 'qunit'; | ||
import moduleForAcceptance from '../helpers/module-for-acceptance'; | ||
const { $, run } = Ember; | ||
import { run } from '@ember/runloop'; | ||
|
||
moduleForAcceptance('Nav menu behavior'); | ||
|
||
test('clicking menu button opens nav', function(assert) { | ||
test('clicking menu button opens nav', async function(assert) { | ||
assert.expect(2); | ||
|
||
visit('/'); | ||
andThen(function() { | ||
assert.equal(find('.ember-3d-nav-container').hasClass('nav-is-visible'), false, 'nav-is-visible class not applied initially'); | ||
}); | ||
click('.nav-trigger'); | ||
andThen(function() { | ||
assert.equal(find('.ember-3d-nav-container').hasClass('nav-is-visible'), true, 'nav-is-visible class applied after clicking menu button'); | ||
}); | ||
await visit('/'); | ||
|
||
assert.equal(find('.ember-3d-nav-container').classList.contains('nav-is-visible'), false, | ||
'nav-is-visible class not applied initially'); | ||
|
||
await click(find('.nav-trigger')); | ||
|
||
assert.equal(find('.ember-3d-nav-container').classList.contains('nav-is-visible'), true, | ||
'nav-is-visible class applied after clicking menu button'); | ||
}); | ||
|
||
test('clicking an option selects it and closes the menu', function(assert) { | ||
test('clicking an option selects it and closes the menu', async function(assert) { | ||
assert.expect(4); | ||
|
||
visit('/'); | ||
andThen(function() { | ||
assert.equal(find('.ember-3d-nav-container').hasClass('nav-is-visible'), false, 'nav-is-visible class not applied initially'); | ||
}); | ||
click('.nav-trigger'); | ||
andThen(function() { | ||
assert.equal(find('.ember-3d-nav-container').hasClass('nav-is-visible'), true, 'nav-is-visible class applied after clicking menu button'); | ||
}); | ||
run.scheduleOnce('afterRender', this, function() { | ||
click('centered:nth-of-type(2)'); | ||
andThen(function() { | ||
assert.equal(find('centered:nth-of-type(2)').hasClass('is-selected'), true, 'nav item is selected'); | ||
assert.equal(find('.ember-3d-nav-container').hasClass('nav-is-visible'), false, 'nav-is-visible class removed after clicking nav item'); | ||
}); | ||
}); | ||
const done = assert.async(); | ||
|
||
await visit('/'); | ||
|
||
assert.equal(find('.ember-3d-nav-container').classList.contains('nav-is-visible'), false, | ||
'nav-is-visible class not applied initially'); | ||
|
||
await click(find('.nav-trigger')); | ||
|
||
assert.equal(find('.ember-3d-nav-container').classList.contains('nav-is-visible'), true, | ||
'nav-is-visible class applied after clicking menu button'); | ||
|
||
await click(findAll('centered')[2]); | ||
|
||
assert.equal(findAll('centered')[2].classList.contains('is-selected'), true, | ||
'nav item is selected'); | ||
|
||
run.later(function() { | ||
assert.equal(find('.ember-3d-nav-container').classList.contains('nav-is-visible'), false, | ||
'nav-is-visible class removed after clicking nav item'); | ||
done(); | ||
}, 1500); | ||
|
||
}); | ||
|
||
test('scrolling applies isFixedAndScrolled', function(assert) { | ||
test('scrolling applies isFixedAndScrolled', async function(assert) { | ||
assert.expect(5); | ||
|
||
visit('/'); | ||
andThen(function() { | ||
assert.equal($(window).scrollTop(), 0, 'window scroll is 0'); | ||
$(window).scrollTop(50); | ||
assert.equal($(window).scrollTop(), 50, 'window scroll is 50'); | ||
run.later(this, function() { | ||
assert.equal(find('.nav-trigger-container').hasClass('is-fixed-and-scrolled'), true, 'is-fixed-and-scrolled applied'); | ||
$(window).scrollTop(0); | ||
assert.equal($(window).scrollTop(), 0, 'window scroll is 0'); | ||
run.later(this, function() { | ||
assert.equal(find('.nav-trigger-container').hasClass('is-fixed-and-scrolled'), false, 'is-fixed-and-scrolled removed'); | ||
}, 100); | ||
}, 100); | ||
}); | ||
await visit('/'); | ||
assert.equal(getScrollTop(), 0, 'window scroll is 0'); | ||
|
||
await scrollTo(document.body, 0, 50); | ||
assert.equal(getScrollTop(), 50, 'window scroll is 50'); | ||
|
||
assert.equal(find('.nav-trigger-container').classList.contains('is-fixed-and-scrolled'), true, | ||
'is-fixed-and-scrolled applied'); | ||
|
||
await scrollTo(document.body, 0, 0); | ||
assert.equal(getScrollTop(), 0, 'window scroll is 0'); | ||
|
||
assert.equal(find('.nav-trigger-container').classList.contains('is-fixed-and-scrolled'), false, | ||
'is-fixed-and-scrolled removed'); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import Ember from 'ember'; | ||
import DebouncedResponseMixin from 'ember-3d-nav/mixins/debounced-response'; | ||
import { module, test } from 'qunit'; | ||
|
||
module('Unit | Mixin | debounced response'); | ||
|
||
// Replace this with your real tests. | ||
test('it works', function(assert) { | ||
let DebouncedResponseObject = Ember.Object.extend(DebouncedResponseMixin); | ||
let subject = DebouncedResponseObject.create(); | ||
assert.ok(subject); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import Ember from 'ember'; | ||
import RespondsToScrollMixin from 'ember-3d-nav/mixins/responds-to-scroll'; | ||
import { module, test } from 'qunit'; | ||
|
||
module('Unit | Mixin | responds to scroll'); | ||
|
||
// Replace this with your real tests. | ||
test('it works', function(assert) { | ||
let RespondsToScrollObject = Ember.Object.extend(RespondsToScrollMixin); | ||
let subject = RespondsToScrollObject.create(); | ||
assert.ok(subject); | ||
}); |
Oops, something went wrong.