From 149f014be54bbd8581b0d12a792999fc67d9497e Mon Sep 17 00:00:00 2001
From: Tian Gao <gaogaotiantian@hotmail.com>
Date: Sat, 24 Jun 2023 20:31:25 -0700
Subject: [PATCH] Fix a textarea bug, improve placeholder (#52)

---
 css/idcard.css  |  2 +-
 scripts/note.js |  4 ++--
 scripts/ui.js   | 11 ++++++-----
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/css/idcard.css b/css/idcard.css
index 3f32d5b..2ca2de7 100644
--- a/css/idcard.css
+++ b/css/idcard.css
@@ -291,7 +291,7 @@
     vertical-align: middle;
 }
 
-#biliscope-id-card #biliscope-note-textarea {
+#biliscope-id-card #biliscope-card-note-textarea {
     padding: 3px;
     border: 1px solid black;
     border-radius: 4px;
diff --git a/scripts/note.js b/scripts/note.js
index 8bebbe9..b61f763 100644
--- a/scripts/note.js
+++ b/scripts/note.js
@@ -28,12 +28,12 @@ var noteObserver = new MutationObserver((mutationList, observer) => {
                 <div class="be-textarea be-input--append">
                     <textarea
                         rows="${Math.max(3, (noteData[userId] || "").split("\n").length)}"
-                        placeholder="请输入备注\n换行后的内容将不显示在卡片上，只能在主页中查看"
+                        placeholder="请输入备注\n手动换行后的内容将不显示在卡片上，只能在主页中查看\n还可以加入#标签#"
                         type="textarea"
                         maxlength="5000"
                         class="be-textarea_inner"
                         style="resize: vertical"
-                        id="biliscope-note-textarea">${noteData[userId] || ""}</textarea>
+                        id="biliscope-note-textarea">\n${noteData[userId] || ""}</textarea>
                 </div>
             `;
             noteNode.getElementsByTagName("textarea")[0].addEventListener("blur", (ev) => {
diff --git a/scripts/ui.js b/scripts/ui.js
index dcedee9..afd2684 100644
--- a/scripts/ui.js
+++ b/scripts/ui.js
@@ -97,14 +97,15 @@ function getUserProfileCardDataHTML(data) {
                 </div>
                 <div class="idc-meta" id="biliscope-note-wrapper">
                     <div class="idc-meta-item"
-                          id="biliscope-note-text"
+                          id="biliscope-card-note-text"
                           ${noteDataToDisplay(noteData, data["mid"]) ? "": "hidden"}>${noteDataToDisplay(noteData, data["mid"])}</div>
                     <textarea class="idc-meta-item"
-                              id="biliscope-note-textarea"
+                              id="biliscope-card-note-textarea"
                               rows="3"
                               hidden
                               maxlength="5000"
-                              style="resize: vertical; width: 100%">${noteData[data["mid"]] || ""}</textarea>
+                              placeholder="给up加个备注（手动换行前的内容都将显示在卡片上）\n或者加几个#标签#"
+                              style="resize: vertical; width: 100%">\n${noteData[data["mid"]] || ""}</textarea>
                 </div>
                 <div class="idc-meta">
                     <span class="idc-meta-item"><data-title>关注</data-title> ${data["following"] || 0}</span>
@@ -390,8 +391,8 @@ UserProfileCard.prototype.drawVideoTags = function() {
 
 UserProfileCard.prototype.setupTriggers = function() {
     let userWrapper = document.getElementById("biliscope-username-wrapper");
-    let text = document.getElementById("biliscope-note-text");
-    let textarea = document.getElementById("biliscope-note-textarea");
+    let text = document.getElementById("biliscope-card-note-text");
+    let textarea = document.getElementById("biliscope-card-note-textarea");
 
     userWrapper.addEventListener("click", (ev) => {
         text.hidden = true;