kouhais-mirrors
/
safer-indie-wiki-buddy
mirror of https://github.com/KevinPayravi/indie-wiki-buddy.git
1
0
Fork 0
Code

Adding global search filter toggling + reorganize popup view

pull/118/head
Kevin Payravi 2023-04-09 03:45:46 -05:00
parent 59627e292b
commit 052448d97c
3 changed files with 207 additions and 134 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
content.js
View File

@ -259,49 +259,51 @@ function main(mutations = null, observer = null) {
} }
} }
}); });
} else if (currentURL.hostname.includes('www.google.')) { } else if ((storage.searchFilter ?? 'on') === 'on') {
// Check if doing a Google search: if (currentURL.hostname.includes('www.google.')) {
function filterGoogle() { // Check if doing a Google search:
let fandomSearchResults = document.querySelectorAll("div[data-hveid] a[href*='fandom.com']"); function filterGoogle() {
filterSearchResults(fandomSearchResults, 'google', storage); let fandomSearchResults = document.querySelectorAll("div[data-hveid] a[href*='fandom.com']");
} filterSearchResults(fandomSearchResults, 'google', storage);
addLocationObserver(main); }
filterGoogle();
} else if (currentURL.hostname.includes('duckduckgo.com') && currentURL.search.includes('q=')) {
// Check if doing a Duck Duck Go search:
function filterDuckDuckGo() {
let fandomSearchResults = document.querySelectorAll("h2>a[href*='fandom.com']");
filterSearchResults(fandomSearchResults, 'duckduckgo', storage);
}
// Need to wait for document to be ready
if (document.readyState === 'complete') {
addLocationObserver(main); addLocationObserver(main);
filterDuckDuckGo(); filterGoogle();
} else { } else if (currentURL.hostname.includes('duckduckgo.com') && currentURL.search.includes('q=')) {
document.addEventListener('readystatechange', e => { // Check if doing a Duck Duck Go search:
if (document.readyState === 'complete') { function filterDuckDuckGo() {
addLocationObserver(main); let fandomSearchResults = document.querySelectorAll("h2>a[href*='fandom.com']");
filterDuckDuckGo(); filterSearchResults(fandomSearchResults, 'duckduckgo', storage);
} }
}); // Need to wait for document to be ready
} if (document.readyState === 'complete') {
} else if (currentURL.hostname.includes('www.bing.com')) { addLocationObserver(main);
// Check if doing a Bing search: filterDuckDuckGo();
function filterBing() { } else {
let fandomSearchResults = Array.from(document.querySelectorAll(".b_attribution>cite")).filter(el => el.innerHTML.includes('fandom.com')); document.addEventListener('readystatechange', e => {
filterSearchResults(fandomSearchResults, 'bing', storage); if (document.readyState === 'complete') {
} addLocationObserver(main);
// Need to wait for document to be ready filterDuckDuckGo();
if (document.readyState === 'complete') { }
addLocationObserver(main); });
filterBing(); }
} else { } else if (currentURL.hostname.includes('www.bing.com')) {
document.addEventListener('readystatechange', e => { // Check if doing a Bing search:
if (document.readyState === 'complete') { function filterBing() {
addLocationObserver(main); let fandomSearchResults = Array.from(document.querySelectorAll(".b_attribution>cite")).filter(el => el.innerHTML.includes('fandom.com'));
filterBing(); filterSearchResults(fandomSearchResults, 'bing', storage);
} }
}); // Need to wait for document to be ready
if (document.readyState === 'complete') {
addLocationObserver(main);
filterBing();
} else {
document.addEventListener('readystatechange', e => {
if (document.readyState === 'complete') {
addLocationObserver(main);
filterBing();
}
});
}
} }
} }
} }

212
popup.html
View File

