{"version":3,"file":"./modules/DraggableElement.xxxxxxxx.js","mappings":"wIAGe,MAAMA,EAYjB,WAAAC,CAAYC,EAAgCC,GACxCC,KAAKC,iBAAsD,iBAAbH,EAAwBI,SAASC,cAAcL,GAAYA,EAGzGC,EAAUC,KAAKI,aADA,CAAEC,MAAO,KAAMC,OAAQ,OACAP,GAEtCC,KAAKK,MAAqBL,KAAKC,iBAAiBE,cAAcJ,EAAQM,OACtEL,KAAKO,WAAaC,KAAKC,KACnBC,MAAMC,KAAKX,KAAKK,MAAMO,iBAAiBb,EAAQM,MAAQ,IAAMN,EAAQO,SACpEO,IAAMC,GAAgBA,EAAQC,aAC9BC,OAAO,CAACC,EAAGC,IAAeD,EAAIC,IAGnClB,KAAKmB,MAAO,EACZnB,KAAKoB,MAAO,EAEZpB,KAAKqB,QAAU,EAEfrB,KAAKsB,SAAW,EAChBtB,KAAKuB,MAAQ,CACjB,CAEA,KAAAC,GACI,IAAIC,EAAS,IAAIC,OAAOC,QAAS3B,KAAKC,kBAatC,OAXAwB,EAAOG,IAAI,IAAIF,OAAOG,IAAI,CACtBC,UAAWJ,OAAOK,qBAClBC,UAAW,KAGfP,EAAOQ,GAAG,UAAYC,GAAUlC,KAAKmC,KAAKD,IAC1CT,EAAOQ,GAAG,mBAAqBC,GAAUlC,KAAKoC,QAAQF,IAK/ClC,IACX,CAEA,IAAAmC,CAAKD,GACIlC,KAAKmB,MAASe,EAAMJ,WAAaJ,OAAOW,cAAgBH,EAAMJ,WAAaJ,OAAOY,iBACnFtC,KAAKoB,MAAO,GAEXpB,KAAKoB,MAASc,EAAMJ,WAAaJ,OAAOa,gBAAkBL,EAAMJ,WAAaJ,OAAOc,kBACrFxC,KAAKmB,MAAO,EACZnB,KAAKyC,UAAUP,EAAMQ,QAE7B,CAEA,SAAAD,CAAUC,GACN,IAAIC,EAAanC,KAAKoC,IAAK5C,KAAKuB,MAAQmB,EAAQ1C,KAAKqB,SACrDrB,KAAKsB,SAAWd,KAAKqC,IAAKF,EAAY3C,KAAK8C,cAE3C9C,KAAKK,MAAM0C,MAAMC,UAAY,eAAehD,KAAKsB,iBACrD,CAEA,UAAAwB,GACK,OAAOtC,KAAKoC,IAAI5C,KAAKC,iBAAiBc,YAAcf,KAAKO,WAAYP,KAAKqB,QAC/E,CAEA,OAAAe,CAAQF,GACJlC,KAAKuB,MAAQvB,KAAKsB,SAClBtB,KAAKmB,MAAO,EACZnB,KAAKoB,MAAO,CAChB,CAEA,YAAAhB,CAAa6C,EAAelD,GACxB,IAAImD,EAEJ,GAAInD,EACA,IACImD,EAAmBC,KAAKC,MAAMrD,EAClC,CAAE,MAAMsD,GACJC,QAAQC,KAAK,mBACjB,CAGJ,MAAmC,iBAArBL,EACVM,OAAOC,OAAOR,EAAUC,GACxBD,CACR,E","sources":["webpack:///./modules/DraggableElement.ts"],"sourcesContent":["\r\nimport 'hammerjs/hammer.min.js';\r\n\r\nexport default class DraggableElement {\r\n    draggableElement: HTMLElement;\r\n    slide: HTMLElement;\r\n    slideWidth: number;\r\n\r\n    hPan: boolean;\r\n    vPan: boolean;\r\n\r\n    minDrag: number;\r\n    currentX: number;\r\n    lastX: number;\r\n\r\n    constructor(selector: string | HTMLElement, options?: IDraggableElementOptions) {\r\n        this.draggableElement = <HTMLElement> (typeof selector === 'string' ? document.querySelector(selector) : selector);\r\n\r\n        let defaults = { slide: 'ul', slides: '> *' };\r\n        options = this.mergeOptions(defaults, options);\r\n\r\n        this.slide = <HTMLElement>this.draggableElement.querySelector(options.slide);\r\n        this.slideWidth = Math.ceil(\r\n            Array.from(this.slide.querySelectorAll(options.slide + ' ' + options.slides))\r\n            .map( (element:any) => element.offsetWidth)\r\n            .reduce((a, b) => { return a + b; })\r\n        );\r\n\r\n        this.hPan = false;\r\n        this.vPan = false;\r\n\r\n        this.minDrag = 0;\r\n\r\n        this.currentX = 0;\r\n        this.lastX = 0;\r\n    }\r\n\r\n    setup(): DraggableElement {\r\n        let hammer = new Hammer.Manager( this.draggableElement );\r\n        \r\n        hammer.add(new Hammer.Pan({\r\n            direction: Hammer.DIRECTION_HORIZONTAL,\r\n            threshold: 0\r\n        }));\r\n\r\n        hammer.on('panmove', (event) => this.drag(event) );\r\n        hammer.on('panend pancancel', (event) => this.dragEnd(event) );\r\n\r\n        //let mediaQueryList = window.matchMedia('(orientation: portrait)');\r\n        //mediaQueryList.addListener(() => this.translate(0));\r\n\r\n        return this;\r\n    }\r\n\r\n    drag(event: HammerInput) {\r\n        if (!this.hPan && (event.direction == Hammer.DIRECTION_UP || event.direction == Hammer.DIRECTION_DOWN)) {\r\n            this.vPan = true;\r\n        }\r\n        if (!this.vPan && (event.direction == Hammer.DIRECTION_LEFT || event.direction == Hammer.DIRECTION_RIGHT)) {\r\n            this.hPan = true;\r\n            this.translate(event.deltaX);\r\n        }\r\n    }\r\n\r\n    translate(deltaX: number): void {\r\n        let calcDeltaX = Math.min( this.lastX + deltaX, this.minDrag );\r\n        this.currentX = Math.max( calcDeltaX, this.getMaxDrag()); \r\n\r\n        this.slide.style.transform = `translate3d(${this.currentX}px,0,0)`;\r\n    }\r\n\r\n    getMaxDrag(): number {\r\n         return Math.min(this.draggableElement.offsetWidth - this.slideWidth, this.minDrag);\r\n    }\r\n\r\n    dragEnd(event) {\r\n        this.lastX = this.currentX;\r\n        this.hPan = false;\r\n        this.vPan = false;\r\n    }\r\n\r\n    mergeOptions(defaults: any, options: any): any {\r\n        let optionsFromOuter;   \r\n\r\n        if (options) {\r\n            try {\r\n                optionsFromOuter = JSON.parse(options);\r\n            } catch(e) {\r\n                console.warn(`bad data-options`);\r\n            }\r\n        }\r\n\r\n        return typeof optionsFromOuter === 'object' ? \r\n            Object.assign(defaults, optionsFromOuter) : \r\n            defaults;\r\n    }\r\n}\r\n"],"names":["DraggableElement","constructor","selector","options","this","draggableElement","document","querySelector","mergeOptions","slide","slides","slideWidth","Math","ceil","Array","from","querySelectorAll","map","element","offsetWidth","reduce","a","b","hPan","vPan","minDrag","currentX","lastX","setup","hammer","Hammer","Manager","add","Pan","direction","DIRECTION_HORIZONTAL","threshold","on","event","drag","dragEnd","DIRECTION_UP","DIRECTION_DOWN","DIRECTION_LEFT","DIRECTION_RIGHT","translate","deltaX","calcDeltaX","min","max","getMaxDrag","style","transform","defaults","optionsFromOuter","JSON","parse","e","console","warn","Object","assign"],"sourceRoot":""}