commit 06167753b35c9919d4cb2cadf5a26747f6b6bed8
author avm99963 <me@avm99963.com> Tue Sep 08 00:50:36 2020 +0200
committer avm99963 <me@avm99963.com> Tue Sep 08 01:23:39 2020 +0200
tree 975315b9404c500ce6f9b2fe332807339e104281
parent c4cb8f356c87fc17e1c492b3bf9f41047185655d

Add extension icon badge to injected components

Fixes: #8
Change-Id: Id1d0ae4a3da057fb06f5137be2271e293d8f0cd4

src/content_scripts/console_inject.js

diff --git a/src/content_scripts/console_inject.js b/src/content_scripts/console_inject.js
index f25fe4b..6a73bdc 100644
--- a/src/content_scripts/console_inject.js
+++ b/src/content_scripts/console_inject.js
@@ -25,7 +25,7 @@
   link.innerText = chrome.i18n.getMessage('inject_previousposts_' + type);
 
   container.appendChild(link);
-  node.querySelector('.main-card-content').appendChild(container);
+  node.appendChild(container);
 }
 
 function mutationCallback(mutationList, observer) {
@@ -58,8 +58,35 @@
               var query2 = encodeURIComponent(
                   '(creator:"' + name + '" | replier:"' + name +
                   '") forum:any');
-              addProfileHistoryLink(node, 'forum', query1);
-              addProfileHistoryLink(node, 'all', query2);
+
+              var container = document.createElement('div');
+              container.classList.add('TWPT-previous-posts');
+
+              var badge = document.createElement('div');
+              badge.classList.add('TWPT-badge');
+              badge.setAttribute(
+                  'title',
+                  chrome.i18n.getMessage(
+                      'inject_extension_badge_helper',
+                      [chrome.i18n.getMessage('appName')]));
+
+              var badgeI = document.createElement('i');
+              badgeI.classList.add(
+                  'material-icon-i', 'material-icons-extended');
+              badgeI.textContent = 'repeat';
+
+              badge.appendChild(badgeI);
+              container.appendChild(badge);
+
+              var linkContainer = document.createElement('div');
+              linkContainer.classList.add('TWPT-previous-posts--links');
+
+              addProfileHistoryLink(linkContainer, 'forum', query1);
+              addProfileHistoryLink(linkContainer, 'all', query2);
+
+              container.appendChild(linkContainer);
+
+              node.querySelector('.main-card-content').appendChild(container);
             }
           }
         }
@@ -146,6 +173,20 @@
     switchContent.appendChild(icon);
     darkThemeSwitch.appendChild(switchContent);
 
+    var badgeContent = document.createElement('div');
+    badgeContent.classList.add('TWPT-badge');
+    badgeContent.setAttribute(
+        'title', chrome.i18n.getMessage('inject_extension_badge_helper', [
+          chrome.i18n.getMessage('appName')
+        ]));
+
+    var badgeI = document.createElement('i');
+    badgeI.classList.add('material-icon-i', 'material-icons-extended');
+    badgeI.textContent = 'repeat';
+
+    badgeContent.appendChild(badgeI);
+    darkThemeSwitch.appendChild(badgeContent);
+
     var rightControl = document.querySelector('header .right-control');
     rightControl.style.width =
         (parseInt(window.getComputedStyle(rightControl).width) + 58) + 'px';