import { Http } from '@angular/http';
import { ToastsManager } from 'ng2-toastr/ng2-toastr';

import { ApplicationsService } from '../resources/applications';
import { UsersService } from '../resources/users';
import { LocaleService } from '../common/i18n';
import { TdDialogService } from '@covalent/core';
import { Component, AfterViewInit, ViewChild } from '@angular/core';
import { TdMediaService } from '@covalent/core';
import { FormBase, IComboOption } from './base';
import { ActivatedRoute, Router } from '@angular/router';
import { OrganizationsService } from "../resources/organizations";

var user_example = { 
    username: 'rym',
    roles: [ 1 ],
    lastLogin: 1488885433000,
    modificationTimestamp: 1479898458000,
    email: 'rbouchair@curistec.com',
    first_name: 'Rym',
    last_name: 'Bouchair',
    creation_timestamp: 1479898458000,
    organizations_ids: [ 1, 2, 5, 6, 7, 8 ]
}

const ROL = {
  ADVANCE: 1,
  ADMIN: 2,
  BASIC: 4
}

@Component({
  selector: 'user-form',
  templateUrl: 'src/app/forms/user.form.html'
})
export class UserFormComponent extends FormBase {
  allOrganizations: IComboOption[];
  allApplications: IComboOption[];
  orgNames: string[] = [];
  appNames: string[] = [];
  allRoles: any[] = [{"id":ROL.BASIC, "code": "basic","label":"Basic"}, 
                     {"id":ROL.ADVANCE, "code": "advance", "label":"Advance"}, 
                     {"id":ROL.ADMIN, "code": "admin","label":"Admin"}];
  user_orgs: string[] = [];
  user_apps: string[] = [];
  user_roles: any = {};
  constructor(private http: Http,
              private users: UsersService,
              private applications: ApplicationsService,
              private organizations: OrganizationsService,
              router: Router,
              toaster: ToastsManager,
              route: ActivatedRoute,              
              $L: LocaleService,
              dialogs: TdDialogService) {
    super($L, router, route, toaster, users, $L.get('user'), dialogs);
  }

  save() : void {
    this.data.organizations_ids = [];
    this.data.roles = [];
    this.user_orgs.forEach(orgName => {
      var selectedOrg = this.allOrganizations.find(org => org.label === orgName);
      this.data.organizations_ids.push(selectedOrg.id);
    });
    this.user_apps.forEach(appName => {
      var selectedApp = this.allApplications.find(app => app.label === appName);
      this.data.applications_ids.push(selectedApp.id);
    });
    this.user_roles.basic && this.data.roles.push(ROL.BASIC);
    this.user_roles.advance && this.data.roles.push(ROL.ADVANCE);
    this.user_roles.admin && this.data.roles.push(ROL.ADMIN);
    super.save('username');
  }

  canBeDeleted() {
    return this.data && this.data.username !== 'admin' && this.data.username !== '_client';
  }

  loadCombos() : void {
      this.organizations.get()
        .map(list => list.map((org : any) => <IComboOption>{id: org.id, label: org.name}))
        .subscribe(
          data => {
            this.allOrganizations = (<IComboOption[]>data).sort((e1, e2) => e1.label.localeCompare(e2.label));
            this.orgNames = this.allOrganizations.map(org => org.label);
            this._loadOrgs();
          },
          err => console.error('Error loading organizations')
        );
      this.applications.get()
        .map(list => list.map((app : any) => <IComboOption>{id: app.id, label: app.name}))
        .subscribe(
          data => {
            this.allApplications = (<IComboOption[]>data).sort((e1, e2) => e1.label.localeCompare(e2.label));
            this.appNames = this.allApplications.map(org => org.label);
            this._loadApps();
          },
          err => console.error('Error loading organizations')
        );
  }

  goBack(): void {
    this.router.navigate([`users`]);
  }
  _loadOrgs() {
    if (this.data && this.data.organizations_ids && this.allOrganizations && this.allOrganizations.length > 0) { 
      this.data.organizations_ids.forEach((orgId : number) => {
          var selectedOrg = this.allOrganizations.find(org => org.id === orgId);
          this.user_orgs.push(selectedOrg.label);
      });
    }
  }
  _loadApps() {
    if (this.data && this.data.applications_ids && this.allApplications && this.allApplications.length > 0) { 
      this.data.applications_ids.forEach((appId : number) => {
          var selectedApp = this.allApplications.find(app => app.id === appId);
          this.user_apps.push(selectedApp.label);
      });
    }
  }
  init() : void {
    this.loadCombos();
    this.user_orgs = [];
    this.user_roles = {};
    super.setFirstFocus();
    super.reset();
    super.prepareInitialData('username', {
      organizations_ids: [],
      applications_ids: [],
      roles: []
    }, (data) => {
       this._loadOrgs();
        data.roles.forEach((roleId : number) => {
            var selectedRole = this.allRoles.find(r => r.id === roleId);
            this.user_roles[selectedRole.code] = true;
        });        

    });
  }
 
  ngAfterViewInit(): void {
    this.init();
  }
}