easier to use

HoangTran0410 · HoangTran0410 · commit 64d409388e26 · 2024-03-18T23:00:44.000+07:00
diff --git a/scripts/fb_messengerCount.html b/scripts/fb_messengerCount.html
@@ -44,6 +44,10 @@
       text-decoration: none;
     }
 
+    table a:hover {
+      text-decoration: underline;
+    }
+
     input#search-inp {
       width: 50%;
       margin: auto;
@@ -70,17 +74,27 @@
     .avatar-list .avatar:not(:first-child) {
       margin-left: -20px;
     }
+
+    #searchCount {
+      font-weight: bold;
+    }
+
+    .center {
+      text-align: center;
+      font-size: 1.5em;
+    }
   </style>
 
 </head>
 
 <body>
   <h1>Useful script</h1>
   <h1>Facebook Messenger Count - Đếm tin nhắn Facebook</h1>
+  <p class="center">Tìm thấy <span id="searchCount">~</span> cuộc trò chuyện.</p>
   <input id="search-inp" type="text" placeholder="Tìm theo tên, rank, count, group...">
   <span>Gợi ý: Nhập ✅ để tìm tất cả tin nhắn group</span>
   <table></table>
   <script src="./fb_messengerCount_main.js"></script>
 </body>
 
-</html>
+</html>
diff --git a/scripts/fb_messengerCount.js b/scripts/fb_messengerCount.js
@@ -10,7 +10,6 @@ export default {
     en: "Counts the number of messages sent from your Facebook Messenger account.",
     vi: "Đếm tin nhắn từ tài khoản Facebook Messenger của bạn.",
   },
-  whiteList: ["https://*.facebook.com/*", "https://*.messenger.com/*"],
 
   onClickExtension: async () => {
     let { closeLoading, setLoadingText } = showLoading("Đang chuẩn bị...");
diff --git a/scripts/fb_messengerCount_main.js b/scripts/fb_messengerCount_main.js
@@ -1,9 +1,16 @@
 const inputSearch = document.querySelector("#search-inp");
 const tableDiv = document.querySelector("table");
+const searchCount = document.querySelector("#searchCount");
+
+function numberWithCommas(x) {
+  return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+}
 
 function main() {
   try {
-    let data = JSON.parse(localStorage.ufs_fb_msg_kount);
+    let data = JSON.parse(localStorage.ufs_fb_msg_kount) || [];
+
+    searchCount.innerHTML = data.length;
 
     tableDiv.innerHTML = `
         <tr>
@@ -18,7 +25,10 @@ function main() {
             let isGroup = c.type === "GROUP";
             let group = isGroup ? "✅" : "";
             let participants_name = c.participants
-              .map((_) => _.name)
+              .map(
+                (_) =>
+                  `<a target="_blank" href="https://fb.com/${_.id}">${_.name}</a>`
+              )
               .filter((_) => _)
               .join(", ");
             let name = isGroup
@@ -39,7 +49,7 @@ function main() {
               ${avatar}
               <a href="${link}" target="_blank">${name}</a>
             </td>
-            <td>${c.count}</td>
+            <td style="text-align: right">${numberWithCommas(c.count)}</td>
           </tr>`;
           })
           .join("")}
@@ -54,6 +64,7 @@ function main() {
 }
 
 function search(text) {
+  let count = 0;
   [...tableDiv.querySelectorAll("tr")].forEach((tr, index) => {
     if (index == 0) return; // ignore table header
 
@@ -62,8 +73,10 @@ function search(text) {
       tr.classList.add("hidden");
     } else {
       tr.classList.remove("hidden");
+      count++;
     }
   });
+  searchCount.innerHTML = count;
 }
 
 main();
