import {
    Component, ElementRef, ViewChild, OnInit, Output, EventEmitter
  } from '@angular/core';
  import SignaturePad from "signature_pad";

  @Component({
    selector: 'app-canvas',
    templateUrl: './canvas.component.html',
  })
  export class CanvasComponent implements OnInit {
    @ViewChild("canvas", { static: true }) canvas!: ElementRef;
    sig!: SignaturePad;
    signatureNeeded!: boolean;
    signatureImg!: string;

    @Output() saveSignature = new EventEmitter() ;
  
    ngOnInit() {
      this.sig = new SignaturePad(this.canvas.nativeElement);
    }
  
    clear() {
      this.sig.clear();
    }


    onMouseDown(event: MouseEvent) {
      console.log("start")
    }

    onMouseUp(event: MouseEvent) {
      console.log("arrete")
    }

    savePad() {
      const base64Data = this.sig.toDataURL();
      this.signatureImg = base64Data;
      this.saveSignature.emit(this.signatureImg);
    }
  }
  