Index/polyplus
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved Settings Page and other Improvements

Browse source 
- Improved settings page ("*unsaved" title when not saved yet, redesigned toggle indicators, redesigned toggle buttons, and small changes)

- data-URL property of the body HTML tag is now the pathname rather than the full URL

- Work in progress places integration for Pinned Games (on the actual places page, debating deleting this or not)

- Code cleanup

- Code improvements

- Added .gitignore

- Updated specific.css to use pathnames rather than the full URL

- Updated data_structure.txt reference for developers

- Changed manifest version name to pre-release build so you can tell what build you are using
This commit is contained in:
Index 2024-02-21 21:48:06 -06:00
parent f35921c3d4
commit 948c9b8fae
8 changed files with 208 additions and 251 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.gitignore vendored Normal file
View file

@ -0,0 +1 @@
.DS_Store

6
css/specific.css
View file

@ -1,12 +1,12 @@
body[data-URL^="https://polytoria.com/my/friends"] .col-lg-3 { body[data-URL^="/my/friends"] .col-lg-3 {
margin-bottom: 20px; margin-bottom: 20px;
} }
body[data-URL^="https://polytoria.com/create/"] .mt-2.mt-lg-0.col-lg.d-flex.align-content-between.flex-wrap { body[data-URL^="/create/"] .mt-2.mt-lg-0.col-lg.d-flex.align-content-between.flex-wrap {
width: 50%; width: 50%;
} }
body[data-URL^="https://polytoria.com/create/"] .col.d-flex.align-content-between.flex-wrap { body[data-URL^="/create/"] .col.d-flex.align-content-between.flex-wrap {
width: 50%; width: 50%;
} }

2
data_structure.txt
View file

@ -1,4 +1,4 @@
PolyPlus_Settings: [] PolyPlus_Settings: {}
PolyPlus_PinnedGames: [] PolyPlus_PinnedGames: []
PolyPlus_BestFriends: [] PolyPlus_BestFriends: []
PolyPlus_ItemWishlist: [] PolyPlus_ItemWishlist: []

2
js/everywhere.js
View file

@ -137,7 +137,7 @@ let Theme = null;
} }
window.localStorage.setItem('account_info', JSON.stringify(UserData)) window.localStorage.setItem('account_info', JSON.stringify(UserData))
document.body.setAttribute('data-URL', window.location.href) document.body.setAttribute('data-URL', window.location.pathname)
// Add PolyPlus Settings link to Sidebar // Add PolyPlus Settings link to Sidebar
const Parent = document.querySelector('ul.nav.nav-flush') const Parent = document.querySelector('ul.nav.nav-flush')

25
js/places/places.js Normal file
View file

@ -0,0 +1,25 @@
let Settings;
let PinnedGamesData;
chrome.storage.sync.get(['PolyPlus_Settings', 'PolyPlus_PinnedGames'], function(result){
Settings = result.PolyPlus_Settings || {}
PinnedGamesData = result.PolyPlus_PinnedGames || []
if (Settings.PinnedGamesOn === true) {}
})
function PinnedGames() {
for (let game of PinnedGamesData) {
fetch('https://api.polytoria.com/v1/places/' + game)
.then(response => {
if (!response.ok) {
throw new Error('Network not ok')
}
return response.json()
})
.then(data => {
// epic
})
.catch(error => {console.log(error)})
}
}

1
manifest.json
View file

