import {ActivePage} from "activePage";

if (!Date.prototype.toISODateString) {
  (function() {
    Date.prototype.toISODateString = function() {
      return this.toISOString().split('T')[0]
    };

  }());
}

export class Hesla extends ActivePage {
  constructor() {
    super();
    document.getElementById("czech_nav").addEventListener("click",
      (evt: TouchEvent) => {
        localStorage.setItem("language", "cs");
        this.lang_reload();
      }, false);

    document.getElementById("german_nav").addEventListener("click",
      (evt: TouchEvent) => {
        localStorage.setItem("language", "de");
        this.lang_reload();
      }, false);
  }

  /**
   * react to the discovered distance of swipe
   *
   * @param distX Number distance in points in direction X
   * @param distY Number distance in points in direction Y
   *
   * There is a preference for the horizontal swipe; if that doesn't
   * happen (i.e., the distance travelled horizontally is less than
   * negligible), then the vertical swipe (in either direction) means
   * jump to today.
   */
  handle_move(distX, distY) {
    var negligible = 100;
    console.log('distX = ' + distX);
    console.log('distY = ' + distY);

    if (distX < -negligible) {
      console.log("swipe left");
      this.next();
    }
    else if (distX > negligible) {
      console.log("swipe right");
      this.prev();
    }
    else if (Math.abs(distY) > negligible) {
      console.log("jump to today!");
      this.cur_watchword = new Date();
      this.display();
    }
  }

  // cur_watchword is actually just a virtual property, which is not stored anywhere and its
  // accessor methods change the value of the cur_section property instead.
  get cur_watchword() {
    console.log(`this.cur_section = ${this.cur_section}`);
    if (!this.cur_section) {
        this.cur_section = new Date();
    }

    return this.cur_section;
  }

  set cur_watchword(value) {
    // Remove 'visible' style from the currently displayed psalm, if
    // there is any

    this.cur_section = value;

    // set the parameter directly to avoid call to getter.
    console.log('Displaying ' + this.cur_section);
    this.display();
  }

  /**
   * Display losungen for given day
   *
   * Displays the Losungen for the given date (or today if not defined)
   */
  display() {
    super.display();

    console.log("cur_watchword = " + this.cur_watchword);
    document.getElementById(this.cur_watchword.toISODateString()).
      classList.add("visible");
  }

  shiftDate(shift) {
    var cur_date = this.cur_watchword;
    cur_date.setDate(cur_date.getDate() + shift);
    this.cur_watchword = cur_date;
  }

  next() {
    console.log("Next day!");
    this.shiftDate(+1);
  }

  prev() {
    console.log("Previous day!");
    this.shiftDate(-1);
  }

  // Switch langauge
  /**
   * Handler for the switch language event
   *
   * Switches the displayed langauge page according to the state stored
   * in the localStorage.langauge variable which contains ISO code for
   * the chosen language ('de' and 'cs' currently).
   */
  lang_reload() {
    var new_basename = "index.html", new_url = window.location.href,
      old_basename = window.location.pathname.split("/").slice(-1)[0];
    console.log('old_basename = ' + old_basename);

    if (localStorage.getItem("language") &&
        (localStorage.getItem("language") === "de")) {
      new_basename = "index_de.html";
    }

    console.log('new_basename = ' + new_basename);
    if ((old_basename !== new_basename) || (window.location.pathname.length === 0)) {
      new_url = window.location.href.replace(/(index[-\w]*\.html)?$/,
        new_basename);
    }

    if (window.location.href !== new_url) {
      window.location.assign(new_url);
    }
  }
}

var thisHesla = new Hesla();
thisHesla.lang_reload();
thisHesla.display();