X-Git-Url: https://gitweb.ps.run/lolstats/blobdiff_plain/055e447bc0c9d170a54733539104976ec1c9004c..cc2c4151a7641025525c1b9f51b081690d7d17a7:/html/script.js diff --git a/html/script.js b/html/script.js index cee77f6..7a150c4 100644 --- a/html/script.js +++ b/html/script.js @@ -1,8 +1,14 @@ function getRegions() { - return [ "euw", "na", "kr", "br" ]; + $.ajax("/lol/regions") + .done((data) => { + app.regions = JSON.parse(data); + }); } function getChampions() { - return [ {name: "Aatrox"}, {name: "Annie"}, {name: "Braum"}, {name: "Not"} ]; + $.ajax("/lol/champions") + .done((data) => { + app.champions = JSON.parse(data); + }); } function getMatchProps() { return [ @@ -11,10 +17,10 @@ function getMatchProps() { ]; } function getMatches() { - return [ - {champ: "Xerath", lane: "Middle"}, - {champ: "Quinn", lane: "Bottom"}, - ]; + $.ajax("/lol/matches?region=" + app.region + "&summoner=" + app.summoner) + .done((data) => { + app.matches = JSON.parse(data); + }); } function getInfo() { app.summoner = $("#nameinput").val(); @@ -29,6 +35,14 @@ function setUrl() { "&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"); @@ -37,23 +51,31 @@ function slideStartDown() { $("#start").removeClass("slideup"); $("#start").addClass("slidedown"); } -function changeView(view) { - if (view != "start" && view != "history" && view != "stats") { - setUrl(); - return; +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("slide", { direction: "down" }, 300); + $("#matchhistory").show("blind", { direction: "down" }, 300); } else if (view == "stats") { slideStartUp(); - $("#stats").show("slide", { direction: "down" }, 300); + $("#stats").show("blind", { direction: "down" }, 300); } } else if (oldView == "history") { if (view == "start") { - $("#matchhistory").hide("slide", { direction: "down" }, 300); + $("#matchhistory").hide("blind", { direction: "down" }, 300); slideStartDown(); } else if (view == "stats") { $("#stats").show("blind", { direction: "right" }); @@ -61,7 +83,7 @@ function changeView(view) { } } else if (oldView == "stats") { if (view == "start") { - $("#stats").hide("slide", { direction: "down" }, 300); + $("#stats").hide("blind", { direction: "down" }, 300); slideStartDown(); } else if (view == "history") { $("#matchhistory").show("blind", { direction: "left" }); @@ -75,11 +97,11 @@ let app = new Vue({ data: { summoner: "", region: "", - view: "start", - regions: getRegions(), - champions: getChampions(), - matchprops: getMatchProps(), - matches: getMatches(), + view: "", + regions: [], + champions: [], + matchprops: [], + matches: [], }, methods: { submit: function() { @@ -97,12 +119,12 @@ let app = new Vue({ setUrl(); }, refreshHistory: function() { + getMatches(); }, }, }); function parseUrl() { - console.log("parseUrl"); let url = new URL(window.location.href); if (url.searchParams.has("summoner")) { app.summoner = url.searchParams.get("summoner"); @@ -114,11 +136,22 @@ function parseUrl() { } if (url.searchParams.has("view")) { let view = url.searchParams.get("view"); - changeView(view); + if (view != "start" && view != "history" && view != "stats") { + view = "start"; + } + return view; } else { - changeView("start"); + return "start"; } } -window.addEventListener('popstate', parseUrl); -window.addEventListener('load', parseUrl); +window.addEventListener('popstate', () => { + let view = parseUrl(); + changeView(view); +}); +window.addEventListener('load', () => { + let view = parseUrl(); + setView(view); + getRegions(); + getChampions(); +});