Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 25 additions & 20 deletions src/views/Posts.vue
Original file line number Diff line number Diff line change
Expand Up @@ -126,7 +126,7 @@
<div v-if="!post._deleted && !post.user.ignored" class="post-block-grid">
<!-- Post Profile Section -->
<div class="post-user">
<router-link :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id }}">
<router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id }}">
<div class="user-avatar" :class="defaultAvatarShape">
<span v-if="post.user.online" class="online green" :data-balloon="post.user.username + ' is online'">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
Expand All @@ -141,10 +141,15 @@
<router-link class="hide-mobile" :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id } }">
<div class="original-poster" v-if="post.user.original_poster">OP</div>
<div v-if="post.user.title" :title="('Title: ' + post.user.title)" class="user-activity"><span class="user-activity-value">{{post.user.title}}</span></div>
<div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity}}</span></div>
<div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit}}</span></div>
<div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity || 0}}</span></div>
<div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit || 0}}</span></div>
</router-link>
</router-link>
<div v-if="!post.user.username">
<div class="user-avatar" :class="defaultAvatarShape">
<img :src="post.avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
</div>
</div>

<div class="user-trust" v-if="loggedIn && postData.data.thread.trust_visible">
<trust-display :user="post.user" />
Expand All @@ -160,20 +165,23 @@
<div class="show-mobile">
<div class="post-title-mobile">
<div class="post-title-user">
<span class="username" :data-balloon="post.user.role_name || 'User'"><router-link :to="{ path: '/profile/' + post.user.username.toLowerCase() }">
<span v-html="post.user.username"></span>
</router-link></span>
<span class="username" :data-balloon="post.user.role_name || 'User'">
<router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase() }">
<span v-html="post.user.username"></span>
</router-link>
<span v-if="!post.user.username">Anonymous</span>
</span>
<div :title="post.user.name" v-if="post.user.name" class="display-name">
<span>{{truncate(post.user.name, 33)}}</span>
<span class="hide-mobile">&nbsp;&mdash;&nbsp;</span>
</div>
<div :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
<div v-if="post.user.id != 0" :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
</div>
<router-link :to="{ path: '/profile/' + post.user.username.toLowerCase() }" class="user-activity-mobile">
<router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase() }" class="user-activity-mobile">
<div class="original-poster" v-if="post.user.original_poster">OP</div>
<div v-if="post.user.title" :title="('Title: ' + post.user.title)" class="user-activity"><span class="user-activity-value">{{post.user.title}}</span></div>
<div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity}}</span></div>
<div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit}}</span></div>
<div v-if="post.user.activity > -1" :title="('Activity: ' + post.user.activity)" class="user-activity">Activity: <span class="user-activity-value">{{post.user.activity || 0}}</span></div>
<div v-if="post.user.merit > -1" :title="('Merit: ' + post.user.merit)" class="user-activity">Merit: <span class="user-activity-value">{{post.user.merit || 0}}</span></div>
</router-link>
<div class="timestamp">
<span>{{humanDate(post.created_at)}}</span>
Expand All @@ -191,14 +199,17 @@
<!-- Post Title -->
<div class="hide-mobile post-title">
<div class="post-title-user">
<span class="username" :data-balloon="post.user.role_name || 'User'"><router-link :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id } }">
<span v-html="post.user.username"></span>
</router-link></span>
<span class="username" :data-balloon="post.user.role_name || 'User'">
<router-link v-if="post.user.username" :to="{ path: '/profile/' + post.user.username.toLowerCase(), query: { id: post.user.id } }">
<span v-html="post.user.username"></span>
</router-link>
<span v-if="!post.user.username">Anonymous</span>
</span>
<div :title="post.user.name" v-if="post.user.name" class="display-name">
<span>{{truncate(post.user.name, 33)}}</span>
<span class="hide-mobile">&nbsp;&mdash;&nbsp;</span>
</div>
<div :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
<div v-if="post.user.id != 0" :title="post.user.role_name || 'user'" class="user-role" :style="userRoleHighlight(post.user.highlight_color)">{{post.user.role_name || 'user'}}</div>
<div class="timestamp">
<span>{{humanDate(post.created_at)}}</span>
<span v-if="showEditDate(post) && post.metadata?.edited_by_username">{{'&nbsp;&mdash;&nbsp;Edited ' + humanDate(post.updated_at) + ' by '}}</span><a v-if="showEditDate(post) && post.metadata?.edited_by_username" href="#">{{post.metadata.edited_by_username}}</a>
Expand Down Expand Up @@ -1538,9 +1549,6 @@ ad-viewer {
color: $base-font-color;
font-size: $font-size-sm;
font-weight: 600;
&:hover {
color: $color-primary;
}
}

