前端richContent改名为contentParts

2026-08-19 09:43:28 +08:00 · 2025-04-13 17:31:10 +08:00
parent d2990ba8d8
commit 491dbb4fd9
4 changed files with 39 additions and 39 deletions
--- a/frontend/src/components/ChatRenderer/TextMessage.vue
+++ b/frontend/src/components/ChatRenderer/TextMessage.vue
@@ -9,10 +9,10 @@
        :isInMemberMessage="false" :authorName="authorName" :authorType="authorType" :privilegeType="privilegeType"
      ></author-chip>
      <span id="message" class="style-scope yt-live-chat-text-message-renderer">
-        <template v-for="(content, index) in richContent">
-          <span :key="index" v-if="content.type === CONTENT_TYPE_TEXT">{{ content.text }}</span>
+        <template v-for="(content, index) in contentParts">
+          <span :key="index" v-if="content.type === CONTENT_PART_TYPE_TEXT">{{ content.text }}</span>
          <!-- 如果CSS设置的尺寸比属性设置的尺寸还大，在图片加载完后布局会变化，可能导致滚动卡住，没什么好的解决方法 -->
-          <img :key="index" v-else-if="content.type === CONTENT_TYPE_IMAGE"
+          <img :key="index" v-else-if="content.type === CONTENT_PART_TYPE_IMAGE"
            class="emoji yt-formatted-string style-scope yt-live-chat-text-message-renderer"
            :src="content.url" :alt="content.text" :shared-tooltip-text="content.text" :id="`emoji-${content.text}`"
            :width="content.width" :height="content.height"
