2019-08-20 12:45:43 +00:00
< template >
2019-08-26 12:57:02 +00:00
< div class = "settings" >
2019-08-26 12:29:07 +00:00
< input type = "file" class = "import" size = "5"
@ change = "onImportSubmit"
>
< button @click ="onImportOpen" >
< span class = "icon-upload" / > { { t ( 'bookmarks' , 'Import' ) } }
< / button >
< button @click ="onExport" >
< span class = "icon-download" / > { { t ( 'bookmarks' , 'Export' ) } }
< / button >
2019-08-20 12:45:43 +00:00
2019-08-28 12:49:51 +00:00
< label > { { t ( 'bookmarks' , 'Sorting' ) } }
< select :value ="sorting" @change ="onChangeSorting" >
< option id = "added" value = "added" >
{ {
t ( 'bookmarks' , 'Recently added' )
} }
< / option >
< option id = "title" value = "title" >
{ {
t ( 'bookmarks' , 'Alphabetically' )
} }
< / option >
< option id = "clickcount" value = "clickcount" >
{ {
t ( 'bookmarks' , 'Most visited' )
} }
< / option >
< option id = "lastmodified" value = "lastmodified" >
{ {
t ( 'bookmarks' , 'Last modified' )
} }
< / option >
< / select > < / label >
2019-08-20 12:45:43 +00:00
2019-08-28 12:49:51 +00:00
< label > { { t ( 'bookmarks' , 'View mode' ) } }
< select :value ="viewMode" @change ="onChangeViewMode" >
< option id = "grid" value = "grid" >
{ { t ( 'bookmarks' , 'Grid view' ) } }
< / option >
< option id = "list" value = "list" >
{ { t ( 'bookmarks' , 'List view' ) } }
< / option >
< / select > < / label >
2019-08-20 12:45:43 +00:00
2019-08-28 12:49:51 +00:00
< label > { { t ( 'bookmarks' , 'RSS Feed' ) } }
< input v -tooltip = " t ( ' bookmarks ' , ' This is an RSS feed of the current result set with access restricted to you. ' ) " type = "text" readonly
: value = "rssURL" @ click = "onRssClick"
> < / label >
< label > { { t ( 'bookmarks' , 'Clear data' ) } }
< button v-tooltip ="t('bookmarks', 'Permanently remove all bookmarks from your account. There is no going back!')" class="clear-data" @click="onClearData" >
< span class = "icon-delete" / >
{ { t ( 'bookmarks' , 'Delete all bookmarks' ) } }
< / button >
< / label >
< label > { { t ( 'bookmarks' , 'Bookmarklet' ) } }
< a v -tooltip = " t ( ' bookmarks ' , ' Drag this to your browser bookmarks and click it to quickly bookmark a webpage ' ) " class = "button" :href ="bookmarklet"
@ click . prevent = "void 0"
> { {
2019-08-29 09:22:40 +00:00
t ( 'bookmarks' , 'Add to {instanceName}' , {
2019-08-28 12:49:51 +00:00
instanceName : oc _defaults . name
} )
} } < / a >
< / label >
2019-08-20 12:45:43 +00:00
2019-08-26 12:29:07 +00:00
< p >
2019-08-28 12:49:51 +00:00
{ { 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" > { { t ( 'bookmarks' , 'Client apps' ) } } < / a >
2019-08-26 12:29:07 +00:00
< / p >
< / div >
2019-08-20 12:45:43 +00:00
< / template >
< script >
2019-08-26 14:42:55 +00:00
import { generateUrl } from 'nextcloud-router' ;
2019-08-29 09:05:29 +00:00
import { actions } from '../store/' ;
2019-08-20 12:45:43 +00:00
export default {
name : 'Settings' ,
components : { } ,
computed : {
oc _defaults ( ) {
return window . oc _defaults ;
} ,
bookmarklet ( ) {
2019-08-26 12:29:07 +00:00
const bookmarkletUrl
2019-08-28 11:46:37 +00:00
= window . location . origin + generateUrl ( '/apps/bookmarks#/bookmarklet' ) ;
return ` javascript:(function(){var a=window,b=document,c=encodeURIComponent,e=c(document.title),d=a.open(' ${ bookmarkletUrl } /'+c(b.location)+'/'+e,'bkmk_popup','left='+((a.screenX||a.screenLeft)+10)+',top='+((a.screenY||a.screenTop)+10)+',height=500px,width=550px,resizable=1,alwaysRaised=1');a.setTimeout(function(){d.focus()},300);})(); ` ;
2019-08-20 12:45:43 +00:00
} ,
rssURL ( ) {
2019-08-25 10:54:53 +00:00
return (
2019-08-26 12:29:07 +00:00
window . location . origin
2019-08-26 14:38:25 +00:00
+ generateUrl (
2019-08-26 12:29:07 +00:00
'/apps/bookmarks/public/rest/v2/bookmark?'
+ $ . param (
2019-08-25 10:54:53 +00:00
Object . assign ( { } , this . $store . state . fetchState . query , {
format : 'rss' ,
page : - 1
} )
)
)
2019-08-20 12:45:43 +00:00
) ;
} ,
viewMode ( ) {
return this . $store . state . settings . viewMode ;
} ,
sorting ( ) {
return this . $store . state . settings . sorting ;
}
} ,
methods : {
onImportOpen ( e ) {
e . target . previousElementSibling . click ( ) ;
} ,
onImportSubmit ( e ) {
this . $store . dispatch ( actions . IMPORT _BOOKMARKS , e . target . files [ 0 ] ) ;
} ,
onExport ( ) {
2019-08-26 12:29:07 +00:00
window . location
= 'bookmark/export?requesttoken='
+ encodeURIComponent ( window . oc _requesttoken ) ;
2019-08-20 12:45:43 +00:00
} ,
async onChangeSorting ( e ) {
await this . $store . dispatch ( actions . SET _SETTING , {
key : 'sorting' ,
value : e . target . value
} ) ;
this . $router . push ( { name : 'home' } ) ;
} ,
onChangeViewMode ( e ) {
this . $store . dispatch ( actions . SET _SETTING , {
key : 'viewMode' ,
value : e . target . value
} ) ;
} ,
onRssClick ( e ) {
setTimeout ( ( ) => {
e . target . select ( ) ;
} , 100 ) ;
} ,
async onClearData ( ) {
if (
! confirm (
t ( 'bookmarks' , 'Do you really want to delete all your bookmarks?' )
)
) {
return ;
}
await this . $store . dispatch ( actions . DELETE _BOOKMARKS ) ;
this . $router . push ( { name : 'home' } ) ;
}
}
} ;
< / script >
< style >
. import {
opacity : 0 ;
position : absolute ;
2019-08-26 22:38:02 +00:00
top : 0 ;
left : - 1000 px ;
2019-08-20 12:45:43 +00:00
}
2019-08-26 22:38:02 +00:00
2019-08-28 12:49:51 +00:00
. settings label ,
. settings input ,
. settings select ,
. settings label button ,
. settings label a . button {
display : block ;
}
. settings label {
margin - top : 10 px ;
}
2019-08-26 12:57:02 +00:00
. settings a : link : not ( . button ) {
2019-08-25 12:24:46 +00:00
text - decoration : underline ;
}
2019-08-20 12:45:43 +00:00
< / style >