diff --git a/README.md b/README.md index a8d635f..256adab 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ - Adds a "Search on Nyaa" Button to Anime and Manga database pages - Individual: **[MyAnimeList](https://i.imgur.com/IXJ7XuK.png), [AniList](https://i.imgur.com/9xhFu5q.jpeg), [Anime-Planet](https://i.imgur.com/sGsl0Bw.png), [AnimeNewsNetwork](https://i.imgur.com/xXvJXHC.png), [LiveChart](https://i.imgur.com/VyIWtLC.png), [AniDB](https://i.imgur.com/DqSkmOg.jpeg), [Kitsu](https://i.imgur.com/CN2kh4C.jpeg)** - Card-type: _**MyAnimeList** ([Season](https://i.imgur.com/7M4hr0z.png), [Genre](https://i.imgur.com/SklbImH.png)), **LiveChart** ([Season](https://i.imgur.com/wvLOp8N.jpeg), [Franchises](https://i.imgur.com/wcNv1JC.jpeg))_ -- Extension settings can be customized and saved in the [Extension Popup window](https://i.imgur.com/ymIkV63.png) +- Extension settings can be customized and saved in the [Extension Popup window](https://i.imgur.com/Ezz4S6x.png) - The primary settings page is used to change Nyaa search parameters - For Manga pages, the Category setting will search for the "Literature" equivalent diff --git a/package.json b/package.json index 24c0ad2..f76dca9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "nyaa-linker", - "version": "2.0.0", + "version": "2.1.0", "description": "Adds a button to Anime and Manga database websites that opens a relevant Nyaa search", "scripts": { "zip": "npm run firefox && npm run chrome", diff --git a/src/background.js b/src/background.js index c4eea6a..c030879 100644 --- a/src/background.js +++ b/src/background.js @@ -21,6 +21,7 @@ const defaultSettings = () => { focus_setting: false, hotkey_key_setting: '', hotkey_modifier_setting: '', + hotkey_query_setting: 'inherit', }, }); }; diff --git a/src/main.js b/src/main.js index 3fc7799..a3c5192 100644 --- a/src/main.js +++ b/src/main.js @@ -1,5 +1,10 @@ -chrome.runtime.onMessage.addListener((request) => request.type === 'tabUpdated' && init()); -let activeListener; +let btn, currentPage, previousPage, hotkeyListener; +chrome.runtime.onMessage.addListener((request) => { + if (request.type === 'tabUpdated') { + currentPage = window.location.href.split('/')[4]; + (!btn || currentPage !== previousPage) && init(); + } +}); async function init() { const loadUserSettings = await new Promise((resolve) => { @@ -8,6 +13,7 @@ async function init() { }); }); + previousPage = currentPage; const settings = loadUserSettings.settings; searchNyaa(settings); } @@ -15,8 +21,8 @@ async function init() { function searchNyaa(settings) { const domain = window.location.href; const media = window.location.pathname.includes('manga') ? 'manga' : 'anime'; + let titleJap, titleEng, btnSpace, cardType, cardFlag; let queryType = settings.query_setting; - let titleJap, titleEng, btn, btnSpace, cardType; if (media === 'manga') { const searchManga = (cat) => { @@ -26,32 +32,38 @@ function searchNyaa(settings) { settings.category_setting = searchManga(settings.category_setting); } - function createSearch(query) { - if (btn) { - !btn.title && (btn.textContent = 'Search on Nyaa'); - btn.href = `https://nyaa.si/?f=${settings.filter_setting}&c=${settings.category_setting}&q=${query}&s=${settings.sort_setting}&o=${settings.order_setting}`; - btn.target = '_blank'; - } - } - function createBtn(btnSpace) { - !cardType && document.querySelector('.nyaaBtn') && document.querySelector('.nyaaBtn').remove(); + !cardFlag && document.querySelector('.nyaaBtn') && document.querySelectorAll('.nyaaBtn').forEach((e) => e.remove()), (cardFlag = true); btn = btnSpace.appendChild(document.createElement('a')); btn.classList.add('nyaaBtn'); settings.hide_button_setting && (btn.style.display = 'none'); + !cardType && settings.hotkey_key_setting && startHotkeyListener(); + } + + function createSearch(query) { + !btn.title && (btn.textContent = 'Search on Nyaa'); + btn.href = `https://nyaa.si/?f=${settings.filter_setting}&c=${settings.category_setting}&q=${query}&s=${settings.sort_setting}&o=${settings.order_setting}`; + btn.target = '_blank'; } - if (!activeListener && settings.hotkey_key_setting) { - document.addEventListener('keydown', function (e) { + function startHotkeyListener() { + hotkeyListener && document.removeEventListener('keydown', hotkeyListener); + hotkeyListener = (e) => { if ( - (btn && e[settings.hotkey_modifier_setting] && e.key.toLowerCase() == settings.hotkey_key_setting) || - (btn && settings.hotkey_modifier_setting === '' && !e.ctrlKey && !e.shiftKey && !e.altKey && e.key == settings.hotkey_key_setting) + (btn && e[settings.hotkey_modifier_setting] && e.key.toLowerCase() === settings.hotkey_key_setting) || + (btn && settings.hotkey_modifier_setting === '' && !e.ctrlKey && !e.shiftKey && !e.altKey && e.key === settings.hotkey_key_setting) ) { - document.querySelector('.nyaaBtn').dispatchEvent(new MouseEvent('click', { ctrlKey: settings.focus_setting })); + if (settings.hotkey_query_setting !== 'inherit') { + queryType = settings.hotkey_query_setting; + createSearch(getQuery(titleJap, titleEng, queryType)); + } + btn.dispatchEvent(new MouseEvent('click', { ctrlKey: settings.focus_setting })); e.preventDefault(); + queryType = settings.query_setting; + createSearch(getQuery(titleJap, titleEng, queryType)); } - }); - activeListener = true; + }; + document.addEventListener('keydown', hotkeyListener); } switch (true) { @@ -87,9 +99,9 @@ function searchNyaa(settings) { card.querySelector('.title h3') ? (titleEng = card.querySelector('.title h3').innerText) : (titleEng = undefined); createBtn(card.querySelector('.broadcast')); + btn.title = 'Search on Nyaa'; btn.style.background = 'url(https://i.imgur.com/9Fr2BRG.png) center/20px no-repeat'; btn.style.padding = '0 11px'; - btn.title = 'Search on Nyaa'; createSearch(getQuery(titleJap, titleEng, queryType)); } } @@ -129,16 +141,15 @@ function searchNyaa(settings) { btnSpace = document.querySelector('.fright') ? document.querySelector('.fright') : document.querySelector('#big-video'); createBtn(btnSpace); - btn.style.cssText = ` - display: flex; - align-items: center; - justify-content: center; - height: 35px; - border-radius: 3px; - background: #2d50a7; - color: #fff; - border: 1px solid black; - text-decoration: none;`; + btn.style.display !== 'none' && (btn.style.display = 'flex'); + btn.style.alignItems = 'center'; + btn.style.justifyContent = 'center'; + btn.style.height = '35px'; + btn.style.borderRadius = '3px'; + btn.style.background = '#2d50a7'; + btn.style.color = '#fff'; + btn.style.border = '1px solid black'; + btn.style.textDecoration = 'none'; btnSpace.children[0].tagName === 'TABLE' && (btn.style.marginTop = '4px'); createSearch(getQuery(titleJap, titleEng, queryType)); }, 50); @@ -170,15 +181,14 @@ function searchNyaa(settings) { } createBtn(document.querySelector('.cover-wrap-inner')); - btn.style.cssText = ` - display: flex; - align-items: center; - justify-content: center; - height: 35px; - border-radius: 3px; - margin-bottom: 20px; - background: rgb(var(--color-blue)); - color: rgb(var(--color-white));`; + btn.style.display !== 'none' && (btn.style.display = 'flex'); + btn.style.alignItems = 'center'; + btn.style.justifyContent = 'center'; + btn.style.height = '35px'; + btn.style.borderRadius = '3px'; + btn.style.marginBottom = '20px'; + btn.style.background = 'rgb(var(--color-blue))'; + btn.style.color = 'rgb(var(--color-white))'; createSearch(getQuery(titleJap, titleEng, queryType)); }); break; diff --git a/src/manifest-chrome.json b/src/manifest-chrome.json index fd42392..ca82f6a 100644 --- a/src/manifest-chrome.json +++ b/src/manifest-chrome.json @@ -1,6 +1,6 @@ { "name": "Nyaa Linker", - "version": "2.0.0", + "version": "2.1.0", "description": "Adds a button to Anime and Manga database websites that opens a relevant Nyaa search", "manifest_version": 3, diff --git a/src/manifest-firefox.json b/src/manifest-firefox.json index 3d0e3a2..c60701e 100644 --- a/src/manifest-firefox.json +++ b/src/manifest-firefox.json @@ -1,6 +1,6 @@ { "name": "Nyaa Linker", - "version": "2.0.0", + "version": "2.1.0", "description": "Adds a button to Anime and Manga database websites that opens a relevant Nyaa search", "manifest_version": 2, diff --git a/src/popup/popup.css b/src/popup/popup.css index 6a9ed88..96273c3 100644 --- a/src/popup/popup.css +++ b/src/popup/popup.css @@ -18,12 +18,32 @@ body { background: var(--clrDark); color: var(--clrLight); width: max-content; + font-family: sans-serif; +} + +#parametersPage, +#settingsPage { + display: grid; + grid-template-columns: max-content max-content; + gap: 2px; + padding: 2px 0 2px 2px; + text-align: right; +} + +#settingsPage { + display: none; + border: 1px solid var(--clrAccent); + border-top: none; + padding-left: 25px; } button, input, -select { +select, +option { cursor: pointer; + text-align: center; + height: 21px; } select, @@ -35,7 +55,7 @@ select, option, #settingsPage { - background-color: var(--clrDark); + background: var(--clrDark); color: var(--clrAccent); } @@ -45,7 +65,7 @@ option, } #saveButton { - flex: 13; + flex: 11; } #settingsButton { @@ -53,35 +73,13 @@ option, flex: 1; } -#parametersPage { - display: grid; - margin: 2px 0 2px 2px; -} - -#parametersPage, -#settingsPage { - grid-template-columns: max-content max-content; - gap: 2px; - text-align: right; -} - -#settingsPage { - display: none; - border: 1px solid var(--clrAccent); - position: fixed; - padding: 5px 25px; - top: 0; - left: 0; - width: 100%; - height: 85%; -} - -#hide_button_select, #hotkey_key_select, -#focus_select { - width: 24px; - height: 24px; - text-align: center; - align-self: center; +input[type='checkbox'] { + width: 21px; justify-self: left; } + +#hotkey_modifier_select, +#hotkey_query_select { + width: 150%; +} diff --git a/src/popup/popup.html b/src/popup/popup.html index fcdf69b..079fd25 100644 --- a/src/popup/popup.html +++ b/src/popup/popup.html @@ -58,7 +58,7 @@
- + @@ -66,13 +66,22 @@ - + + + +
diff --git a/src/popup/popup.js b/src/popup/popup.js index 80284cc..4d0e568 100644 --- a/src/popup/popup.js +++ b/src/popup/popup.js @@ -10,6 +10,7 @@ window.onload = () => { document.getElementById('focus_select').checked = load.settings.focus_setting; document.getElementById('hotkey_key_select').value = load.settings.hotkey_key_setting; document.getElementById('hotkey_modifier_select').value = load.settings.hotkey_modifier_setting; + document.getElementById('hotkey_query_select').value = load.settings.hotkey_query_setting; } }); }; @@ -25,6 +26,7 @@ const saveSettings = () => { settings['focus_setting'] = document.getElementById('focus_select').checked; settings['hotkey_key_setting'] = document.getElementById('hotkey_key_select').value.toLowerCase(); settings['hotkey_modifier_setting'] = document.getElementById('hotkey_modifier_select').value; + settings['hotkey_query_setting'] = document.getElementById('hotkey_query_select').value; return settings; };