Wall: Last comments on the post

This commit is contained in:
veselcraft 2021-11-28 14:39:42 +03:00
parent 7778dd7d38
commit 03dee6b1f0
No known key found for this signature in database
GPG key ID: AED66BC1AC628A4E
10 changed files with 87 additions and 33 deletions

View file

@ -73,10 +73,10 @@ abstract class Postable extends Attachable
{ {
return (new Comments)->getCommentsCountByTarget($this); return (new Comments)->getCommentsCountByTarget($this);
} }
function getLastComments() function getLastComments(int $count): \Traversable
{ {
return (new Comments)->getLastCommentsByTarget($this); return (new Comments)->getLastCommentsByTarget($this, $count);
} }
function getLikesCount(): int function getLikesCount(): int

View file

@ -37,6 +37,19 @@ class Comments
foreach($comments as $comment) foreach($comments as $comment)
yield $this->toComment($comment); yield $this->toComment($comment);
} }
function getLastCommentsByTarget(Postable $target, ?int $count = NULL): \Traversable
{
$comments = $this->comments->where([
"model" => get_class($target),
"target" => $target->getId(),
"deleted" => false,
])->page(1, $count ?? OPENVK_DEFAULT_PER_PAGE)->order("created DESC");
$comments = array_reverse(iterator_to_array($comments));
foreach($comments as $comment)
yield $this->toComment($comment);
}
function getCommentsCountByTarget(Postable $target): int function getCommentsCountByTarget(Postable $target): int
{ {

View file

@ -24,7 +24,7 @@
{foreach $posts as $post} {foreach $posts as $post}
<a name="postGarter={$post->getId()}"></a> <a name="postGarter={$post->getId()}"></a>
{include "../components/post.xml", post => $post} {include "../components/post.xml", post => $post, commentSection => true}
{/foreach} {/foreach}
{include "../components/paginator.xml", conf => $paginatorConf} {include "../components/paginator.xml", conf => $paginatorConf}
{else} {else}

View file

@ -1,20 +1,19 @@
{var author = $comment->getOwner()} {var author = $comment->getOwner()}
<a name="cid={$comment->getId()}"></a> <a name="cid={$comment->getId()}"></a>
<table border="0" style="font-size: 11px;" class="post" id="_comment{$comment->getId()}" data-comment-id="{$comment->getId()}" data-owner-id="{$author->getId()}"> <table border="0" style="font-size: 11px;" class="post comment" id="_comment{$comment->getId()}" data-comment-id="{$comment->getId()}" data-owner-id="{$author->getId()}">
<tbody> <tbody>
<tr> <tr>
<td width="54" valign="top"> <td width="30" valign="top">
<img <img
src="{$author->getAvatarURL()}" src="{$author->getAvatarURL()}"
width="50" /> width="30" />
</td> </td>
<td width="345" valign="top"> <td width="345" valign="top">
<div class="post-author"> <div class="post-author">
<a href="{$author->getURL()}"><b> <a href="{$author->getURL()}"><b>
{$author->getCanonicalName()} {$author->getCanonicalName()}
</b></a> {$author->isFemale() ? tr("post_writes_f") : tr("post_writes_m")}<br/> </b></a><br/>
<a href="#_comment{$comment->getId()}" class="date">{$comment->getPublicationTime()}</a>
</div> </div>
<div class="post-content" id="{$comment->getId()}"> <div class="post-content" id="{$comment->getId()}">
<div class="text" id="text{$comment->getId()}"> <div class="text" id="text{$comment->getId()}">
@ -27,16 +26,15 @@
</div> </div>
</div> </div>
<div n:if="isset($thisUser) &&! ($compact ?? false)" class="post-menu"> <div n:if="isset($thisUser) &&! ($compact ?? false)" class="post-menu">
<a href="#_comment{$comment->getId()}" class="date">{$comment->getPublicationTime()}</a>&nbsp;|
{var canDelete = $comment->getOwner()->getId() == $thisUser->getId()} {var canDelete = $comment->getOwner()->getId() == $thisUser->getId()}
{var canDelete = $canDelete || $comment->getTarget()->getOwner()->getId() == $thisUser->getId()} {var canDelete = $canDelete || $comment->getTarget()->getOwner()->getId() == $thisUser->getId()}
{if $canDelete} {if $canDelete}
<a href="/comment{$comment->getId()}/delete">{_"delete"}</a>&nbsp;|&nbsp; <a href="/comment{$comment->getId()}/delete">{_"delete"}</a>&nbsp;|
{/if} {/if}
<a class="comment-reply">Ответить</a> <a class="comment-reply">Ответить</a>
<div style="float: right; font-size: .7rem;"> <div style="float: right; font-size: .7rem;">
<a href="/comment{$comment->getId()}/like?hash={rawurlencode($csrfToken)}"> <a class="post-like-button" href="/comment{$comment->getId()}/like?hash={rawurlencode($csrfToken)}">
<div class="heart" style="{if $comment->hasLikeFrom($thisUser)}opacity: 1;{else}opacity: 0.4;{/if}"></div> <div class="heart" style="{if $comment->hasLikeFrom($thisUser)}opacity: 1;{else}opacity: 0.4;{/if}"></div>
<span class="likeCnt">{$comment->getLikesCount()}</span> <span class="likeCnt">{$comment->getLikesCount()}</span>
</a> </a>

View file

@ -6,7 +6,7 @@
{/if} {/if}
{if $microblogEnabled} {if $microblogEnabled}
{include "post/microblogpost.xml", post => $post, diff => $diff} {include "post/microblogpost.xml", post => $post, diff => $diff, commentSection => $commentSection}
{else} {else}
{include "post/oldpost.xml", post => $post, diff => $diff} {include "post/oldpost.xml", post => $post, diff => $diff}
{/if} {/if}

View file

@ -1,4 +1,8 @@
{var author = $post->getOwner()} {var author = $post->getOwner()}
{var comments = $post->getLastComments(3)}
{var commentsCount = $post->getCommentsCount()}
{var commentTextAreaId = $post === null ? rand(1,300) : $post->getId()}
<table border="0" style="font-size: 11px;" n:class="post, !$compact ? post-divider, $post->isExplicit() ? post-nsfw"> <table border="0" style="font-size: 11px;" n:class="post, !$compact ? post-divider, $post->isExplicit() ? post-nsfw">
<tbody> <tbody>
@ -72,18 +76,11 @@
&nbsp; &nbsp;
{if !($forceNoCommentsLink ?? false)} {if !($forceNoCommentsLink ?? false)}
<a href="/wall{$post->getPrettyId()}#comments"> <a n:if="$commentsCount == 0" href="javascript:expand_comment_textarea({$commentTextAreaId})">
{if $post->getCommentsCount() > 0} {_"comment"}
{_"comments"} (<b>{$post->getCommentsCount()}</b>)
{else}
{_"comments"}
{/if}
</a> </a>
{/if} {/if}
<div class="like_wrap"> <div class="like_wrap">
<a class="post-share-button" href="javascript:repostPost('{$post->getPrettyId()}', '{rawurlencode($csrfToken)}')"> <a class="post-share-button" href="javascript:repostPost('{$post->getPrettyId()}', '{rawurlencode($csrfToken)}')">
<div class="repost-icon" style="opacity: 0.4;"></div> <div class="repost-icon" style="opacity: 0.4;"></div>
@ -101,8 +98,17 @@
</div> </div>
{/if} {/if}
</div> </div>
<div n:if="isset($thisUser) &&! ($compact ?? false)" class="post-menu-s"> <div n:if="$commentSection == true && $compact == false" class="post-menu-s">
<!-- kosfurler --> {if $commentsCount > 3}
<a href="/wall{$post->getPrettyId()}" class="expand_button">Посмотреть остальные комментарии</a>
{/if}
{foreach $comments as $comment}
{include "../comment.xml", comment => $comment, $compact => true}
{/foreach}
<div n:ifset="$thisUser" id="commentTextArea{$commentTextAreaId}" n:attr="style => ($commentsCount == 0 ? 'display: none;')" class="commentsTextFieldWrap">
{var commentsURL = "/al_comments.pl/create/posts/" . $post->getId()}
{include "../textArea.xml", route => $commentsURL, postOpts => false, graffiti => (bool) ovkGetQuirk("comments.allow-graffiti"), post => $post}
</div>
</div> </div>
</td> </td>
</tr> </tr>

View file

@ -1,10 +1,12 @@
<div id="write" style="padding: 5px 0;" onfocusin="expand_wall_textarea();"> {var textAreaId = $post === null ? rand(1,300) : $post->getId()}
<div id="write" style="padding: 5px 0;" onfocusin="expand_wall_textarea({$textAreaId});">
<form action="{$route}" method="post" enctype="multipart/form-data" style="margin:0;"> <form action="{$route}" method="post" enctype="multipart/form-data" style="margin:0;">
<textarea id="wall-post-input" placeholder="{_write}" name="text" style="width: 100%;resize: none;" class="small-textarea"></textarea> <textarea id="wall-post-input{$textAreaId}" placeholder="{_write}" name="text" style="width: 100%;resize: none;" class="small-textarea"></textarea>
<div> <div>
<!-- padding to fix <br/> bug --> <!-- padding to fix <br/> bug -->
</div> </div>
<div id="post-buttons" style="display: none;"> <div id="post-buttons{$textAreaId}" style="display: none;">
<div class="post-upload"> <div class="post-upload">
Вложение: <span>(unknown)</span> Вложение: <span>(unknown)</span>
</div> </div>

View file

@ -16,7 +16,7 @@
{foreach $posts as $post} {foreach $posts as $post}
<a name="postGarter={$post->getId()}"></a> <a name="postGarter={$post->getId()}"></a>
{include "../components/post.xml", post => $post} {include "../components/post.xml", post => $post, commentSection => true}
{/foreach} {/foreach}
{include "../components/paginator.xml", conf => $paginatorConf} {include "../components/paginator.xml", conf => $paginatorConf}
{else} {else}

View file

@ -36,6 +36,11 @@
color: grey; color: grey;
} }
.comment {
padding: 5px 0 0 0;
border-top: 1px #ddd solid;
}
.like_wrap { .like_wrap {
display: flex; display: flex;
} }
@ -56,6 +61,10 @@
opacity: 0.4; opacity: 0.4;
} }
.likeCnt {
float: none;
}
#liked { #liked {
opacity: 1 !important; opacity: 1 !important;
} }
@ -104,3 +113,24 @@
.post-author .pin:hover { .post-author .pin:hover {
opacity: 0.4; opacity: 0.4;
} }
.expand_button {
background-color: #eee;
width: 100%;
display: inline-block;;
height: 30px;
line-height: 28px;
text-align: center;
}
.expand_button:hover {
background-color: #e5e5e5;
}
.commentsTextFieldWrap {
padding: 0 7px;
background-color: #eee;
border: 1px solid #ccc;
border-left: 0;
border-right: 0;
}

View file

@ -1,10 +1,15 @@
function expand_wall_textarea() { function expand_wall_textarea(id) {
var el = document.getElementById('post-buttons'); var el = document.getElementById('post-buttons'+id);
var wi = document.getElementById('wall-post-input'); var wi = document.getElementById('wall-post-input'+id);
el.style.display = "block"; el.style.display = "block";
wi.className = "expanded-textarea"; wi.className = "expanded-textarea";
}
function expand_comment_textarea(id) {
var el = document.getElementById('commentTextArea'+id);
var wi = document.getElementById('wall-post-input'+id);
el.style.display = "block";
wi.focus();
} }
function edit_post(id, wid) { function edit_post(id, wid) {