From 42d03cc491d33dd65ed0c3aac9510b623f33eb83 Mon Sep 17 00:00:00 2001 From: barisusakli Date: Fri, 13 Jun 2014 18:27:03 -0400 Subject: [PATCH] closes #1678 --- public/src/admin.js | 3 ++ public/src/forum/admin/categories.js | 48 ++---------------------- public/src/forum/admin/groups.js | 56 ++++++++++++++-------------- public/src/forum/admin/iconSelect.js | 47 +++++++++++++++++++++++ src/groups.js | 9 +++-- 5 files changed, 88 insertions(+), 75 deletions(-) create mode 100644 public/src/forum/admin/iconSelect.js diff --git a/public/src/admin.js b/public/src/admin.js index d504750add..22eb108125 100644 --- a/public/src/admin.js +++ b/public/src/admin.js @@ -16,6 +16,9 @@ var admin = {}; if (typeof callback === 'function') { callback(hsb, hex); } + }, + onShow: function(colpkr) { + $(colpkr).css('z-index', 1051); } }); }); diff --git a/public/src/forum/admin/categories.js b/public/src/forum/admin/categories.js index 887ddabee7..b50708d73a 100644 --- a/public/src/forum/admin/categories.js +++ b/public/src/forum/admin/categories.js @@ -1,7 +1,7 @@ "use strict"; /*global define, socket, app, bootbox, templates, ajaxify, RELATIVE_PATH*/ -define('forum/admin/categories', ['uploader'], function(uploader) { +define('forum/admin/categories', ['uploader', 'forum/admin/iconSelect'], function(uploader, iconSelect) { var Categories = {}; Categories.init = function() { @@ -36,44 +36,6 @@ define('forum/admin/categories', ['uploader'], function(uploader) { return false; } - function select_icon(el) { - var selected = el.attr('class').replace('fa-2x', '').replace('fa', '').replace(/\s+/g, ''); - $('#icons .selected').removeClass('selected'); - - if (selected === '') { - selected = 'fa-doesnt-exist'; - } - if (selected) { - $('#icons .fa-icons .fa.' + selected).parent().addClass('selected'); - } - - bootbox.confirm('

Select an icon.

