constructor(element, options) {
this.el = element;
this.flashTimeout;
this.contentEl;
this.scrollContentEl;
this.dragOffset = { x: 0, y: 0 };
this.isVisible = { x: true, y: true };
this.scrollOffsetAttr = { x: 'scrollLeft', y: 'scrollTop' };
this.sizeAttr = { x: 'offsetWidth', y: 'offsetHeight' };
this.scrollSizeAttr = { x: 'scrollWidth', y: 'scrollHeight' };
this.offsetAttr = { x: 'left', y: 'top' };
this.globalObserver;
this.mutationObserver;
this.resizeObserver;
this.currentAxis;
this.isRtl;
this.options = Object.assign({}, SimpleBar.defaultOptions, options);
this.classNames = this.options.classNames;
this.scrollbarWidth = scrollbarWidth();
this.offsetSize = 20;
this.flashScrollbar = this.flashScrollbar.bind(this);
this.onDragY = this.onDragY.bind(this);
this.onDragX = this.onDragX.bind(this);
this.onScrollY = this.onScrollY.bind(this);
this.onScrollX = this.onScrollX.bind(this);
this.drag = this.drag.bind(this);
this.onEndDrag = this.onEndDrag.bind(this);
this.onMouseEnter = this.onMouseEnter.bind(this);
this.recalculate = debounce(this.recalculate, 100, { leading: true });
this.init();
}
init() {
// Save a reference to the instance, so we know this DOM node has already been instancied
this.el.SimpleBar = this;
// We stop here on server-side
if (canUseDOM) {
this.initDOM();
this.scrollbarWidth = scrollbarWidth();
this.recalculate();
this.initListeners();
}
}
onWindowResize = () => {
// Recalculate scrollbarWidth in case it's a zoom
this.scrollbarWidth = scrollbarWidth();
this.hideNativeScrollbar();
};