import BasePage from '../../base.js';
import CoUxAppShell from '../../../components/10x/ux/ux-app-shell.js';
import MatMenu from '../../../components/10x/ux/mat-menu.js';
import CdkOverlayContainer from '../../../components/cdk-overlay-container.js';
import CoUxButton from '../../../components/10x/ux/ux-button.js'
import ButtonComponent from '../../../components/button.js';
import CoUxDropdownButtonItem from '../../../components/10x/ux/ux-dropdown-button-item.js'
import CoEuiButton from '../../../components/10x/eui/eui-button.js'
import CoEuiSelect from '../../../components/10x/eui/eui-select.js'


export default class EuiBasePage extends BasePage {
    constructor(){
        super();
        this.appShell = new CoUxAppShell(this.root);
        this.overlay = new CdkOverlayContainer(this.root);
        this.matMenu = new MatMenu(this.overlay.overlayPane);
    }
    /**
    * @type string
    */
    get appRoot() {
      return '//app-root'
    }
    /**
    * @type string
    */
    get sideBarr() {
      let path = '//eui-app-sidebar[@class = "eui-app-sidebar"]';
      return this.appRoot + path;
    }
    /**
    * @type string
    */
    get appMain() {
      let path = '//div[@class = "eui-app-main"]';
      return this.appRoot + path;
    }
    /**
    * @type string
    */
    get mainContent() {
      let path = '//div[@class = "eui-app-main-content"]';
      return this.appMain + path;
    }
    /**
    * @type string
    */
    get euiPage() {
      let path = '//eui-page[contains(@class,"eui-page")]';
      return this.mainContent + path;
    }
    /**
    * @type string
    */
    get pageHeader() {
      let path = '//eui-page-header[contains(@class,"eui-page-header")]';
      return this.euiPage + path;
    }
    get pageTitle() {
      let path = '//div[@class="eui-common-header__label-text"]';
      return this.pageHeader + path;
    }
    appDocPageById(id) {
      let path = '//eui-showcase-doc-page[@id = "' + id + '"]';
      return this.mainContent + path;
    }
    get navigationList() {
      let path = '//ul[contains(@class, "doc-page-navigation")]';
      return this.mainContent + path;
    }
    navigationListLinkByText(text) {
      let path = '//a[text() [normalize-space()="' + text + '"]]';
      return this.navigationList + path;
    }

    sectionById(id) {
      let path = '//eui-showcase-doc-sample[@id = "' + id + '"]';
      return this.mainContent + path;
    }
    sectionTitle(sectionId) {
      let path = '//eui-showcase-doc-sample[@id = "' + sectionId + '"]//div[contains(@class, "doc-sample-title")]';
      return this.mainContent + path;
    }

    /**
    * @type string
    * @param text string
    */
    getlinkByText(text) {
      let path = '//a[contains(text(), "' + text + '")]';
      return this.root + path;
    }
    /**
    * @type string
    * @param id string
    */
    elementById(id) {
      let path = '//*[@id="' + id + '"]';
      return this.root + path;
    }

    // Cookie section
    /**
    * @type string
    */
    get cookieBanner() {
      let path = '//div[@id = "cookie-consent-banner"]';
      return this.root + path;
    }
    /**
    * @type string
    */
    get cookieBannerAcceptLink() {
      let path = '//a[@class = "wt-cck-btn-add"]';
      return this.cookieBanner + path;
    }
    /**
    * @type string
    */
    get cookieBannerRefuseLink() {
      let path = '//a[@class = "wt-cck-btn-refuse"]';
      return this.cookieBanner + path;
    }

    // Language section
    /**
    * @type string
    */
    get languageSelector() {
    let path = '//eui-language-selector[contains(@class, "eui-app-toolbar__language-selector")]';
    return this.appMain + path;
    }
    /**
    * @type string
    */
    get languageSelectorLink() {
    let path = '//a[contains(@class, "eui-language-selector-link")]';
    return this.languageSelector + path;
    }
    /**
    * @type string
    * @param text string
    */
    getLangSelButtonByText(text) {
    let path = '//div[contains(@class, "eui-language-selector-menu-language-item") and contains(text(), "' + text + '")]';
    return this.root + path;
    }
    /**
    * @type string
    */
    get languageIndicator() {
        let path = '//span[@class = "eui-language-selector-link__language-code"]';
        return this.languageSelector + path;
    }

    async selectLocalLanguage(language){
      let localLanguageSelect = new CoEuiSelect(this.euiPage + '//eui-showcase-doc-section[@id="Locale"]');
      await (await (await localLanguageSelect.element())).selectByVisibleText(language);
    }

  // ux-button
  buttonByTextContains(text) {
    let button = new CoUxButton(this.mainContent);
    return button.byTextContains(text);
  }
  buttonComponentByTextContains(text) {
    let button = new ButtonComponent(this.mainContent);
    return button.byTextContains(text);
  }
  buttonComponentByIndex(index) {
    let button = new ButtonComponent(this.mainContent);
    return button.byIndex(index);
  }
  buttonComponentByTextAndIndex(text, index) {
    let button = new ButtonComponent(this.mainContent);
    return button.byTextContains(text).andByIndex(index);
  }
  buttonFromSectionById(id) {
    return new CoUxButton(this.sectionById(id));
  }
  // ux-dropdown-button-item
  dropdownButtonItemByIndex(index) {
    return new CoUxDropdownButtonItem(this.overlay).byIndex(index);
  }
  dropdownButtonItemByTextContains(text) {
    return new CoUxDropdownButtonItem(this.overlay).byTextContains(text);
  }
  dropdownButtonItemByTextEqualsAndIndex(text, index, normalize=true) {
    return new CoUxDropdownButtonItem(this.overlay).byTextEqualsAndIndex(text, index, normalize);
  }
  euiButtonCOfromSectionWithIdByIndex(id, index) {
    return new CoEuiButton(this.sectionById(id)).byIndex(index);
  }
  buttonFromSectionWithIdByIndex(id, text, index) {
    return new ButtonComponent(this.sectionById(id)).byTextContainsAndIndex(text, index);
  }
}


