fix: theme settings being applied before settings
fixes `TypeError: Settings is undefined` on firefox
This commit is contained in:
dargy
parent
35bc026724
commit
456bf389f0
3 changed files with 191 additions and 183 deletions
|
|
@ -4,6 +4,7 @@ var Settings;
|
||||||
let Utilities;
|
let Utilities;
|
||||||
|
|
||||||
chrome.storage.sync.get(['PolyPlus_Settings'], function (result) {
|
chrome.storage.sync.get(['PolyPlus_Settings'], function (result) {
|
||||||
|
console.log(result);
|
||||||
Settings = result.PolyPlus_Settings;
|
Settings = result.PolyPlus_Settings;
|
||||||
|
|
||||||
if (Settings.IRLPriceWithCurrency && Settings.IRLPriceWithCurrency.Enabled === true) {
|
if (Settings.IRLPriceWithCurrency && Settings.IRLPriceWithCurrency.Enabled === true) {
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
const SettingsURL = chrome.runtime.getURL('settings.html');
|
const SettingsURL = chrome.runtime.getURL('settings.html');
|
||||||
const InExtensionSettings = window.location.pathname.split('/')[3] === 'polyplus' && window.location.hash !== '#dev' && window.location.hash !== '#debug';
|
const InExtensionSettings = window.location.pathname.split('/')[3] === 'polyplus' && window.location.hash !== '#dev' && window.location.hash !== '#debug';
|
||||||
|
|
||||||
if (InExtensionSettings === true) {
|
if (InExtensionSettings === true) {
|
||||||
window.location.href = SettingsURL + window.location.hash;
|
window.location.href = SettingsURL + window.location.hash;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
346
js/sitewide.js
346
js/sitewide.js
|
|
@ -1,121 +1,127 @@
|
||||||
var Settings;
|
var Settings;
|
||||||
let Theme = ``;
|
let Theme = ``;
|
||||||
|
|
||||||
(async () => {
|
(async () => {
|
||||||
let Utilities = await import(chrome.runtime.getURL('resources/utils.js'));
|
let Utilities = await import(chrome.runtime.getURL('resources/utils.js'));
|
||||||
Utilities = Utilities.default;
|
Utilities = Utilities.default;
|
||||||
|
|
||||||
chrome.storage.sync.get(['PolyPlus_Settings'], function (result) {
|
chrome.storage.sync.get(['PolyPlus_Settings'], function (result) {
|
||||||
// Merge settings and expected settings to make sure all keys exist
|
// Merge settings and expected settings to make sure all keys exist
|
||||||
const RawSettings = result.PolyPlus_Settings;
|
const RawSettings = result.PolyPlus_Settings;
|
||||||
Settings = MergeObjects(RawSettings || Utilities.DefaultSettings, Utilities.DefaultSettings);
|
Settings = MergeObjects(RawSettings || Utilities.DefaultSettings, Utilities.DefaultSettings);
|
||||||
|
|
||||||
// If theme exists, create a style element to represent it
|
// Apply theme settings after Settings is defined
|
||||||
if (Settings.ThemeCreator && Settings.ThemeCreator.Enabled === true) {
|
applyThemeSettings();
|
||||||
switch (Settings.ThemeCreator.BGImageSize) {
|
});
|
||||||
case 0:
|
})();
|
||||||
Settings.ThemeCreator.BGImageSize = 'fit';
|
|
||||||
break;
|
|
||||||
case 1:
|
|
||||||
Settings.ThemeCreator.BGImageSize = 'cover';
|
|
||||||
break;
|
|
||||||
case 2:
|
|
||||||
Settings.ThemeCreator.BGImageSize = 'contain';
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
Theme += `
|
|
||||||
:root {
|
|
||||||
--polyplus-navbgcolor: ${Settings.ThemeCreator.NavBGColor};
|
|
||||||
--polyplus-navbordercolor: ${Settings.ThemeCreator.NavBorderColor};
|
|
||||||
--polyplus-navitemcolor: ${Settings.ThemeCreator.NavItemColor};
|
|
||||||
--polyplus-sidebarbgcolor: ${Settings.ThemeCreator.SideBGColor};
|
|
||||||
--polyplus-sidebarbordercolor: ${Settings.ThemeCreator.SideBorderColor};
|
|
||||||
--polyplus-sidebaritembgcolor: ${Settings.ThemeCreator.SideItemBGColor};
|
|
||||||
--polyplus-sidebaritembordercolor: ${Settings.ThemeCreator.SideItemBorderColor};
|
|
||||||
--polyplus-sidebaritemcolor: ${Settings.ThemeCreator.SideItemColor};
|
|
||||||
--polyplus-sidebaritemlabelcolor: ${Settings.ThemeCreator.SideItemLabelColor};
|
|
||||||
--polyplus-bgcolor: ${Settings.ThemeCreator.BGColor};
|
|
||||||
--polyplus-bgimage: url(${Settings.ThemeCreator.BGImage});
|
|
||||||
--polyplus-bgimagesize: ${Settings.ThemeCreator.BGImageSize};
|
|
||||||
--polyplus-primarytextcolor: ${Settings.ThemeCreator.PrimaryTextColor};
|
|
||||||
--polyplus-secondarytextcolor: ${Settings.ThemeCreator.SecondaryTextColor};
|
|
||||||
--polyplus-linktextcolor: ${Settings.ThemeCreator.LinkTextColor};
|
|
||||||
--polyplus-linkhoveredtextcolor: ${Settings.ThemeCreator.LinkHoveredTextColor};
|
|
||||||
--polyplus-linkfocusedtextcolor: ${Settings.ThemeCreator.LinkFocusedTextColor};
|
|
||||||
--polyplus-linkvisitedtextcolor: ${Settings.ThemeCreator.LinkVisitedTextColor};
|
|
||||||
--polyplus-cardheadbgcolor: ${Settings.ThemeCreator.CardHeadBGColor};
|
|
||||||
--polyplus-cardbodybgcolor: ${Settings.ThemeCreator.CardBodyBGColor};
|
|
||||||
--polyplus-cardbordercolor: ${Settings.ThemeCreator.CardBorderColor};
|
|
||||||
}
|
|
||||||
|
|
||||||
nav {
|
function applyThemeSettings() {
|
||||||
background-color: var(--polyplus-navbgcolor) !important;
|
// If theme exists, create a style element to represent it
|
||||||
border-bottom: 1px solid var(--polyplus-navbordercolor) !important;
|
if (Settings.ThemeCreator && Settings.ThemeCreator.Enabled === true) {
|
||||||
}
|
switch (Settings.ThemeCreator.BGImageSize) {
|
||||||
|
case 0:
|
||||||
|
Settings.ThemeCreator.BGImageSize = 'fit';
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
Settings.ThemeCreator.BGImageSize = 'cover';
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
Settings.ThemeCreator.BGImageSize = 'contain';
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
Theme += `
|
||||||
|
:root {
|
||||||
|
--polyplus-navbgcolor: ${Settings.ThemeCreator.NavBGColor};
|
||||||
|
--polyplus-navbordercolor: ${Settings.ThemeCreator.NavBorderColor};
|
||||||
|
--polyplus-navitemcolor: ${Settings.ThemeCreator.NavItemColor};
|
||||||
|
--polyplus-sidebarbgcolor: ${Settings.ThemeCreator.SideBGColor};
|
||||||
|
--polyplus-sidebarbordercolor: ${Settings.ThemeCreator.SideBorderColor};
|
||||||
|
--polyplus-sidebaritembgcolor: ${Settings.ThemeCreator.SideItemBGColor};
|
||||||
|
--polyplus-sidebaritembordercolor: ${Settings.ThemeCreator.SideItemBorderColor};
|
||||||
|
--polyplus-sidebaritemcolor: ${Settings.ThemeCreator.SideItemColor};
|
||||||
|
--polyplus-sidebaritemlabelcolor: ${Settings.ThemeCreator.SideItemLabelColor};
|
||||||
|
--polyplus-bgcolor: ${Settings.ThemeCreator.BGColor};
|
||||||
|
--polyplus-bgimage: url(${Settings.ThemeCreator.BGImage});
|
||||||
|
--polyplus-bgimagesize: ${Settings.ThemeCreator.BGImageSize};
|
||||||
|
--polyplus-primarytextcolor: ${Settings.ThemeCreator.PrimaryTextColor};
|
||||||
|
--polyplus-secondarytextcolor: ${Settings.ThemeCreator.SecondaryTextColor};
|
||||||
|
--polyplus-linktextcolor: ${Settings.ThemeCreator.LinkTextColor};
|
||||||
|
--polyplus-linkhoveredtextcolor: ${Settings.ThemeCreator.LinkHoveredTextColor};
|
||||||
|
--polyplus-linkfocusedtextcolor: ${Settings.ThemeCreator.LinkFocusedTextColor};
|
||||||
|
--polyplus-linkvisitedtextcolor: ${Settings.ThemeCreator.LinkVisitedTextColor};
|
||||||
|
--polyplus-cardheadbgcolor: ${Settings.ThemeCreator.CardHeadBGColor};
|
||||||
|
--polyplus-cardbodybgcolor: ${Settings.ThemeCreator.CardBodyBGColor};
|
||||||
|
--polyplus-cardbordercolor: ${Settings.ThemeCreator.CardBorderColor};
|
||||||
|
}
|
||||||
|
|
||||||
.nav-sidebar {
|
nav {
|
||||||
background-color: var(--polyplus-sidebarbgcolor) !important;
|
background-color: var(--polyplus-navbgcolor) !important;
|
||||||
border-right: 1px solid var(--polyplus-sidebarbordercolor) !important;
|
border-bottom: 1px solid var(--polyplus-navbordercolor) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
#app {
|
.nav-sidebar {
|
||||||
background-color: var(--polyplus-bgcolor) !important;
|
background-color: var(--polyplus-sidebarbgcolor) !important;
|
||||||
background-image: var(--polyplus-bgimage) !important;
|
border-right: 1px solid var(--polyplus-sidebarbordercolor) !important;
|
||||||
background-size var(--polyplus-bgimagesize)
|
}
|
||||||
color: var(--polyplus-primarytextcolor) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-muted {
|
#app {
|
||||||
color: var(--polyplus-secondarytextcolor) !important;
|
background-color: var(--polyplus-bgcolor) !important;
|
||||||
}
|
background-image: var(--polyplus-bgimage) !important;
|
||||||
|
background-size var(--polyplus-bgimagesize)
|
||||||
|
color: var(--polyplus-primarytextcolor) !important;
|
||||||
|
}
|
||||||
|
|
||||||
a {
|
.text-muted {
|
||||||
color: var(--polyplus-linktextcolor) !important;
|
color: var(--polyplus-secondarytextcolor) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover {
|
a {
|
||||||
color: var(--polyplus-linkhoveredtextcolor) !important;
|
color: var(--polyplus-linktextcolor) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:focus {
|
a:hover {
|
||||||
color: var(--polyplus-linkfocusedtextcolor) !important;
|
color: var(--polyplus-linkhoveredtextcolor) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
a:focus {
|
||||||
a:visited {
|
color: var(--polyplus-linkfocusedtextcolor) !important;
|
||||||
color: var(--polyplus-linkvisitedtextcolor) !important;
|
}
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
.card-header {
|
/*
|
||||||
background-color: var(--polyplus-cardheadbgcolor) !important;
|
a:visited {
|
||||||
}
|
color: var(--polyplus-linkvisitedtextcolor) !important;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
.card {
|
.card-header {
|
||||||
background-color: var(--polyplus-cardbodybgcolor) !important;
|
background-color: var(--polyplus-cardheadbgcolor) !important;
|
||||||
border-color: var(--polyplus-cardbordercolor) !important;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
nav a.nav-link {
|
.card {
|
||||||
color: var(--polyplus-navitemcolor) !important;
|
background-color: var(--polyplus-cardbodybgcolor) !important;
|
||||||
}
|
border-color: var(--polyplus-cardbordercolor) !important;
|
||||||
|
}
|
||||||
|
|
||||||
.nav-sidebar .nav-sidebar-button {
|
nav a.nav-link {
|
||||||
background-color: var(--polyplus-sidebaritembgcolor) !important;
|
color: var(--polyplus-navitemcolor) !important;
|
||||||
border-color: var(--polyplus-sidebaritembordercolor) !important;
|
}
|
||||||
color: var(--polyplus-sidebaritemcolor) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-sidebar-text {
|
.nav-sidebar .nav-sidebar-button {
|
||||||
color: var(--polyplus-sidebaritemlabelcolor) !important;
|
background-color: var(--polyplus-sidebaritembgcolor) !important;
|
||||||
}
|
border-color: var(--polyplus-sidebaritembordercolor) !important;
|
||||||
`;
|
color: var(--polyplus-sidebaritemcolor) !important;
|
||||||
}
|
}
|
||||||
});
|
|
||||||
|
.nav-sidebar-text {
|
||||||
|
color: var(--polyplus-sidebaritemlabelcolor) !important;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
const combination = "reload";
|
const combination = "reload";
|
||||||
let currentCombination = "";
|
let currentCombination = "";
|
||||||
document.addEventListener("keypress", function(e) {
|
document.addEventListener("keypress", function (e) {
|
||||||
currentCombination += e.key;
|
currentCombination += e.key;
|
||||||
if (currentCombination === combination && document.activeElement.tagName !== "INPUT") {
|
if (currentCombination === combination && document.activeElement.tagName !== "INPUT") {
|
||||||
console.log("Reloading Poly+...");
|
console.log("Reloading Poly+...");
|
||||||
|
|
@ -126,97 +132,97 @@ let Theme = ``;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
if (Settings.HideUserAds && Settings.HideUserAds.Enabled === true) {
|
if (Settings.HideUserAds && Settings.HideUserAds.Enabled === true) {
|
||||||
if (Settings.HideUserAds.Banners && Settings.HideUserAds.Banners === true) {
|
if (Settings.HideUserAds.Banners && Settings.HideUserAds.Banners === true) {
|
||||||
Theme += `
|
Theme += `
|
||||||
div[style^="max-width: 728px;"]:has(a[href^="/ads"]) {
|
div[style^="max-width: 728px;"]:has(a[href^="/ads"]) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
}
|
|
||||||
|
|
||||||
if (Settings.HideUserAds.Rectangles && Settings.HideUserAds.Rectangles === true) {
|
|
||||||
Theme += `
|
|
||||||
div[style^="max-width: 300px;"]:has(a[href^="/ads"]) {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (Settings.HideNotifBadgesOn === true) {
|
|
||||||
Theme += `
|
|
||||||
.notif-nav .notif-sidebar {
|
|
||||||
display: none;
|
|
||||||
}
|
}
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Credit to @SK-Fast (also known as DevPixels) for the improved loading code (taken from his original Poly+, and reformatted to Index Poly+)
|
if (Settings.HideUserAds.Rectangles && Settings.HideUserAds.Rectangles === true) {
|
||||||
const ThemeBlob = new Blob([Theme], {type: 'text/css'});
|
Theme += `
|
||||||
const ThemeURL = URL.createObjectURL(ThemeBlob);
|
div[style^="max-width: 300px;"]:has(a[href^="/ads"]) {
|
||||||
document.head.innerHTML += `<link href="${ThemeURL}" rel="stylesheet" type="text/css">`;
|
display: none;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', async function () {
|
if (Settings.HideNotifBadgesOn === true) {
|
||||||
if (document.getElementsByClassName('card-header')[0] && document.getElementsByClassName('card-header')[0].innerText === ' Page not found') {
|
Theme += `
|
||||||
return;
|
.notif-nav .notif-sidebar {
|
||||||
}
|
display: none;
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
Utilities.InjectResource('getUserDetails');
|
// Credit to @SK-Fast (also known as DevPixels) for the improved loading code (taken from his original Poly+, and reformatted to Index Poly+)
|
||||||
document.body.setAttribute('data-URL', window.location.pathname);
|
const ThemeBlob = new Blob([Theme], { type: 'text/css' });
|
||||||
|
const ThemeURL = URL.createObjectURL(ThemeBlob);
|
||||||
|
document.head.innerHTML += `<link href="${ThemeURL}" rel="stylesheet" type="text/css">`;
|
||||||
|
|
||||||
const UserData = JSON.parse(window.localStorage.getItem('p+account_info'));
|
document.addEventListener('DOMContentLoaded', async function () {
|
||||||
|
if (document.getElementsByClassName('card-header')[0] && document.getElementsByClassName('card-header')[0].innerText === ' Page not found') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if (Settings.IRLPriceWithCurrency && Settings.IRLPriceWithCurrency.Enabled === true) {
|
Utilities.InjectResource('getUserDetails');
|
||||||
const IRLResult = await Utilities.CalculateIRL(document.querySelector('.brickBalanceCont').innerText.replace(/\s+/g, ''), Settings.IRLPriceWithCurrency.Currency);
|
document.body.setAttribute('data-URL', window.location.pathname);
|
||||||
// Desktop
|
|
||||||
document.querySelector('.text-success .brickBalanceCount').innerHTML += ` (${IRLResult.icon}${IRLResult.result} ${IRLResult.display})`;
|
|
||||||
|
|
||||||
// Mobile
|
const UserData = JSON.parse(window.localStorage.getItem('p+account_info'));
|
||||||
document.querySelector('.text-success .brickBalanceCont').innerHTML += ` (${IRLResult.icon}${IRLResult.result} ${IRLResult.display})`;
|
|
||||||
//document.querySelector('.text-success .brickBalanceCont').innerHTML += `<div class="text-muted" style="font-size: 0.6rem;text-align: right;">(${IRLResult.icon}${IRLResult.result} ${IRLResult.display})</div>`
|
|
||||||
}
|
|
||||||
|
|
||||||
if (Settings.ModifyNavOn && Settings.ModifyNavOn === true) {
|
if (Settings.IRLPriceWithCurrency && Settings.IRLPriceWithCurrency.Enabled === true) {
|
||||||
let NavbarItems = document.querySelectorAll('.navbar-nav.me-auto a.nav-link[href]');
|
const IRLResult = await Utilities.CalculateIRL(document.querySelector('.brickBalanceCont').innerText.replace(/\s+/g, ''), Settings.IRLPriceWithCurrency.Currency);
|
||||||
let Needed = [NavbarItems[11], NavbarItems[12], NavbarItems[13], NavbarItems[14], NavbarItems[15]];
|
// Desktop
|
||||||
for (let i = 0; i < Settings.ModifyNav.length; i++) {
|
document.querySelector('.text-success .brickBalanceCount').innerHTML += ` (${IRLResult.icon}${IRLResult.result} ${IRLResult.display})`;
|
||||||
if (Settings.ModifyNav[i].Label != null) {
|
|
||||||
console.log(Needed[i], Needed[i].children[1]);
|
|
||||||
Needed[i].children[1].innerText = Settings.ModifyNav[i].Label;
|
|
||||||
Needed[i].href = Settings.ModifyNav[i].Link;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
// Mobile
|
||||||
|
document.querySelector('.text-success .brickBalanceCont').innerHTML += ` (${IRLResult.icon}${IRLResult.result} ${IRLResult.display})`;
|
||||||
|
//document.querySelector('.text-success .brickBalanceCont').innerHTML += `<div class="text-muted" style="font-size: 0.6rem;text-align: right;">(${IRLResult.icon}${IRLResult.result} ${IRLResult.display})</div>`
|
||||||
|
}
|
||||||
|
|
||||||
|
if (Settings.ModifyNavOn && Settings.ModifyNavOn === true) {
|
||||||
|
let NavbarItems = document.querySelectorAll('.navbar-nav.me-auto a.nav-link[href]');
|
||||||
|
let Needed = [NavbarItems[11], NavbarItems[12], NavbarItems[13], NavbarItems[14], NavbarItems[15]];
|
||||||
|
for (let i = 0; i < Settings.ModifyNav.length; i++) {
|
||||||
|
if (Settings.ModifyNav[i].Label != null) {
|
||||||
|
console.log(Needed[i], Needed[i].children[1]);
|
||||||
|
Needed[i].children[1].innerText = Settings.ModifyNav[i].Label;
|
||||||
|
Needed[i].href = Settings.ModifyNav[i].Link;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
if (Settings.HideUserAdsOn === true) {
|
if (Settings.HideUserAdsOn === true) {
|
||||||
Array.from(document.querySelectorAll('.text-center:has(a[href^="/ads"])')).forEach(ad => {ad.remove()})
|
Array.from(document.querySelectorAll('.text-center:has(a[href^="/ads"])')).forEach(ad => {ad.remove()})
|
||||||
}
|
}
|
||||||
*/
|
*/
|
||||||
|
|
||||||
if (Settings.HideNotifBadgesOn === true) {
|
if (Settings.HideNotifBadgesOn === true) {
|
||||||
document.getElementsByClassName('notif-nav notif-sidebar').forEach((element) => {
|
document.getElementsByClassName('notif-nav notif-sidebar').forEach((element) => {
|
||||||
element.remove();
|
element.remove();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})();
|
}
|
||||||
|
|
||||||
function MergeObjects(obj1, obj2) {
|
function MergeObjects(obj1, obj2) {
|
||||||
var mergedObj = {};
|
var mergedObj = {};
|
||||||
|
|
||||||
// Copy the values from obj1 to the mergedObj
|
// Copy the values from obj1 to the mergedObj
|
||||||
for (var key in obj1) {
|
for (var key in obj1) {
|
||||||
mergedObj[key] = obj1[key];
|
mergedObj[key] = obj1[key];
|
||||||
}
|
}
|
||||||
|
|
||||||
// Merge the values from obj2 into the mergedObj, favoring obj2 for non-existing keys in obj1
|
// Merge the values from obj2 into the mergedObj, favoring obj2 for non-existing keys in obj1
|
||||||
for (var key in obj2) {
|
for (var key in obj2) {
|
||||||
if (!obj1.hasOwnProperty(key)) {
|
if (!obj1.hasOwnProperty(key)) {
|
||||||
mergedObj[key] = obj2[key];
|
mergedObj[key] = obj2[key];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return mergedObj;
|
return mergedObj;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Reference in a new issue