client/posts: show tag/note counters in expanders

This commit is contained in:
rr- 2016-08-23 23:09:07 +02:00
parent cc78766585
commit 7f4a2c1ceb
3 changed files with 40 additions and 15 deletions

View file

@ -1,7 +1,7 @@
<section class='expander'>
<header>
<a href>
<%- ctx.title %>
<span><%- ctx.title %></span>
<i class='fa fa-chevron-down'></i>
</a>
</header>

View file

@ -8,8 +8,8 @@ const views = require('../util/views.js');
const template = views.getTemplate('expander');
class ExpanderControl {
constructor(title, nodes) {
this._title = title;
constructor(name, title, nodes) {
this._name = name;
nodes = Array.from(nodes).filter(n => n);
if (!nodes.length) {
@ -33,12 +33,16 @@ class ExpanderControl {
expanderNode.classList.toggle(
'collapsed',
this._allStates[this._title] === undefined ?
this._allStates[this._name] === undefined ?
false :
!this._allStates[this._title]);
!this._allStates[this._name]);
this._syncIcon();
}
set title(newTitle) {
this._expanderNode.querySelector('header span').textContent = newTitle;
}
get _isOpened() {
return !this._expanderNode.classList.contains('collapsed');
}
@ -53,7 +57,7 @@ class ExpanderControl {
_save() {
const newStates = Object.assign({}, this._allStates);
newStates[this._title] = this._isOpened;
newStates[this._name] = this._isOpened;
localStorage.setItem('expander', JSON.stringify(newStates));
}

View file

@ -37,21 +37,28 @@ class PostEditSidebarControl extends events.EventTarget {
}));
new ExpanderControl(
'post-info',
'Basic info',
this._hostNode.querySelectorAll('.safety, .relations, .flags'));
new ExpanderControl(
'Tags',
this._tagsExpander = new ExpanderControl(
'post-tags',
`Tags (${this._post.tags.length})`,
this._hostNode.querySelectorAll('.tags'));
new ExpanderControl(
this._notesExpander = new ExpanderControl(
'post-notes',
'Notes',
this._hostNode.querySelectorAll('.notes'));
new ExpanderControl(
'post-content',
'Content',
this._hostNode.querySelectorAll('.post-content, .post-thumbnail'));
new ExpanderControl(
'post-management',
'Management',
this._hostNode.querySelectorAll('.management'));
this._syncExpanderTitles();
if (this._formNode) {
this._formNode.addEventListener('submit', e => this._evtSubmit(e));
}
@ -121,22 +128,36 @@ class PostEditSidebarControl extends events.EventTarget {
'input, textarea');
for (let node of inputNodes) {
node.addEventListener(
'change', e => {
this.dispatchEvent(new CustomEvent('change'));
});
'change',
e => this.dispatchEvent(new CustomEvent('change')));
}
this._postNotesOverlayControl.addEventListener(
'change', e => {
this.dispatchEvent(new CustomEvent('change'));
'change',
e => this.dispatchEvent(new CustomEvent('change')));
}
for (let eventType of ['add', 'remove']) {
this._post.notes.addEventListener(eventType, e => {
this._syncExpanderTitles();
});
}
this._tagControl.addEventListener('change', e => {
this._post.tags = this._tagControl.tags;
this._syncExpanderTitles();
});
if (this._noteTextareaNode) {
this._noteTextareaNode.addEventListener(
'change', e => this._evtNoteTextChangeRequest(e));
}
}
_syncExpanderTitles() {
this._notesExpander.title = `Notes (${this._post.notes.length})`;
this._tagsExpander.title = `Tags (${this._post.tags.length})`;
}
_evtPostContentChange(e) {
this._contentFileDropper.reset();
}