mirror of https://github.com/FreeTubeApp/FreeTube
217 lines
5.8 KiB
JavaScript
217 lines
5.8 KiB
JavaScript
import Vue from 'vue'
|
|
import $ from 'jquery'
|
|
import { mapActions } from 'vuex'
|
|
import FtCard from '../ft-card/ft-card.vue'
|
|
import FtSelect from '../ft-select/ft-select.vue'
|
|
import FtInput from '../ft-input/ft-input.vue'
|
|
import FtToggleSwitch from '../ft-toggle-switch/ft-toggle-switch.vue'
|
|
import FtFlexBox from '../ft-flex-box/ft-flex-box.vue'
|
|
|
|
import debounce from 'lodash.debounce'
|
|
|
|
export default Vue.extend({
|
|
name: 'GeneralSettings',
|
|
components: {
|
|
'ft-card': FtCard,
|
|
'ft-select': FtSelect,
|
|
'ft-input': FtInput,
|
|
'ft-toggle-switch': FtToggleSwitch,
|
|
'ft-flex-box': FtFlexBox
|
|
},
|
|
data: function () {
|
|
return {
|
|
showInvidiousInstances: false,
|
|
instanceNames: [],
|
|
instanceValues: [],
|
|
backendValues: [
|
|
'invidious',
|
|
'local'
|
|
],
|
|
defaultPageNames: [
|
|
'Subscriptions',
|
|
'Trending',
|
|
'Most Popular',
|
|
'Playlists',
|
|
'History'
|
|
],
|
|
defaultPageValues: [
|
|
'subscriptions',
|
|
'trending',
|
|
'mostPopular',
|
|
'playlists',
|
|
'history'
|
|
],
|
|
viewTypeValues: [
|
|
'grid',
|
|
'list'
|
|
],
|
|
thumbnailTypeValues: [
|
|
'',
|
|
'start',
|
|
'middle',
|
|
'end'
|
|
]
|
|
}
|
|
},
|
|
computed: {
|
|
isDev: function () {
|
|
return process.env.NODE_ENV === 'development'
|
|
},
|
|
|
|
usingElectron: function () {
|
|
return this.$store.getters.getUsingElectron
|
|
},
|
|
|
|
invidiousInstance: function () {
|
|
return this.$store.getters.getInvidiousInstance
|
|
},
|
|
enableSearchSuggestions: function () {
|
|
return this.$store.getters.getEnableSearchSuggestions
|
|
},
|
|
backendFallback: function () {
|
|
return this.$store.getters.getBackendFallback
|
|
},
|
|
checkForUpdates: function () {
|
|
return this.$store.getters.getCheckForUpdates
|
|
},
|
|
checkForBlogPosts: function () {
|
|
return this.$store.getters.getCheckForBlogPosts
|
|
},
|
|
backendPreference: function () {
|
|
return this.$store.getters.getBackendPreference
|
|
},
|
|
landingPage: function () {
|
|
return this.$store.getters.getLandingPage
|
|
},
|
|
region: function () {
|
|
return this.$store.getters.getRegion
|
|
},
|
|
listType: function () {
|
|
return this.$store.getters.getListType
|
|
},
|
|
thumbnailPreference: function () {
|
|
return this.$store.getters.getThumbnailPreference
|
|
},
|
|
currentLocale: function () {
|
|
return this.$store.getters.getCurrentLocale
|
|
},
|
|
regionNames: function () {
|
|
return this.$store.getters.getRegionNames
|
|
},
|
|
regionValues: function () {
|
|
return this.$store.getters.getRegionValues
|
|
},
|
|
|
|
localeOptions: function () {
|
|
return ['system'].concat(Object.keys(this.$i18n.messages))
|
|
},
|
|
|
|
localeNames: function () {
|
|
const names = [
|
|
this.$t('Settings.General Settings.System Default')
|
|
]
|
|
|
|
Object.keys(this.$i18n.messages).forEach((locale) => {
|
|
const localeName = this.$i18n.messages[locale]['Locale Name']
|
|
if (typeof localeName !== 'undefined') {
|
|
names.push(localeName)
|
|
} else {
|
|
names.push(locale)
|
|
}
|
|
})
|
|
|
|
return names
|
|
},
|
|
|
|
backendNames: function () {
|
|
return [
|
|
this.$t('Settings.General Settings.Preferred API Backend.Invidious API'),
|
|
this.$t('Settings.General Settings.Preferred API Backend.Local API')
|
|
]
|
|
},
|
|
|
|
viewTypeNames: function () {
|
|
return [
|
|
this.$t('Settings.General Settings.Video View Type.Grid'),
|
|
this.$t('Settings.General Settings.Video View Type.List')
|
|
]
|
|
},
|
|
|
|
thumbnailTypeNames: function () {
|
|
return [
|
|
this.$t('Settings.General Settings.Thumbnail Preference.Default'),
|
|
this.$t('Settings.General Settings.Thumbnail Preference.Beginning'),
|
|
this.$t('Settings.General Settings.Thumbnail Preference.Middle'),
|
|
this.$t('Settings.General Settings.Thumbnail Preference.End')
|
|
]
|
|
}
|
|
},
|
|
mounted: function () {
|
|
const requestUrl = 'https://api.invidious.io/instances.json'
|
|
$.getJSON(requestUrl, (response) => {
|
|
console.log(response)
|
|
const instances = response.filter((instance) => {
|
|
if (instance[0].includes('.onion') || instance[0].includes('.i2p') || instance[0].includes('yewtu.be')) {
|
|
return false
|
|
} else {
|
|
return true
|
|
}
|
|
})
|
|
|
|
this.instanceNames = instances.map((instance) => {
|
|
return instance[0]
|
|
})
|
|
|
|
this.instanceValues = instances.map((instance) => {
|
|
return instance[1].uri.replace(/\/$/, '')
|
|
})
|
|
|
|
this.showInvidiousInstances = true
|
|
}).fail((xhr, textStatus, error) => {
|
|
console.log(xhr)
|
|
console.log(textStatus)
|
|
console.log(requestUrl)
|
|
console.log(error)
|
|
})
|
|
|
|
this.updateInvidiousInstanceBounce = debounce(this.updateInvidiousInstance, 500)
|
|
},
|
|
beforeDestroy: function () {
|
|
if (this.invidiousInstance === '') {
|
|
this.updateInvidiousInstance('https://invidious.snopyta.org')
|
|
}
|
|
},
|
|
methods: {
|
|
handleInvidiousInstanceInput: function (input) {
|
|
const invidiousInstance = input.replace(/\/$/, '')
|
|
this.updateInvidiousInstanceBounce(invidiousInstance)
|
|
},
|
|
|
|
handlePreferredApiBackend: function (backend) {
|
|
this.updateBackendPreference(backend)
|
|
console.log(backend)
|
|
|
|
if (backend === 'local') {
|
|
this.updateForceLocalBackendForLegacy(false)
|
|
}
|
|
},
|
|
|
|
...mapActions([
|
|
'showToast',
|
|
'updateEnableSearchSuggestions',
|
|
'updateBackendFallback',
|
|
'updateCheckForUpdates',
|
|
'updateCheckForBlogPosts',
|
|
'updateBarColor',
|
|
'updateBackendPreference',
|
|
'updateLandingPage',
|
|
'updateRegion',
|
|
'updateListType',
|
|
'updateThumbnailPreference',
|
|
'updateInvidiousInstance',
|
|
'updateForceLocalBackendForLegacy',
|
|
'updateCurrentLocale'
|
|
])
|
|
}
|
|
})
|