@ -14,13 +14,14 @@
h1 { h1 {
font-size: 1.2rem; font-size: 1.2rem;
margin: 8px 0;
} }
hr { hr {
height: 1px; height: 1px;
border: none; border: none;
color: #333; color: #555;
background-color: #333; background-color: #555;
} }
label { label {
@ -40,17 +41,30 @@
border: 0 !important; border: 0 !important;
} }
.links {
font-size: .8em;
line-height: 1.5em;
margin-left: 8px;
}
.links a, .links a:visited, .links a:active {
text-decoration: none;
border-bottom: 1px black dotted;
}
.options { .options {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: left;
user-select: none; user-select: none;
row-gap: 2px; margin-top: 4px;
} }
.options > div { .options > div {
flex: 50%; flex: 50%;
padding: 5px; }
.options > div {
padding-bottom: 10px;
}
.options > div:last-child {
padding: 0px;
} }
#controls { #controls {
@ -105,6 +119,12 @@
vertical-align: middle; vertical-align: middle;
} }
.columns {
display: grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
#toggles { #toggles {
height: 16em; height: 16em;
white-space: nowrap; white-space: nowrap;
@ -143,12 +163,15 @@
width: 17px; width: 17px;
} }
.header, #langSelectContainer {
font-size: 0.9em;
margin-bottom: 10px;
}
.footer { .footer {
text-align: center; text-align: center;
line-height: 1.4em; line-height: 1.4em;
} }
.footer a { .footer a {
font-size: 0.9em; font-size: 0.9em;
padding: 5px 0px; padding: 5px 0px;
@ -162,78 +185,112 @@
font-size: 0.8rem; font-size: 0.8rem;
} }
#langSelectContainer {
float: right;
text-align: right;
margin-top: 10px;
padding-right: 10px;
}
#breezewikiHost { #breezewikiHost {
display: none; display: none;
padding-left: 10px; padding-left: 10px;
} }
#breezewikiHost > label {
padding-left: 10px;
}
</style> </style>
</head> </head>
<body> <body>
<div class="header"> <div class="columns">
<h1>Indie Wiki Buddy</h1> <div class="links">
</div> <h1>Indie Wiki Buddy</h1>
<div id="langSelectContainer"> <span id="version"></span>
<select name="lang" id="langSelect"> <br />
<option value="DE">Deutsch</option> <a
<option value="EN" selected>English</option> href="https://getindie.wiki/"
<option value="ES">Español</option> target="_blank"
<option value="FR">Français</option> >Info & Help</a
<option value="IT">Italiano</option> >
<option value="PL">Polski</option> <br />
<option value="TOK">Toki Pona</option> <a
</select> href="https://getindie.wiki/changelog/"
</div> target="_blank"
<div class="options"> >Changelog</a
<div class="settingToggleContainer"> >
<div id="power" class="settingToggle"> <br />
<input id="powerButton" type="checkbox" /> <a
<label for="powerButton"> href="https://getindie.wiki/#submit"
<img id="powerImage" src="" alt="" /> target="_blank"
<span id="powerText"></span> >Submit a Wiki</a
</label> >
</div> <br />
<a
href="https://github.com/KevinPayravi/indie-wiki-buddy"
target="_blank"
>Source Code</a
>
</div> </div>
<div class="settingToggleContainer"> <div class="options">
<div id="notifications" class="settingToggle"> <div class="settingToggleContainer">
<input id="notificationsButton" type="checkbox" /> <div id="power" class="settingToggle">
<label for="notificationsButton"> <input id="powerButton" type="checkbox" />
<img id="notificationsImage" src="" alt="" /> <label for="powerButton">
<span id="notificationsText"></span> <img id="powerImage" src="" alt="" />
</label> <span id="powerText"></span>
</div> </label>
</div>
<div class="settingToggleContainer">
<div id="breezewiki" class="settingToggle">
<input id="breezewikiButton" type="checkbox" />
<label for="breezewikiButton">
<img id="breezewikiImage" src="" alt="" />
<span id="breezewikiText"></span>
</label>
</div>
<div>
<div>
&nbsp;&nbsp;(<a href="https://breezewiki.com/" target="_blank"
>learn more</a
>)
</div> </div>
</div> </div>
</div> <div class="settingToggleContainer">
<div class="settingToggleContainer"> <div id="notifications" class="settingToggle">
<div id="breezewikiHost" class="settingToggle"> <input id="notificationsButton" type="checkbox" />
<label for="breezewikiHostSelect">BreezeWiki host: </label> <label for="notificationsButton">
<select name="breezewikiHost" id="breezewikiHostSelect"></select> <img id="notificationsImage" src="" alt="" />
<span id="notificationsText"></span>
</label>
</div>
</div>
<div class="settingToggleContainer">
<div id="searchFilter" class="settingToggle">
<input id="searchFilterButton" type="checkbox" />
<label for="searchFilterButton">
<img id="searchFilterImage" src="" alt="" />
<span id="searchFilterText"></span>
</label>
</div>
</div>
<div class="settingToggleContainer">
<div id="breezewiki" class="settingToggle">
<input id="breezewikiButton" type="checkbox" />
<label for="breezewikiButton">
<img id="breezewikiImage" src="" alt="" />
<span id="breezewikiText"></span>
</label>
</div>
<div>
<div>
&nbsp;&nbsp;(<a href="https://breezewiki.com/" target="_blank"
>learn more</a
>)
</div>
</div>
</div>
<div class="settingToggleContainer">
<div id="breezewikiHost" class="settingToggle">
<label for="breezewikiHostSelect">Host:&nbsp;</label>
<select name="breezewikiHost" id="breezewikiHostSelect"></select>
</div>
</div> </div>
</div> </div>
</div> </div>
<hr /> <hr />
<div id="controls"> <div id="controls">
<div id="langSelectContainer">
Viewing wikis in:
<select name="lang" id="langSelect">
<option value="DE">Deutsch</option>
<option value="EN" selected>English</option>
<option value="ES">Español</option>
<option value="FR">Français</option>
<option value="IT">Italiano</option>
<option value="PL">Polski</option>
<option value="TOK">Toki Pona</option>
</select>
</div>
<button id="setAllDisabled" class="control"> <button id="setAllDisabled" class="control">
<img src="images/toggle-disabled.png" width="10" alt="" /> Disable all <img src="images/toggle-disabled.png" width="10" alt="" /> Disable all
</button> </button>
@ -255,7 +312,6 @@
search for none search for none
</button> </button>
</div> </div>
<br />
<div id="togglesKey"> <div id="togglesKey">
<div> <div>
<img <img
@ -293,27 +349,11 @@
<div id="toggles"></div> <div id="toggles"></div>
<hr /> <hr />
<div class="footer"> <div class="footer">
You have been notified of indie wikis <span id="countAlerts"></span> times Indie wiki alerts: <span id="countAlerts"></span>
and redirected <span id="countRedirects"></span> times. Search results &nbsp;&nbsp;|&nbsp;&nbsp;
have been filtered <span id="countSearchFilters"></span> times. Redirections: <span id="countRedirects"></span>
<br /> &nbsp;&nbsp;|&nbsp;&nbsp;
<span id="version"></span>&nbsp;&nbsp;|&nbsp;&nbsp;<a Search engine results filtered: <span id="countSearchFilters"></span>
href="https://getindie.wiki/"
target="_blank"
>Info & Help</a
>&nbsp;&nbsp;|&nbsp;&nbsp;<a
href="https://getindie.wiki/changelog/"
target="_blank"
>Changelog</a
>&nbsp;&nbsp;|&nbsp;&nbsp;<a
href="https://getindie.wiki/#submit"
target="_blank"
>Submit a Wiki</a
>&nbsp;&nbsp;|&nbsp;&nbsp;<a
href="https://github.com/KevinPayravi/indie-wiki-buddy"
target="_blank"
>Source Code</a
>
</div> </div>
</body> </body>
<script type="text/javascript" src="popup.js"></script> <script type="text/javascript" src="popup.js"></script>

