hyperzlib
/
nodebb
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

closes #2223, ability to select multiple tags

Browse Source
v1.18.x
psychobunny 10 years ago
parent 4b9e4a0109
commit e86697b36f
3 changed files with 60 additions and 53 deletions
Show Stats Download Patch File Download Diff File

3
public/less/admin/manage/tags.less
Unescape Escape View File

@ -11,9 +11,10 @@
.tag-item { .tag-item {
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
margin-top: 22px;
font-size: 11px; font-size: 11px;
} }
.user-select(none);
} }
.save { .save {

58
public/src/forum/admin/manage/tags.js
Unescape Escape View File

@ -1,16 +1,13 @@
"use strict"; "use strict";
/*global define, socket, app, admin, utils, bootbox, RELATIVE_PATH*/ /*global define, socket, app, admin, utils, bootbox, RELATIVE_PATH*/
define('forum/admin/manage/tags', ['forum/infinitescroll'], function(infinitescroll) { define('forum/admin/manage/tags', ['forum/infinitescroll', 'admin/selectable'], function(infinitescroll, selectable) {
var Tags = {}; var Tags = {};
var timeoutId = 0; var timeoutId = 0;
Tags.init = function() { Tags.init = function() {
handleColorPickers(); handleColorPickers();
selectable.enable('.tag-management', '.tag-row');
$('.tag-list').on('click', '.save', function() {
save($(this));
});
$('#tag-search').on('input propertychange', function() { $('#tag-search').on('input propertychange', function() {
if (timeoutId) { if (timeoutId) {
@ -31,14 +28,18 @@ define('forum/admin/manage/tags', ['forum/infinitescroll'], function(infinitescr
}, 100); }, 100);
}); });
$('.tag-item').on('click', function(ev) { $('#modify').on('click', function(ev) {
var tagName = $(this).text(), var tagsToModify = $('.tag-row.dropped');
tag = $(this), if (!tagsToModify.length) {
row = tag.parents('.tag-row'); return;
}
var firstTag = $(tagsToModify[0]),
title = tagsToModify.length > 1 ? 'Editing multiple tags' : 'Editing ' + firstTag.find('.tag-item').text() + ' tag';
bootbox.dialog({ bootbox.dialog({
title: "Editing " + tagName + " tag", title: title,
message: $(this).parents('.tag-row').find('.tag-modal').html(), message: firstTag.find('.tag-modal').html(),
buttons: { buttons: {
success: { success: {
label: "Save", label: "Save",
@ -46,20 +47,17 @@ define('forum/admin/manage/tags', ['forum/infinitescroll'], function(infinitescr
callback: function() { callback: function() {
var modal = $('.bootbox'), var modal = $('.bootbox'),
bgColor = modal.find('[data-name="bgColor"]').val(), bgColor = modal.find('[data-name="bgColor"]').val(),
color = modal.find('[data-name="color"]').val(); color = modal.find('[data-name="color"]').val();
row.find('[data-name="bgColor"]').val(bgColor); tagsToModify.each(function(idx, tag) {
row.find('[data-name="color"]').val(color); tag = $(tag);
row.find('.tag-item').css('background-color', bgColor).css('color', color);
save(tag); tag.find('[data-name="bgColor"]').val(bgColor);
} tag.find('[data-name="color"]').val(color);
}, tag.find('.tag-item').css('background-color', bgColor).css('color', color);
info: {
label: "Click to view topics tagged \"" + tagName + "\"", save(tag);
className: "btn-info", });
callback: function() {
window.open(RELATIVE_PATH + '/tags/' + tagName);
} }
} }
} }
@ -89,15 +87,13 @@ define('forum/admin/manage/tags', ['forum/infinitescroll'], function(infinitescr
$('[data-name="bgColor"], [data-name="color"]').each(enableColorPicker); $('[data-name="bgColor"], [data-name="color"]').each(enableColorPicker);
} }
function save(saveBtn) { function save(tag) {
var tagRow = saveBtn.parents('.tag-row');
var data = { var data = {
tag: tagRow.attr('data-tag'), tag: tag.attr('data-tag'),
bgColor : tagRow.find('[data-name="bgColor"]').val(), bgColor : tag.find('[data-name="bgColor"]').val(),
color : tagRow.find('[data-name="color"]').val() color : tag.find('[data-name="color"]').val()
}; };
console.log(data);
socket.emit('admin.tags.update', data, function(err) { socket.emit('admin.tags.update', data, function(err) {
if (err) { if (err) {
return app.alertError(err.message); return app.alertError(err.message);
@ -106,7 +102,5 @@ define('forum/admin/manage/tags', ['forum/infinitescroll'], function(infinitescr
}); });
} }
return Tags; return Tags;
}); });

52
src/views/admin/manage/tags.tpl
Unescape Escape View File

@ -5,34 +5,46 @@
</div> </div>
<!-- ENDIF !tags.length --> <!-- ENDIF !tags.length -->
<div class="panel panel-default"> <div class="col-lg-9">
<div class="panel-heading">Tag Management</div> <div class="panel panel-default tag-management">
<div class="panel-body"> <div class="panel-heading">Tag Management</div>
<input class="form-control" type="text" id="tag-search" placeholder="Search"/><br/> <div class="panel-body">
<input class="form-control" type="text" id="tag-search" placeholder="Search"/><br/>
<div class="row"> <div class="row">
<p>Click on a tag to modify its background and text colours</p> <div class="tag-list">
<div class="tag-list"> <!-- BEGIN tags -->
<!-- BEGIN tags --> <div class="tag-row" data-tag="{tags.value}">
<div class="tag-row" data-tag="{tags.value}"> <div data-value="{tags.value}">
<div data-value="{tags.value}"> <span class="tag-item" data-tag="{tags.value}" style="<!-- IF tags.color -->color: {tags.color};<!-- ENDIF tags.color --><!-- IF tags.bgColor -->background-color: {tags.bgColor};<!-- ENDIF tags.bgColor -->">{tags.value}</span><span class="tag-topic-count"><a href="{relative_path}/tags/{tags.value}" target="_blank">{tags.score}</a></span>
<span class="tag-item" data-tag="{tags.value}" style="<!-- IF tags.color -->color: {tags.color};<!-- ENDIF tags.color --><!-- IF tags.bgColor -->background-color: {tags.bgColor};<!-- ENDIF tags.bgColor -->">{tags.value}</span><span class="tag-topic-count">{tags.score}</span>
</div>
<div class="tag-modal hidden">
<div class="form-group">
<label for="bgColor">Background Colour</label>
<input id="bgColor" placeholder="#ffffff" data-name="bgColor" value="{tags.bgColor}" class="form-control category_bgColor" />
</div> </div>
<div class="form-group"> <div class="tag-modal hidden">
<label for="color">Text Colour</label> <div class="form-group">
<input id="color" placeholder="#a2a2a2" data-name="color" value="{tags.color}" class="form-control category_color" /> <label for="bgColor">Background Colour</label>
<input id="bgColor" placeholder="#ffffff" data-name="bgColor" value="{tags.bgColor}" class="form-control category_bgColor" />
</div>
<div class="form-group">
<label for="color">Text Colour</label>
<input id="color" placeholder="#a2a2a2" data-name="color" value="{tags.color}" class="form-control category_color" />
</div>
</div> </div>
</div> </div>
<!-- END tags -->
</div> </div>
<!-- END tags -->
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="col-lg-3">
<div class="panel panel-default">
<div class="panel-heading">Modify Tag</div>
<div class="panel-body">
<p>Select tags via clicking and/or dragging, use shift to select multiple.</p>
<button class="btn btn-primary btn-md" id="modify">Modify Selected Tags</button>
</div>
</div>
</div>
</div> </div>
Write Preview
Loading…
Cancel
Save