v2

.editorconfig

@@ -1,4 +1,4 @@
-[*.{js,jsx,ts,tsx,vue}]
+[*.{js}]
 indent_style = space
 indent_size = 2
 end_of_line = lf

.gitignore

@@ -1,15 +1,8 @@
 .DS_Store
 node_modules
-/dist
 
 # local env files
-.env.local
-.env.*.local
-
-# Log files
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
+env.js
 
 # Editor directories and files
 .idea

README.md

@@ -1,11 +1,11 @@
-<p align="center"><img src="./public/logo.svg"></p>
+<p align="center"><img src="./img/logo.svg"></p>
 <h3 align="center">AL Search</h3>
 <p align="center">Quickly search information on AniList</p>
 
 <hr>
 
 <p align="center">AL Search is an unofficial browser extension for AniList which allows you to quickly search information on AniList.</p>
-<p align="center">The extension is available on <a href="https://addons.mozilla.org/en-US/firefox/addon/al-search/" title="See AL Search on Firefox">Firefox</a> and <a href="https://chrome.google.com/webstore/detail/cfgahmhilacehicbomiciimpemjhpalc" title="See AL Search on Chrome & Edge Chromium">Chrome & Edge Chromium</a>.</p>
+<p align="center">The extension is available on <a href="https://addons.mozilla.org/en-US/firefox/addon/al-search/" title="See AL Search on Firefox">Firefox</a> and <a href="https://chrome.google.com/webstore/detail/cfgahmhilacehicbomiciimpemjhpalc" title="See AL Search on Chrome & Edge Chromium">Chrome & any Chromium based browser</a>.</p>
 
 <br>
 
@@ -15,57 +15,19 @@
 
 ## Development
 
-### Requirements
+To work on the project:
+- Copy the `manifest_chrome.json` or `manifest_firefox.json` file to `manifest.json` (depending on the browser you're on).
+- Copy the `env.example` file to `env.js` and fill the `anilist.client_id` property with your client ID.
+- Load the extension in your browser.
 
-- NodeJS 10
-- NPM 6
+> Note: This project doesn't need any build process.
 
-### Project setup
-```bash
-npm ci
-```
+### Third party libraries included
 
-#### Compiles and watch for development
-```bash
-# Firefox
-npm run watch_firefox
+To make it easier to comply with Manifest V3 and also prevent any review issues, the few third party libraries used by this project are included:
 
-# Chrome
-npm run watch_chrome
-```
-
-#### Compiles and minifies for production
-```bash
-# Firefox
-npm run build_firefox
-
-# Chrome
-npm run build_chrome
-```
-
-#### Lints and fixes files
-```bash
-npm run lint --fix
-```
-
-### Notes
-
-#### Search provider limitations
-
-AniList uses one search url per type of data (anime, manga...), and doesn't have a global search url.
-
-But, `chrome_settings_overrides.search_provider` configuration key, which is used by this extension to add a custom search engine to the browser, only has a single search url parameter, and we can't dynamically change its value. It's also impossible (?) to add multiple search providers with a single extension.
-
-Due to this limitation on the browser side and to the way AniList search pages are built, the search provider configured by AL Search can only search on one specific type of data.
-
-For the time being, the search url is set to anime search, as it's _probably_ the one users will use the most.
-
-### Known issues
-
-#### Bottom of the popup "lags" on external monitor on Chrome/MacOS
-
-This bug only appears on MacOS and Chrome.
-
-When opening the popup, if the browser is displayed on an external monitor, the bottom of the popup seems to "lag" when the user click on an input, select text, etc.
-
-This bug is not related to AL Search and is a known bug of chrome (see the [bug report](https://bugs.chromium.org/p/chromium/issues/detail?id=971701&q=component%3APlatform%3EExtensions%20Lag&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified)).
+- Vue `3.5.12` (copied from official NPM repository)
+- Vue Router `4.4.5` (copied from official NPM repository)
+- Webextension-polyfill `0.12.0` (copied from official NPM repository)
+- Fontawesome `5.15.4` ([Direct download link](https://use.fontawesome.com/releases/v5.15.4/fontawesome-free-5.15.4-web.zip?_gl=1*1otdaau*_ga*MjI3MjM0MTUuMTcxMDg1ODM5OA..*_ga_BPMS41FJD2*MTczMDE5OTY0OS4xNC4xLjE3MzAxOTk4OTYuMzEuMC4w))
+- Roboto font ([from fonts.google.com](https://fonts.google.com/share?selection.family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900))