updating account settings templates + client side to allow for dynamic parsing of user settings

public/src/forum/accountsettings.js

@@ -5,13 +5,21 @@ define(['forum/accountheader'], function(header) {
 		header.init();
 
 		$('#submitBtn').on('click', function() {
+			var settings = {};
 
-			var settings = {
-				showemail: $('#showemailCheckBox').is(':checked') ? 1 : 0,
-				usePagination: $('#usePaginationCheckBox').is(':checked') ? 1 : 0,
-				topicsPerPage: $('#topicsPerPage').val(),
-				postsPerPage: $('#postsPerPage').val()
-			};
+			$('.account input, .account textarea').each(function(id, input) {
+				input = $(input);
+
+				switch (input.attr('type')) {
+					case 'text' :
+					case 'textarea' :
+						settings[input.attr('data-property')] = input.val();
+						break;
+					case 'checkbox' :
+						settings[input.attr('data-property')] = input.is(':checked') ? 1 : 0;
+						break;
+				}
+			});
 
 			socket.emit('user.saveSettings', settings, function(err) {
 				if (err) {
@@ -19,8 +27,28 @@ define(['forum/accountheader'], function(header) {
 				}
 				app.alertSuccess('Settings saved!');
 			});
+
 			return false;
 		});
+		
+		socket.emit('user.getSettings', function(err, settings) {
+			console.log(settings);
+			for (var setting in settings) {
+				if (settings.hasOwnProperty(setting)) {
+					var input = $('.account input[data-property="' + setting + '"]');
+
+					switch (input.attr('type')) {
+						case 'text' :
+						case 'textarea' :
+							input.val(settings[setting]);
+							break;
+						case 'checkbox' :
+							input.prop('checked', !!settings[setting]);
+							break;
+					}
+				}
+			}
+		});
 	};
 
 	return AccountSettings;

public/templates/accountsettings.tpl

@@ -5,7 +5,7 @@
 			<div class="well">
 				<div class="checkbox">
 					<label>
-						<input id="showemailCheckBox" type="checkbox" <!-- IF settings.showemail -->checked<!-- ENDIF settings.showemail --> > <strong>[[user:show_email]]</strong>
+						<input type="checkbox" data-property="showemail" /> <strong>[[user:show_email]]</strong>
 					</label>
 				</div>
 			</div>
@@ -13,13 +13,20 @@
 			<div class="well">
 				<div class="checkbox">
 					<label>
-						<input id="usePaginationCheckBox" type="checkbox" <!-- IF settings.usePagination -->checked<!-- ENDIF settings.usePagination -->> <strong>[[user:paginate_description]]</strong>
+						<input type="checkbox" data-property="usePagination"> <strong>[[user:paginate_description]]</strong>
 					</label>
 				</div>
 
-				<strong>[[user:topics_per_page]]</strong><br /> <input id="topicsPerPage" type="text" class="form-control" value="{settings.topicsPerPage}"><br />
-				<strong>[[user:posts_per_page]]</strong><br /> <input id="postsPerPage" type="text" class="form-control" value="{settings.postsPerPage}"><br />
+				<strong>[[user:topics_per_page]]</strong><br /> <input type="text" class="form-control" data-property="topicsPerPage"><br />
+				<strong>[[user:posts_per_page]]</strong><br /> <input type="text" class="form-control" data-property="postsPerPage"><br />
 			</div>
+
+			<!-- BEGIN settings -->
+			<h4>{settings.title}</h4>
+			<div class="well">
+				{settings.content}
+			</div>
+			<!-- END settings -->
 		</div>
 	</div>