Compare commits

...

2 Commits

Author SHA1 Message Date
b82095ca7a Add buttons to collapse / expand comments 2020-10-26 21:57:10 +00:00
992c1c1233 Monkeypatch earlier 2020-10-24 22:30:00 +00:00
3 changed files with 53 additions and 11 deletions

View File

@ -3,6 +3,11 @@ logging.basicConfig(
format='%(asctime)s - %(name)s - %(levelname)s - %(message)s',
level=logging.INFO)
import gevent
from gevent import monkey
monkey.patch_all()
from gevent.pywsgi import WSGIServer
import copy
import json
import threading
@ -19,12 +24,6 @@ from flask import abort, Flask, request, render_template, stream_with_context, R
from werkzeug.exceptions import NotFound
from flask_cors import CORS
import gevent
from gevent import monkey
from gevent.pywsgi import WSGIServer
monkey.patch_all()
database.init()
search.init()

View File

@ -18,6 +18,8 @@ class Article extends React.Component {
this.state = {
story: cache[id] || false,
error: false,
collapsed: [],
expanded: [],
};
}
@ -49,22 +51,54 @@ class Article extends React.Component {
);
}
collapseComment(cid) {
this.setState(prevState => ({
...prevState,
collapsed: [...prevState.collapsed, cid],
expanded: prevState.expanded.filter(x => x !== cid),
}));
}
expandComment(cid) {
this.setState(prevState => ({
...prevState,
collapsed: prevState.collapsed.filter(x => x !== cid),
expanded: [...prevState.expanded, cid],
}));
}
countComments(c) {
return c.comments.reduce((sum, x) => sum + this.countComments(x), 1);
}
displayComment(story, c, level) {
const cid = c.author+c.date;
const collapsed = this.state.collapsed.includes(cid);
const expanded = this.state.expanded.includes(cid);
const hidden = collapsed || (level == 4 && !expanded);
const hasChildren = c.comments.length !== 0;
return (
<div className={level ? 'comment lined' : 'comment'} key={c.author+c.date}>
<div className={level ? 'comment lined' : 'comment'} key={cid}>
<div className='info'>
<p>
{c.author === story.author ? '[OP]' : ''} {c.author || '[Deleted]'}
&#8203; | <HashLink to={'#'+c.author+c.date} id={c.author+c.date}>{moment.unix(c.date).fromNow()}</HashLink>
{' '} | <HashLink to={'#'+cid} id={cid}>{moment.unix(c.date).fromNow()}</HashLink>
{hidden || hasChildren &&
<span className='collapser pointer' onClick={() => this.collapseComment(cid)}></span>
}
</p>
</div>
<div className='text' dangerouslySetInnerHTML={{ __html: c.text }} />
{level < 5 ?
c.comments.map(i => this.displayComment(story, i, level + 1))
{hidden && hasChildren ?
<div className='comment lined info pointer' onClick={() => this.expandComment(cid)}>[show {this.countComments(c)-1} more]</div>
:
<div className='info'><p>[replies snipped]</p></div>
c.comments.map(i => this.displayComment(story, i, level + 1))
}
</div>
);

View File

@ -197,3 +197,12 @@ span.source {
.search form {
display: inline;
}
.collapser {
padding-left: 0.5rem;
padding-right: 1.5rem;
}
.pointer {
cursor: pointer;
}