/* Copyright CloudLinux Zug GmbH 2010-2017 All Rights Reserved
 *
 * Licensed under CLOUD LINUX LICENSE AGREEMENT
 * http://cloudlinux.com/docs/LICENSE.TXT
 */

import { Component, OnInit } from '@angular/core';
import { SelectorRepo } from './repository/selector_repo';
import { XHR } from './utils/xhr';
import { BaseComponent } from './utils/base_component';
import { TranslateService } from '@ngx-translate/core';
import { AppState } from './app.service';
import { LoaderSelector } from './utils/loader';
import { NotificationMessageData } from './utils/types';

declare const panelName: any;
declare const panelVersion: any;

@Component({
  selector: '.selector_block',
  template: require('./../templates/selector.component.html'),
  styles: [
    require('../styles/selector.component.less'),
  ],
  providers: [SelectorRepo, XHR],
})
export class SelectorComponent extends BaseComponent {

  selectorEmpty = false;
  selectorError = false;
  /**
   * Get all selector info
   * @param {AppState} appState
   * @param {SelectorRepo} selector_repo
   * @param {TranslateService} translate
   */
  constructor(
      public appState: AppState,
      private selector_repo: SelectorRepo,
      private translate: TranslateService
  ) {
    super();
    this.loadSelectorData();
    // this.getExtensions(this.default_version);
  }

  loadSelectorData(){
    this.selector_repo.getSelectorInfo().then((data:any) => {
      this.parseSelectorData(data);
      this.loading = false;
    }).catch((data) => {
        if(typeof data.result != 'undefined'){
            if(typeof data.link != 'undefined'){
                this.translate.get(data.result, data.link).subscribe((mes) => {
                    this.selectorError = mes;
                });
            }
        }
        this.selectorEmpty = true;
        this.loading = false;
    });
  }



    /** Parse and save selector data*/
    public selector_data: any;
    parseSelectorData(data){
        this.selector_data = data;
        this.selector_status = data.PHPSelector;
        this.original_selector_status = data.PHPSelector;
        this.default_version = data.default_version;
        this.supported_php_version = this.getSupportedPhpVersions();
        this.original_supported_php_versions = this.getSupportedPhpVersions();
        this.supported_php_versions_keys = Object.keys(this.supported_php_version);
        if(this.editing_extension_version != null){
            this.extensions_version = this.editing_extension_version;
            this.extensions = this.getExtensions(this.editing_extension_version);
            this.editing_extension_version = null;
        } else{
            let useVersion = this.supported_php_version[this.extensions_version] ?
                this.extensions_version : this.default_version;
            if (useVersion != this.extensions_version) {
                this.extensions_version = useVersion;
                this.extensions = this.getExtensions(useVersion);
            }
        }
        this.original_default_version = data.default_version;
        this.enabled_php_versions = this.getEnabledPhpVersions();
    }


  /** Work with selector status**/

  public selector_status: string;
  public selector_status_options = ['enabled', 'disabled'];
  public editing_selector_status:boolean = false;
  public original_selector_status:string;

  public errorMessages: Array<NotificationMessageData>;


  editingSelectorStatus(new_selector_status){
    if(new_selector_status != this.selector_status) {
      this.editing_selector_status = true;
      this.selector_status = new_selector_status;
    }
  }
  saveSelectorStatus(){
    this.loading = true;
    this.editing_selector_status = false;
    this.selector_repo.setSelectorStatus(this.selector_status)
      .then((response) => {
        this.loadSelectorData();
      }).catch((err) => {
        this.loadSelectorData();
      });
  }

  cancelSelectorStatus(){
    this.selector_status = this.original_selector_status;
    this.editing_selector_status = false;
  }



  /** Default Version*/
  public editing_default_version;
  public original_default_version;
  private _default_version;
  get default_version(){
    return this._default_version;
  }
  set default_version(value){
    this._default_version = value;
  }


  editingDefaulVersion(new_default_version){
    if(new_default_version != this.default_version) {
      this.editing_default_version = true;
      this.default_version = new_default_version;
    }
  }
  saveDefaulVersion(){
    this.loading = true;
    this.editing_default_version = false;
    this.selector_repo.setDefaultVersion(this.default_version)
      .then((response) => {
        this.loadSelectorData();
      }).catch((err) => {
      this.loadSelectorData();
    });
  }

  cancelDefaulVersion(){
    this.default_version = this.original_default_version;
    this.editing_default_version = false;
  }

  /** Enabled php version */
  public enabled_php_versions;

  public getEnabledPhpVersions(){
    var versions = [];
    for(var item of this.selector_data.available_versions){
      if(typeof item != 'undefined' &&
        item["status"] == "enabled"){
        versions.push(item['version'])
      }
    }
    return versions;
  }


