angular-resize-element/bundles/angular-resize-element.umd.min.js

An angular 4.0+ directive that allows an element to be resized

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core")):"function"==typeof define&&define.amd?define("angular-resize-element",["exports","@angular/core"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["angular-resize-element"]={},e.ng.core)}(this,(function(e,t){"use strict";var i;(i=e.AngularResizeElementDirection||(e.AngularResizeElementDirection={})).TOP="top",i.TOP_RIGHT="top-right",i.RIGHT="right",i.BOTTOM_RIGHT="bottom-right",i.BOTTOM="bottom",i.BOTTOM_LEFT="bottom-left",i.LEFT="left",i.TOP_LEFT="top-left";var r=function(){function i(e,i){this.elementRef=e,this.renderer2=i,this.applyClass="resizing",this.resizeStart=new t.EventEmitter,this.resize=new t.EventEmitter,this.resizeEnd=new t.EventEmitter,this.listenMouseDownEvent()}return i.prototype.ngOnChanges=function(e){e.useDrag&&this.listenMouseDownEvent()},i.prototype.ngOnDestroy=function(){this.mouseClickListener&&this.mouseClickListener(),this.mouseUpListener&&this.mouseUpListener(),this.mouseMoveListener&&this.mouseMoveListener()},i.prototype.listenMouseDownEvent=function(){var e=this;this.mouseClickListener&&this.mouseClickListener();var t=this.useDrag?"dragstart":"mousedown";this.mouseClickListener=this.renderer2.listen(this.elementRef.nativeElement,t,(function(t){return e.onMouseDown(t)}))},i.prototype.onMouseDown=function(e){var t=this;e.preventDefault(),this.setOriginalData(e),this.resizeStart.emit(this.generateValuesForEvent(e)),this.mouseUpListener=this.renderer2.listen("document","mouseup",(function(e){return t.onMouseUp(e)})),this.mouseMoveListener=this.renderer2.listen("document","mousemove",(function(e){return t.onMouseMove(e)})),this.renderer2.addClass(this.targetNativeElement,this.applyClass)},i.prototype.onMouseUp=function(e){var t=this.generateValuesForEvent(e);this.resize.emit(t),this.mouseMoveListener(),this.mouseUpListener(),this.renderer2.removeClass(this.targetNativeElement,this.applyClass),this.resizeEnd.emit(t)},i.prototype.onMouseMove=function(e){this.resize.emit(this.generateValuesForEvent(e))},i.prototype.setOriginalData=function(e){if(this.originalEvent=e,this.targetElement){var t=this.targetNativeElement;this.targetElementWidthValue=t.offsetWidth,this.targetElementHeightValue=t.offsetHeight,this.targetElementTopValue=t.offsetTop,this.targetElementLeftValue=t.offsetLeft}else this.targetElementWidthValue=0,this.targetElementHeightValue=0,this.targetElementTopValue=0,this.targetElementLeftValue=0},Object.defineProperty(i.prototype,"targetNativeElement",{get:function(){return this.targetElement instanceof t.ElementRef?this.targetElement.nativeElement:this.targetElement},enumerable:!1,configurable:!0}),i.prototype.generateValuesForEvent=function(t){var i=this.originalEvent.clientX,r=this.originalEvent.clientY,n=t.clientX-i,s=t.clientY-r,a=s,o=n;switch(this.direction){case e.AngularResizeElementDirection.TOP:s*=-1,n=0,o=0;break;case e.AngularResizeElementDirection.TOP_RIGHT:s*=-1,o=0;break;case e.AngularResizeElementDirection.RIGHT:s=0,a=0,o=0;break;case e.AngularResizeElementDirection.BOTTOM_RIGHT:a=0,o=0;break;case e.AngularResizeElementDirection.BOTTOM:n=0,o=0,a=0;break;case e.AngularResizeElementDirection.BOTTOM_LEFT:n*=-1,a=0;break;case e.AngularResizeElementDirection.LEFT:n*=-1,s=0,a=0;break;case e.AngularResizeElementDirection.TOP_LEFT:s*=-1,n*=-1}var l=this.targetElementWidthValue+n,u=this.targetElementHeightValue+s;this.proportionalResize&&(l>u?l=u:u=l),u<=1&&(a+=u),l<=1&&(o+=l),l<=0&&(l=0),u<=0&&(u=0);var h=this.targetElementTopValue+a,g=this.targetElementLeftValue+o;return this.rect&&(h<this.rect.top&&(u=this.targetElementHeightValue+this.targetElementTopValue-this.rect.top,h=this.rect.top),u+h>this.rect.height&&(u=this.rect.height-h),g<this.rect.left&&(l=this.targetElementWidthValue+this.targetElementLeftValue-this.rect.left,g=this.rect.left),l+g>this.rect.width&&(l=this.rect.width-g)),{originalEvent:this.originalEvent,currentWidthValue:l,currentHeightValue:u,currentTopValue:h,currentLeftValue:g,originalWidthValue:this.targetElementWidthValue,originalHeightValue:this.targetElementHeightValue,originalTopValue:this.targetElementTopValue,originalLeftValue:this.targetElementLeftValue,differenceWidthValue:l-this.targetElementWidthValue,differenceHeightValue:u-this.targetElementHeightValue,differenceTopValue:h-this.targetElementTopValue,differenceLeftValue:g-this.targetElementLeftValue,direction:this.direction}},i}();r.decorators=[{type:t.Directive,args:[{selector:"[resize], [resizeStart], [resizeEnd]"}]}],r.ctorParameters=function(){return[{type:t.ElementRef},{type:t.Renderer2}]},r.propDecorators={targetElement:[{type:t.Input}],direction:[{type:t.Input}],proportionalResize:[{type:t.Input}],rect:[{type:t.Input}],applyClass:[{type:t.Input}],resizeStart:[{type:t.Output}],resize:[{type:t.Output}],resizeEnd:[{type:t.Output}],useDrag:[{type:t.Input},{type:t.HostBinding,args:["attr.draggable"]}]};var n=function(){};n.decorators=[{type:t.NgModule,args:[{declarations:[r],imports:[],exports:[r]}]}],e.AngularResizeElementDirective=r,e.AngularResizeElementModule=n,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=angular-resize-element.umd.min.js.map