settings page and custom css for users

src/main/webapp/directives/toolbar.html

@@ -12,7 +12,7 @@
 			<div class="btn-group">
 				<a class="btn dropdown-toggle" data-toggle="dropdown" href="settings"><i class="icon-cog"></i> {{session.name}} <span class="caret"></span></a>
 				<ul class="dropdown-menu pull-right">
-					<li><a href="settings"><i class="icon-wrench"></i> Settings</a></li>
+					<li><a ng-click="toSettings()"><i class="icon-wrench"></i> Settings</a></li>
 					<li ng-show="session.admin"><a ng-click="toAdmin()"><i class="icon-edit"></i> Admin</a></li>
 					<li class="divider"></li>
 					<li><a href="logout"><i class="icon-user"></i> Logout</a></li>

src/main/webapp/js/controllers.js

@@ -342,4 +342,22 @@ module.controller('ManageUserCtrl', function($scope, $state, $stateParams,
 			}
 		});
 	};
+});
+
+module.controller('SettingsCtrl', function($scope, $location, SettingsService) {
+	$scope.settingsService = SettingsService;
+	$scope.codeMirrorConfig = {
+		mode : 'css',
+		lineNumbers : true
+	};
+	$scope.cancel = function() {
+		SettingsService.init(function() {
+			$location.path('/');
+		});
+	};
+	$scope.save = function() {
+		SettingsService.save(function() {
+			$location.path('/');
+		});
+	};
 });

src/main/webapp/js/directives.js

@@ -232,6 +232,9 @@ module.directive('toolbar', function($state, $stateParams, $route, $location,
 			$scope.toAdmin = function() {
 				$location.path('admin');
 			};
+			$scope.toSettings = function() {
+				$location.path('settings');
+			};
 		},
 		link : function($scope, element) {
 			element.find('.read-mode button').bind('click', function() {

src/main/webapp/js/main.js

@@ -39,6 +39,12 @@ app.config(function($routeProvider, $stateProvider, $urlRouterProvider) {
 		templateUrl : 'templates/admin.useredit.html',
 		controller : 'ManageUserCtrl'
 	});
+	
+	$stateProvider.state('settings', {
+		url : '/settings',
+		templateUrl : 'templates/settings.html',
+		controller : 'SettingsCtrl'
+	});
 
 	$urlRouterProvider.when('/', '/feeds/view/category/all');
 	$urlRouterProvider.when('/admin', '/admin/user/list');

src/main/webapp/js/services.js

@@ -162,12 +162,22 @@ module.factory('EntryService', function($resource, $http) {
 module.factory('SettingsService', function($resource) {
 	var s = {};
 	s.settings = {};
-	$resource('rest/settings/get').get(function(data) {
-		s.settings = data;
-	});
-	s.save = function() {
-		$resource('rest/settings/save').save(s.settings);
+	s.save = function(callback) {
+		$resource('rest/settings/save').save(s.settings, function(data) {
+			if (callback) {
+				callback(data);
+			}
+		});
 	};
+	s.init = function(callback) {
+		$resource('rest/settings/get').get(function(data) {
+			s.settings = data;
+			if (callback) {
+				callback(data);
+			}
+		});
+	};
+	s.init();
 	return s;
 });
 

src/main/webapp/templates/settings.html

@@ -0,0 +1,28 @@
+<div class="container settings">
+	<div class="page-header">
+		<h1>Settings</h1>
+	</div>
+	<div class="row">
+		<div class="span2">
+			<ul class="nav nav-pills nav-stacked">
+				<li class="active"><a href="#general" data-toggle="pill">General</a></li>
+				<li><a href="#custom-css" data-toggle="pill" ng-click="refreshCodemirror=!refreshCodemirror">Custom CSS</a></li>
+			</ul>
+		</div>
+		<div class="span10">
+			<div class="tab-content">
+				<div class="tab-pane active" id="general" style="height: 500px">
+					Placeholder for general settings
+				</div>
+				<div class="tab-pane" id="custom-css">
+					<textarea ui-codemirror="codeMirrorConfig" ng-model="settingsService.settings.customCss" ui-refresh="refreshCodemirror">
+					</textarea>
+				</div>
+			</div>
+		</div>
+	</div>
+	<div class="form-actions">
+		<button type="button" class="btn btn-primary" ng-click="save()">Save</button>
+		<button type="button" class="btn" ng-click="cancel()">Cancel</button>
+	</div>
+</div>