Add a few toast messages
This commit is contained in:
parent
cd71c35013
commit
998f5c2688
|
@ -12,6 +12,7 @@
|
|||
.toast {
|
||||
padding: 10px;
|
||||
margin: 5px;
|
||||
text-align: center;
|
||||
overflow-y: auto;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
color: white;
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import Vue from 'vue'
|
||||
import { mapActions } from 'vuex'
|
||||
import FtCard from '../ft-card/ft-card.vue'
|
||||
import FtLoader from '../../components/ft-loader/ft-loader.vue'
|
||||
import ytct from 'youtube-comments-task'
|
||||
|
@ -65,11 +66,20 @@ export default Vue.extend({
|
|||
},
|
||||
|
||||
getCommentDataLocal: function () {
|
||||
console.log('Getting comment data please wait...')
|
||||
console.log('Getting comment data please wait..')
|
||||
ytct(this.id, this.nextPageToken).fork(e => {
|
||||
this.showToast({
|
||||
message: `Local API Error (Click to copy): ${e.message}`,
|
||||
time: 10000,
|
||||
action: () => {
|
||||
navigator.clipboard.writeText(e.message)
|
||||
}
|
||||
})
|
||||
console.error('ERROR', e)
|
||||
if (this.backendFallback && this.backendPreference === 'local') {
|
||||
console.log('Falling back to Invidious API')
|
||||
this.showToast({
|
||||
message: 'Falling back to Invidious API'
|
||||
})
|
||||
this.getCommentDataInvidious()
|
||||
} else {
|
||||
this.isLoading = false
|
||||
|
@ -178,6 +188,10 @@ export default Vue.extend({
|
|||
console.log(xhr)
|
||||
this.isLoading = false
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
...mapActions([
|
||||
'showToast'
|
||||
])
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import Vue from 'vue'
|
||||
import { mapActions } from 'vuex'
|
||||
import FtCard from '../ft-card/ft-card.vue'
|
||||
import FtButton from '../ft-button/ft-button.vue'
|
||||
import FtListDropdown from '../ft-list-dropdown/ft-list-dropdown.vue'
|
||||
|
@ -111,7 +112,9 @@ export default Vue.extend({
|
|||
},
|
||||
|
||||
handleSubscription: function () {
|
||||
console.log('TODO: Handle subscription logic')
|
||||
this.showToast({
|
||||
message: 'Subscriptions have not yet been implemented'
|
||||
})
|
||||
},
|
||||
|
||||
handleFormatChange: function (format) {
|
||||
|
@ -126,6 +129,10 @@ export default Vue.extend({
|
|||
this.$parent.enableAudioFormat()
|
||||
break
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
...mapActions([
|
||||
'showToast'
|
||||
])
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import Vue from 'vue'
|
||||
import { mapActions } from 'vuex'
|
||||
import FtLoader from '../ft-loader/ft-loader.vue'
|
||||
import FtCard from '../ft-card/ft-card.vue'
|
||||
import FtFlexBox from '../ft-flex-box/ft-flex-box.vue'
|
||||
|
@ -91,24 +92,36 @@ export default Vue.extend({
|
|||
toggleLoop: function () {
|
||||
if (this.loopEnabled) {
|
||||
this.loopEnabled = false
|
||||
console.log('Disabling loop')
|
||||
this.showToast({
|
||||
message: 'Loop is now disabled'
|
||||
})
|
||||
} else {
|
||||
this.loopEnabled = true
|
||||
console.log('Enabling loop')
|
||||
this.showToast({
|
||||
message: 'Loop is now enabled'
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
toggleShuffle: function () {
|
||||
if (this.shuffleEnabled) {
|
||||
this.shuffleEnabled = false
|
||||
console.log('Disabling shuffle')
|
||||
this.showToast({
|
||||
message: 'Shuffle is now disabled'
|
||||
})
|
||||
} else {
|
||||
this.shuffleEnabled = true
|
||||
console.log('Enabling shuffle')
|
||||
this.showToast({
|
||||
message: 'Shuffle is now enabled'
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
playNextVideo: function () {
|
||||
this.showToast({
|
||||
message: 'Playing Next Video'
|
||||
})
|
||||
|
||||
const playlistInfo = {
|
||||
playlistId: this.playlistId
|
||||
}
|
||||
|
@ -178,6 +191,10 @@ export default Vue.extend({
|
|||
},
|
||||
|
||||
playPreviousVideo: function () {
|
||||
this.showToast({
|
||||
message: 'Playing previous video'
|
||||
})
|
||||
|
||||
const playlistInfo = {
|
||||
playlistId: this.playlistId
|
||||
}
|
||||
|
@ -284,6 +301,10 @@ export default Vue.extend({
|
|||
// TODO: Show toast with error message
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
...mapActions([
|
||||
'showToast'
|
||||
])
|
||||
}
|
||||
})
|
||||
|
|
|
@ -86,8 +86,8 @@ const actions = {
|
|||
return extractors.reduce((a, c) => a || c(), null) || false
|
||||
},
|
||||
|
||||
showToast (_, message, action, time) {
|
||||
FtToastEvents.$emit('toast.open', message, action, time)
|
||||
showToast (_, payload) {
|
||||
FtToastEvents.$emit('toast.open', payload.message, payload.action, payload.time)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import Vue from 'vue'
|
||||
import { mapActions } from 'vuex'
|
||||
import xml2vtt from 'yt-xml2vtt'
|
||||
import $ from 'jquery'
|
||||
import FtLoader from '../../components/ft-loader/ft-loader.vue'
|
||||
|
@ -323,16 +324,19 @@ export default Vue.extend({
|
|||
this.isLoading = false
|
||||
})
|
||||
.catch(err => {
|
||||
console.log('Error grabbing video data through local API')
|
||||
this.showToast({
|
||||
message: `Local API Error (Click to copy): ${err}`,
|
||||
time: 10000,
|
||||
action: () => {
|
||||
navigator.clipboard.writeText(err)
|
||||
}
|
||||
})
|
||||
console.log(err)
|
||||
if (!this.usingElectron || (this.backendPreference === 'local' && this.backendFallback)) {
|
||||
console.log(
|
||||
'Error getting data with local backend, falling back to Invidious'
|
||||
)
|
||||
this.showToast('Falling back to Invidious API')
|
||||
this.getVideoInformationInvidious()
|
||||
} else {
|
||||
this.isLoading = false
|
||||
// TODO: Show toast with error message
|
||||
}
|
||||
})
|
||||
},
|
||||
|
@ -424,11 +428,18 @@ export default Vue.extend({
|
|||
this.isLoading = false
|
||||
})
|
||||
.catch(err => {
|
||||
this.showToast({
|
||||
message: `Invidious API Error (Click to copy): ${err}`,
|
||||
time: 10000,
|
||||
action: () => {
|
||||
navigator.clipboard.writeText(err)
|
||||
}
|
||||
})
|
||||
console.log(err)
|
||||
if (this.backendPreference === 'invidious' && this.backendFallback) {
|
||||
console.log(
|
||||
'Error getting data with Invidious, falling back to local backend'
|
||||
)
|
||||
this.showToast({
|
||||
message: 'Falling back to the local API'
|
||||
})
|
||||
this.getVideoInformationLocal()
|
||||
} else {
|
||||
this.isLoading = false
|
||||
|
@ -457,6 +468,20 @@ export default Vue.extend({
|
|||
.then(result => {
|
||||
this.videoSourceList = result.player_response.streamingData.formats
|
||||
})
|
||||
.catch(err => {
|
||||
this.showToast({
|
||||
message: `Local API Error (Click to copy): ${err}`,
|
||||
time: 10000,
|
||||
action: () => {
|
||||
navigator.clipboard.writeText(err)
|
||||
}
|
||||
})
|
||||
console.log(err)
|
||||
if (!this.usingElectron || (this.backendPreference === 'local' && this.backendFallback)) {
|
||||
this.showToast('Falling back to Invidious API')
|
||||
this.getVideoInformationInvidious()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
enableDashFormat: function () {
|
||||
|
@ -503,9 +528,20 @@ export default Vue.extend({
|
|||
handleVideoEnded: function () {
|
||||
if (this.watchingPlaylist) {
|
||||
console.log('Playlist next video in 5 seconds')
|
||||
setTimeout(() => {
|
||||
const timeout = setTimeout(() => {
|
||||
this.$refs.watchVideoPlaylist.playNextVideo()
|
||||
}, 5000)
|
||||
|
||||
this.showToast({
|
||||
message: 'Playing next video in 5 seconds. Click to cancel',
|
||||
time: 5500,
|
||||
action: () => {
|
||||
clearTimeout(timeout)
|
||||
this.showToast({
|
||||
message: 'Canceled next video autoplay'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -525,6 +561,10 @@ export default Vue.extend({
|
|||
this.enableDashFormat()
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
...mapActions([
|
||||
'showToast'
|
||||
])
|
||||
}
|
||||
})
|
||||
|
|
Loading…
Reference in New Issue