126 lines
3.6 KiB
JavaScript
126 lines
3.6 KiB
JavaScript
'use strict';
|
|
|
|
const api = require('../api.js');
|
|
const events = require('../events.js');
|
|
const views = require('../util/views.js');
|
|
const CommentFormControl = require('../controls/comment_form_control.js');
|
|
|
|
const template = views.getTemplate('comment');
|
|
const scoreTemplate = views.getTemplate('score');
|
|
|
|
class CommentControl extends events.EventTarget {
|
|
constructor(hostNode, comment) {
|
|
super();
|
|
this._hostNode = hostNode;
|
|
this._comment = comment;
|
|
|
|
comment.addEventListener('change', e => this._evtChange(e));
|
|
comment.addEventListener('changeScore', e => this._evtChangeScore(e));
|
|
|
|
const isLoggedIn = api.isLoggedIn(this._comment.user);
|
|
const infix = isLoggedIn ? 'own' : 'any';
|
|
views.replaceContent(this._hostNode, template({
|
|
comment: this._comment,
|
|
canViewUsers: api.hasPrivilege('users:view'),
|
|
canEditComment: api.hasPrivilege(`comments:edit:${infix}`),
|
|
canDeleteComment: api.hasPrivilege(`comments:delete:${infix}`),
|
|
}));
|
|
|
|
if (this._editButtonNode) {
|
|
this._editButtonNode.addEventListener(
|
|
'click', e => this._evtEditClick(e));
|
|
}
|
|
if (this._deleteButtonNode) {
|
|
this._deleteButtonNode.addEventListener(
|
|
'click', e => this._evtDeleteClick(e));
|
|
}
|
|
|
|
this._formControl = new CommentFormControl(
|
|
this._hostNode.querySelector('.comment-form-container'),
|
|
this._comment,
|
|
true);
|
|
events.proxyEvent(this._formControl, this, 'submit');
|
|
|
|
this._installScore();
|
|
}
|
|
|
|
get _scoreContainerNode() {
|
|
return this._hostNode.querySelector('.score-container');
|
|
}
|
|
|
|
get _editButtonNode() {
|
|
return this._hostNode.querySelector('.edit');
|
|
}
|
|
|
|
get _deleteButtonNode() {
|
|
return this._hostNode.querySelector('.delete');
|
|
}
|
|
|
|
get _upvoteButtonNode() {
|
|
return this._hostNode.querySelector('.upvote');
|
|
}
|
|
|
|
get _downvoteButtonNode() {
|
|
return this._hostNode.querySelector('.downvote');
|
|
}
|
|
|
|
_installScore() {
|
|
views.replaceContent(
|
|
this._scoreContainerNode,
|
|
scoreTemplate({
|
|
score: this._comment.score,
|
|
ownScore: this._comment.ownScore,
|
|
canScore: api.hasPrivilege('comments:score'),
|
|
}));
|
|
|
|
if (this._upvoteButtonNode) {
|
|
this._upvoteButtonNode.addEventListener(
|
|
'click', e => this._evtScoreClick(e, 1));
|
|
}
|
|
if (this._downvoteButtonNode) {
|
|
this._downvoteButtonNode.addEventListener(
|
|
'click', e => this._evtScoreClick(e, -1));
|
|
}
|
|
}
|
|
|
|
_evtEditClick(e) {
|
|
e.preventDefault();
|
|
this._formControl.enterEditMode();
|
|
}
|
|
|
|
_evtScoreClick(e, score) {
|
|
e.preventDefault();
|
|
if (!api.hasPrivilege('comments:score')) {
|
|
return;
|
|
}
|
|
this.dispatchEvent(new CustomEvent('score', {
|
|
detail: {
|
|
comment: this._comment,
|
|
score: this._comment.ownScore === score ? 0 : score,
|
|
},
|
|
}));
|
|
}
|
|
|
|
_evtDeleteClick(e) {
|
|
e.preventDefault();
|
|
if (!window.confirm('Are you sure you want to delete this comment?')) {
|
|
return;
|
|
}
|
|
this.dispatchEvent(new CustomEvent('delete', {
|
|
detail: {
|
|
comment: this._comment,
|
|
},
|
|
}));
|
|
}
|
|
|
|
_evtChange(e) {
|
|
this._formControl.exitEditMode();
|
|
}
|
|
|
|
_evtChangeScore(e) {
|
|
this._installScore();
|
|
}
|
|
};
|
|
|
|
module.exports = CommentControl;
|