From f76ab3d73218d23296d3b9e25aed42da33f99083 Mon Sep 17 00:00:00 2001
From: Matt Isenhower <matt@isenhower.com>
Date: Tue, 9 Oct 2018 13:54:37 -0700
Subject: [PATCH] Modify the schedule tweet when a global Splatfest is open in
 all regions

It would have been better to check this on the back end by using the same Vuex data store as on the front end, but there are currently some complications with bringing that in to Node (because of issues with ES modules) so we have to perform the check twice.
---
 src/app/screenshots/screenshots.js            |  6 ++-
 src/app/twitter/tweets/ScheduleTweet.js       | 31 ++++++++++++-
 .../screenshots/schedules/ScheduleBox.vue     | 17 ++++---
 .../screenshots/schedules/Schedules.vue       | 44 ++++++++++++++++++-
 src/web/components/splatoon/SplatfestBox.vue  | 10 ++++-
 src/web/locale/en.json                        |  1 +
 6 files changed, 97 insertions(+), 12 deletions(-)

diff --git a/src/app/screenshots/screenshots.js b/src/app/screenshots/screenshots.js
index daba6dc..71d49c2 100644
--- a/src/app/screenshots/screenshots.js
+++ b/src/app/screenshots/screenshots.js
@@ -53,10 +53,12 @@ async function captureScreenshot(options) {
     return result;
 }
 
