Refactor: Erase `@electron/remote` references and other dangerous calls

The `remote` module is deprecated and `@electron/remote` is unnecessary,
since the `ipcMain` and `ipcRenderer` can replace their functionality,
providing better performance and better security.

All other dangerous calls (mainly pulling main process constructs into
the renderer process) have also been removed.
This commit is contained in:
Svallinn 2021-05-22 00:49:48 +01:00
parent c9fd6385f4
commit af0353ea32
No known key found for this signature in database
GPG Key ID: 09FB527F34037CCA
20 changed files with 505 additions and 459 deletions

View File

@ -1,4 +1,7 @@
import { app, BrowserWindow, Menu, ipcMain, screen } from 'electron'
import {
app, BrowserWindow, dialog, Menu,
ipcMain, powerSaveBlocker, screen, shell
} from 'electron'
import Datastore from 'nedb'
if (process.argv.includes('--version')) {
@ -9,8 +12,6 @@ if (process.argv.includes('--version')) {
}
function runApp() {
require('@electron/remote/main').initialize()
require('electron-context-menu')({
showSearchWithGoogle: false,
showSaveImageAs: true,
@ -416,6 +417,38 @@ function runApp() {
mainWindow.webContents.session.setProxy({})
})
ipcMain.on('openExternalLink', (_, url) => {
if (typeof url === 'string') shell.openExternal(url)
})
ipcMain.handle('getLocale', () => {
return app.getLocale()
})
ipcMain.handle('getUserDataPath', () => {
return app.getPath('userData')
})
ipcMain.on('getUserDataPathSync', (event) => {
event.returnValue = app.getPath('userData')
})
ipcMain.handle('showOpenDialog', async (_, options) => {
return await dialog.showOpenDialog(options)
})
ipcMain.handle('showSaveDialog', async (_, options) => {
return await dialog.showSaveDialog(options)
})
ipcMain.on('stopPowerSaveBlocker', (_, id) => {
powerSaveBlocker.stop(id)
})
ipcMain.handle('startPowerSaveBlocker', (_, type) => {
return powerSaveBlocker.start(type)
})
ipcMain.on('createNewWindow', () => {
createWindow(false, '', false)
})

View File

@ -10,23 +10,17 @@ import FtButton from './components/ft-button/ft-button.vue'
import FtToast from './components/ft-toast/ft-toast.vue'
import FtProgressBar from './components/ft-progress-bar/ft-progress-bar.vue'
import $ from 'jquery'
import { app } from '@electron/remote'
import { markdown } from 'markdown'
import Parser from 'rss-parser'
let useElectron
let shell
let electron
let useElectron = false
let ipcRenderer = null
Vue.directive('observe-visibility', ObserveVisibility)
if (window && window.process && window.process.type === 'renderer') {
/* eslint-disable-next-line */
electron = require('electron')
shell = electron.shell
useElectron = true
} else {
useElectron = false
ipcRenderer = require('electron').ipcRenderer
}
export default Vue.extend({
@ -90,12 +84,12 @@ export default Vue.extend({
mounted: function () {
const v = this
this.$store.dispatch('grabUserSettings').then(() => {
this.$store.dispatch('grabAllProfiles', this.$t('Profile.All Channels')).then(() => {
this.$store.dispatch('grabAllProfiles', this.$t('Profile.All Channels')).then(async () => {
this.$store.dispatch('grabHistory')
this.$store.dispatch('grabAllPlaylists')
this.$store.commit('setUsingElectron', useElectron)
this.checkThemeSettings()
this.checkLocale()
await this.checkLocale()
v.dataReady = true
@ -115,14 +109,15 @@ export default Vue.extend({
})
},
methods: {
checkLocale: function () {
checkLocale: async function () {
const locale = localStorage.getItem('locale')
if (locale === null || locale === 'system') {
const systemLocale = app.getLocale().replace(/-|_/, '_')
const systemLocale = await this.getLocale()
const findLocale = Object.keys(this.$i18n.messages).find((locale) => {
const localeName = locale.replace(/-|_/, '_')
return localeName.includes(systemLocale)
const localeName = locale.replace('-', '_')
return localeName.includes(systemLocale.replace('-', '_'))
})
if (typeof findLocale !== 'undefined') {
@ -248,7 +243,7 @@ export default Vue.extend({
handleNewBlogBannerClick: function (response) {
if (response) {
shell.openExternal(this.latestBlogUrl)
this.openExternalLink(this.latestBlogUrl)
}
this.showBlogBanner = false
@ -256,7 +251,7 @@ export default Vue.extend({
openDownloadsPage: function () {
const url = 'https://freetubeapp.io#download'
shell.openExternal(url)
this.openExternalLink(url)
this.showReleaseNotes = false
this.showUpdatesBanner = false
},
@ -301,9 +296,7 @@ export default Vue.extend({
this.handleYoutubeLink(el.href)
} else {
// Open links externally by default
if (typeof (shell) !== 'undefined') {
shell.openExternal(el.href)
}
this.openExternalLink(el.href)
}
})
},
@ -385,23 +378,24 @@ export default Vue.extend({
enableOpenUrl: function () {
const v = this
electron.ipcRenderer.on('openUrl', function (event, url) {
ipcRenderer.on('openUrl', function (event, url) {
if (url) {
v.handleYoutubeLink(url)
}
})
electron.ipcRenderer.send('appReady')
ipcRenderer.send('appReady')
},
setBoundsOnClose: function () {
window.onbeforeunload = (e) => {
electron.ipcRenderer.send('setBounds')
ipcRenderer.send('setBounds')
}
},
...mapActions([
'showToast'
'showToast',
'openExternalLink'
])
}
})

View File

@ -10,9 +10,7 @@ import fs from 'fs'
import { opmlToJSON } from 'opml-to-json'
import ytch from 'yt-channel-info'
const remote = require('@electron/remote')
const app = remote.app
const dialog = remote.dialog
// FIXME: Missing web logic branching
export default Vue.extend({
name: 'DataSettings',
@ -210,7 +208,7 @@ export default Vue.extend({
})
},
importFreeTubeSubscriptions: function () {
importFreeTubeSubscriptions: async function () {
const options = {
properties: ['openFile'],
filters: [
@ -221,14 +219,13 @@ export default Vue.extend({
]
}
dialog.showOpenDialog(options).then((response) => {
const response = await this.showOpenDialog(options)
if (response.canceled || response.filePaths.length === 0) {
return
}
const filePath = response.filePaths[0]
this.handleFreetubeImportFile(filePath)
})
},
handleYoutubeImportFile: function (filePath) {
@ -313,7 +310,7 @@ export default Vue.extend({
})
},
importYouTubeSubscriptions: function () {
importYouTubeSubscriptions: async function () {
const options = {
properties: ['openFile'],
filters: [
@ -324,17 +321,16 @@ export default Vue.extend({
]
}
dialog.showOpenDialog(options).then(async (response) => {
const response = await this.showOpenDialog(options)
if (response.canceled || response.filePaths.length === 0) {
return
}
const filePath = response.filePaths[0]
this.handleYoutubeImportFile(filePath)
})
},
importOpmlYouTubeSubscriptions: function () {
importOpmlYouTubeSubscriptions: async function () {
const options = {
properties: ['openFile'],
filters: [
@ -345,7 +341,7 @@ export default Vue.extend({
]
}
dialog.showOpenDialog(options).then(async (response) => {
const response = await this.showOpenDialog(options)
if (response.canceled || response.filePaths.length === 0) {
return
}
@ -445,10 +441,9 @@ export default Vue.extend({
})
})
})
})
},
importNewPipeSubscriptions: function () {
importNewPipeSubscriptions: async function () {
const options = {
properties: ['openFile'],
filters: [
@ -459,7 +454,7 @@ export default Vue.extend({
]
}
dialog.showOpenDialog(options).then(async (response) => {
const response = await this.showOpenDialog(options)
if (response.canceled || response.filePaths.length === 0) {
return
}
@ -547,7 +542,6 @@ export default Vue.extend({
}
})
})
})
},
exportSubscriptions: function (option) {
@ -575,7 +569,7 @@ export default Vue.extend({
exportFreeTubeSubscriptions: async function () {
await this.compactProfiles()
const userData = app.getPath('userData')
const userData = await this.getUserDataPath()
const subscriptionsDb = `${userData}/profiles.db`
const date = new Date()
let dateMonth = date.getMonth() + 1
@ -603,7 +597,7 @@ export default Vue.extend({
]
}
dialog.showSaveDialog(options).then((response) => {
const response = await this.showSaveDialog(options)
if (response.canceled || response.filePath === '') {
// User canceled the save dialog
return
@ -634,10 +628,9 @@ export default Vue.extend({
})
})
})
})
},
exportYouTubeSubscriptions: function () {
exportYouTubeSubscriptions: async function () {
const date = new Date()
let dateMonth = date.getMonth() + 1
@ -700,7 +693,7 @@ export default Vue.extend({
return object
})
dialog.showSaveDialog(options).then((response) => {
const response = await this.showSaveDialog(options)
if (response.canceled || response.filePath === '') {
// User canceled the save dialog
return
@ -721,7 +714,6 @@ export default Vue.extend({
message: this.$t('Settings.Data Settings.Subscriptions have been successfully exported')
})
})
})
},
exportOpmlYouTubeSubscriptions: async function () {
@ -766,7 +758,7 @@ export default Vue.extend({
}
})
dialog.showSaveDialog(options).then((response) => {
const response = await this.showSaveDialog(options)
if (response.canceled || response.filePath === '') {
// User canceled the save dialog
return
@ -787,10 +779,9 @@ export default Vue.extend({
message: this.$t('Settings.Data Settings.Subscriptions have been successfully exported')
})
})
})
},
exportNewPipeSubscriptions: function () {
exportNewPipeSubscriptions: async function () {
const date = new Date()
let dateMonth = date.getMonth() + 1
@ -834,7 +825,7 @@ export default Vue.extend({
newPipeObject.subscriptions.push(subscription)
})
dialog.showSaveDialog(options).then((response) => {
const response = await this.showSaveDialog(options)
if (response.canceled || response.filePath === '') {
// User canceled the save dialog
return
@ -855,11 +846,10 @@ export default Vue.extend({
message: this.$t('Settings.Data Settings.Subscriptions have been successfully exported')
})
})
})
},
checkForLegacySubscriptions: function () {
let dbLocation = app.getPath('userData')
checkForLegacySubscriptions: async function () {
let dbLocation = await this.getUserDataPath()
dbLocation = dbLocation + '/subscriptions.db'
this.handleFreetubeImportFile(dbLocation)
fs.unlink(dbLocation, (err) => {
@ -869,7 +859,7 @@ export default Vue.extend({
})
},
importHistory: function () {
importHistory: async function () {
const options = {
properties: ['openFile'],
filters: [
@ -880,7 +870,7 @@ export default Vue.extend({
]
}
dialog.showOpenDialog(options).then((response) => {
const response = await this.showOpenDialog(options)
if (response.canceled || response.filePaths.length === 0) {
return
}
@ -947,12 +937,11 @@ export default Vue.extend({
message: this.$t('Settings.Data Settings.All watched history has been successfully imported')
})
})
})
},
exportHistory: async function () {
await this.compactHistory()
const userData = app.getPath('userData')
const userData = await this.getUserDataPath()
const historyDb = `${userData}/history.db`
const date = new Date()
let dateMonth = date.getMonth() + 1
@ -980,7 +969,7 @@ export default Vue.extend({
]
}
dialog.showSaveDialog(options).then((response) => {
const response = await this.showSaveDialog(options)
if (response.canceled || response.filePath === '') {
// User canceled the save dialog
return
@ -1011,7 +1000,6 @@ export default Vue.extend({
})
})
})
})
},
async convertOldFreeTubeFormatToNew(oldData) {
@ -1114,7 +1102,10 @@ export default Vue.extend({
'compactHistory',
'showToast',
'getRandomColor',
'calculateColorLuminance'
'calculateColorLuminance',
'showOpenDialog',
'showSaveDialog',
'getUserDataPath'
]),
...mapMutations([

View File

@ -60,10 +60,6 @@ export default Vue.extend({
}
},
computed: {
usingElectron: function () {
return this.$store.getters.getUsingElectron
},
historyCache: function () {
return this.$store.getters.getHistoryCache
},
@ -216,10 +212,7 @@ export default Vue.extend({
})
break
case 'openYoutube':
if (this.usingElectron) {
const shell = require('electron').shell
shell.openExternal(this.youtubeUrl)
}
this.openExternalLink(this.youtubeUrl)
break
case 'copyYoutubeEmbed':
navigator.clipboard.writeText(this.youtubeEmbedUrl)
@ -228,10 +221,7 @@ export default Vue.extend({
})
break
case 'openYoutubeEmbed':
if (this.usingElectron) {
const shell = require('electron').shell
shell.openExternal(this.youtubeEmbedUrl)
}
this.openExternalLink(this.youtubeEmbedUrl)
break
case 'copyInvidious':
navigator.clipboard.writeText(this.invidiousUrl)
@ -240,11 +230,7 @@ export default Vue.extend({
})
break
case 'openInvidious':
if (this.usingElectron) {
console.log('using electron')
const shell = require('electron').shell
shell.openExternal(this.invidiousUrl)
}
this.openExternalLink(this.invidiousUrl)
break
case 'copyYoutubeChannel':
navigator.clipboard.writeText(this.youtubeChannelUrl)
@ -253,10 +239,7 @@ export default Vue.extend({
})
break
case 'openYoutubeChannel':
if (this.usingElectron) {
const shell = require('electron').shell
shell.openExternal(this.youtubeChannelUrl)
}
this.openExternalLink(this.youtubeChannelUrl)
break
case 'copyInvidiousChannel':
navigator.clipboard.writeText(this.invidiousChannelUrl)
@ -265,10 +248,7 @@ export default Vue.extend({
})
break
case 'openInvidiousChannel':
if (this.usingElectron) {
const shell = require('electron').shell
shell.openExternal(this.invidiousChannelUrl)
}
this.openExternalLink(this.invidiousChannelUrl)
break
}
},
@ -460,7 +440,8 @@ export default Vue.extend({
'updateHistory',
'removeFromHistory',
'addVideo',
'removeVideo'
'removeVideo',
'openExternalLink'
])
}
})

View File

@ -34,10 +34,6 @@ export default Vue.extend({
return this.$store.getters.getInvidiousInstance
},
usingElectron: function () {
return this.$store.getters.getUsingElectron
},
invidiousURL() {
return `${this.invidiousInstance}/watch?v=${this.id}`
},
@ -63,15 +59,8 @@ export default Vue.extend({
navigator.clipboard.writeText(text)
},
open(url) {
if (this.usingElectron) {
const shell = require('electron').shell
shell.openExternal(url)
}
},
openInvidious() {
this.open(this.getFinalUrl(this.invidiousURL))
this.openExternalLink(this.getFinalUrl(this.invidiousURL))
this.$refs.iconButton.focusOut()
},
@ -84,7 +73,7 @@ export default Vue.extend({
},
openYoutube() {
this.open(this.getFinalUrl(this.youtubeURL))
this.openExternalLink(this.getFinalUrl(this.youtubeURL))
this.$refs.iconButton.focusOut()
},
@ -97,7 +86,7 @@ export default Vue.extend({
},
openYoutubeEmbed() {
this.open(this.getFinalUrl(this.youtubeEmbedURL))
this.openExternalLink(this.getFinalUrl(this.youtubeEmbedURL))
this.$refs.iconButton.focusOut()
},
@ -110,7 +99,7 @@ export default Vue.extend({
},
openInvidiousEmbed() {
this.open(this.getFinalUrl(this.invidiousEmbedURL))
this.openExternalLink(this.getFinalUrl(this.invidiousEmbedURL))
this.$refs.iconButton.focusOut()
},
@ -134,7 +123,8 @@ export default Vue.extend({
},
...mapActions([
'showToast'
'showToast',
'openExternalLink'
])
}
})

View File

@ -30,8 +30,8 @@ export default Vue.extend({
}
if (this.usingElectron && this.powerSaveBlocker !== null) {
const { powerSaveBlocker } = require('electron')
powerSaveBlocker.stop(this.powerSaveBlocker)
const { ipcRenderer } = require('electron')
ipcRenderer.send('stopPowerSaveBlocker', this.powerSaveBlocker)
}
},
props: {
@ -189,8 +189,8 @@ export default Vue.extend({
}
if (this.usingElectron && this.powerSaveBlocker !== null) {
const { powerSaveBlocker } = require('electron')
powerSaveBlocker.stop(this.powerSaveBlocker)
const { ipcRenderer } = require('electron')
ipcRenderer.send('stopPowerSaveBlocker', this.powerSaveBlocker)
}
},
methods: {
@ -274,18 +274,18 @@ export default Vue.extend({
v.$emit('error', error.target.player.error_)
})
this.player.on('play', function () {
this.player.on('play', async function () {
if (this.usingElectron) {
const { powerSaveBlocker } = require('electron')
this.powerSaveBlocker = powerSaveBlocker.start('prevent-display-sleep')
const { ipcRenderer } = require('electron')
this.powerSaveBlocker =
await ipcRenderer.invoke('startPowerSaveBlocker', 'prevent-display-sleep')
}
})
this.player.on('pause', function () {
if (this.usingElectron && this.powerSaveBlocker !== null) {
const { powerSaveBlocker } = require('electron')
powerSaveBlocker.stop(this.powerSaveBlocker)
const { ipcRenderer } = require('electron')
ipcRenderer.send('stopPowerSaveBlocker', this.powerSaveBlocker)
this.powerSaveBlocker = null
}
})

View File

@ -1,7 +1,6 @@
import Vue from 'vue'
import $ from 'jquery'
import { mapActions } from 'vuex'
import { app } from '@electron/remote'
import FtCard from '../ft-card/ft-card.vue'
import FtSelect from '../ft-select/ft-select.vue'
import FtInput from '../ft-input/ft-input.vue'
@ -59,6 +58,11 @@ export default Vue.extend({
isDev: function () {
return process.env.NODE_ENV === 'development'
},
usingElectron: function () {
return this.$store.getters.getUsingElectron
},
invidiousInstance: function () {
return this.$store.getters.getInvidiousInstance
},
@ -192,12 +196,13 @@ export default Vue.extend({
}
},
updateLocale: function (locale) {
updateLocale: async function (locale) {
if (locale === 'system') {
const systemLocale = app.getLocale().replace(/-|_/, '_')
const systemLocale = await this.getLocale()
const findLocale = Object.keys(this.$i18n.messages).find((locale) => {
const localeName = locale.replace(/-|_/, '_')
return localeName.includes(systemLocale)
const localeName = locale.replace('-', '_')
return localeName.includes(systemLocale.replace('-', '_'))
})
if (typeof findLocale !== 'undefined') {
@ -240,7 +245,8 @@ export default Vue.extend({
'updateThumbnailPreference',
'updateInvidiousInstance',
'updateForceLocalBackendForLegacy',
'getRegionData'
'getRegionData',
'getLocale'
])
}
})

View File

@ -1,6 +1,6 @@
import Vue from 'vue'
import { mapActions } from 'vuex'
import FtListDropdown from '../ft-list-dropdown/ft-list-dropdown.vue'
import { shell } from 'electron'
export default Vue.extend({
name: 'FtElementList',
@ -101,15 +101,19 @@ export default Vue.extend({
navigator.clipboard.writeText(youtubeUrl)
break
case 'openYoutube':
shell.openExternal(youtubeUrl)
this.openExternalLink(youtubeUrl)
break
case 'copyInvidious':
navigator.clipboard.writeText(invidiousUrl)
break
case 'openInvidious':
shell.openExternal(invidiousUrl)
this.openExternalLink(invidiousUrl)
break
}
}
},
...mapActions([
'openExternalLink'
])
}
})

View File

@ -9,7 +9,9 @@ import FtInput from '../ft-input/ft-input.vue'
import FtLoader from '../ft-loader/ft-loader.vue'
import FtFlexBox from '../ft-flex-box/ft-flex-box.vue'
import electron from 'electron'
// FIXME: Missing web logic branching
import { ipcRenderer } from 'electron'
import debounce from 'lodash.debounce'
export default Vue.extend({
@ -109,11 +111,11 @@ export default Vue.extend({
},
enableProxy: function () {
electron.ipcRenderer.send('enableProxy', this.proxyUrl)
ipcRenderer.send('enableProxy', this.proxyUrl)
},
disableProxy: function () {
electron.ipcRenderer.send('disableProxy')
ipcRenderer.send('disableProxy')
},
testProxy: function () {

View File

@ -146,6 +146,7 @@ export default Vue.extend({
},
handleUiScale: function (value) {
// FIXME: No electron safeguard
const { webFrame } = require('electron')
const zoomFactor = value / 100
webFrame.setZoomFactor(zoomFactor)
@ -167,12 +168,13 @@ export default Vue.extend({
this.updateDisableSmoothScrolling(this.disableSmoothScrollingToggleValue)
const electron = require('electron')
// FIXME: No electron safeguard
const { ipcRenderer } = require('electron')
if (this.disableSmoothScrollingToggleValue) {
electron.ipcRenderer.send('disableSmoothScrolling')
ipcRenderer.send('disableSmoothScrolling')
} else {
electron.ipcRenderer.send('enableSmoothScrolling')
ipcRenderer.send('enableSmoothScrolling')
}
},

View File

@ -6,7 +6,6 @@ import FtProfileSelector from '../ft-profile-selector/ft-profile-selector.vue'
import $ from 'jquery'
import debounce from 'lodash.debounce'
import ytSuggest from 'youtube-suggest'
const { ipcRenderer } = require('electron')
export default Vue.extend({
name: 'TopNav',
@ -24,6 +23,10 @@ export default Vue.extend({
}
},
computed: {
usingElectron: function () {
return this.$store.getters.getUsingElectron
},
enableSearchSuggestions: function () {
return this.$store.getters.getEnableSearchSuggestions
},
@ -255,7 +258,12 @@ export default Vue.extend({
},
createNewWindow: function () {
if (this.usingElectron) {
const { ipcRenderer } = require('electron')
ipcRenderer.send('createNewWindow')
} else {
// Web placeholder
}
},
...mapActions([

View File

@ -6,7 +6,6 @@ import FtListDropdown from '../ft-list-dropdown/ft-list-dropdown.vue'
import FtFlexBox from '../ft-flex-box/ft-flex-box.vue'
import FtIconButton from '../ft-icon-button/ft-icon-button.vue'
import FtShareButton from '../ft-share-button/ft-share-button.vue'
// import { shell } from 'electron'
export default Vue.extend({
name: 'WatchVideoInfo',
@ -111,10 +110,6 @@ export default Vue.extend({
return this.$store.getters.getInvidiousInstance
},
usingElectron: function () {
return this.$store.getters.getUsingElectron
},
profileList: function () {
return this.$store.getters.getProfileList
},
@ -346,11 +341,6 @@ export default Vue.extend({
}
},
handleDownloadLink: function (url) {
const shell = require('electron').shell
shell.openExternal(url)
},
addToPlaylist: function () {
const videoData = {
videoId: this.id,
@ -396,7 +386,8 @@ export default Vue.extend({
'showToast',
'updateProfile',
'addVideo',
'removeVideo'
'removeVideo',
'openExternalLink'
])
}
})

View File

@ -86,7 +86,7 @@
icon="download"
:dropdown-names="downloadLinkNames"
:dropdown-values="downloadLinkValues"
@click="handleDownloadLink"
@click="openExternalLink"
/>
<ft-icon-button
v-if="!isUpcoming"

View File

@ -11,8 +11,8 @@ if (window && window.process && window.process.type === 'renderer') {
dbLocation = electron.remote.app.getPath('userData')
} */
const remote = require('@electron/remote')
dbLocation = remote.app.getPath('userData')
const { ipcRenderer } = require('electron')
dbLocation = ipcRenderer.sendSync('getUserDataPathSync')
dbLocation = dbLocation + '/history.db'
} else {
dbLocation = 'history.db'

View File

@ -13,9 +13,8 @@ if (window && window.process && window.process.type === 'renderer') {
//
// dbLocation += '/playlists.db'
const remote = require('@electron/remote')
dbLocation = remote.app.getPath('userData')
const { ipcRenderer } = require('electron')
dbLocation = ipcRenderer.sendSync('getUserDataPathSync')
dbLocation = dbLocation + '/playlists.db'
} else {
dbLocation = 'playlists.db'

View File

@ -11,9 +11,8 @@ if (window && window.process && window.process.type === 'renderer') {
dbLocation = electron.remote.app.getPath('userData')
} */
const remote = require('@electron/remote')
dbLocation = remote.app.getPath('userData')
const { ipcRenderer } = require('electron')
dbLocation = ipcRenderer.sendSync('getUserDataPathSync')
dbLocation = dbLocation + '/profiles.db'
} else {
dbLocation = 'profiles.db'

View File

@ -1,7 +1,6 @@
import Datastore from 'nedb'
let dbLocation
let electron = null
let webframe = null
if (window && window.process && window.process.type === 'renderer') {
@ -13,12 +12,11 @@ if (window && window.process && window.process.type === 'renderer') {
dbLocation = electron.remote.app.getPath('userData')
} */
electron = require('electron')
webframe = electron.webFrame
const remote = require('@electron/remote')
dbLocation = remote.app.getPath('userData')
const electron = require('electron')
const ipcRenderer = electron.ipcRenderer
dbLocation = ipcRenderer.sendSync('getUserDataPathSync')
dbLocation = dbLocation + '/settings.db'
webframe = electron.webframe
} else {
dbLocation = 'settings.db'
}
@ -332,7 +330,9 @@ const actions = {
commit('setBarColor', result.value)
break
case 'uiScale':
if (webframe) {
webframe.setZoomFactor(parseInt(result.value) / 100)
}
commit('setUiScale', result.value)
break
case 'disableSmoothScrolling':

View File

@ -105,7 +105,67 @@ const getters = {
}
}
/**
* Wrapper function that calls `ipcRenderer.invoke(IRCtype, payload)` if the user is
* using Electron or a provided custom callback otherwise.
* @param {Object} context Object
* @param {String} IRCtype String
* @param {Function} webCbk Function
* @param {Object} payload any (default: null)
*/
async function invokeIRC(context, IRCtype, webCbk, payload = null) {
let response = null
const usingElectron = context.rootState.settings.usingElectron
if (usingElectron) {
const { ipcRenderer } = require('electron')
response = await ipcRenderer.invoke(IRCtype, payload)
} else if (webCbk) {
response = await webCbk()
}
return response
}
const actions = {
openExternalLink ({ rootState }, url) {
const usingElectron = rootState.settings.usingElectron
if (usingElectron) {
const ipcRenderer = require('electron').ipcRenderer
ipcRenderer.send('openExternalLink', url)
} else {
// Web placeholder
}
},
async getLocale (context) {
const webCbk = () => {
if (navigator && navigator.language) {
return navigator.language
}
}
return await invokeIRC(context, 'getLocale', webCbk) || 'en-US'
},
async showOpenDialog (context, options) {
// TODO: implement showOpenDialog web compatible callback
const webCbk = () => null
return await invokeIRC(context, 'showOpenDialog', webCbk, options)
},
async showSaveDialog (context, options) {
// TODO: implement showSaveDialog web compatible callback
const webCbk = () => null
return await invokeIRC(context, 'showSaveDialog', webCbk, options)
},
async getUserDataPath (context) {
// TODO: implement getUserDataPath web compatible callback
const webCbk = () => null
return await invokeIRC(context, 'getUserDataPath', webCbk)
},
updateShowProgressBar ({ commit }, value) {
commit('setShowProgressBar', value)
},

View File

@ -88,18 +88,5 @@ export default Vue.extend({
}
]
}
},
computed: {
usingElectron: function () {
return this.$store.getters.getUsingElectron
}
},
methods: {
openUrl: function (url) {
if (this.usingElectron) {
const shell = require('electron').shell
shell.openExternal(url)
}
}
}
})

View File

@ -14,8 +14,6 @@ import WatchVideoLiveChat from '../../components/watch-video-live-chat/watch-vid
import WatchVideoPlaylist from '../../components/watch-video-playlist/watch-video-playlist.vue'
import WatchVideoRecommendations from '../../components/watch-video-recommendations/watch-video-recommendations.vue'
const remote = require('@electron/remote')
export default Vue.extend({
name: 'Watch',
components: {
@ -931,7 +929,7 @@ export default Vue.extend({
const countDownIntervalId = setInterval(showCountDownMessage, 1000)
},
handleRouteChange: function () {
handleRouteChange: async function () {
clearTimeout(this.playNextTimeout)
this.handleWatchProgress()
@ -961,7 +959,7 @@ export default Vue.extend({
}
if (this.removeVideoMetaFiles) {
const userData = remote.app.getPath('userData')
const userData = await this.getUserDataPath()
if (this.isDev) {
const dashFileLocation = `dashFiles/${this.videoId}.xml`
const vttFileLocation = `storyboards/${this.videoId}.vtt`
@ -1004,9 +1002,9 @@ export default Vue.extend({
}
},
createLocalDashManifest: function (formats) {
createLocalDashManifest: async function (formats) {
const xmlData = ytDashGen.generate_dash_file_from_formats(formats, this.videoLengthSeconds)
const userData = remote.app.getPath('userData')
const userData = await this.getUserDataPath()
let fileLocation
let uriSchema
if (this.isDev) {
@ -1076,8 +1074,8 @@ export default Vue.extend({
})
})
// TODO: MAKE A VARIABLE WHICH CAN CHOOSE BETWEEN STROYBOARD ARRAY ELEMENTS
this.buildVTTFileLocally(storyboardArray[1]).then((results) => {
const userData = remote.app.getPath('userData')
this.buildVTTFileLocally(storyboardArray[1]).then(async (results) => {
const userData = await this.getUserDataPath()
let fileLocation
let uriSchema
@ -1195,7 +1193,8 @@ export default Vue.extend({
'showToast',
'buildVTTFileLocally',
'updateHistory',
'updateWatchProgress'
'updateWatchProgress',
'getUserDataPath'
])
}
})