krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-18 07:07:35 +01:00
Code Issues Packages Projects Releases Wiki Activity

remove modals stack (#12423)

Browse Source
This commit is contained in:
Matteo Pagliazzi
2020-08-10 18:38:24 +02:00
committed by GitHub
parent 8c3a9c6dbc
commit d7ee1ec4f4
9 changed files with 26 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
website/client/src/app.vue
View File

@@ -513,13 +513,9 @@ export default {
} else {
this.hideLoadingScreen();
}
this.initializeModalStack();
},
beforeDestroy () {
this.$root.$off('playSound');
this.$root.$off('bv::modal::hidden');
this.$root.$off('bv::show::modal');
this.$root.$off('buyModal::showItem');
this.$root.$off('selectMembersModal::showItem');
},
@@ -549,112 +545,6 @@ export default {
this.$store.dispatch('auth:logout', { redirectToLogin: true });
return true;
},
initializeModalStack () {
// Manage modals
this.$root.$on('bv::show::modal', (modalId, data = {}) => {
if (data.fromRoot) return;
const { modalStack } = this.$store.state;
this.trackGemPurchase(modalId, data);
// Add new modal to the stack
const prev = modalStack[modalStack.length - 1];
const prevId = prev ? prev.modalId : undefined;
modalStack.push({ modalId, prev: prevId });
});
this.$root.$on('bv::modal::hidden', bvEvent => {
let modalId = bvEvent.target && bvEvent.target.id;
// sometimes the target isn't passed to the hidden event, fallback is the vueTarget
if (!modalId) {
modalId = bvEvent.vueTarget && bvEvent.vueTarget.id;
}
if (!modalId) {
return;
}
const { modalStack } = this.$store.state;
const modalOnTop = modalStack[modalStack.length - 1];
// Check for invalid modal. Event systems can send multiples
if (!this.validStack(modalStack)) return;
// If we are moving forward
if (modalOnTop && modalOnTop.prev === modalId) return;
// Remove modal from stack
this.$store.state.modalStack.pop();
// Get previous modal
const modalBefore = modalOnTop ? modalOnTop.prev : undefined;
if (modalBefore) this.$root.$emit('bv::show::modal', modalBefore, { fromRoot: true });
});
// Dismiss modal aggressively. Pass a modal ID to remove a modal instance from the stack
// (both the stack entry itself and its "prev" reference) so we don't reopen it
this.$root.$on('habitica::dismiss-modal', oldModal => {
if (!oldModal) return;
this.$root.$emit('bv::hide::modal', oldModal);
let removeIndex = this.$store.state.modalStack
.map(modal => modal.modalId)
.indexOf(oldModal);
if (removeIndex >= 0) {
this.$store.state.modalStack.splice(removeIndex, 1);
}
removeIndex = this.$store.state.modalStack
.map(modal => modal.prev)
.indexOf(oldModal);
if (removeIndex >= 0) {
delete this.$store.state.modalStack[removeIndex].prev;
}
});
},
validStack (modalStack) {
const modalsThatCanShowTwice = ['profile'];
const modalCount = {};
const prevAndCurrent = 2;
for (const current of modalStack) {
if (!modalCount[current.modalId]) modalCount[current.modalId] = 0;
modalCount[current.modalId] += 1;
if (
modalCount[current.modalId] > prevAndCurrent
&& modalsThatCanShowTwice.indexOf(current.modalId) === -1
) {
this.$store.state.modalStack = [];
return false;
}
if (!current.prev) continue; // eslint-disable-line
if (!modalCount[current.prev]) modalCount[current.prev] = 0;
modalCount[current.prev] += 1;
if (
modalCount[current.prev] > prevAndCurrent
&& modalsThatCanShowTwice.indexOf(current.prev) === -1
) {
this.$store.state.modalStack = [];
return false;
}
}
return true;
},
trackGemPurchase (modalId, data) {
// Track opening of gems modal unless it's been already tracked
// For example the gems button in the menu already tracks the event by itself
if (modalId === 'buy-gems' && data.alreadyTracked !== true) {
Analytics.track({
hitType: 'event',
eventCategory: 'button',
eventAction: 'click',
eventLabel: 'Gems > Wallet',
});
}
},
itemSelected (item) {
this.selectedItemToBuy = item;
},