mirror of https://github.com/VueTubeApp/VueTube
Merge branch 'main' of https://github.com/Frontesque/VueTube into main
This commit is contained in:
commit
0d3ddd916f
|
@ -110,4 +110,4 @@ jobs:
|
||||||
uses: actions/upload-artifact@v2
|
uses: actions/upload-artifact@v2
|
||||||
with:
|
with:
|
||||||
name: iOS
|
name: iOS
|
||||||
path: ~/Library/Developer/Xcode/DerivedData
|
path: ~/Library/Developer/Xcode/DerivedData/App-*/Build/Products/Debug-iphoneos/App.app
|
||||||
|
|
|
@ -31,6 +31,8 @@ export default {
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.bottomNav {
|
.bottomNav {
|
||||||
|
box-shadow: none !important;
|
||||||
|
height: 4rem !important;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
|
|
|
@ -25,12 +25,13 @@ export default {
|
||||||
updateSnackbarTimeout: 5000
|
updateSnackbarTimeout: 5000
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
async mounted() {
|
async mounted() {
|
||||||
const commits = await this.$vuetube.commits;
|
const commits = await this.$vuetube.commits;
|
||||||
if (commits[0].sha != process.env.appVersion) {
|
const appVersion = process.env.appVersion;
|
||||||
|
if (appVersion !== commits[0].sha && appVersion !== 'dev-local') {
|
||||||
this.updateSnackbar = true;
|
this.updateSnackbar = true;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,6 +1,13 @@
|
||||||
<template>
|
<template>
|
||||||
<v-app>
|
<v-app style="background: black !important;">
|
||||||
<v-card class="topNav rounded-0" style="display: flex; box-shadow: none !important;" color="accent white--text">
|
<v-card
|
||||||
|
:style="{
|
||||||
|
borderRadius: roblox ? '0rem' : '1rem 1rem 0px 0px !important'
|
||||||
|
}"
|
||||||
|
style="height: 4rem !important; display: flex; box-shadow: none !important;"
|
||||||
|
color="accent white--text"
|
||||||
|
class="topNav rounded-0"
|
||||||
|
>
|
||||||
<h2 v-text="page" v-show="!search" />
|
<h2 v-text="page" v-show="!search" />
|
||||||
|
|
||||||
<v-text-field
|
<v-text-field
|
||||||
|
@ -14,33 +21,40 @@
|
||||||
|
|
||||||
<v-spacer />
|
<v-spacer />
|
||||||
|
|
||||||
<v-btn text class="toolbarAction mr-2 fill-height" color="white" @click="search = !search"><v-icon>mdi-magnify</v-icon></v-btn>
|
|
||||||
|
|
||||||
|
<v-btn text class="toolbarAction mr-2 fill-height" color="white" @click="searchBtn()"><v-icon>mdi-magnify</v-icon></v-btn>
|
||||||
<v-btn text class="toolbarAction fill-height" color="white" v-show="!search" to="/settings"><v-icon>mdi-dots-vertical</v-icon></v-btn>
|
<v-btn text class="toolbarAction fill-height" color="white" v-show="!search" to="/settings"><v-icon>mdi-dots-vertical</v-icon></v-btn>
|
||||||
|
|
||||||
</v-card>
|
</v-card>
|
||||||
|
|
||||||
|
|
||||||
<div class="accent" style="height: 100%">
|
<div style="height: calc(100% - 1rem); margin-top: 1rem; padding-top: 3rem; background: linear-gradient(var(--v-accent-base) 0%, var(--v-accent2-base) 100%); border-radius: 1rem;">
|
||||||
<div class="background">
|
<div
|
||||||
|
class="background scroll-y"
|
||||||
|
style="padding: 0; height: calc(100vh - 8rem); overflow-x: hidedn;"
|
||||||
|
:style="{
|
||||||
|
borderRadius: roblox ? '0rem' : '1rem'
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
|
||||||
<nuxt v-show="!search" />
|
<nuxt v-show="!search" />
|
||||||
|
|
||||||
|
|
||||||
<div style="min-width: 180px;" v-if="search">
|
<div style="min-width: 180px;" v-if="search">
|
||||||
<v-list-item v-for="(item, index) in response" :key="index">
|
<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-btn text dense class="info--text searchButton text-left" @click="youtubeSearch(item)" v-text="item[0]" />
|
||||||
</v-list-item>
|
</v-list-item>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<bottomNavigation v-if="!search" />
|
<bottomNavigation v-if="!search"
|
||||||
|
:style="{
|
||||||
|
borderRadius: roblox ? '0rem' : '0 0 1rem 1rem !important'
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
|
||||||
<updateChecker />
|
<updateChecker />
|
||||||
|
|
||||||
|
|
||||||
</v-app>
|
</v-app>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -48,8 +62,13 @@
|
||||||
* {
|
* {
|
||||||
font-family: Arial, Helvetica, sans-serif !important;
|
font-family: Arial, Helvetica, sans-serif !important;
|
||||||
}
|
}
|
||||||
|
.scroll-y {
|
||||||
|
overflow-y: scroll !important; /* has to be scroll, not auto */
|
||||||
|
-webkit-overflow-scrolling: touch !important;
|
||||||
|
}
|
||||||
html, body {
|
html, body {
|
||||||
overflow-x: hidden;
|
background: black;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
p, span, div {
|
p, span, div {
|
||||||
|
@ -85,7 +104,7 @@ p, span, div {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
transform: translateY(-10%);
|
transform: translateY(-10%);
|
||||||
width: 80%
|
width: 75%
|
||||||
}
|
}
|
||||||
.searchButton {
|
.searchButton {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -101,18 +120,24 @@ export default {
|
||||||
|
|
||||||
text: null,
|
text: null,
|
||||||
response: [],
|
response: [],
|
||||||
|
roblox: false,
|
||||||
}),
|
}),
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
|
//--- Load Saved Radius ---//
|
||||||
|
setInterval(() => { // im sorry I'll fix this later
|
||||||
|
this.roblox = localStorage.getItem("roblox") == "true";
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
//--- Load Saved Theme ---//
|
//--- Load Saved Theme ---//
|
||||||
setTimeout(() => { //Set timeout is required to make it load properly... dont ask me why -Front
|
setTimeout(() => { //Set timeout is required to make it load properly... dont ask me why -Front
|
||||||
const darkTheme = localStorage.getItem('darkTheme');
|
const darkTheme = localStorage.getItem('darkTheme');
|
||||||
if (darkTheme == "true") {
|
if (darkTheme == "true") {
|
||||||
this.$vuetify.theme.dark = darkTheme;
|
this.$vuetify.theme.dark = darkTheme;
|
||||||
|
this.$vuetube.statusBar.setDark();
|
||||||
|
|
||||||
const isOled = localStorage.getItem('isOled')
|
const isOled = localStorage.getItem('isOled')
|
||||||
|
|
||||||
if(isOled == "true") {
|
if(isOled == "true") {
|
||||||
this.$vuetify.theme.themes.dark.accent = '#000',
|
this.$vuetify.theme.themes.dark.accent = '#000',
|
||||||
this.$vuetify.theme.themes.dark.accent2 = '#000',
|
this.$vuetify.theme.themes.dark.accent2 = '#000',
|
||||||
|
@ -122,6 +147,8 @@ export default {
|
||||||
this.$vuetify.theme.themes.dark.accent2 = '#222',
|
this.$vuetify.theme.themes.dark.accent2 = '#222',
|
||||||
this.$vuetify.theme.themes.dark.background = '#333'
|
this.$vuetify.theme.themes.dark.background = '#333'
|
||||||
}
|
}
|
||||||
|
} else {
|
||||||
|
this.$vuetube.statusBar.setLight()
|
||||||
}
|
}
|
||||||
}, 0);
|
}, 0);
|
||||||
|
|
||||||
|
@ -141,6 +168,10 @@ export default {
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
// TODO: says localStorage is undefined, idk why 😭
|
||||||
|
// roblox () {
|
||||||
|
// return localStorage.getItem("roblox") === null ? false : localStorage.getItem("roblox")
|
||||||
|
// },
|
||||||
page: function () {
|
page: function () {
|
||||||
const splitPath = this.$route.path.split("/");
|
const splitPath = this.$route.path.split("/");
|
||||||
let pageName = splitPath[splitPath.length-1];
|
let pageName = splitPath[splitPath.length-1];
|
||||||
|
@ -160,7 +191,19 @@ export default {
|
||||||
youtubeSearch(item) {
|
youtubeSearch(item) {
|
||||||
this.$router.push(`/search?q=${item[0]}`);
|
this.$router.push(`/search?q=${item[0]}`);
|
||||||
this.search = false;
|
this.search = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
searchBtn() {
|
||||||
|
const query = this.text;
|
||||||
|
|
||||||
|
if (this.search === true) {
|
||||||
|
this.$router.push(`/search?q=${query}`);
|
||||||
|
this.search = false;
|
||||||
|
} else {
|
||||||
|
this.search = true;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -16,8 +16,7 @@ export default {
|
||||||
target: 'static',
|
target: 'static',
|
||||||
plugins: [
|
plugins: [
|
||||||
{ src: "~/plugins/youtube", mode: "client" },
|
{ src: "~/plugins/youtube", mode: "client" },
|
||||||
{ src: "~/plugins/vuetube", mode: "client" },
|
{ src: "~/plugins/vuetube", mode: "client" }
|
||||||
{ src: "~/plugins/libs", mode: "client" }
|
|
||||||
],
|
],
|
||||||
generate: {
|
generate: {
|
||||||
dir: '../dist'
|
dir: '../dist'
|
||||||
|
@ -56,6 +55,7 @@ export default {
|
||||||
customVariables: ['~/assets/variables.scss'],
|
customVariables: ['~/assets/variables.scss'],
|
||||||
theme: {
|
theme: {
|
||||||
dark: false,
|
dark: false,
|
||||||
|
options: { customProperties: true },
|
||||||
themes: {
|
themes: {
|
||||||
light: {
|
light: {
|
||||||
primary: colors.red.lighten2,
|
primary: colors.red.lighten2,
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<center>
|
<center>
|
||||||
<img style="margin-top: 5em; max-width: 80%; max-height: 15em;" src="/dev.svg" />
|
<v-img contain style="margin-top: 5em; max-width: 80%; max-height: 15em;" src="/dev.svg" />
|
||||||
<h1 class="grey--text">Page Under Construction</h1>
|
<h1 class="grey--text">Page Under Construction</h1>
|
||||||
<p class="grey--text">Please read the VueTube FAQ for more information.</p>
|
<p class="grey--text">Please read the VueTube FAQ for more information.</p>
|
||||||
</center>
|
</center>
|
||||||
|
|
|
@ -1,11 +1,17 @@
|
||||||
<template>
|
<template>
|
||||||
<center style="padding: 1em;">
|
<center style="padding: 1em;">
|
||||||
|
|
||||||
<v-img src="/icon.svg" width="100px" />
|
<div class="row pa-4">
|
||||||
<h1 class="pageTitle">VueTube</h1>
|
<div>
|
||||||
|
<v-img src="/icon.svg" width="100px"/>
|
||||||
<v-btn @click="openExternal('https://github.com/Frontesque/VueTube')"><v-icon>mdi-github</v-icon></v-btn>
|
</div>
|
||||||
<v-btn @click="openExternal('https://discord.gg/7P8KJrdd5W')"><v-icon>mdi-discord</v-icon></v-btn>
|
<v-spacer/>
|
||||||
|
<div>
|
||||||
|
<h1 class="pageTitle mb-3">VueTube</h1>
|
||||||
|
<v-btn @click="openExternal('https://github.com/Frontesque/VueTube')"><v-icon>mdi-github</v-icon></v-btn>
|
||||||
|
<v-btn @click="openExternal('https://discord.gg/7P8KJrdd5W')"><v-icon>mdi-discord</v-icon></v-btn>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h3 style="margin-top: 2em;">App Information</h3>
|
<h3 style="margin-top: 2em;">App Information</h3>
|
||||||
<div>App Version: {{ version.substring(0, 7) }}</div>
|
<div>App Version: {{ version.substring(0, 7) }}</div>
|
||||||
|
|
|
@ -1,5 +1,21 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="mainContainer pt-1">
|
<div class="py-1">
|
||||||
|
|
||||||
|
<v-card class="pb-5">
|
||||||
|
<v-card-title>Rounded Corners</v-card-title>
|
||||||
|
<v-row class="ml-3 mr-6">
|
||||||
|
<section class="row">
|
||||||
|
<v-switch
|
||||||
|
v-model="roblox"
|
||||||
|
label="Roblox"
|
||||||
|
hint="If you want UI to look like Minecraft"
|
||||||
|
persistent-hint
|
||||||
|
inset
|
||||||
|
@click="saveRadius(roblox)"
|
||||||
|
/>
|
||||||
|
</section>
|
||||||
|
</v-row>
|
||||||
|
</v-card>
|
||||||
|
|
||||||
<v-card class="pb-5">
|
<v-card class="pb-5">
|
||||||
<v-card-title>Global Base Color</v-card-title>
|
<v-card-title>Global Base Color</v-card-title>
|
||||||
|
@ -31,7 +47,7 @@
|
||||||
|
|
||||||
<v-alert color="primary" dense outlined type="warning">NOTE: This doesn't save after closing the app (yet)</v-alert>
|
<v-alert color="primary" dense outlined type="warning">NOTE: This doesn't save after closing the app (yet)</v-alert>
|
||||||
<v-color-picker dot-size="5" hide-mode-switch mode="hexa" v-model="accentColor" />
|
<v-color-picker dot-size="5" hide-mode-switch mode="hexa" v-model="accentColor" />
|
||||||
|
|
||||||
</v-card-text>
|
</v-card-text>
|
||||||
</v-card>
|
</v-card>
|
||||||
|
|
||||||
|
@ -44,12 +60,14 @@ export default {
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
accentColor: '#ffffff'
|
accentColor: '#ffffff',
|
||||||
|
roblox: false,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
this.accentColor = this.$vuetify.theme.themes.dark.primary;
|
this.accentColor = this.$vuetify.theme.themes.dark.primary;
|
||||||
|
this.roblox = localStorage.getItem('roblox') === 'true';
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
|
@ -71,17 +89,32 @@ export default {
|
||||||
// console.log(document.getElementsByClassName('v-application--wrap')[0].style)
|
// console.log(document.getElementsByClassName('v-application--wrap')[0].style)
|
||||||
// document.getElementsByClassName('v-application--wrap')[0].style.backgroundColor = "#000000 !important"
|
// document.getElementsByClassName('v-application--wrap')[0].style.backgroundColor = "#000000 !important"
|
||||||
},
|
},
|
||||||
|
|
||||||
saveTheme(isDark) {
|
saveTheme(isDark) {
|
||||||
localStorage.setItem("darkTheme", isDark);
|
localStorage.setItem("darkTheme", isDark);
|
||||||
},
|
},
|
||||||
|
saveRadius(value) {
|
||||||
|
localStorage.setItem("roblox", value);
|
||||||
|
},
|
||||||
|
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
// 😩
|
||||||
|
// roblox: {
|
||||||
|
// get () {
|
||||||
|
// return localStorage.getItem("roblox") === 'true'
|
||||||
|
// },
|
||||||
|
// set (value) {
|
||||||
|
// if(process.client) {
|
||||||
|
// localStorage.setItem("roblox", value)
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
accentColor: function (val, oldVal) {
|
accentColor: function (val, oldVal) {
|
||||||
this.$vuetify.theme.currentTheme.primary = val;
|
this.$vuetify.theme.currentTheme.primary = val;
|
||||||
let primaryAlt = this.$libs.hexToRgb(val);
|
let primaryAlt = this.$vuetube.hexToRgb(val);
|
||||||
|
|
||||||
let rgbEdit = 130; //Light Mode
|
let rgbEdit = 130; //Light Mode
|
||||||
if (localStorage.getItem('darkTheme') === "true") rgbEdit = -80; //Dark Mode
|
if (localStorage.getItem('darkTheme') === "true") rgbEdit = -80; //Dark Mode
|
||||||
|
@ -92,8 +125,8 @@ export default {
|
||||||
if (primaryAlt[i] < 0) primaryAlt[i] = 0;
|
if (primaryAlt[i] < 0) primaryAlt[i] = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
primaryAlt = this.$libs.rgbToHex(primaryAlt.r, primaryAlt.g, primaryAlt.b);
|
primaryAlt = this.$vuetube.rgbToHex(primaryAlt.r, primaryAlt.g, primaryAlt.b);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
this.$vuetify.theme.currentTheme.primaryAlt = primaryAlt;
|
this.$vuetify.theme.currentTheme.primaryAlt = primaryAlt;
|
||||||
|
|
|
@ -1,13 +1,13 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="py-2">
|
||||||
|
|
||||||
<v-list-item v-for="(item, index) in commits" :key="index">
|
<v-list-item v-for="(item, index) in commits" :key="index" class="my-1">
|
||||||
<v-card class="card">
|
<v-card class="card my-2">
|
||||||
<v-card-title style="padding: 0 0.25em 0 0.75em;">
|
<v-card-title style="padding: 0 0.25em 0 0.75em;">
|
||||||
{{ item.author ? item.author.login : item.commit.author.name }}
|
{{ item.author ? item.author.login : item.commit.author.name }}
|
||||||
<span v-text="`• ${item.sha.substring(0, 7)}`" class="subtitle" />
|
<span v-text="`• ${item.sha.substring(0, 7)}`" class="subtitle" />
|
||||||
<v-spacer />
|
<v-spacer />
|
||||||
<v-chip outlined class="tags" color="orange" v-if="index == 0">Latest</v-chip>
|
<v-chip outlined class="tags" style="border-radius: 0 5px 0 5px; margin-top: -12px; margin-right: -5px;" color="orange" v-if="index == 0">Latest</v-chip>
|
||||||
<v-chip outlined class="tags" color="green" v-if="item.sha == installedVersion">Installed</v-chip>
|
<v-chip outlined class="tags" color="green" v-if="item.sha == installedVersion">Installed</v-chip>
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
|
|
||||||
|
@ -31,7 +31,6 @@
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.card {
|
.card {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 1em 0 1em 0;
|
|
||||||
}
|
}
|
||||||
.subtitle {
|
.subtitle {
|
||||||
margin: 0.4em;
|
margin: 0.4em;
|
||||||
|
|
|
@ -1,12 +1,9 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="py-1">
|
||||||
|
|
||||||
<center style="padding-top: 3em;" v-if="videos == null">
|
<center v-if="videos.length == 0">
|
||||||
<v-progress-circular
|
<v-skeleton-loader type="card-avatar, article, actions" />
|
||||||
size="50"
|
<v-skeleton-loader type="card-avatar, article, actions" />
|
||||||
indeterminate
|
|
||||||
color="primary"
|
|
||||||
/>
|
|
||||||
</center>
|
</center>
|
||||||
|
|
||||||
<v-list-item v-for="(video, index) in videos" :key="index">
|
<v-list-item v-for="(video, index) in videos" :key="index">
|
||||||
|
@ -43,14 +40,13 @@
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
videos: null
|
videos: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
const searchQuestion = this.$route.query.q
|
const searchQuestion = this.$route.query.q
|
||||||
const vm = this;
|
const vm = this;
|
||||||
this.$youtube.search(searchQuestion, (data) => {
|
this.$youtube.search(searchQuestion, (data) => {
|
||||||
console.log(data)
|
|
||||||
vm.videos = data;
|
vm.videos = data;
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<center>
|
<center>
|
||||||
<img style="margin-top: 5em; max-width: 80%; max-height: 15em;" src="/dev.svg" />
|
<v-img contain style="margin-top: 5em; max-width: 80%; max-height: 15em;" src="/dev.svg" />
|
||||||
<h1 class="grey--text">Page Under Construction</h1>
|
<h1 class="grey--text">Page Under Construction</h1>
|
||||||
<p class="grey--text">Please read the VueTube FAQ for more information.</p>
|
<p class="grey--text">Please read the VueTube FAQ for more information.</p>
|
||||||
</center>
|
</center>
|
||||||
|
|
|
@ -13,9 +13,8 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.$youtube.getVideo('wykQsTJElD4', (data) => {
|
const { v } = this.$route.query
|
||||||
this.vidSrc = data;
|
console.log(v, this.$youtube.getVid(v))
|
||||||
})
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,22 +0,0 @@
|
||||||
const module = {
|
|
||||||
|
|
||||||
hexToRgb: function (hex, callback) {
|
|
||||||
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
|
||||||
return result ? {
|
|
||||||
r: parseInt(result[1], 16),
|
|
||||||
g: parseInt(result[2], 16),
|
|
||||||
b: parseInt(result[3], 16)
|
|
||||||
} : null;
|
|
||||||
},
|
|
||||||
|
|
||||||
rgbToHex: function(r, g, b) {
|
|
||||||
return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
//--- Start ---//
|
|
||||||
export default ({ app }, inject) => {
|
|
||||||
inject('libs', module)
|
|
||||||
}
|
|
|
@ -1,13 +1,28 @@
|
||||||
// Collection of functions that are useful but non-specific to any particular files
|
// Collection of functions that are useful but non-specific to any particular files
|
||||||
|
|
||||||
function getBetweenStrings(data, start_string, end_string) {
|
function getBetweenStrings(data, start_string, end_string) {
|
||||||
const regex = new RegExp(`${escapeRegExp(start_string)}(.*?)${escapeRegExp(end_string)}`, "s");
|
const regex = new RegExp(`${escapeRegExp(start_string)}(.*?)${escapeRegExp(end_string)}`, "s");
|
||||||
const match = data.match(regex);
|
const match = data.match(regex);
|
||||||
return match ? match[1] : undefined;
|
return match ? match[1] : undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
function escapeRegExp(string) {
|
function escapeRegExp(string) {
|
||||||
return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = { getBetweenStrings };
|
|
||||||
|
|
||||||
|
function hexToRgb(hex) {
|
||||||
|
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
||||||
|
return result ? {
|
||||||
|
r: parseInt(result[1], 16),
|
||||||
|
g: parseInt(result[2], 16),
|
||||||
|
b: parseInt(result[3], 16)
|
||||||
|
} : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
function rgbToHex(r, g, b) {
|
||||||
|
return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = { getBetweenStrings, hexToRgb, rgbToHex };
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
//--- Modules/Imports ---//
|
//--- Modules/Imports ---//
|
||||||
import { Http } from '@capacitor-community/http';
|
import { Http } from '@capacitor-community/http';
|
||||||
|
import { StatusBar, Style } from '@capacitor/status-bar';
|
||||||
import constants from '../static/constants';
|
import constants from '../static/constants';
|
||||||
|
import { hexToRgb, rgbToHex } from './utils';
|
||||||
|
|
||||||
const module = {
|
const module = {
|
||||||
|
|
||||||
|
@ -37,11 +39,35 @@ const module = {
|
||||||
callback(err)
|
callback(err)
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
},
|
||||||
|
|
||||||
|
statusBar: {
|
||||||
|
async hide() {
|
||||||
|
return await StatusBar.hide();
|
||||||
|
},
|
||||||
|
async show() {
|
||||||
|
return await StatusBar.show();
|
||||||
|
},
|
||||||
|
async setLight() {
|
||||||
|
return await StatusBar.setStyle({ style: Style.Light });
|
||||||
|
},
|
||||||
|
async setDark() {
|
||||||
|
return await StatusBar.setStyle({ style: Style.Dark });
|
||||||
|
},
|
||||||
|
async setTransparent() {
|
||||||
|
return StatusBar.setOverlaysWebView({ overlay: true });
|
||||||
|
},
|
||||||
|
async setBackground(color) {
|
||||||
|
return await setBackgroundColor({color: color});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
hexToRgb(hex) { return hexToRgb(hex); },
|
||||||
|
rgbToHex(r, g, b) { return rgbToHex(r, g, b); }
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
//--- Start ---//
|
//--- Start ---//
|
||||||
export default ({ app }, inject) => {
|
export default ({ app }, inject) => {
|
||||||
inject('vuetube', module)
|
inject('vuetube', module)
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,5 +8,5 @@
|
||||||
</option>
|
</option>
|
||||||
</component>
|
</component>
|
||||||
<component name="ExternalStorageConfigurationManager" enabled="true" />
|
<component name="ExternalStorageConfigurationManager" enabled="true" />
|
||||||
<component name="ProjectRootManager" version="2" languageLevel="JDK_11" project-jdk-name="11" project-jdk-type="JavaSDK" />
|
<component name="ProjectRootManager" version="2" languageLevel="JDK_11" default="true" project-jdk-name="11" project-jdk-type="JavaSDK" />
|
||||||
</project>
|
</project>
|
|
@ -18,7 +18,10 @@ If you wish to test the app within your browser, you can enter the `NUXT` direct
|
||||||
|
|
||||||
> NOTE2: If you get an error about `EACCES: permission denied 0.0.0.0:80`, change the port in `nuxt.config.js` back to 3000.
|
> NOTE2: If you get an error about `EACCES: permission denied 0.0.0.0:80`, change the port in `nuxt.config.js` back to 3000.
|
||||||
|
|
||||||
If you're done with your changes and are ready to submit your code, there is one last step: compiling to your android device. Plug in your Android or iOS device. Then, in the root directory of the project, run `npx cap run android` to test on your Android device or `npx cap run ios` to test on your iPhone. The app will proceed to build and you will be asked what device to install the debug application on. Select your device and wait as it compiles for you! Hopefully everything goes smoothly, and you are ready to make your pull request!
|
If you're done with your changes and are ready to submit your code, there is one last step: compiling to your android device.
|
||||||
|
- Plug in your Android or iOS device. (and make sure that ADB works for android by running `adb devices` in your ADB directory)
|
||||||
|
- Then, in the root directory of the project, run `./scripts/build.ps1` on windows or `./scripts/build.sh` for linux or mac.
|
||||||
|
- Finally, run `npx cap run android` to push to your android device or `npx cap run ios` for your ios device!
|
||||||
|
|
||||||
# Making a Pull Request
|
# Making a Pull Request
|
||||||
A pull request is fairly simple, and it's done here on GitHub. All we ask is that you include a few screenshots (and/or screen recordings) of what you've actually changed within the app.
|
A pull request is fairly simple, and it's done here on GitHub. All we ask is that you include a few screenshots (and/or screen recordings) of what you've actually changed within the app.
|
||||||
|
|
|
@ -346,11 +346,12 @@
|
||||||
buildSettings = {
|
buildSettings = {
|
||||||
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
|
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
|
||||||
CODE_SIGN_STYLE = Automatic;
|
CODE_SIGN_STYLE = Automatic;
|
||||||
|
DEVELOPMENT_TEAM = VRCJ7YWR89;
|
||||||
INFOPLIST_FILE = App/Info.plist;
|
INFOPLIST_FILE = App/Info.plist;
|
||||||
IPHONEOS_DEPLOYMENT_TARGET = 12.0;
|
IPHONEOS_DEPLOYMENT_TARGET = 12.2;
|
||||||
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
|
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
|
||||||
OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
|
OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
|
||||||
PRODUCT_BUNDLE_IDENTIFIER = com.Frontesque.youtube;
|
PRODUCT_BUNDLE_IDENTIFIER = com.Frontesque.vuetube;
|
||||||
PRODUCT_NAME = "$(TARGET_NAME)";
|
PRODUCT_NAME = "$(TARGET_NAME)";
|
||||||
SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
|
SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
|
||||||
SWIFT_VERSION = 5.0;
|
SWIFT_VERSION = 5.0;
|
||||||
|
@ -364,10 +365,11 @@
|
||||||
buildSettings = {
|
buildSettings = {
|
||||||
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
|
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
|
||||||
CODE_SIGN_STYLE = Automatic;
|
CODE_SIGN_STYLE = Automatic;
|
||||||
|
DEVELOPMENT_TEAM = VRCJ7YWR89;
|
||||||
INFOPLIST_FILE = App/Info.plist;
|
INFOPLIST_FILE = App/Info.plist;
|
||||||
IPHONEOS_DEPLOYMENT_TARGET = 12.0;
|
IPHONEOS_DEPLOYMENT_TARGET = 12.2;
|
||||||
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
|
LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
|
||||||
PRODUCT_BUNDLE_IDENTIFIER = com.Frontesque.youtube;
|
PRODUCT_BUNDLE_IDENTIFIER = com.Frontesque.vuetube;
|
||||||
PRODUCT_NAME = "$(TARGET_NAME)";
|
PRODUCT_NAME = "$(TARGET_NAME)";
|
||||||
SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";
|
SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";
|
||||||
SWIFT_VERSION = 5.0;
|
SWIFT_VERSION = 5.0;
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
<key>CFBundleDevelopmentRegion</key>
|
<key>CFBundleDevelopmentRegion</key>
|
||||||
<string>en</string>
|
<string>en</string>
|
||||||
<key>CFBundleDisplayName</key>
|
<key>CFBundleDisplayName</key>
|
||||||
<string>VueTube</string>
|
<string>VueTube</string>
|
||||||
<key>CFBundleExecutable</key>
|
<key>CFBundleExecutable</key>
|
||||||
<string>$(EXECUTABLE_NAME)</string>
|
<string>$(EXECUTABLE_NAME)</string>
|
||||||
<key>CFBundleIdentifier</key>
|
<key>CFBundleIdentifier</key>
|
||||||
|
|
|
@ -9,10 +9,10 @@ install! 'cocoapods', :disable_input_output_paths => true
|
||||||
def capacitor_pods
|
def capacitor_pods
|
||||||
pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
|
pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
|
||||||
pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
|
pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
|
||||||
pod 'CapacitorCommunityHttp', :path => '..\..\node_modules\@capacitor-community\http'
|
pod 'CapacitorCommunityHttp', :path => '../../node_modules/@capacitor-community/http'
|
||||||
pod 'CapacitorApp', :path => '..\..\node_modules\@capacitor\app'
|
pod 'CapacitorApp', :path => '../../node_modules/@capacitor/app'
|
||||||
pod 'CapacitorBrowser', :path => '..\..\node_modules\@capacitor\browser'
|
pod 'CapacitorBrowser', :path => '../../node_modules/@capacitor/browser'
|
||||||
pod 'CapacitorDevice', :path => '..\..\node_modules\@capacitor\device'
|
pod 'CapacitorDevice', :path => '../../node_modules/@capacitor/device'
|
||||||
end
|
end
|
||||||
|
|
||||||
target 'App' do
|
target 'App' do
|
||||||
|
|
|
@ -6,6 +6,7 @@
|
||||||
"@capacitor/browser": "^1.0.7",
|
"@capacitor/browser": "^1.0.7",
|
||||||
"@capacitor/cli": "^3.4.0",
|
"@capacitor/cli": "^3.4.0",
|
||||||
"@capacitor/core": "^3.4.0",
|
"@capacitor/core": "^3.4.0",
|
||||||
"@capacitor/device": "^1.1.2"
|
"@capacitor/device": "^1.1.2",
|
||||||
|
"@capacitor/status-bar": "^1.0.8"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,14 @@
|
||||||
[![Discord](https://img.shields.io/discord/946587366242533377?label=Discord&style=flat&logo=discord)](https://discord.gg/7P8KJrdd5W)
|
|
||||||
# VueTube
|
# VueTube
|
||||||
<img src="https://github.com/Frontesque/VueTube/raw/main/Icons/VueTube.png" alt="VueTube icon" width="200"/>
|
<img src="https://github.com/Frontesque/VueTube/raw/main/Icons/VueTube.png" alt="VueTube icon" width="200"/>
|
||||||
A simple FOSS video streaming client aimed to recreate ALL features from their respective apps (and more)
|
A simple FOSS video streaming client aimed to recreate ALL features from their respective apps (and more)
|
||||||
|
|
||||||
- Pronounced View Tube
|
- Pronounced View Tube
|
||||||
|
|
||||||
|
## Links
|
||||||
|
- Discord: [![Discord](https://img.shields.io/discord/946587366242533377?label=Discord&style=flat&logo=discord)](https://discord.gg/7P8KJrdd5W)
|
||||||
|
- Reddit: https://reddit.com/r/VueTube
|
||||||
|
- Telegram: https://t.me/VueTube
|
||||||
|
|
||||||
## Builds
|
## Builds
|
||||||
[![Build](https://github.com/Frontesque/VueTube/actions/workflows/ci.yml/badge.svg)](https://github.com/Frontesque/VueTube/actions/workflows/ci.yml)
|
[![Build](https://github.com/Frontesque/VueTube/actions/workflows/ci.yml/badge.svg)](https://github.com/Frontesque/VueTube/actions/workflows/ci.yml)
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue