gitweb.ps.run Git - lolstats/blob - html/script.js

   1 function getRegions() {
   2   return [ "euw", "na", "kr", "br" ];
   3 }
   4 function getChampions() {
   5   return [ {name: "Aatrox"}, {name: "Annie"}, {name: "Braum"}, {name: "Not"} ];
   6 }
   7 function getMatchProps() {
   8   return [
   9     {text: "Champion", name: "champ"},
  10     {text: "Lane", name: "lane"},
  11   ];
  12 }
  13 function getMatches() {
  14   return [
  15     {champ: "Xerath", lane: "Middle"},
  16     {champ: "Quinn", lane: "Bottom"},
  17   ];
  18 }
  19 function getInfo() {
  20   app.summoner = $("#nameinput").val();
  21   app.region = $("#regionselect").val();
  22 }
  23 function setUrl() {
  24   window.history.pushState("object or string", "Title",
  25     "/lol?summoner=" +
  26     app.summoner +
  27     "&region=" +
  28     app.region +
  29     "&view=" +
  30     app.view);
  31 }
  32 function toggleStartUp() {
  33   $("#start").removeClass("down");
  34   $("#start").addClass("up");
  35 }
  36 function toggleStartDown() {
  37   $("#start").removeClass("up");
  38   $("#start").addClass("down");
  39 }
  40 function slideStartUp() {
  41   $("#start").removeClass("slidedown");
  42   $("#start").addClass("slideup");
  43 }
  44 function slideStartDown() {
  45   $("#start").removeClass("slideup");
  46   $("#start").addClass("slidedown");
  47 }
  48 function setView(view) {
  49   console.log("Setting view to " + view);
  50   if (view == "history") {
  51     toggleStartUp();
  52     $("#matchhistory").show();
  53   } else if (view == "stats") {
  54     toggleStartUp();
  55     $("#stats").show();
  56   }
  57   app.view = view;
  58 }
  59 function changeView(view) {
  60   let oldView = app.view;
  61   console.log("changing view from " + oldView + " to " + view);
  62   if (oldView == "start") {
  63     if (view == "history") {
  64       slideStartUp();
  65       $("#matchhistory").show("blind", { direction: "down" }, 300);
  66     } else if (view == "stats") {
  67       slideStartUp();
  68       $("#stats").show("blind", { direction: "down" }, 300);
  69     }
  70   } else if (oldView == "history") {
  71     if (view == "start") {
  72       $("#matchhistory").hide("blind", { direction: "down" }, 300);
  73       slideStartDown();
  74     } else if (view == "stats") {
  75       $("#stats").show("blind", { direction: "right" });
  76       $("#matchhistory").hide("blind", { direction: "left" });
  77     }
  78   } else if (oldView == "stats") {
  79     if (view == "start") {
  80       $("#stats").hide("blind", { direction: "down" }, 300);
  81       slideStartDown();
  82     } else if (view == "history") {
  83       $("#matchhistory").show("blind", { direction: "left" });
  84       $("#stats").hide("blind", { direction: "right" });
  85     }
  86   }
  87   app.view = view;
  88 }
  89 let app = new Vue({
  90   el: '#app',
  91   data: {
  92     summoner: "",
  93     region: "",
  94     view: "",
  95     regions: getRegions(),
  96     champions: getChampions(),
  97     matchprops: getMatchProps(),
  98     matches: getMatches(),
  99   },
 100   methods: {
 101     submit: function() {
 102       getInfo();
 103       if (app.view == "start")
 104         changeView("history");
 105       setUrl();
 106     },
 107     historyToStats: function() {
 108       changeView("stats");
 109       setUrl();
 110     },
 111     statsToHistory: function() {
 112       changeView("history");
 113       setUrl();
 114     },
 115     refreshHistory: function() {
 116     },
 117   },
 118 });
 119
 120 function parseUrl() {
 121   let url = new URL(window.location.href);
 122   if (url.searchParams.has("summoner")) {
 123     app.summoner = url.searchParams.get("summoner");
 124     $("#nameinput").val(app.summoner);
 125   }
 126   if (url.searchParams.has("region")) {
 127     app.region = url.searchParams.get("region");
 128     $("#regionselect").val(app.region);
 129   }
 130   if (url.searchParams.has("view")) {
 131     let view = url.searchParams.get("view");
 132     if (view != "start" && view != "history" && view != "stats") {
 133       view = "start";
 134     }
 135     return view;
 136   } else {
 137     return "start";
 138   }
 139 }
 140
 141 window.addEventListener('popstate', () => {
 142   let view = parseUrl();
 143   changeView(view);
 144 });
 145 window.addEventListener('load', () => {
 146   let view = parseUrl();
 147   setView(view);
 148 });