feat(event): April Fooly 2022

website/client/src/assets/scss/animals.scss

@@ -19,6 +19,11 @@
   top: -16px !important;
 }
 
-.Pet.Pet-FlyingPig-Veggie, .Pet.Pet-FlyingPig-Dessert {
+.Pet.Pet-FlyingPig-Veggie, .Pet.Pet-FlyingPig-Dessert, .Pet.Pet-FlyingPig-Virtual {
   top: -28px !important;
 }
+
+.Pet[class*="Virtual"] {
+  left: 1.25rem;
+  bottom: 0.5rem;
+}

website/client/src/components/avatar.vue

@@ -79,7 +79,6 @@
         ></span>
         <!-- Pet-->
         <span
-          v-if="member.items.currentPet"
           class="current-pet"
           :class="petClass"
         ></span>
@@ -131,10 +130,12 @@
 import some from 'lodash/some';
 import moment from 'moment';
 import { mapState } from '@/libs/store';
+import foolPet from '../mixins/foolPet';
 
 import ClassBadge from '@/components/members/classBadge';
 
 export default {
+  mixins: [foolPet],
   components: {
     ClassBadge,
   },
@@ -243,11 +244,12 @@ export default {
     petClass () {
       if (some(
         this.currentEventList,
-        event => moment().isBetween(event.start, event.end) && event.aprilFools && event.aprilFools === 'invert',
+        event => moment().isBetween(event.start, event.end) && event.aprilFools && event.aprilFools === 'virtual',
       )) {
-        return `Pet-${this.member.items.currentPet} invert`;
+        return this.foolPet(this.member.items.currentPet);
       }
-      return `Pet-${this.member.items.currentPet}`;
+      if (this.member.items.currentPet) return `Pet-${this.member.items.currentPet}`;
+      return '';
     },
   },
   methods: {

website/client/src/components/inventory/stable/petItem.vue

@@ -114,11 +114,13 @@ import some from 'lodash/some';
 import moment from 'moment';
 import { v4 as uuid } from 'uuid';
 import { mapState } from '@/libs/store';
+import foolPet from '@/mixins/foolPet';
 import {
   isAllowedToFeed, isHatchable, isOwned, isSpecial,
 } from '../../../libs/createAnimal';
 
 export default {
+  mixins: [foolPet],
   props: {
     item: {
       type: Object,
@@ -169,9 +171,10 @@ export default {
     getPetItemClass () {
       if (this.isOwned() && some(
         this.currentEventList,
-        event => moment().isBetween(event.start, event.end) && event.aprilFools && event.aprilFools === 'invert',
+        event => moment().isBetween(event.start, event.end) && event.aprilFools && event.aprilFools === 'virtual',
       )) {
-        return `Pet Pet-${this.item.key} ${this.item.eggKey} invert`;
+        const petString = `${this.item.eggKey}-${this.item.key}`;
+        return `Pet ${this.foolPet(petString)}`;
       }
 
       if (this.isOwned() || (this.mountOwned() && this.isHatchable())) {

website/client/src/mixins/foolPet.js

@@ -0,0 +1,53 @@
+import includes from 'lodash/includes';
+
+export default {
+  methods: {
+    foolPet (pet) {
+      const SPECIAL_PETS = [
+        'Wolf-Veteran',
+        'Wolf-Cerberus',
+        'Dragon-Hydra',
+        'Turkey-Base',
+        'BearCub-Polar',
+        'MantisShrimp-Base',
+        'JackOLantern-Base',
+        'Mammoth-Base',
+        'Tiger-Veteran',
+        'Phoenix-Base',
+        'Turkey-Gilded',
+        'MagicalBee-Base',
+        'Lion-Veteran',
+        'Gryphon-RoyalPurple',
+        'JackOLantern-Ghost',
+        'Jackalope-RoyalPurple',
+        'Orca-Base',
+        'Bear-Veteran',
+        'Hippogriff-Hopeful',
+        'Fox-Veteran',
+        'JackOLantern-Glow',
+        'Gryphon-Gryphatrice',
+        'JackOLantern-RoyalPurple',
+      ];
+      const BASE_PETS = [
+        'Wolf',
+        'TigerCub',
+        'PandaCub',
+        'LionCub',
+        'Fox',
+        'FlyingPig',
+        'BearCub',
+        'Dragon',
+        'Cactus',
+      ];
+      if (!pet) return 'Pet-Cactus-Virtual';
+      if (SPECIAL_PETS.indexOf(pet) !== -1) {
+        return 'Pet-Wolf-Virtual';
+      }
+      const species = pet.slice(0, pet.indexOf('-'));
+      if (includes(BASE_PETS, species)) {
+        return `Pet-${species}-Virtual`;
+      }
+      return 'Pet-Fox-Virtual';
+    },
+  },
+};

website/common/script/content/constants/events.js

@@ -20,6 +20,7 @@ export const EVENTS = {
     end: '2022-04-30T20:00-05:00',
     npcImageSuffix: '_spring',
     season: 'spring',
+    aprilFools: 'virtual',
     gear: true,
   },
   valentines2022: {