Add tags filter
yflory
parent
fbf4434fc4
commit
bd7d9a93c2
|
|
@ -190,6 +190,9 @@
|
|||
overflow-wrap: anywhere;
|
||||
flex: 1;
|
||||
}
|
||||
&.kanban-item-hidden {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#cp-app-kanban-content {
|
||||
|
|
@ -218,6 +221,33 @@
|
|||
width: 100%;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
.cp-kanban-filterTags {
|
||||
display: inline-flex;
|
||||
width: 250px;
|
||||
height: 40px;
|
||||
align-items: center;
|
||||
|
||||
&> .tokenfield {
|
||||
border-radius: 0px;
|
||||
display: inline-flex;
|
||||
border: 1px solid @cryptpad_text_col;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
width: 100px;
|
||||
input {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.token {
|
||||
order: 2;
|
||||
border-radius: 0;
|
||||
margin-left: 5px;
|
||||
margin-right: 0px;
|
||||
.token-label {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.cp-kanban-changeView {
|
||||
height: 30px;
|
||||
width: 60px;
|
||||
|
|
|
|||
|
|
@ -57,9 +57,12 @@ define([
|
|||
Messages.kanban_color = "Color"; // XXX
|
||||
Messages.kanban_submit = "Submit"; // XXX
|
||||
Messages.kanban_delete = "Delete"; // XXX
|
||||
Messages.kanban_tags = "Filter tags"; // XXX
|
||||
|
||||
// XXX
|
||||
// Add "large" view
|
||||
// Tag filter:
|
||||
// remember tags in padAttribute
|
||||
// click on a tag ==> add it to the list
|
||||
|
||||
var setValueAndCursor = function (input, val, _cursor) {
|
||||
if (!input) { return; }
|
||||
|
|
@ -79,6 +82,20 @@ define([
|
|||
input.selectionEnd = selects[1];
|
||||
};
|
||||
|
||||
var getExistingTags = function (boards) {
|
||||
var tags = [];
|
||||
boards = boards || {};
|
||||
Object.keys(boards.items || {}).forEach(function (id) {
|
||||
var data = boards.items[id];
|
||||
if (!Array.isArray(data.tags)) { return; }
|
||||
data.tags.forEach(function (tag) {
|
||||
if (tags.indexOf(tag) === -1) { tags.push(tag); }
|
||||
});
|
||||
});
|
||||
tags.sort();
|
||||
return tags;
|
||||
};
|
||||
|
||||
var addEditItemButton = function () {};
|
||||
var onRemoteChange = Util.mkEvent();
|
||||
var editModal;
|
||||
|
|
@ -161,19 +178,6 @@ define([
|
|||
});
|
||||
|
||||
// Tags
|
||||
var getExisting = function () {
|
||||
var tags = [];
|
||||
var boards = kanban.options.boards || {};
|
||||
Object.keys(boards.items || {}).forEach(function (id) {
|
||||
var data = boards.items[id];
|
||||
if (!Array.isArray(data.tags)) { return; }
|
||||
data.tags.forEach(function (tag) {
|
||||
if (tags.indexOf(tag) === -1) { tags.push(tag); }
|
||||
});
|
||||
});
|
||||
tags.sort();
|
||||
return tags;
|
||||
};
|
||||
var $tags = $(tagsDiv);
|
||||
var _field, initialTags;
|
||||
var tags = {
|
||||
|
|
@ -191,11 +195,10 @@ define([
|
|||
$tags.empty();
|
||||
var input = UI.dialog.textInput();
|
||||
$tags.append(input);
|
||||
var existing = getExisting();
|
||||
var existing = getExistingTags(kanban.options.boards);
|
||||
_field = UI.tokenField(input, existing).preventDuplicates(function (val) {
|
||||
UI.warn(Messages._getKey('tags_duplicate', [val]));
|
||||
});
|
||||
$tags.append(_field);
|
||||
_field.setTokens(tags || []);
|
||||
|
||||
var commitTags = function () {
|
||||
|
|
@ -682,8 +685,29 @@ define([
|
|||
$container.removeClass('cp-kanban-quick');
|
||||
framework._.sfCommon.setPadAttribute('quickMode', false);
|
||||
});
|
||||
|
||||
var existing = getExistingTags(kanban.options.boards);
|
||||
var input = UI.dialog.textInput();
|
||||
var tags = h('div.cp-kanban-filterTags', [
|
||||
Messages.kanban_tags,
|
||||
input
|
||||
]);
|
||||
var field = UI.tokenField(input, existing).preventDuplicates(function (val) {
|
||||
UI.warn(Messages._getKey('tags_duplicate', [val]));
|
||||
});
|
||||
field.setTokens([]);
|
||||
var commitTags = function () {
|
||||
var t = field.getTokens();
|
||||
kanban.options.tags = t;
|
||||
kanban.setBoards(kanban.options.boards);
|
||||
addEditItemButton(framework, kanban);
|
||||
};
|
||||
field.tokenfield.on('tokenfield:createdtoken', commitTags);
|
||||
field.tokenfield.on('tokenfield:editedoken', commitTags);
|
||||
field.tokenfield.on('tokenfield:removedtoken', commitTags);
|
||||
|
||||
var container = h('div#cp-kanban-controls', [
|
||||
h('div', "Tags"), // XXX
|
||||
tags, // XXX
|
||||
h('div.cp-kanban-changeView', [
|
||||
small,
|
||||
big
|
||||
|
|
@ -860,9 +884,7 @@ define([
|
|||
|
||||
framework.setContentGetter(function () {
|
||||
if (!kanban) {
|
||||
return {
|
||||
content: {}
|
||||
};
|
||||
throw new Error("NOT INITIALIZED");
|
||||
}
|
||||
var content = kanban.getBoardsJSON();
|
||||
verbose("Content current value is " + content);
|
||||
|
|
|
|||
|
|
@ -56,6 +56,7 @@
|
|||
items: {},
|
||||
list: []
|
||||
},
|
||||
tags: [],
|
||||
dragBoards: true,
|
||||
addItemButton: false,
|
||||
readOnly: false,
|
||||
|
|
@ -337,6 +338,16 @@
|
|||
nodeItemText.dataset.eid = element.id;
|
||||
nodeItemText.innerText = element.title;
|
||||
nodeItem.appendChild(nodeItemText);
|
||||
// Check if this card is filtered out
|
||||
if (Array.isArray(self.options.tags) && self.options.tags.length) {
|
||||
var hide = !Array.isArray(element.tags) ||
|
||||
!element.tags.some(function (tag) {
|
||||
return self.options.tags.indexOf(tag) !== -1;
|
||||
});
|
||||
if (hide) {
|
||||
nodeItem.classList.add('kanban-item-hidden');
|
||||
}
|
||||
}
|
||||
if (element.body) {
|
||||
var html = self.renderMd(element.body);
|
||||
var nodeBody = document.createElement('div');
|
||||
|
|
|
|||
Loading…
Reference in New Issue