/* eslint-env browser */
var HouseFavoritesSingleton = (function () {
  var instance;

  function createInstance() {
    return new HouseFavoritesStore();
  }

  return {
    getInstance: function () {
      if (!instance) {
        instance = createInstance();
      }
      return instance;
    }
  };
})();

var HouseObservableSingleton = (function () {
 var instance;

 function createInstance() {
   return new HouseObservable();
 }

 return {
   getInstance: function () {
    if (!instance) {
        instance = createInstance();
    }
    return instance;
    }
 };
})();

class HouseObservable {
  constructor() {
    this.observers = [];
  }

  subscribe (observer) {
    this.observers.push(observer);

    HouseFavoritesSingleton.getInstance().ondata = (e) => {
      this.observers.forEach((observer) => {
        observer.next(e);
      });
    }
  }

  broadcast(data) {
    HouseFavoritesSingleton.getInstance().ondata(data);
  }
}

class HouseFavoritesStore {
  constructor () {
    this.ondata().then((resp) => {
      houseObservable.broadcast(resp);
    });
  }

  toggle (houseCode, liked) {
      /*this.toggleFavorite(houseCode, liked).then((resp) => {
        houseObservable.broadcast(resp);
      });*/
  }

  toggleFavorite(houseCode, liked) { //call some other API method
    /*return new Promise((resolve, reject) => {
        fetch(`/api/house-favorites/current`, { method: "GET" })
          .then(resolve)
          .catch(reject); // TODO: proper error handling 😢
        });*/
  }

  ondata() {
    return new Promise((resolve, reject) => {
        fetch(`/api/house-favorites/current`, { method: "GET" })
          .then(resolve)
          .catch(reject); // TODO: proper error handling 😢
        });
  }
}

let houseObservable = new HouseObservable();

class HouseFavoritesToggle extends HTMLElement {
  connectedCallback () {

    HouseObservableSingleton.getInstance().subscribe({
      next(houseFavorites) {
        //console.log('was called');
        houseFavorites.find(code => {
          if(code === this.houseCode) {
            this.liked = liked;
            this.innerHTML = `House #${this.houseCode} (${this.liked})`;
          }
        })
      }
    });
  }

  toggleFavorite() {
    HouseFavoritesSingleton.getInstance().toggleFavorite(this.houseCode, !this.liked);
  }

  get houseCode () {
    return this.getAttribute("house-code");
  }
}

customElements.define("house-favorites-toggle", HouseFavoritesToggle);

// mock AJAX interactions
function fetch(uri, options) {
  console.log(options.method, uri);
  return new Promise((resolve, reject) => {
    setTimeout(_ => {
      resolve(["123"]);
    }, 200);
  });
}