/* don't look too close here, this is messy :raugh:*/
import "https://bananocoin.github.io/bananojs/dist/bananocoin-bananojs.js";

const bananojs = window.bananocoinBananojs;
bananojs.setBananodeApiUrl("https://kaliumapi.appditto.com/api");

async function bananoHistory(addr) {
  let history = await bananojs.getAccountHistory(addr, 5);
  history = history["history"];
  return history;
}

const input = document.getElementById("input");
var currentFocus;
var fallbackFocus;
var firstClick = true;

//TODO kirby ban_1kirby19w89i35yenyesnz7zqdyguzdb3e819dxrhdegdnsaphzeug39ntxj
const banano_team = [
  "fudcake",
  "bbedward",
  "yekta",
  "just_dmitry",
  "bantano",
  "coranos",
  "anemone",
  "soggyapplepie",
  "renesq",
  "ptera",
  "mitche50",
  "meltingice",
  "losha1x",
  "wtp"
].sort();

const banano_info = {
  fudcake: [
    "The Banano Republic dictator trainee",
    "ban_3fudcakefr9jyw7b4kfafrgaekmd37ez7q4pmzuo1fd7wo9jo8gsha7z7e1c"
  ],
  bbedward: "Ima bot bleep blob",
  yekta: [
    "Leonardo da Banano",
    "ban_1yekta1xn94qdnbmmj1tqg76zk3apcfd31pjmuy6d879e3mr469a4o4sdhd4"
  ],
  just_dmitry: "бест рашн хацкер",
  bantano: [
    "Ringleader of media operations",
    "ban_19bantanopcajd8ptfg9aedn8osgrzyrbupte5j4p1je69e5diz8qtc4dopf"
  ],
  coranos: [
    "Hardware wallet, vulcanology, and burn specialist",
    "ban_1coranoshiqdentfbwkfo7fxzgg1jhz6m33pt9aa8497xxfageuskroocdxa"
  ],
  anemone: [
    "Chief shitposting orangutan, meme historian",
    "ban_1waifusa1tnk3eo7dstc4z9tt7puurh5jyettyj59mis5m86ofiwywahcccm"
  ],
  soggyapplepie: [
    "Baked goods connoisseur",
    "ban_1sogg99ytfm53pie7fg7hg9rcfm6668636j4pmcs3y9wbere1dizfxdd7rm8"
  ],
  renesq: [
    "Gandalf level code wizard and chronic procrastinator",
    "ban_3renesqym44gjo7oxt9knhtfgh6un9hc4bzgnjrxpku874cb3dqbuyi7oxha"
  ],
  ptera: "Billionaire vigilante",
  mitche50: [
    "Doer of things",
    "ban_1mitchx3astnak65kob76fnkaaj8nro7yaoofwb7cf1wts737xyixnjwzgsg"
  ],
  meltingice: "Leader of the curious explorers",
  losha1x: "Professional life hater",
  wtp: "Fees are the future"
};

let links = document.getElementsByTagName("a");
let theme = document.getElementById("theme");
for (let i = 0; i < links.length; i++) {
  links[i].addEventListener("mouseover", function () {
    if (theme.classList.contains("dark")) {
      links[i].style.color = "#c5ac10";
    } else {
      links[i].style.color = "#000";
    }
  });
  links[i].addEventListener("mouseout", function () {
    if (theme.classList.contains("dark")) {
      links[i].style.color = "#fbdd11";
    } else {
      links[i].style.color = "#50514F";
    }
  });
}

function toggleStyle() {
  let theme = document.getElementById("theme");
  let h1 = document.getElementsByTagName("h1");
  let bio = document.getElementById("bio");
  let p = document.getElementsByTagName("p");
  let a = document.getElementsByTagName("a");
  let h2 = document.getElementsByTagName("h2");
  let h3 = document.getElementsByTagName("h3");
  let label = document.getElementsByTagName("label");
  let result = document.getElementById("result");
  let r = document.getElementsByClassName("result");
  let info = document.getElementById("info");
  let transactions = document.getElementById("transactions");

  if (theme.classList.contains("dark")) {
    document.body.style.backgroundImage =
      "url('https://volcano.coranos.cc/banano/bg-hero.svg')";
    theme.setAttribute("class", "light");
    theme.style.background = "#50514F";
    theme.style.border = "2px solid #4CBF4B";
    bio.style.background = "#4CBF4B";

    for (let i = 0; i < h1.length; i++) h1[i].style.color = "#50514F";
    for (let i = 0; i < p.length; i++) p[i].style.color = "#000";
    for (let i = 0; i < a.length; i++) a[i].style.color = "#50514F";
    for (let i = 0; i < h2.length; i++) h2[i].style.color = "#50514F";
    for (let i = 0; i < h3.length; i++) h3[i].style.color = "#50514F";
    for (let i = 0; i < label.length; i++) label[i].style.color = "#000";
    if (result) result.style.background = "#212124";
    for (let i = 0; i < r.length; i++) {
      r[i].style.color = "#fbdd11";
      r[i].style.background = "#212124";
    }
    if (info) info.style.background = "#4CBF4B";
    if (transactions) transactions.style.background = "#4CBF4B";
  } else {
    document.body.style.backgroundImage =
      "url('https://faucet.banoboto.repl.co/images/jungle.svg')";
    theme.setAttribute("class", "dark");
    theme.style.background = "#3A9139";
    theme.style.border = "2px solid #338233";
    bio.style.background = "#212124";

    for (let i = 0; i < h1.length; i++) h1[i].style.color = "#fbdd11";
    for (let i = 0; i < p.length; i++) p[i].style.color = "#fff";
    for (let i = 0; i < a.length; i++) a[i].style.color = "#fbdd11";
    for (let i = 0; i < h2.length; i++) h2[i].style.color = "#fbdd11";
    for (let i = 0; i < h3.length; i++) h3[i].style.color = "#fbdd11";
    for (let i = 0; i < label.length; i++) label[i].style.color = "#fbdd11";
    if (result) result.style.background = "#4CBF4B";
    for (let i = 0; i < r.length; i++) {
      r[i].style.color = "#000";
      r[i].style.background = "#4CBF4B";
    }
    if (info) info.style.background = "#212124";
    if (transactions) transactions.style.background = "#212124";
  }
}

