.client
.statues(@scroll.passive="onScroll" v-show="!hasContext")
.header(v-if="hasNotifications") Accueil
success-loadable.list(:loadable="statues")
template(v-for="status in statues.get()")
status(v-if="showStatus(status)" :key="status.id" :status="status" :showMedia="options.showMedia" @mark="onStatusMark" @vote="onPollVote" @context="onShowContext")
.status(v-show="statues.loadingMore")
.service-loader
.context(v-if="hasContext")
.header(@click="closeContext")
| Context
span.date(@click.stop.prevent="closeContext") ❌
.list
.ancestors
template(v-if="targetContext.isSuccess")
status(v-for="status in targetContext.get().ancestors" :key="status.id" :status="status" :showMedia="options.showMedia" @mark="onStatusMark" @vote="onPollVote" @context="onShowContext")
.service-loader(v-else)
status.selected(:status="targetStatus" :showMedia="options.showMedia" @mark="onStatusMark" @vote="onPollVote" @context="closeContext")
.descendants
template(v-if="targetContext.isSuccess")
status(v-for="status in targetContext.get().descendants" :key="status.id" :status="status" :showMedia="options.showMedia" @mark="onStatusMark" @vote="onPollVote" @context="onShowContext")
.service-loader(v-else)
.notifications(v-if="hasNotifications")
.header
| Notifications
span.date(@click.stop.prevent="onNotificationsClear") ❌
.list
notification(v-for="notification in notifications.get()" :key="notification.id" :notification="notification"
:showMedia="options.showMedia" @dismiss="onNotificationDismiss" @mark="onStatusMark" @vote="onPollVote" @context="onShowContext")
.compose-toggle(@click="showCompose = !showCompose") 🖉
.emoji-list(v-if="options.showMedia" v-show="showCompose && showEmojis")
img.emoji(v-for="emoji in emojis.get()" @click="addEmoji(emoji.shortcode)" :src="emoji.static_url" :alt="emoji.shortcode" :title="emoji.shortcode")
.compose(v-show="showCompose")
textarea.content(v-model="compose.status" placeholder="message")
.options
.emojis
button(v-if="options.showMedia" @click="showEmojis = !showEmojis") ☺
select(v-else @change="addEmoji($event.target.value)")
option(v-for="emoji in emojis.get()" :value="emoji.shortcode") {{ emoji.shortcode }}
.sens
label.note(for="sensitive") Sensitive:
input(id="sensitive" v-model="compose.sensitive" type="checkbox")
.cw
input(v-show="compose.sensitive" v-model="compose.spoiler_text" placeholder="content warning")
.visibility
select(v-model="compose.visibility")
option(value="public") ◍
option(value="unlisted") 👁
option(value="private") ⚿
option(value="direct") ✉
span.note {{ compose.visibility }}
button(@click="sendStatus") Toot