import { Component, OnInit, Input } from '@angular/core';

@Component({
  selector: 'app-step',
  template: `
    <div class="step">

      <h2>{{ step.prompt }}</h2>

        <div *ngFor="let field of step.fields" [ngSwitch]="field.type">

            <app-text *ngSwitchCase="'text'"

              [field]="field"
              (update)="update()"

            ></app-text>

            <app-radio *ngSwitchCase="'radio'" 

              [field]="field" 
              (update)="update()"

            ></app-radio>

        </div>

    </div>
  `
})
export class StepComponent implements OnInit {

  @Input() step: Step;

  ngOnInit() { console.log("Step", this.step); }

  update() {

    console.log(this.step.fields);

    /* Check for completeness */
    for (let field of this.step.fields) {
      if (!field.ok) {
        this.step.ok = false;
        return;
      }
    }

    this.step.ok = true;

  }

}