diff --git a/site/alkali_metal.html b/site/alkali_metal.html index 052d9ab..7009204 100644 --- a/site/alkali_metal.html +++ b/site/alkali_metal.html @@ -17,6 +17,15 @@ div#app { display: flex; + } + + div#past-polls { + flex-grow: 1 + } + + div#poll-creator { + flex-grow: 2; + display: flex; flex-wrap: wrap; } @@ -46,27 +55,44 @@

CGE Poll Quick-Creator

-
-

{{poll.name}}

-

- Duration: {{poll.data.duration}} seconds -
- Choices: -

- +
+

Previous Polls

+
+

{{poll.title}}

+ Winner: {{poll.winner.title}} +
+
+
+
+

{{poll.name}}

+

+ Duration: {{poll.data.duration}} seconds +
+ Choices: +

+
    +
  • + {{choice.title}} +
    • +
+ +
@@ -74,20 +100,47 @@ let app = new Vue({ el: "#app", methods: { + async get_past_polls() { + try { + let r = await axios.get("/polls/twitch/czechgamesedition/poll"); + this.allPolls = r.data; + } catch (err) { + console.error(err); + }; + }, async start_poll(poll_data) { try { - await axios.post("/polls/twitch/alkali_metal/poll", poll_data); + await axios.post("/polls/twitch/czechgamesedition/poll", poll_data); let qs = new URLSearchParams(window.location.search); if (!qs.has("no_alert")) { alert("Poll should've been created successfully."); }; } catch (err) { console.error(err); - alert("Something went wrong starting the poll, check to see if one is made already.") - } - } + alert("Something went wrong starting the poll, check to see if one is made already."); + }; + }, + }, + computed: { + pastPolls() { + return this.allPolls + .filter(p => [`completed`, `terminated`, `invalid`].includes(p.status)) + .map(p => { + return { + id: p.id, + winner: p.choices.sort((a, b) => a.votes > b.votes)[0], + title: p.title, + status: p.status, + }; + }); + }, + }, + mounted() { + this.get_past_polls(); + // this.previous_poll_interval = setInterval(this.get_past_polls, 5_000); }, data: { + allPolls: [], polls: [ { name: "Wavelength Region Choice (FIRST POLL)", diff --git a/site/czechgamesedition.html b/site/czechgamesedition.html index fbf9467..9f5e09f 100644 --- a/site/czechgamesedition.html +++ b/site/czechgamesedition.html @@ -13,14 +13,28 @@ background: #2c2f32; color: white; font-family: 'Roboto', sans-serif; + margin: 0; + padding: 0; } div#app { + display: grid; + grid-template-columns: 30% 14px 100fr; + } + + div#past-polls { + width: 100%; + } + + div#poll-creator { + flex-grow: 2; display: flex; flex-wrap: wrap; } - div.poll-data { + div.poll-data, + div.poll-info + { margin: 5px; padding: 10px; background: #202225; @@ -31,6 +45,20 @@ border-color: transparent; } + div.poll-data { + display: flex; + flex-direction: column; + } + div.poll-data > ul { + flex-grow: 1; + } + + div.vertical-divider { + width: 2px; + background: white; + margin: 0 6px; + } + .poll-data > h4 { margin: 0; margin-bottom: 5px; @@ -43,30 +71,53 @@ -

CGE Poll Quick-Creator

-
-
-

{{poll.name}}

-

- Duration: {{poll.data.duration}} seconds -
- Choices: -

-
    -
  • - {{choice.title}} -
    • -
-
+
+
+
- Start Poll - +

{{poll.name}}

+

+ Duration: {{poll.data.duration}} seconds +
+ Choices: +

+
    +
  • + {{choice.title}} +
    • +
+ +
@@ -74,6 +125,14 @@ let app = new Vue({ el: "#app", methods: { + async get_past_polls() { + try { + let r = await axios.get("/polls/twitch/czechgamesedition/poll"); + this.allPolls = r.data; + } catch (err) { + console.error(err); + }; + }, async start_poll(poll_data) { try { await axios.post("/polls/twitch/czechgamesedition/poll", poll_data); @@ -83,11 +142,41 @@ let app = new Vue({ }; } catch (err) { console.error(err); - alert("Something went wrong starting the poll, check to see if one is made already.") - } - } + alert("Something went wrong starting the poll, check to see if one is made already."); + }; + }, + }, + computed: { + pastPolls() { + return this.allPolls + .filter(p => [`completed`, `terminated`, `invalid`, `archived`].includes(p.status.toLowerCase())) + .slice(0, 3) + .map(p => { + let winners = []; + let maxVotes = -1; + for (const choice of p.choices) { + if (choice.votes > maxVotes) { + winners = [choice]; + maxVotes = choice.votes; + } else if (choice.votes == maxVotes) { + winners.push(choice); + }; + }; + return { + id: p.id, + winners, + title: p.title, + status: p.status, + }; + }); + }, + }, + mounted() { + this.previous_poll_interval = setInterval(this.get_past_polls, 5_000); }, data: { + allPolls: [], + previous_poll_interval: null, polls: [ { name: "Wavelength Region Choice (FIRST POLL)",