closes #288

install/data/categories.json

@@ -3,72 +3,84 @@
         "name": "Announcements",
         "description": "Announcements regarding our community",
         "blockclass": "category-blue",
-        "icon" : "icon-bullhorn"
+        "icon" : "icon-bullhorn",
+        "order": 1
     },
     {
         "name": "General Discussion",
         "description": "A place to talk about whateeeever you want",
         "blockclass": "category-blue",
-        "icon" : "icon-comment"
+        "icon" : "icon-comment",
+        "order": 2
     },
     {
         "name": "NodeBB Development",
         "description": "NodeBB development news and announcements",
         "blockclass": "category-blue",
-        "icon" : "icon-github"
+        "icon" : "icon-github",
+        "order": 3
     },
     {
         "name": "Blogs",
         "description": "Blog posts from individual members",
         "blockclass": "category-blue",
-        "icon" : "icon-pencil"
+        "icon" : "icon-pencil",
+        "order": 4
     },
     {
         "name": "Feature Requests",
         "description": "Got a feature request you'd like to see? Give us a shout here.",
         "blockclass": "category-purple",
-        "icon" : "icon-lightbulb"
+        "icon" : "icon-lightbulb",
+        "order": 5
     },
     {
         "name": "Bug Reports",
         "description": "Having trouble with NodeBB? Let us know...",
         "blockclass": "category-purple",
-        "icon" : "icon-cogs"
+        "icon" : "icon-cogs",
+        "order": 6
     },
     {
         "name": "NodeBB Plugins",
         "description": "Enhance your NodeBB with plugins!",
         "blockclass": "category-purple",
-        "icon" : "icon-plus-sign"
+        "icon" : "icon-plus-sign",
+        "order": 7
     },
     {
         "name": "NodeBB Link Exchange",
         "description": "Link exchange",
         "blockclass": "category-purple",
-        "icon" : "icon-exchange"
+        "icon" : "icon-exchange",
+        "order": 8
     },
     {
         "name": "News",
         "description": "News from around the world",
         "blockclass": "category-darkblue",
-        "icon" : "icon-globe"
+        "icon" : "icon-globe",
+        "order": 9
     },
     {
         "name": "Movies",
         "description": "Discuss the latest movies here",
         "blockclass": "category-darkblue",
-        "icon" : "icon-film"
+        "icon" : "icon-film",
+        "order": 10
     },
     {
         "name": "Games",
         "description": "Discuss the latest games here",
         "blockclass": "category-darkblue",
-        "icon" : "icon-screenshot"
+        "icon" : "icon-screenshot",
+        "order": 11
     },
     {
         "name": "Random",
         "description": "Anything and (almost) everything welcome!",
         "blockclass": "category-darkblue",
-        "icon" : "icon-beer"
+        "icon" : "icon-beer",
+        "order": 12
     }
 ]

public/src/forum/admin/categories.js

@@ -46,7 +46,22 @@ define(function() {
 			el.parentNode.parentNode.className = 'entry-row ' + el.value;
 		}
 
-		jQuery('#entry-container').sortable();
+		function updateCategoryOrders() {
+			var categories = $('.admin-categories #entry-container').children();
+			for(var i=0; i<categories.length; ++i) {
+				var input = $(categories[i]).find('input[data-name="order"]');
+
+				input.val(i+1).attr('data-value', i+1);
+				modified(input);
+			}
+		}
+
+		jQuery('#entry-container').sortable({
+			stop: function( event, ui ) {
+				console.log('sort stop', ui);
+				updateCategoryOrders();
+			}
+		});
 		jQuery('.blockclass').each(function() {
 			jQuery(this).val(this.getAttribute('data-value'));
 		});

public/templates/admin/categories.tpl

@@ -27,6 +27,7 @@
 					<option value="category-orange">category-orange</option>
 				</select>
 				<input data-name="description" placeholder="Category Description" value="{categories.description}" class="form-control category_description description"></input>
+				<input type="hidden" data-name="order" data-value="{categories.order}"></input>
 				<button type="submit" class="btn btn-default" data-disabled="{categories.disabled}">Disable</button>
 			</form>
 		</li>

src/categories.js

@@ -27,7 +27,8 @@ var RDB = require('./redis.js'),
 				blockclass: data.blockclass,
 				slug: slug,
 				topic_count: 0,
-				disabled: 0
+				disabled: 0,
+				order: data.order
 			};
 			RDB.hmset('category:' + cid, category);
 
@@ -350,6 +351,8 @@ var RDB = require('./redis.js'),
 				return;
 			}
 
+			categories = categories.sort(function(a, b) { return parseInt(a.order, 10) - parseInt(b.order, 10); });
+
 			callback({
 				'categories': categories
 			});