' + $('#icons').html(), function(confirm) { - if (confirm) { - var iconClass = $('.bootbox .selected').children(':first').attr('class'); - - el.attr('class', iconClass + ' fa-2x'); - - // remove the 'fa ' from the class name, just need the icon name itself - var categoryIconClass = iconClass.replace('fa ', ''); - if(categoryIconClass === 'fa-doesnt-exist') { - categoryIconClass = ''; - } - el.val(categoryIconClass); - el.attr('value', categoryIconClass); - - modified(el); - } - }); - - setTimeout(function() { //bootbox was rewritten for BS3 and I had to add this timeout for the previous code to work. TODO: to look into - $('.bootbox .col-md-3').on('click', function() { - $('.bootbox .selected').removeClass('selected'); - $(this).addClass('selected'); - }); - }, 500); - } - - function update_blockclass(el) { el.parentNode.parentNode.className = 'entry-row ' + el.value; } @@ -186,12 +148,8 @@ define('forum/admin/categories', ['uploader'], function(uploader) { $('#addNew').on('click', showCreateCategoryModal); $('#create-category-btn').on('click', createNewCategory); - $('#entry-container').on('click', '.icon', function(ev) { - select_icon($(this).find('i')); - }); - - $('#new-category-modal').on('click', '.icon', function(ev) { - select_icon($(this).find('i')); + $('#entry-container, #new-category-modal').on('click', '.icon', function(ev) { + iconSelect.init($(this).find('i'), modified); }); $('.admin-categories form input, .admin-categories form select').on('change', function(ev) { diff --git a/public/src/forum/admin/groups.js b/public/src/forum/admin/groups.js index 70c80ff241..b481eb8b17 100644 --- a/public/src/forum/admin/groups.js +++ b/public/src/forum/admin/groups.js @@ -1,14 +1,12 @@ "use strict"; /*global define, templates, socket, ajaxify, app, bootbox*/ -define('forum/admin/groups', function() { +define('forum/admin/groups', ['forum/admin/iconSelect'], function(iconSelect) { var Groups = {}; Groups.init = function() { var yourid = ajaxify.variables.get('yourid'), - createEl = $('#create'), createModal = $('#create-modal'), - createSubmitBtn = $('#create-modal-go'), createNameEl = $('#create-group-name'), detailsModal = $('#group-details-modal'), detailsSearch = detailsModal.find('#group-details-search'), @@ -18,14 +16,14 @@ define('forum/admin/groups', function() { searchDelay, listEl = $('#groups-list'); - createEl.on('click', function() { + $('#create').on('click', function() { createModal.modal('show'); setTimeout(function() { createNameEl.focus(); }, 250); }); - createSubmitBtn.on('click', function() { + $('#create-modal-go').on('click', function() { var submitObj = { name: createNameEl.val(), description: $('#create-group-desc').val() @@ -80,20 +78,18 @@ define('forum/admin/groups', function() { break; case 'members': socket.emit('admin.groups.get', groupName, function(err, groupObj) { - var formEl = detailsModal.find('form'), - nameEl = formEl.find('#change-group-name'), - descEl = formEl.find('#change-group-desc'), - userTitleEl = formEl.find('#change-group-user-title'), - numMembers = groupObj.members.length, - x; - - nameEl.val(groupObj.name); - descEl.val(groupObj.description); - userTitleEl.val(groupObj.userTitle); - - if (numMembers > 0) { + var formEl = detailsModal.find('form'); + + formEl.find('#change-group-name').val(groupObj.name); + formEl.find('#change-group-desc').val(groupObj.description); + formEl.find('#change-group-user-title').val(groupObj.userTitle); + formEl.find('#group-icon').attr('class', 'fa fa-2x ' + groupObj.icon).attr('value', groupObj.icon); + formEl.find('#change-group-label-color').val(groupObj.labelColor); + formEl.find('#group-label-preview').css('background', groupObj.labelColor || '#000000').text(groupObj.userTitle); + + if (groupObj.members.length > 0) { groupMembersEl.empty(); - for (x = 0; x < numMembers; x++) { + for (var x = 0; x < groupObj.members.length; x++) { var memberIcon = $('
  • ') .attr('data-uid', groupObj.members[x].uid) .append($('').attr('src', groupObj.members[x].picture)) @@ -189,19 +185,25 @@ define('forum/admin/groups', function() { }); }); + $('#change-group-icon').on('click', function() { + iconSelect.init($('#group-icon')); + }); + + admin.enableColorPicker($('#change-group-label-color'), function(hsb, hex) { + $('#group-label-preview').css('background-color', '#' + hex); + }); + detailsModalSave.on('click', function() { - var formEl = detailsModal.find('form'), - nameEl = formEl.find('#change-group-name'), - descEl = formEl.find('#change-group-desc'), - userTitleEl = formEl.find('#change-group-user-title'), - groupName = detailsModal.attr('data-groupname'); + var formEl = detailsModal.find('form'); socket.emit('admin.groups.update', { - groupName: groupName, + groupName: detailsModal.attr('data-groupname'), values: { - name: nameEl.val(), - userTitle: userTitleEl.val(), - description: descEl.val() + name: formEl.find('#change-group-name').val(), + userTitle: formEl.find('#change-group-user-title').val(), + description: formEl.find('#change-group-desc').val(), + icon: formEl.find('#group-icon').attr('value'), + labelColor: formEl.find('#change-group-label-color').val() } }, function(err) { if (!err) { diff --git a/public/src/forum/admin/iconSelect.js b/public/src/forum/admin/iconSelect.js new file mode 100644 index 0000000000..348619bf37 --- /dev/null +++ b/public/src/forum/admin/iconSelect.js @@ -0,0 +1,47 @@ + +'use strict'; + +/* globals define, bootbox */ + +define(function() { + var iconSelect = {}; + + iconSelect.init = function(el, onModified) { + onModified = onModified || function() {}; + var selected = el.attr('class').replace('fa-2x', '').replace('fa', '').replace(/\s+/g, ''); + $('#icons .selected').removeClass('selected'); + + if (selected === '') { + selected = 'fa-doesnt-exist'; + } + if (selected) { + $('#icons .fa-icons .fa.' + selected).parent().addClass('selected'); + } + + bootbox.confirm('

    Select an icon.

    ' + $('#icons').html(), function(confirm) { + if (confirm) { + var iconClass = $('.bootbox .selected').attr('class'); + var categoryIconClass = $('
    ').addClass(iconClass).removeClass('fa').removeClass('selected').attr('class'); + if (categoryIconClass === 'fa-doesnt-exist') { + categoryIconClass = ''; + } + + el.attr('class', 'fa fa-2x ' + categoryIconClass); + el.val(categoryIconClass); + el.attr('value', categoryIconClass); + + onModified(el); + } + }); + + setTimeout(function() { //bootbox was rewritten for BS3 and I had to add this timeout for the previous code to work. TODO: to look into + $('.bootbox .fa-icons i').on('click', function() { + $('.bootbox .selected').removeClass('selected'); + $(this).addClass('selected'); + }); + }, 500); + }; + + return iconSelect; +}); + diff --git a/src/groups.js b/src/groups.js index 099949f598..f50fbae6c7 100644 --- a/src/groups.js +++ b/src/groups.js @@ -229,7 +229,9 @@ db.setObject('group:' + groupName, { userTitle: values.userTitle, - description: values.description + description: values.description, + icon: values.icon || '', + labelColor: values.labelColor || '#000000' }, callback); }); }; @@ -328,7 +330,7 @@ return 'group:' + groupName; }); - db.getObjectsFields(groupKeys, ['name', 'hidden', 'userTitle'], function(err, groupData) { + db.getObjectsFields(groupKeys, ['name', 'hidden', 'userTitle', 'icon', 'labelColor'], function(err, groupData) { groupData = groupData.filter(function(group) { return parseInt(group.hidden, 10) !== 1; @@ -336,8 +338,9 @@ var groupSets = groupData.map(function(group) { group.userTitle = group.userTitle || group.name; + group.labelColor = group.labelColor || '#000000'; return 'group:' + group.name + ':members'; - }) + }); db.isMemberOfSets(groupSets, uid, function(err, isMembers) { for(var i=isMembers.length - 1; i>=0; --i) {