import { $, browser, ElementFinder<% if (authenticationType === 'oauth2') { _%>, element, by<% } %> } from 'protractor';

import BasePage from './base-component';

const selector: ElementFinder = $('#login-page');
export default class SignInPage extends BasePage {
  selector: ElementFinder;
  <%_ if (authenticationType !== 'oauth2') { _%>
  username: ElementFinder = this.selector.$('#username');
  password: ElementFinder = this.selector.$('#password');
  loginButton: ElementFinder = this.selector.$('button[type=submit]');
  <%_ } else { _%>
  username: ElementFinder = element(by.name('username'));
  password: ElementFinder = element(by.name('password'));
  loginButton: ElementFinder = element(by.css('input[type=submit]'));
  <%_ } _%>
  title: ElementFinder = this.selector.$('#login-title');

  constructor() {
    super(selector);
    this.selector = selector;
  }

  get() {
    browser.get('#/login');
    this.waitUntilDisplayed();
  }

  getTitle() {
    return this.title.getAttribute('id');
  }

  setUserName(username: string) {
    return this.username.sendKeys(username);
  }

  clearUserName() {
    return this.username.clear();
  }

  setPassword(password: string) {
    return this.password.sendKeys(password);
  }

  clearPassword() {
    return this.password.clear();
  }

  <%_ if (authenticationType !== 'oauth2') { _%>
  autoSignInUsing(username: string, password: string) {
    this.setUserName(username);
    this.setPassword(password);
    return this.login();
  }
  <%_ } else { _%>
  loginWithOAuth(username: string, password: string) {
    this.username.isPresent().then(() => {
        this.setUserName(username);
        this.setPassword(password);
        return this.login();
    });
  }
  <%_ } _%>

  autoSignOut = () => browser.get('#/logout');

  login() {
    return this.loginButton.click();
  }
}