Load layout preferences client-side from cookies

assets/javascripts/app/app.coffee

@@ -26,6 +26,8 @@
     @document = new app.views.Document
     @mobile = new app.views.Mobile if @isMobile()
 
+    @settings.initLayout()
+
     if document.body.hasAttribute('data-doc')
       @DOC = JSON.parse(document.body.getAttribute('data-doc'))
       @bootOne()

assets/javascripts/app/settings.coffee

@@ -19,6 +19,9 @@ class app.Settings
     'news'
   ]
 
+  LAYOUTS = ['_max-width', '_sidebar-hidden', '_native-scrollbars']
+  SIDEBAR_HIDDEN_LAYOUT = '_sidebar-hidden'
+
   @defaults:
     count: 0
     hideDisabled: false
@@ -38,6 +41,7 @@ class app.Settings
   set: (key, value) ->
     @store.set(key, value)
     delete @cache[key]
+    @toggleDark(value) if key == 'dark'
     return
 
   del: (key) ->
@@ -63,6 +67,8 @@ class app.Settings
     return
 
   setLayout: (name, enable) ->
+    @toggleLayout(name, enable)
+
     layout = (@store.get('layout') || '').split(' ')
     $.arrayDelete(layout, '')
 
@@ -81,6 +87,9 @@ class app.Settings
     layout = (@store.get('layout') || '').split(' ')
     layout.indexOf(name) isnt -1
 
+  getAllLayouts: ->
+    return LAYOUTS
+
   setSize: (value) ->
     @set 'size', value
     return
@@ -104,3 +113,16 @@ class app.Settings
     @store.reset()
     @cache = {}
     return
+
+  initLayout: ->
+    @toggleDark(@get('dark'))
+    @toggleLayout(layout, @hasLayout(layout)) for layout in LAYOUTS
+
+  toggleDark: (enable) ->
+    classList = document.documentElement.classList
+    classList[if enable then 'remove' else 'add']('_theme-default')
+    classList[if enable then 'add' else 'remove']('_theme-dark')
+
+  toggleLayout: (layout, enable) ->
+    document.body.classList[if enable then 'add' else 'remove'](layout) unless layout is SIDEBAR_HIDDEN_LAYOUT
+    document.body.classList[if $.overlayScrollbarsEnabled() then 'add' else 'remove']('_overlay-scrollbars')

assets/javascripts/views/content/settings_page.coffee

@@ -1,7 +1,4 @@
 class app.views.SettingsPage extends app.View
-  LAYOUTS = ['_max-width', '_sidebar-hidden', '_native-scrollbars']
-  SIDEBAR_HIDDEN_LAYOUT = '_sidebar-hidden'
-
   @className: '_static'
 
   @events:
@@ -17,23 +14,18 @@ class app.views.SettingsPage extends app.View
     settings.dark = app.settings.get('dark')
     settings.smoothScroll = !app.settings.get('fastScroll')
     settings.arrowScroll = app.settings.get('arrowScroll')
-    settings[layout] = app.settings.hasLayout(layout) for layout in LAYOUTS
+    settings[layout] = app.settings.hasLayout(layout) for layout in app.settings.getAllLayouts()
     settings
 
   getTitle: ->
     'Preferences'
 
   toggleDark: (enable) ->
-    html = document.documentElement
-    html.classList.toggle('_theme-default')
-    html.classList.toggle('_theme-dark')
     app.settings.set('dark', !!enable)
     app.appCache?.updateInBackground()
     return
 
   toggleLayout: (layout, enable) ->
-    document.body.classList[if enable then 'add' else 'remove'](layout) unless layout is SIDEBAR_HIDDEN_LAYOUT
-    document.body.classList[if $.overlayScrollbarsEnabled() then 'add' else 'remove']('_overlay-scrollbars')
     app.settings.setLayout(layout, enable)
     app.appCache?.updateInBackground()
     return