Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2026-07-06 08:07:49 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactored admin/tags a bit, now inputs are hidden behind a modal so we can see moar tags

Browse Source
This commit is contained in:
psychobunny
2014-09-27 12:34:46 -04:00
parent 0fa04cf9a0
commit 34a2444f07
3 changed files with 57 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
public/less/admin/admin.less
View File

@@ -478,10 +478,14 @@
}
.tag-row {
a {
padding: 5px;
float: left;
.tag-item {
cursor: pointer;
display: inline-block;
margin-top: 22px;
font-size: 28px;
font-size: 11px;
}
}

43
public/src/forum/admin/tags.js
View File

@@ -1,5 +1,5 @@
"use strict";
/*global define, socket, app, admin, utils*/
/*global define, socket, app, admin, utils, bootbox, RELATIVE_PATH*/
define('forum/admin/tags', ['forum/infinitescroll'], function(infinitescroll) {
var Tags = {};
@@ -30,6 +30,45 @@ define('forum/admin/tags', ['forum/infinitescroll'], function(infinitescroll) {
});
}, 100);
});
$('.tag-item').on('click', function(ev) {
var tagName = $(this).text(),
tag = $(this),
row = tag.parents('.tag-row');
bootbox.dialog({
title: "Editing " + tagName + " tag",
message: $(this).parents('.tag-row').find('.tag-modal').html(),
buttons: {
success: {
label: "Save",
className: "btn-primary save",
callback: function() {
var modal = $('.bootbox'),
bgColor = modal.find('[data-name="bgColor"]').val(),
color = modal.find('[data-name="color"]').val();
row.find('[data-name="bgColor"]').val(bgColor);
row.find('[data-name="color"]').val(color);
row.find('.tag-item').css('background-color', bgColor).css('color', color);
save(tag);
}
},
info: {
label: "Click to view topics tagged \"" + tagName + "\"",
className: "btn-info",
callback: function() {
window.open(RELATIVE_PATH + '/tags/' + tagName);
}
}
}
});
setTimeout(function() {
handleColorPickers();
}, 500); // bootbox made me do it.
});
};
function handleColorPickers() {
@@ -58,7 +97,7 @@ define('forum/admin/tags', ['forum/infinitescroll'], function(infinitescroll) {
bgColor : tagRow.find('[data-name="bgColor"]').val(),
color : tagRow.find('[data-name="color"]').val()
};
console.log(data);
socket.emit('admin.tags.update', data, function(err) {
if (err) {
return app.alertError(err.message);

23
src/views/admin/tags.tpl
View File

@@ -9,28 +9,25 @@
<div class="row">
<p>Click on a tag to modify its background and text colours</p>
<div class="tag-list">
<!-- BEGIN tags -->
<div class="tag-row col-md-12" data-tag="{tags.value}">
<div class="col-sm-5 col-xs-12">
<a href="{relative_path}/tags/{tags.value}" 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">{tags.score}</span></a>
<div class="tag-row" data-tag="{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">{tags.score}</span>
</div>
<div class="col-sm-3 col-xs-12">
<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="col-sm-3 col-xs-12">
<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 class="col-sm-3 col-xs-12">
<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 class="col-sm-1 col-xs-12">
<button class="btn btn-primary save">Save</button>
</div>
</div>
<!-- END tags -->
</div>