From 50aa379038771da3725e6864c40007ae12896232 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 7 Jun 2021 18:41:55 +0300
Subject: new component - StatusText, to separate post's text from its
 attachments

---
 src/components/status_text/status_text.vue | 95 ++++++++++++++++++++++++++++++
 1 file changed, 95 insertions(+)
 create mode 100644 src/components/status_text/status_text.vue

(limited to 'src/components/status_text/status_text.vue')

diff --git a/src/components/status_text/status_text.vue b/src/components/status_text/status_text.vue
new file mode 100644
index 00000000..bf723e15
--- /dev/null
+++ b/src/components/status_text/status_text.vue
@@ -0,0 +1,95 @@
+<template>
+  <div class="StatusText">
+    <div
+      v-if="status.summary_html"
+      class="summary-wrapper"
+      :class="{ 'tall-subject': (longSubject && !showingLongSubject) }"
+    >
+      <RichContent
+        class="media-body summary"
+        :html="status.summary_raw_html"
+        :emoji="status.emojis"
+        @click.prevent="linkClicked"
+      />
+      <button
+        v-if="longSubject && showingLongSubject"
+        class="button-unstyled -link tall-subject-hider"
+        @click.prevent="showingLongSubject=false"
+        >
+        {{ $t("status.hide_full_subject") }}
+      </button>
+      <button
+        v-else-if="longSubject"
+        class="button-unstyled -link tall-subject-hider"
+        :class="{ 'tall-subject-hider_focused': focused }"
+        @click.prevent="showingLongSubject=true"
+      >
+        {{ $t("status.show_full_subject") }}
+      </button>
+    </div>
+    <div
+      :class="{'tall-status': hideTallStatus}"
+      class="status-content-wrapper"
+      >
+      <button
+        v-if="hideTallStatus"
+        class="button-unstyled -link tall-status-hider"
+        :class="{ 'tall-status-hider_focused': focused }"
+        @click.prevent="toggleShowMore"
+      >
+        {{ $t("general.show_more") }}
+      </button>
+      <RichContent
+        v-if="!hideSubjectStatus"
+        :class="{ 'single-line': singleLine }"
+        class="status-content media-body"
+        :html="postBodyHtml"
+        :emoji="status.emojis"
+        :handleLinks="true"
+        @click.prevent="linkClicked"
+        />
+      <button
+        v-if="hideSubjectStatus"
+        class="button-unstyled -link cw-status-hider"
+        @click.prevent="toggleShowMore"
+        >
+        {{ $t("status.show_content") }}
+        <FAIcon
+          v-if="attachmentTypes.includes('image')"
+          icon="image"
+          />
+        <FAIcon
+          v-if="attachmentTypes.includes('video')"
+          icon="video"
+          />
+        <FAIcon
+          v-if="attachmentTypes.includes('audio')"
+          icon="music"
+          />
+        <FAIcon
+          v-if="attachmentTypes.includes('unknown')"
+          icon="file"
+          />
+        <FAIcon
+          v-if="status.poll && status.poll.options"
+          icon="poll-h"
+          />
+        <FAIcon
+          v-if="status.card"
+          icon="link"
+          />
+      </button>
+      <button
+        v-if="showingMore && !fullContent"
+        class="button-unstyled -link status-unhider"
+        @click.prevent="toggleShowMore"
+        >
+        {{ tallStatus ? $t("general.show_less") : $t("status.hide_content") }}
+      </button>
+    </div>
+    <div v-if="!hideSubjectStatus">
+      <slot/>
+    </div>
+  </div>
+</template>
+<script src="./status_text.js" ></script>
-- 
cgit v1.2.3-70-g09d2