diff --git a/test/api/v3/integration/user/POST-user_purchase_hourglass.test.js b/test/api/v3/integration/user/POST-user_purchase_hourglass.test.js index 7d68478668..721eb69aa9 100644 --- a/test/api/v3/integration/user/POST-user_purchase_hourglass.test.js +++ b/test/api/v3/integration/user/POST-user_purchase_hourglass.test.js @@ -14,7 +14,7 @@ describe('POST /user/purchase-hourglass/:type/:key', () => { // More tests in common code unit tests - it('buys a hourglass pet', async () => { + it('buys an hourglass pet', async () => { let response = await user.post('/user/purchase-hourglass/pets/MantisShrimp-Base'); await user.sync(); @@ -22,4 +22,22 @@ describe('POST /user/purchase-hourglass/:type/:key', () => { expect(user.purchased.plan.consecutive.trinkets).to.eql(1); expect(user.items.pets['MantisShrimp-Base']).to.eql(5); }); + + it('buys an hourglass quest', async () => { + let response = await user.post('/user/purchase-hourglass/quests/robot'); + await user.sync(); + + expect(response.message).to.eql(t('hourglassPurchase')); + expect(user.purchased.plan.consecutive.trinkets).to.eql(1); + expect(user.items.quests.robot).to.eql(1); + }); + + it('buys multiple hourglass quests', async () => { + let response = await user.post('/user/purchase-hourglass/quests/robot', {quantity: 2}); + await user.sync(); + + expect(response.message).to.eql(t('hourglassPurchase')); + expect(user.purchased.plan.consecutive.trinkets).to.eql(0); + expect(user.items.quests.robot).to.eql(2); + }); }); diff --git a/website/client/components/shops/buyModal.vue b/website/client/components/shops/buyModal.vue index de3038cc18..99de909e01 100644 --- a/website/client/components/shops/buyModal.vue +++ b/website/client/components/shops/buyModal.vue @@ -306,7 +306,7 @@ const hideAmountSelectionForPurchaseTypes = [ 'gear', 'backgrounds', 'mystery_set', 'card', 'rebirth_orb', 'fortify', 'armoire', 'keys', - 'debuffPotion', + 'debuffPotion', 'pets', 'mounts', ]; export default { diff --git a/website/client/components/shops/quests/buyQuestModal.vue b/website/client/components/shops/quests/buyQuestModal.vue index bb7000a436..82f60b833a 100644 --- a/website/client/components/shops/quests/buyQuestModal.vue +++ b/website/client/components/shops/quests/buyQuestModal.vue @@ -23,7 +23,7 @@ strong {{ $t('howManyToBuy') }} .box input(type='number', min='0', step='1', v-model.number='selectedAmountToBuy') - span.svg-icon.inline.icon-32(aria-hidden="true", v-html="(priceType === 'gems') ? icons.gem : icons.gold") + span.svg-icon.inline.icon-32(aria-hidden="true", v-html="currencyIcon") span.value(:class="priceType") {{ item.value }} button.btn.btn-primary( @@ -44,6 +44,7 @@ div.clearfix(slot="modal-footer") span.balance.float-left {{ $t('yourBalance') }} balanceInfo( + :withHourglass="priceType === 'hourglasses'", :currencyNeeded="priceType", :amountNeeded="item.value" ).float-right @@ -202,6 +203,7 @@ import svgGem from 'assets/svg/gem.svg'; import svgPin from 'assets/svg/pin.svg'; import svgExperience from 'assets/svg/experience.svg'; + import svgHourglasses from 'assets/svg/hourglass.svg'; import BalanceInfo from '../balanceInfo.vue'; import currencyMixin from '../_currencyMixin'; @@ -229,6 +231,7 @@ gem: svgGem, pin: svgPin, experience: svgExperience, + hourglass: svgHourglasses, }), isPinned: false, @@ -258,6 +261,11 @@ return this.item.notes; } }, + currencyIcon () { + if (this.priceType === 'gold') return this.icons.gold; + if (this.priceType === 'hourglasses') return this.icons.hourglass; + return this.icons.gem; + }, }, methods: { onChange ($event) { diff --git a/website/client/components/shops/timeTravelers/index.vue b/website/client/components/shops/timeTravelers/index.vue index b3a2ee7813..5521ce2770 100644 --- a/website/client/components/shops/timeTravelers/index.vue +++ b/website/client/components/shops/timeTravelers/index.vue @@ -68,9 +68,13 @@ :emptyItem="false", @click="selectItemToBuy(ctx.item)" ) - span(slot="popoverContent", slot-scope="ctx") + span(slot="popoverContent", slot-scope="ctx", v-if="category !== 'quests'") div h4.popover-content-title {{ ctx.item.text }} + span(slot="popoverContent", slot-scope="ctx", v-if="category === 'quests'") + div.questPopover + h4.popover-content-title {{ item.text }} + questInfo(:quest="item") template(slot="itemBadge", slot-scope="ctx") span.badge.badge-pill.badge-item.badge-svg( @@ -79,6 +83,18 @@ @click.prevent.stop="togglePinned(ctx.item)" ) span.svg-icon.inline.icon-12.color(v-html="icons.pin") + buyQuestModal( + :item="selectedItemToBuy || {}", + :priceType="selectedItemToBuy ? selectedItemToBuy.currency : ''", + :withPin="true", + @change="resetItemToBuy($event)", + ) + template(slot="item", slot-scope="ctx") + item.flat( + :item="ctx.item", + :itemContentClass="ctx.item.class", + :showPopover="false" + )