import { Directive, ElementRef, Input, Renderer } from "@angular/core";

@Directive({ selector: "[btnColor]" })
export class ButtonDirective {
  constructor(public el: ElementRef, public renderer: Renderer) {}

  @Input() btnColor: string;

  ngOnInit() {
    if (this.btnColor && this.btnColor.length > 0) {
      if (this.btnColor.indexOf("outline") >= 0) {
        let color = this.btnColor.replace(/outline/g, "").replace(/\s/g,"");
        this.renderer.setElementClass(
          this.el.nativeElement,
          "btn-outline-" + color,
          true
        );
      } else {
        this.renderer.setElementClass(
          this.el.nativeElement,
          "btn-" + this.btnColor,
          true
        );
      }
    }
  }
}