  /*** Work with supported php versions**/
  public editing_supported_php_versions:boolean = false;
  public original_supported_php_versions;
  public supported_php_versions_keys;
  public supported_php_version_comments;

  private supported_php_version;


  getSupportedPhpVersions(){
    var versions = {};
    let comments = {};
    for(var item of this.selector_data.available_versions){
      if(typeof item != 'undefined' &&
        item["status"] == "enabled"){
        versions[item["version"]] = true;
      }
      if(typeof item != 'undefined' &&
        item["status"] == "disabled"){
        versions[item["version"]] = false;
      }
      comments[item["version"]] = item['name_modifier'];
    }
    this.supported_php_version_comments = comments;
    return versions;
  }

  editingSupportedPhpVersions(version, name){
    this.editing_supported_php_versions = true;
    this.supported_php_version[name] = version.checked;
  }

  saveSupportedPhpVersions(){
    let component = this;
    this.loading = true;
    this.selector_repo.setSupportedPhpVersions(this.supported_php_version)
      .then((response) => {
        component.loadSelectorData();
      });
    this.editing_supported_php_versions = false;
  }

  cancelSupportedPhpVersions(){
    for(let x in this.original_supported_php_versions){
      this.supported_php_version[x] = this.original_supported_php_versions[x];
    }
    this.editing_supported_php_versions = false;
  }



    /*** Work with extensions**/
    public editing_extension_version = null;
    public extensions = null;
    public extensions_version;
    public extensions_version_keys;
    public extension_columns;
    public extension_columns_keys;

    getExtensions(version) {
        let exts_name = [];
        let exts_obj = [];
        let selector = this.selector_data['available_versions'].find(
          (item) => item["version"] == version);
        selector["extensions"].forEach(function(extension){
            if(extension["name"] == 'ffmpeg'){
                extension["description"]="To enable it, please follow the instructions on: https://docs.cloudlinux.com/ffmpeg";
            }
            exts_name.push(extension["name"]);
            exts_obj[extension["name"]] = {
                "name": extension["name"],
                "description": extension["description"],
            };

            if(extension["state"] == 'build-in'){
                exts_obj[extension["name"]]["state"] = true;
                exts_obj[extension["name"]]["disable"] = true;
            } else if(extension["state"] == 'enabled'){
                exts_obj[extension["name"]]["state"] = true;
                exts_obj[extension["name"]]["disable"] = false;
            } else{
                exts_obj[extension["name"]]["state"] = false;
                exts_obj[extension["name"]]["disable"] = false;
            }
        });
        this.extensions_version_keys = exts_name.sort();
        this.extension_columns = this.getExtensionsColumns();
        return exts_obj;
    }

    getExtensionsColumns() {
        let col_count = 4;
        let col_items_count = Math.ceil(this.extensions_version_keys.length / col_count);
        let columns = [];

        let col_number = 0;
        for (let i = 0; i < this.extensions_version_keys.length; i++) {

            if (typeof columns[col_number] != "undefined" && columns[col_number].length >= col_items_count) {
                col_number += 1;
            }
            if (typeof columns[col_number] == "undefined") {
                columns[col_number] = [];
            }
            columns[col_number].push(this.extensions_version_keys[i]);
        }

        let keys = [];
        for (let i = 0; i < columns.length; i++) {
            keys.push(i);
        }

        this.extension_columns_keys = keys;
        return columns;
    }

    changeExtensions(version) {
        this.extensions_version = version;
        this.extensions = this.getExtensions(version);
    }

    saveExtensions() {
        this.loading = true;
        let self = this;
        this.selector_repo.setExtensions(this.extensions, this.extensions_version)
            .then((response) => {
                self.editing_extension_version = self.extensions_version;
                self.loadSelectorData();
            });
    }

    resetExtensions() {
        this.extensions = this.getExtensions(this.extensions_version);
    }

    defaultExtensions() {
        let native_extensions = this.getExtensions('native');
        this.getExtensions(this.extensions_version);
        for (var name of this.extensions_version_keys) {
            if (typeof this.extensions[name] != 'undefined' && (this.extensions[name]['disable'] ||
                typeof native_extensions[name] != 'undefined')) {
                this.extensions[name]['state'] = true;
            } else {
                this.extensions[name]['state'] = false;
            }
        }
    }

    async ngAfterViewInit() {
        this.loaderSelector = new LoaderSelector('.selector_block');
        this.loading = true;
        let response = await this.selector_repo.cldiag();
        this.errorMessages = [];
        for (let checkName in response.data) {
            if (response.data[checkName].res === 'FAILED') {
                this.errorMessages.push({
                    title: checkName,
                    description: response.data[checkName].msg
                });
            }
        }

    }

}