2020-09-21 12:25:50 +00:00
<!--
2024-02-02 18:27:50 +00:00
- Copyright ( c ) 2020 - 2024. The Nextcloud Bookmarks contributors .
2020-09-21 12:25:50 +00:00
-
- This file is licensed under the Affero General Public License version 3 or later . See the COPYING file .
-- >
2019-08-20 12:45:43 +00:00
< template >
2024-02-02 17:45:39 +00:00
< NcAppSettingsDialog :open ="settingsOpen"
: show - navigation = "true"
: name = "t('bookmarks', 'Bookmarks settings')"
2024-02-03 12:38:07 +00:00
class = "settings"
@ update : open = "$emit('update:settingsOpen', $event)" >
2024-01-31 17:51:59 +00:00
< NcAppSettingsSection id = "importexport" : name = "t('bookmarks', 'Import/Export')" >
< template # icon >
< ImportIcon :size ="20" / >
< / template >
< input type = "file"
class = "import"
size = "5"
@ change = "onImportSubmit" >
< button @click ="onImportOpen" >
< span : class = "{'icon-upload': !importing, 'icon-loading-small': importing}" / > { { t ( 'bookmarks' , 'Import bookmarks' ) } }
< / button >
< button @click ="onExport" >
< span class = "icon-download" / > { { t ( 'bookmarks' , 'Export bookmarks' ) } }
< / button >
< / NcAppSettingsSection >
2019-08-20 12:45:43 +00:00
2024-01-31 17:51:59 +00:00
< NcAppSettingsSection v-if ="scrapingEnabled" id="archive" :name="t('bookmarks', 'Auto-archiving')" >
< template # icon >
< ArchiveIcon :size ="20" / >
< / template >
< p > { { t ( 'bookmarks' , 'The bookmarks app can automatically archive the web content of links you have bookmarked' ) } } < / p >
2024-02-02 17:45:39 +00:00
< NcCheckboxRadioSwitch :checked ="archiveEnabled" @update:checked ="onChangeArchiveEnabled" >
{ { t ( 'bookmarks' , 'Enable archiving' ) } }
< / NcCheckboxRadioSwitch >
< NcTextField v -if = " archiveEnabled "
: label = "t('bookmarks', 'Enter the path of a folder in your Files where bookmarked files should be stored.')"
: value = "archivePath"
: readonly = "true"
@ click = "onChangeArchivePath" / >
2024-01-31 17:51:59 +00:00
< / NcAppSettingsSection >
2020-08-21 15:18:30 +00:00
2024-01-31 17:51:59 +00:00
< NcAppSettingsSection id = "backup" : name = "t('bookmarks', 'Auto-Backup')" >
< template # icon >
< BackupIcon :size ="20" / >
< / template >
< p > { { t ( 'bookmarks' , 'The bookmarks app can automatically backup your bookmarks on a daily basis to prevent data loss when syncing bookmarks across devices.' ) } } < / p >
2024-02-02 17:45:39 +00:00
< NcCheckboxRadioSwitch :checked ="backupEnabled" @update:checked ="onChangeBackupEnabled" >
{ { t ( 'bookmarks' , 'Enable backups' ) } }
< / NcCheckboxRadioSwitch >
< NcTextField v -if = " backupEnabled "
: label = "t('bookmarks', 'Enter the path of a folder in your Files where backups will be stored.')"
: value = "backupPath"
2022-03-11 12:38:54 +00:00
: readonly = "true"
2024-01-31 17:51:59 +00:00
@ click = "onChangeBackupPath" / >
< / NcAppSettingsSection >
2022-03-11 12:38:54 +00:00
2024-01-31 17:51:59 +00:00
< NcAppSettingsSection id = "client-apps" : name = "t('bookmarks', 'Client apps')" >
< template # icon >
< ApplicationIcon :size ="20" / >
< / template >
< p >
{ {
t ( 'bookmarks' ,
'Also check out the collection of client apps that integrate with this app: '
)
} }
< a href = "https://github.com/nextcloud/bookmarks#third-party-clients" style = "text-decoration: underline;" > { {
t ( 'bookmarks' , 'Client apps' )
} } < / a >
< / p >
< / NcAppSettingsSection >
2020-09-25 10:13:42 +00:00
2024-01-31 17:51:59 +00:00
< NcAppSettingsSection id = "install" : name = "t('bookmarks', 'Install web app')" >
< template # icon >
< ApplicationImportIcon :size ="20" / >
< / template >
2021-06-09 16:56:36 +00:00
< p > { { t ( 'bookmarks' , 'You can install this app on your device home screen to quickly access your bookmarks on your phone. You can easily remove the app from your home screen again, if you don\'t like it.' ) } } < / p >
2021-07-27 15:43:35 +00:00
< a class = "button center" href = "#" @click.prevent ="clickAddToHomeScreen" > { { t ( 'bookmarks' , 'Install on home screen' ) } } < / a >
2024-01-31 17:51:59 +00:00
< / NcAppSettingsSection >
2019-08-28 12:49:51 +00:00
2024-01-31 17:51:59 +00:00
< NcAppSettingsSection id = "bookmarklet" : name = "t('bookmarks', 'Bookmarklet')" >
< template # icon >
< LinkIcon :size ="20" / >
< / template >
< p >
{ { t ( 'bookmarks' ,
'Drag this to your browser bookmarks and click it to quickly bookmark a webpage.'
) } }
< / p >
2022-12-12 19:29:03 +00:00
< a class = "button center"
2019-09-24 15:18:29 +00:00
: href = "bookmarklet"
@ click . prevent = "void 0" > { {
t ( 'bookmarks' , 'Add to {instanceName}' , {
instanceName : oc _defaults . name
} )
} } < / a >
2024-01-31 17:51:59 +00:00
< / NcAppSettingsSection >
< / NcAppSettingsDialog >
2019-08-20 12:45:43 +00:00
< / template >
< script >
2020-03-28 17:15:59 +00:00
import { generateUrl } from '@nextcloud/router'
2022-12-12 19:29:03 +00:00
import { actions } from '../store/index.js'
2020-03-28 17:15:59 +00:00
import { getRequestToken } from '@nextcloud/auth'
2020-09-29 11:29:33 +00:00
import { getFilePickerBuilder } from '@nextcloud/dialogs'
2023-08-17 09:43:00 +00:00
import { privateRoutes } from '../router.js'
2024-01-31 17:51:59 +00:00
import { NcAppSettingsSection , NcAppSettingsDialog , NcCheckboxRadioSwitch , NcTextField } from '@nextcloud/vue'
2024-02-02 17:45:39 +00:00
import { ImportIcon , ArchiveIcon , BackupIcon , LinkIcon , ApplicationIcon , ApplicationImportIcon } from './Icons.js'
2020-03-25 12:19:17 +00:00
2020-03-28 17:15:59 +00:00
export default {
name : 'Settings' ,
2024-01-31 17:51:59 +00:00
components : { NcAppSettingsSection , NcAppSettingsDialog , NcCheckboxRadioSwitch , NcTextField , ImportIcon , ArchiveIcon , BackupIcon , LinkIcon , ApplicationIcon , ApplicationImportIcon } ,
props : {
settingsOpen : {
type : Boolean ,
required : true ,
} ,
} ,
2020-04-17 11:22:00 +00:00
data ( ) {
return {
importing : false ,
2020-04-18 13:18:03 +00:00
deleting : false ,
2020-09-25 10:13:42 +00:00
addToHomeScreen : null ,
2022-03-11 12:38:54 +00:00
archivePathPicker : getFilePickerBuilder ( this . t ( 'bookmarks' , 'Archive path' ) )
. allowDirectories ( true )
. setModal ( true )
. setType ( 1 ) // CHOOSE
. setMultiSelect ( false )
. build ( ) ,
backupPathPicker : getFilePickerBuilder ( this . t ( 'bookmarks' , 'Backup path' ) )
2020-09-29 11:29:33 +00:00
. allowDirectories ( true )
. setModal ( true )
. setType ( 1 ) // CHOOSE
. setMultiSelect ( false )
. build ( ) ,
2020-04-17 11:22:00 +00:00
}
} ,
2020-03-28 17:15:59 +00:00
computed : {
oc _defaults ( ) {
return window . oc _defaults
} ,
bookmarklet ( ) {
const bookmarkletUrl
2024-01-31 17:51:59 +00:00
= window . location . origin + generateUrl ( '/apps/bookmarks/bookmarklet' )
2023-08-17 09:43:00 +00:00
let queryStringExtension = ''
if ( this . $route . name === privateRoutes . FOLDER ) {
queryStringExtension = ` +'&folderId= ${ this . $route . params . folder } ' `
}
return ` javascript:(function(){var a=window,b=document,c=encodeURIComponent,e=c(document.title),d=a.open(' ${ bookmarkletUrl } ?url='+c(b.location)+'&title='+e ${ queryStringExtension } ,'bkmk_popup','left='+((a.screenX||a.screenLeft)+10)+',top='+((a.screenY||a.screenTop)+10)+',height=650px,width=550px,resizable=1,alwaysRaised=1');a.setTimeout(function(){d.focus()},300);})(); `
2019-08-20 12:45:43 +00:00
} ,
2024-01-28 11:55:09 +00:00
scrapingEnabled ( ) {
return Boolean ( this . $store . state . settings [ 'privacy.enableScraping' ] )
} ,
archiveEnabled ( ) {
return Boolean ( this . $store . state . settings [ 'archive.enabled' ] )
} ,
2020-08-21 15:18:30 +00:00
archivePath ( ) {
2024-01-28 11:25:40 +00:00
return this . $store . state . settings [ 'archive.filePath' ]
2020-08-21 15:18:30 +00:00
} ,
2022-03-11 12:38:54 +00:00
backupPath ( ) {
2024-01-28 11:25:40 +00:00
return this . $store . state . settings [ 'backup.filePath' ]
2022-03-11 12:38:54 +00:00
} ,
2022-04-12 11:27:47 +00:00
backupEnabled ( ) {
2024-01-28 11:25:40 +00:00
return Boolean ( this . $store . state . settings [ 'backup.enabled' ] )
2022-04-12 11:27:47 +00:00
} ,
2019-08-20 12:45:43 +00:00
} ,
2020-09-25 10:13:42 +00:00
mounted ( ) {
window . addEventListener ( 'beforeinstallprompt' , ( e ) => {
2024-01-31 17:51:59 +00:00
// Prevent Chrome 67 and earlier from automatically showing the prompt
2020-09-25 10:13:42 +00:00
e . preventDefault ( )
// Stash the event so it can be triggered later.
this . addToHomeScreen = e
this . showAddToHomeScreen = true
} )
} ,
2019-08-20 12:45:43 +00:00
methods : {
onImportOpen ( e ) {
2019-09-24 15:18:29 +00:00
e . target . previousElementSibling . click ( )
2019-08-20 12:45:43 +00:00
} ,
2020-04-17 11:22:00 +00:00
async onImportSubmit ( e ) {
this . importing = true
try {
2020-08-27 16:24:55 +00:00
await this . $store . dispatch ( actions . IMPORT _BOOKMARKS , { file : e . target . files [ 0 ] , folder : this . $route . params . folder || - 1 } )
2020-05-20 12:51:39 +00:00
} catch ( e ) {
console . warn ( e )
2020-04-17 11:22:00 +00:00
}
2020-05-20 12:51:39 +00:00
this . importing = false
2019-08-20 12:45:43 +00:00
} ,
onExport ( ) {
2019-08-26 12:29:07 +00:00
window . location
2024-01-31 17:51:59 +00:00
= 'bookmark/export?requesttoken='
+ encodeURIComponent ( getRequestToken ( ) )
2019-08-20 12:45:43 +00:00
} ,
2024-01-28 11:55:09 +00:00
async onChangeArchiveEnabled ( e ) {
await this . $store . dispatch ( actions . SET _SETTING , {
key : 'archive.enabled' ,
value : ! this . archiveEnabled ,
} )
} ,
2020-08-21 15:18:30 +00:00
async onChangeArchivePath ( e ) {
2022-03-11 12:38:54 +00:00
const path = await this . archivePathPicker . pick ( )
2020-08-21 15:18:30 +00:00
await this . $store . dispatch ( actions . SET _SETTING , {
2024-01-28 11:25:40 +00:00
key : 'archive.filePath' ,
2020-09-29 11:29:33 +00:00
value : path ,
2020-08-21 15:18:30 +00:00
} )
} ,
2022-03-11 12:38:54 +00:00
async onChangeBackupPath ( e ) {
2022-04-12 11:27:47 +00:00
if ( ! this . backupEnabled ) {
return
}
2022-03-11 12:38:54 +00:00
const path = await this . backupPathPicker . pick ( )
await this . $store . dispatch ( actions . SET _SETTING , {
2024-01-28 11:25:40 +00:00
key : 'backup.filePath' ,
2022-03-11 12:38:54 +00:00
value : path ,
} )
} ,
2022-04-12 11:27:47 +00:00
async onChangeBackupEnabled ( e ) {
await this . $store . dispatch ( actions . SET _SETTING , {
2024-01-28 11:25:40 +00:00
key : 'backup.enabled' ,
2022-04-12 11:27:47 +00:00
value : ! this . backupEnabled ,
} )
} ,
2020-09-25 10:13:42 +00:00
clickAddToHomeScreen ( ) {
2020-09-25 10:30:11 +00:00
if ( ! this . addToHomeScreen ) {
alert ( this . t ( 'bookmarks' , 'Please select "Add to home screen" in your browser menu' ) )
return
}
2020-09-25 10:13:42 +00:00
// Show the prompt
this . addToHomeScreen . prompt ( )
// Wait for the user to respond to the prompt
this . addToHomeScreen . userChoice . then ( ( choiceResult ) => {
if ( choiceResult . outcome === 'accepted' ) {
console . warn ( 'User accepted the A2HS prompt' )
} else {
console . warn ( 'User dismissed the A2HS prompt' )
}
this . addToHomeScreen = null
} )
} ,
2019-12-10 21:33:54 +00:00
} ,
2019-09-24 15:18:29 +00:00
}
2019-08-20 12:45:43 +00:00
< / script >
< style >
2024-01-31 17:51:59 +00:00
. import {
2024-02-02 17:45:39 +00:00
opacity : 0 ;
position : absolute ;
top : 0 ;
left : - 1000 px ;
2024-01-31 17:51:59 +00:00
}
2019-08-20 12:45:43 +00:00
< / style >