closed #2820

public/src/admin/manage/categories.js

@@ -1,7 +1,7 @@
 "use strict";
 /*global define, socket, app, bootbox, templates, ajaxify, RELATIVE_PATH, Sortable */
 
-define('admin/manage/categories', function() {
+define('admin/manage/categories', ['vendor/jquery/serializeObject/jquery.ba-serializeobject.min'], function() {
 	var	Categories = {}, newCategoryId = -1, sortables;
 
 	Categories.init = function() {
@@ -13,7 +13,7 @@ define('admin/manage/categories', function() {
 			Categories.render(payload);
 		});
 
-		$('button[data-action="create"]').on('click', Categories.create);
+		$('button[data-action="create"]').on('click', Categories.throwCreateModal);
 
 		// Enable/Disable toggle events
 		$('.categories').on('click', 'button[data-action="toggle"]', function() {
@@ -26,31 +26,47 @@ define('admin/manage/categories', function() {
 		});
 	};
 
-	Categories.create = function() {
-		bootbox.prompt('Category Name', function(name) {
-			if (!name) {
-				return;
-			}
-
-			socket.emit('admin.categories.create', {
-				name: name,
-				description: '',
-				icon: 'fa-comments'
-			}, function(err, data) {
-				if(err) {
-					return app.alertError(err.message);
-				}
-
-				app.alert({
-					alert_id: 'category_created',
-					title: 'Created',
-					message: 'Category successfully created!',
-					type: 'success',
-					timeout: 2000
+	Categories.throwCreateModal = function() {
+		socket.emit('admin.categories.getNames', {}, function(err, categories) {
+			templates.parse('admin/partials/categories/create', {
+				categories: categories
+			}, function(html) {
+				var modal = bootbox.dialog({
+					title: 'Create a Category',
+					message: html,
+					buttons: {
+						save: {
+							label: 'Save',
+							className: 'btn-primary',
+							callback: function() {
+								var formData = modal.find('form').serializeObject();
+								formData.description = '';
+								formData.icon = 'fa-comments';
+
+								Categories.create(formData);
+							}
+						}
+					}
 				});
+			});
+		});
+	};
 
-				ajaxify.go('admin/manage/categories/' + data.cid);
+	Categories.create = function(payload) {
+		socket.emit('admin.categories.create', payload, function(err, data) {
+			if(err) {
+				return app.alertError(err.message);
+			}
+
+			app.alert({
+				alert_id: 'category_created',
+				title: 'Created',
+				message: 'Category successfully created!',
+				type: 'success',
+				timeout: 2000
 			});
+
+			ajaxify.go('admin/manage/categories/' + data.cid);
 		});
 	};
 

src/categories.js

@@ -198,6 +198,15 @@ var async = require('async'),
 		});
 	};
 
+	Categories.getAllCategoryFields = function(fields, callback) {
+		async.waterfall([
+			async.apply(db.getSortedSetRange, 'categories:cid', 0, -1),
+			function(cids, next) {
+				Categories.getMultipleCategoryFields(cids, fields, next);
+			}
+		], callback);
+	};
+
 	Categories.getCategoryFields = function(cid, fields, callback) {
 		db.getObjectFields('category:' + cid, fields, callback);
 	};

src/socket.io/admin/categories.js

@@ -38,6 +38,10 @@ Categories.getAll = function(socket, data, callback) {
 	});
 };
 
+Categories.getNames = function(socket, data, callback) {
+	categories.getAllCategoryFields(['cid', 'name'], callback);
+};
+
 Categories.purge = function(socket, cid, callback) {
 	categories.purge(cid, callback);
 };

src/views/admin/partials/categories/create.tpl

@@ -0,0 +1,14 @@
+<form type="form">
+	<div class="form-group">
+		<label for="name">Category Name</label>
+		<input type="text" class="form-control" name="name" id="name" />
+	</div>
+	<div class="form-group">
+		<label for="parentCid">(Optional) Parent Category</label>
+		<select class="form-control" name="parentCid" id="parentCid">
+			<!-- BEGIN categories -->
+			<option value="{categories.cid}">{categories.name}</option>
+			<!-- END categories -->
+		</select>
+	</div>
+</form>