{"version":3,"file":"SidePanel.js","names":["defaultConfig","animationDuration","maxWidth","menuTopBuffer","desktopBreakpoint","dismissOnResizeToDesktop","dismissOnResizeToMobile","SidePanel","config","_","defaults","isOpen","animationInProgress","$root","$","document","createElement","addClass","css","$header","init","initEvents","initStage","window","on","throttle","onWindowResize","bind","appendTo","body","navClientRect","getBoundingClientRect","rootEl","style","height","_animateInContainer","then","ScrollLock","lock","_animateOutContainer","release","width","rootClientRect","Promise","resolve","reject","requestAnimationFrame","setTimeout","removeClass","_showPanel","_hidePanel","close","open","bottom","create"],"sources":["components/SidePanel.js"],"sourcesContent":["import $ from 'jquery';\r\nimport _ from 'lodash';\r\nimport {ScrollLock} from '../utils/scrollLock'\r\n\r\n\r\nvar defaultConfig = {\r\n    animationDuration: 200,\r\n    maxWidth: 500,\r\n    menuTopBuffer: 0,\r\n    desktopBreakpoint: 768,\r\n    dismissOnResizeToDesktop: false,\r\n    dismissOnResizeToMobile: false\r\n};\r\n\r\nexport class SidePanel {\r\n\r\n    /**\r\n     *\r\n     */\r\n    constructor(config){\r\n\r\n        this.config = _.defaults(config || {}, defaultConfig);\r\n\r\n        /**\r\n         *\r\n         * @type {boolean}\r\n         */\r\n        this.isOpen = false;\r\n\r\n        /**\r\n         *\r\n         * @type {boolean}\r\n         */\r\n        this.animationInProgress = false;\r\n\r\n        /**\r\n         *\r\n         * @type {jQuery}\r\n         */\r\n        this.$root = $(document.createElement('div'))\r\n            .addClass('ar-sidepanel')\r\n            .css('display', 'none');\r\n\r\n        /**\r\n         *\r\n         * @type {jQuery}\r\n         */\r\n        this.$header = $('.ar-header');\r\n\r\n        this.init();\r\n    }\r\n\r\n    /**\r\n     *\r\n     */\r\n    init(){\r\n        this.initEvents();\r\n        this.initStage();\r\n    }\r\n\r\n\r\n    /**\r\n     * Init event listeners\r\n     */\r\n    initEvents(){\r\n        $(window).on('resize', _.throttle(this.onWindowResize.bind(this), 150));\r\n    }\r\n\r\n    /**\r\n     * Build UI elements needed to render menu\r\n     */\r\n    initStage(){\r\n        this.$root.appendTo(document.body);\r\n    }\r\n\r\n\r\n    /**\r\n     * \r\n     */\r\n    updateGeometry(){\r\n        if(this.isOpen) {\r\n            var navClientRect = this.$header[0].getBoundingClientRect();\r\n            var rootEl = this.$root[0];\r\n            rootEl.style['paddingTop'] = navClientRect.height + 'px';\r\n        }\r\n    }\r\n\r\n\r\n    /**\r\n     *\r\n     * @returns {Promise}\r\n     * @private\r\n     */\r\n    _showPanel(){\r\n        return this._animateInContainer()\r\n            .then(()=> {\r\n                ScrollLock.lock();\r\n                this.isOpen = true\r\n            });\r\n    }\r\n\r\n    /**\r\n     *\r\n     * @returns {Promise}\r\n     * @private\r\n     */\r\n    _hidePanel(){\r\n        return this._animateOutContainer().then(()=> {\r\n            ScrollLock.release();\r\n            this.isOpen = false\r\n        });\r\n    }\r\n\r\n\r\n    /**\r\n     *\r\n     * @returns {Promise}\r\n     * @private\r\n     */\r\n    _animateInContainer(){\r\n        var rootEl, navClientRect;\r\n\r\n        this.animationInProgress = true;\r\n\r\n        rootEl = this.$root[0];\r\n        navClientRect = this.$header[0].getBoundingClientRect();\r\n\r\n\r\n        //Set last position\r\n        rootEl.style['position'] = 'fixed';\r\n        //Add a buffer to top edge so that on resize we dont see a gap between top bar and side nav\r\n        rootEl.style['top'] = '0px';\r\n        rootEl.style['paddingTop'] = navClientRect.height + 'px';\r\n        rootEl.style['right'] = 0;\r\n        rootEl.style['left'] = 'auto';\r\n        rootEl.style['width'] = navClientRect.width + 'px';\r\n        rootEl.style['bottom'] = 0;\r\n        rootEl.style['display'] = 'block';\r\n        rootEl.style['maxWidth'] = this.config.maxWidth + 'px';\r\n\r\n\r\n        //Invert position\r\n        rootEl.style['transform'] = `translate3d(${navClientRect.width}px,0,0)`;\r\n        rootEl.style['-webkit-transform'] = `translate3d(${navClientRect.width}px,0,0)`;\r\n\r\n        //Force sync layout\r\n        var rootClientRect = rootEl.getBoundingClientRect();\r\n\r\n        return new Promise((resolve, reject) => {\r\n            requestAnimationFrame(() => {\r\n\r\n                //Switch on animation\r\n                this.$root.addClass('animate-on-transforms');\r\n\r\n                //Play animation\r\n                rootEl.style['transform'] = `translate3d(0,0,0)`;\r\n                rootEl.style['-webkit-transform'] = `translate3d(0,0,0)`;\r\n\r\n\r\n                setTimeout(()=> {\r\n                    this.$root.removeClass('animate-on-transforms');\r\n\r\n                    this.animationInProgress = false;\r\n\r\n                    resolve();\r\n                }, this.config.animationDuration)\r\n            });\r\n        });\r\n    }\r\n\r\n    /**\r\n     *\r\n     * @returns {Promise}\r\n     * @private\r\n     */\r\n    _animateOutContainer(){\r\n        var rootEl, rootClientRect, navClientRect;\r\n\r\n        this.animationInProgress = true;\r\n\r\n        rootEl = this.$root[0];\r\n        rootClientRect = rootEl.getBoundingClientRect();\r\n        navClientRect = this.$header[0].getBoundingClientRect();\r\n\r\n        rootEl.style['position'] = 'fixed';\r\n        //Add a buffer to top edge so that on resize we dont see a gap between top bar and side nav\r\n        rootEl.style['top'] = '0px';\r\n        rootEl.style['paddingTop'] = navClientRect.height + 'px';\r\n        rootEl.style['right'] = 'auto';\r\n        rootEl.style['left'] = navClientRect.width + 'px';\r\n        rootEl.style['width'] = navClientRect.width + 'px';\r\n        rootEl.style['bottom'] = 0;\r\n        rootEl.style['display'] = 'block';\r\n\r\n        //Invert position\r\n        rootEl.style['transform'] = `translate3d(-${rootClientRect.width}px,0,0)`;\r\n        rootEl.style['-webkit-transform'] = `translate3d(-${rootClientRect.width}px,0,0)`;\r\n\r\n        //Force sync layout\r\n        rootClientRect = rootEl.getBoundingClientRect();\r\n\r\n        return new Promise((resolve, reject) => {\r\n            requestAnimationFrame(() => {\r\n\r\n                //Switch on animation\r\n                this.$root.addClass('animate-on-transforms');\r\n\r\n                //Play animation\r\n                rootEl.style['transform'] = `translate3d(0,0,0)`;\r\n                rootEl.style['-webkit-transform'] = `translate3d(0,0,0)`;\r\n\r\n                setTimeout(()=> {\r\n                    this.$root.removeClass('animate-on-transforms');\r\n\r\n                    rootEl.style['display'] = 'none';\r\n\r\n                    this.animationInProgress = false;\r\n\r\n                    resolve();\r\n                }, this.config.animationDuration)\r\n            });\r\n        });\r\n    }\r\n\r\n\r\n    /**\r\n     * Show the menu\r\n     */\r\n    open(){\r\n        if(this.animationInProgress){\r\n            return;\r\n        }\r\n\r\n        this._showPanel();\r\n    }\r\n\r\n    /**\r\n     * Close the menu\r\n     */\r\n    close(){\r\n        if(this.animationInProgress){\r\n            return;\r\n        }\r\n        this._hidePanel();\r\n    }\r\n\r\n    /**\r\n     * Show the menu\r\n     */\r\n    toggle(){\r\n        if(this.animationInProgress){\r\n            return;\r\n        }\r\n\r\n        if(this.isOpen){\r\n            this.close();\r\n        } else {\r\n            this.open();\r\n        }\r\n    }\r\n\r\n\r\n    onWindowResize(){\r\n        var navClientRect, rootEl;\r\n\r\n        if(!this.isOpen || this.animationInProgress){\r\n            return;\r\n        }\r\n\r\n        rootEl = this.$root[0];\r\n        navClientRect = this.$header[0].getBoundingClientRect();\r\n\r\n        //If viewport is now in desktop mode, hide the menu\r\n        if(this.config.dismissOnResizeToDesktop && navClientRect.width >= this.config.desktopBreakpoint){\r\n            this._hidePanel();\r\n            return;\r\n        }\r\n        //If viewport is now in desktop mode, hide the menu\r\n        if(this.config.dismissOnResizeToMobile && navClientRect.width < this.config.desktopBreakpoint){\r\n            this._hidePanel();\r\n            return;\r\n        }\r\n\r\n        //Add a buffer to top edge so that on resize we dont see a gap between top bar and side nav\r\n        rootEl.style['top'] = (navClientRect.bottom - this.config.menuTopBuffer) + 'px';\r\n        rootEl.style['paddingTop'] = this.config.menuTopBuffer + 'px';\r\n        rootEl.style['right'] = 0;\r\n        rootEl.style['left'] = 'auto';\r\n        rootEl.style['width'] = navClientRect.width + 'px';\r\n        rootEl.style['bottom'] = 0;\r\n    }\r\n}\r\n\r\n/**\r\n *\r\n * @returns {MobileNavigation}\r\n */\r\nSidePanel.create = function(){\r\n    return new SidePanel();\r\n};"],"mappings":"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"}