sep 21 fixes (#9060)

* remove `classSelected` on adding new pinned gear

* use show::modal on buyModal / selectMembersModal instead of v-if=item

* show::modal for buyQuestModal - fix bundles class

* fix buy potion

* fix open selectMembersModal (after changing to shop::modal)

website/client/app.vue

@@ -9,7 +9,7 @@
       .container-fluid
         app-header
         buyModal(
-          :item="selectedItemToBuy",
+          :item="selectedItemToBuy || {}",
           :withPin="true",
           @change="resetItemToBuy($event)",
           @buyPressed="customPurchase($event)",
@@ -17,9 +17,8 @@
 
         )
         selectMembersModal(
-          :item="selectedCardToBuy",
+          :item="selectedSpellToBuy || {}",
           :group="user.party",
-          @change="resetCardToBuy($event)",
           @memberSelected="memberSelected($event)",
         )
 
@@ -92,7 +91,7 @@ export default {
   data () {
     return {
       selectedItemToBuy: null,
-      selectedCardToBuy: null,
+      selectedSpellToBuy: null,
 
       sound: {
         oggSource: '',
@@ -128,6 +127,12 @@ export default {
 
     this.$root.$on('buyModal::showItem', (item) => {
       this.selectedItemToBuy = item;
+      this.$root.$emit('show::modal', 'buy-modal');
+    });
+
+    this.$root.$on('selectMembersModal::showItem', (item) => {
+      this.selectedSpellToBuy = item;
+      this.$root.$emit('show::modal', 'select-member-modal');
     });
 
     // @TODO split up this file, it's too big
@@ -272,11 +277,6 @@ export default {
         this.selectedItemToBuy = null;
       }
     },
-    resetCardToBuy ($event) {
-      if (!$event) {
-        this.selectedCardToBuy = null;
-      }
-    },
     itemSelected (item) {
       this.selectedItemToBuy = item;
     },
@@ -292,15 +292,20 @@ export default {
     customPurchase (item) {
       if (item.purchaseType === 'card') {
         if (this.user.party._id) {
-          this.selectedCardToBuy = item;
+          this.selectedSpellToBuy = item;
+
+          this.$root.$emit('hide::modal', 'buy-modal');
+          this.$root.$emit('show::modal', 'select-member-modal');
         } else {
           this.error(this.$t('errorNotInParty'));
         }
       }
     },
     memberSelected (member) {
-      this.$store.dispatch('user:castSpell', {key: this.selectedCardToBuy.key, targetId: member.id});
+      this.$store.dispatch('user:castSpell', {key: this.selectedSpellToBuy.key, targetId: member.id});
-      this.selectedCardToBuy = null;
+      this.selectedSpellToBuy = null;
+
+      this.$root.$emit('hide::modal', 'select-member-modal');
     },
     hideLoadingScreen () {
       const loadingScreen = document.getElementById('loading-screen');

website/client/components/inventory/items/index.vue

@@ -139,13 +139,6 @@
       div.popover
         div.popover-content {{ $t('clickOnEggToHatch', {potionName: currentDraggingPotion.text }) }}
 
-  selectMembersModal(
-    :item="selectedSpell",
-    :group="user.party",
-    @change="resetSpell($event)",
-    @memberSelected="memberSelected($event)",
-  )
-
   startQuestModal(
     :group="user.party"
   )
@@ -192,7 +185,6 @@ import ItemRows from 'client/components/ui/itemRows';
 import CountBadge from 'client/components/ui/countBadge';
 
 import cardsModal from './cards-modal';
-import SelectMembersModal from 'client/components/selectMembersModal';
 import HatchedPetDialog from '../stable/hatchedPetDialog';
 
 import startQuestModal from '../../groups/startQuestModal';
@@ -234,7 +226,6 @@ export default {
     bDropdownItem,
     HatchedPetDialog,
     CountBadge,
-    SelectMembersModal,
     startQuestModal,
     cardsModal,
   },
@@ -252,7 +243,6 @@ export default {
       currentDraggingPotion: null,
       potionClickMode: false,
       hatchedPet: null,
-      selectedSpell: null,
       cardOptions: {
         cardType: '',
         messageOptions: 0,
@@ -275,7 +265,7 @@ export default {
 
       this.groups.forEach(group => {
         const groupKey = group.key;
-        group.quantity = 0; // reset the count
+        group.quantity = 0; // resetf the count
         let itemsArray = itemsByType[groupKey] = [];
         const contentItems = this.content[groupKey];
 
@@ -435,7 +425,7 @@ export default {
           item.quantity--;
           this.$forceUpdate();
         } else {
-          this.selectedSpell = item;
+          this.$root.$emit('selectMembersModal::showItem', item);
         }
       } else if (groupKey === 'quests') {
         this.$root.$emit('show::modal', 'start-quest-modal');
@@ -452,17 +442,6 @@ export default {
         lastMouseMoveEvent = $event;
       }
     },
-
-    resetSpell ($event) {
-      if (!$event) {
-        this.selectedSpell = null;
-      }
-    },
-
-    memberSelected (member) {
-      this.$store.dispatch('user:castSpell', {key: this.selectedSpell.key, targetId: member.id});
-      this.selectedSpell = null;
-    },
   },
 };
 </script>

website/client/components/selectMembersModal.vue

@@ -2,8 +2,6 @@
 div
   b-modal#select-member-modal(
     size='lg',
-    :visible="true",
-    v-if="item != null",
     :hideFooter="true",
     @change="onChange($event)"
   )
@@ -162,7 +160,9 @@ export default {
   },
   watch: {
     item () {
+      if (this.item.key) {
         this.getMembers();
+      }
     },
   },
   methods: {

website/client/components/shops/buyModal.vue

@@ -1,7 +1,5 @@
 <template lang="pug">
   b-modal#buy-modal(
-    :visible="true",
-    v-if="item != null",
     :hide-header="true",
     @change="onChange($event)"
   )
@@ -56,7 +54,7 @@
         button.btn.btn-primary(
           @click="buyItem()",
           v-else,
-          :class="{'notEnough': !this.enoughCurrency(getPriceClass(), item.value)}"
+          :class="{'notEnough': !preventHealthPotion || !this.enoughCurrency(getPriceClass(), item.value)}"
         ) {{ $t('buyNow') }}
 
     div.limitedTime(v-if="item.event")
@@ -263,6 +261,14 @@
         return ['backgrounds', 'gear', 'mystery_set'].includes(this.item.purchaseType);
       },
 
+      preventHealthPotion () {
+        if (this.item.key === 'potion' && this.user.stats.hp >= 50) {
+          return false;
+        }
+
+        return true;
+      },
+
       showAttributesGrid () {
         return this.item.purchaseType === 'gear';
       },

website/client/components/shops/market/index.vue

@@ -358,7 +358,6 @@
   import Avatar from 'client/components/avatar';
 
   import SellModal from './sellModal.vue';
-  import BuyModal from '../buyModal.vue';
   import EquipmentAttributesGrid from './equipmentAttributesGrid.vue';
   import SelectMembersModal from 'client/components/selectMembersModal.vue';
 
@@ -412,7 +411,6 @@ export default {
       bDropdownItem,
 
       SellModal,
-      BuyModal,
       EquipmentAttributesGrid,
       Avatar,
 

website/client/components/shops/quests/buyQuestModal.vue

@@ -1,7 +1,5 @@
 <template lang="pug">
   b-modal#buy-quest-modal(
-    :visible="true",
-    v-if="item != null",
     :hide-header="true",
     @change="onChange($event)"
   )

website/client/components/shops/quests/index.vue

@@ -52,7 +52,7 @@
                 :itemContentClass="'inventory_quest_scroll_'+item.key",
                 :emptyItem="false",
                 :popoverPosition="'top'",
-                @click="selectedItemToBuy = item"
+                @click="selectItem(item)"
               )
                 template(slot="popoverContent", scope="ctx")
                   div.questPopover
@@ -102,7 +102,7 @@
               :priceType="ctx.item.currency",
               :itemContentClass="ctx.item.class",
               :emptyItem="false",
-              @click="selectedItemToBuy = ctx.item"
+              @click="selectItem(ctx.item)"
             )
               span(slot="popoverContent", scope="ctx")
                 div.questPopover
@@ -132,7 +132,7 @@
                 :price="item.value",
                 :emptyItem="false",
                 :popoverPosition="'top'",
-                @click="selectedItemToBuy = item"
+                @click="selectItem(item)"
               )
                 span(slot="popoverContent")
                   div.questPopover
@@ -159,7 +159,7 @@
             :price="item.value",
             :emptyItem="false",
             :popoverPosition="'top'",
-            @click="selectedItemToBuy = item"
+            @click="selectItem(item)"
           )
             span(slot="popoverContent")
               div.questPopover
@@ -179,7 +179,7 @@
               )
 
     buyModal(
-      :item="selectedItemToBuy",
+      :item="selectedItemToBuy || {}",
       :priceType="selectedItemToBuy ? selectedItemToBuy.currency : ''",
       :withPin="true",
       @change="resetItemToBuy($event)",
@@ -466,6 +466,11 @@ export default {
           this.$parent.showUnpinNotification(item);
         }
       },
+      selectItem (item) {
+        this.selectedItemToBuy = item;
+
+        this.$root.$emit('show::modal', 'buy-quest-modal');
+      },
     },
   };
 </script>

