fix: theme settings being applied before settings

fixes `TypeError: Settings is undefined` on firefox
This commit is contained in:
dargy 2024-06-17 21:58:02 -05:00
parent 35bc026724
commit 456bf389f0
3 changed files with 191 additions and 183 deletions

View file

@ -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) {

View file

@ -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;
} }

View file

@ -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; function applyThemeSettings() {
case 1: // If theme exists, create a style element to represent it
Settings.ThemeCreator.BGImageSize = 'cover'; if (Settings.ThemeCreator && Settings.ThemeCreator.Enabled === true) {
break; switch (Settings.ThemeCreator.BGImageSize) {
case 2: case 0:
Settings.ThemeCreator.BGImageSize = 'contain'; Settings.ThemeCreator.BGImageSize = 'fit';
break; break;
} case 1:
Theme += ` Settings.ThemeCreator.BGImageSize = 'cover';
:root { break;
--polyplus-navbgcolor: ${Settings.ThemeCreator.NavBGColor}; case 2:
--polyplus-navbordercolor: ${Settings.ThemeCreator.NavBorderColor}; Settings.ThemeCreator.BGImageSize = 'contain';
--polyplus-navitemcolor: ${Settings.ThemeCreator.NavItemColor}; break;
--polyplus-sidebarbgcolor: ${Settings.ThemeCreator.SideBGColor}; }
--polyplus-sidebarbordercolor: ${Settings.ThemeCreator.SideBorderColor}; Theme += `
--polyplus-sidebaritembgcolor: ${Settings.ThemeCreator.SideItemBGColor}; :root {
--polyplus-sidebaritembordercolor: ${Settings.ThemeCreator.SideItemBorderColor}; --polyplus-navbgcolor: ${Settings.ThemeCreator.NavBGColor};
--polyplus-sidebaritemcolor: ${Settings.ThemeCreator.SideItemColor}; --polyplus-navbordercolor: ${Settings.ThemeCreator.NavBorderColor};
--polyplus-sidebaritemlabelcolor: ${Settings.ThemeCreator.SideItemLabelColor}; --polyplus-navitemcolor: ${Settings.ThemeCreator.NavItemColor};
--polyplus-bgcolor: ${Settings.ThemeCreator.BGColor}; --polyplus-sidebarbgcolor: ${Settings.ThemeCreator.SideBGColor};
--polyplus-bgimage: url(${Settings.ThemeCreator.BGImage}); --polyplus-sidebarbordercolor: ${Settings.ThemeCreator.SideBorderColor};
--polyplus-bgimagesize: ${Settings.ThemeCreator.BGImageSize}; --polyplus-sidebaritembgcolor: ${Settings.ThemeCreator.SideItemBGColor};
--polyplus-primarytextcolor: ${Settings.ThemeCreator.PrimaryTextColor}; --polyplus-sidebaritembordercolor: ${Settings.ThemeCreator.SideItemBorderColor};
--polyplus-secondarytextcolor: ${Settings.ThemeCreator.SecondaryTextColor}; --polyplus-sidebaritemcolor: ${Settings.ThemeCreator.SideItemColor};
--polyplus-linktextcolor: ${Settings.ThemeCreator.LinkTextColor}; --polyplus-sidebaritemlabelcolor: ${Settings.ThemeCreator.SideItemLabelColor};
--polyplus-linkhoveredtextcolor: ${Settings.ThemeCreator.LinkHoveredTextColor}; --polyplus-bgcolor: ${Settings.ThemeCreator.BGColor};
--polyplus-linkfocusedtextcolor: ${Settings.ThemeCreator.LinkFocusedTextColor}; --polyplus-bgimage: url(${Settings.ThemeCreator.BGImage});
--polyplus-linkvisitedtextcolor: ${Settings.ThemeCreator.LinkVisitedTextColor}; --polyplus-bgimagesize: ${Settings.ThemeCreator.BGImageSize};
--polyplus-cardheadbgcolor: ${Settings.ThemeCreator.CardHeadBGColor}; --polyplus-primarytextcolor: ${Settings.ThemeCreator.PrimaryTextColor};
--polyplus-cardbodybgcolor: ${Settings.ThemeCreator.CardBodyBGColor}; --polyplus-secondarytextcolor: ${Settings.ThemeCreator.SecondaryTextColor};
--polyplus-cardbordercolor: ${Settings.ThemeCreator.CardBorderColor}; --polyplus-linktextcolor: ${Settings.ThemeCreator.LinkTextColor};
} --polyplus-linkhoveredtextcolor: ${Settings.ThemeCreator.LinkHoveredTextColor};
--polyplus-linkfocusedtextcolor: ${Settings.ThemeCreator.LinkFocusedTextColor};
nav { --polyplus-linkvisitedtextcolor: ${Settings.ThemeCreator.LinkVisitedTextColor};
background-color: var(--polyplus-navbgcolor) !important; --polyplus-cardheadbgcolor: ${Settings.ThemeCreator.CardHeadBGColor};
border-bottom: 1px solid var(--polyplus-navbordercolor) !important; --polyplus-cardbodybgcolor: ${Settings.ThemeCreator.CardBodyBGColor};
} --polyplus-cardbordercolor: ${Settings.ThemeCreator.CardBorderColor};
}
.nav-sidebar {
background-color: var(--polyplus-sidebarbgcolor) !important; nav {
border-right: 1px solid var(--polyplus-sidebarbordercolor) !important; background-color: var(--polyplus-navbgcolor) !important;
} border-bottom: 1px solid var(--polyplus-navbordercolor) !important;
}
#app {
background-color: var(--polyplus-bgcolor) !important; .nav-sidebar {
background-image: var(--polyplus-bgimage) !important; background-color: var(--polyplus-sidebarbgcolor) !important;
background-size var(--polyplus-bgimagesize) border-right: 1px solid var(--polyplus-sidebarbordercolor) !important;
color: var(--polyplus-primarytextcolor) !important; }
}
#app {
.text-muted { background-color: var(--polyplus-bgcolor) !important;
color: var(--polyplus-secondarytextcolor) !important; background-image: var(--polyplus-bgimage) !important;
} background-size var(--polyplus-bgimagesize)
color: var(--polyplus-primarytextcolor) !important;
a { }
color: var(--polyplus-linktextcolor) !important;
} .text-muted {
color: var(--polyplus-secondarytextcolor) !important;
a:hover { }
color: var(--polyplus-linkhoveredtextcolor) !important;
} a {
color: var(--polyplus-linktextcolor) !important;
a:focus { }
color: var(--polyplus-linkfocusedtextcolor) !important;
} a:hover {
color: var(--polyplus-linkhoveredtextcolor) !important;
/* }
a:visited {
color: var(--polyplus-linkvisitedtextcolor) !important; a:focus {
} color: var(--polyplus-linkfocusedtextcolor) !important;
*/ }
.card-header { /*
background-color: var(--polyplus-cardheadbgcolor) !important; a:visited {
} color: var(--polyplus-linkvisitedtextcolor) !important;
}
.card { */
background-color: var(--polyplus-cardbodybgcolor) !important;
border-color: var(--polyplus-cardbordercolor) !important; .card-header {
} background-color: var(--polyplus-cardheadbgcolor) !important;
}
nav a.nav-link {
color: var(--polyplus-navitemcolor) !important; .card {
} background-color: var(--polyplus-cardbodybgcolor) !important;
border-color: var(--polyplus-cardbordercolor) !important;
.nav-sidebar .nav-sidebar-button { }
background-color: var(--polyplus-sidebaritembgcolor) !important;
border-color: var(--polyplus-sidebaritembordercolor) !important; nav a.nav-link {
color: var(--polyplus-sidebaritemcolor) !important; color: var(--polyplus-navitemcolor) !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;
} }