external/aurweb
0
0
Fork 0
mirror of https://gitlab.archlinux.org/archlinux/aurweb.git synced 2025-02-03 10:43:03 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix the comment collapse feature

Browse source 
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
Show stats Download patch file Download diff file Expand all files Collapse all files

23
web/html/packages.php
View file

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

16
web/template/pkg_comments.php
View file

@ -103,13 +103,15 @@ if (!isset($count)) {
<?php endif; ?> <?php endif; ?>
</h4> </h4>
<div id="<?= isset($pinned) ? "pinned-" : "comment-" ?><?= $row['ID'] ?>-content" class="article-content<?php if ($is_deleted): ?> comment-deleted<?php endif; ?>"> <div id="<?= isset($pinned) ? "pinned-" : "comment-" ?><?= $row['ID'] ?>-content" class="article-content<?php if ($is_deleted): ?> comment-deleted<?php endif; ?>">
<?php if (!empty($row['RenderedComment'])): ?> <div>
<?= $row['RenderedComment'] ?> <?php if (!empty($row['RenderedComment'])): ?>
<?php else: ?> <?= $row['RenderedComment'] ?>
<p> <?php else: ?>
<?= parse_comment($row['Comments']) ?> <p>
</p> <?= parse_comment($row['Comments']) ?>
<?php endif; ?> </p>
<?php endif; ?>
</div>
</div> </div>
<?php endwhile; ?> <?php endwhile; ?>