website/client/store/actions/shops.js

@@ -72,7 +72,6 @@ export function genericPurchase (store, params) {
   switch (params.pinType) {
     case 'mystery_set':
       return purchaseMysterySet(store, params);
-    case 'potion':
     case 'armoire': // eslint-disable-line
       let buyResult = buyArmoire(store.state.user.data);
 
@@ -88,6 +87,7 @@ export function genericPurchase (store, params) {
 
       axios.post('/api/v3/user/buy-armoire');
       return;
+    case 'potion':
     case 'marketGear':
       return buyItem(store, params);
     case 'background':

website/common/script/libs/getItemInfo.js

@@ -115,7 +115,7 @@ module.exports = function getItemInfo (user, type, item, officialPinnedItems, la
         notes: item.notes(language),
         value: item.value,
         currency: 'gems',
-        class: item.class,
+        class: `quest_bundle_${item.key}`,
         purchaseType: 'bundles',
         path: `bundles.${item.key}`,
         pinType: 'bundles',

website/common/script/ops/pinnedGearUtils.js

@@ -45,7 +45,6 @@ function addPinnedGear (user, type, path) {
 }
 
 function addPinnedGearByClass (user) {
-  if (user.flags.classSelected) {
   let newPinnedItems = selectGearToPin(user);
 
   for (let item of newPinnedItems) {
@@ -54,7 +53,6 @@ function addPinnedGearByClass (user) {
     addPinnedGear(user, itemInfo.pinType, itemInfo.path);
   }
 }
-}
 
 function removeItemByPath (user, path) {
   const foundIndex = user.pinnedItems.findIndex(pinnedItem => {
@@ -70,7 +68,6 @@ function removeItemByPath (user, path) {
 }
 
 function removePinnedGearByClass (user) {
-  if (user.flags.classSelected) {
   let currentPinnedItems = selectGearToPin(user);
 
   for (let item of currentPinnedItems) {
@@ -79,7 +76,6 @@ function removePinnedGearByClass (user) {
     removeItemByPath(user, itemInfo.path);
   }
 }
-}
 
 function removePinnedGearAddPossibleNewOnes (user, itemPath, newItemKey) {
   let currentPinnedItems = selectGearToPin(user);