import {Component, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {NgForm} from '@angular/forms';
import {WarService} from '../../../services/logs/war.service';
import {War} from '../../../models/model-interfaces';
import {CampaignService} from '../../../services/logs/campaign.service';
import {Subscription} from 'rxjs/Subscription';


@Component({
  selector: 'war-edit',
  templateUrl: './war-edit.component.html',
  styleUrls: ['./war-edit.component.css', '../../../style/load-indicator.css',
    '../../../style/entry-form.css', '../../../style/overview.css']
})
export class WarEditComponent {

  war: War = {players: []};

  subscription: Subscription;

  showErrorLabel = false;

  error;

  @ViewChild(NgForm) form: NgForm;

  constructor(private route: ActivatedRoute,
              private router: Router,
              private warService: WarService,
              public campaignService: CampaignService) {
    this.subscription = this.route.params
                            .map(params => params['id'])
                            .filter(id => id !== undefined)
                            .flatMap(id => this.warService.getWar(id))
                            .subscribe(war => {
                              this.war = war;
                            });
  }

  updateWar() {
    this.warService.updateWar(this.war)
        .subscribe(war => {
            this.router.navigate(['../../war/' + war._id], {relativeTo: this.route});
          },
          error => {
            this.error = error._body.error.message;
            this.showErrorLabel = true;
          });
  }

  cancel() {
    this.router.navigate(['..'], {relativeTo: this.route});
    return false;
  }
}