import { Component, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup, Validators, NgForm } from '@angular/forms';

import { UserService } from '../../services/user.service';
import { SettingsService } from 'src/app/services/settings.service';

@Component({
  selector: 'page-settings',
  templateUrl: './settings.page.html',
  styleUrls: [ './settings.page.scss' ]
})
export class PageSettings implements OnInit {

  auth: any;
  user: any;
  working: boolean = false;
  success: boolean = false;
  form: FormGroup;
  settings: any;
  @ViewChild('formDirective') private formDirective: NgForm;

  constructor(
    private userService: UserService,
    private settingsService: SettingsService,
    private formBuilder: FormBuilder) { }

  ngOnInit(): void {
    this.form = this.formBuilder.group({
      username: [ { disabled: true }, Validators.nullValidator ],
      email: [ '', Validators.nullValidator ],
      about: [ '', Validators.nullValidator ],
      gravity: [ '', Validators.nullValidator ],
      commentDelay: [ '', Validators.nullValidator ],
    });

    this.form.get('username').disable();

    this.userService.get().subscribe(user => {
      this.user = user;
      if (!this.user.settings) {
        this.user.settings = {};
      }
      this.form.get('username').setValue(this.user.username);
      this.form.get('email').setValue(this.user.email);
      this.form.get('about').setValue(this.user.about);

      this.settingsService.settings.subscribe((settings) => {
        this.settings = settings;
        this.form.get('gravity').setValue(this.user.settings.gravity || this.settings.defaultGravity);
        this.form.get('commentDelay').setValue(this.user.settings.commentDelay || this.settings.defaultCommentDelay);
      });
    })


  }

  hasError(controlName: string): boolean {
    return this.form.controls[ controlName ].errors != null;
  }

  resetGravity(): void {
    this.user.settings.gravity = null;
    this.form.get('gravity').setValue(this.settings.defaultGravity);
  }

  resetCommentDelay(): void {
    this.user.settings.commentDelay = null;
    this.form.get('commentDelay').setValue(this.settings.defaultCommentDelay);
  }

  save(): void {
    if (this.working) {
      return;
    }

    this.working = true;
    this.success = false;

    this.user.about = this.form.get('about').value;
    this.user.email = this.form.get('email').value;

    if (!this.user.settings) {
      this.user.settings = {};
    }

    if (this.form.get('gravity').value != this.settings.defaultGravity && !this.user.settings.gravity) {
      this.user.settings.gravity = this.form.get('gravity').value;
    } else if (this.user.settings.gravity) {
      this.user.settings.gravity = this.form.get('gravity').value;
    }

    if (this.form.get('commentDelay').value != this.settings.defaultCommentDelay && !this.user.settings.commentDelay) {
      this.user.settings.commentDelay = this.form.get('commentDelay').value;
    } else if (this.user.settings.commentDelay) {
      this.user.settings.commentDelay = this.form.get('gravity').value;
    }

    this.userService.update(this.user).subscribe((data) => {
      this.user = data;
      if (!this.user.settings) {
        this.user.settings = {};
      }
      this.working = false;
      this.success = true;
    }, (error) => {
      this.working = false;
      if (error.status == 422) {
        let errors = {};
        for (let code of error.error) {
          errors[ code.field ] = errors[ code.field ] || {};
          errors[ code.field ][ code.code ] = true;
        }

        for (let code in errors) {
          this.form.get(code).setErrors(errors[ code ]);
        }
      }
    })

  }

}