Add Wakanim web integration

src/content-scripts/wakanim.ts

@@ -0,0 +1,38 @@
+import WebIntegration from '@/utils/WebIntegration';
+import * as Enum from '@/utils/Enum';
+
+/**
+ * Try to get an anime title from the page.
+ */
+function getAnimeTitle(): string | null {
+  const titleNode = document.querySelector('body > .SerieV2 meta[itemprop="alternativeHeadline"]');
+
+  return titleNode ? titleNode.getAttribute('content') : null;
+}
+
+/**
+ * Try to get an anime display name from the page.
+ */
+function getDisplayTitle(): string | null {
+  const titleNode = document.querySelector('body > .SerieV2 meta[itemprop="name"]');
+
+  return titleNode ? titleNode.getAttribute('content') : null;
+}
+
+async function init() {
+  try {
+    if (!(await WebIntegration.isEnabled())) return;
+
+    // In case we are on a video page.
+    if (document.querySelector('body > .SerieV2')) {
+      const title = getAnimeTitle();
+
+      if (title) WebIntegration.displayButton(title, Enum.SearchType.ANIME, getDisplayTitle());
+    }
+  }
+  catch (e) {
+    console.error(e);
+  }
+}
+
+init();

src/manifest_chrome.json

@@ -27,12 +27,12 @@
   },
   "content_scripts": [
     {
-      "matches": [
-        "*://www.crunchyroll.com/*"
-      ],
-      "js": [
-        "js/content/crunchyroll.js"
-      ]
+      "matches": ["*://www.crunchyroll.com/*"],
+      "js": ["js/content/crunchyroll.js"]
+    },
+    {
+      "matches": ["*://www.wakanim.tv/*"],
+      "js": ["js/content/wakanim.js"]
     }
   ]
 }

src/manifest_firefox.json

@@ -33,6 +33,10 @@
     {
       "matches": ["*://www.crunchyroll.com/*"],
       "js": ["js/content/crunchyroll.js"]
+    },
+    {
+      "matches": ["*://www.wakanim.tv/*"],
+      "js": ["js/content/wakanim.js"]
     }
   ],
   "chrome_settings_overrides": {

src/utils/WebIntegration.ts

@@ -91,7 +91,7 @@ function getHtml(
       justify-content: flex-end;
       position: fixed;
       right: 20px;
-      z-index: 99999;
+      z-index: 2147483647;
     }
 
     #al-search__button {
@@ -129,6 +129,10 @@ function getHtml(
       padding: 0 12px;
     }
 
+    #al-search__menu > ul > li {
+      list-style: none !important;
+    }
+
     #al-search__menu > ul > li:first-child {
       font-weight: bold;
       margin-right: 20px;
@@ -160,6 +164,7 @@ function getHtml(
 
     #al-search__menu > ul > li.action > a > svg {
       color: rgb(61,180,242);
+      vertical-align: initial !important; /* Wakanim */
     }
 
     #al-search__arrow {

vue.config.js

@@ -11,6 +11,7 @@ const scripts = {
   content: {
     // 'script': './src/content-scripts/script.ts',
     'crunchyroll': './src/content-scripts/crunchyroll.ts',
+    'wakanim': './src/content-scripts/wakanim.ts',
   },
 };