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.')) {
// Check if doing a Google search:
function filterGoogle() {
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') {
} else if ((storage.searchFilter ?? 'on') === 'on') {
if (currentURL.hostname.includes('www.google.')) {
// Check if doing a Google search:
function filterGoogle() {
let fandomSearchResults = document.querySelectorAll("div[data-hveid] a[href*='fandom.com']");
filterSearchResults(fandomSearchResults, 'google', storage);
}
addLocationObserver(main);
filterDuckDuckGo();
} else {
document.addEventListener('readystatechange', e => {
if (document.readyState === 'complete') {
addLocationObserver(main);
filterDuckDuckGo();
}
});
}
} else if (currentURL.hostname.includes('www.bing.com')) {
// Check if doing a Bing search:
function filterBing() {
let fandomSearchResults = Array.from(document.querySelectorAll(".b_attribution>cite")).filter(el => el.innerHTML.includes('fandom.com'));
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();
}
});
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);
filterDuckDuckGo();
} else {
document.addEventListener('readystatechange', e => {
if (document.readyState === 'complete') {
addLocationObserver(main);
filterDuckDuckGo();
}
});
}
} else if (currentURL.hostname.includes('www.bing.com')) {
// Check if doing a Bing search:
function filterBing() {
let fandomSearchResults = Array.from(document.querySelectorAll(".b_attribution>cite")).filter(el => el.innerHTML.includes('fandom.com'));
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 {
font-size: 1.2rem;
margin: 8px 0;
}
hr {
height: 1px;
border: none;
color: #333;
background-color: #333;
color: #555;
background-color: #555;
}
label {
@ -40,17 +41,30 @@
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 {
display: flex;
flex-direction: column;
align-items: left;
user-select: none;
row-gap: 2px;
margin-top: 4px;
}
.options > div {
flex: 50%;
padding: 5px;
}
.options > div {
padding-bottom: 10px;
}
.options > div:last-child {
padding: 0px;
}
#controls {
@ -105,6 +119,12 @@
vertical-align: middle;
}
.columns {
display: grid;
grid-auto-columns: 1fr;
grid-auto-flow: column;
}
#toggles {
height: 16em;
white-space: nowrap;
@ -143,12 +163,15 @@
width: 17px;
}
.header,
#langSelectContainer {
font-size: 0.9em;
margin-bottom: 10px;
}
.footer {
text-align: center;
line-height: 1.4em;
}
.footer a {
font-size: 0.9em;
padding: 5px 0px;
@ -162,78 +185,112 @@
font-size: 0.8rem;
}
#langSelectContainer {
float: right;
text-align: right;
margin-top: 10px;
padding-right: 10px;
}
#breezewikiHost {
display: none;
padding-left: 10px;
}
#breezewikiHost > label {
padding-left: 10px;
}
</style>
</head>
<body>
<div class="header">
<h1>Indie Wiki Buddy</h1>
</div>
<div id="langSelectContainer">
<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>
<div class="options">
<div class="settingToggleContainer">
<div id="power" class="settingToggle">
<input id="powerButton" type="checkbox" />
<label for="powerButton">
<img id="powerImage" src="" alt="" />
<span id="powerText"></span>
</label>
</div>
<div class="columns">
<div class="links">
<h1>Indie Wiki Buddy</h1>
<span id="version"></span>
<br />
<a
href="https://getindie.wiki/"
target="_blank"
>Info & Help</a
>
<br />
<a
href="https://getindie.wiki/changelog/"
target="_blank"
>Changelog</a
>
<br />
<a
href="https://getindie.wiki/#submit"
target="_blank"
>Submit a Wiki</a
>
<br />
<a
href="https://github.com/KevinPayravi/indie-wiki-buddy"
target="_blank"
>Source Code</a
>
</div>
<div class="settingToggleContainer">
<div id="notifications" class="settingToggle">
<input id="notificationsButton" type="checkbox" />
<label for="notificationsButton">
<img id="notificationsImage" src="" alt="" />
<span id="notificationsText"></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 class="options">
<div class="settingToggleContainer">
<div id="power" class="settingToggle">
<input id="powerButton" type="checkbox" />
<label for="powerButton">
<img id="powerImage" src="" alt="" />
<span id="powerText"></span>
</label>
</div>
</div>
</div>
<div class="settingToggleContainer">
<div id="breezewikiHost" class="settingToggle">
<label for="breezewikiHostSelect">BreezeWiki host: </label>
<select name="breezewikiHost" id="breezewikiHostSelect"></select>
<div class="settingToggleContainer">
<div id="notifications" class="settingToggle">
<input id="notificationsButton" type="checkbox" />
<label for="notificationsButton">
<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>
<hr />
<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">
<img src="images/toggle-disabled.png" width="10" alt="" /> Disable all
</button>
@ -255,7 +312,6 @@
search for none
</button>
</div>
<br />
<div id="togglesKey">
<div>
<img
@ -293,27 +349,11 @@
<div id="toggles"></div>
<hr />
<div class="footer">
You have been notified of indie wikis <span id="countAlerts"></span> times
and redirected <span id="countRedirects"></span> times. Search results
have been filtered <span id="countSearchFilters"></span> times.
<br />
<span id="version"></span>&nbsp;&nbsp;|&nbsp;&nbsp;<a
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
>
Indie wiki alerts: <span id="countAlerts"></span>
&nbsp;&nbsp;|&nbsp;&nbsp;
Redirections: <span id="countRedirects"></span>
&nbsp;&nbsp;|&nbsp;&nbsp;
Search engine results filtered: <span id="countSearchFilters"></span>
</div>
</body>
<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++) {
let option = document.createElement('option');
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);
if (option.value === host) {
breezewikiHostSelect.value = host;
@ -97,7 +102,12 @@ async function loadOptions(lang) {
for (var i = 0; i < hostOptions.length; i++) {
let option = document.createElement('option');
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);
if (option.value === host) {
breezewikiHostSelect.value = host;
@ -352,7 +362,7 @@ function setPower(setting) {
var powerImage = document.getElementById('powerImage');
powerImage.src = 'images/power-' + setting + '.png';
var powerText = document.getElementById('powerText');
powerText.textContent = 'Extension is ' + setting;
powerText.textContent = 'Indie Wiki Buddy is ' + setting;
chrome.runtime.sendMessage({
action: 'updateIcon',
@ -369,6 +379,15 @@ function setNotifications(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
function setBreezeWiki(setting) {
chrome.storage.sync.set({ 'breezewiki': setting });
@ -410,7 +429,7 @@ function setBreezeWiki(setting) {
document.addEventListener('DOMContentLoaded', function () {
// Adding version to popup:
const version = chrome.runtime.getManifest().version;
document.getElementById('version').textContent = 'v' + version;
document.getElementById('version').textContent = 'Version ' + version;
// Get user's last set language
chrome.storage.sync.get({ 'lang': 'EN' }, function (item) {
@ -426,18 +445,21 @@ document.addEventListener('DOMContentLoaded', function () {
loadOptions(langSelect.value);
});
// Set power, notification, and BreezeWiki setting toggle values:
// Set setting toggle values:
chrome.storage.sync.get({ 'power': 'on' }, function (item) {
setPower(item.power);
});
chrome.storage.sync.get({ 'notifications': 'on' }, function (item) {
setNotifications(item.notifications);
});
chrome.storage.sync.get({ 'searchFilter': 'on' }, function (item) {
setSearchFilter(item.searchFilter);
});
chrome.storage.sync.get({ 'breezewiki': 'off' }, function (item) {
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 () {
chrome.storage.sync.get({ 'power': 'on' }, function (item) {
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 () {
chrome.storage.sync.get({ 'breezewiki': 'off' }, function (item) {
if (item.breezewiki === 'on') {