@ -2,6 +2,7 @@
"manifest_version": 3, "manifest_version": 3,
"name": "Poly+", "name": "Poly+",
"version": "1.11", "version": "1.11",
"version_name": "Pre-Release Build (stable: v1.1.1)",
"description": "Power-up your Polytoria experience with Poly+! Created by Index.", "description": "Power-up your Polytoria experience with Poly+! Created by Index.",
"permissions": ["storage", "contextMenus", "tabs", "scripting", "alarms", "notifications"], "permissions": ["storage", "contextMenus", "tabs", "scripting", "alarms", "notifications"],
"content_scripts": [ "content_scripts": [

217
settings.html
View file

@ -4,10 +4,10 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<!-- TITLE --> <!-- PUBLIC -->
<title>Poly+ | Settings</title> <title>Poly+ Settings</title>
<!-- CSS --> <!-- RESOURCES -->
<link rel="stylesheet" href="https://c0.ptacdn.com/static/app.64aa42f6.css"> <link rel="stylesheet" href="https://c0.ptacdn.com/static/app.64aa42f6.css">
</head> </head>
<body data-bs-theme="dark"> <body data-bs-theme="dark">
@ -48,7 +48,7 @@
margin-right: 15px; margin-right: 15px;
} }
p span:first-child { p span.title {
font-size: 1.4rem; font-size: 1.4rem;
} }
@ -91,37 +91,32 @@
dialog .modal-body p:first-child { dialog .modal-body p:first-child {
font-size: 0.9rem; font-size: 0.9rem;
} }
.setting-container .indicator {
border-radius: 5rem;
display: inline-block;
cursor: default;
}
/* .setting-container.enabled .indicator {
p span span.status { background-color: #007bff;
font-size: 0.16rem !important;
color: #cee;
}
*/
/*
button {
border: none;
padding: 5px;
color: #fff;
border-radius: 5px;
} }
button.btn-primary { .setting-container.disabled .indicator {
background: #007bff; background-color: orangered;
} }
button.btn-warning { .toggle-btn {
background: orange; float: right;
width: 100px;
} }
*/
</style> </style>
<dialog class="w-50" id="ResetDefaults-Modal"> <dialog class="w-50" id="ResetDefaults-Modal">
<div class="modal-header"> <div class="modal-header">
<p>Are you Sure?</p> <p>Are you sure?</p>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<p>Are you sure you'd like to reset all settings to their respective defaults? (this action is irreversible)</p> <p>Are you sure you'd like to reset all settings to their defaults? (this action is irreversible)</p>
<button id="ResetDefaults-Modal-Yes" class="btn btn-danger">Yes</button> <button id="ResetDefaults-Modal-Yes" class="btn btn-danger">Yes</button>
<button id="ResetDefaults-Modal-No" class="btn btn-primary">No</button> <button id="ResetDefaults-Modal-No" class="btn btn-primary">No</button>
</div> </div>
@ -131,22 +126,20 @@
<p>Theme Creator</p> <p>Theme Creator</p>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<p>Unleash your creativity and customize the Polytoria website to your liking! (this feature is still in development)</p> <p>Let out your creativity and turn it into a reality on Polytoria's website!</p>
<hr class="mt-2 mb-3"> <hr class="mt-3 mb-3">
<label>Save Theme to JSON</label> <label>Save Theme to JSON</label>
<div class="row"> <div class="input-group mb-3">
<div class="col"> <input id="SaveThemeToJSONInput" type="text" class="form-control bg-dark" placeholder="JSON String..." data-ignore="true" disabled>
<input id="SaveThemeToJSONInput" type="text" class="form-control bg-dark mb-2" placeholder="JSON..." data-ignore="true" disabled> <button id="CopyThemeJSONBtn" class="btn btn-warning">Copy</button>
</div>
<div class="col-auto">
<button id="CopyThemeJSONBtn" class="btn btn-warning"><!--<i class="fa-duotone fa-clipboard"></i>--> Copy</button>
</div>
</div> </div>
<label>Load Theme from JSON</label> <label>Load Theme from JSON</label>
<input type="text" class="form-control bg-dark mb-2" placeholder="JSON..." data-ignore="true"> <div class="input-group">
<button id="LoadThemeFromJSONBtn" class="btn btn-primary mb-2" data-ignore="true" data-onclick="LoadThemeJSON(this.previousElementSibling.value)">Load</button> <input type="text" class="form-control bg-dark" placeholder="JSON..." data-ignore="true">
<button id="LoadThemeFromJSONBtn" class="btn btn-success" data-ignore="true" data-onclick="LoadThemeJSON(this.previousElementSibling.value)">Load</button>
</div>
<hr class="mt-2 mb-3"> <hr class="mt-2 mb-3">
@ -214,22 +207,19 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label>Link (state: default) Text Color</label> <label>Link (state: default) Text Color</label>
<input class="form-control bg-dark mb-2" placeholder="..." data-setting="LinkTextColor">
</div> </div>
<div class="col"> <div class="col">
<label>Link (state: hovered) Text Color</label> <label>Link (state: hovered) Text Color</label>
<input class="form-control bg-dark mb-2" placeholder="..." data-setting="LinkHoveredTextColor">
</div> </div>
<div class="col"> <div class="col">
<label>Link (state: focused) Text Color</label> <label>Link (state: focused) Text Color</label>
<input class="form-control bg-dark mb-2" placeholder="..." data-setting="LinkFocusedTextColor">
</div> </div>
<!-- </div>
<div class="col">
<label>Link (state: visited) Text Color</label> <div class="input-group">
<input class="form-control bg-dark mb-2" placeholder="..." data-setting="LinkVisitedTextColor"> <input class="form-control bg-dark mb-2" placeholder="..." data-setting="LinkTextColor">
</div> <input class="form-control bg-dark mb-2" placeholder="..." data-setting="LinkHoveredTextColor">
--> <input class="form-control bg-dark mb-2" placeholder="..." data-setting="LinkFocusedTextColor">
</div> </div>
</div> </div>
</div> </div>
@ -323,18 +313,21 @@
</div> </div>
</dialog> </dialog>
<div id="page"> <div id="page">
<p class="setting-container" id="PinnedGames"> <h2>Poly+ Settings</h2>
<span> <p class="setting-container">
Pinned Games (<span class="status">enabled</span>) <span class="indicator">&nbsp;</span>
<button class="btn btn-warning btn-sm" data-setting="PinnedGamesOn">Toggle</button> <span class="title">
Pinned Games
<button class="btn btn-sm toggle-btn" data-setting="PinnedGamesOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Pin your favorite places to the top of the homepage! (limit: 5 places)</span> <span class="desc">Pin your favorite places to the top of the homepage! (limit: 5 places)</span>
</p> </p>
<p class="setting-container" id="ForumMentions"> <p class="setting-container" id="ForumMentions">
<span> <span class="indicator">&nbsp;</span>
Forum Mentions (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="ForumMentsOn">Toggle</button> Forum Mentions
<button class="btn btn-sm toggle-btn" data-setting="ForumMentsOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Get a quick link to the popular person everyone is talking about's profile!</span> <span class="desc">Get a quick link to the popular person everyone is talking about's profile!</span>
@ -342,17 +335,19 @@
<span style="font-size: 0.8rem; color: orange;">* Forum Mentions do not notify the user.</span> <span style="font-size: 0.8rem; color: orange;">* Forum Mentions do not notify the user.</span>
</p> </p>
<p class="setting-container" id="BestFriends"> <p class="setting-container" id="BestFriends">
<span> <span class="indicator">&nbsp;</span>
Best Friends (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="BestFriendsOn">Toggle</button> Best Friends
<button class="btn btn-sm toggle-btn" data-setting="BestFriendsOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Prioritize the bestest of friends on applicable friend lists! (limit: 7 best friends)</span> <span class="desc">Prioritize the bestest of friends on applicable friend lists! (limit: 7 best friends)</span>
</p> </p>
<p class="setting-container" id="ImprovedFriendLists"> <p class="setting-container" id="ImprovedFriendLists">
<span> <span class="indicator">&nbsp;</span>
Improved Friend Lists (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="ImprovedFrListsOn">Toggle</button> Improved Friend Lists
<button class="btn btn-sm toggle-btn" data-setting="ImprovedFrListsOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc"> <span class="desc">
@ -362,9 +357,10 @@
</span> </span>
</p> </p>
<p class="setting-container" id="IRLPriceWithCurrency"> <p class="setting-container" id="IRLPriceWithCurrency">
<span> <span class="indicator">&nbsp;</span>
Show IRL price with Brick Count (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="IRLPriceWithCurrencyOn">Toggle</button> Show IRL price with Brick Count
<button class="btn btn-sm toggle-btn" data-setting="IRLPriceWithCurrencyOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc mb-4"> <span class="desc mb-4">
@ -396,42 +392,47 @@
--> -->
</p> </p>
<p class="setting-container" id="HideNotifBadges"> <p class="setting-container" id="HideNotifBadges">
<span> <span class="indicator">&nbsp;</span>
Hide Notification Badges (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="HideNotifBadgesOn">Toggle</button> Hide Notification Badges
<button class="btn btn-sm toggle-btn" data-setting="HideNotifBadgesOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Hide the annoying red circles on the sidebar!</span> <span class="desc">Hide the annoying red circles on the sidebar!</span>
</p> </p>
<p class="setting-container" id="StoreOwnTag"> <p class="setting-container" id="StoreOwnTag">
<span> <span class="indicator">&nbsp;</span>
Show "OWNED" Tag on Store Main Page (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="StoreOwnTagOn">Toggle</button> Show "OWNED" Tag on Store Main Page
<button class="btn btn-sm toggle-btn" data-setting="StoreOwnTagOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Quickly see if you own the item at a glance with a little tag in the top left corner of item cards on the main store page!</span> <span class="desc">Quickly see if you own the item at a glance with a little tag in the top left corner of item cards on the main store page!</span>
</p> </p>
<p class="setting-container" id="ThemeCreator"> <p class="setting-container" id="ThemeCreator">
<span> <span class="indicator">&nbsp;</span>
Theme Creator (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="ThemeCreatorOn">Toggle</button> Theme Creator
<button class="btn btn-sm toggle-btn" data-setting="ThemeCreatorOn">Toggle</button>
<button id="ThemeCreator-Options" class="btn btn-primary btn-sm" data-modal="ThemeCreator">Options</button> <button id="ThemeCreator-Options" class="btn btn-primary btn-sm" data-modal="ThemeCreator">Options</button>
</span> </span>
<br> <br>
<span class="desc">Unleash your creativity and customize the Polytoria website to your liking! (this feature is still in development)</span> <span class="desc">Unleash your creativity and customize the Polytoria website to your liking! (this feature is still in development)</span>
</p> </p>
<p class="setting-container" id="MoreSearchFilters"> <p class="setting-container" id="MoreSearchFilters">
<span> <span class="indicator">&nbsp;</span>
More Search Filters (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="MoreSearchFiltersOn">Toggle</button> More Search Filters
<button class="btn btn-sm toggle-btn" data-setting="MoreSearchFiltersOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Easily find what you're looking for with more search filters side-wide! (this does not affect the main site search on the navbar)</span> <span class="desc">Easily find what you're looking for with more search filters side-wide! (this does not affect the main site search on the navbar)</span>
</p> </p>
<p class="setting-container" id="ApplyMembershipTheme"> <p class="setting-container" id="ApplyMembershipTheme">
<span> <span class="indicator">&nbsp;</span>
Apply Membership Theme for <b>Free</b> (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="ApplyMembershipThemeOn">Toggle</button> Apply Membership Theme for <b>Free</b>
<button class="btn btn-sm toggle-btn" data-setting="ApplyMembershipThemeOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Ever want the fancy membership themes for completely <b>free</b>? Well now you can get apply them site-wide!</span> <span class="desc">Ever want the fancy membership themes for completely <b>free</b>? Well now you can get apply them site-wide!</span>
@ -441,9 +442,10 @@
</select> </select>
</p> </p>
<p class="setting-container" id="MultiCancelOutTrades"> <p class="setting-container" id="MultiCancelOutTrades">
<span> <span class="indicator">&nbsp;</span>
Multi-Cancel Outbound Trades (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="MultiCancelOutTradesOns">Toggle</button> Multi-Cancel Outbound Trades
<button class="btn btn-sm toggle-btn" data-setting="MultiCancelOutTradesOns">Toggle</button>
</span> </span>
<br> <br>
<span class="desc"> <span class="desc">
@ -453,9 +455,10 @@
</span> </span>
</p> </p>
<p class="setting-container" id="ModifyNav"> <p class="setting-container" id="ModifyNav">
<span> <span class="indicator">&nbsp;</span>
Modify Navbar (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="ModifyNavOn">Toggle</button> Modify Navbar
<button class="btn btn-sm toggle-btn" data-setting="ModifyNavOn">Toggle</button>
<button id="ModifyNav-Options" class="btn btn-primary btn-sm" data-modal="ModifyNav">Options</button> <button id="ModifyNav-Options" class="btn btn-primary btn-sm" data-modal="ModifyNav">Options</button>
</span> </span>
<br> <br>
@ -464,9 +467,10 @@
</span> </span>
</p> </p>
<p class="setting-container" id="ItemWishlist"> <p class="setting-container" id="ItemWishlist">
<span> <span class="indicator">&nbsp;</span>
Item Wishlist (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="ItemWishlistOn">Toggle</button> Item Wishlist
<button class="btn btn-sm toggle-btn" data-setting="ItemWishlistOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc"> <span class="desc">
@ -474,17 +478,19 @@
</span> </span>
</p> </p>
<p class="setting-container" id="HideUpgradeBtn"> <p class="setting-container" id="HideUpgradeBtn">
<span> <span class="indicator">&nbsp;</span>
Hide Upgrade Button (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="HideUpgradeBtnOn">Toggle</button> Hide Upgrade Button
<button class="btn btn-sm toggle-btn" data-setting="HideUpgradeBtnOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Hide the ugly blue "Upgrade" button on the sidebar!</span> <span class="desc">Hide the ugly blue "Upgrade" button on the sidebar!</span>
</p> </p>
<p class="setting-container" id="OutfitCost"> <p class="setting-container" id="OutfitCost">
<span> <span class="indicator">&nbsp;</span>
Show Outfit Cost on Profiles (<span class="status">enabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="OutfitCostOn">Toggle</button> Show Outfit Cost on Profiles
<button class="btn btn-sm toggle-btn" data-setting="OutfitCostOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Quickly see how many bricks a user spent on their avatar!</span> <span class="desc">Quickly see how many bricks a user spent on their avatar!</span>
@ -496,9 +502,10 @@
<hr> <hr>
<!-- <!--
<p class="setting-container" id="GameProfiles"> <p class="setting-container" id="GameProfiles">
<span> <span class="indicator">&nbsp;</span>
Game Profiles (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="GameProfilesOn">Toggle</button> Game Profiles
<button class="btn btn-sm toggle-btn" data-setting="GameProfilesOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Traverse a place view page that matches a place's color palette!</span> <span class="desc">Traverse a place view page that matches a place's color palette!</span>
@ -509,9 +516,10 @@
</p> </p>
--> -->
<p class="setting-container" id="InlineEditing"> <p class="setting-container" id="InlineEditing">
<span> <span class="indicator">&nbsp;</span>
Inline Editing (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="InlineEditingOn">Toggle</button> Inline Editing
<button class="btn btn-sm toggle-btn" data-setting="InlineEditingOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">Quickly edit your asset's details such as name and description on the same page as viewing the asset!</span> <span class="desc">Quickly edit your asset's details such as name and description on the same page as viewing the asset!</span>
@ -521,9 +529,10 @@
<span style="font-size: 0.8rem; color: orange;">* This feature is not finished or polished.</span> <span style="font-size: 0.8rem; color: orange;">* This feature is not finished or polished.</span>
</p> </p>
<p class="setting-container" id="ForumUnixStamps"> <p class="setting-container" id="ForumUnixStamps">
<span> <span class="indicator">&nbsp;</span>
Forum Unix Timestamps (<span class="status">disabled</span>) <span class="title">
<button class="btn btn-warning btn-sm" data-setting="ForumUnixStampsOn">Toggle</button> Forum Unix Timestamps
<button class="btn btn-sm toggle-btn" data-setting="ForumUnixStampsOn">Toggle</button>
</span> </span>
<br> <br>
<span class="desc">See a date and time that is adjusted to everyone (who is using Poly+)'s local time</span> <span class="desc">See a date and time that is adjusted to everyone (who is using Poly+)'s local time</span>
@ -533,9 +542,11 @@
</div> </div>
</div> </div>
<hr> <hr>
<button id="Save" class="btn btn-primary" disabled="true">Save</button> <div class="btn-group w-100">
<button id="ResetDefaults" class="btn btn-warning">Reset to Default Settings</button> <button id="Save" class="btn btn-primary w-50" disabled="true">Save</button>
<p class="text-muted mt-2" style="font-size: 0.8rem;">made by Index</p> <button id="ResetDefaults" class="btn btn-warning w-50">Reset to Default Settings</button>
</div>
<p class="text-center text-muted mt-2" style="font-size: 0.8rem;">made by Index</p>
</div> </div>
<script src="settings.js"></script> <script src="settings.js"></script>
</body> </body>

205
settings.js
View file

@ -2,59 +2,8 @@ const SaveBtn = document.getElementById('Save')
const Elements = Array.from(document.getElementsByClassName('setting-container')) const Elements = Array.from(document.getElementsByClassName('setting-container'))
var Settings; var Settings;
/*
var ExpectedSettings = {
PinnedGamesOn: true,
ForumMentsOn: false,
BestFriendsOn: true,
ImprovedFrListsOn: true,
IRLPriceWithCurrencyOn: true,
IRLPriceWithCurrencyCurrency: 0,
IRLPriceWithCurrencyPackage: 0,
HideNotifBadgesOn: false,
StoreOwnTagOn: true,
ThemeCreatorOn: false,
ThemeCreator: {
BGColor: null,
BGImage: null,
BGImageSize: 'fit',
PrimaryTextColor: null,
SecondaryTextColor: null,
LinkTextColor: null,
WebsiteLogo: null
},
ModifyNavOn: false,
ModifyNav: [
{
Label: "Places",
Link: "https://polytoria.com/places"
},
{
Label: "Store",
Link: "https://polytoria.com/store"
},
{
Label: "Guilds",
Link: "https://polytoria.com/guilds"
},
{
Label: "People",
Link: "https://polytoria.com/users"
},
{
Label: "Forum",
Link: "https://polytoria.com/forum"
}
],
MoreSearchFiltersOn: true,
ApplyMembershipThemeOn: false,
ApplyMembershipThemeTheme: 0,
MultiCancelOutTradesOn: true,
ItemWishlistOn: true,
HideUpgradeBtnOn: false
}
*/
var ExpectedSettings; var ExpectedSettings;
var Utilities; var Utilities;
(async () => { (async () => {
Utilities = await import(chrome.runtime.getURL('/js/resources/utils.js')); Utilities = await import(chrome.runtime.getURL('/js/resources/utils.js'));
@ -65,40 +14,42 @@ var Utilities;
LoadCurrent() LoadCurrent()
})(); })();
const ResetDefaultsModal = document.getElementById('ResetDefaults-Modal') // Handle buttons at the bottom of the page
var ThemeCreatorModal = { document.getElementById('ResetDefaults').addEventListener('click', function() {
Modal: document.getElementById('ThemeCreator-Modal'), document.getElementById('ResetDefaults-Modal').showModal();
Save: document.getElementById('ThemeCreator-Modal-Save'), });
BGColor: document.getElementById('ThemeCreator-Modal-BGColor'),
BGImage: document.getElementById('ThemeCreator-Modal-BGImage'),
BGImageSize: document.getElementById('ThemeCreator-Modal-BGImageSize'),
PrimaryTextColor: document.getElementById('ThemeCreator-Modal-PrimaryTextColor'),
SecondaryTextColor: document.getElementById('ThemeCreator-Modal-SecondaryTextColor'),
LinkTextColor: document.getElementById('ThemeCreator-Modal-LinkTextColor'),
WebsiteLogo: document.getElementById('ThemeCreator-Modal-WebsiteLogo')
}
var ModifyNavModal = {
Modal: document.getElementById('ModifyNav-Modal'),
Save: document.getElementById('ModifyNav-Modal-Save'),
"1Label": document.getElementById('ModifyNav-Modal-1Label'),
"1Link": document.getElementById('ModifyNav-Modal-1Link'),
"2Label": document.getElementById('ModifyNav-Modal-2Label'),
"2Link": document.getElementById('ModifyNav-Modal-2Link'),
"3Label": document.getElementById('ModifyNav-Modal-3Label'),
"3Link": document.getElementById('ModifyNav-Modal-3Link'),
"4Label": document.getElementById('ModifyNav-Modal-4Label'),
"4Link": document.getElementById('ModifyNav-Modal-4Link'),
"5Label": document.getElementById('ModifyNav-Modal-5Label'),
"5Link": document.getElementById('ModifyNav-Modal-5Link'),
}
SaveBtn.addEventListener("click", function() { SaveBtn.addEventListener("click", function() {
Save(); Save();
}); });
// Handle modal buttons for Reset Defaults modal
document.getElementById('ResetDefaults-Modal-Yes').addEventListener('click', function() {
Settings = ExpectedSettings
Save()
setTimeout(function () {
LoadCurrent();
document.getElementById('ResetDefaults-Modal').close();
}, 400)
});
document.getElementById('ResetDefaults-Modal-No').addEventListener('click', function() {
document.getElementById('ResetDefaults-Modal').close();
});
// Handle leaving the settings page before saving
/*
window.onbeforeunload = function() {
if (SaveBtn.getAttribute('disabled') !== null) {
return "Are you sure you'd like to leave? Your Poly+ settings haven't been saved."
}
return "aaa"
}
*/
// Loop thru each setting container and handle toggling, selecting, opening modal, etc
Elements.forEach(element => { Elements.forEach(element => {
let Button = element.getElementsByTagName('button')[0] let Button = element.getElementsByTagName('button')[0]
let Options = element.getElementsByTagName('button')[1] let Options = element.getElementsByTagName('button')[1]
let Select = element.getElementsByTagName('select') || [] let Select = element.getElementsByTagName('select') || []
console.log(element, Select)
if (Button) { if (Button) {
Button.addEventListener('click', function() { Button.addEventListener('click', function() {
@ -208,32 +159,33 @@ Elements.forEach(element => {
}); });
} }
}); });
document.getElementById('ResetDefaults').addEventListener('click', function() {
ResetDefaultsModal.showModal();
});
document.getElementById('ResetDefaults-Modal-Yes').addEventListener('click', function() {
Settings = ExpectedSettings
Save()
setTimeout(function () {
LoadCurrent();
ResetDefaultsModal.close();
}, 400)
});
document.getElementById('ResetDefaults-Modal-No').addEventListener('click', function() {
ResetDefaultsModal.close();
});
function LoadCurrent() { function LoadCurrent() {
chrome.storage.sync.get(["PolyPlus_Settings"], function(result) { chrome.storage.sync.get(["PolyPlus_Settings"], function(result) {
Settings = MergeObjects(result.PolyPlus_Settings || ExpectedSettings, ExpectedSettings) Settings = MergeObjects(result.PolyPlus_Settings || ExpectedSettings, ExpectedSettings)
console.log(Settings) console.log("Current:", Settings)
Elements.forEach(element => { Elements.forEach(element => {
/*
let Status = element.getElementsByClassName('status')[0] let Status = element.getElementsByClassName('status')[0]
if (Status !== undefined) { if (Status !== undefined) {
Status.innerText = FormatBool(Settings[element.getElementsByTagName('button')[0].getAttribute('data-setting')]) Status.innerText = FormatBool(Settings[element.getElementsByTagName('button')[0].getAttribute('data-setting')])
} }
*/
console.log(Settings)
const ToggleBtn = element.getElementsByClassName('toggle-btn')[0]
if (Settings[ToggleBtn.getAttribute('data-setting')] === true) {
console.log(ToggleBtn.parentElement, 'enabled', Settings[ToggleBtn.getAttribute('data-setting')])
element.classList.add('enabled')
ToggleBtn.innerText = 'Disable'
ToggleBtn.classList.add('btn-danger')
} else {
console.log(ToggleBtn.parentElement, 'disabled', Settings[ToggleBtn.getAttribute('data-setting')])
element.classList.add('disabled')
ToggleBtn.innerText = 'Enable'
ToggleBtn.classList.add('btn-success')
}
let SelectInput = element.getElementsByTagName('select')[0] let SelectInput = element.getElementsByTagName('select')[0]
if (SelectInput) { if (SelectInput) {
SelectInput.selectedIndex = Settings[SelectInput.getAttribute('data-setting')] SelectInput.selectedIndex = Settings[SelectInput.getAttribute('data-setting')]
@ -243,17 +195,21 @@ function LoadCurrent() {
} }
function ToggleSetting(Name, Element) { function ToggleSetting(Name, Element) {
const ToggleBtn = Element.getElementsByClassName('toggle-btn')[0]
document.title = "*unsaved | Poly+ Settings"
if (Settings[Name] === true) { if (Settings[Name] === true) {
Settings[Name] = false; Settings[Name] = false;
ToggleBtn.innerText = 'Enable'
} else { } else {
Settings[Name] = true; Settings[Name] = true;
ToggleBtn.innerText = 'Disable'
} }
Element.classList.toggle('enabled')
Element.classList.toggle('disabled')
ToggleBtn.classList.toggle('btn-success')
ToggleBtn.classList.toggle('btn-danger')
if (Element != null) {
Element.getElementsByClassName('status')[0].innerText = FormatBool(Settings[Name])
}
if (SaveBtn.getAttribute('disabled')) { if (SaveBtn.getAttribute('disabled')) {
console.log('is disabled button - toggle')
SaveBtn.removeAttribute('disabled') SaveBtn.removeAttribute('disabled')
} }
} }
@ -263,18 +219,18 @@ function SetSetting(Name, Element, Value) {
Settings[Name] = Value Settings[Name] = Value
if (SaveBtn.getAttribute('disabled')) { if (SaveBtn.getAttribute('disabled')) {
console.log('is disabled button')
SaveBtn.removeAttribute('disabled') SaveBtn.removeAttribute('disabled')
} }
} }
function Save() { function Save() {
document.title = 'Poly+ Settings'
SaveBtn.setAttribute('disabled', 'true') SaveBtn.setAttribute('disabled', 'true')
chrome.storage.sync.set({ 'PolyPlus_Settings': Settings, arrayOrder: true }, function() { chrome.storage.sync.set({ 'PolyPlus_Settings': Settings, arrayOrder: true }, function() {
console.log('Saved successfully!'); console.log('Saved successfully!');
}); });
console.log(Settings); console.log("Save:", Settings);
} }
let LoadThemeFromJSONBtn = document.getElementById('LoadThemeFromJSONBtn') let LoadThemeFromJSONBtn = document.getElementById('LoadThemeFromJSONBtn')
@ -306,19 +262,17 @@ LoadFile(chrome.runtime.getURL('js/resources/currencies.json'), function(text){
}) })
function LoadThemeJSON(string) { function LoadThemeJSON(string) {
alert('This feature has been disabled for now.')
return
try { try {
let JSONTable = JSON.parse(string) let JSONTable = JSON.parse(string)
if (JSONTable.length === ExpectedSettings.ThemeCreator.length) { if (JSONTable.length === ExpectedSettings.ThemeCreator.length) {
if (confirm('Are you sure you\'d like to replace this theme with the theme specified in the JSON?') === true) { if (confirm('Are you sure you\'d like to replace this theme with the theme specified in the JSON?') === true) {
LoadThemeFromJSONBtn.previousElementSibling.value = '' LoadThemeFromJSONBtn.previousElementSibling.value = ''
document.getElementById('ThemeCreator-Modal').close() document.getElementById('ThemeCreator-Modal').close()
/*
for (let i = 0; i < JSONTable.length; i++) { for (let i = 0; i < JSONTable.length; i++) {
JSONTable[i] = new Sanitzer(JSONTable[i]) if (JSONTable[i][0] !== "#") {
JSONTable[i] = ""
}
} }
*/
Settings.ThemeCreator = MergeObjects(JSONTable, ExpectedSettings.ThemeCreator) Settings.ThemeCreator = MergeObjects(JSONTable, ExpectedSettings.ThemeCreator)
Save(); Save();
console.log(JSONTable.length, JSONTable, 'applied') console.log(JSONTable.length, JSONTable, 'applied')
@ -326,45 +280,13 @@ function LoadThemeJSON(string) {
} }
} else { } else {
alert('JSON is not a theme!') alert('JSON is not a theme!')
//LoadThemeFromJSONBtn.innerText = 'JSON is too short or too long!'
//setTimeout(function () {LoadThemeFromJSONBtn.innerText = 'Load'}, 1250)
} }
} catch (error) { } catch (error) {
alert('JSON is invalid!') alert('JSON is invalid!')
//LoadThemeFromJSONBtn.innerText = 'JSON is invalid!'
//setTimeout(function () {LoadThemeFromJSONBtn.innerText = 'Load'}, 1250)
} }
} }
/* // MergeObjects function was written by ChatGPT cause I was lazy and it was awhile ago
function MergeObjects(obj1, obj2) {
var mergedObj = {};
// Copy the values from obj1 to the mergedObj
for (var key in obj1) {
mergedObj[key] = obj1[key];
}
// Merge the values from obj2 into the mergedObj, favoring obj2 for non-existing keys in obj1
for (var key in obj2) {
if (!obj1.hasOwnProperty(key)) {
mergedObj[key] = obj2[key];
} else if (obj1[key] !== obj2[key]) {
mergedObj[key] = obj2[key];
}
}
// Remove keys from mergedObj if they are not present in obj2
for (var key in mergedObj) {
if (!obj2.hasOwnProperty(key)) {
delete mergedObj[key];
}
}
return mergedObj;
}
*/
function MergeObjects(obj1, obj2) { function MergeObjects(obj1, obj2) {
var mergedObj = {}; var mergedObj = {};
@ -384,11 +306,8 @@ function MergeObjects(obj1, obj2) {
} }
function FormatBool(bool){ function FormatBool(bool){
if (bool === true) { if (bool === true) { return 'enabled' }
return 'enabled' else { return 'disabled' }
} else {
return 'disabled'
}
} }
function LoadFile(path, callback) { function LoadFile(path, callback) {