-function captureScheduleScreenshot(now) {
+function captureScheduleScreenshot(now, splatfestBattle = false) {
     let hash = `/schedules/${now}`;
 
-    return captureScreenshot({ hash });
+    let viewport = (splatfestBattle) ? { height: 780 } : undefined;
+
+    return captureScreenshot({ hash, viewport });
 }
 
 function captureGearScreenshot(now) {
diff --git a/src/app/twitter/tweets/ScheduleTweet.js b/src/app/twitter/tweets/ScheduleTweet.js
index ba54903..e261c8d 100644
--- a/src/app/twitter/tweets/ScheduleTweet.js
+++ b/src/app/twitter/tweets/ScheduleTweet.js
@@ -36,7 +36,31 @@ class ScheduleTweet extends TwitterPostBase {
     }
 
     getImage(data) {
-        return captureScheduleScreenshot(data.regular.start_time);
+        return captureScheduleScreenshot(data.regular.start_time, this.globalSplatfestOpenInAllRegions());
+    }
+
+    globalSplatfestOpenInAllRegions() {
+        let festivals = readData('festivals.json');
+        let time = this.getDataTime();
+
+        let festival;
+        let ids = [];
+
+        // Is there an open Splatfest in each region?
+        // (Checking NA last so we can return that one more easily)
+        for (let region of ['eu', 'jp', 'na']) {
+            festival = festivals[region].festivals.find(f => f.times.start <= time && f.times.end > time);
+            if (!festival)
+                return false;
+            ids.push(festival.festival_id);
+        }
+
+        console.log(ids);
+
+        // Only return the Splatfest if the festival IDs match across all regions
+        if (ids[0] === ids[1] && ids[0] === ids[2])
+            return festival;
+        return false;
     }
 
     getText(data) {
@@ -51,6 +75,11 @@ class ScheduleTweet extends TwitterPostBase {
                 return `NEW STAGE: ${stage.name} is now open! #maprotation #splatoon2`;
         }
 
+        let festival = this.globalSplatfestOpenInAllRegions();
+
+        if (festival)
+            return `The global Splatfest is open in all regions! Join the Splatfest Battle on ${data.regular.stage_a.name}, ${data.regular.stage_b.name}, and ${festival.special_stage.name}. #splatfest #maprotation`;
+
         return `Splatoon 2 map rotation: Ranked game mode: ${data.gachi.rule.name}, League game mode: ${data.league.rule.name} #maprotation`;
     }
 }
diff --git a/src/web/components/screenshots/schedules/ScheduleBox.vue b/src/web/components/screenshots/schedules/ScheduleBox.vue
index 1b0dbc0..18233f2 100644
--- a/src/web/components/screenshots/schedules/ScheduleBox.vue
+++ b/src/web/components/screenshots/schedules/ScheduleBox.vue
@@ -1,10 +1,11 @@
 <template>
     <div v-if="schedule" :class="mode">
         <h3 class="title is-3 font-splatoon1 has-text-centered">
-            {{ schedule.game_mode.name }}
+            <template v-if="splatfestBattle">{{ $t('splatfest.battle') }}</template>
+            <template v-else>{{ schedule.game_mode.name }}</template>
         </h3>
 
-        <h5 class="subtitle is-4 font-splatoon2 has-text-centered" style="margin-top: -1rem">
+        <h5 class="subtitle is-4 font-splatoon2 has-text-centered" style="margin-top: -1rem" v-if="!splatfestBattle">
             <div class="image is-32x32" style="margin-bottom: -8px; display: inline-block">
                 <img v-if="schedule.game_mode.key == 'regular'" src="~@/web/assets/img/battle-regular.png" />
                 <img v-if="schedule.game_mode.key == 'gachi'" src="~@/web/assets/img/battle-ranked.png" />
@@ -14,18 +15,24 @@
             {{ schedule.rule.name }}
         </h5>
 
-        <Stage :stage="schedule.stage_a"></Stage>
-        <Stage :stage="schedule.stage_b"></Stage>
+        <Stage :stage="schedule.stage_a" />
+        <Stage :stage="schedule.stage_b" />
+        <Stage v-if="splatfestBattle && currentSplatfest" :stage="currentSplatfest.special_stage" />
     </div>
 </template>
 
 <script>
+import { mapGetters } from 'vuex';
 import Stage from '@/web/components/splatoon/Stage.vue';
 
 export default {
     components: { Stage },
-    props: ['mode'],
+    props: {
+        mode: null,
+        splatfestBattle: Boolean,
+    },
     computed: {
+        ...mapGetters('splatoon/splatfests/na', ['currentSplatfest']),
         schedule() {
             return this.$store.getters[`splatoon/schedules/${this.mode}/activeSchedule`];
         },
diff --git a/src/web/components/screenshots/schedules/Schedules.vue b/src/web/components/screenshots/schedules/Schedules.vue
index cf9c382..f8f2b67 100644
--- a/src/web/components/screenshots/schedules/Schedules.vue
+++ b/src/web/components/screenshots/schedules/Schedules.vue
@@ -1,6 +1,6 @@
 <template>
     <Wrapper title="Map Schedules">
-        <div class="columns font-splatoon2">
+        <div class="columns font-splatoon2" v-if="!globalSplatfestIsActiveInAllRegions">
             <div class="column">
                 <ScheduleBox class="main-schedule-box tilt-left" mode="regular" />
             </div>
@@ -13,14 +13,54 @@
                 <ScheduleBox class="main-schedule-box tilt-left" mode="league" />
             </div>
         </div>
+        <div class="columns is-gapless font-splatoon2" v-else>
+            <div class="column" style="display: flex">
+                <div class="splatfest tilt-left">
+                    <div class="hook-box">
+                        <SplatfestBox :festival="currentSplatfestNA" global-splatfest-mode />
+                    </div>
+                </div>
+            </div>
+            <div class="column is-5">
+                <ScheduleBox class="main-schedule-box tilt-right" mode="regular" splatfest-battle style="max-width: 335px; margin-right: 20px" />
+            </div>
+        </div>
     </Wrapper>
 </template>
 
 <script>
+import { mapGetters } from 'vuex';
 import Wrapper from '@/web/components/screenshots/Wrapper.vue';
 import ScheduleBox from './ScheduleBox.vue';
+import SplatfestBox from '@/web/components/splatoon/SplatfestBox.vue';
 
 export default {
-    components: { Wrapper, ScheduleBox },
+    components: { Wrapper, ScheduleBox, SplatfestBox },
+    computed: {
+        ...mapGetters('splatoon/splatfests', {
+            'currentSplatfestNA': 'na/currentSplatfest',
+            'currentSplatfestEU': 'eu/currentSplatfest',
+            'currentSplatfestJP': 'jp/currentSplatfest',
+        }),
+        globalSplatfestIsActiveInAllRegions() {
+            // Do we have a Splatfest in each region?
+            if (!this.currentSplatfestNA || !this.currentSplatfestEU || !this.currentSplatfestJP)
+                return false;
+
+            // Is it the same Splatfest in each region?
+            if (this.currentSplatfestNA.festival_id !== this.currentSplatfestEU.festival_id
+                || this.currentSplatfestNA.festival_id !== this.currentSplatfestJP.festival_id)
+                return false;
+
+            // Is the Splatfest currently active in every region?
+            if (this.currentSplatfestNA.state !== 'active'
+                || this.currentSplatfestEU.state !== 'active'
+                || this.currentSplatfestJP.state !== 'active')
+                return false;
+
+            // All checks passed, we have a global Splatfest active in all regions!
+            return true;
+        },
+    },
 };
 </script>
diff --git a/src/web/components/splatoon/SplatfestBox.vue b/src/web/components/splatoon/SplatfestBox.vue
index 78f3ec2..a1acfeb 100644
--- a/src/web/components/splatoon/SplatfestBox.vue
+++ b/src/web/components/splatoon/SplatfestBox.vue
@@ -38,7 +38,7 @@
             <SplatfestResultsBox :festival="festival" />
         </div>
 
-        <div class="has-text-centered is-size-5 title-color festival-period-container">
+        <div class="has-text-centered is-size-5 title-color festival-period-container" v-if="!globalSplatfestMode">
             <div v-if="!showingResultsBar" class="festival-period" :style="{ 'background-color': festival.colors.middle.css_rgb }">
                 <template v-if="!screenshotMode">
                     <span class="nowrap">
@@ -72,7 +72,7 @@
             <SplatfestWinnerBar :festival="festival" v-else />
         </div>
 
-        <div class="splatfest-content has-text-centered" v-if="!screenshotMode">
+        <div class="splatfest-content has-text-centered" v-if="!screenshotMode && !globalSplatfestMode">
             <template v-if="festival.state == 'upcoming'">
                 {{ festival.times.start - now | duration | time.in }}
             </template>
@@ -85,6 +85,9 @@
                 {{ festival.times.result - now | duration | resultsIn }}
             </template>
         </div>
+
+        <!-- Spacer at the bottom -->
+        <div v-if="globalSplatfestMode">&nbsp;</div>
     </div>
 </template>
 
@@ -100,6 +103,7 @@ export default {
         festival: null,
         screenshotMode: Boolean,
         historyMode: Boolean,
+        globalSplatfestMode: Boolean,
     },
     filters: {
         resultsIn(time) {
@@ -120,6 +124,8 @@ export default {
             return { weekday: 'short' };
         },
         title() {
+            if (this.globalSplatfestMode)
+                return this.$t('splatfest.global');
             if (this.festival.state == 'upcoming')
                 return this.$t('splatfest.upcoming');
             if (this.festival.state == 'past' && !this.screenshotMode)
diff --git a/src/web/locale/en.json b/src/web/locale/en.json
index cd17d50..c870546 100644
--- a/src/web/locale/en.json
+++ b/src/web/locale/en.json
@@ -25,6 +25,7 @@
         "recent": "Recent Splatfest",
         "title": "Splatfest",
         "upcoming": "Upcoming Splatfest",
+        "global": "Global Splatfest",
         "results_in": "results in {time}",
         "results": {
             "title": "Results!",