ng-canvas-paint/bundles/ng-canvas-paint.umd.min.js

Esta libreria fue generada con [Angular CLI](https://github.com/angular/angular-cli) version 8.2.9.

!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/core"),require("@angular/common")):"function"==typeof define&&define.amd?define("ng-canvas-paint",["exports","@angular/core","@angular/common"],n):n((t="undefined"!=typeof globalThis?globalThis:t||self)["ng-canvas-paint"]={},t.ng.core,t.ng.common)}(this,(function(t,n,e){"use strict";var o,a,i,s,r,c,u,l=function(){function t(){this.value=void 0,this.onValue=new n.EventEmitter,this.containerClass="",this.headerClass="options-container",this.painterContainerClass="ng-canvas-container",this.confirmBtnClass="confirm-button",this.cleanBtnClass="clean-button",this.title="Firmar en el recuadro",this.color="black",this.backgroundColor="white",this.iconAcceptButton="icon-check",this.iconCleanButton="icon-clean",this.onAccept=new n.EventEmitter,this.onRefresh=new n.EventEmitter,this.positionButtons="bottom"}return t.prototype.ngOnInit=function(){},t.prototype.ngAfterViewInit=function(){var t,n;t=this.color,n=this.backgroundColor,r=t,c=n;setTimeout((function(t){return p()}),100)},t.prototype.refreshCanvas=function(){var t=this;this.value&&(this.value=void 0),setTimeout((function(){a.getContext("2d").clearRect(0,0,a.width,a.height),p(),t.onRefresh.emit()}),500)},t.prototype.guardarCanvas=function(){this.value=h(),this.onAccept.emit(this.value)},t}();function p(t){if(void 0===t&&(t=!0),u=t,a=document.getElementById("canvasPainterView"),o=document.getElementById("container-painter"),a.width=o.offsetWidth,a.height=o.offsetHeight,a)if(a.getContext)if(i=a.getContext("2d")){i.fillStyle=c,i.strokeStyle=r,i.fillRect(0,0,a.width,a.height);var n="createTouch"in document||"ontouchstart"in window;s=new d,a.addEventListener("mousedown",f,!1),a.addEventListener("mousemove",f,!1),a.addEventListener("mouseup",f,!1),n&&(document.body.addEventListener("touchmove",(function(t){t.preventDefault()}),{passive:!1}),a.addEventListener("touchstart",f,!1),a.addEventListener("touchmove",(function(t){t.stopPropagation(),t.preventDefault();var n=document.createEvent("MouseEvent");n.initMouseEvent("mousemove",!0,!0,window,t.detail,t.touches[0].screenX,t.touches[0].screenY,t.touches[0].clientX,t.touches[0].clientY,!1,!1,!1,!1,0,null),a.dispatchEvent(n),f(t)}),!1),a.addEventListener("touchend",f,!1))}else alert("Error: failed to getContext!");else alert("Error: no canvas.getContext!");else alert("Error: I cannot find the canvas element!")}function d(){s=this,this.started=!1,this.mousedown=function(t){i.beginPath(),i.moveTo(t._x,t._y),s.started=!0},this.mousemove=function(t){s.started&&(i.lineTo(t._x,t._y),i.stroke())},this.mouseup=function(t){s.started&&(s.mousemove(t),s.started=!1,u&&h())}}function f(t){t.layerX||0==t.layerX?(t._x=t.layerX,t._y=t.layerY):t.offsetX||0==t.offsetX?(t._x=t.offsetX,t._y=t.offsetY):(t.pageX||0==t.pageX)&&(t._x=t.pageX,t._y=t.pageY);var n=null;switch(t.type){case"touchstart":n="mousedown";break;case"touchmove":n="mousemove";break;case"touchend":n="mouseup";break;default:n=t.type}var e=s[n];e&&e(t)}function h(){var t=a.getContext("2d");return t.fillStyle=c,t.strokeStyle=r,t.fillRect(10,10,30,30),a.toDataURL()}l.decorators=[{type:n.Component,args:[{selector:"ng-canvas-paint",template:'\n    <div id="container" class="main-container" [ngClass]="containerClass" >\n      <div [ngClass]="headerClass">\n        <p><strong>{{title}}</strong></p>\n        <div class="buttons-container" *ngIf="positionButtons === \'top\'">\n          <button type="button" [ngClass]="cleanBtnClass" (click)="refreshCanvas()"><i [ngClass]="iconCleanButton"></i></button>\n          <button type="button" [ngClass]="confirmBtnClass" (click)="guardarCanvas()"><i [ngClass]="iconAcceptButton"></i></button>\n        </div>\n      </div>\n\t\t\t<div id="container-painter" [ngClass]="painterContainerClass">\n        <canvas id="canvasPainterView" class="canvas-painter" *ngIf="!value">\n\t\t\t\t<p>Unfortunately, your browser is currently unsupported by our web application. We are sorry for the\n\t\t\t\t  inconvenience. Please use one of the supported browsers listed below, or draw the image you want using an\n\t\t\t\t  offline tool.</p>\n\t\t\t\t<p>Supported browsers: <a href="http://www.opera.com/">Opera</a>, <a href="http://www.mozilla.com/">Firefox</a>,\n\t\t\t\t  <a href="http://www.apple.com/safari">Safari</a>, and <a href="http://www.konqueror.org/">Konqueror</a>.</p>\n\t\t\t  </canvas>\n\t\t\t  <img class="image-painter" [src]="value" *ngIf="value" />\n      </div>\n      <div class="buttons-container" *ngIf="positionButtons === \'bottom\'">\n        <button type="button" [ngClass]="cleanBtnClass" (click)="refreshCanvas()" title="Limpiar recuadro"><i [ngClass]="iconCleanButton"></i></button>\n        <button type="button" [ngClass]="confirmBtnClass" (click)="guardarCanvas()" title="Confirmar firma"><i [ngClass]="iconAcceptButton"></i></button>\n      </div>\n\t</div>\n  ',styles:['@charset "UTF-8";.main-container{display:flex;flex-direction:column}.ng-canvas-container{background:#ebf0f2;min-height:240px;width:100%;border:2px dashed #c2d1d9;border-radius:8px;display:flex;justify-content:center;align-items:center;flex-direction:column;margin-bottom:0;width:inherit;height:inherit;padding:0!important}.canvas-painter,.image-painter{width:inherit;height:inherit;display:block}.options-container{justify-content:space-between}.buttons-container,.options-container{width:inherit;display:flex;align-items:center}.buttons-container{justify-content:flex-end}.card-body{padding:0!important}.center{display:flex;flex-direction:row;align-items:center;justify-content:center}.confirm-button{color:#00695e}.clean-button,.confirm-button{background-color:initial;border:none;font-size:24px}.clean-button{color:#012c5b}.icon-clean:before{content:"❌"}.icon-check:before{content:"✔️"}']}]}],l.ctorParameters=function(){return[]},l.propDecorators={value:[{type:n.Input,args:["value"]}],onValue:[{type:n.Output,args:["value"]}],containerClass:[{type:n.Input,args:["containerClass"]}],headerClass:[{type:n.Input,args:["headerClass"]}],painterContainerClass:[{type:n.Input,args:["painterContainerClass"]}],confirmBtnClass:[{type:n.Input,args:["confirmBtnClass"]}],cleanBtnClass:[{type:n.Input,args:["cleanBtnClass"]}],title:[{type:n.Input,args:["title"]}],color:[{type:n.Input,args:["color"]}],backgroundColor:[{type:n.Input,args:["backgroundColor"]}],iconAcceptButton:[{type:n.Input,args:["iconAcceptButton"]}],iconCleanButton:[{type:n.Input,args:["iconCleanButton"]}],onAccept:[{type:n.Output,args:["onAccept"]}],onRefresh:[{type:n.Output,args:["onRefresh"]}],positionButtons:[{type:n.Input,args:["positionButtons"]}]};var g=function(t){i.beginPath(),i.moveTo(t.x,t.y),this.isDrawing=!0},m=function(t){this.isDrawing&&(i.lineTo(t.x,t.y),i.stroke())},v=function(t){this.isDrawing&&(this.touchmove(t),this.isDrawing=!1)};var y=function(){};y.decorators=[{type:n.NgModule,args:[{declarations:[l],imports:[e.CommonModule],exports:[l],schemas:[n.CUSTOM_ELEMENTS_SCHEMA]}]}],t.NgCanvasPaintComponent=l,t.NgCanvasPaintModule=y,t.ɵ0=g,t.ɵ1=m,t.ɵ2=v,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=ng-canvas-paint.umd.min.js.map