github-mirror/BookStack
2
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-06-06 02:24:33 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Started refactor and alignment of component system

Browse Source 
- Updates old components to newer format, removes legacy component
support.
- Makes component registration easier and less duplicated.
- Adds base component class to extend for better editor support.
- Aligns global window exposure usage and aligns with other service
  names.
This commit is contained in:
Dan Brown
2022-11-14 23:19:02 +00:00
parent a1b1f8138a
commit 09c6a3c240
21 changed files with 355 additions and 378 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
resources/js/components/back-to-top.js
View File

@ -1,34 +1,35 @@
import {Component} from "./component";
class BackToTop {
export class BackToTop extends Component {
constructor(elem) {
this.elem = elem;
setup() {
this.button = this.$el;
this.targetElem = document.getElementById('header');
this.showing = false;
this.breakPoint = 1200;
if (document.body.classList.contains('flexbox')) {
this.elem.style.display = 'none';
this.button.style.display = 'none';
return;
}
this.elem.addEventListener('click', this.scrollToTop.bind(this));
this.button.addEventListener('click', this.scrollToTop.bind(this));
window.addEventListener('scroll', this.onPageScroll.bind(this));
}
onPageScroll() {
let scrollTopPos = document.documentElement.scrollTop || document.body.scrollTop || 0;
if (!this.showing && scrollTopPos > this.breakPoint) {
this.elem.style.display = 'block';
this.button.style.display = 'block';
this.showing = true;
setTimeout(() => {
this.elem.style.opacity = 0.4;
this.button.style.opacity = 0.4;
}, 1);
} else if (this.showing && scrollTopPos < this.breakPoint) {
this.elem.style.opacity = 0;
this.button.style.opacity = 0;
this.showing = false;
setTimeout(() => {
this.elem.style.display = 'none';
this.button.style.display = 'none';
}, 500);
}
}