From 15dc5f90edb96b46467860c5214c2670722acc1d Mon Sep 17 00:00:00 2001
From: Jack Allnutt <jack@allnutt.eu>
Date: Mon, 28 Oct 2013 12:14:35 +0000
Subject: [PATCH] Load themes as soon as possible to avoid FoUC

Also move theme configuration slightly to avoid sever-side caching bug
---
 client/assets/src/app.js               |  8 --------
 client/assets/src/index.html.tmpl      | 12 ++++++++++++
 client/assets/src/views/application.js |  7 +++----
 config.example.js                      | 16 +++++++++-------
 server/httphandler.js                  | 11 ++++++-----
 5 files changed, 30 insertions(+), 24 deletions(-)

diff --git a/client/assets/src/app.js b/client/assets/src/app.js
index 6320c5f..f63db1f 100644
--- a/client/assets/src/app.js
+++ b/client/assets/src/app.js
@@ -114,14 +114,6 @@ _kiwi.global = {
         _kiwi.global.settings = _kiwi.model.DataStore.instance('kiwi.settings');
         _kiwi.global.settings.load();
 
-        if (opts.server_settings.client.themes) {
-            _.each(opts.server_settings.client.themes, function (theme) {
-                var link = $.parseHTML('<link rel="alternate stylesheet" type="text/css" data-theme href="'+ opts.base_path + '/assets/themes/' + theme.name.toLowerCase() + '/style.css" title="' + theme.name.toLowerCase() + '" disabled/>');
-                link.disabled = true;
-                $(link).appendTo($('head'));
-            });
-        }
-
         continueStart = function (locale, s, xhr) {
             if (locale) {
                 _kiwi.global.i18n = new Jed({locale_data: locale, domain: xhr.getResponseHeader('Content-Language')});
diff --git a/client/assets/src/index.html.tmpl b/client/assets/src/index.html.tmpl
index ba206e4..0ef0131 100644
--- a/client/assets/src/index.html.tmpl
+++ b/client/assets/src/index.html.tmpl
@@ -409,10 +409,22 @@
             opts.client_plugins = data.client_plugins;
             opts.translations = data.translations;
             opts.locale = data.locale;
+            opts.themes = data.themes;
 
             if (typeof data.kiwi_server !== 'undefined')
                 opts.kiwi_server = data.kiwi_server;
 
+            // Load themes
+            if (opts.themes) {
+                opts.themes.forEach(function (theme) {
+                    var disabled = (opts.server_settings.client.settings.theme !== theme),
+                        rel = (disabled?'alternate ':'') + 'stylesheet' /*+ (disabled?' prefetch':'')*/;
+                    var link = $.parseHTML('<link rel="' + rel + '" type="text/css" data-theme href="'+ opts.base_path + '/assets/themes/' + theme.name.toLowerCase() + '/style.css" title="' + theme.name.toLowerCase() + '"' + (disabled?'disabled':'') + '/>');
+                    link.disabled = disabled;
+                    $(link).appendTo($('head'));
+                });
+            }
+
             // Start loading scripts
             loadNextScript();
         });
diff --git a/client/assets/src/views/application.js b/client/assets/src/views/application.js
index 52bbc29..b7a1f80 100644
--- a/client/assets/src/views/application.js
+++ b/client/assets/src/views/application.js
@@ -56,16 +56,15 @@ _kiwi.view.Application = Backbone.View.extend({
         theme_name = theme_name.toLowerCase();
 
         // Clear any current theme
-        $('[data-theme][rel="stylesheet"]').each(function (idx, link) {
+        $('[data-theme]:not([disabled])').each(function (idx, link) {
             var $link = $(link);
-            $link.attr('rel', 'alternate ' + $link.attr('rel'))[0].disabled = true;
+            $link.attr('rel', 'alternate ' + $link.attr('rel')).attr('disabled', true)[0].disabled = true;
         });
 
         // Apply the new theme
-        //this.$el.addClass('theme_' + (theme_name || 'relaxed'));
         var link = $('[data-theme][title=' + theme_name + ']');
         if (link.length > 0) {
-            link.attr('rel', 'stylesheet')[0].disabled = false;
+            link.attr('rel', 'stylesheet').attr('disabled', false)[0].disabled = false;
         }
     },
 
diff --git a/config.example.js b/config.example.js
index 8fb2bb2..3d80508 100644
--- a/config.example.js
+++ b/config.example.js
@@ -182,15 +182,17 @@ conf.client = {
         show_timestamps: false,
         mute_sounds: false,
         show_emoticons: true
-    },
-    themes: [
-        'relaxed',
-        'mini',
-        'cli',
-        'basic'
-    ]
+    }
 };
 
+// List of themes available for the user to choose from
+conf.client_themes = [
+    'relaxed',
+    'mini',
+    'cli',
+    'basic'
+];
+
 
 // If set, the client may only connect to this 1 IRC server
 //conf.restrict_server = "irc.kiwiirc.com";
diff --git a/server/httphandler.js b/server/httphandler.js
index 22c27de..f62f6b2 100644
--- a/server/httphandler.js
+++ b/server/httphandler.js
@@ -169,6 +169,7 @@ function serveSettings(request, response) {
             if (err) {
                 response.statusCode = 500;
                 response.end();
+                console.log(err);
             } else {
                 sendSettings.call(this, request, response, settings);
             }
@@ -309,12 +310,12 @@ function generateSettings(request, debug, callback) {
     }
 
     // Read theme information
-    readThemeInfo(vars.server_settings.client.themes, function (err, themes) {
+    readThemeInfo(config.get().client_themes, function (err, themes) {
         if (err) {
             return callback(err);
         }
         
-        vars.server_settings.client.themes = themes;
+        vars.themes = themes;
 
         // Get a list of available translations
         fs.readFile(__dirname + '/../client/assets/src/translations/translations.json', function (err, translations) {
@@ -348,7 +349,7 @@ function generateSettings(request, debug, callback) {
 
 function readThemeInfo(themes, prev, callback) {
     "use strict";
-    var theme = themes.shift();
+    var theme = themes[0];
 
     if (typeof prev === 'function') {
         callback = prev;
@@ -368,8 +369,8 @@ function readThemeInfo(themes, prev, callback) {
 
         prev.push(theme_json);
 
-        if (themes.length > 0) {
-            return readThemeInfo(themes, prev, callback);
+        if (themes.length > 1) {
+            return readThemeInfo(themes.slice(1), prev, callback);
         }
 
         callback(null, prev);
-- 
2.25.1