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() {
|
mounted() {
|
||||||
|
this.$vuetube.resetBackActions();
|
||||||
//--- Back Button Listener ---//
|
//--- Back Button Listener ---//
|
||||||
this.backHandler = CapacitorApp.addListener(
|
this.backHandler = CapacitorApp.addListener(
|
||||||
"backButton",
|
"backButton",
|
||||||
({ canGoBack }) => {
|
this.$vuetube.back
|
||||||
//--- Back Closes Search ---//
|
);
|
||||||
if (this.search) {
|
|
||||||
this.search = false;
|
|
||||||
|
|
||||||
//--- Back Goes Back ---//
|
this.$vuetube.addBackAction(
|
||||||
} else if (!canGoBack) {
|
() => {
|
||||||
CapacitorApp.exitApp();
|
this.search = false;
|
||||||
} else {
|
},
|
||||||
window.history.back();
|
() => {
|
||||||
}
|
return this.search;
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
|
@ -209,7 +209,7 @@ import VidLoadRenderer from "~/components/vidLoadRenderer.vue";
|
||||||
import { getCpn } from "~/plugins/utils";
|
import { getCpn } from "~/plugins/utils";
|
||||||
import SlimVideoDescriptionRenderer from "~/components/UtilRenderers/slimVideoDescriptionRenderer.vue";
|
import SlimVideoDescriptionRenderer from "~/components/UtilRenderers/slimVideoDescriptionRenderer.vue";
|
||||||
import ItemSectionRenderer from "~/components/SectionRenderers/itemSectionRenderer.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 vuetubePlayer from "~/components/Player/index.vue";
|
||||||
import ShelfRenderer from "~/components/SectionRenderers/shelfRenderer.vue";
|
import ShelfRenderer from "~/components/SectionRenderers/shelfRenderer.vue";
|
||||||
import mainCommentRenderer from "~/components/Comments/mainCommentRenderer.vue";
|
import mainCommentRenderer from "~/components/Comments/mainCommentRenderer.vue";
|
||||||
|
@ -260,22 +260,10 @@ export default {
|
||||||
mounted() {
|
mounted() {
|
||||||
this.mountedInit();
|
this.mountedInit();
|
||||||
|
|
||||||
|
this.$vuetube.resetBackActions();
|
||||||
this.backHandler = CapacitorApp.addListener(
|
this.backHandler = CapacitorApp.addListener(
|
||||||
"backButton",
|
"backButton",
|
||||||
({ canGoBack }) => {
|
this.$vuetube.back
|
||||||
//--- 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();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
@ -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 { hexToRgb, rgbToHex, parseEmoji } from "./utils";
|
||||||
import { Haptics, ImpactStyle } from "@capacitor/haptics";
|
import { Haptics, ImpactStyle } from "@capacitor/haptics";
|
||||||
import Vue from "vue";
|
import Vue from "vue";
|
||||||
|
import backHandler from "./classes/backHander";
|
||||||
|
|
||||||
Vue.directive("emoji", {
|
Vue.directive("emoji", {
|
||||||
inserted: function (el) {
|
inserted: function (el) {
|
||||||
|
@ -14,6 +15,8 @@ Vue.directive("emoji", {
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
let backActions = new backHandler();
|
||||||
|
|
||||||
const module = {
|
const module = {
|
||||||
//--- Get GitHub Commits ---//
|
//--- Get GitHub Commits ---//
|
||||||
commits: new Promise((resolve, reject) => {
|
commits: new Promise((resolve, reject) => {
|
||||||
|
@ -109,6 +112,25 @@ const module = {
|
||||||
rgbToHex(r, g, b) {
|
rgbToHex(r, g, b) {
|
||||||
return 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 ---//
|
//--- Start ---//
|
||||||
|
|
Loading…
Reference in New Issue