@odopod/odo-dual-viewer/dist/odo-dual-viewer.min.js

A draggable UI component which reveals two panes.

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("tiny-emitter"),require("@odopod/odo-helpers"),require("@odopod/odo-draggable"),require("@odopod/odo-window-events"),require("@odopod/odo-object-fit")):"function"==typeof define&&define.amd?define(["tiny-emitter","@odopod/odo-helpers","@odopod/odo-draggable","@odopod/odo-window-events","@odopod/odo-object-fit"],e):t.OdoDualViewer=e(t.TinyEmitter,t.OdoHelpers,t.OdoDraggable,t.OdoWindowEvents,t.OdoObjectFit)}(this,function(t,e,i,s,o){"use strict";t=t&&t.hasOwnProperty("default")?t.default:t,i=i&&i.hasOwnProperty("default")?i.default:i,s=s&&s.hasOwnProperty("default")?s.default:s,o=o&&o.hasOwnProperty("default")?o.default:o;var n=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")},r=function(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e},a=function(t){function a(e,i){n(this,a);var s=r(this,t.call(this));return s.element=e,s.options=Object.assign({},a.Defaults,i),s._isVertical=s.options.isVertical,s._scrubberEl=null,s._overlayEl=null,s._underlayEl=null,s._overlayObjectEl=null,s._draggable=null,s._scrubberLimits=null,s._dragAxis=s._isVertical?"y":"x",s._dimensionAttr=s._isVertical?"height":"width",s._previousPercent=s.options.startPosition,s._position=a.Position.CENTER,s._isResting=!0,s.decorate(),s}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}(a,t),a.prototype.getElementByClass=function(t){return this.element.querySelector("."+t)},a.prototype.getElementsByClass=function(t){return this.element.querySelectorAll("."+t)},a.prototype.decorate=function(){this._scrubberEl=this.getElementByClass(a.ClassName.SCRUBBER),this._overlayEl=this.getElementByClass(a.ClassName.OVERLAY),this._underlayEl=this.getElementByClass(a.ClassName.UNDERLAY),this._overlayObjectEl=this._overlayEl.firstElementChild,this._draggable=new i(this._scrubberEl,{axis:this._dragAxis}),this.element.classList.toggle(a.ClassName.VERTICAL,this._isVertical),this.element.classList.add(a.ClassName.CENTERED),this._setupHandlers(),this._saveContainerSize(),this._saveScrubberLimits(),o.cover(this.getElementsByClass(a.ClassName.MEDIA)),this._draggable.setLimits(this._scrubberLimits),this.setPosition(this.options.startPosition)},a.prototype._setupHandlers=function(){this._resizeId=s.onResize(this.reset.bind(this)),this._onMove=this._handleDragMove.bind(this),this._onEnd=this._handleDragEnd.bind(this),this._draggable.on(i.EventType.MOVE,this._onMove),this._draggable.on(i.EventType.END,this._onEnd)},a.prototype._saveScrubberLimits=function(){var t=void 0;if(this._isVertical){var i=this._containerHeight*this.options.verticalSafeZone,s=this._containerHeight*(1-2*this.options.verticalSafeZone);t=new e.Rect(0,i,this._containerWidth,s)}else{var o=this.getElementByClass(a.ClassName.SCRUBBER_CONTAINER),n=this.element.getBoundingClientRect(),r=o.getBoundingClientRect();t=new e.Rect(Math.round(r.left-n.left),o.offsetTop,o.offsetWidth,this._containerHeight)}this._scrubberLimits=t},a.prototype.getPosition=function(){return this._position},a.prototype.setPosition=function(t){this._draggable.setPosition(100*t,100*t),this._reveal(t)},a.prototype._getLimitedPercent=function(t){var i=this._scrubberLimits,s=void 0,o=void 0;return this._isVertical?(s=i.top/this._containerHeight,o=(i.top+i.height)/this._containerHeight):(s=i.left/this._containerWidth,o=(i.left+i.width)/this._containerWidth),e.clamp(t,s,o)},a.prototype._saveContainerSize=function(){this._containerWidth=this.element.offsetWidth,this._containerHeight=this.element.offsetHeight},a.prototype._removeStateClasses=function(){this.element.classList.remove(a.ClassName.START,a.ClassName.END,a.ClassName.CENTERED),this._isResting=!1},a.prototype._reveal=function(t){this._overlayEl.style[this._dimensionAttr]=100*t+"%",this._overlayObjectEl.style[this._dimensionAttr]=100/t+"%"},a.prototype.reset=function(){this._saveContainerSize(),this._saveScrubberLimits(),o.cover(this.getElementsByClass(a.ClassName.MEDIA)),this._draggable.setLimits(this._scrubberLimits);var t=100*this._previousPercent;this._draggable.setPosition(t,t),this._reveal(this._getLimitedPercent(this._previousPercent))},a.prototype._handleDragMove=function(t){this._isResting&&(this._removeStateClasses(),this._position=a.Position.BETWEEN);var e=t.position.percent[this._dragAxis]/100;this._previousPercent=e,this._reveal(e)},a.prototype._handleDragEnd=function(t){if(this.options.hasZones){var e=t.position.percent[this._dragAxis]/100;this._position=this._getZone(e);var i=null;switch(this._position){case a.Position.START:i=0;break;case a.Position.CENTER:i=.5;break;case a.Position.END:i=1}null!==i&&this.animateTo(i)}},a.prototype._getZone=function(t){return t>0&&t<this.options.zones[0]?a.Position.START:t<1&&t>this.options.zones[3]?a.Position.END:t>=this.options.zones[1]&&t<=this.options.zones[2]?a.Position.CENTER:a.Position.BETWEEN},a.prototype.animateTo=function(t){var i=this._getLimitedPercent(t);i!==this._previousPercent&&(this._position=this._getZone(i),this._removeStateClasses(),new e.Stepper({start:this._previousPercent,end:i,duration:this.options.animationDuration,step:this._animateStep,context:this}).onfinish=this._didComeToRest)},a.prototype._animateStep=function(t){this._draggable.setPosition(100*t,100*t),this._reveal(t)},a.prototype._didComeToRest=function(){this._previousPercent=this._draggable.getPosition(!0)[this._dragAxis]/100,this._isResting=!0,this.element.classList.toggle(a.ClassName.START,this._position===a.Position.START),this.element.classList.toggle(a.ClassName.END,this._position===a.Position.END),this.element.classList.toggle(a.ClassName.CENTERED,this._position===a.Position.CENTER),this.emit(a.EventType.CAME_TO_REST,{position:this.getPosition()})},a.prototype.dispose=function(){s.remove(this._resizeId),this._draggable.off(i.EventType.MOVE,this._onMove),this._draggable.off(i.EventType.END,this._onEnd),this._draggable.dispose(),this.element.classList.remove(a.ClassName.CENTERED,a.ClassName.VERTICAL),this.element=null,this._scrubberEl=null,this._overlayObjectEl=null,this._overlayEl=null,this._underlayEl=null},a}(t);return Object.assign(a,{Position:{START:0,CENTER:1,END:2,BETWEEN:3},ClassName:{VERTICAL:"odo-dual-viewer--vertical",INNER:"odo-dual-viewer__inner",SCRUBBER_CONTAINER:"odo-dual-viewer__scrubber-bounds",SCRUBBER:"odo-dual-viewer__scrubber",OVERLAY:"odo-dual-viewer__overlay",UNDERLAY:"odo-dual-viewer__underlay",MEDIA:"odo-dual-viewer__media",GRABBING:"grabbing",CENTERED:"is-centered",START:"is-start",END:"is-end"},EventType:{CAME_TO_REST:"ododualviewer:handlecametorest"},Defaults:{startPosition:.5,isVertical:!1,animationDuration:300,verticalSafeZone:.1,hasZones:!0,zones:[.33,.33,.66,.66]}}),a});
//# sourceMappingURL=odo-dual-viewer.min.js.map