51 lines
1.0 KiB
JavaScript
51 lines
1.0 KiB
JavaScript
class VrtsTestRunPage extends window.HTMLElement {
|
|
constructor() {
|
|
super();
|
|
this.bindFunctions();
|
|
this.bindEvents();
|
|
this.isScrolling = false;
|
|
}
|
|
|
|
bindFunctions() {
|
|
this.onScroll = this.onScroll.bind( this );
|
|
this.setOffset = this.setOffset.bind( this );
|
|
}
|
|
|
|
bindEvents() {
|
|
document.addEventListener( 'scroll', this.onScroll );
|
|
}
|
|
|
|
onScroll() {
|
|
if ( ! this.isScrolling ) {
|
|
this.isScrolling = true;
|
|
window.requestAnimationFrame( this.setOffset );
|
|
}
|
|
}
|
|
|
|
setOffset() {
|
|
const offset = Math.max( 0, this.offset - window.scrollY );
|
|
|
|
this.style.setProperty(
|
|
'--vrts-test-run-page-offset',
|
|
`${ offset }px`
|
|
);
|
|
|
|
this.isScrolling = false;
|
|
}
|
|
|
|
connectedCallback() {
|
|
const rect = this.getBoundingClientRect();
|
|
const adminBarHeight =
|
|
document.getElementById( 'wpadminbar' ).offsetHeight;
|
|
this.offset = rect.top + window.scrollY - adminBarHeight;
|
|
|
|
this.setOffset();
|
|
}
|
|
|
|
disconnectedCallback() {
|
|
document.removeEventListener( 'scroll', this.onScroll );
|
|
}
|
|
}
|
|
|
|
window.customElements.define( 'vrts-test-run-page', VrtsTestRunPage );
|