feat: Some comment design tweaks

This commit is contained in:
aayush262 2024-04-03 22:21:27 +05:30
parent ba1725224a
commit 47b1940ace
4 changed files with 214 additions and 175 deletions

View file

@ -4,6 +4,7 @@ import android.annotation.SuppressLint
import android.content.Intent import android.content.Intent
import android.graphics.Color import android.graphics.Color
import android.view.View import android.view.View
import android.widget.PopupMenu
import androidx.core.content.ContextCompat import androidx.core.content.ContextCompat
import androidx.recyclerview.widget.LinearLayoutManager import androidx.recyclerview.widget.LinearLayoutManager
import ani.dantotsu.R import ani.dantotsu.R
@ -34,13 +35,15 @@ import java.util.TimeZone
import kotlin.math.abs import kotlin.math.abs
import kotlin.math.sqrt import kotlin.math.sqrt
class CommentItem(val comment: Comment, class CommentItem(
private val markwon: Markwon, val comment: Comment,
val parentSection: Section, private val markwon: Markwon,
private val commentsFragment: CommentsFragment, val parentSection: Section,
private val backgroundColor: Int, private val commentsFragment: CommentsFragment,
val commentDepth: Int private val backgroundColor: Int,
) : BindableItem<ItemCommentsBinding>() { val commentDepth: Int
) :
BindableItem<ItemCommentsBinding>() {
lateinit var binding: ItemCommentsBinding lateinit var binding: ItemCommentsBinding
val adapter = GroupieAdapter() val adapter = GroupieAdapter()
private var subCommentIds: MutableList<Int> = mutableListOf() private var subCommentIds: MutableList<Int> = mutableListOf()
@ -62,9 +65,6 @@ class CommentItem(val comment: Comment,
val isUserComment = CommentsAPI.userId == comment.userId val isUserComment = CommentsAPI.userId == comment.userId
val levelColor = getAvatarColor(comment.totalVotes, backgroundColor) val levelColor = getAvatarColor(comment.totalVotes, backgroundColor)
markwon.setMarkdown(viewBinding.commentText, comment.content) markwon.setMarkdown(viewBinding.commentText, comment.content)
viewBinding.commentDelete.visibility = if (isUserComment || CommentsAPI.isAdmin || CommentsAPI.isMod) View.VISIBLE else View.GONE
viewBinding.commentBanUser.visibility = if ((CommentsAPI.isAdmin || CommentsAPI.isMod) && !isUserComment) View.VISIBLE else View.GONE
viewBinding.commentReport.visibility = if (!isUserComment) View.VISIBLE else View.GONE
viewBinding.commentEdit.visibility = if (isUserComment) View.VISIBLE else View.GONE viewBinding.commentEdit.visibility = if (isUserComment) View.VISIBLE else View.GONE
if (comment.tag == null) { if (comment.tag == null) {
viewBinding.commentUserTagLayout.visibility = View.GONE viewBinding.commentUserTagLayout.visibility = View.GONE
@ -140,41 +140,71 @@ class CommentItem(val comment: Comment,
} }
viewBinding.modBadge.visibility = if (comment.isMod == true) View.VISIBLE else View.GONE viewBinding.modBadge.visibility = if (comment.isMod == true) View.VISIBLE else View.GONE
viewBinding.adminBadge.visibility = if (comment.isAdmin == true) View.VISIBLE else View.GONE viewBinding.adminBadge.visibility = if (comment.isAdmin == true) View.VISIBLE else View.GONE
viewBinding.commentDelete.setOnClickListener { viewBinding.commentInfo.setOnClickListener {
dialogBuilder(getAppString(R.string.delete_comment), getAppString(R.string.delete_comment_confirm)) { val popup = PopupMenu(commentsFragment.requireContext(), viewBinding.commentInfo)
CoroutineScope(Dispatchers.Main + SupervisorJob()).launch { popup.menuInflater.inflate(R.menu.profile_details_menu, popup.menu)
val success = CommentsAPI.deleteComment(comment.commentId) popup.menu.findItem(R.id.commentDelete)?.isVisible = isUserComment || CommentsAPI.isAdmin || CommentsAPI.isMod
if (success) { popup.menu.findItem(R.id.commentBanUser)?.isVisible = (CommentsAPI.isAdmin || CommentsAPI.isMod) && !isUserComment
snackString(R.string.comment_deleted) popup.menu.findItem(R.id.commentReport)?.isVisible = !isUserComment
parentSection.remove(this@CommentItem) popup.setOnMenuItemClickListener { item ->
} when (item.itemId) {
} R.id.commentReport -> {
} dialogBuilder(
} getAppString(R.string.report_comment),
viewBinding.commentBanUser.setOnClickListener { getAppString(R.string.report_comment_confirm)
dialogBuilder(getAppString(R.string.ban_user), getAppString(R.string.ban_user_confirm)) { ) {
CoroutineScope(Dispatchers.Main + SupervisorJob()).launch { CoroutineScope(Dispatchers.Main + SupervisorJob()).launch {
val success = CommentsAPI.banUser(comment.userId) val success = CommentsAPI.reportComment(
if (success) { comment.commentId,
snackString(R.string.user_banned) comment.username,
} commentsFragment.mediaName,
} comment.userId
} )
} if (success) {
viewBinding.commentReport.setOnClickListener { snackString(R.string.comment_reported)
dialogBuilder(getAppString(R.string.report_comment), getAppString(R.string.report_comment_confirm)) { }
CoroutineScope(Dispatchers.Main + SupervisorJob()).launch { }
val success = CommentsAPI.reportComment( }
comment.commentId, true
comment.username, }
commentsFragment.mediaName,
comment.userId R.id.commentDelete -> {
) dialogBuilder(
if (success) { getAppString(R.string.delete_comment),
snackString(R.string.comment_reported) getAppString(R.string.delete_comment_confirm)
) {
CoroutineScope(Dispatchers.Main + SupervisorJob()).launch {
val success = CommentsAPI.deleteComment(comment.commentId)
if (success) {
snackString(R.string.comment_deleted)
parentSection.remove(this@CommentItem)
}
}
}
true
}
R.id.commentBanUser -> {
dialogBuilder(
getAppString(R.string.ban_user),
getAppString(R.string.ban_user_confirm)
) {
CoroutineScope(Dispatchers.Main + SupervisorJob()).launch {
val success = CommentsAPI.banUser(comment.userId)
if (success) {
snackString(R.string.user_banned)
}
}
}
true
}
else -> {
false
} }
} }
} }
popup.show()
} }
//fill the icon if the user has liked the comment //fill the icon if the user has liked the comment
setVoteButtons(viewBinding) setVoteButtons(viewBinding)
@ -210,7 +240,6 @@ class CommentItem(val comment: Comment,
comment.upvotes -= 1 comment.upvotes -= 1
} }
comment.downvotes += if (voteType == -1) 1 else -1 comment.downvotes += if (voteType == -1) 1 else -1
notifyChanged() notifyChanged()
} }
} }