.user-role {
Expand Down Expand Up @@ -1605,9 +1613,6 @@ ad-viewer {
margin-right: 0.25rem;
color: $base-font-color;
font-weight: 600;
&:hover {
color: $color-primary;
}
}

.user-role {
Expand Down
38 changes: 27 additions & 11 deletions src/views/Threads.vue
Original file line number Diff line number Diff line change
Expand Up @@ -132,9 +132,10 @@
<div class="started-by">
Started by
<span v-if="thread.user.deleted">deleted</span>
<router-link v-if="!thread.user.deleted" :to="{ path: '/profile/' + thread?.user?.username.toLowerCase(), query: { id: thread?.user?.id } }">
<router-link v-if="!thread.user.deleted && thread.user.username" :to="{ path: '/profile/' + thread?.user?.username.toLowerCase(), query: { id: thread?.user?.id } }">
<span v-html="thread.user.username"></span>
</router-link>
<span v-if="!thread.user.username">Anonymous</span>
<span> on {{humanDate(thread.created_at)}}</span>
</div>
</td>
Expand All @@ -146,17 +147,22 @@

<td class="last-post">
<span v-if="thread.last_deleted">deleted</span>
<router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }"><img class="avatar-small" :class="defaultAvatarShape" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" /></router-link>
<router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
<router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
<img class="avatar-small" :class="defaultAvatarShape" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
</router-link>
<router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
<span v-html="thread.last_post_username"></span>
</router-link> posted on
</router-link>
<img v-if="!thread.last_deleted && !thread.last_post_username" class="avatar-small" :class="defaultAvatarShape" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
<span v-if="!thread.last_deleted && !thread.last_post_username">Anonymous</span>
posted on
<router-link :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.last_post_position }, hash: '#' + thread.last_post_id }"><span>{{humanDate(thread.last_post_created_at)}}</span>.</router-link>
<router-link v-if="thread.has_new_post" :to="{ name: 'Posts', params: { threadSlug: thread.slug, start: thread.latest_unread_position}, hash: '#' + thread.latest_unread_post_id }">(Last unread post)</router-link>
</td>
</tr>

<tr class="threads-data" v-for="thread in threadData.data.normal" :key="thread.id">
<td class="subject" v-if="thread.user.username">
<td class="subject">
<div class="title">
<div class="thread-state">
<svg class="is-unread" v-if="thread.has_new_post" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" data-balloon="Unread">
Expand Down Expand Up @@ -185,9 +191,10 @@
<div class="started-by">
Started by
<span v-if="thread.user.deleted">deleted</span>
<router-link v-if="!thread.user.deleted" :to="{ path: '/profile/' + thread.user.username.toLowerCase(), query: { id: thread.user.id } }">
<router-link v-if="!thread.user.deleted && thread.user.username" :to="{ path: '/profile/' + thread.user.username.toLowerCase(), query: { id: thread.user.id } }">
<span v-html="thread.user.username"></span>
</router-link>
<span v-if="!thread.user.username">Anonymous</span>
<span> on {{ humanDate(thread.created_at)}}</span>
</div>

Expand All @@ -196,16 +203,25 @@
</div>
</td>

<td class="views-replies" v-if="thread.user.username">
<td class="views-replies">
<span class="replies">{{ thread.is_proxy ? thread.post_count.toLocaleString() : (thread.post_count - 1).toLocaleString() || 0 }}</span>
<span class="views">{{ thread.view_count.toLocaleString() || 0 }}</span>

</td>

<td class="last-post" v-if="thread.user.username">
<td class="last-post">
<span v-if="thread.last_deleted">deleted</span>
<router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }"><img class="avatar-small" :class="defaultAvatar" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" /></router-link>
<router-link v-if="!thread.last_deleted" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }"><span v-html="thread.last_post_username"></span></router-link> posted on <router-link :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.last_post_position }, hash: '#' + thread.last_post_id }"><span>{{humanDate(thread.last_post_created_at)}}</span>.</router-link>
<router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
<img class="avatar-small" :class="defaultAvatar" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
</router-link>
<router-link v-if="!thread.last_deleted && thread.last_post_username" :to="{ path: '/profile/' + thread.last_post_username.toLowerCase(), query: { id: thread.last_post_user_id } }">
<span v-html="thread.last_post_username"></span>
</router-link>
<img v-if="!thread.last_deleted && !thread.last_post_username" class="avatar-small" :class="defaultAvatar" :src="thread.last_post_avatar || defaultAvatar" @error="$event.target.src=defaultAvatar" />
<span v-if="!thread.last_deleted && !thread.last_post_username">Anonymous</span>
posted on
<router-link :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.last_post_position }, hash: '#' + thread.last_post_id }">
<span>{{humanDate(thread.last_post_created_at)}}</span>.
</router-link>
<router-link v-if="thread.has_new_post" :to="{ name: 'Posts', params: { threadSlug: thread.slug }, query: { start: thread.latest_unread_position }, hash: '#' + thread.latest_unread_post_id }">(Last unread post)</router-link>
</td>
<td class="show-mobile">
Expand Down