import { App } from '../../gogocarto';
import { parseArrayNumberIntoString, parseStringIntoArrayNumber } from '../../utils/parser-string-number';
import { slugify } from '../../utils/string-helpers';

declare let $: any;

export class FilterRoutingModule {
  loadFiltersFromString(string: string) {
    const splited = string.split('@');
    const mainOptionSlug = splited[0];
    let mainOptionId, mainOption;
    if (mainOptionSlug == 'all') mainOptionId = 'all';
    else {
      mainOption = App.taxonomyModule.getMainOptionBySlug(mainOptionSlug);
      mainOptionId = mainOption ? mainOption.id : 'all';
    }
    App.filtersComponent.setMainOption(mainOptionId);

    let filtersString: string;
    let addingMode: boolean;

    if (splited.length == 2) {
      filtersString = splited[1];

      if (filtersString[0] == '!') addingMode = false;
      else addingMode = true;

      filtersString = filtersString.substring(1);
    } else if (splited.length > 2) {
      console.error('Error spliting in loadFilterFromString');
    }

    const optionsIds = parseStringIntoArrayNumber(filtersString);
    
    if (!App.loadFullTaxonomy && mainOptionSlug != 'all') $('.main-categories').hide();

    if (optionsIds.length > 0) {
      let options = App.taxonomyModule.options.filter(o => optionsIds.includes(o.intId))
      console.log(addingMode ? 'Check' : 'Uncheck', "filters from string", options.map(o => o.name));
      
      // Set all to check or uncheck      
      if (mainOptionSlug == 'all') {
        if (App.loadFullTaxonomy) 
          App.taxonomyModule.taxonomy.toggle(!addingMode, false);
        else {
          if (App.config.menu.showOnePanePerMainOption)
            for (let mainOpt of App.taxonomyModule.getMainOptions())
              mainOpt.toggleVisibility(!addingMode, false)
          else 
            App.taxonomyModule.taxonomy.toggleVisibility(!addingMode, false)
        }
      } else {
        for (const cat of mainOption.subcategories)
          for (const option of cat.options) {
            if (App.loadFullTaxonomy) option.toggle(!addingMode, false);
            else option.toggleVisibility(!addingMode, true);
          }        
      }

      // Check/unckeck the ones store in URL
      for (const option of options) {
        if (App.loadFullTaxonomy) option.toggle(addingMode, true);
        else option.toggleVisibility(addingMode, true);
      }
    }
  }

  getFiltersToString(): string {
    const mainOptionId = App.currMainId;

    let mainOptionName, optionsToConsider;

    if (mainOptionId == 'all' && App.config.menu.showOnePanePerMainOption) {
      mainOptionName = 'all';
      optionsToConsider = App.taxonomyModule.taxonomy.children;
    } else {
      if (App.config.menu.showOnePanePerMainOption) {
        const mainOption = App.taxonomyModule.getCurrMainOption();
        mainOptionName = slugify(mainOption.nameShort);
        optionsToConsider = mainOption.allChildrenOptions;
      } else {
        mainOptionName = 'all';
        optionsToConsider = App.taxonomyModule.options;
      }
    }

    let checkedOptionsToParse = optionsToConsider.filter((option) => option.isChecked);
    let uncheckOptionsToParse = optionsToConsider.filter((option) => option.isDisabled);
    
    // console.log("CHECKED", checkedOptionsToParse.map(o => o.name))
    // console.log("UNCHECKED", uncheckOptionsToParse.map(o => o.name))

    const checkedIdsParsed = parseArrayNumberIntoString(checkedOptionsToParse.map((option) => option.intId));
    const uncheckedIdsParsed = parseArrayNumberIntoString(uncheckOptionsToParse.map((option) => option.intId));

    if (uncheckedIdsParsed.length == 0) return mainOptionName

    // const addingMode = checkedIdsParsed.length < uncheckedIdsParsed.length;
    const addingMode = true // Always use adding mode cause the other one is buggy when we load URL
    const addingSymbol = addingMode ? '+' : '!';
    const filtersString = addingMode ? checkedIdsParsed : uncheckedIdsParsed;

    if (!addingMode && filtersString == '') return mainOptionName;

    return mainOptionName + '@' + addingSymbol + filtersString;
  }
}
