UNPKG

ngx-pinch-zoom

Version:
2 lines 9.98 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("ngx-pinch-zoom",["exports","@angular/core","@angular/common"],e):e(t["ngx-pinch-zoom"]={},t.ng.core,t.ng.common)}(this,function(t,e,i){"use strict";var s=function(){function t(t){this.elementRef=t,this.i=0,this.scale=1,this.initialScale=1,this.moveX=0,this.moveY=0,this.initialMoveX=0,this.initialMoveY=0,this.draggingMode=!1,this.lastTap=0,this.transitionDuration=200,this.autoZoomOut=!1,this.events=new e.EventEmitter}return Object.defineProperty(t.prototype,"id",{get:function(){return this._id},set:function(t){this._id=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isMobile",{get:function(){var t,e=!1;return t=navigator.userAgent||navigator.vendor,(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(t)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(t.substr(0,4)))&&(e=!0),e},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isDragging",{get:function(){var t=this.getImageHeight(),e=this.getImageWidth();return 1<this.scale?t*this.scale>this.parentElement.offsetHeight||e*this.scale>this.parentElement.offsetWidth:1===this.scale?t>this.parentElement.offsetHeight||e>this.parentElement.offsetWidth:void 0},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){this.element=this.contentElement.nativeElement,this.parentElement=this.elementRef.nativeElement,this.setBasicStyles()},t.prototype.onResize=function(t){this.setImageWidth(),this.transformElement(this.transitionDuration)},t.prototype.touchstartHandler=function(t){this.getElementPosition(),this.eventType||(this.startX=t.touches[0].clientX-this.elementPosition.left,this.startY=t.touches[0].clientY-this.elementPosition.top,this.startClientX=t.touches[0].clientX-this.elementPosition.left,this.startClientY=t.touches[0].clientY-this.elementPosition.top),this.events.emit({type:"touchstart"})},t.prototype.touchmoveHandler=function(t){var e=t.touches;(this.detectSwipe(e)||"swipe"==this.eventType)&&this.handleSwipe(t),(2===e.length&&!this.eventType||"pinch"==this.eventType)&&this.handlePinch(t)},t.prototype.touchendHandler=function(t){this.i=0,this.draggingMode=!1;var e=t.touches;this.scale<1&&(this.scale=1),this.autoZoomOut&&"pinch"===this.eventType&&(this.scale=1),this.events.emit({type:"touchend"}),"pinch"!==this.eventType&&"swipe"!==this.eventType||this.alignImage(),"pinch"!==this.eventType&&"swipe"!==this.eventType&&"horizontal-swipe"!==this.eventType&&"vertical-swipe"!==this.eventType||this.updateInitialValues(),this.eventType="touchend",e&&0==e.length&&(this.eventType="")},t.prototype.handleSwipe=function(t){t.preventDefault(),this.eventType||(this.startX=t.touches[0].clientX-this.elementPosition.left,this.startY=t.touches[0].clientY-this.elementPosition.top),this.eventType="swipe",this.events.emit({type:"swipe",moveX:this.moveX,moveY:this.moveY}),this.moveX=this.initialMoveX+(t.touches[0].clientX-this.elementPosition.left-this.startX),this.moveY=this.initialMoveY+(t.touches[0].clientY-this.elementPosition.top-this.startY),this.transformElement(0)},t.prototype.handlePinch=function(t){t.preventDefault();var e=t.touches;this.eventType||(this.initialDistance=this.getDistance(e),this.moveXC=(t.touches[0].clientX-this.elementPosition.left+(t.touches[1].clientX-this.elementPosition.left))/2-this.initialMoveX,this.moveYC=(t.touches[0].clientY-this.elementPosition.top+(t.touches[1].clientY-this.elementPosition.top))/2-this.initialMoveY),this.eventType="pinch",this.events.emit({type:"pinch"}),this.distance=this.getDistance(e),this.scale=this.initialScale*(this.distance/this.initialDistance),this.moveX=this.initialMoveX-(this.distance/this.initialDistance*this.moveXC-this.moveXC),this.moveY=this.initialMoveY-(this.distance/this.initialDistance*this.moveYC-this.moveYC),this.transformElement(0)},t.prototype.detectSwipe=function(t){return 1===t.length&&1<this.scale&&!this.eventType},t.prototype.getDistance=function(t){return Math.sqrt(Math.pow(t[0].pageX-t[1].pageX,2)+Math.pow(t[0].pageY-t[1].pageY,2))},t.prototype.getImageHeight=function(){return this.element.getElementsByTagName("img")[0].offsetHeight},t.prototype.getImageWidth=function(){return this.element.getElementsByTagName("img")[0].offsetWidth},t.prototype.setBasicStyles=function(){this.element.style.display="flex",this.element.style.height="100%",this.element.style.alignItems="center",this.element.style.justifyContent="center",this.element.style.transformOrigin="0 0",this.hostDisplay="block",this.hostOverflow="hidden",this.hostHeight=this.containerHeight,this.setImageWidth()},t.prototype.setImageWidth=function(){var t=this.element.getElementsByTagName("img");t.length&&(t[0].style.maxWidth="100%",t[0].style.maxHeight="100%")},t.prototype.transformElement=function(t){void 0===t&&(t=50),this.element.style.transition="all "+t+"ms",this.element.style.transform="matrix("+Number(this.scale)+",0,0,"+Number(this.scale)+","+Number(this.moveX)+","+Number(this.moveY)+")"},t.prototype.resetScale=function(){this.scale=1,this.moveX=0,this.moveY=0,this.updateInitialValues(),this.transformElement(this.transitionDuration)},t.prototype.updateInitialValues=function(){this.initialScale=this.scale,this.initialMoveX=this.moveX,this.initialMoveY=this.moveY},t.prototype.centeringImage=function(){var t=this.element.getElementsByTagName("img")[0],e=this.moveX,i=this.moveY;return 0<this.moveY&&(this.moveY=0),0<this.moveX&&(this.moveX=0),t&&(this.transitionYRestriction(),this.transitionXRestriction()),t&&this.scale<1&&this.moveX<this.element.offsetWidth*(1-this.scale)&&(this.moveX=this.element.offsetWidth*(1-this.scale)),e!=this.moveX||i!=this.moveY},t.prototype.alignImage=function(){this.centeringImage()&&(this.updateInitialValues(),this.transformElement(this.transitionDuration))},t.prototype.transitionYRestriction=function(){var t=this.getImageHeight();if(t*this.scale<this.parentElement.offsetHeight)this.moveY=(this.parentElement.offsetHeight-this.element.offsetHeight*this.scale)/2;else{var e=(t-this.element.offsetHeight)*this.scale/2;this.moveY>e?this.moveY=e:t*this.scale+Math.abs(e)-this.parentElement.offsetHeight+this.moveY<0&&(this.moveY=-(t*this.scale+Math.abs(e)-this.parentElement.offsetHeight))}},t.prototype.transitionXRestriction=function(){var t=this.getImageWidth();if(t*this.scale<this.parentElement.offsetWidth)this.moveX=(this.parentElement.offsetWidth-this.element.offsetWidth*this.scale)/2;else{var e=(t-this.element.offsetWidth)*this.scale/2;this.moveX>e?this.moveX=e:t*this.scale+Math.abs(e)-this.parentElement.offsetWidth+this.moveX<0&&(this.moveX=-(t*this.scale+Math.abs(e)-this.parentElement.offsetWidth))}},t.prototype.getElementPosition=function(){this.elementPosition=this.elementRef.nativeElement.getBoundingClientRect()},t.decorators=[{type:e.Component,args:[{selector:"pinch-zoom, [pinch-zoom]",template:"<div #content>\n\t<ng-content></ng-content>\n</div>",styles:[":host{position:relative}"]}]}],t.ctorParameters=function(){return[{type:e.ElementRef}]},t.propDecorators={containerHeight:[{type:e.Input,args:["height"]}],transitionDuration:[{type:e.Input,args:["transition-duration"]}],autoZoomOut:[{type:e.Input,args:["auto-zoom-out"]}],id:[{type:e.Input,args:["id"]}],events:[{type:e.Output}],hostDisplay:[{type:e.HostBinding,args:["style.display"]}],hostOverflow:[{type:e.HostBinding,args:["style.overflow"]}],hostHeight:[{type:e.HostBinding,args:["style.height"]}],contentElement:[{type:e.ViewChild,args:["content"]}],onResize:[{type:e.HostListener,args:["window:resize",["$event"]]}],touchstartHandler:[{type:e.HostListener,args:["touchstart",["$event"]]}],touchmoveHandler:[{type:e.HostListener,args:["touchmove",["$event"]]}],touchendHandler:[{type:e.HostListener,args:["touchend",["$event"]]}]},t}(),n=function(){function t(){}return t.decorators=[{type:e.NgModule,args:[{declarations:[s],imports:[i.CommonModule],exports:[s],entryComponents:[s]}]}],t}();t.PinchZoomComponent=s,t.PinchZoomModule=n,Object.defineProperty(t,"__esModule",{value:!0})}); //# sourceMappingURL=ngx-pinch-zoom.umd.min.js.map