Replace jquery getJSON and get with native fetch (#2591)

* Replace jquery getJSON and get with native fetch

* Remove unnecessary console.log
This commit is contained in:
absidue 2022-09-21 09:05:03 +02:00 committed by GitHub
parent 25d954f990
commit 061a7c8db1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 108 additions and 103 deletions

View File

@ -206,31 +206,31 @@ export default Vue.extend({
const { version } = require('../../package.json')
const requestUrl = 'https://api.github.com/repos/freetubeapp/freetube/releases?per_page=1'
$.getJSON(requestUrl, (response) => {
const tagName = response[0].tag_name
const versionNumber = tagName.replace('v', '').replace('-beta', '')
this.updateChangelog = marked.parse(response[0].body)
this.changeLogTitle = response[0].name
fetch(requestUrl)
.then((response) => response.json())
.then((json) => {
const tagName = json[0].tag_name
const versionNumber = tagName.replace('v', '').replace('-beta', '')
this.updateChangelog = marked.parse(json[0].body)
this.changeLogTitle = json[0].name
const message = this.$t('Version $ is now available! Click for more details')
this.updateBannerMessage = message.replace('$', versionNumber)
const message = this.$t('Version $ is now available! Click for more details')
this.updateBannerMessage = message.replace('$', versionNumber)
const appVersion = version.split('.')
const latestVersion = versionNumber.split('.')
const appVersion = version.split('.')
const latestVersion = versionNumber.split('.')
if (parseInt(appVersion[0]) < parseInt(latestVersion[0])) {
this.showUpdatesBanner = true
} else if (parseInt(appVersion[1]) < parseInt(latestVersion[1])) {
this.showUpdatesBanner = true
} else if (parseInt(appVersion[2]) < parseInt(latestVersion[2]) && parseInt(appVersion[1]) <= parseInt(latestVersion[1])) {
this.showUpdatesBanner = true
}
}).fail((xhr, textStatus, error) => {
console.log(xhr)
console.log(textStatus)
console.log(requestUrl)
console.log(error)
})
if (parseInt(appVersion[0]) < parseInt(latestVersion[0])) {
this.showUpdatesBanner = true
} else if (parseInt(appVersion[1]) < parseInt(latestVersion[1])) {
this.showUpdatesBanner = true
} else if (parseInt(appVersion[2]) < parseInt(latestVersion[2]) && parseInt(appVersion[1]) <= parseInt(latestVersion[1])) {
this.showUpdatesBanner = true
}
})
.catch((error) => {
console.error('errored while checking for updates', requestUrl, error)
})
}
},

View File

@ -1,5 +1,4 @@
import Vue from 'vue'
import $ from 'jquery'
import { mapActions } from 'vuex'
import FtCard from '../ft-card/ft-card.vue'
import FtToggleSwitch from '../ft-toggle-switch/ft-toggle-switch.vue'
@ -124,27 +123,28 @@ export default Vue.extend({
if (!this.useProxy) {
this.enableProxy()
}
$.getJSON(this.proxyTestUrl, (response) => {
console.log(response)
this.proxyIp = response.ip
this.proxyCountry = response.country
this.proxyRegion = response.region
this.proxyCity = response.city
this.dataAvailable = true
}).fail((xhr, textStatus, error) => {
console.log(xhr)
console.log(textStatus)
console.log(error)
this.showToast({
message: this.$t('Settings.Proxy Settings["Error getting network information. Is your proxy configured properly?"]')
fetch(this.proxyTestUrl)
.then((response) => response.json())
.then((json) => {
this.proxyIp = json.ip
this.proxyCountry = json.country
this.proxyRegion = json.region
this.proxyCity = json.city
this.dataAvailable = true
})
.catch((error) => {
console.error('errored while testing proxy:', error)
this.showToast({
message: this.$t('Settings.Proxy Settings["Error getting network information. Is your proxy configured properly?"]')
})
this.dataAvailable = false
})
.finally(() => {
if (!this.useProxy) {
this.disableProxy()
}
this.isLoading = false
})
this.dataAvailable = false
}).always(() => {
if (!this.useProxy) {
this.disableProxy()
}
this.isLoading = false
})
},
...mapActions([

View File

@ -25,11 +25,11 @@ const actions = {
async fetchInvidiousInstances({ commit }, payload) {
const requestUrl = 'https://api.invidious.io/instances.json'
let response
let instances = []
try {
response = await $.getJSON(requestUrl)
instances = response.filter((instance) => {
const response = await fetch(requestUrl)
const json = await response.json()
instances = json.filter((instance) => {
if (instance[0].includes('.onion') || instance[0].includes('.i2p')) {
return false
} else {
@ -39,7 +39,7 @@ const actions = {
return instance[1].uri.replace(/\/$/, '')
})
} catch (err) {
console.log(err)
console.error(err)
// Starts fallback strategy: read from static file
// And fallback to hardcoded entry(s) if static file absent
const fileName = 'invidious-instances.json'
@ -52,7 +52,7 @@ const actions = {
return entry.url
})
} else {
console.log('unable to read static file for invidious instances')
console.error('unable to read static file for invidious instances')
instances = [
'https://invidious.snopyta.org',
'https://invidious.kavin.rocks/'
@ -73,15 +73,15 @@ const actions = {
return new Promise((resolve, reject) => {
const requestUrl = state.currentInvidiousInstance + '/api/v1/' + payload.resource + '/' + payload.id + '?' + $.param(payload.params)
$.getJSON(requestUrl, (response) => {
resolve(response)
}).fail((xhr, textStatus, error) => {
console.log(xhr)
console.log(textStatus)
console.log(requestUrl)
console.log(error)
reject(xhr)
})
fetch(requestUrl)
.then((response) => response.json())
.then((json) => {
resolve(json)
})
.catch((error) => {
console.error('Invidious API error', requestUrl, error)
reject(error)
})
})
},

View File

@ -1,5 +1,3 @@
import $ from 'jquery'
const state = {}
const getters = {}
@ -18,24 +16,30 @@ const actions = {
const requestUrl = `${rootState.settings.sponsorBlockUrl}/api/skipSegments/${videoIdHashPrefix}?categories=${JSON.stringify(categories)}`
$.getJSON(requestUrl, (response) => {
const segments = response
.filter((result) => result.videoID === videoId)
.flatMap((result) => result.segments)
resolve(segments)
}).fail((xhr, textStatus, error) => {
// 404 means that there are no segments registered for the video
if (xhr.status === 404) {
resolve([])
return
}
fetch(requestUrl)
.then((response) => {
// 404 means that there are no segments registered for the video
if (response.status === 404) {
resolve([])
return
}
console.log(xhr)
console.log(textStatus)
console.log(requestUrl)
console.error(error)
reject(xhr)
})
response.json()
.then((json) => {
const segments = json
.filter((result) => result.videoID === videoId)
.flatMap((result) => result.segments)
resolve(segments)
})
.catch((error) => {
console.error('failed to fetch SponsorBlock segments', requestUrl, error)
reject(error)
})
})
.catch((error) => {
console.error('failed to fetch SponsorBlock segments', requestUrl, error)
reject(error)
})
})
})
}

View File

@ -1330,35 +1330,36 @@ export default Vue.extend({
const url = new URL(caption.baseUrl)
url.searchParams.set('fmt', 'vtt')
$.get(url.toString(), response => {
// The character '#' needs to be percent-encoded in a (data) URI
// because it signals an identifier, which means anything after it
// is automatically removed when the URI is used as a source
let vtt = response.replace(/#/g, '%23')
fetch(url)
.then((response) => response.text())
.then((text) => {
// The character '#' needs to be percent-encoded in a (data) URI
// because it signals an identifier, which means anything after it
// is automatically removed when the URI is used as a source
let vtt = text.replace(/#/g, '%23')
// A lot of videos have messed up caption positions that need to be removed
// This can be either because this format isn't really used by YouTube
// or because it's expected for the player to be able to somehow
// wrap the captions so that they won't step outside its boundaries
//
// Auto-generated captions are also all aligned to the start
// so those instances must also be removed
// In addition, all aligns seem to be fixed to "start" when they do pop up in normal captions
// If it's prominent enough that people start to notice, it can be removed then
if (caption.kind === 'asr') {
vtt = vtt.replace(/ align:start| position:\d{1,3}%/g, '')
} else {
vtt = vtt.replace(/ position:\d{1,3}%/g, '')
}
// A lot of videos have messed up caption positions that need to be removed
// This can be either because this format isn't really used by YouTube
// or because it's expected for the player to be able to somehow
// wrap the captions so that they won't step outside its boundaries
//
// Auto-generated captions are also all aligned to the start
// so those instances must also be removed
// In addition, all aligns seem to be fixed to "start" when they do pop up in normal captions
// If it's prominent enough that people start to notice, it can be removed then
if (caption.kind === 'asr') {
vtt = vtt.replace(/ align:start| position:\d{1,3}%/g, '')
} else {
vtt = vtt.replace(/ position:\d{1,3}%/g, '')
}
caption.baseUrl = `data:${caption.type};${caption.charset},${vtt}`
resolve(caption)
}).fail((xhr, textStatus, error) => {
console.log(xhr)
console.log(textStatus)
console.log(error)
reject(error)
})
caption.baseUrl = `data:${caption.type};${caption.charset},${vtt}`
resolve(caption)
})
.catch((error) => {
console.error(error)
reject(error)
})
}))
},