36 lines
1.1 KiB
JavaScript
36 lines
1.1 KiB
JavaScript
import Component from '@ember/component';
|
|
import classic from 'ember-classic-decorator';
|
|
import {action} from '@ember/object';
|
|
import {run} from '@ember/runloop';
|
|
import {tagName} from '@ember-decorators/component';
|
|
|
|
@classic
|
|
@tagName('')
|
|
export default class GhCanvasHeader extends Component {
|
|
@action
|
|
initScrollWatch(element) {
|
|
this._onScroll = run.bind(this, this.onScroll, element);
|
|
this._scrollContainer = element.closest('.gh-main');
|
|
if (this._scrollContainer) {
|
|
this._scrollContainer.addEventListener('scroll', this._onScroll, {passive: true});
|
|
}
|
|
}
|
|
|
|
@action
|
|
clearScrollWatch() {
|
|
if (this._scrollContainer) {
|
|
this._scrollContainer.removeEventListener('scroll', this._onScroll);
|
|
}
|
|
}
|
|
|
|
onScroll(element) {
|
|
if (this._isSticky && this._scrollContainer.scrollTop < 10) {
|
|
element.classList.remove('gh-canvas-header--sticky');
|
|
this._isSticky = false;
|
|
} else if (!this._isSticky && this._scrollContainer.scrollTop > 10) {
|
|
element.classList.add('gh-canvas-header--sticky');
|
|
this._isSticky = true;
|
|
}
|
|
}
|
|
}
|