mirror of https://github.com/VueTubeApp/VueTube
feat(wip): back button API
This commit is contained in:
parent
d24aa518ed
commit
366c77546a
|
@ -93,20 +93,19 @@ export default {
|
|||
},
|
||||
|
||||
mounted() {
|
||||
this.$vuetube.resetBackActions();
|
||||
//--- Back Button Listener ---//
|
||||
this.backHandler = CapacitorApp.addListener(
|
||||
"backButton",
|
||||
({ canGoBack }) => {
|
||||
//--- Back Closes Search ---//
|
||||
if (this.search) {
|
||||
this.search = false;
|
||||
this.$vuetube.back
|
||||
);
|
||||
|
||||
//--- Back Goes Back ---//
|
||||
} else if (!canGoBack) {
|
||||
CapacitorApp.exitApp();
|
||||
} else {
|
||||
window.history.back();
|
||||
}
|
||||
this.$vuetube.addBackAction(
|
||||
() => {
|
||||
this.search = false;
|
||||
},
|
||||
() => {
|
||||
return this.search;
|
||||
}
|
||||
);
|
||||
|
||||
|
|
|
@ -209,7 +209,7 @@ import VidLoadRenderer from "~/components/vidLoadRenderer.vue";
|
|||
import { getCpn } from "~/plugins/utils";
|
||||
import SlimVideoDescriptionRenderer from "~/components/UtilRenderers/slimVideoDescriptionRenderer.vue";
|
||||
import ItemSectionRenderer from "~/components/SectionRenderers/itemSectionRenderer.vue";
|
||||
import legacyPlayer from "~/components/Player/legacy.vue"
|
||||
import legacyPlayer from "~/components/Player/legacy.vue";
|
||||
import vuetubePlayer from "~/components/Player/index.vue";
|
||||
import ShelfRenderer from "~/components/SectionRenderers/shelfRenderer.vue";
|
||||
import mainCommentRenderer from "~/components/Comments/mainCommentRenderer.vue";
|
||||
|
@ -260,22 +260,10 @@ export default {
|
|||
mounted() {
|
||||
this.mountedInit();
|
||||
|
||||
this.$vuetube.resetBackActions();
|
||||
this.backHandler = CapacitorApp.addListener(
|
||||
"backButton",
|
||||
({ canGoBack }) => {
|
||||
//--- Back Closes Search ---//
|
||||
if (this.showComments) {
|
||||
this.showComments = false;
|
||||
|
||||
//--- Back Goes Back ---//
|
||||
} else if (!canGoBack) {
|
||||
this.$router.replace(
|
||||
`/${localStorage.getItem("startPage") || "home"}`
|
||||
);
|
||||
} else {
|
||||
window.history.back();
|
||||
}
|
||||
}
|
||||
this.$vuetube.back
|
||||
);
|
||||
},
|
||||
|
||||
|
|
|
@ -0,0 +1,26 @@
|
|||
import { App as CapacitorApp } from "@capacitor/app";
|
||||
export default class backHandler {
|
||||
constructor() {
|
||||
this.backStack = []
|
||||
}
|
||||
|
||||
back({ canGoBack }) {
|
||||
if (this.backStack.length > 0) {
|
||||
let lastResult = false
|
||||
while (!lastResult && this.backStack.length > 0) {
|
||||
const backAction = this.backStack.pop()
|
||||
lastResult = backAction()
|
||||
}
|
||||
if (lastResult) return
|
||||
}
|
||||
if (!canGoBack) {
|
||||
CapacitorApp.exitApp();
|
||||
} else {
|
||||
window.history.back();
|
||||
}
|
||||
}
|
||||
|
||||
addAction(callback) {
|
||||
this.backStack.push(callback)
|
||||
}
|
||||
}
|
|
@ -6,6 +6,7 @@ import constants from "./constants";
|
|||
import { hexToRgb, rgbToHex, parseEmoji } from "./utils";
|
||||
import { Haptics, ImpactStyle } from "@capacitor/haptics";
|
||||
import Vue from "vue";
|
||||
import backHandler from "./classes/backHander";
|
||||
|
||||
Vue.directive("emoji", {
|
||||
inserted: function (el) {
|
||||
|
@ -14,6 +15,8 @@ Vue.directive("emoji", {
|
|||
},
|
||||
});
|
||||
|
||||
let backActions = new backHandler();
|
||||
|
||||
const module = {
|
||||
//--- Get GitHub Commits ---//
|
||||
commits: new Promise((resolve, reject) => {
|
||||
|
@ -109,6 +112,25 @@ const module = {
|
|||
rgbToHex(r, g, b) {
|
||||
return rgbToHex(r, g, b);
|
||||
},
|
||||
|
||||
resetBackActions() {
|
||||
backActions = new backHandler();
|
||||
},
|
||||
|
||||
addBackAction(callback, condition = true) {
|
||||
backActions.addAction(() => {
|
||||
if (condition) {
|
||||
callback();
|
||||
return true
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
back(listenerFunc) {
|
||||
backActions.back(listenerFunc);
|
||||
}
|
||||
};
|
||||
|
||||
//--- Start ---//
|
||||
|
|
Loading…
Reference in New Issue