import { Component, Input } from "@angular/core";
import { BHPSwitchConfig } from "./switch.config";

@Component({
  selector: "BHPSwitch",
  template: `
    <div (click)="toggle()" [ngClass]="switchClass + (isOn===true?' toggle-switch-on':'')" class="toggle-switch">
      <div class="toggle-switch-message-on">
        <ng-content select=[left]></ng-content>
      </div>
      <div class="toggle-switch-toggler">
      </div>
      <div class="toggle-switch-message-off">
        <ng-content select=[right]></ng-content>
      </div>
    </div>`
})
export class BHPSwitchComponent {
  @Input() switchClass = "";
  @Input() isOn = true;

  constructor(_config: BHPSwitchConfig) {
    Object.assign(this, _config);
  }

  toggle(){
    this.isOn = !this.isOn
  }

}