function getRegions() {
  return {
    "BR": "br1.api.riotgames.com",
    "EUNE": "eun1.api.riotgames.com",
    "EUW": "euw1.api.riotgames.com",
    "JP": "jp1.api.riotgames.com",
    "KR": "kr.api.riotgames.com",
    "LAN": "la1.api.riotgames.com",
    "LAS": "la2.api.riotgames.com",
    "NA": "na1.api.riotgames.com",
    "OCE": "oc1.api.riotgames.com",
    "TR": "tr1.api.riotgames.com",
    "RU": "ru.api.riotgames.com",
    "PBE": "pbe1.api.riotgames.com",
  };
}
function getQueues() {
  return {
    0   	: "Custom",
    2   	: "5v5 Blind Pick",
    4   	: "5v5 Ranked Solo",
    6   	: "5v5 Ranked Premade",
    7   	: "Co-op vs AI",
    8   	: "3v3 Normal",
    9   	: "3v3 Ranked Flex",
    14  	: "5v5 Draft Pick",
    16  	: "5v5 Dominion Blind Pick",
    17  	: "5v5 Dominion Draft Pick",
    25  	: "Dominion Co-op vs AI",
    31  	: "Co-op vs AI Intro Bot",
    32  	: "Co-op vs AI Beginner Bot",
    33  	: "Co-op vs AI Intermediate Bot",
    41  	: "3v3 Ranked Team",
    42  	: "5v5 Ranked Team",
    52  	: "Co-op vs AI",
    61  	: "5v5 Team Builder",
    65  	: "5v5 ARAM",
    70  	: "One for All",
    72  	: "1v1 Snowdown Showdown",
    73  	: "2v2 Snowdown Showdown",
    75  	: "6v6 Hexakill",
    76  	: "Ultra Rapid Fire",
    78  	: "One For All: Mirror Mode",
    83  	: "Co-op vs AI Ultra Rapid Fire",
    91  	: "Doom Bots Rank 1",
    92  	: "Doom Bots Rank 2",
    93  	: "Doom Bots Rank 5",
    96  	: "Ascension",
    98  	: "6v6 Hexakill",
    100 	: "5v5 ARAM",
    300 	: "Legend of the Poro King",
    310 	: "Nemesis",
    313 	: "Black Market Brawlers",
    315 	: "Nexus Siege",
    317 	: "Definitely Not Dominion",
    318 	: "ARURF",
    325 	: "All Random",
    400 	: "5v5 Draft Pick",
    410 	: "5v5 Ranked Dynamic",
    420 	: "5v5 Ranked Solo",
    430 	: "5v5 Blind Pick",
    440 	: "5v5 Ranked Flex",
    450 	: "5v5 ARAM",
    460 	: "3v3 Blind Pick",
    470 	: "3v3 Ranked Flex",
    600 	: "Blood Hunt Assassin",
    610 	: "Dark Star: Singularity",
    700 	: "Clash",
    800 	: "Co-op vs. AI Intermediate Bot",
    810 	: "Co-op vs. AI Intro Bot",
    820 	: "Co-op vs. AI Beginner Bot",
    830 	: "Co-op vs. AI Intro Bot",
    840 	: "Co-op vs. AI Beginner Bot",
    850 	: "Co-op vs. AI Intermediate Bot",
    900 	: "ARURF",
    910 	: "Ascension",
    920 	: "Legend of the Poro King",
    940 	: "Nexus Siege",
    950 	: "Doom Bots Voting",
    960 	: "Doom Bots Standard",
    980 	: "Star Guardian Invasion: Normal",
    990 	: "Star Guardian Invasion: Onslaught",
    1000	: "PROJECT: Hunters",
    1010	: "Snow ARURF",
    1020	: "One for All",
    1030	: "Odyssey Extraction: Intro",
    1040	: "Odyssey Extraction: Cadet",
    1050	: "Odyssey Extraction: Crewmember",
    1060	: "Odyssey Extraction: Captain",
    1070	: "Odyssey Extraction: Onslaught",
    1200	: "Nexus Blitz",
  };
}
function getChampions() {
  $.ajax("/lol/champions")
    .done((data) => {
      app.champions = JSON.parse(data);
    });
}
function getChampLookup() {
  $.ajax("/lol/champlookup")
    .done((data) => {
      app.champlookup = JSON.parse(data);
    });
}
function getMatches() {
  $.ajax("/lol/matches?region=" + app.region + "&summoner=" + app.summoner)
    .done((data) => {
      app.matches = JSON.parse(data);
      for (m in app.matches) {
        app.matches[m].championString = app.champlookup[app.matches[m].champion];
        app.matches[m].queueString = app.queues[app.matches[m].queue];
        app.matches[m].timestampString = new Date(app.matches[m].timestamp).toLocaleString();
      }
    });
}
function getInfo() {
  app.summoner = $("#nameinput").val();
  app.region = $("#regionselect").val();
} 
function setUrl() {
  window.history.pushState("object or string", "Title",
    "/lol?summoner=" +
    app.summoner +
    "&region=" +
    app.region +
    "&view=" +
    app.view);
}
function toggleStartUp() {
  $("#start").removeClass("down");
  $("#start").addClass("up");
}
function toggleStartDown() {
  $("#start").removeClass("up");
  $("#start").addClass("down");
}
function slideStartUp() {
  $("#start").removeClass("slidedown");
  $("#start").addClass("slideup");
}
function slideStartDown() {
  $("#start").removeClass("slideup");
  $("#start").addClass("slidedown");
}
function setView(view) {
  console.log("Setting view to " + view);
  if (view == "history") {
    toggleStartUp();
    $("#matchhistory").show();
  } else if (view == "stats") {
    toggleStartUp();
    $("#stats").show();
  }
  app.view = view;
}
function changeView(view) {
  let oldView = app.view;
  console.log("changing view from " + oldView + " to " + view);
  if (oldView == "start") {
    if (view == "history") {
      slideStartUp();
      $("#matchhistory").show("blind", { direction: "down" }, 300);
    } else if (view == "stats") {
      slideStartUp();
      $("#stats").show("blind", { direction: "down" }, 300);
    }
  } else if (oldView == "history") {
    if (view == "start") {
      $("#matchhistory").hide("blind", { direction: "down" }, 300);
      slideStartDown();
    } else if (view == "stats") {
      $("#stats").show("blind", { direction: "right" });
      $("#matchhistory").hide("blind", { direction: "left" });
    }
  } else if (oldView == "stats") {
    if (view == "start") {
      $("#stats").hide("blind", { direction: "down" }, 300);
      slideStartDown();
    } else if (view == "history") {
      $("#matchhistory").show("blind", { direction: "left" });
      $("#stats").hide("blind", { direction: "right" });
    }
  }
  app.view = view;
}
let app = new Vue({
  el: '#app',
  data: {
    summoner: "",
    region: "",
    view: "",
    regions: getRegions(),
    queues: getQueues(),
    champlookup: [],
    champions: [],
    matchprops: [
      { name: "championString", text: "Champion" },
      { name: "queueString", text: "Queue" },
      { name: "timestampString", text: "Date" },
    ],
    matches: [],
  },
  methods: {
    submit: function() {
      getInfo();
      if (app.view == "start")
        changeView("history");
      setUrl();
      app.matches = [];
      getMatches();
    },
    historyToStats: function() {
      changeView("stats");
      setUrl();
    },
    statsToHistory: function() {
      changeView("history");
      setUrl();
    },
    refreshHistory: function() {
      getMatches();
    },
    selectAll: function() {
      $(".champselectcb").prop('checked', true);
    },
    selectNone: function() {
      $(".champselectcb").prop('checked', false);
    },
  },
});

function parseUrl() {
  let url = new URL(window.location.href);
  if (url.searchParams.has("summoner")) {
    app.summoner = url.searchParams.get("summoner");
    $("#nameinput").val(app.summoner);
  }
  if (url.searchParams.has("region")) {
    app.region = url.searchParams.get("region");
    $("#regionselect").val(app.region);
  }
  if (url.searchParams.has("view")) {
    let view = url.searchParams.get("view");
    if (view != "start" && view != "history" && view != "stats") {
      view = "start";
    }
    return view;
  } else {
    return "start";
  }
}

window.addEventListener('popstate', () => {
  let view = parseUrl();
  changeView(view);
});
window.addEventListener('load', async () => {
  let view = parseUrl();
  setView(view);
  getChampions();
  getChampLookup();
});