mirror of https://github.com/VueTubeApp/VueTube
android back button support
This commit is contained in:
parent
e5b4f12cee
commit
151c5cdd6b
|
@ -1,55 +0,0 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
|
||||
<v-text-field
|
||||
label="Search"
|
||||
v-model="text"
|
||||
@input="textChanged"
|
||||
class="searchBar"
|
||||
/>
|
||||
|
||||
<div style="min-width: 180px;">
|
||||
<v-list-item v-for="(item, index) in response" :key="index">
|
||||
<v-btn text dense class="info--text searchButton text-left" @click="search(item)" v-text="item[0]" />
|
||||
</v-list-item>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.searchBar {
|
||||
margin: 0 1em 1em 1em;
|
||||
}
|
||||
.searchButton {
|
||||
width: 100%;
|
||||
justify-content: left !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
text: null,
|
||||
response: [],
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
textChanged() {
|
||||
this.$youtube.autoComplete(this.text, (res) => {
|
||||
const data = res.replace(/^.*?\(/,'').replace(/\)$/,''); //Format Response
|
||||
this.response = JSON.parse(data)[1]
|
||||
});
|
||||
},
|
||||
|
||||
search(item) {
|
||||
location.href="/search?q="+item[0];
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
|
@ -2,6 +2,16 @@
|
|||
<v-app>
|
||||
<v-card class="topNav rounded-0" style="display: flex; box-shadow: none !important;" color="accent white--text">
|
||||
<h2 v-text="page" v-show="!search" />
|
||||
|
||||
<v-text-field
|
||||
label="Search"
|
||||
v-model="text"
|
||||
@input="textChanged"
|
||||
class="searchBar"
|
||||
color="white"
|
||||
v-if="search"
|
||||
/>
|
||||
|
||||
<v-spacer />
|
||||
|
||||
<v-btn text class="toolbarAction mr-2 fill-height" color="white" @click="search = !search"><v-icon>mdi-magnify</v-icon></v-btn>
|
||||
|
@ -20,8 +30,16 @@
|
|||
|
||||
<div class="accent" style="height: 100%">
|
||||
<div class="background">
|
||||
<searchOverlay v-if="search" />
|
||||
<nuxt v-show="!search" />
|
||||
|
||||
|
||||
<div style="min-width: 180px;" v-if="search">
|
||||
<v-list-item v-for="(item, index) in response" :key="index">
|
||||
<v-btn text dense class="info--text searchButton text-left" @click="youtubeSearch(item)" v-text="item[0]" />
|
||||
</v-list-item>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -61,10 +79,18 @@ html, body {
|
|||
height: 100%;
|
||||
padding: 4em 0 4em 0; /* Account for Top/Bottom Novigation */
|
||||
}
|
||||
.searchBar {
|
||||
margin: 0;
|
||||
}
|
||||
.searchButton {
|
||||
width: 100%;
|
||||
justify-content: left !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
import { App as CapacitorApp } from '@capacitor/app';
|
||||
export default {
|
||||
data: () => ({
|
||||
search: false,
|
||||
|
||||
|
@ -73,10 +99,19 @@ html, body {
|
|||
{ title: "Updates", link: "/updates" },
|
||||
{ title: "About", link: "/about" },
|
||||
{ title: "Logs", link: "/logs" }
|
||||
]
|
||||
],
|
||||
|
||||
text: null,
|
||||
response: [],
|
||||
}),
|
||||
mounted() {
|
||||
|
||||
CapacitorApp.addListener('backButton', ({canGoBack}) => {
|
||||
if(!canGoBack){
|
||||
CapacitorApp.exitApp();
|
||||
} else {
|
||||
window.history.back();
|
||||
}
|
||||
});
|
||||
},
|
||||
computed: {
|
||||
page: function () {
|
||||
|
@ -84,6 +119,19 @@ html, body {
|
|||
pageName = pageName.charAt(0).toUpperCase() + pageName.slice(1);
|
||||
return pageName || "Home";
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
textChanged() {
|
||||
this.$youtube.autoComplete(this.text, (res) => {
|
||||
const data = res.replace(/^.*?\(/,'').replace(/\)$/,''); //Format Response
|
||||
this.response = JSON.parse(data)[1]
|
||||
});
|
||||
},
|
||||
|
||||
youtubeSearch(item) {
|
||||
location.href="/search?q="+item[0];
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -2,6 +2,7 @@
|
|||
"dependencies": {
|
||||
"@capacitor-community/http": "^1.4.1",
|
||||
"@capacitor/android": "^3.4.0",
|
||||
"@capacitor/app": "^1.1.1",
|
||||
"@capacitor/browser": "^1.0.7",
|
||||
"@capacitor/cli": "^3.4.0",
|
||||
"@capacitor/core": "^3.4.0"
|
||||
|
|
Loading…
Reference in New Issue