From 357831fb54ab6a832df76924676b43689fa0461c Mon Sep 17 00:00:00 2001 From: Patrick Schönberger Date: Thu, 6 Dec 2018 00:57:37 +0100 Subject: html eingecheckt navigation fertig --- html/2 | 214 ++++++++++++++++++++++++++++++++++++++++++++++++++ html/index.html | 236 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ html/script.js | 101 ++++++++++++++++++++++++ 3 files changed, 551 insertions(+) create mode 100644 html/2 create mode 100644 html/index.html create mode 100644 html/script.js (limited to 'html') diff --git a/html/2 b/html/2 new file mode 100644 index 0000000..8a7d871 --- /dev/null +++ b/html/2 @@ -0,0 +1,214 @@ + + + + + lol stats + + + + + + + + +
+ + +
+ + +
+ + + +
+ +
+
+ + +
+ +
+ + + + + diff --git a/html/index.html b/html/index.html new file mode 100644 index 0000000..d0bd6c9 --- /dev/null +++ b/html/index.html @@ -0,0 +1,236 @@ + + + + + lol stats + + + + + + + + +
+ + +
+ + +
+ + + +
+ +
+
+ + +
+ +
+ + + + + diff --git a/html/script.js b/html/script.js new file mode 100644 index 0000000..518f5fb --- /dev/null +++ b/html/script.js @@ -0,0 +1,101 @@ +// Start Screen +// ------------ +function getRegions() { + return [ "euw", "na", "kr", "br" ]; +} + +function toggleStart(up) { + $("#start").removeClass(up ? "down" : "up"); + $("#start").addClass(up ? "up" : "down"); +} +function slideStart() { + $("#start").addClass("slideup"); +} +function slideSlideUp() { + $("#slide").addClass("slideup"); +} +function slideSlideLeft() { + $("#slide").removeClass("slideright"); + $("#slide").addClass("slideleft"); +} +function slideSlideRight() { + $("#slide").removeClass("slideleft"); + $("#slide").addClass("slideright"); +} +function toggleSlideLeft() { + $("#slide").addClass("left"); +} + +var app = new Vue({ + el: '#app', + data: { + regions: getRegions(), + region: "euw", + summoner: "", + }, + methods: { + startToHistory: function() { + window.history.pushState("object or string", "Title", + "/?summoner=" + + $("#nameinput").val() + + "®ion=" + + $("#regionselect").val() + + "&view=history"); + + slideStart(); + $("#matchhistory").show(); + slideSlideUp(); + app.startToHistory = ()=>{}; + }, + historyToStats: function() { + window.history.pushState("object or string", "Title", + "/?summoner=" + + $("#nameinput").val() + + "®ion=" + + $("#regionselect").val() + + "&view=stats"); + + $("#stats").show(); + slideSlideLeft(); + setTimeout(() => { + $("#matchhistory").hide(); + }, 300); + }, + statsToHistory: function() { + window.history.pushState("object or string", "Title", + "/?summoner=" + + $("#nameinput").val() + + "®ion=" + + $("#regionselect").val() + + "&view=history"); + + $("#matchhistory").show(); + slideSlideRight(); + setTimeout(() => { + $("#stats").hide(); + }, 300); + }, + }, +}); + +// Check for URL parameters +let url = new URL(window.location.href); +if (url.searchParams.has("summoner")) + app.summoner = url.searchParams.get("summoner"); +if (url.searchParams.has("region")) + app.region = url.searchParams.get("region"); +if (url.searchParams.has("view")) { + let view = url.searchParams.get("view"); + if (view == "history") { + toggleStart(true); + $("#matchhistory").show(); + app.startToHistory = ()=>{}; + } + else if (view == "stats") { + toggleStart(true); + $("#stats").show(); + toggleSlideLeft(); + app.startToHistory = ()=>{}; + } +} +// ------------ -- cgit v1.2.3