Fix the comment collapse feature

In commit 4abde89 (Use JavaScript to collapse long comments,
2017-04-19), support for collapsing/expanding long comments was added.
This was broken by the recent Markdown support since comments no longer
live inside a single HTML paragraph. Fix this by wrapping each comment
in another div container.

Signed-off-by: Lukas Fleischer <lfleischer@archlinux.org>
This commit is contained in:
Lukas Fleischer 2017-04-24 18:10:16 +02:00
parent fd880a7a84
commit 4be9aa6350
2 changed files with 21 additions and 18 deletions

View file

@ -74,32 +74,33 @@ function collapseDependsList(list) {
function collapseComment(div) {
var linkid = div.attr('id') + 'link',
par = div.find('p'),
height = par.height(),
inner = div.find('div'),
height = inner.height(),
maxheight = 200;
if (height <= maxheight)
return;
par.css({ 'overflow': 'hidden', 'height': maxheight + 'px' });
par.addClass('collapsed');
par.after('<p><a id="' + linkid + '" href="#">Show More…</a></p>');
inner.css({ 'overflow': 'hidden', 'height': maxheight + 'px' });
inner.addClass('collapsed');
inner.after('<p><a id="' + linkid + '" href="#">Show More…</a></p>');
$('#' + linkid).click(function(event) {
var inner = $(this).parent().parent().find('div');
var newheight;
if (par.hasClass('collapsed')) {
par.css({ 'height': 'auto' });
newheight = par.height();
par.css({ 'height': maxheight });
if (inner.hasClass('collapsed')) {
inner.css({ 'height': 'auto' });
newheight = inner.height();
inner.css({ 'height': maxheight });
$(this).text('Collapse');
} else {
newheight = maxheight;
$(this).text('Show More…');
}
par.animate({ 'height': newheight });
par.toggleClass('collapsed');
inner.animate({ 'height': newheight });
inner.toggleClass('collapsed');
event.preventDefault();
});
}

View file

@ -103,6 +103,7 @@ if (!isset($count)) {
<?php endif; ?>
</h4>
<div id="<?= isset($pinned) ? "pinned-" : "comment-" ?><?= $row['ID'] ?>-content" class="article-content<?php if ($is_deleted): ?> comment-deleted<?php endif; ?>">
<div>
<?php if (!empty($row['RenderedComment'])): ?>
<?= $row['RenderedComment'] ?>
<?php else: ?>
@ -111,6 +112,7 @@ if (!isset($count)) {
</p>
<?php endif; ?>
</div>
</div>
<?php endwhile; ?>
<?php if ($count > 10 && !isset($_GET['comments']) && !isset($pinned)): ?>