From 240056d1694a7e271ebdb30d2bcb17f946f8188f Mon Sep 17 00:00:00 2001
From: Julian Lam <julian@designcreateplay.com>
Date: Sun, 11 Jan 2015 17:44:51 -0500
Subject: [PATCH] added icon container styles back to ACP, proper hooking-up of
 iconSelect module in group settings panel, #2588

---
 public/less/admin/admin.less        | 19 ++++++++++++++++++
 public/src/client/groups/details.js | 31 +++++++++++++++--------------
 src/socket.io/groups.js             |  2 +-
 3 files changed, 36 insertions(+), 16 deletions(-)

diff --git a/public/less/admin/admin.less b/public/less/admin/admin.less
index 4042e3d621..2e5b868048 100644
--- a/public/less/admin/admin.less
+++ b/public/less/admin/admin.less
@@ -195,6 +195,25 @@
 		}
 	}
 
+	.icon-container {
+		.row {
+			margin: 0;
+			i {
+				width:20px;
+				height:20px;
+				margin: 1px;
+				.pointer;
+				line-height: 20px;
+				text-align: center;
+
+				&:hover, &.selected {
+					background: black;
+					color: white;
+				}
+			}
+		}
+	}
+
 	.navbar {
 		padding: 0 5px;
 
diff --git a/public/src/client/groups/details.js b/public/src/client/groups/details.js
index 0c46f1580a..0aacde97ce 100644
--- a/public/src/client/groups/details.js
+++ b/public/src/client/groups/details.js
@@ -1,7 +1,7 @@
 "use strict";
 /* globals define, socket, ajaxify, app */
 
-define('forum/groups/details', ['iconSelect'], function(iconSelect) {
+define('forum/groups/details', ['iconSelect', 'vendor/colorpicker/colorpicker'], function(iconSelect) {
 	var Details = {};
 
 	Details.init = function() {
@@ -63,26 +63,27 @@ define('forum/groups/details', ['iconSelect'], function(iconSelect) {
 			colorValueEl = settingsFormEl.find('[name="labelColor"]'),
 			iconBtn = settingsFormEl.find('[data-action="icon-select"]'),
 			previewEl = settingsFormEl.find('.label'),
-			previewIcon = previewEl.find('i');
+			previewIcon = previewEl.find('i'),
+			previewValueEl = settingsFormEl.find('[name="icon"]');
 
 		if (settingsFormEl.length) {
 			// Add color picker to settings form
-			require(['vendor/colorpicker/colorpicker'], function() {
-				colorBtn.ColorPicker({
-					color: colorValueEl.val() || '#000',
-					onChange: function(hsb, hex) {
-						colorValueEl.val('#' + hex);
-						previewEl.css('background-color', '#' + hex);
-					},
-					onShow: function(colpkr) {
-						$(colpkr).css('z-index', 1051);
-					}
-				});
+			colorBtn.ColorPicker({
+				color: colorValueEl.val() || '#000',
+				onChange: function(hsb, hex) {
+					colorValueEl.val('#' + hex);
+					previewEl.css('background-color', '#' + hex);
+				},
+				onShow: function(colpkr) {
+					$(colpkr).css('z-index', 1051);
+				}
 			});
 
 			// Add icon selection interface
-			iconSelect.init(previewIcon, function() {
-				console.log(arguments);
+			iconBtn.on('click', function() {
+				iconSelect.init(previewIcon, function() {
+					previewValueEl.val(previewIcon.val());
+				});
 			});
 		}
 	};
diff --git a/src/socket.io/groups.js b/src/socket.io/groups.js
index fe401a4d15..3c9dc9b069 100644
--- a/src/socket.io/groups.js
+++ b/src/socket.io/groups.js
@@ -10,7 +10,7 @@ SocketGroups.join = function(socket, data, callback) {
 		return callback(new Error('[[error:invalid-data]]'));
 	}
 
-	if (meta.config.allowPrivateGroups) {
+	if (meta.config.allowPrivateGroups !== '0') {
 		groups.isPrivate(data.groupName, function(err, isPrivate) {
 			if (isPrivate) {
 				groups.requestMembership(data.groupName, socket.uid, callback);