mirror of https://github.com/VueTubeApp/VueTube
lots of general improvements
This commit is contained in:
parent
57d645692c
commit
e13b8d6de7
|
@ -1,22 +1,23 @@
|
||||||
<template>
|
<template>
|
||||||
<v-app dark>
|
<v-app>
|
||||||
|
|
||||||
<v-card class="topNav rounded-0" style="display: flex;">
|
<v-card class="topNav rounded-0" style="display: flex;" color="accent">
|
||||||
<img src="/icon.svg" height="30px" />
|
<h2>Home</h2>
|
||||||
<v-spacer />
|
<v-spacer />
|
||||||
<v-text-field outlined dense label="Search" prepend-inner-icon="mdi-magnify" class="topNavSearch" />
|
<v-btn text><v-icon>mdi-magnify</v-icon></v-btn>
|
||||||
|
<v-btn text><v-icon>mdi-dots-vertical</v-icon></v-btn>
|
||||||
</v-card>
|
</v-card>
|
||||||
|
|
||||||
|
|
||||||
<v-app-content>
|
<div>
|
||||||
<nuxt />
|
<nuxt />
|
||||||
</v-app-content>
|
</div>
|
||||||
|
|
||||||
<v-bottom-navigation v-model="tabSelection" class="bottomNav rounded-0">
|
<v-bottom-navigation v-model="tabSelection" class="bottomNav rounded-0">
|
||||||
<v-btn v-for="(item, i) in tabs" :key="i" class="navButton">
|
<v-btn v-for="(item, i) in tabs" :key="i" class="navButton" :to="item.link">
|
||||||
|
|
||||||
<span v-text="item.name" />
|
<span v-text="item.name" />
|
||||||
<v-icon v-text="item.icon" :color="tabSelection == i ? 'primary' : 'white'" />
|
<v-icon v-text="item.icon" :color="tabSelection == i ? 'primary' : 'grey'" />
|
||||||
|
|
||||||
</v-btn>
|
</v-btn>
|
||||||
</v-bottom-navigation>
|
</v-bottom-navigation>
|
||||||
|
@ -25,6 +26,12 @@
|
||||||
</v-app>
|
</v-app>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
* {
|
||||||
|
font-family: Arial, Helvetica, sans-serif !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.topNav {
|
.topNav {
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
|
@ -52,8 +59,8 @@
|
||||||
tabSelection: 0,
|
tabSelection: 0,
|
||||||
tabs: [
|
tabs: [
|
||||||
{ name: "Home", icon: "mdi-home", link: "/" },
|
{ name: "Home", icon: "mdi-home", link: "/" },
|
||||||
{ name: "Shorts", icon: "mdi-lightning-bolt", link: "/shorts" },
|
//{ name: "Shorts", icon: "mdi-lightning-bolt", link: "/shorts" },
|
||||||
{ name: "Upload", icon: "mdi-plus", link: "/upload" },
|
//{ name: "Upload", icon: "mdi-plus", link: "/upload" },
|
||||||
{ name: "Subscriptions", icon: "mdi-youtube-subscription", link: "/subs" },
|
{ name: "Subscriptions", icon: "mdi-youtube-subscription", link: "/subs" },
|
||||||
{ name: "Library", icon: "mdi-view-list", link: "/library" },
|
{ name: "Library", icon: "mdi-view-list", link: "/library" },
|
||||||
]
|
]
|
||||||
|
|
|
@ -1,11 +1,21 @@
|
||||||
import colors from 'vuetify/es5/util/colors'
|
import colors from 'vuetify/es5/util/colors'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|
||||||
//--- Bettertube Stuff ---//
|
//--- Bettertube Stuff ---//
|
||||||
target: 'static',
|
target: 'static',
|
||||||
buildDir: '../dist',
|
buildDir: '../dist',
|
||||||
|
plugins: [
|
||||||
|
{ src: "~/plugins/youtubei", mode: "client" }
|
||||||
|
],
|
||||||
|
|
||||||
|
//--- Bettertube Debugging ---//
|
||||||
|
server: {
|
||||||
|
port: 80, // default: 3000
|
||||||
|
host: '0.0.0.0', // default: localhost,
|
||||||
|
timing: false
|
||||||
|
},
|
||||||
|
|
||||||
//--- Default NUXT Stuff ---//
|
//--- Default NUXT Stuff ---//
|
||||||
head: {
|
head: {
|
||||||
title: 'BetterTube',
|
title: 'BetterTube',
|
||||||
|
@ -21,7 +31,6 @@ export default {
|
||||||
|
|
||||||
|
|
||||||
css: [],
|
css: [],
|
||||||
plugins: [],
|
|
||||||
components: true,
|
components: true,
|
||||||
|
|
||||||
buildModules: [
|
buildModules: [
|
||||||
|
@ -32,8 +41,12 @@ export default {
|
||||||
vuetify: {
|
vuetify: {
|
||||||
customVariables: ['~/assets/variables.scss'],
|
customVariables: ['~/assets/variables.scss'],
|
||||||
theme: {
|
theme: {
|
||||||
dark: true,
|
dark: false,
|
||||||
themes: {
|
themes: {
|
||||||
|
light: {
|
||||||
|
primary: colors.red.lighten1,
|
||||||
|
accent: "#E62117"
|
||||||
|
},
|
||||||
dark: {
|
dark: {
|
||||||
primary: colors.red.darken2, //colors.blue.darken2
|
primary: colors.red.darken2, //colors.blue.darken2
|
||||||
accent: colors.grey.darken3,
|
accent: colors.grey.darken3,
|
||||||
|
|
|
@ -1,10 +1,11 @@
|
||||||
{
|
{
|
||||||
"name": "BetterTube",
|
"name": "bettertube",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"lockfileVersion": 2,
|
"lockfileVersion": 2,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
|
"name": "bettertube",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"core-js": "^3.19.3",
|
"core-js": "^3.19.3",
|
||||||
|
@ -13,7 +14,8 @@
|
||||||
"vue-server-renderer": "^2.6.14",
|
"vue-server-renderer": "^2.6.14",
|
||||||
"vue-template-compiler": "^2.6.14",
|
"vue-template-compiler": "^2.6.14",
|
||||||
"vuetify": "^2.6.1",
|
"vuetify": "^2.6.1",
|
||||||
"webpack": "^4.46.0"
|
"webpack": "^4.46.0",
|
||||||
|
"youtubei": "^0.0.1-rc.28"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@nuxtjs/vuetify": "^1.12.3"
|
"@nuxtjs/vuetify": "^1.12.3"
|
||||||
|
@ -13663,6 +13665,11 @@
|
||||||
"funding": {
|
"funding": {
|
||||||
"url": "https://github.com/sponsors/sindresorhus"
|
"url": "https://github.com/sponsors/sindresorhus"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
"node_modules/youtubei": {
|
||||||
|
"version": "0.0.1-rc.28",
|
||||||
|
"resolved": "https://registry.npmjs.org/youtubei/-/youtubei-0.0.1-rc.28.tgz",
|
||||||
|
"integrity": "sha512-oWR1hK0C/TN7i34MrMAT/MGfTjP52LYuP13VD2rhxTO6Ia+jRw+bI+/gn65h6qxSxg7QC8LleSiNGWwEWkw4FA=="
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
@ -24187,6 +24194,11 @@
|
||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
|
||||||
"integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="
|
"integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="
|
||||||
|
},
|
||||||
|
"youtubei": {
|
||||||
|
"version": "0.0.1-rc.28",
|
||||||
|
"resolved": "https://registry.npmjs.org/youtubei/-/youtubei-0.0.1-rc.28.tgz",
|
||||||
|
"integrity": "sha512-oWR1hK0C/TN7i34MrMAT/MGfTjP52LYuP13VD2rhxTO6Ia+jRw+bI+/gn65h6qxSxg7QC8LleSiNGWwEWkw4FA=="
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -15,9 +15,10 @@
|
||||||
"vue-server-renderer": "^2.6.14",
|
"vue-server-renderer": "^2.6.14",
|
||||||
"vue-template-compiler": "^2.6.14",
|
"vue-template-compiler": "^2.6.14",
|
||||||
"vuetify": "^2.6.1",
|
"vuetify": "^2.6.1",
|
||||||
"webpack": "^4.46.0"
|
"webpack": "^4.46.0",
|
||||||
|
"youtubei": "^0.0.1-rc.28"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@nuxtjs/vuetify": "^1.12.3"
|
"@nuxtjs/vuetify": "^1.12.3"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,6 @@
|
||||||
|
<template>
|
||||||
|
<center>
|
||||||
|
<v-icon size="100">mdi-close-circle</v-icon>
|
||||||
|
<h1 class="grey--text">Incomplete</h1>
|
||||||
|
</center>
|
||||||
|
</template>
|
|
@ -0,0 +1,21 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
{{ searchData }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
searchData: null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// video | playlist | channel | all
|
||||||
|
this.$youtube.search("test", "video", function(data) {
|
||||||
|
console.log(data)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
|
@ -0,0 +1,6 @@
|
||||||
|
<template>
|
||||||
|
<center>
|
||||||
|
<v-icon size="100">mdi-close-circle</v-icon>
|
||||||
|
<h1 class="grey--text">Incomplete</h1>
|
||||||
|
</center>
|
||||||
|
</template>
|
|
@ -0,0 +1,14 @@
|
||||||
|
const module = {
|
||||||
|
search(phrase, type, callback) {
|
||||||
|
const ytclient = require("youtubei").Client;
|
||||||
|
const youtube = new ytclient();
|
||||||
|
|
||||||
|
youtube.search(phrase, { type: "video" }).then((results) => {
|
||||||
|
callback(results);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ({ app }, inject) => {
|
||||||
|
inject('youtube', module)
|
||||||
|
}
|
Loading…
Reference in New Issue