Merge pull request #626 from whakama/master

implemented #359 and fixed a lot of issues
dimdenGD · Dec 5, 2023 · 93e7949 · 93e7949
2 parents ff88a84 + d063a78
commit 93e7949
Show file tree

Hide file tree

Showing 32 changed files with 153 additions and 40 deletions.
diff --git a/layouts/bookmarks/index.html b/layouts/bookmarks/index.html
@@ -89,7 +89,7 @@ <h1>__MSG_bookmarks__</h1>
                 <div class="cell" id="right-cell">
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/bookmarks/script.js b/layouts/bookmarks/script.js
@@ -33,7 +33,7 @@ function renderUserData() {
     }
     document.getElementById('user-following').innerText = formatLargeNumber(user.friends_count).replace(/\s/g, ',');
     document.getElementById('user-followers').innerText = formatLargeNumber(user.followers_count).replace(/\s/g, ',');
-    document.getElementById('user-banner').src = user.profile_banner_url;
+    document.getElementById('user-banner').src = user.profile_banner_url ? user.profile_banner_url : 'https://abs.twimg.com/images/themes/theme1/bg.png';
     document.getElementById('user-avatar').src = `${(user.default_profile_image && vars.useOldDefaultProfileImage) ? chrome.runtime.getURL(`images/default_profile_images/default_profile_${Number(user.id_str) % 7}_normal.png`): user.profile_image_url_https}`.replace('_normal.', '_400x400.');
     document.getElementById('wtf-viewall').href = `https://twitter.com/i/connect_people?newtwitter=true&user_id=${user.id_str}`;
     document.getElementById('user-avatar-link').href = `https://twitter.com/${user.screen_name}`;
