src/components/MinibarContainer.js

goog.module('gep.components.MinibarContainer');

const {Component} = goog.require('clulib.cm');

const AutoResetProvider = goog.require('gep.provider.AutoResetProvider');
const {WorldProvider} = goog.require('gep.provider.WorldProvider');

/**
 * This component is used to create a scrollable text container with a custom styled scrollbar over {@Link https://www.npmjs.com/package/minibarjs}.
 * Component is used from {@Link https://www.npmjs.com/package/clulib}
 * @extends {Component}
 */
class MinibarContainer extends Component
{
    constructor()
    {
        super();

        /**
         * Reference to the WorldProvider for monitoring actions, loading processes and status changes of the created THREE.Scene.
         * @type {WorldProvider}
         * @private
         */
        this.worldProvider_ = WorldProvider.getInstance();

        /**
         * Reference to AutoResetProvider to monitor and control the automatic reset of the page when the user is inactive for a specified period of time.
         * @type {AutoResetProvider}
         * @private
         */
        this.autoResetProvider_ = AutoResetProvider.getInstance();
    }

    /**
     * Component is ready and had loaded all dependencies (inherit method waitFor and sub components).
     * @inheritDoc
     */
    onInit()
    {
        super.onInit();

        /**
         * Minibar instance {@Link https://www.npmjs.com/package/minibarjs}
         * @type {MiniBar}
         * @private
         */
        this.minibar_ = !this.worldProvider_.isMobileDevice ? new MiniBar(this.getElement(), {'onScroll': () => {this.autoResetProvider_.start();}}) : null;
    }

    /**
     * Updates the minibar to take care about e.g. size changes after window resize.
     */
    update()
    {
        if(this.minibar_)
            this.minibar_.update();
    }

    /**
     * Scroll the content of the minibar to the top.
     */
    reset()
    {
        if(this.minibar_)
            this.minibar_.scrollTo(0);
    }

    /**
     * Getter
     * @return {MiniBar}
     */
    get minibar()
    {
        return this.minibar_;
    }
}

exports = MinibarContainer;