43
popup.js
View File

@ -76,7 +76,12 @@ async function loadOptions(lang) {
for (var i = 0; i < breezewikiHosts.length; i++) { for (var i = 0; i < breezewikiHosts.length; i++) {
let option = document.createElement('option'); let option = document.createElement('option');
option.value = breezewikiHosts[i].instance; option.value = breezewikiHosts[i].instance;
option.innerText = breezewikiHosts[i].instance.replace('https://', ''); let innerText = breezewikiHosts[i].instance.replace('https://', '');
const numberOfPeriods = (innerText.match(/\./g)||[]).length;
if (numberOfPeriods > 1) {
innerText = innerText.substring(innerText.indexOf('.') + 1);
}
option.innerText = innerText;
breezewikiHostSelect.appendChild(option); breezewikiHostSelect.appendChild(option);
if (option.value === host) { if (option.value === host) {
breezewikiHostSelect.value = host; breezewikiHostSelect.value = host;
@ -97,7 +102,12 @@ async function loadOptions(lang) {
for (var i = 0; i < hostOptions.length; i++) { for (var i = 0; i < hostOptions.length; i++) {
let option = document.createElement('option'); let option = document.createElement('option');
option.value = hostOptions[i].instance; option.value = hostOptions[i].instance;
option.innerText = hostOptions[i].instance.replace('https://', ''); let innerText = hostOptions[i].instance.replace('https://', '');
const numberOfPeriods = (innerText.match(/\./g)||[]).length;
if (numberOfPeriods > 1) {
innerText = innerText.substring(innerText.indexOf('.') + 1);
}
option.innerText = innerText;
breezewikiHostSelect.appendChild(option); breezewikiHostSelect.appendChild(option);
if (option.value === host) { if (option.value === host) {
breezewikiHostSelect.value = host; breezewikiHostSelect.value = host;
@ -352,7 +362,7 @@ function setPower(setting) {
var powerImage = document.getElementById('powerImage'); var powerImage = document.getElementById('powerImage');
powerImage.src = 'images/power-' + setting + '.png'; powerImage.src = 'images/power-' + setting + '.png';
var powerText = document.getElementById('powerText'); var powerText = document.getElementById('powerText');
powerText.textContent = 'Extension is ' + setting; powerText.textContent = 'Indie Wiki Buddy is ' + setting;
chrome.runtime.sendMessage({ chrome.runtime.sendMessage({
action: 'updateIcon', action: 'updateIcon',
@ -369,6 +379,15 @@ function setNotifications(setting) {
notificationsText.textContent = 'Notify-on-redirect is ' + setting; notificationsText.textContent = 'Notify-on-redirect is ' + setting;
} }
// Set search filter setting
function setSearchFilter(setting) {
chrome.storage.sync.set({ 'searchFilter': setting });
var searchFilterImage = document.getElementById('searchFilterImage');
searchFilterImage.src = 'images/check-' + setting + '.png';
var searchFilterText = document.getElementById('searchFilterText');
searchFilterText.textContent = 'Search engine filtering is ' + setting;
}
// Set BreezeWiki settings // Set BreezeWiki settings
function setBreezeWiki(setting) { function setBreezeWiki(setting) {
chrome.storage.sync.set({ 'breezewiki': setting }); chrome.storage.sync.set({ 'breezewiki': setting });
@ -410,7 +429,7 @@ function setBreezeWiki(setting) {
document.addEventListener('DOMContentLoaded', function () { document.addEventListener('DOMContentLoaded', function () {
// Adding version to popup: // Adding version to popup:
const version = chrome.runtime.getManifest().version; const version = chrome.runtime.getManifest().version;
document.getElementById('version').textContent = 'v' + version; document.getElementById('version').textContent = 'Version ' + version;
// Get user's last set language // Get user's last set language
chrome.storage.sync.get({ 'lang': 'EN' }, function (item) { chrome.storage.sync.get({ 'lang': 'EN' }, function (item) {
@ -426,18 +445,21 @@ document.addEventListener('DOMContentLoaded', function () {
loadOptions(langSelect.value); loadOptions(langSelect.value);
}); });
// Set power, notification, and BreezeWiki setting toggle values: // Set setting toggle values:
chrome.storage.sync.get({ 'power': 'on' }, function (item) { chrome.storage.sync.get({ 'power': 'on' }, function (item) {
setPower(item.power); setPower(item.power);
}); });
chrome.storage.sync.get({ 'notifications': 'on' }, function (item) { chrome.storage.sync.get({ 'notifications': 'on' }, function (item) {
setNotifications(item.notifications); setNotifications(item.notifications);
}); });
chrome.storage.sync.get({ 'searchFilter': 'on' }, function (item) {
setSearchFilter(item.searchFilter);
});
chrome.storage.sync.get({ 'breezewiki': 'off' }, function (item) { chrome.storage.sync.get({ 'breezewiki': 'off' }, function (item) {
setBreezeWiki(item.breezewiki); setBreezeWiki(item.breezewiki);
}); });
// Add event listeners for power, notification, and BreezeWiki setting toggles // Add event listeners for setting toggles
document.getElementById('powerButton').addEventListener('change', function () { document.getElementById('powerButton').addEventListener('change', function () {
chrome.storage.sync.get({ 'power': 'on' }, function (item) { chrome.storage.sync.get({ 'power': 'on' }, function (item) {
if (item.power === 'on') { if (item.power === 'on') {
@ -456,6 +478,15 @@ document.addEventListener('DOMContentLoaded', function () {
} }
}); });
}); });
document.getElementById('searchFilterButton').addEventListener('change', function () {
chrome.storage.sync.get({ 'searchFilter': 'on' }, function (item) {
if (item.searchFilter === 'on') {
setSearchFilter('off');
} else {
setSearchFilter('on');
}
});
});
document.getElementById('breezewikiButton').addEventListener('change', function () { document.getElementById('breezewikiButton').addEventListener('change', function () {
chrome.storage.sync.get({ 'breezewiki': 'off' }, function (item) { chrome.storage.sync.get({ 'breezewiki': 'off' }, function (item) {
if (item.breezewiki === 'on') { if (item.breezewiki === 'on') {