(function($) {
  // firestore ref
  var db;

  // auth and setup event handlers
  var init = function() {
    auth();

    $("#ContactTable").on("click", "button.edit", edit);
    $("#ContactTable").on("click", "button.remove", remove);
    $("#ContactAdd").click(add);
    $("#ContactForm").submit(save);
  };

  // init on doc ready
  $(document).ready(init);

  // sign-in anonymously
  var auth = function() {
    firebase
      .auth()
      .signInAnonymously()
      .then(function(result) {
        db = firebase.firestore();
        db.settings({
          timestampsInSnapshots: true
        });

        list();
      })
      .catch(function(error) {
        alert("failed to anonymously sign-in");
      });
  };

  var listTempLi;
  // load list
  var list = function() {
    var ulBody = $("#contacts");
    //remove any data rows
    ulBody.find("li.data").remove();
    //get template row
    var tempLi = ulBody
      .find("li.data-temp")
      .removeClass("data-temp")
      .addClass("data")
      .remove();
    if (tempLi.length) {
      listTempLi = tempLi;
    } else {
      tempLi = listTempLi;
    }

    // get collection of Contacts
    db.collection("contacts")
      .get()
      .then(function(querySnapshot) {
        querySnapshot.forEach(function(doc) {
          // clone template row and append to table body
          var li = tempLi.clone();
          li.data("id", doc.id);
          var data = doc.data();
          // set cell values from Contact data
          li.find("span[data-prop]").each(function() {
            var span = $(this);
            span.text(data[span.data("prop")] || "");
          });
          ulBody.append(li);
        });
      });
  };

  db.collection("contacts")
    .where("name", "Ruben Kroes", true)
    .get()
    .then(function(querySnapshot) {
      querySnapshot.forEach(function(doc) {
        // doc.data() is never undefined for query doc snapshots
        console.log(doc.id, " => ", doc.data());
      });
    })
    .catch(function(error) {
      console.log("Error getting documents: ", error);
    });

  // on remove
  var remove = function(e) {
    e.preventDefault();
    var id = $(this)
      .parents("tr:first")
      .data("id");
    db.collection("contacts")
      .doc(id)
      .delete()
      .then(function() {
        // reload list
        list();
      })
      .catch(function(error) {
        alert("failed to remove contact");
      });
  };

  // on add
  var add = function(e) {
    e.preventDefault();
    open("");
  };

  // on edit
  var edit = function(e) {
    e.preventDefault();
    var id = $(this)
      .parents("tr:first")
      .data("id");
    open(id);
  };

  // open form modal
  var open = function(id) {
    var modal = $("#ContactModal");
    // set current Contact id
    modal.data("id", id);
    // reset all inputs
    modal.find("input").val("");
    modal.modal("show");

    if (!id) return;

    // get Contact to edit
    db.collection("contacts")
      .doc(id)
      .get()
      .then(function(doc) {
        if (doc.exists) {
          var data = doc.data();
          //set form inputs from Contact data
          modal.find("input[data-prop]").each(function() {
            var inp = $(this);
            inp.val(data[inp.data("prop")] || "");
          });
        } else {
          alert("No such record");
        }
      })
      .catch(function(error) {
        alert("failed to read contact");
      });
  };

  // update or add
  var save = function(e) {
    e.preventDefault();

    var modal = $("#ContactModal");
    var id = modal.data("id");
    var data = {};
    //read values from form inputs
    modal.find("input[data-prop]").each(function() {
      var inp = $(this);
      data[inp.data("prop")] = inp.val();
    });

    // update or add
    (id
      ? db
          .collection("contacts")
          .doc(id)
          .update(data)
      : db.collection("contacts").add(data)
    )
      .then(function(result) {
        // hide modal and reload list
        modal.modal("hide");
        list();
      })
      .catch(function(error) {
        alert("failed to save contact");
      });
  };
})(jQuery);