From 69ed8ac45d5f5549ac5fc5796b4b8df6b041fe3b Mon Sep 17 00:00:00 2001 From: Julian Lam Date: Sun, 11 Jan 2015 17:24:15 -0500 Subject: [PATCH] icon selection interface -- moved iconSelect module out of admin space, #2588 --- public/less/admin/admin.less | 19 ------------------- public/src/admin/manage/categories.js | 2 +- public/src/admin/manage/groups.js | 2 +- public/src/client/groups/details.js | 11 +++++++++-- public/src/{admin => }/modules/iconSelect.js | 6 ++++-- src/views/admin/manage/categories.tpl | 2 +- src/views/admin/manage/groups.tpl | 2 +- src/views/admin/partials/fontawesome.tpl | 1 - 8 files changed, 17 insertions(+), 28 deletions(-) rename public/src/{admin => }/modules/iconSelect.js (83%) delete mode 100644 src/views/admin/partials/fontawesome.tpl diff --git a/public/less/admin/admin.less b/public/less/admin/admin.less index 2e5b868048..4042e3d621 100644 --- a/public/less/admin/admin.less +++ b/public/less/admin/admin.less @@ -195,25 +195,6 @@ } } - .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/admin/manage/categories.js b/public/src/admin/manage/categories.js index 5bf1bfe945..54385b6d0c 100644 --- a/public/src/admin/manage/categories.js +++ b/public/src/admin/manage/categories.js @@ -3,7 +3,7 @@ define('admin/manage/categories', [ 'uploader', - 'admin/modules/iconSelect', + 'iconSelect', 'admin/modules/colorpicker' ], function(uploader, iconSelect, colorpicker) { var Categories = {}; diff --git a/public/src/admin/manage/groups.js b/public/src/admin/manage/groups.js index 8f4b341f7d..19f0bf31e9 100644 --- a/public/src/admin/manage/groups.js +++ b/public/src/admin/manage/groups.js @@ -2,7 +2,7 @@ /*global define, templates, socket, ajaxify, app, admin, bootbox*/ define('admin/manage/groups', [ - 'admin/modules/iconSelect', + 'iconSelect', 'admin/modules/colorpicker' ], function(iconSelect, colorpicker) { var Groups = {}; diff --git a/public/src/client/groups/details.js b/public/src/client/groups/details.js index f4e889d70f..0c46f1580a 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', function() { +define('forum/groups/details', ['iconSelect'], function(iconSelect) { var Details = {}; Details.init = function() { @@ -61,7 +61,9 @@ define('forum/groups/details', function() { var settingsFormEl = $('.groups form'), colorBtn = settingsFormEl.find('[data-action="color-select"]'), colorValueEl = settingsFormEl.find('[name="labelColor"]'), - previewEl = settingsFormEl.find('.label'); + iconBtn = settingsFormEl.find('[data-action="icon-select"]'), + previewEl = settingsFormEl.find('.label'), + previewIcon = previewEl.find('i'); if (settingsFormEl.length) { // Add color picker to settings form @@ -77,6 +79,11 @@ define('forum/groups/details', function() { } }); }); + + // Add icon selection interface + iconSelect.init(previewIcon, function() { + console.log(arguments); + }); } }; diff --git a/public/src/admin/modules/iconSelect.js b/public/src/modules/iconSelect.js similarity index 83% rename from public/src/admin/modules/iconSelect.js rename to public/src/modules/iconSelect.js index 286009bf0f..88ab1903ed 100644 --- a/public/src/admin/modules/iconSelect.js +++ b/public/src/modules/iconSelect.js @@ -7,7 +7,9 @@ define(function() { iconSelect.init = function(el, onModified) { onModified = onModified || function() {}; - var selected = el.attr('class').replace('fa-2x', '').replace('fa', '').replace(/\s+/g, ''); + var doubleSize = el.hasClass('fa-2x'), + selected = el.attr('class').replace('fa-2x', '').replace('fa', '').replace(/\s+/g, ''); + $('#icons .selected').removeClass('selected'); if (selected === '') { @@ -25,7 +27,7 @@ define(function() { categoryIconClass = ''; } - el.attr('class', 'fa fa-2x ' + categoryIconClass); + el.attr('class', 'fa ' + (doubleSize ? 'fa-2x ' : '') + categoryIconClass); el.val(categoryIconClass); el.attr('value', categoryIconClass); diff --git a/src/views/admin/manage/categories.tpl b/src/views/admin/manage/categories.tpl index b3b9427abb..2c0dcf48da 100644 --- a/src/views/admin/manage/categories.tpl +++ b/src/views/admin/manage/categories.tpl @@ -149,7 +149,7 @@
- +
diff --git a/src/views/admin/manage/groups.tpl b/src/views/admin/manage/groups.tpl index ee8f8f24ea..69f8bad37b 100644 --- a/src/views/admin/manage/groups.tpl +++ b/src/views/admin/manage/groups.tpl @@ -136,7 +136,7 @@
- +
diff --git a/src/views/admin/partials/fontawesome.tpl b/src/views/admin/partials/fontawesome.tpl deleted file mode 100644 index b0263d95a9..0000000000 --- a/src/views/admin/partials/fontawesome.tpl +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file