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

Merge pull request #5473 from pichalite/acp-tags

Browse Source 
ACP manage tags page UI changes
v1.18.x
Julian Lam 8 years ago committed by GitHub
parent 35ff71c37d 1d5b3cc73f
commit 4163ce0218
7 changed files with 2184 additions and 447 deletions
Show Stats Download Patch File Download Diff File

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

@ -25,30 +25,7 @@
} }
} }
.tag-item {
border: solid 1px @gray-light;
background-color: transparent;
color: @gray-light;
padding: .2em .6em .3em;
font-size: 75%;
font-weight: 700;
white-space: nowrap;
}
.tag-topic-count { .tag-topic-count {
border: solid 1px lighten(@brand-primary, 20%); font-size: 14px;
background-color: lighten(@brand-primary, 20%);
padding: 6px;
font-size: 75%;
font-weight: 700;
white-space: nowrap;
border-left: none;
padding-right: 5px;
padding-left: 5px;
border-width: 1px 1px 2px medium;
a {
color: #FFFFFF;
}
} }
} }

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

@ -6,7 +6,7 @@ define('admin/manage/tags', [
'admin/modules/selectable', 'admin/modules/selectable',
'admin/modules/colorpicker' 'admin/modules/colorpicker'
], function (infinitescroll, selectable, colorpicker) { ], function (infinitescroll, selectable, colorpicker) {
var Tags = {}, var Tags = {},
timeoutId = 0; timeoutId = 0;
Tags.init = function () { Tags.init = function () {
@ -61,12 +61,16 @@ define('admin/manage/tags', [
} }
timeoutId = setTimeout(function () { timeoutId = setTimeout(function () {
socket.emit('topics.searchAndLoadTags', {query: $('#tag-search').val()}, function (err, result) { socket.emit('topics.searchAndLoadTags', {
query: $('#tag-search').val()
}, function (err, result) {
if (err) { if (err) {
return app.alertError(err.message); return app.alertError(err.message);
} }
app.parseAndTranslate('admin/manage/tags', 'tags', {tags: result.tags}, function (html) { app.parseAndTranslate('admin/manage/tags', 'tags', {
tags: result.tags
}, function (html) {
$('.tag-list').html(html); $('.tag-list').html(html);
utils.makeNumbersHumanReadable(html.find('.human-readable-number')); utils.makeNumbersHumanReadable(html.find('.human-readable-number'));
timeoutId = 0; timeoutId = 0;
@ -86,10 +90,10 @@ define('admin/manage/tags', [
} }
var firstTag = $(tagsToModify[0]), var firstTag = $(tagsToModify[0]),
title = tagsToModify.length > 1 ? '[[admin/manage/tags:alerts.editing-multiple]]' : '[[admin/manage/tags:alerts.editing-x, ' + firstTag.find('.tag-item').text() + ']]'; title = tagsToModify.length > 1 ? '[[admin/manage/tags:alerts.editing-multiple]]' : '[[admin/manage/tags:alerts.editing-x, ' + firstTag.find('.tag-item').attr('data-tag') + ']]';
var modal = bootbox.dialog({ var modal = bootbox.dialog({
title: title, title: title,
message: firstTag.find('.tag-modal').html(), message: firstTag.find('.tag-modal').html(),
buttons: { buttons: {
success: { success: {
@ -133,7 +137,9 @@ define('admin/manage/tags', [
tagsToDelete.each(function (index, el) { tagsToDelete.each(function (index, el) {
tags.push($(el).attr('data-tag')); tags.push($(el).attr('data-tag'));
}); });
socket.emit('admin.tags.deleteTags', {tags: tags}, function (err) { socket.emit('admin.tags.deleteTags', {
tags: tags
}, function (err) {
if (err) { if (err) {
return app.alertError(err.message); return app.alertError(err.message);
} }
@ -155,8 +161,8 @@ define('admin/manage/tags', [
function save(tag) { function save(tag) {
var data = { var data = {
tag: tag.attr('data-tag'), tag: tag.attr('data-tag'),
bgColor : tag.find('[data-name="bgColor"]').val(), bgColor: tag.find('[data-name="bgColor"]').val(),
color : tag.find('[data-name="color"]').val() color: tag.find('[data-name="color"]').val()
}; };
socket.emit('admin.tags.update', data, function (err) { socket.emit('admin.tags.update', data, function (err) {
@ -169,4 +175,4 @@ define('admin/manage/tags', [
} }
return Tags; return Tags;
}); });

2552
public/vendor/mdl/mdl.css → public/vendor/mdl/material.css vendored
View File

File diff suppressed because it is too large Load Diff

1
public/vendor/mdl/mdl.min.css vendored
View File

File diff suppressed because one or more lines are too long

13
src/meta/css.js
Unescape Escape View File

@ -32,7 +32,9 @@ module.exports = function (Meta) {
'@import "../../public/less/generics.less";', '@import "../../public/less/generics.less";',
'@import "../../public/less/mixins.less";', '@import "../../public/less/mixins.less";',
'@import "../../public/less/global.less";', '@import "../../public/less/global.less";',
].map(function (str) { return str.replace(/\//g, path.sep); }).join('\n'); ].map(function (str) {
return str.replace(/\//g, path.sep);
}).join('\n');
}, },
admin: function (source) { admin: function (source) {
return source + '\n' + [ return source + '\n' + [
@ -42,7 +44,10 @@ module.exports = function (Meta) {
'@import (inline) "../public/vendor/colorpicker/colorpicker.css";', '@import (inline) "../public/vendor/colorpicker/colorpicker.css";',
'@import (inline) "../public/vendor/jquery/css/smoothness/jquery-ui.css";', '@import (inline) "../public/vendor/jquery/css/smoothness/jquery-ui.css";',
'@import (inline) "../public/vendor/jquery/bootstrap-tagsinput/bootstrap-tagsinput.css";', '@import (inline) "../public/vendor/jquery/bootstrap-tagsinput/bootstrap-tagsinput.css";',
].map(function (str) { return str.replace(/\//g, path.sep); }).join('\n'); '@import (inline) "../public/vendor/mdl/material.css";',
].map(function (str) {
return str.replace(/\//g, path.sep);
}).join('\n');
}, },
}; };
@ -90,7 +95,7 @@ module.exports = function (Meta) {
}; };
function getStyleSource(files, prefix, extension, callback) { function getStyleSource(files, prefix, extension, callback) {
var pluginDirectories = [], var pluginDirectories = [],
source = ''; source = '';
files.forEach(function (styleFile) { files.forEach(function (styleFile) {
@ -143,7 +148,7 @@ module.exports = function (Meta) {
return callback(err); return callback(err);
} }
postcss(global.env === 'development' ? [ autoprefixer ] : [ postcss(global.env === 'development' ? [autoprefixer] : [
autoprefixer, autoprefixer,
clean({ clean({
processImportFrom: ['local'] processImportFrom: ['local']

7
src/views/admin/header.tpl
Unescape Escape View File

@ -3,11 +3,10 @@
<head> <head>
<title>{title}</title> <title>{title}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="{relative_path}/assets/admin.css?{cache-buster}" /> <link rel="stylesheet" type="text/css" href="{relative_path}/assets/admin.css?{cache-buster}" />
<link rel="stylesheet" type="text/css" href="{relative_path}/assets/vendor/mdl/mdl.min.css?{cache-buster}" />
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<script> <script>
var RELATIVE_PATH = "{relative_path}"; var RELATIVE_PATH = "{relative_path}";
var config = JSON.parse('{{configJSON}}'); var config = JSON.parse('{{configJSON}}');
@ -20,7 +19,7 @@
}; };
</script> </script>
<script src="https://storage.googleapis.com/code.getmdl.io/1.0.3/material.min.js"></script> <script src="https://storage.googleapis.com/code.getmdl.io/1.3.0/material.min.js"></script>
<script type="text/javascript" src="{relative_path}/assets/vendor/jquery/sortable/Sortable.js?{cache-buster}"></script> <script type="text/javascript" src="{relative_path}/assets/vendor/jquery/sortable/Sortable.js?{cache-buster}"></script>
<script type="text/javascript" src="{relative_path}/assets/acp.min.js?{cache-buster}"></script> <script type="text/javascript" src="{relative_path}/assets/acp.min.js?{cache-buster}"></script>
<script type="text/javascript" src="{relative_path}/assets/vendor/colorpicker/colorpicker.js?{cache-buster}"></script> <script type="text/javascript" src="{relative_path}/assets/vendor/colorpicker/colorpicker.js?{cache-buster}"></script>

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

@ -10,12 +10,11 @@
<!-- 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=" <span class="mdl-chip mdl-chip--contact tag-item" data-tag="{tags.value}" style="
<!-- IF tags.color -->color: {tags.color};<!-- ENDIF tags.color --> <!-- IF tags.color -->color: {tags.color};<!-- ENDIF tags.color -->
<!-- IF tags.bgColor -->background-color: {tags.bgColor};<!-- ENDIF tags.bgColor --> <!-- IF tags.bgColor -->background-color: {tags.bgColor};<!-- ENDIF tags.bgColor -->">
">{tags.value}</span> <span class="mdl-chip__contact mdl-color--light-blue mdl-color-text--white tag-topic-count">{tags.score}</span>
<span class="tag-topic-count"> <span class="mdl-chip__text">{tags.value}</span>
<a href="{config.relative_path}/tags/{tags.value}" target="_blank">{tags.score}</a>
</span> </span>
</div> </div>
<div class="tag-modal hidden"> <div class="tag-modal hidden">

Write Preview
Loading…
Cancel
Save