@@ -48,14 +48,14 @@ export default {
    time: Date,
    authorName: String,
    authorType: Number,
-    richContent: Array,
+    contentParts: Array,
    privilegeType: Number,
    repeated: Number
  },
  data() {
    return {
-      CONTENT_TYPE_TEXT: constants.CONTENT_TYPE_TEXT,
-      CONTENT_TYPE_IMAGE: constants.CONTENT_TYPE_IMAGE
+      CONTENT_PART_TYPE_TEXT: constants.CONTENT_PART_TYPE_TEXT,
+      CONTENT_PART_TYPE_IMAGE: constants.CONTENT_PART_TYPE_IMAGE
    }
  },
  computed: {
--- a/frontend/src/components/ChatRenderer/constants.js
+++ b/frontend/src/components/ChatRenderer/constants.js
@@ -34,8 +34,8 @@ export const MESSAGE_TYPE_SUPER_CHAT = 3
 export const MESSAGE_TYPE_DEL = 4
 export const MESSAGE_TYPE_UPDATE = 5

-export const CONTENT_TYPE_TEXT = 0
-export const CONTENT_TYPE_IMAGE = 1
+export const CONTENT_PART_TYPE_TEXT = 0
+export const CONTENT_PART_TYPE_IMAGE = 1

 // 美元 -> 人民币 汇率
 const EXCHANGE_RATE = 7
@@ -173,15 +173,15 @@ export function getShowContent(message) {
  return message.content
 }

-export function getShowRichContent(message) {
-  let richContent = [...message.richContent]
+export function getShowContentParts(message) {
+  let contentParts = [...message.contentParts]
  if (message.translation) {
-    richContent.push({
-      type: CONTENT_TYPE_TEXT,
+    contentParts.push({
+      type: CONTENT_PART_TYPE_TEXT,
      text: `（${message.translation}）`
    })
  }
-  return richContent
+  return contentParts
 }

 export function getGiftShowContent(message, showGiftName) {
--- a/frontend/src/components/ChatRenderer/index.vue
+++ b/frontend/src/components/ChatRenderer/index.vue
@@ -17,7 +17,7 @@
                :authorName="message.authorName"
                :authorType="message.authorType"
                :privilegeType="message.privilegeType"
-                :richContent="getShowRichContent(message)"
+                :contentParts="getShowContentParts(message)"
                :repeated="message.repeated"
              ></text-message>
              <paid-message :key="message.id" v-else-if="message.type === MESSAGE_TYPE_GIFT"
@@ -153,7 +153,7 @@ export default {
    },
    getGiftShowNameAndNum: constants.getGiftShowNameAndNum,
    getShowContent: constants.getShowContent,
-    getShowRichContent: constants.getShowRichContent,
+    getShowContentParts: constants.getShowContentParts,
    getShowAuthorName: constants.getShowAuthorName,

    addMessage(message) {
--- a/frontend/src/views/Room.vue
+++ b/frontend/src/views/Room.vue
@@ -380,7 +380,7 @@ export default {
      if (!this.config.showDanmaku || !this.filterTextMessage(data)) {
        return
      }
-      let richContent = await this.getRichContent(data)
+      let contentParts = await this.parseContentParts(data)
      // 合并要放在异步调用后面，因为异步调用后可能有新的消息，会漏合并
      if (this.mergeSimilarText(data.content)) {
        return
@@ -393,7 +393,7 @@ export default {
        authorName: data.authorName,
        authorType: data.authorType,
        content: data.content,
-        richContent: richContent,
+        contentParts: contentParts,
        privilegeType: data.privilegeType,
        repeated: 1,
        translation: data.translation
@@ -557,29 +557,29 @@ export default {
      }
      return this.pronunciationConverter.getPronunciation(text)
    },
-    async getRichContent(data) {
-      let richContent = []
+    async parseContentParts(data) {
+      let contentParts = []

      // 官方的非文本表情
      if (data.emoticon !== null) {
-        richContent.push({
-          type: constants.CONTENT_TYPE_IMAGE,
+        contentParts.push({
+          type: constants.CONTENT_PART_TYPE_IMAGE,
          text: data.content,
          url: data.emoticon,
          width: 0,
          height: 0
        })
-        await this.fillImageContentSizes(richContent)
-        return richContent
+        await this.fillImageContentSizes(contentParts)
+        return contentParts
      }

      // 没有文本表情，只能是纯文本
      if (this.config.emoticons.length === 0 && this.textEmoticons.length === 0) {
-        richContent.push({
-          type: constants.CONTENT_TYPE_TEXT,
+        contentParts.push({
+          type: constants.CONTENT_PART_TYPE_TEXT,
          text: data.content
        })
-        return richContent
+        return contentParts
      }

      // 可能含有文本表情，需要解析
@@ -596,15 +596,15 @@ export default {

        // 加入之前的文本
        if (pos !== startPos) {
-          richContent.push({
-            type: constants.CONTENT_TYPE_TEXT,
+          contentParts.push({
+            type: constants.CONTENT_PART_TYPE_TEXT,
            text: data.content.slice(startPos, pos)
          })
        }

        // 加入表情
-        richContent.push({
-          type: constants.CONTENT_TYPE_IMAGE,
+        contentParts.push({
+          type: constants.CONTENT_PART_TYPE_IMAGE,
          text: matchEmoticon.keyword,
          url: matchEmoticon.url,
          width: 0,
@@ -615,19 +615,19 @@ export default {
      }
      // 加入尾部的文本
      if (pos !== startPos) {
-        richContent.push({
-          type: constants.CONTENT_TYPE_TEXT,
+        contentParts.push({
+          type: constants.CONTENT_PART_TYPE_TEXT,
          text: data.content.slice(startPos, pos)
        })
      }

-      await this.fillImageContentSizes(richContent)
-      return richContent
+      await this.fillImageContentSizes(contentParts)
+      return contentParts
    },
-    async fillImageContentSizes(richContent) {
+    async fillImageContentSizes(contentParts) {
      let urlSizeMap = new Map()
-      for (let content of richContent) {
-        if (content.type === constants.CONTENT_TYPE_IMAGE) {
+      for (let content of contentParts) {
+        if (content.type === constants.CONTENT_PART_TYPE_IMAGE) {
          urlSizeMap.set(content.url, { width: 0, height: 0 })
        }
      }
@@ -657,8 +657,8 @@ export default {
      }
      await Promise.all(promises)

-      for (let content of richContent) {
-        if (content.type === constants.CONTENT_TYPE_IMAGE) {
+      for (let content of contentParts) {
+        if (content.type === constants.CONTENT_PART_TYPE_IMAGE) {
          let size = urlSizeMap.get(content.url)
          content.width = size.width
          content.height = size.height