ng-canvas-paint
Version:
Esta libreria fue generada con [Angular CLI](https://github.com/angular/angular-cli) version 8.2.9.
1 lines • 7.13 kB
JSON
{"__symbolic":"module","version":4,"metadata":{"NgCanvasPaintComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"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:\"✔️\"}"]}]}],"members":{"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3},"arguments":["value"]}]}],"onValue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":34,"character":3},"arguments":["value"]}]}],"containerClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3},"arguments":["containerClass"]}]}],"headerClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3},"arguments":["headerClass"]}]}],"painterContainerClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3},"arguments":["painterContainerClass"]}]}],"confirmBtnClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3},"arguments":["confirmBtnClass"]}]}],"cleanBtnClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3},"arguments":["cleanBtnClass"]}]}],"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3},"arguments":["title"]}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3},"arguments":["color"]}]}],"backgroundColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3},"arguments":["backgroundColor"]}]}],"iconAcceptButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3},"arguments":["iconAcceptButton"]}]}],"iconCleanButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3},"arguments":["iconCleanButton"]}]}],"onAccept":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":46,"character":3},"arguments":["onAccept"]}]}],"onRefresh":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":3},"arguments":["onRefresh"]}]}],"positionButtons":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3},"arguments":["positionButtons"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"refreshCanvas":[{"__symbolic":"method"}],"guardarCanvas":[{"__symbolic":"method"}]}},"NgCanvasPaintModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"NgCanvasPaintComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":4}],"exports":[{"__symbolic":"reference","name":"NgCanvasPaintComponent"}],"schemas":[{"__symbolic":"reference","module":"@angular/core","name":"CUSTOM_ELEMENTS_SCHEMA","line":12,"character":12}]}]}],"members":{}}},"origins":{"NgCanvasPaintComponent":"./lib/ng-canvas-paint.component","NgCanvasPaintModule":"./lib/ng-canvas-paint.module"},"importAs":"ng-canvas-paint"}