closes #1182

public/src/forum/admin/themes.js

@@ -1,43 +1,53 @@
 define(['forum/admin/settings'], function(Settings) {
 	var Themes = {};
 
+	function highlightSelectedTheme(themeId) {
+		$('#themes li[data-theme]').removeClass('btn-warning');
+		$('#themes li[data-theme="' + themeId + '"]').addClass('btn-warning');
+	}
+
 	Themes.init = function() {
 		var scriptEl = $('<script />');
 		scriptEl.attr('src', 'http://api.bootswatch.com/3/?callback=bootswatchListener');
 		$('body').append(scriptEl);
 
 		var bootstrapThemeContainer = $('#bootstrap_themes'),
-			installedThemeContainer = $('#installed_themes'),
+			installedThemeContainer = $('#installed_themes');
-
+
-			themeEvent = function(e) {
+		function themeEvent(e) {
-				var target = $(e.target),
+			var target = $(e.target),
-					action = target.attr('data-action');
+				action = target.attr('data-action');
-
+
-				if (action) {
+			if (action) {
-					switch (action) {
+				switch (action) {
-						case 'use':
+					case 'use':
-							var parentEl = target.parents('li'),
+						var parentEl = target.parents('li'),
-								themeType = parentEl.attr('data-type'),
+							themeType = parentEl.attr('data-type'),
-								cssSrc = parentEl.attr('data-css'),
+							cssSrc = parentEl.attr('data-css'),
-								themeId = parentEl.attr('data-theme');
+							themeId = parentEl.attr('data-theme');
-
+
-							socket.emit('admin.themes.set', {
+						socket.emit('admin.themes.set', {
-								type: themeType,
+							type: themeType,
-								id: themeId,
+							id: themeId,
-								src: cssSrc
+							src: cssSrc
-							}, function(err) {
+						}, function(err) {
-								app.alert({
+							if (err) {
-									alert_id: 'admin:theme',
+								return app.alertError(err.message);
-									type: 'success',
+							}
-									title: 'Theme Changed',
+							highlightSelectedTheme(themeId);
-									message: 'Restarting your NodeBB <i class="fa fa-refresh fa-spin"></i>',
+
-									timeout: 3500
+							app.alert({
-								});
+								alert_id: 'admin:theme',
+								type: 'success',
+								title: 'Theme Changed',
+								message: 'Restarting your NodeBB <i class="fa fa-refresh fa-spin"></i>',
+								timeout: 3500
 							});
-							break;
+						});
-					}
+						break;
 				}
-			};
+			}
+		}
 
 		bootstrapThemeContainer.on('click', themeEvent);
 		installedThemeContainer.on('click', themeEvent);
@@ -49,6 +59,10 @@ define(['forum/admin/settings'], function(Settings) {
 						type: 'local',
 						id: 'nodebb-theme-cerulean'
 					}, function(err) {
+						if (err) {
+							return app.alertError(err.message);
+						}
+						highlightSelectedTheme('nodebb-theme-cerulean');
 						app.alert({
 							alert_id: 'admin:theme',
 							type: 'success',
@@ -59,7 +73,7 @@ define(['forum/admin/settings'], function(Settings) {
 					});
 				}
 			});
-		}, false);
+		});
 
 		// Installed Themes
 		socket.emit('admin.themes.getInstalled', function(err, themes) {
@@ -69,30 +83,32 @@ define(['forum/admin/settings'], function(Settings) {
 
 			var instListEl = $('#installed_themes').empty(), liEl;
 
-			if (themes.length > 0) {
+			if (!themes.length) {
-				for (var x = 0, numThemes = themes.length; x < numThemes; x++) {
-					liEl = $('<li/ >').attr({
-						'data-type': 'local',
-						'data-theme': themes[x].id
-					}).html('<img src="' + (themes[x].screenshot ? '/css/previews/' + themes[x].id : RELATIVE_PATH + '/images/themes/default.png') + '" />' +
-							'<div>' +
-							'<div class="pull-right">' +
-							'<button class="btn btn-primary" data-action="use">Use</button> ' +
-							'</div>' +
-							'<h4>' + themes[x].name + '</h4>' +
-							'<p>' +
-							themes[x].description +
-							(themes[x].url ? ' (<a href="' + themes[x].url + '">Homepage</a>)' : '') +
-							'</p>' +
-							'</div>' +
-							'<div class="clear">');
-
-					instListEl.append(liEl);
-				}
-			} else {
-				// No themes found
 				instListEl.append($('<li/ >').addClass('no-themes').html('No installed themes found'));
+				return;
 			}
+
+			for (var x = 0, numThemes = themes.length; x < numThemes; x++) {
+				liEl = $('<li/ >').attr({
+					'data-type': 'local',
+					'data-theme': themes[x].id
+				}).html('<img src="' + (themes[x].screenshot ? '/css/previews/' + themes[x].id : RELATIVE_PATH + '/images/themes/default.png') + '" />' +
+						'<div>' +
+						'<div class="pull-right">' +
+						'<button class="btn btn-primary" data-action="use">Use</button> ' +
+						'</div>' +
+						'<h4>' + themes[x].name + '</h4>' +
+						'<p>' +
+						themes[x].description +
+						(themes[x].url ? ' (<a href="' + themes[x].url + '">Homepage</a>)' : '') +
+						'</p>' +
+						'</div>' +
+						'<div class="clear">');
+
+				instListEl.append(liEl);
+			}
+
+			highlightSelectedTheme(config['theme:id']);
 		});
 
 		// Proper tabbing for "Custom CSS" field

public/templates/admin/themes.tpl

@@ -10,6 +10,11 @@
 
 	<div class="tab-content">
 		<div class="tab-pane active" id="themes">
+			<h3>Revert to Default</h3>
+			<p class="alert">
+				<button class="btn btn-warning" id="revert_theme">Revert</button> This will remove any custom theme applied to your NodeBB, and restore the base theme.
+			</p>
+
 			<h3>Installed Themes</h3>
 			<p>
 				The following themes are currently installed in this NodeBB instance.
@@ -27,10 +32,6 @@
 				<li><i class="fa fa-refresh fa-spin"></i> Loading Themes</li>
 			</ul>
 
-			<h3>Revert to Default</h3>
-			<p class="alert">
-				<button class="btn btn-warning" id="revert_theme">Revert</button> This will remove any custom theme applied to your NodeBB, and restore the base theme.
-			</p>
 		</div>
 		<div class="tab-pane" id="customise">
 			<h3>Custom CSS</h3>

src/meta.js

@@ -125,12 +125,12 @@ var fs = require('fs'),
 		},
 		set: function(data, callback) {
 			var	themeData = {
-					'theme:type': data.type,
+				'theme:type': data.type,
-					'theme:id': data.id,
+				'theme:id': data.id,
-					'theme:staticDir': '',
+				'theme:staticDir': '',
-					'theme:templates': '',
+				'theme:templates': '',
-					'theme:src': ''
+				'theme:src': ''
-				};
+			};
 
 			switch(data.type) {
 				case 'local':
@@ -152,9 +152,7 @@ var fs = require('fs'),
 
 							db.setObject('config', themeData, next);
 						}
-					], function(err) {
+					], callback);
-						callback(err);
-					});
 				break;
 
 				case 'bootswatch':

src/routes/api.js

@@ -66,6 +66,7 @@ var path = require('path'),
 				config.topicsPerPage = meta.config.topicsPerPage || 20;
 				config.postsPerPage = meta.config.postsPerPage || 20;
 				config.maximumFileSize = meta.config.maximumFileSize;
+				config['theme:id'] = meta.config['theme:id'];
 				config.defaultLang = meta.config.defaultLang || 'en_GB';
 				config.environment = process.env.NODE_ENV;