provide settings prior to js rendering

This commit is contained in:
Nazar Kanaev 2021-03-31 14:48:39 +01:00
parent e7b645a68a
commit c74eeff790
3 changed files with 24 additions and 29 deletions

View File

@ -7,6 +7,11 @@
<link rel="stylesheet" href="./static/stylesheets/app.css"> <link rel="stylesheet" href="./static/stylesheets/app.css">
<link rel="icon shortcut" href="./static/graphicarts/anchor.png"> <link rel="icon shortcut" href="./static/graphicarts/anchor.png">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<script>
window.app = window.app || {}
window.app.settings = {% .settings %}
window.app.authenticated = {% .authenticated %}
</script>
</head> </head>
<body class="theme-light"> <body class="theme-light">
<div id="app" class="d-flex" :class="{'feed-selected': feedSelected !== null, 'item-selected': itemSelected !== null}" v-cloak> <div id="app" class="d-flex" :class="{'feed-selected': feedSelected !== null, 'item-selected': itemSelected !== null}" v-cloak>

View File

@ -2,11 +2,6 @@
var TITLE = document.title var TITLE = document.title
function authenticated() {
return /auth=.+/g.test(document.cookie)
}
var FONTS = [ var FONTS = [
"Arial", "Arial",
"Courier New", "Courier New",
@ -192,17 +187,21 @@ Vue.component('relative-time', {
}) })
var vm = new Vue({ var vm = new Vue({
mounted: function() {
this.refreshItems()
},
created: function() { created: function() {
this.refreshFeeds() this.refreshFeeds()
this.refreshStats() this.refreshStats()
}, },
data: function() { data: function() {
var s = app.settings
return { return {
'filterSelected': undefined, 'filterSelected': s.filter,
'folders': [], 'folders': [],
'feeds': [], 'feeds': [],
'feedSelected': undefined, 'feedSelected': s.feed,
'feedListWidth': undefined, 'feedListWidth': s.feed_list_width || 300,
'feedNewChoice': [], 'feedNewChoice': [],
'feedNewChoiceSelected': '', 'feedNewChoiceSelected': '',
'items': [], 'items': [],
@ -214,8 +213,8 @@ var vm = new Vue({
'itemSelectedDetails': null, 'itemSelectedDetails': null,
'itemSelectedReadability': '', 'itemSelectedReadability': '',
'itemSearch': '', 'itemSearch': '',
'itemSortNewestFirst': undefined, 'itemSortNewestFirst': s.sort_newest_first,
'itemListWidth': undefined, 'itemListWidth': s.item_list_width || 300,
'filteredFeedStats': {}, 'filteredFeedStats': {},
'filteredFolderStats': {}, 'filteredFolderStats': {},
@ -231,12 +230,12 @@ var vm = new Vue({
'fonts': FONTS, 'fonts': FONTS,
'feedStats': {}, 'feedStats': {},
'theme': { 'theme': {
'name': 'light', 'name': s.theme_name,
'font': '', 'font': s.theme_font,
'size': 1, 'size': s.theme_size,
}, },
'refreshRate': undefined, 'refreshRate': s.refresh_rate,
'authenticated': authenticated(), 'authenticated': app.authenticated,
'feed_errors': {}, 'feed_errors': {},
} }
}, },
@ -657,16 +656,4 @@ var vm = new Vue({
} }
}) })
api.settings.get().then(function(data) { vm.$mount('#app')
vm.feedSelected = data.feed
vm.filterSelected = data.filter
vm.itemSortNewestFirst = data.sort_newest_first
vm.feedListWidth = data.feed_list_width || 300
vm.itemListWidth = data.item_list_width || 300
vm.theme.name = data.theme_name
vm.theme.font = data.theme_font
vm.theme.size = data.theme_size
vm.refreshRate = data.refresh_rate
vm.refreshItems()
vm.$mount('#app')
})

View File

@ -52,7 +52,10 @@ func (s *Server) handler() http.Handler {
} }
func (s *Server) handleIndex(c *router.Context) { func (s *Server) handleIndex(c *router.Context) {
c.HTML(http.StatusOK, assets.Template("index.html"), nil) c.HTML(http.StatusOK, assets.Template("index.html"), map[string]interface{} {
"settings": s.db.GetSettings(),
"authenticated": s.Username != "" && s.Password != "",
})
} }
func (s *Server) handleStatic(c *router.Context) { func (s *Server) handleStatic(c *router.Context) {