function adjustTheme() {
  let dark_theme = document.getElementById("theme").classList.contains("dark");
  let p = document.getElementsByTagName("p");
  let h2 = document.getElementsByTagName("h2");
  let info = document.getElementById("info");
  let transactions = document.getElementById("transactions");
  if (dark_theme) {
    for (let i = 0; i < p.length; i++) p[i].style.color = "#fff";
    for (let i = 0; i < h2.length; i++) h2[i].style.color = "#fbdd11";
    if (info) info.style.background = "#212124";
    if (transactions) transactions.style.background = "#212124";
  } else {
    for (let i = 0; i < p.length; i++) p[i].style.color = "#000";
    for (let i = 0; i < h2.length; i++) h2[i].style.color = "#50514F";
    if (info) info.style.background = "#4CBF4B";
    if (transactions) transactions.style.background = "#4CBF4B";
  }
}

function autocomplete() {
  const events = ["input", "click"];
  for (let i in events) {
    input.addEventListener(events[i], function (e) {
      var a,
        b,
        i,
        val = this.value;
      closeList();
      currentFocus = -1;
      fallbackFocus = -1;
      a = document.createElement("DIV");
      a.setAttribute("id", "result");
      a.setAttribute("class", "items");
      this.parentNode.appendChild(a);
      for (i = 0; i < banano_team.length; i++) {
        if (
          banano_team[i].substr(0, val.length).toUpperCase() ==
            val.toUpperCase() ||
          val == "" ||
          val == " "
        ) {
          b = document.createElement("DIV");
          b.innerHTML =
            "<strong>" + banano_team[i].substr(0, val.length) + "</strong>";
          b.innerHTML += banano_team[i].substr(val.length);
          b.innerHTML += "<input type='hidden' value='" + banano_team[i] + "'>";
          b.addEventListener("click", function (e) {
            input.value = this.getElementsByTagName("input")[0].value;
            closeList();
            showInfo(input.value);
            adjustTheme();
          });
          b.setAttribute("class", "result " + a.childElementCount);
          a.appendChild(b);
        }
      }
      let dark_theme = document
        .getElementById("theme")
        .classList.contains("dark");
      let r = document.getElementsByClassName("result");
      if (dark_theme) {
        a.style.background = "#212124";
        for (let i = 0; i < r.length; i++) {
          r[i].style.color = "#fbdd11";
          r[i].style.background = "#212124";
        }
      } else {
        a.style.background = "#4CBF4B";
        for (let i = 0; i < r.length; i++) {
          r[i].style.color = "#000";
          r[i].style.background = "#4CBF4B";
        }
      }

      if (
        bananojs.getBananoAccountValidationInfo(input.value.trim())["valid"]
      ) {
        let empty = document.createElement("DIV");
        empty.innerHTML = "'enter' to query this banano address";
        empty.classList.add("nomatches");
        a.appendChild(empty);
      } else if (!a.hasChildNodes()) {
        let empty = document.createElement("DIV");
        empty.innerHTML = "no matches found";
        empty.classList.add("nomatches");
        a.appendChild(empty);
      }

      document.addEventListener("click", function (e) {
        let input = document.getElementById("input");
        if (firstClick) {
          firstClick = false;
          input.click();
        }
        if (!input.contains(e.target) && !res.contains(e.target)) {
          closeList(res);
        }
      });
      // change selected index to start from hovered element, unmark keyboard select when hover, set last keyboard selection as fallback value if mouseout
      let results = document.getElementsByClassName("result");
      let res = document.getElementById("result");
      for (let i = 0; i < results.length; i++) {
        results[i].addEventListener("mouseover", function () {
          currentFocus = results[i].className.split(" ")[1];
          res = document.getElementById("result");
          updateActive(res, false);
        });
        results[i].addEventListener("mouseout", function () {
          currentFocus = fallbackFocus;
          res = document.getElementById("result");
          updateActive(res, false);
        });
      }
    });
  }

  input.addEventListener("keydown", function (e) {
    var res = document.getElementById("result");
    if (res) res = res.getElementsByTagName("div");

    if (e.keyCode == 40) {
      currentFocus++;
      fallbackFocus = currentFocus;
      updateActive(res, true);
    } else if (e.keyCode == 38) {
      currentFocus--;
      fallbackFocus = currentFocus;
      updateActive(res, true);
    } else if (e.keyCode == 13) {
      e.preventDefault();
      // use ban address if valid
      if (
        bananojs.getBananoAccountValidationInfo(input.value.trim())["valid"]
      ) {
        showInfo(input.value.trim());
        // allo
        return;
      } else console.log("false no");
      // select first option if only one result available
      if (
        currentFocus == 0 ||
        (res && res.length == 1 && !res[0].classList.contains("nomatches"))
      )
        res[0].click();
      // else select focused result
      else if (currentFocus == -1) return false;
      else if (res && currentFocus) res[currentFocus].click();
    }
    adjustTheme();
  });

  function updateActive(res, isKeyInput) {
    if (!res) return false;
    if (!isKeyInput) res = res.getElementsByTagName("div");
    removeActive(res);
    if (currentFocus >= res.length) currentFocus = 0;
    if (currentFocus < 0) currentFocus = res.length - 1;
    res[currentFocus].classList.add("active");
    let dark_theme = document
      .getElementById("theme")
      .classList.contains("dark");
    if (dark_theme) {
      res[currentFocus].style.background = "#4cbf4b";
    } else {
      res[currentFocus].style.background = "#50514F";
    }
  }

  function removeActive(element) {
    for (var i = 0; i < element.length; i++) {
      element[i].classList.remove("active");
      element[i].style.background = "none";
    }
  }

  function closeList(element) {
    var x = document.getElementsByClassName("items");
    for (var i = 0; i < x.length; i++) {
      if (element != x[i] && element != input) {
        x[i].parentNode.removeChild(x[i]);
      }
    }
  }

  async function showInfo(key) {
    // banano address handling berry mess
    if (!(key in banano_info)) {
      banano_info["special kind of monkey"] = ["This is you? Probably.", key];
      key = "special kind of monkey";
    }

    let info = document.getElementById("info");
    if (info) document.body.removeChild(info);

    info = document.createElement("DIV");
    info.setAttribute("id", "info");
    let content;
    if (banano_info[key].length != 2) {
      content = "<h2>" + key + "</h2>" + "<p>" + banano_info[key] + "</p>";
    } else {
      content =
        "<h2>" +
        key +
        "</h2>" +
        "<p>" +
        banano_info[key][0] +
        "</p>" +
        "<p>" +
        '<a href="https://creeper.banano.cc/account/' +
        banano_info[key][1] +
        '"f>' +
        banano_info[key][1] +
        "</a>" +
        "</p>";
    }

    info.innerHTML = content;
    document.body.appendChild(info);

    let transactions = document.getElementById("transactions");
    if (transactions) {
      transactions.parentNode.removeChild(transactions);
    }

    if (banano_info[key].length != 2) {
      return false;
    } else {
      let balance =
        (await bananojs.getAccountBalanceRaw(banano_info[key][1])) /
        100000000000000000000000000000;
      balance = balance.toFixed(2);

      transactions = document.createElement("DIV");
      transactions.setAttribute("id", "transactions");
      transactions.innerHTML =
        "<h3>balance " + balance + " ban</h3><h2>recent transactions</h2>";

      let history = await bananoHistory(banano_info[key][1]);
      let tDiv = document.createElement("DIV");
      tDiv.setAttribute("id", "tDiv");

      const monkey =
        "<img src='https://monkey.banano.cc/api/v1/monkey/" +
        banano_info[key][1] +
        "'>";
      let tHistory = document.createElement("DIV");
      tHistory.setAttribute("id", "tHistory");
      for (let i = 0; i < history.length; i++) {
        let temp = document.createElement("P");
        let send = "send" == history[i]["type"];
        let from;
        let date = new Date(
          history[i]["local_timestamp"] * 1000
        ).toLocaleString();
        send ? (from = "to") : (from = "from");
        send ? (send = "sent") : (send = "received");
        temp.innerHTML =
          send +
          " " +
          (Math.round(history[i]["amount_decimal"] * 100) / 100).toFixed(2) +
          " ban" +
          " " +
          from +
          " <br>" +
          '<a href="https://creeper.banano.cc/account/' +
          history[i]["account"] +
          '">' +
          history[i]["account"] +
          "</a>" +
          "<br>at " +
          date;
        tHistory.append(temp);
      }

      tDiv.appendChild(tHistory);
      tDiv.innerHTML += monkey;

      transactions.appendChild(tDiv);
      document.body.appendChild(transactions);
      adjustTheme();
    }
  }
  document.getElementById("theme").addEventListener("click", toggleStyle);
}

autocomplete();