etc/VueTube
0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-22 11:15:14 +00:00
Code Issues Projects Releases Wiki Activity

global search loading state, fixes #463

Browse source
This commit is contained in:
Nikita Krupin 2022-07-20 15:18:29 -04:00
parent e1a1cfe6e9
commit 9eef8d8762
4 changed files with 25 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
NUXT/components/topNavigation.vue
View file

@ -52,6 +52,7 @@
v-if="$route.name !== 'settings' && !$route.path.includes('/mods')" v-if="$route.name !== 'settings' && !$route.path.includes('/mods')"
icon icon
tile tile
:loading="$store.state.search.loading"
class="ml-3 my-auto fill-height" class="ml-3 my-auto fill-height"
style="border-radius: 0.25rem !important" style="border-radius: 0.25rem !important"
@click="$emit('search-btn', text)" @click="$emit('search-btn', text)"

1
NUXT/layouts/default.vue
View file

@ -199,6 +199,7 @@ export default {
if (this.search === true) { if (this.search === true) {
if (query) { if (query) {
this.$store.commit("search/setLoading", true);
this.$router.push(`/search?q=${query}`); this.$router.push(`/search?q=${query}`);
this.search = false; this.search = false;
} }

29
NUXT/pages/search.vue
View file

@ -6,20 +6,6 @@
</div> </div>
</template> </template>
<style scoped>
.entry {
width: 100%; /* Prevent Loading Weirdness */
}
.videoRuntimeFloat {
position: absolute;
bottom: 10px;
right: 10px;
background: rgba(0, 0, 0, 0.5);
border-radius: 5px;
padding: 0px 4px 0px 4px;
}
</style>
<script> <script>
import sectionListRenderer from "~/components/ListRenderers/sectionListRenderer.vue"; import sectionListRenderer from "~/components/ListRenderers/sectionListRenderer.vue";
import VidLoadRenderer from "~/components/vidLoadRenderer.vue"; import VidLoadRenderer from "~/components/vidLoadRenderer.vue";
@ -52,9 +38,24 @@ export default {
getSearch() { getSearch() {
const searchQuestion = this.$route.query.q; const searchQuestion = this.$route.query.q;
this.$youtube.search(searchQuestion).then((response) => { this.$youtube.search(searchQuestion).then((response) => {
this.$store.commit("search/setLoading", false);
this.renderer = response; this.renderer = response;
}); });
}, },
}, },
}; };
</script> </script>
<style scoped>
.entry {
width: 100%; /* Prevent Loading Weirdness */
}
.videoRuntimeFloat {
position: absolute;
bottom: 10px;
right: 10px;
background: rgba(0, 0, 0, 0.5);
border-radius: 5px;
padding: 0px 4px 0px 4px;
}
</style>

8
NUXT/store/search/index.js Normal file
View file

@ -0,0 +1,8 @@
export const state = () => ({
loading: false,
});
export const mutations = {
setLoading(state, payload) {
state.loading = payload;
},
};