import { Component, Input, Output, EventEmitter } from '@angular/core';
import { FormBuilderProvider } from '../../providers/form-builder/form-builder';

@Component({
  selector: 'ws-checkbox-group',
  template: `
    <strong>{{question.question}}</strong>
    <ion-list checkbox-group>
      <ion-item *ngFor="let option of question.options; let i = index;">]
        <ion-label>{{option.label}}</ion-label>
          <ion-checkbox [(ngModel)]="option.value" (ionChange)='selectOption($event, question, i, option)'></ion-checkbox>
      </ion-item>
    </ion-list>
  `,
  styles: [`

  `]
})
export class WsCheckboxGroupComponent {

  @Input('question') question;
  @Output() answerGiven = new EventEmitter();

  isFieldValid:boolean = false;
  showError:boolean = false;

  constructor(public formBuilder: FormBuilderProvider){
    	
  }

  selectOption(event,question,i,option){


    let ifRequired = question.required;
    question.valid = true;
    

    let checkedCount = 0;

    for(let i=0; i < Object.keys(question.options).length; i++){
         //string = string+this.fieldAnswers[i];   
         
         if(question.options[i]['value']){
            checkedCount++;
         }
    }

    if(ifRequired){
      if(typeof question.maximumChecked !== 'undefined'){
        if(checkedCount >= question.maximumChecked){
            question.valid = false;
        }
      }

      if(typeof question.minimumChecked !== 'undefined'){
        if(checkedCount <= question.minimumChecked){
            question.valid = false;
        }
      }
    }

    this.answerGiven.emit(question);
  		
  }
  
  validateAnswer(question,string){	
  		return this.formBuilder.validateAnswer(question,string);
  }

}