@@ -69,10 +69,12 @@ async function renderBookmarks(cursor) {
     if(bookmarks.length === 0 && !cursor) {
         bookmarksContainer.innerHTML = `<div style="color:var(--light-gray)">${LOC.empty.message}</div>`;
         document.getElementById('delete-all').hidden = true;
+        document.getElementById('loading-box').hidden = true;
         return;
     }
     if(bookmarks.length === 0 && cursor) {
         end = true;
+        document.getElementById('loading-box').hidden = true;
         return;
     }
     for (let i = 0; i < bookmarks.length; i++) {

diff --git a/layouts/bookmarks/style.css b/layouts/bookmarks/style.css
@@ -636,6 +636,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/header/script.js b/layouts/header/script.js
@@ -519,7 +519,12 @@ let userDataFunction = async user => {
     // util
     let firstTime = false;
     async function updateUnread() {
-        let unread = await API.notifications.getUnreadCount(firstTime);
+        let unread;
+        try {
+            unread = await API.notifications.getUnreadCount(firstTime);
+        } catch {
+            unread = { dm_unread_count: 0, ntab_unread_count: 0, total_unread_count: 0 };
+        }
         if(!firstTime) firstTime = true;
         let dms = unread.dm_unread_count;
         let notifs = unread.ntab_unread_count;
@@ -567,10 +572,20 @@ let userDataFunction = async user => {
         let accounts = (await API.account.getAccounts()).users;
         let accountsElement = document.getElementById('navbar-user-accounts');
         accountsElement.innerHTML = '';
-        accounts.forEach(account => {
+        accounts.forEach(async account => {
+            let accountUnreads;
+            try {
+                accountUnreads = await API.notifications.getUnreadCount(true, account.user_id);
+            } catch {
+                accountUnreads = { total_unread_count: 0 };
+            }
             let accountElement = document.createElement('div');
             accountElement.classList.add('navbar-user-account');
             accountElement.innerHTML = `<img src="${account.avatar_image_url.replace("_normal", "_bigger")}" class="navbar-user-account-avatar" width="16" height="16"> ${account.screen_name}`;
+            let unreadCount = accountUnreads.total_unread_count >= 21 ? '20+' : accountUnreads.total_unread_count;
+            if (unreadCount != 0) {
+                accountElement.innerHTML += ` <span class="navbar-user-account-notifications">${unreadCount}</span>`;
+            }
             accountElement.addEventListener('click', async () => {
                 if(account.screen_name === user.screen_name) return alert("You're already on this account!");
                 try {
@@ -1230,7 +1245,7 @@ let userDataFunction = async user => {
                 }
 
                 messageEntry.name = escapeHTML(messageUsers[0].name);
-                messageEntry.screen_name = '@' + messageUsers[0].screen_name;
+                messageEntry.screen_name = messageUsers[0].screen_name;
             } else if (c.type == 'GROUP_DM') { //groups
                 messageEntry.icon = c.avatar_image_https || chrome.runtime.getURL('/images/group.jpg');
                 messageEntry.name = c.name ? escapeHTML(c.name) : messageUsers.map(i => escapeHTML(i.name)).join(', ').slice(0, 128);
@@ -1247,7 +1262,7 @@ let userDataFunction = async user => {
                 }
 
                 messageEntry.name = user.name;
-                messageEntry.screen_name = '@' + user.screen_name;
+                messageEntry.screen_name = user.screen_name;
             }
 
             let lastSenderWasUser = lastMessage.message_data && lastMessage.message_data.sender_id === user.id_str
@@ -1308,7 +1323,7 @@ let userDataFunction = async user => {
                 <img src="${messageEntry.icon}" width="48" height="48" class="inbox-message-avatar">
                 <div class="inbox-text">
                     <b class="inbox-name">${messageEntry.name}</b>
-                    <span class="inbox-screenname">${messageEntry.screen_name}</span>
+                    <span class="inbox-screenname">${messageEntry.screen_name ? '@' + messageEntry.screen_name : ''}</span>
                     <span class="inbox-time" data-timestamp="${+lastMessage.time}">${timeElapsed(new Date(+lastMessage.time))}</span>
                     <br>
                     <span class="inbox-message-preview">${messageEntry.preview}</span>
@@ -1330,7 +1345,7 @@ let userDataFunction = async user => {
                 modal.querySelector('.new-message-box').hidden = true;
                 messageHeaderName.innerText = messageEntry.name;
                 messageHeaderAvatar.src = messageEntry.icon;
-                if(messageUsers.length <= 1) messageHeaderLink.href = `https://twitter.com/${messageEntry.screen_name.startsWith('@') ? messageEntry.screen_name.slice(1) : messageEntry.screen_name}`;
+                if(messageUsers.length <= 1) messageHeaderLink.href = `https://twitter.com/${messageEntry.screen_name}`;
                 setTimeout(() => {
                     modal.querySelector(".message-new-input").focus();
                     if(tweetUrlToShareInDMs) modal.querySelector(".message-new-input").value = tweetUrlToShareInDMs;
@@ -2943,7 +2958,7 @@ let userDataFunction = async user => {
     updateUnread();
     updateAccounts();
     updateInboxData();
-    setInterval(updateAccounts, 60000*5);
+    setInterval(updateAccounts, 20000);
     setInterval(updateUnread, 20000);
     setInterval(updateInboxData, 20000);
 }

diff --git a/layouts/header/style.css b/layouts/header/style.css
@@ -627,6 +627,15 @@ input, textarea {
     margin-bottom: 3px;
     margin-right: 3px;
 }
+.navbar-user-account-notifications {
+    background: var(--link-color);
+    color: var(--background-color) !important;
+    border-radius: 8px !important;
+    border: 1px solid var(--background-color);
+    padding: 3px 5px !important;
+    font-size: 10px !important;
+    display: inline !important;
+}
 
 .search-result-item {
     display: block;

diff --git a/layouts/history/index.html b/layouts/history/index.html
@@ -88,7 +88,7 @@ <h1>__MSG_history__</h1>
                 <div class="cell" id="right-cell">
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/history/style.css b/layouts/history/style.css
@@ -636,6 +636,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/home/index.html b/layouts/home/index.html
@@ -47,7 +47,7 @@ <h1 id="user-followers">0</h1>
                     </div>
                     <div id="trends" class="box">
                         <h1>__MSG_trends__</h1><br>
-                        <span id="trends-refresh">__MSG_refresh__</span> · <a id="trends-viewall" target="_blank" href="https://twitter.com/i/trends?newtwitter=true">__MSG_view_all__</a>
+                        <span id="trends-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="trends-viewall" target="_blank" href="https://twitter.com/i/trends?newtwitter=true">__MSG_view_all__</a>
                         <div id="trends-list">
                         </div>
                     </div>
@@ -148,7 +148,7 @@ <h1>__MSG_trends__</h1><br>
                     </select>
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/home/style.css b/layouts/home/style.css
@@ -382,6 +382,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/itl/index.html b/layouts/itl/index.html
@@ -89,7 +89,7 @@ <h1 id="itl-header">__MSG_tweets__</h1>
                 <div class="cell" id="right-cell">
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/itl/script.js b/layouts/itl/script.js
@@ -35,7 +35,7 @@ function renderUserData() {
     }
     document.getElementById('user-following').innerText = formatLargeNumber(user.friends_count).replace(/\s/g, ',');
     document.getElementById('user-followers').innerText = formatLargeNumber(user.followers_count).replace(/\s/g, ',');
-    document.getElementById('user-banner').src = user.profile_banner_url;
+    document.getElementById('user-banner').src = user.profile_banner_url ? user.profile_banner_url : 'https://abs.twimg.com/images/themes/theme1/bg.png';
     document.getElementById('user-avatar').src = `${(user.default_profile_image && vars.useOldDefaultProfileImage) ? chrome.runtime.getURL(`images/default_profile_images/default_profile_${Number(user.id_str) % 7}_normal.png`): user.profile_image_url_https}`.replace("_normal", "_400x400");
     document.getElementById('wtf-viewall').href = `https://twitter.com/i/connect_people?newtwitter=true&user_id=${user.id_str}`;
     document.getElementById('user-avatar-link').href = `https://twitter.com/${user.screen_name}`;

diff --git a/layouts/itl/style.css b/layouts/itl/style.css
@@ -635,6 +635,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/lists/index.html b/layouts/lists/index.html
@@ -96,7 +96,7 @@ <h1 id="list-followers-count">0</h1>
                 <div class="cell" id="right-cell">
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/lists/style.css b/layouts/lists/style.css
@@ -461,6 +461,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/notifications/index.html b/layouts/notifications/index.html
@@ -69,7 +69,7 @@ <h1>__MSG_trends__</h1>
                 <div class="cell" id="right-cell">
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/notifications/style.css b/layouts/notifications/style.css
@@ -433,6 +433,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/profile/index.html b/layouts/profile/index.html
@@ -210,7 +210,7 @@ <h1 class="nice-header">__MSG_dark_mode_vars__</h1><br>
                     </div>
                     <div id="wtf" class="box">
                         <h1>__MSG_you_may_also_like__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/profile/style.css b/layouts/profile/style.css
@@ -454,6 +454,10 @@ body {
     cursor: pointer
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/search/index.html b/layouts/search/index.html
@@ -87,7 +87,7 @@ <h1>__MSG_trends__</h1>
                     <div id="save-search-right" class="center-text">__MSG_save_search__</div>
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/search/style.css b/layouts/search/style.css
@@ -450,6 +450,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/settings/index.html b/layouts/settings/index.html
@@ -402,7 +402,7 @@ <h1>__MSG_advanced_options__</h1><br>
             <div class="cell" id="right-cell">
                 <div id="wtf" class="box">
                     <h1>__MSG_who_to_follow__</h1><br>
-                    <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                    <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                     <br><br>
                     <div id="wtf-list"></div>
                 </div>

diff --git a/layouts/settings/style.css b/layouts/settings/style.css
@@ -188,6 +188,10 @@ body {
     text-decoration: underline;
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 .wtf-user {
     width:100%;
     display: inline-block;

diff --git a/layouts/topics/index.html b/layouts/topics/index.html
@@ -98,7 +98,7 @@ <h1 id="topic-name">__MSG_loading__</h1>
                 <div class="cell" id="right-cell">
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/topics/script.js b/layouts/topics/script.js
@@ -35,7 +35,7 @@ function renderUserData() {
     }
     document.getElementById('user-following').innerText = formatLargeNumber(user.friends_count).replace(/\s/g, ',');
     document.getElementById('user-followers').innerText = formatLargeNumber(user.followers_count).replace(/\s/g, ',');
-    document.getElementById('user-banner').src = user.profile_banner_url;
+    document.getElementById('user-banner').src = user.profile_banner_url ? user.profile_banner_url : 'https://abs.twimg.com/images/themes/theme1/bg.png';
     document.getElementById('user-avatar').src = `${(user.default_profile_image && vars.useOldDefaultProfileImage) ? chrome.runtime.getURL(`images/default_profile_images/default_profile_${Number(user.id_str) % 7}_normal.png`): user.profile_image_url_https}`.replace("_normal", "_400x400");
     document.getElementById('wtf-viewall').href = `https://twitter.com/i/connect_people?newtwitter=true&user_id=${user.id_str}`;
     document.getElementById('user-avatar-link').href = `https://twitter.com/${user.screen_name}`;

diff --git a/layouts/topics/style.css b/layouts/topics/style.css
@@ -651,6 +651,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,

diff --git a/layouts/tweet/index.html b/layouts/tweet/index.html
@@ -91,7 +91,7 @@ <h1>__MSG_trends__</h1>
                 <div class="cell" id="right-cell">
                     <div id="wtf" class="box">
                         <h1>__MSG_who_to_follow__</h1><br>
-                        <span id="wtf-refresh">__MSG_refresh__</span> · <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
+                        <span id="wtf-refresh">__MSG_refresh__</span> <span id="bulletpoint">·</span> <a id="wtf-viewall" target="_blank" href="https://twitter.com/i/connect_people?newtwitter=true&user_id=">__MSG_view_all__</a>
                         <br><br>
                         <div id="wtf-list"></div>
                     </div>

diff --git a/layouts/tweet/style.css b/layouts/tweet/style.css
@@ -462,6 +462,10 @@ body {
     text-decoration: none
 }
 
+#bulletpoint {
+    color: var(--light-gray)
+}
+
 a:hover,
 .tweet-header-info:hover,
 .tweet-body-text a:hover,