@hugogo/angular-grid-layout-hugo
Version:
Grid Layout with draggable and resizable items for Angular
16 lines (14 loc) • 25.6 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("rxjs"),require("rxjs/operators"),require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("@hugogo/angular-grid-layout-hugo",["exports","rxjs","rxjs/operators","@angular/core","@angular/common"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self).hugogo=e.hugogo||{},e.hugogo["angular-grid-layout-hugo"]={}),e.rxjs,e.rxjs.operators,e.ng.core,e.ng.common)}(this,(function(e,t,n,r,i){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */Object.create;function o(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],r=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&r>=e.length&&(e=void 0),{value:e&&e[r++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function a(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var r,i,o=n.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(r=o.next()).done;)a.push(r.value)}catch(e){i={error:e}}finally{try{r&&!r.done&&(n=o.return)&&n.call(o)}finally{if(i)throw i.error}}return a}function s(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(a(arguments[t]));return e}Object.create;function u(e){for(var t,n=0,r=0,i=e.length;r<i;r++)(t=e[r].y+e[r].h)>n&&(n=t);return n}function l(e){var t={w:e.w,h:e.h,x:e.x,y:e.y,id:e.id,moved:!!e.moved,static:!!e.static};return void 0!==e.minW&&(t.minW=e.minW),void 0!==e.maxW&&(t.maxW=e.maxW),void 0!==e.minH&&(t.minH=e.minH),void 0!==e.maxH&&(t.maxH=e.maxH),void 0!==e.isDraggable&&(t.isDraggable=e.isDraggable),void 0!==e.isResizable&&(t.isResizable=e.isResizable),t}function c(e,t){return e.id!==t.id&&(!(e.x+e.w<=t.x)&&(!(e.x>=t.x+t.w)&&(!(e.y+e.h<=t.y)&&!(e.y>=t.y+t.h))))}function d(e,t,n){for(var r=m(e),i=b(e,t),o=Array(e.length),a=0,s=i.length;a<s;a++){var u=l(i[a]);u.static||(u=f(r,u,t,n,i),r.push(u)),o[e.indexOf(i[a])]=u,u.moved=!1}return o}var p={x:"w",y:"h"};function h(e,t,n,r){var i=p[r];t[r]+=1;for(var o=e.map((function(e){return e.id})).indexOf(t.id)+1;o<e.length;o++){var a=e[o];if(!a.static){if(a.y>t.y+t.h)break;c(t,a)&&h(e,a,n+t[i],r)}}t[r]=n}function f(e,t,n,r,i){var o,a="horizontal"===n;if("vertical"===n)for(t.y=Math.min(u(e),t.y);t.y>0&&!g(e,t);)t.y--;else if(a)for(t.y=Math.min(u(e),t.y);t.x>0&&!g(e,t);)t.x--;for(;o=g(e,t);)a?h(i,t,o.x+o.w,"x"):h(i,t,o.y+o.h,"y"),a&&t.x+t.w>r&&(t.x=r-t.w,t.y++);return t}function g(e,t){for(var n=0,r=e.length;n<r;n++)if(c(e[n],t))return e[n];return null}function m(e){return e.filter((function(e){return e.static}))}function y(e,t,n,r,i,o,a,s){if(t.static&&!0!==t.isDraggable)return e;if(t.y===r&&t.x===n)return e;w("Moving element "+t.id+" to ["+String(n)+","+String(r)+"] from ["+t.x+","+t.y+"]");var u=t.x,l=t.y;"number"==typeof n&&(t.x=n),"number"==typeof r&&(t.y=r),t.moved=!0;var d=b(e,a);("vertical"===a&&"number"==typeof r?l>=r:"horizontal"===a&&"number"==typeof n&&u>=n)&&(d=d.reverse());var p=function(e,t){return e.filter((function(e){return c(e,t)}))}(d,t);if(o&&p.length)return w("Collision prevented on "+t.id+", reverting."),t.x=u,t.y=l,t.moved=!1,e;for(var h=0,f=p.length;h<f;h++){var g=p[h];w("Resolving collision between "+t.id+" at ["+t.x+","+t.y+"] and "+g.id+" at ["+g.x+","+g.y+"]"),g.moved||(e=g.static?v(e,g,t,i,a,s):v(e,t,g,i,a,s))}return e}function v(e,t,n,r,i,o){var a="horizontal"===i,s="horizontal"!==i,u=t.static;if(r){r=!1;var l={x:a?Math.max(t.x-n.w,0):n.x,y:s?Math.max(t.y-n.h,0):n.y,w:n.w,h:n.h,id:"-1"};if(!g(e,l))return w("Doing reverse collision on "+n.id+" up to ["+l.x+","+l.y+"]."),y(e,n,a?l.x:void 0,s?l.y:void 0,r,u,i,o)}return y(e,n,a?n.x+1:void 0,s?n.y+1:void 0,r,u,i,o)}function b(e,t){return"horizontal"===t?function(e){return[].concat(e).sort((function(e,t){return e.x>t.x||e.x===t.x&&e.y>t.y?1:-1}))}(e):function(e){return[].concat(e).sort((function(e,t){return e.y>t.y||e.y===t.y&&e.x>t.x?1:e.y===t.y&&e.x===t.x?0:-1}))}(e)}function w(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t]}var x;function E(e){return function(){if(null==x&&"undefined"!=typeof window)try{window.addEventListener("test",null,Object.defineProperty({},"passive",{get:function(){return x=!0}}))}finally{x=x||!1}return x}()?e:!!e.capture}var S=E({passive:!0}),_=E({passive:!1}),R=null;function D(){if(null!=R)return R;var e=/Android|webOS|BlackBerry|Windows Phone|iPad|iPhone|iPod/i.test(navigator.userAgent),t=/iPad|iPhone|iPod/.test(navigator.platform)||"MacIntel"===navigator.platform&&navigator.maxTouchPoints>1;return R=e||t}function I(e){return null!=e.clientX}function z(e){return I(e)?e.clientX:e.touches[0].clientX}function O(e){return I(e)?e.clientY:e.touches[0].clientY}function C(e){return{clientX:I(e)?e.clientX:e.touches[0].clientX,clientY:I(e)?e.clientY:e.touches[0].clientY}}function j(e,r){return void 0===r&&(r=1),t.iif((function(){return D()}),t.fromEvent(e,"touchstart",S).pipe(n.filter((function(e){return e.touches.length===r}))),t.fromEvent(e,"mousedown",_).pipe(n.filter((function(e){return 0===e.button}))))}function M(e,r){return void 0===r&&(r=1),t.iif((function(){return D()}),function(e,r){return void 0===r&&(r=1),t.merge(t.fromEvent(e,"touchend").pipe(n.filter((function(e){return e.touches.length===r-1}))),t.fromEvent(e,"touchcancel").pipe(n.filter((function(e){return e.touches.length===r-1}))))}(e,r),t.fromEvent(e,"mouseup"))}function P(e,t,n){return Math.round(e*t/n)}function T(e,t,n){return Math.round(e/t)}function H(e,t,n,r){var i=r.pointerDownEvent,o=r.pointerDragEvent,a=r.gridElemClientRect,s=r.dragElemClientRect,u=r.scrollDifference,l=t.layout.find((function(t){return t.id===e})),c=z(i),p=O(i),h=z(o),f=O(o),g=c-s.left,m=p-s.top,v=h-(a.left+u.left)-g,b=f-(a.top+u.top)-m,w=Object.assign(Object.assign({},l),{x:P(v,t.cols,a.width),y:T(b,t.rowHeight,a.height)});w.x=Math.max(0,w.x),w.y=Math.max(0,w.y),w.x+w.w>t.cols&&(w.x=Math.max(0,t.cols-w.w));var x=t.layout,E=x.find((function(t){return t.id===e})),S=y(x,E,w.x,w.y,!0,t.preventCollision,n,t.cols);return{layout:S=d(S,n,t.cols),draggedItemPos:{top:b,left:v,width:s.width,height:s.height}}}function k(e,t,n,r){var i=r.pointerDownEvent,o=r.pointerDragEvent,a=r.gridElemClientRect,s=r.dragElemClientRect,u=r.scrollDifference,l=z(i),c=O(i),p=z(o),h=O(o),f=s.width-(l-s.left),g=s.height-(c-s.top),m=t.layout.find((function(t){return t.id===e})),y=p+f-(s.left+u.left),v=h+g-(s.top+u.top),b=Object.assign(Object.assign({},m),{w:P(y,t.cols,a.width),h:T(v,t.rowHeight,a.height)});if(b.w=Math.max(1,b.w),b.h=Math.max(1,b.h),b.x+b.w>t.cols&&(b.w=Math.max(1,t.cols-b.x)),t.preventCollision){for(var w=b.w,x=b.h,E=G(t.layout,b),S=void 0;E;)S=N(b,S),b[S]--,E=G(t.layout,b);if("w"===S)for(b.h=x,E=G(t.layout,b);E;)b.h--,E=G(t.layout,b);if("h"===S)for(b.w=w,E=G(t.layout,b);E;)b.w--,E=G(t.layout,b)}return{layout:d(t.layout.map((function(t){return t.id===e?b:t})),n,t.cols),draggedItemPos:{top:s.top-a.top,left:s.left-a.left,width:y,height:v}}}function G(e,t){return!!g(e,t)}function N(e,t){return e.h<=1?"w":e.w<=1||"w"===t?"h":"w"}var $=new r.InjectionToken("KtdGridDragHandle"),A=function(e){this.element=e};A.decorators=[{type:r.Directive,args:[{selector:"[ktdGridDragHandle]",host:{class:"ktd-grid-drag-handle"},providers:[{provide:$,useExisting:A}]}]}],A.ctorParameters=function(){return[{type:r.ElementRef}]};var W=new r.InjectionToken("KtdGridResizeHandle"),X=function(e){this.element=e};X.decorators=[{type:r.Directive,args:[{selector:"[ktdGridResizeHandle]",host:{class:"ktd-grid-resize-handle"},providers:[{provide:W,useExisting:X}]}]}],X.ctorParameters=function(){return[{type:r.ElementRef}]};var Z=new r.InjectionToken("GRID_ITEM_GET_RENDER_DATA_TOKEN"),Y=E({passive:!1,capture:!0}),B=function(){function e(e){this.ngZone=e,this.touchMoveSubject=new t.Subject,this.touchMove$=this.touchMoveSubject.asObservable(),this.registerTouchMoveSubscription()}return e.prototype.ngOnDestroy=function(){this.touchMoveSubscription.unsubscribe()},e.prototype.mouseOrTouchMove$=function(e){return t.iif((function(){return D()}),this.touchMove$,t.fromEvent(e,"mousemove",Y))},e.prototype.registerTouchMoveSubscription=function(){var e=this;this.touchMoveSubscription=this.ngZone.runOutsideAngular((function(){return t.fromEvent(document,"touchmove",Y).pipe(n.filter((function(e){return 1===e.touches.length}))).subscribe((function(t){return e.touchMoveSubject.next(t)}))}))},e}();function K(e){return null!=e&&""+e!="false"}function L(e,t){return void 0===t&&(t=0),function(e){return!isNaN(parseFloat(e))&&!isNaN(Number(e))}(e)?Number(e):t}B.ɵprov=r.ɵɵdefineInjectable({factory:function(){return new B(r.ɵɵinject(r.NgZone))},token:B,providedIn:"root"}),B.decorators=[{type:r.Injectable,args:[{providedIn:"root"}]}],B.ctorParameters=function(){return[{type:r.NgZone}]};var V=function(){function e(e,n,r,i,o){this.elementRef=e,this.gridService=n,this.renderer=r,this.ngZone=i,this.getItemRenderData=o,this.transition="transform 500ms ease, width 500ms ease, height 500ms ease",this._dragStartThreshold=0,this._draggable=!0,this._draggable$=new t.BehaviorSubject(this._draggable),this._resizable=!0,this._resizable$=new t.BehaviorSubject(this._resizable),this.dragStartSubject=new t.Subject,this.resizeStartSubject=new t.Subject,this.subscriptions=[],this.dragStart$=this.dragStartSubject.asObservable(),this.resizeStart$=this.resizeStartSubject.asObservable()}return Object.defineProperty(e.prototype,"id",{get:function(){return this._id},set:function(e){this._id=e},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"dragStartThreshold",{get:function(){return this._dragStartThreshold},set:function(e){this._dragStartThreshold=L(e)},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"draggable",{get:function(){return this._draggable},set:function(e){this._draggable=K(e),this._draggable$.next(this._draggable)},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"resizable",{get:function(){return this._resizable},set:function(e){this._resizable=K(e),this._resizable$.next(this._resizable)},enumerable:!1,configurable:!0}),e.prototype.ngOnInit=function(){var e=this.getItemRenderData(this.id);this.setStyles(e)},e.prototype.ngAfterContentInit=function(){this.subscriptions.push(this._dragStart$().subscribe(this.dragStartSubject),this._resizeStart$().subscribe(this.resizeStartSubject))},e.prototype.ngOnDestroy=function(){this.subscriptions.forEach((function(e){return e.unsubscribe()}))},e.prototype.setStyles=function(e){var t=e.top,n=e.left,r=e.width,i=e.height;this.renderer.setStyle(this.elementRef.nativeElement,"transform","translateX("+n+") translateY("+t+")"),this.renderer.setStyle(this.elementRef.nativeElement,"display","block"),this.renderer.setStyle(this.elementRef.nativeElement,"transition",this.transition),null!=r&&this.renderer.setStyle(this.elementRef.nativeElement,"width",r),null!=i&&this.renderer.setStyle(this.elementRef.nativeElement,"height",i)},e.prototype._dragStart$=function(){var e=this;return this._draggable$.pipe(n.switchMap((function(r){return r?e._dragHandles.changes.pipe(n.startWith(e._dragHandles),n.switchMap((function(r){return t.iif((function(){return r.length>0}),t.merge.apply(void 0,s(r.toArray().map((function(e){return j(e.element.nativeElement,1)})))),j(e.elementRef.nativeElement,1)).pipe(n.exhaustMap((function(r){r.target&&r.target.draggable&&"mousedown"===r.type&&r.preventDefault();var i,o=C(r);return e.gridService.mouseOrTouchMove$(document).pipe(n.takeUntil(M(document,1)),(i=e.ngZone,function(e){return new t.Observable((function(t){return i.runOutsideAngular((function(){return e.subscribe(t)}))}))}),n.filter((function(t){t.preventDefault();var n=C(t);return Math.abs(o.clientX-n.clientX)+Math.abs(o.clientY-n.clientY)>=e.dragStartThreshold})),n.take(1),n.map((function(){return r})))})))}))):t.NEVER})))},e.prototype._resizeStart$=function(){var e=this;return this._resizable$.pipe(n.switchMap((function(r){return r?e._resizeHandles.changes.pipe(n.startWith(e._resizeHandles),n.switchMap((function(n){return n.length>0?(e.renderer.setStyle(e.resizeElem.nativeElement,"display","none"),t.merge.apply(void 0,s(n.toArray().map((function(e){return j(e.element.nativeElement,1)}))))):(e.renderer.setStyle(e.resizeElem.nativeElement,"display","block"),j(e.resizeElem.nativeElement,1))}))):(e.renderer.setStyle(e.resizeElem.nativeElement,"display","none"),t.NEVER)})))},e}();function F(e){var t=e.getBoundingClientRect();return{top:t.top,right:t.right,bottom:t.bottom,left:t.left,width:t.width,height:t.height}}V.decorators=[{type:r.Component,args:[{selector:"ktd-grid-item",template:'<ng-content></ng-content>\n<div #resizeElem class="grid-item-resize-icon"></div>\n',changeDetection:r.ChangeDetectionStrategy.OnPush,styles:[':host{display:none;overflow:hidden;z-index:1}:host,:host div{position:absolute}:host div{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;z-index:10}:host div.grid-item-resize-icon{bottom:0;color:inherit;cursor:se-resize;height:20px;right:0;width:20px}:host div.grid-item-resize-icon:after{border-bottom:2px solid;border-right:2px solid;bottom:3px;content:"";height:5px;position:absolute;right:3px;width:5px}.display-none{display:none!important}']}]}],V.ctorParameters=function(){return[{type:r.ElementRef},{type:B},{type:r.Renderer2},{type:r.NgZone},{type:void 0,decorators:[{type:r.Inject,args:[Z]}]}]},V.propDecorators={_dragHandles:[{type:r.ContentChildren,args:[$,{descendants:!0}]}],_resizeHandles:[{type:r.ContentChildren,args:[W,{descendants:!0}]}],resizeElem:[{type:r.ViewChild,args:["resizeElem",{static:!0,read:r.ElementRef}]}],transition:[{type:r.Input}],id:[{type:r.Input}],dragStartThreshold:[{type:r.Input}],draggable:[{type:r.Input}],resizable:[{type:r.Input}]};function U(e,t){e===window?e.scrollBy(0,t):e.scrollTop+=t}function q(e,t){e===window?e.scrollBy(t,0):e.scrollLeft+=t}function J(e,r,i,o){return void 0===o&&(o=2),t.interval(0,t.animationFrameScheduler).pipe(n.tap((function(){1===r?U(e,-o):2===r&&U(e,o),1===i?q(e,-o):2===i&&q(e,o)})),(function(e){return e.pipe(n.filter((function(){return!1})))}))}function Q(e,r){var i,o,a;if(e===document){i=document.defaultView;var s=te(),u=s.width,l=s.height;o={width:u,height:l,top:0,right:u,bottom:l,left:0},a=Math.max(document.body.scrollWidth,document.documentElement.scrollWidth)}else i=e,o=F(e),a=e.scrollWidth;return null==(r=r||{}).disableHorizontal&&a<=o.width&&(r.disableHorizontal=!0),function(e){return e.pipe(n.map((function(e){var t=e.pointerX,n=e.pointerY,i=function(e,t){var n=e.top,r=e.bottom,i=.05*e.height;return t>=n-i&&t<=n+i?1:t>=r-i&&t<=r+i?2:0}(o,n),a=function(e,t){var n=e.left,r=e.right,i=.05*e.width;return t>=n-i&&t<=n+i?1:t>=r-i&&t<=r+i?2:0}(o,t);return(null==r?void 0:r.disableVertical)&&(i=0),(null==r?void 0:r.disableHorizontal)&&(a=0),{verticalScrollDirection:i,horizontalScrollDirection:a}})),n.distinctUntilChanged((function(e,t){return e.verticalScrollDirection===t.verticalScrollDirection&&e.horizontalScrollDirection===t.horizontalScrollDirection})),n.switchMap((function(e){var n=e.verticalScrollDirection,o=e.horizontalScrollDirection;return n||o?J(i,n,o,null==r?void 0:r.scrollStep):t.NEVER})))}}function ee(e){var r;return r=e===document?ne():{top:e.scrollTop,left:e.scrollLeft},t.fromEvent(e,"scroll",E({capture:!0})).pipe(n.map((function(){var t,n;if(e===document){var i=ne();t=i.top,n=i.left}else t=e.scrollTop,n=e.scrollLeft;return{top:r.top-t,left:r.left-n}})))}function te(){var e=document.defaultView||window;return{width:e.innerWidth,height:e.innerHeight}}function ne(){var e=document.defaultView||window,t=document.documentElement,n=t.getBoundingClientRect();return{top:-n.top||document.body.scrollTop||e.scrollY||t.scrollTop||0,left:-n.left||document.body.scrollLeft||e.scrollX||t.scrollLeft||0}}function re(e,t){return{layout:t,layoutItem:t.find((function(t){return t.id===e.id})),gridItemRef:e}}function ie(e,t,n){var r,i,a=e.cols,s=e.rowHeight,u=e.layout,l={};try{for(var c=o(u),d=c.next();!d.done;d=c.next()){var p=d.value;l[p.id]={id:p.id,top:0===p.y?0:p.y*s,left:p.x*(t/a),width:p.w*(t/a),height:p.h*s}}}catch(e){r={error:e}}finally{try{d&&!d.done&&(i=c.return)&&i.call(c)}finally{if(r)throw r.error}}return l}function oe(e,t){return e.reduce((function(e,n){return Math.max(e,(n.y+n.h)*t)}),0)}function ae(e){return{id:e.id,top:e.top+"px",left:e.left+"px",width:e.width+"px",height:e.height+"px"}}function se(e){return function(t){return ae(e.getItemRenderData(t))}}function ue(e){return se(e)}var le=function(){function e(e,t,n,i){this.gridService=e,this.elementRef=t,this.renderer=n,this.ngZone=i,this.layoutUpdated=new r.EventEmitter,this.dragStarted=new r.EventEmitter,this.resizeStarted=new r.EventEmitter,this.dragEnded=new r.EventEmitter,this.resizeEnded=new r.EventEmitter,this.scrollableParent=null,this._compactOnPropsChange=!0,this._preventCollision=!1,this._scrollSpeed=2,this._compactType="vertical",this._rowHeight=100,this._cols=6}return Object.defineProperty(e.prototype,"compactOnPropsChange",{get:function(){return this._compactOnPropsChange},set:function(e){this._compactOnPropsChange=K(e)},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"preventCollision",{get:function(){return this._preventCollision},set:function(e){this._preventCollision=K(e)},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"scrollSpeed",{get:function(){return this._scrollSpeed},set:function(e){this._scrollSpeed=L(e,2)},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"compactType",{get:function(){return this._compactType},set:function(e){this._compactType=e},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"rowHeight",{get:function(){return this._rowHeight},set:function(e){this._rowHeight=Math.max(1,Math.round(L(e)))},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"cols",{get:function(){return this._cols},set:function(e){this._cols=Math.max(1,Math.round(L(e)))},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"layout",{get:function(){return this._layout},set:function(e){this._layout=e},enumerable:!1,configurable:!0}),Object.defineProperty(e.prototype,"config",{get:function(){return{cols:this.cols,rowHeight:this.rowHeight,layout:this.layout,preventCollision:this.preventCollision}},enumerable:!1,configurable:!0}),e.prototype.ngOnChanges=function(e){var t=!1,n=!1;(e.compactType||e.cols||e.layout)&&(t=!0),(t||e.rowHeight)&&(n=!0),t&&this.compactOnPropsChange&&this.compactLayout(),n&&this.calculateRenderData()},e.prototype.ngAfterContentInit=function(){this.initSubscriptions()},e.prototype.ngAfterContentChecked=function(){this.render()},e.prototype.resize=function(){this.calculateRenderData(),this.render()},e.prototype.ngOnDestroy=function(){this.subscriptions.forEach((function(e){return e.unsubscribe()}))},e.prototype.compactLayout=function(){this.layout=d(this.layout,this.compactType,this.cols)},e.prototype.getItemsRenderData=function(){return Object.assign({},this._gridItemsRenderData)},e.prototype.getItemRenderData=function(e){return this._gridItemsRenderData[e]},e.prototype.calculateRenderData=function(){var e=this.elementRef.nativeElement.getBoundingClientRect();this._gridItemsRenderData=ie(this.config,e.width,e.height),this._height=oe(this.layout,this.rowHeight)},e.prototype.render=function(){this.renderer.setStyle(this.elementRef.nativeElement,"height",this._height+"px"),this.updateGridItemsStyles()},e.prototype.updateGridItemsStyles=function(){var e=this;this._gridItems.forEach((function(t){var n=e._gridItemsRenderData[t.id];null==n?console.error("Couldn't find the specified grid item for the id: "+t.id):t.setStyles(ae(n))}))},e.prototype.initSubscriptions=function(){var e=this;this.subscriptions=[this._gridItems.changes.pipe(n.startWith(this._gridItems),n.switchMap((function(r){return t.merge.apply(void 0,s(r.map((function(e){return e.dragStart$.pipe(n.map((function(t){return{event:t,gridItem:e,type:"drag"}})))})),r.map((function(e){return e.resizeStart$.pipe(n.map((function(t){return{event:t,gridItem:e,type:"resize"}})))})))).pipe(n.exhaustMap((function(t){var r=t.event,i=t.gridItem,o=t.type;e.ngZone.run((function(){return("drag"===o?e.dragStarted:e.resizeStarted).emit(re(i,e.layout))}));var a="drag"===o?H:k;return e.performDragSequence$(i,r,(function(e,t,n,r){return a(e,t,n,r)})).pipe(n.map((function(e){return{layout:e,gridItem:i,type:o}})))})))}))).subscribe((function(t){var n=t.layout,r=t.gridItem,i=t.type;e.layout=n,e.calculateRenderData(),("drag"===i?e.dragEnded:e.resizeEnded).emit(re(r,n)),e.layoutUpdated.emit(n)}))]},e.prototype.performDragSequence$=function(e,r,i){var o=this;return new t.Observable((function(u){var l=F(o.elementRef.nativeElement),c=F(e.elementRef.nativeElement),d="string"==typeof o.scrollableParent?document.getElementById(o.scrollableParent):o.scrollableParent;o.renderer.addClass(e.elementRef.nativeElement,"no-transitions"),o.renderer.addClass(e.elementRef.nativeElement,"ktd-grid-item-dragging");var p,h=o.renderer.createElement("div");h.style.width=c.width+"px",h.style.height=c.height+"px",h.style.transform="translateX("+(c.left-l.left)+"px) translateY("+(c.top-l.top)+"px)",o.renderer.addClass(h,"ktd-grid-item-placeholder"),o.renderer.appendChild(o.elementRef.nativeElement,h);var f=o.ngZone.runOutsideAngular((function(){return(d?o.gridService.mouseOrTouchMove$(document).pipe(n.map((function(e){return{pointerX:z(e),pointerY:O(e)}})),Q(d,{scrollStep:o.scrollSpeed})):t.NEVER).pipe(n.takeUntil(M(document))).subscribe()})),g=o.ngZone.runOutsideAngular((function(){return t.merge(t.combineLatest(s([o.gridService.mouseOrTouchMove$(document)],d?[ee(d).pipe(n.startWith({top:0,left:0}))]:[t.of({top:0,left:0})]))).pipe(n.takeUntil(M(document))).subscribe((function(t){var n=a(t,2),s=n[0],u=n[1];s.preventDefault();var d=p||o.layout,f=i(e.id,{layout:d,rowHeight:o.rowHeight,cols:o.cols,preventCollision:o.preventCollision},o.compactType,{pointerDownEvent:r,pointerDragEvent:s,gridElemClientRect:l,dragElemClientRect:c,scrollDifference:u}),g=f.layout,m=f.draggedItemPos;p=g,o._height=oe(p,o.rowHeight),o._gridItemsRenderData=ie({cols:o.cols,rowHeight:o.rowHeight,layout:p,preventCollision:o.preventCollision},l.width,l.height);var y=ae(o._gridItemsRenderData[e.id]);h.style.width=y.width,h.style.height=y.height,h.style.transform="translateX("+y.left+") translateY("+y.top+")",o._gridItemsRenderData[e.id]=Object.assign(Object.assign({},m),{id:o._gridItemsRenderData[e.id].id}),o.render()}),(function(e){return u.error(e)}),(function(){o.ngZone.run((function(){o.renderer.removeClass(e.elementRef.nativeElement,"no-transitions"),o.renderer.removeClass(e.elementRef.nativeElement,"ktd-grid-item-dragging"),o.renderer.removeChild(o.elementRef.nativeElement,h),p?u.next(p.map((function(e){return{id:e.id,x:e.x,y:e.y,w:e.w,h:e.h}}))):u.next(o.layout),u.complete()}))}))}));return function(){f.unsubscribe(),g.unsubscribe()}}))},e}();le.decorators=[{type:r.Component,args:[{selector:"ktd-grid",template:"<ng-content></ng-content>\n",encapsulation:r.ViewEncapsulation.None,changeDetection:r.ChangeDetectionStrategy.OnPush,providers:[{provide:Z,useFactory:ue,deps:[le]}],styles:["ktd-grid{display:block;position:relative;width:100%}ktd-grid ktd-grid-item.ktd-grid-item-dragging{z-index:1000}ktd-grid ktd-grid-item.no-transitions{transition:none!important}ktd-grid .ktd-grid-item-placeholder{background-color:#8b0000;opacity:.6;position:absolute;transition:all .15s ease;transition-property:transform;z-index:0}"]}]}],le.ctorParameters=function(){return[{type:B},{type:r.ElementRef},{type:r.Renderer2},{type:r.NgZone}]},le.propDecorators={_gridItems:[{type:r.ContentChildren,args:[V,{descendants:!0}]}],layoutUpdated:[{type:r.Output}],dragStarted:[{type:r.Output}],resizeStarted:[{type:r.Output}],dragEnded:[{type:r.Output}],resizeEnded:[{type:r.Output}],scrollableParent:[{type:r.Input}],compactOnPropsChange:[{type:r.Input}],preventCollision:[{type:r.Input}],scrollSpeed:[{type:r.Input}],compactType:[{type:r.Input}],rowHeight:[{type:r.Input}],cols:[{type:r.Input}],layout:[{type:r.Input}]};var ce=function(){};ce.decorators=[{type:r.NgModule,args:[{declarations:[le,V,A,X],exports:[le,V,A,X],providers:[B],imports:[i.CommonModule]}]}],e.GRID_ITEM_GET_RENDER_DATA_TOKEN=Z,e.KTD_GRID_DRAG_HANDLE=$,e.KTD_GRID_RESIZE_HANDLE=W,e.KtdGridComponent=le,e.KtdGridDragHandle=A,e.KtdGridItemComponent=V,e.KtdGridModule=ce,e.KtdGridResizeHandle=X,e.__gridItemGetRenderDataFactoryFunc=se,e.ktdGridCompact=function(e,t,n){return d(e,t,n).map((function(e){return{id:e.id,x:e.x,y:e.y,w:e.w,h:e.h}}))},e.ktdGridItemGetRenderDataFactoryFunc=ue,e.ktdTrackById=function(e,t){return t.id},e.parseRenderItemToPixels=ae,e.ɵa=d,e.ɵb=B,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=hugogo-angular-grid-layout-hugo.umd.min.js.map