better for mask bot

static/index.html

@@ -97,10 +97,6 @@
       margin: 0;
     }
 
-    .card-body {
-      padding: 0.75em;
-    }
-
     .behind {
       z-index: 98;
       cursor: pointer;
@@ -155,8 +151,13 @@
         <form action="" onsubmit="return post_status(event, '')">
           <div class="form-group qbox">
             <textarea class="form-control" name="text" rows="5" maxlength="5000" placeholder="啥?" required="required"></textarea>
-            <hr />
-            <button type="submit" class="btn btn-link">发布</button>
+            <div class="form-check mt-3 mb-3">
+              <input class="form-check-input" type="checkbox" value="" id="post-checkbox-an">
+              <label class="form-check-label" for="post-checkbox-an">
+                匿名
+              </label>
+            </div>
+            <button type="submit" class="btn btn-link btn-lg">发布</button>
           </div>
         </form>
       </div>
@@ -214,16 +215,19 @@
   function make_status_box_html(status, with_comment_list) {
     return (`
       <div class="qbox" id="status-${status.id.toString()}">
-        <img class="avatar" width="36" src="${status.account.avatar}">
+        <img class="avatar" width="24" src="${status.account.avatar}">
         <small>
-          ${status.account.display_name}@${status.account.acct}
+          ${status.account.acct === "mask_bot" ?
+            "匿名用户" + /^<p>(\[[^\]]*\]):/.exec(status.content)[1] : (
+              status.account.display_name + ' @' +status.account.acct)}
         </small>
         ${status.reblog && (status = status.reblog) && 
           `<small> 转发 @${status.account.acct}</small>` || ''}
         <div class="content">
-          ${status.content}
+          ${status.account.acct === "mask_bot" ?
+            status.content.replace(/^<p>\[([^\]]*)\]:<br \/>/, '<p>') : status.content}
         </div>
-        <div style="text-align:right;margin: 7px 0 -5px">
+        <div style="text-align:right;margin: 0px 0 -5px">
           <time class="timeago" datetime="${status.created_at}"
             title="${status.created_at}"></time>
           <a href="###" class="mr-3 like-btn ${status.favourited? 'liked' : ''}" 
@@ -241,9 +245,7 @@
         </div>
     `) + (with_comment_list ? (`
         <div class="collapse comment-list" id="collapse-${status.id.toString()}">
-          <div class="card card-body">
             加载中...
-          </div>
         </div>
     `) : '') + (`
       </div>
@@ -266,7 +268,13 @@
           coll.append(`
             <form action="" onsubmit="return post_status(event, '${sid}')">
               <div class="form-group qbox">
-                <textarea class="form-control" rows="3" maxlength="5000" required="required"></textarea>
+                <textarea class="form-control" rows="3" maxlength="5000" required="required" placeholder="我的回复"></textarea>
+                  <div class="form-check mt-1 mb-1">
+                  <input class="form-check-input" type="checkbox" value="" id="reply-${sid}-checkbox-an">
+                  <label class="form-check-label" for="reply-${sid}-checkbox-an">
+                    匿名
+                  </label>
+                </div>
                 <button type="submit" class="btn btn-link">添加回复</button>
               </div>
             </form>
@@ -330,9 +338,12 @@
     e.preventDefault();
     let form = $(e.target);
     let text = form.find('textarea').val();
+    if (form.find('input[type=checkbox]').is(':checked')) {
+      text += "\n匿了";
+    }
     $.post(
       `${base_api_url}api/v1/statuses`,
-      {'status': text, 'in_reply_to_id': sid || null},
+      {'status': text, 'in_reply_to_id': sid || null, 'visibility': 'public'},
       (status) => {
         form.find('textarea').val('');
         if (sid) {