View file

@ -5,30 +5,39 @@
android:id="@+id/commentsCardView" android:id="@+id/commentsCardView"
android:layout_width="match_parent" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginStart="8dp" android:layout_marginHorizontal="8dp"
android:layout_marginTop="8dp" android:layout_marginTop="8dp"
android:layout_marginBottom="4dp"> android:layout_marginBottom="4dp">
<LinearLayout <LinearLayout
android:id="@+id/linearLayout5" android:id="@+id/linearLayout5"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:orientation="vertical" android:orientation="vertical"
android:paddingStart="0dp"
android:paddingEnd="8dp" android:paddingEnd="8dp"
app:layout_constraintStart_toStartOf="parent" app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"> app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.imageview.ShapeableImageView <com.google.android.material.card.MaterialCardView
android:id="@+id/commentUserAvatar" android:id="@+id/commentUserAvatarContainer"
style="@style/CircularImageView" android:layout_width="wrap_content"
android:layout_width="42dp" android:layout_height="wrap_content"
android:layout_height="42dp" android:layout_gravity="center"
android:layout_gravity="center_horizontal"
android:layout_marginTop="12dp" android:layout_marginTop="12dp"
android:scaleType="center" android:backgroundTint="@color/transparent"
app:srcCompat="@drawable/ic_round_add_circle_24" app:cardCornerRadius="64dp"
tools:ignore="ContentDescription,ImageContrastCheck" /> app:strokeColor="@color/transparent">
<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/commentUserAvatar"
android:layout_width="42dp"
android:layout_height="42dp"
android:layout_gravity="center"
app:srcCompat="@drawable/ic_round_add_circle_24"
tools:ignore="ContentDescription,ImageContrastCheck"
tools:tint="@color/bg_black_50" />
</com.google.android.material.card.MaterialCardView>
<LinearLayout <LinearLayout
@ -80,7 +89,7 @@
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginEnd="4dp" android:layout_marginEnd="4dp"
android:ellipsize="end" android:ellipsize="end"
android:fontFamily="@font/poppins_semi_bold" android:fontFamily="@font/poppins_bold"
android:paddingTop="1dp" android:paddingTop="1dp"
android:paddingBottom="0dp" android:paddingBottom="0dp"
android:singleLine="true" android:singleLine="true"
@ -160,86 +169,116 @@
android:textSize="12sp" android:textSize="12sp"
app:layout_constrainedWidth="true" app:layout_constrainedWidth="true"
app:layout_constraintEnd_toStartOf="@+id/linearLayout7" app:layout_constraintEnd_toStartOf="@+id/linearLayout7"
app:layout_constraintHeight_max="200dp" app:layout_constraintHeight_max="200dp"
app:layout_constraintHorizontal_bias="0.0" app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toEndOf="@+id/linearLayout5" app:layout_constraintStart_toEndOf="@+id/linearLayout5"
app:layout_constraintTop_toBottomOf="@+id/commentUserDetailsLayout" /> app:layout_constraintTop_toBottomOf="@+id/commentUserDetailsLayout" />
<TextView <LinearLayout
android:id="@+id/commentReply" android:id="@+id/linearLayout6"
android:layout_width="wrap_content" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_height="wrap_content"
android:layout_marginStart="10dp" android:layout_marginStart="52dp"
android:layout_marginEnd="12dp" android:orientation="horizontal"
android:alpha="0.6"
android:fontFamily="@font/poppins_semi_bold"
android:paddingTop="1dp"
android:paddingEnd="12dp"
android:text="Reply"
android:textSize="12sp"
app:layout_constraintStart_toEndOf="@+id/linearLayout5" app:layout_constraintStart_toEndOf="@+id/linearLayout5"
app:layout_constraintTop_toBottomOf="@+id/commentText" app:layout_constraintTop_toBottomOf="@+id/commentText">
tools:ignore="HardcodedText" />
<TextView <View
android:id="@+id/commentEdit" android:id="@+id/commentRepliesDivider"
android:layout_width="wrap_content" android:layout_width="24dp"
android:layout_height="wrap_content" android:layout_height="3dp"
android:layout_marginEnd="12dp" android:layout_gravity="center"
android:alpha="0.6" android:layout_marginStart="4dp"
android:fontFamily="@font/poppins_semi_bold" android:background="@color/nav_tab" />
android:paddingTop="1dp"
android:paddingEnd="12dp"
android:text="Edit"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/commentReply"
app:layout_constraintStart_toEndOf="@+id/commentReply"
tools:ignore="HardcodedText" />
<TextView <TextView
android:id="@+id/commentDelete" android:id="@+id/commentTotalReplies"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="match_parent"
android:layout_marginEnd="12dp" android:gravity="center"
android:alpha="0.6" android:layout_marginStart="4dp"
android:fontFamily="@font/poppins_semi_bold" android:alpha="0.6"
android:paddingTop="1dp" android:fontFamily="@font/poppins_semi_bold"
android:paddingEnd="12dp" android:text="View replies"
android:text="Delete" android:textSize="12sp"
android:textSize="12sp" tools:ignore="HardcodedText" />
app:layout_constraintBottom_toBottomOf="@+id/commentEdit" <Space
app:layout_constraintStart_toEndOf="@+id/commentEdit" android:layout_width="0dp"
tools:ignore="HardcodedText" /> android:layout_height="wrap_content"
android:layout_weight="1"/>
<TextView <ImageView
android:id="@+id/commentReport" android:id="@+id/commentInfo"
android:layout_width="wrap_content" android:layout_width="24dp"
android:layout_height="wrap_content" android:layout_height="24dp"
android:layout_marginEnd="12dp" android:alpha="0.6"
android:alpha="0.6" android:layout_marginEnd="16dp"
android:fontFamily="@font/poppins_semi_bold" app:srcCompat="@drawable/ic_round_dots_vertical_24"
android:paddingTop="1dp" tools:ignore="ContentDescription" />
android:paddingEnd="12dp"
android:text="Report"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/commentDelete"
app:layout_constraintStart_toEndOf="@+id/commentDelete"
tools:ignore="HardcodedText" />
<TextView <TextView
android:id="@+id/commentBanUser" android:id="@+id/commentReply"
android:layout_width="wrap_content" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_height="match_parent"
android:alpha="0.6" android:alpha="0.6"
android:fontFamily="@font/poppins_semi_bold" android:fontFamily="@font/poppins_semi_bold"
android:paddingTop="1dp" android:gravity="center"
android:text="Ban User" android:text="Reply"
android:textSize="12sp" android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/commentReport" app:layout_constraintStart_toEndOf="@+id/commentDownVote"
app:layout_constraintStart_toEndOf="@+id/commentReport" app:layout_constraintTop_toBottomOf="@+id/commentText"
tools:ignore="HardcodedText" /> tools:ignore="HardcodedText" />
<TextView
android:id="@+id/commentEdit"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginStart="12dp"
android:alpha="0.6"
android:gravity="center"
android:fontFamily="@font/poppins_semi_bold"
android:text="Edit"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/commentReply"
app:layout_constraintStart_toEndOf="@+id/commentReply"
tools:ignore="HardcodedText" />
<ImageView
android:id="@+id/commentUpVote"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_marginStart="12dp"
android:alpha="0.6"
android:padding="2dp"
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
tools:ignore="ContentDescription" />
<TextView
android:id="@+id/commentTotalVotes"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginStart="4dp"
android:alpha="0.6"
android:fontFamily="@font/poppins_semi_bold"
android:gravity="center"
android:text="100"
android:textSize="12sp"
app:layout_constraintStart_toEndOf="@+id/commentUpVote"
app:layout_constraintTop_toBottomOf="@+id/commentText"
tools:ignore="HardcodedText" />
<ImageView
android:id="@+id/commentDownVote"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_marginStart="4dp"
android:alpha="0.6"
android:padding="2dp"
android:rotation="180"
app:layout_constraintStart_toEndOf="@+id/commentTotalVotes"
app:layout_constraintTop_toBottomOf="@+id/commentText"
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
tools:ignore="ContentDescription" />
</LinearLayout>
<LinearLayout <LinearLayout
android:id="@+id/linearLayout7" android:id="@+id/linearLayout7"
@ -251,60 +290,10 @@
app:layout_constraintEnd_toEndOf="parent" app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"> app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="@+id/commentUpVote"
android:layout_width="24dp"
android:layout_height="24dp"
android:alpha="0.4"
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
tools:ignore="ContentDescription" />
<TextView
android:id="@+id/commentTotalVotes"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:alpha="0.6"
android:fontFamily="@font/poppins_semi_bold"
android:text="100"
android:textSize="12sp"
tools:ignore="HardcodedText" />
<ImageView
android:id="@+id/commentDownVote"
android:layout_width="24dp"
android:layout_height="24dp"
android:alpha="0.4"
android:rotation="180"
app:srcCompat="@drawable/ic_round_upvote_inactive_24"
tools:ignore="ContentDescription" />
</LinearLayout> </LinearLayout>
<View
android:id="@+id/commentRepliesDivider"
android:layout_width="32dp"
android:layout_height="3dp"
android:layout_gravity="center"
android:layout_marginStart="4dp"
android:layout_marginTop="8dp"
android:background="@color/nav_tab"
app:layout_constraintStart_toEndOf="@+id/linearLayout5"
app:layout_constraintTop_toBottomOf="@+id/commentReply" />
<TextView
android:id="@+id/commentTotalReplies"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:alpha="0.8"
android:fontFamily="@font/poppins_semi_bold"
android:text="View replies"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/commentRepliesDivider"
app:layout_constraintStart_toEndOf="@+id/commentRepliesDivider"
app:layout_constraintTop_toTopOf="@+id/commentRepliesDivider"
tools:ignore="HardcodedText" />
<androidx.recyclerview.widget.RecyclerView <androidx.recyclerview.widget.RecyclerView
@ -314,8 +303,8 @@
android:nestedScrollingEnabled="false" android:nestedScrollingEnabled="false"
android:paddingStart="16dp" android:paddingStart="16dp"
android:visibility="visible" android:visibility="visible"
app:layout_constraintTop_toBottomOf="@+id/commentRepliesDivider" app:layout_constraintTop_toBottomOf="@+id/linearLayout6"
tools:ignore="RtlSymmetry" tools:ignore="RtlSymmetry"
tools:visibility="visible" /> tools:visibility="gone" />
</androidx.constraintlayout.widget.ConstraintLayout> </androidx.constraintlayout.widget.ConstraintLayout>

View file

@ -0,0 +1,19 @@
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/commentDelete"
android:enabled="true"
android:icon="@drawable/ic_round_comment_24"
android:title="@string/delete" />
<item
android:id="@+id/commentReport"
android:enabled="true"
android:icon="@drawable/ic_round_info_24"
android:title="@string/report" />
<item
android:id="@+id/commentBanUser"
android:enabled="true"
android:icon="@drawable/ic_round_comment_24"
android:title="@string/ban" />
</menu>

View file

@ -866,4 +866,6 @@ Non quae tempore quo provident laudantium qui illo dolor vel quia dolor et exerc
<string name="trending_manhwa">Trending Manhwa</string> <string name="trending_manhwa">Trending Manhwa</string>
<string name="liked_by">Liked By</string> <string name="liked_by">Liked By</string>
<string name="adult_only_content">Adult only content</string> <string name="adult_only_content">Adult only content</string>
<string name="report">Report</string>
<string name="ban">Ban</string>
</resources> </resources>