v1.2.2

- Avatar Sandbox rewrite

- Updated owned item tags code

- Inventory Collectibles Category

- Great Divide Features ("Potentially Unbalanced" indicator in server list and User Statistics tab on profiles)

- Refreshed Settings Page design

- Fixed library item type detection

- Breadcrumbs on the view page for models, audios, decals, and meshes now link to the Library instead of the Store.

- If the document loads prior to the DOMContentLoaded event being registered in the sitewide.js file, then it'll still run everything as normal instead of just not running

- Updated README.md

I was bored so:
- You can now make a profile act like a birthday profile by appending ?birthday=true to the URL

README.md

@@ -4,43 +4,60 @@
 > [!IMPORTANT]
 > This extension is currently in BETA. If you find any bugs, please report them in this repository's issues section as it'd be a great help towards the development of the extension.
 
-> [!TIP]
-> Would you like to learn what's in store for Poly+? Check out the roadmap [here](https://github.com/users/indexxing/projects/2)!
-
 # Poly+
 
-Poly+ is an upcoming quality-of-life browser extension for the Polytoria website! The extension provides tons of improvements to improve your experience on Polytoria! Visit the website [here](https://polyplus.vercel.app/)!
+Poly+ is a quality-of-life browser extension for the Polytoria website! The extension provides tons of improvements to improve your experience on Polytoria! Visit the website [here](https://polyplus.vercel.app/)!
 
 ![image](https://img.shields.io/badge/Google_chrome-4285F4?style=for-the-badge&logo=Google-chrome&logoColor=white)
 ![image](https://img.shields.io/badge/Microsoft_Edge-0078D7?style=for-the-badge&logo=Microsoft-edge&logoColor=white)
 ![image](https://img.shields.io/badge/Opera-FF1B2D?style=for-the-badge&logo=Opera&logoColor=white)
 ![image](https://img.shields.io/badge/Brave-FF1B2D?style=for-the-badge&logo=Brave&logoColor=white)
 ![image](https://img.shields.io/badge/Vivaldi-EF3939?style=for-the-badge&logo=Vivaldi&logoColor=white)
+![image](https://img.shields.io/badge/Firefox-000?style=for-the-badge&logo=Firefox&logoColor=white)
 
 # Features
 
-- Pinned Games
+- 📍 Pinned Games
-- Forum Mentions
+- 📣 Forum Mentions
+- 🎨 Theme Creator
+- 🆕 Store "owned" Tags
+- 🧾 Item Wishlist
 - Best Friends
 - Improved Friend Lists
 - IRL Price with Brick Count
 - Hide Sidebar Notification Badges
-- Theme Creator
-- Store `owned` Tags
 - More Search Filters
 - Modify Navbar
 - Free Membership Themes
 - Multi-Cancel Outbound Trades
-- Item Wishlist
+- Quick Place Downloads
-- Outfit Cost
+- Try-On Items
+- Show Outfit Cost on Profiles
+- Show Approximate Place Revenue
+- Show "Owners" instead of "Sales"
+- Collectibles' Hoarders List
+- Quick Library Downloads
+- "Event Items" Store Category
+- Show Friend Count on Homepage
+- Timed-Item Owner Check
+- Hide User Ads
+- Multi-Decal Uploading
+- Avatar Dimension Toggle
 
 And there is more to come!
 
+### Experimental Settings
+
+> Experimental settings may not be finished and may have bugs!
+
+- Game Profiles
+- Inline Editing
+- Forum Unix Timestamps
+- Avatar Sandbox
+
 # Supported Browsers
 
-As of right now, Poly+ only works on Chromium-based browsers. Currently, there are no plans to bring it to other browsers.
+Poly+ is supported on Chromium-based browsers and Firefox!
-
-> TL;DR Chromium-based browsers
 
 ## Examples of Browsers that are Chromium-based
 
@@ -55,13 +72,13 @@ As of right now, Poly+ only works on Chromium-based browsers. Currently, there a
 
 ## How to Download - Stable Build?
 
-1. Go to the releases section of this GitHub repository
+1. Go to the extensions (or add-ons) webstore for your respective browser:
-2. Go to the latest release and download the .ZIP file for that release
+    - Chromium-based browsers: [Chrome Webstore](https://chromewebstore.google.com/detail/poly+/feafepokhecfmimpepbpccmcnjbcbklg)
-3. Extract the .ZIP
+    - Firefox: [Firefox Add-ons Store](https://addons.mozilla.org/en-US/firefox/addon/polytoriaplus/)
-4. Enable developer mode on your browser (developer mode allows you to load unpacked extensions)
+
-5. Click the "Load Unpacked" button
+2. Click on the Poly+ icon in your browser's tooltip (if it's pinned, if not you may have to go to a sub-menu in your browser's toolbar and find the extension there) to go to the settings page, and customize your experience. Remember to click save at the bottom of the page when you are done!
-6. When the file selector comes up, open the unzipped folder from this GitHub repository
+
-7. Go to Polytoria and you should see some changes!
+3. Go to Polytoria's website and enjoy the many features and QOL improvements that come with Poly+!
 
 ## How to Download - Pre-Release Build?
 
@@ -75,4 +92,4 @@ As of right now, Poly+ only works on Chromium-based browsers. Currently, there a
 6. Go to your browser extensions page (usually `browserName://extensions`)
 7. Click the "Load Unpacked" button
 8. When the file selector comes up, open the unzipped folder of this repository's source code
-9. Go to Polytoria and you should see some changes!
+9. Go to Polytoria and you should see some changes!

css/settings.css

@@ -1,8 +1,14 @@
 html,
 body,
 #page {
+    /*
     background: #202020;
     color: #fff;
+    */
+    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(/images/client-loading.png);
+    background-color: #222222;
+    background-size: 400px;
+    background-position: center;
 }
 
 #page {
@@ -42,7 +48,7 @@ h2 span.indent {
 
 .setting-container .title {
     font-size: 1.4rem;
-    font-weight: lighter;
+    font-weight: bold;
 }
 
 .setting-container .desc {
@@ -89,15 +95,13 @@ dialog .modal-body p:first-child {
     border-radius: 5rem;
     display: inline-block;
     cursor: default;
+    margin-right: 4px;
+    height: 20px;
+    vertical-align: text-top;
 }
 
-.setting-container.enabled .indicator {
+.setting-container.enabled .indicator { background-color: #007bff;}
-    background-color: #007bff;
+.setting-container.disabled .indicator { background-color: orangered; }
-}
-
-.setting-container.disabled .indicator {
-    background-color: orangered;
-}
 
 .toggle-btn {
     float: right;
@@ -107,7 +111,12 @@ dialog .modal-body p:first-child {
 .limited-time {
     background: transparent;
     border-color: transparent;
+    /*
+    changed the box shadow to black cause @dargy begged me to
     box-shadow: -3px -3px 15px 0 rgba(255, 116, 16, 0.25) inset, 3px 3px 15px 0 rgba(205, 96, 255, 0.25) inset;
+    */
+    box-shadow: -3px -3px 15px 0 black inset;
+    border: none;
 }
 
 .limited-time * {
@@ -145,8 +154,13 @@ dialog .modal-body p:first-child {
     background: 
         linear-gradient(
             45deg,
+            /*
+            changed the gradient to blue and green cause @ItsLuiggiYahoo begged me to
             rgba(255, 116, 16, 1),
             rgba(205, 96, 255, 1)
+            */
+            blue,
+            green
         );
     -webkit-mask: 
         linear-gradient(#fff 0 0) content-box, 
@@ -157,6 +171,17 @@ dialog .modal-body p:first-child {
     border-radius: inherit;
 }
 
+.warning {
+    font-size: 0.8rem;
+    color: orange;
+    font-weight: lighter;
+}
+
+.card {
+    --bs-card-border-color: #1e1e1e;
+    --bs-card-bg: #121212;
+}
+
 @-webkit-keyframes LimitedTimeTag {
     0%{color:rgba(255, 116, 16, 1);}
     50%{color:rgba(23, 107, 233, 1);}

js/account/avatar-sandbox-rewrite.js

@@ -0,0 +1,496 @@
+let Utilities;
+
+const Container = document.querySelector('.container.p-0.p-lg-5')
+const ItemCache = {
+    24122: {
+        type: "hat",
+        accessoryType: "hat",
+        name: "Polytoria Cap",
+        price: 0,
+        creator: {
+            name: "Polytoria",
+            id: 1
+        },
+        thumbnail: "https://c0.ptacdn.com/thumbnails/assets/RR0VPd5hX30Fx5APwRBGObotf1xD1DRT.png",
+        asset: "https://c0.ptacdn.com/assets/InBsL5bpJdp84ZPZGQMeHuyCBlo-uOv7.glb"
+    },
+    24118: {
+        type: "shirt",
+        name: "Green Polytoria Flannel",
+        price: 0,
+        creator: {
+            name: "Polytoria",
+            id: 1
+        },
+        thumbnail: "https://c0.ptacdn.com/thumbnails/assets/s7l57JugjbZfWTKAQ0cqTohOBraRbX5E.png",
+        asset: "https://c0.ptacdn.com/assets/uWrrnFGwgNN5W171vqYTWY7E639rKiXK.png"
+    },
+    24123: {
+        type: "pants",
+        name: "Jeans",
+        price: 0,
+        creator: {
+            name: "Polytoria",
+            id: 1
+        },
+        thumbnail: "https://c0.ptacdn.com/thumbnails/assets/anebTuFMLg8NKhRL3ab7hbzCfmcsFqGO.png",
+        asset: "https://c0.ptacdn.com/assets/HD6TFdXD8CaflRNmd84VCNyNsmTB0SH3.png"
+    }
+}
+let Avatar = {
+	useCharacter: true,
+	items: [24122],
+	shirt: 24118,
+	pants: 24123,
+	headColor: '#e0e0e0',
+	torsoColor: '#e0e0e0',
+	leftArmColor: '#e0e0e0',
+	rightArmColor: '#e0e0e0',
+	leftLegColor: '#e0e0e0',
+	rightLegColor: '#e0e0e0'
+};
+
+/* Discovery */
+let Page = 1
+let Search =  ""
+let TabSelected = "hat"
+
+!(async () => {
+    Utilities = await import(chrome.runtime.getURL('resources/utils.js'));
+    Utilities = Utilities.default;
+
+    chrome.storage.sync.get(['PolyPlus_Settings'], function(result){
+        Settings = result.PolyPlus_Settings || Utilities.DefaultSettings;
+
+        if (Settings.AvatarSandboxOn || 1 === 1) {
+            if (new URLSearchParams(window.location.search).has('sandbox')) {
+                document.title = 'Poly+ Avatar Sandbox'
+                PageLoad()
+            } else {
+                const SandboxButton = document.createElement('a');
+                SandboxButton.classList = 'btn btn-outline-success w-100 mt-3';
+                SandboxButton.href = '?sandbox=true';
+                SandboxButton.innerHTML = '<i class="fas fa-shirt"></i> Avatar Sandbox';
+                document.getElementById('cont-move').parentElement.appendChild(SandboxButton);
+            }
+        }
+    })
+})();
+
+async function PageLoad() {
+    const PageContents = (await ((await fetch(chrome.runtime.getURL('resources/avatar-sandbox.html'))).text()))
+    Container.innerHTML = PageContents
+    Utilities.InjectResource("registerTooltips")
+
+    IFrame = document.getElementById('viewFrame')
+
+    UpdateAvatar()
+    LoadItems()
+
+    const Tabs = document.getElementById('tabs')
+    Array.from(Tabs.children).forEach((element) => {
+        element.addEventListener('click', function () {
+            let Link = element.getElementsByTagName('a')[0];
+            if (!Link.classList.contains('active')) {
+                Link.classList.add('active');
+                Tabs.querySelector(`[data-tab="${TabSelected}"]`).classList.remove('active');
+                TabSelected = Link.getAttribute('data-tab');
+                Page = 1;
+                LoadItems();
+            }
+        });
+    });
+
+    const ClearButton = document.getElementById('clear');
+    ClearButton.addEventListener('click', function () {
+        Avatar = {
+            useCharacter: true,
+            items: [24122],
+            shirt: 24118,
+            pants: 24123,
+            headColor: '#e0e0e0',
+            torsoColor: '#e0e0e0',
+            leftArmColor: '#e0e0e0',
+            rightArmColor: '#e0e0e0',
+            leftLegColor: '#e0e0e0',
+            rightLegColor: '#e0e0e0'
+        };
+        UpdateAvatar();
+    });
+
+    const LoadMyselfButton = document.getElementById('myself');
+    LoadMyselfButton.addEventListener('click', function () {
+        LoadUser(JSON.parse(window.localStorage.getItem('p+account_info')).ID);
+    });
+
+    const JSONUploadButton = document.getElementById('jsonUpload');
+    JSONUploadButton.addEventListener('change', function () {
+        const Reader = new FileReader();
+        Reader.addEventListener('loadend', function () {
+            Avatar = JSON.parse(Reader.result);
+            UpdateAvatar();
+
+            JSONUploadButton.value = '';
+        });
+
+        Reader.readAsText(JSONUploadButton.files[0]);
+    });
+
+    const JSONSaveButton = document.getElementById('jsonSave');
+    JSONSaveButton.addEventListener('click', function () {
+        const Download = document.createElement('a');
+        Download.href = URL.createObjectURL(
+            new Blob([JSON.stringify(Avatar)], {
+                type: 'application/json'
+            })
+        );
+        Download.setAttribute('download', 'AvatarSandbox.json');
+        document.body.appendChild(Download);
+        Download.click();
+        document.body.removeChild(Download);
+    });
+
+    const OpenInNewTabButton = document.getElementById('openNewTab');
+    OpenInNewTabButton.addEventListener('click', function () {
+        window.open(IFrame, "_blank")
+    });
+
+    const LoadAsset = document.getElementById('load-asset')
+    const LoadAssetType = document.getElementById('load-asset-type')
+    LoadAsset.addEventListener('click', function(){
+        const SelectedType = LoadAssetType.options[LoadAssetType.selectedIndex].value
+        
+        if (SelectedType !== 'user') {
+            if (SelectedType === 'hat') {
+                Avatar.items.push(LoadAsset.previousElementSibling.value);
+            } else {
+                Avatar[SelectedType] = parseInt(LoadAsset.previousElementSibling.value)
+            }
+            UpdateAvatar();
+        } else {
+            LoadUser(LoadAsset.previousElementSibling.value)
+        }
+    })
+}
+
+async function UpdateAvatar() {
+    // Hats, Tools: https://api.polytoria.com/v1/assets/serve-mesh/ID
+	// or: https://api.polytoria.com/v1/assets/serve/ID/Asset
+
+    const FormattedAvatar = structuredClone(Avatar)
+
+    const AccessoryPromise = [...Avatar.items, Avatar.tool].filter((x) => x !== undefined && !x.toString().startsWith('http') && !x.toString().startsWith('data:')).map(async (x, index) => {
+        if (ItemCache[x] === undefined) {
+            const ItemDetails = (await (await fetch('https://api.polytoria.com/v1/store/' + x)).json())
+            ItemCache[x] = {
+                type: ItemDetails.type,
+                name: ItemDetails.name,
+                price: ItemDetails.price,
+                creator: {
+                    name: ItemDetails.creator.name,
+                    id: ItemDetails.creator.id
+                },
+                thumbnail: ItemDetails.thumbnail,
+                asset: undefined
+            }
+
+            if (ItemDetails.type === 'hat') {
+                ItemCache[x].accessoryType = ItemDetails.accessoryType
+            }
+        }
+        
+        if (ItemCache[x].asset === undefined) {
+            const MeshURL = (await (await fetch('https://api.polytoria.com/v1/assets/serve-mesh/' + x)).json())
+            if (MeshURL.success) {
+                ItemCache[x].asset = MeshURL.url
+                if (ItemCache[x].type === 'hat') {
+                    FormattedAvatar.items[index] = MeshURL.url
+                } else {
+                    FormattedAvatar[ItemCache[x].type] = MeshURL.url
+                }
+            }
+        } else {
+            if (ItemCache[x].type === 'hat') {
+                FormattedAvatar.items[index] = ItemCache[x].asset
+            } else {
+                FormattedAvatar[ItemCache[x].type] = ItemCache[x].asset
+            }
+        }
+    })
+
+    const TexturePromise = [Avatar.shirt, Avatar.pants, Avatar.face].filter((x) => x !== undefined && !x.toString().startsWith('http') && !x.toString().startsWith('data:') && x !== undefined).map(async (x, index) => {
+        if (ItemCache[x] === undefined) {
+            const ItemDetails = (await (await fetch('https://api.polytoria.com/v1/store/' + x)).json())
+            ItemCache[x] = {
+                /*
+                type: ItemDetails.type,
+                name: ItemDetails.name,
+                price: ItemDetails.price,
+                creator: {
+                    name: ItemDetails.creator.name,
+                    id: ItemDetails.creator.id
+                },
+                thumbnail: ItemDetails.thumbnail,
+                */
+                asset: undefined
+            }
+
+            if (ItemDetails.price === 0) {
+                if (ItemDetails.sales === 0) {
+                    ItemCache[x].price = null
+                } else {
+                    ItemCache[x].price = 0
+                }
+            }
+        }
+        
+        if (ItemCache[x].asset === undefined) {
+            const TextureURL = (await (await fetch('https://api.polytoria.com/v1/assets/serve/' + x + '/Asset')).json())
+            if (TextureURL.success) {
+                ItemCache[x].asset = TextureURL.url
+                if (x === Avatar.shirt) {
+                    FormattedAvatar.shirt = TextureURL.url
+                } else if (x === Avatar.pants) {
+                    FormattedAvatar.pants = TextureURL.url
+                } else if (x === Avatar.face) {
+                    FormattedAvatar.face = TextureURL.url
+                }
+            }
+        } else {
+            if (x === Avatar.shirt) {
+                FormattedAvatar.shirt = ItemCache[x].asset
+            } else if (x === Avatar.pants) {
+                FormattedAvatar.pants = ItemCache[x].asset
+            } else if (x === Avatar.face) {
+                FormattedAvatar.face = ItemCache[x].asset
+            }
+        }
+    })
+
+    if (Avatar.face === undefined) {
+        FormattedAvatar.face = "https://c0.ptacdn.com/static/3dview/DefaultFace.png"
+    }
+
+    await Promise.all(AccessoryPromise)
+    await Promise.all(TexturePromise)
+
+    console.log('Real Avatar: ', Avatar)
+	console.log('Formatted: ', FormattedAvatar)
+    IFrame.addEventListener('load', function(){
+        IFrame.src = 'https://polytoria.com/ptstatic/itemview/#' + btoa(encodeURIComponent(JSON.stringify(FormattedAvatar)))
+    })
+    IFrame.src = 'about:blank'
+
+    UpdateBodyColors()
+    LoadWearing()
+}
+
+function LoadUser(id) {
+	fetch('https://api.polytoria.com/v1/users/' + id + '/avatar')
+		.then((response) => {
+			if (!response.ok) {
+				throw new Error('Network not ok');
+			}
+			return response.json();
+		})
+		.then((data) => {
+			Avatar.items = [];
+
+			data.assets.forEach((item) => {
+                ItemCache[item.id] = {
+                    type: item.type,
+                    name: item.name,
+                    price: null,
+                    creator: null,
+                    thumbnail: item.thumbnail,
+                    asset: item.path
+                }
+
+                if (item.type === 'hat' || item.type === 'tool') {
+                    ItemCache[item.id].creator = {
+                        id: 1,
+                        name: "Polytoria"
+                    }
+                }
+
+                if (item.type === 'hat') {
+                    ItemCache[item.id].accessoryType = item.accessoryType
+                    Avatar.items.push(item.id)
+                } else {
+                    Avatar[item.type] = item.id
+                }
+			});
+
+			Avatar.headColor = '#' + data.colors.head || '#cdcdcd';
+			Avatar.torsoColor = '#' + data.colors.torso || '#cdcdcd';
+			Avatar.leftArmColor = '#' + data.colors.leftArm || '#cdcdcd';
+			Avatar.rightArmColor = '#' + data.colors.rightArm || '#cdcdcd';
+			Avatar.leftLegColor = '#' + data.colors.leftLeg || '#cdcdcd';
+			Avatar.rightLegColor = '#' + data.colors.rightLeg || '#cdcdcd';
+
+			UpdateAvatar();
+		})
+		.catch((error) => {
+			console.log(error);
+		});
+}
+
+async function LoadItems() {
+    document.getElementById('inventory').innerHTML = ''
+
+    const Items = (await (await fetch('https://api.polytoria.com/v1/store?limit=12&order=desc&sort=createdAt&showOffsale=true&types[]='+ TabSelected +'&search=' + Search + '&page=' + Page)).json()).assets
+    Items.forEach(item => {
+        const ItemColumn = document.createElement('div')
+        ItemColumn.classList = 'col-auto'
+        ItemColumn.innerHTML = `
+        <div style="max-width: 150px;">
+            <div class="card mb-2 avatar-item-container">
+                <div class="p-2">
+                    <img src="${item.thumbnail}" class="img-fluid">
+                    ${ (item.type === 'hat') ? `
+                    <span class="position-absolute" style="top: 5px; left: 5px; z-index: 1;">
+                        <span class="badge bg-secondary">${CleanAccessoryType(item.accessoryType)}</span>
+                    </span>
+                    ` : ''}
+                    <button class="avatarAction btn btn-success btn-sm position-absolute rounded-circle text-center" style="top: -10px; right: -16px; width: 32px; height: 32px; z-index: 1;"><i class="fas fa-plus"></i></button>
+                </div>
+            </div>
+            <a href="/store/${item.id}" class="text-reset">
+                <h6 class="text-truncate mb-0">${item.name}</h6>
+            </a>
+            <small class="text-muted d-block text-truncate">
+                by <a href="/users/${ (item.type !== 'hat' && item.type !== 'tool') ? '1' : item.creator.id }" class="text-reset">${ (item.type !== 'hat' && item.type !== 'tool') ? 'Polytoria' : item.creator.name }</a>
+            </small>
+        </div>
+        `
+        document.getElementById('inventory').appendChild(ItemColumn)
+
+        ItemCache[item.id] = {
+            type: item.type,
+            name: item.name,
+            price: item.price,
+            creator: {
+                name: item.creator.name,
+                id: item.creator.id
+            },
+            thumbnail: item.thumbnail,
+            asset: undefined
+        }
+
+        if (item.price === 0) {
+            if (item.sales === 0) {
+                console.log("ITEM IS AWARD-ONLY!!! ", item)
+                ItemCache[item.id].price = null
+            } else {
+                ItemCache[item.id].price = 0
+            }
+        }
+
+        if (item.type === 'hat') {
+            ItemCache[item.id].accessoryType = item.accessoryType
+        }
+
+        ItemColumn.getElementsByClassName('p-2')[0].addEventListener('click', function(){
+            WearAsset(item)
+        })
+    })
+}
+
+function LoadWearing() {
+    document.getElementById('wearing').innerHTML = '';
+    [...Avatar.items, Avatar.shirt, Avatar.pants].filter((x) => x !== undefined).forEach(id => {
+        const Cached = Object.values(ItemCache)[Object.keys(ItemCache).indexOf(id.toString())]
+        if (Cached !== undefined) {
+            if (Cached.creator === null) {
+                Cached.creator = {
+                    id: 1,
+                    name: "-"
+                }
+            }
+
+            if (Cached.price === null) { Cached.price = "???" }
+
+            const ItemColumn = document.createElement('div')
+            ItemColumn.classList = 'col-auto'
+            ItemColumn.innerHTML = `
+            <div style="max-width: 150px;">
+                <div class="card mb-2 avatar-item-container">
+                    <div class="p-2">
+                        <img src="${Cached.thumbnail}" class="img-fluid">
+                        ${ (Cached.type === 'hat') ? `
+                        <span class="position-absolute" style="top: 5px; left: 5px; z-index: 1;">
+                            <span class="badge bg-secondary">${CleanAccessoryType(Cached.accessoryType)}</span>
+                        </span>
+                        ` : ''}
+                        <button class="avatarAction btn btn-danger btn-sm position-absolute rounded-circle text-center" style="top: -10px; right: -16px; width: 32px; height: 32px; z-index: 1;"><i class="fas fa-minus"></i></button>
+                    </div>
+                </div>
+                <a href="/store/${id}" class="text-reset">
+                    <h6 class="text-truncate mb-0">${Cached.name}</h6>
+                </a>
+                <small class="text-muted d-block text-truncate">
+                    by <a href="/users/${Cached.creator.id || "1"}" class="text-reset">${Cached.creator.name || "-"}</a>
+                </small>
+                <small style="font-size: 0.8rem;" class="d-block text-truncate 
+                    ${ (Cached.price === 0) ? 'text-primary">Free' : (Cached.price !== "???") ? 'text-success"><i class="pi mr-1">$</i> ' + Cached.price : 'text-muted">???</small>' }
+                </small>
+            </div>
+            `
+            document.getElementById('wearing').appendChild(ItemColumn)
+
+            ItemColumn.getElementsByClassName('p-2')[0].addEventListener('click', function(){
+                WearAsset(Cached)
+            })
+        }
+    })
+}
+
+function WearAsset(details) {
+    if (Avatar[details.type] !== details.id && Avatar.items.indexOf(details.id) === -1) {
+        // Equip
+        if (details.type === 'hat') {
+            Avatar.items.push(details.id)
+        } else {
+            Avatar[details.type] = details.id
+        }
+    } else {
+        // Unequip
+        if (details.type === 'hat') {
+            Avatar.items.splice(Avatar.items.indexOf(details.id), 1);
+        } else {
+            Avatar[details.type] = undefined
+        }
+    }
+
+    UpdateAvatar()
+    LoadWearing()
+}
+
+function UpdateBodyColors() {
+    const BodyColors = {
+        head: Avatar.headColor,
+        torso: Avatar.torsoColor,
+        leftArm: Avatar.leftArmColor,
+        rightArm: Avatar.rightArmColor,
+        leftLeg: Avatar.leftLegColor,
+        rightLeg: Avatar.rightLegColor
+    }
+
+    Object.keys(BodyColors).forEach((elementID, i) => {
+        document.getElementById(elementID).style.backgroundColor = Object.values(BodyColors)[i]
+    })
+}
+
+function CleanAccessoryType(type) {
+    const CleanAccessoryTypes = {
+        hat: "Hat",
+        backAccessory: "Back Accessory",
+        faceAccessory: "Face Accessory",
+        headAttachment: "Head Attachment",
+        hair: "Hair",
+        neckAccessory: "Neck Accessory",
+        headCover: "Head Cover",
+        headAccessory: "Head Accessory"
+    }
+    return Object.values(CleanAccessoryTypes)[Object.keys(CleanAccessoryTypes).indexOf(type)] || "!!!"+type
+}

js/account/inventory.js

@@ -1,168 +1,208 @@
-console.log('path', window.location.pathname.split('/')[3]);
+Username = window.location.pathname.split('/')[2];
+let UserID;
+let ItemGrid;
 
 if (window.location.pathname.split('/')[3] === 'inventory') {
-	const Username = window.location.pathname.split('/')[2];
+	!(async () => {
-	console.log(JSON.parse(window.localStorage.getItem('p+account_info')).Username);
+		UserID = (await (await fetch('https://api.polytoria.com/v1/users/find?username=' + Username )).json()).id;
-	if (Username === JSON.parse(window.localStorage.getItem('p+account_info')).Username) {
+		ItemGrid = document.getElementsByClassName('itemgrid')[0];
-		console.log('is user');
-		let Nav = document.getElementsByClassName('nav-pills')[0];
-		let WishlistNav = document.createElement('li');
-		WishlistNav.classList.add('nav-item');
-		WishlistNav.innerHTML = `
-        <a href="wishlist/" class="nav-link">
-            <i class="fa-regular fa-sparkles me-1"></i>
-            <span class="pilltitle">Item Wishlist</span>
-        </a>
-        `;
-		Nav.appendChild(WishlistNav);
 
-		if (window.location.pathname.split('/')[4] === 'wishlist') {
+		chrome.storage.sync.get(['PolyPlus_Settings', 'PolyPlus_ItemWishlist'], function(result){
-			console.log('aaa');
+			Settings = result.PolyPlus_Settings
-			const ItemGrid = document.getElementsByClassName('itemgrid')[0];
-			const ItemCardContents = `
-            <a href="/store/:ItemID" class="text-reset">
-                <div class="card mb-2">
-                    :LimitedTag
-                    <div class="card-body">
-                        <img src=":ItemThumbnail" class="img-fluid rounded">
-                    </div>
-                </div>
-                <h6 class="text-truncate mb-0">
-                    :ItemName
-                </h6>
-            </a>
-            <small class="text-muted d-block mb-1">
-                by <a href="/users/:CreatorID" class="text-muted">:CreatorName</a>
-            </small>
-            <button class="polyplus-itemwish-removebtn btn btn-danger btn-sm" style="width: 100%;">X</button>
-            `;
 
-			Array.from(ItemGrid.children).forEach((element) => {
+			const Nav = document.getElementsByClassName('nav-pills')[0];
-				element.remove();
+
-			});
+			if (Settings.ItemWishlistOn
-			Array.from(Nav.children).forEach((element) => {
+				&& Username === JSON.parse(window.localStorage.getItem('p+account_info')).Username
-				element = element.children[0];
+				&& window.location.pathname.split('/')[4] === 'wishlist'
-				if (!(element === WishlistNav)) {
+			) {
-					if (element.classList.contains('active')) {
+				let WishlistNav = document.createElement('li');
-						element.classList.remove('active');
+				WishlistNav.classList.add('nav-item');
-					}
+				WishlistNav.innerHTML = `
+				<a href="wishlist/" class="nav-link">
+					<i class="fa-regular fa-list me-1"></i>
+					<span class="pilltitle">Item Wishlist</span>
+				</a>
+				`;
+				Nav.appendChild(WishlistNav);
+	
+				if (window.location.pathname.split('/')[4] === 'wishlist') {
+					Array.from(Nav.children).forEach((element) => {
+						element = element.children[0];
+						if (!(element === WishlistNav)) {
+							if (element.classList.contains('active')) {
+								element.classList.remove('active');
+							}
+						}
+					});
+					WishlistNav.children[0].classList.add('active');
+
+					ItemWishlist()
 				}
-			});
+			}
-			WishlistNav.children[0].classList.add('active');
-			const Search = document.createElement('div');
-			Search.classList = 'row';
-			Search.innerHTML = `
-            <div class="col-auto">
-                <select class="form-select" id="polyplus-itemwish-type" style="width: 150px;">
-                    <option value="any">Any</option>
-                    <option value="hat">Hat</option>
-                    <option value="face">Faces</option>
-                    <option value="tool">Tools</option>
-                    <option value="shirt">Shirt</option>
-                    <option value="pants">Pants</option>
-                </select>
-            </div>
-            <div class="col">
-                <input id="polyplus-itemwish-searchbar" type="text" class="form-control bg-dark" placeholder="Search...">
-            </div>
-            <div class="col-auto">
-                <div class="form-check">
-                <input class="form-check-input" type="checkbox" value="" id="polyplus-itemwish-isLimited">
-                <label class="form-check-label" for="polyplus-itemwish-isLimited">
-                    Is Limited?
-                    <span class="text-muted" style="font-size: 0.65rem; display: block;">Items that are limited</span>
-                </label>
-                </div>
-            </div>
-            <div class="col-auto">
-                <div class="form-check">
-                <input class="form-check-input" type="checkbox" value="" id="polyplus-itemwish-isAvailable">
-                <label class="form-check-label" for="polyplus-itemwish-isAvailable">
-                    Is Available?
-                    <span class="text-muted" style="font-size: 0.65rem; display: block; width: 170px;">Items that are equal to or less than the budget (excluding limiteds)</span>
-                </label>
-                </div>
-            </div>
-            `;
-			ItemGrid.parentElement.prepend(document.createElement('br'), ItemGrid.parentElement.children[0]);
-			ItemGrid.parentElement.prepend(Search, ItemGrid.parentElement.children[0]);
 
-			let Type = document.getElementById('polyplus-itemwish-type');
+			if (Settings.CollectibleInventoryCatOn) {
-			let SearchBar = document.getElementById('polyplus-itemwish-searchbar');
+				let CollectibleNav = document.createElement('li');
-			let IsLimited = document.getElementById('polyplus-itemwish-isLimited');
+				CollectibleNav.classList.add('nav-item');
-			let IsAvailable = document.getElementById('polyplus-itemwish-isAvailable');
+				CollectibleNav.innerHTML = `
-
+				<a href="collectibles/" class="nav-link">
-			Type.addEventListener('change', function () {
+					<i class="fa-regular fa-sparkles me-1"></i>
-				Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
+					<span class="pilltitle">Collectibles</span>
-			});
+				</a>
-
+				`;
-			SearchBar.addEventListener('change', function () {
+				Nav.appendChild(CollectibleNav);
-				Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
+				
-			});
+				if (window.location.pathname.split('/')[4] === 'collectibles') {
-
+					Array.from(Nav.children).forEach((element) => {
-			IsLimited.addEventListener('change', function () {
+						element = element.children[0];
-				Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
+						if (!(element === CollectibleNav)) {
-			});
+							if (element.classList.contains('active')) {
-
+								element.classList.remove('active');
-			IsAvailable.addEventListener('change', function () {
-				Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
-			});
-
-			chrome.storage.sync.get(['PolyPlus_ItemWishlist'], function (result) {
-				let Wishlist = result.PolyPlus_ItemWishlist || [];
-				console.log('wishlist: ', Wishlist);
-				Wishlist.forEach((element) => {
-					let NewItemCard = document.createElement('div');
-					NewItemCard.classList = 'px-0';
-					fetch('https://api.polytoria.com/v1/store/:id'.replace(':id', element))
-						.then((response) => response.json())
-						.then((data) => {
-							NewItemCard.innerHTML = ItemCardContents.replace(':ItemID', data.id)
-								.replace(':ItemThumbnail', data.thumbnail)
-								.replace(':ItemName', data.name)
-								.replace(':CreatorID', data.creator.id)
-								.replace(':CreatorName', data.creator.name);
-							if (data.isLimited === true) {
-								NewItemCard.innerHTML = NewItemCard.innerHTML.replace(':LimitedTag', '<div class="ribbon ribbon-limited ribbon-top-right"><span>Limited</span></div>');
-							} else {
-								NewItemCard.innerHTML = NewItemCard.innerHTML.replace(':LimitedTag', '');
-							}
-							NewItemCard.setAttribute('data-id', data.id);
-							NewItemCard.setAttribute('data-name', data.name);
-							NewItemCard.setAttribute('data-type', data.type);
-							NewItemCard.setAttribute('data-creator', data.creator.name);
-							NewItemCard.setAttribute('data-limited', data.isLimited);
-							if (data.isLimited === false) {
-								NewItemCard.setAttribute('data-price', data.price);
 							}
+						}
+					});
+					CollectibleNav.children[0].classList.add('active');
 
-							ItemGrid.appendChild(NewItemCard);
+					CollectibleCategory()
-
+				}
-							NewItemCard.getElementsByClassName('polyplus-itemwish-removebtn')[0].addEventListener('click', function () {
+			}
-								let Index = Wishlist.indexOf(parseInt(NewItemCard.getAttribute('data-id')));
+		});
-								if (Index === -1) {
+	})();
-									NewItemCard.remove();
-									return;
-								} else {
-									Wishlist.splice(Index, 1);
-									console.log(Wishlist);
-									NewItemCard.remove();
-								}
-								chrome.storage.sync.set({PolyPlus_ItemWishlist: Wishlist, arrayOrder: true}, function () {
-									console.log('ItemWishlist successfully saved: ' + ItemWishlist);
-								});
-							});
-						})
-						.catch((error) => {
-							console.error('Error:', error);
-						});
-				});
-			});
-		}
-	}
 }
 
-function Update(type, query, isLimited, isAvailable) {
+function ItemWishlist() {
+	const ItemGrid = document.getElementsByClassName('itemgrid')[0];
+	const ItemCardContents = `
+	<a href="/store/:ItemID" class="text-reset">
+		<div class="card mb-2">
+			:LimitedTag
+			<div class="card-body">
+				<img src=":ItemThumbnail" class="img-fluid rounded">
+			</div>
+		</div>
+		<h6 class="text-truncate mb-0">
+			:ItemName
+		</h6>
+	</a>
+	<small class="text-muted d-block mb-1">
+		by <a href="/users/:CreatorID" class="text-muted">:CreatorName</a>
+	</small>
+	<button class="polyplus-itemwish-removebtn btn btn-danger btn-sm" style="width: 100%;">X</button>
+	`;
+
+	ItemGrid.innerHTML = ''
+	const Search = document.createElement('div');
+	Search.classList = 'row';
+	Search.innerHTML = `
+	<div class="col-auto">
+		<select class="form-select" id="polyplus-itemwish-type" style="width: 150px;">
+			<option value="any">Any</option>
+			<option value="hat">Hat</option>
+			<option value="face">Faces</option>
+			<option value="tool">Tools</option>
+			<option value="shirt">Shirt</option>
+			<option value="pants">Pants</option>
+		</select>
+	</div>
+	<div class="col">
+		<input id="polyplus-itemwish-searchbar" type="text" class="form-control bg-dark" placeholder="Search...">
+	</div>
+	<div class="col-auto">
+		<div class="form-check">
+		<input class="form-check-input" type="checkbox" value="" id="polyplus-itemwish-isLimited">
+		<label class="form-check-label" for="polyplus-itemwish-isLimited">
+			Is Limited?
+			<span class="text-muted" style="font-size: 0.65rem; display: block;">Items that are limited</span>
+		</label>
+		</div>
+	</div>
+	<div class="col-auto">
+		<div class="form-check">
+		<input class="form-check-input" type="checkbox" value="" id="polyplus-itemwish-isAvailable">
+		<label class="form-check-label" for="polyplus-itemwish-isAvailable">
+			Is Available?
+			<span class="text-muted" style="font-size: 0.65rem; display: block; width: 170px;">Items that are equal to or less than the budget (excluding limiteds)</span>
+		</label>
+		</div>
+	</div>
+	`;
+	ItemGrid.parentElement.prepend(document.createElement('br'), ItemGrid.parentElement.children[0]);
+	ItemGrid.parentElement.prepend(Search, ItemGrid.parentElement.children[0]);
+
+	let Type = document.getElementById('polyplus-itemwish-type');
+	let SearchBar = document.getElementById('polyplus-itemwish-searchbar');
+	let IsLimited = document.getElementById('polyplus-itemwish-isLimited');
+	let IsAvailable = document.getElementById('polyplus-itemwish-isAvailable');
+
+	Type.addEventListener('change', function () {
+		Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
+	});
+
+	SearchBar.addEventListener('change', function () {
+		Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
+	});
+
+	IsLimited.addEventListener('change', function () {
+		Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
+	});
+
+	IsAvailable.addEventListener('change', function () {
+		Update(Type.options[Type.selectedIndex].value, SearchBar.value, IsLimited.checked, IsAvailable.checked);
+	});
+
+	chrome.storage.sync.get(['PolyPlus_ItemWishlist'], function (result) {
+		let Wishlist = result.PolyPlus_ItemWishlist || [];
+		console.log('wishlist: ', Wishlist);
+		Wishlist.forEach((element) => {
+			let NewItemCard = document.createElement('div');
+			NewItemCard.classList = 'px-0';
+			fetch('https://api.polytoria.com/v1/store/:id'.replace(':id', element))
+				.then((response) => response.json())
+				.then((data) => {
+					NewItemCard.innerHTML = ItemCardContents.replace(':ItemID', data.id)
+						.replace(':ItemThumbnail', data.thumbnail)
+						.replace(':ItemName', data.name)
+						.replace(':CreatorID', data.creator.id)
+						.replace(':CreatorName', data.creator.name);
+					if (data.isLimited === true) {
+						NewItemCard.innerHTML = NewItemCard.innerHTML.replace(':LimitedTag', '<div class="ribbon ribbon-limited ribbon-top-right"><span>Limited</span></div>');
+					} else {
+						NewItemCard.innerHTML = NewItemCard.innerHTML.replace(':LimitedTag', '');
+					}
+					NewItemCard.setAttribute('data-id', data.id);
+					NewItemCard.setAttribute('data-name', data.name);
+					NewItemCard.setAttribute('data-type', data.type);
+					NewItemCard.setAttribute('data-creator', data.creator.name);
+					NewItemCard.setAttribute('data-limited', data.isLimited);
+					if (data.isLimited === false) {
+						NewItemCard.setAttribute('data-price', data.price);
+					}
+
+					ItemGrid.appendChild(NewItemCard);
+
+					NewItemCard.getElementsByClassName('polyplus-itemwish-removebtn')[0].addEventListener('click', function () {
+						let Index = Wishlist.indexOf(parseInt(NewItemCard.getAttribute('data-id')));
+						if (Index === -1) {
+							NewItemCard.remove();
+							return;
+						} else {
+							Wishlist.splice(Index, 1);
+							console.log(Wishlist);
+							NewItemCard.remove();
+						}
+						chrome.storage.sync.set({PolyPlus_ItemWishlist: Wishlist, arrayOrder: true}, function () {
+							console.log('ItemWishlist successfully saved: ' + ItemWishlist);
+						});
+					});
+				})
+				.catch((error) => {
+					console.error('Error:', error);
+				});
+		});
+	});
+}
+
+const Update = function(type, query, isLimited, isAvailable) {
 	let ItemGrid = document.getElementsByClassName('itemgrid')[0];
 	let BrickBalance = parseInt(JSON.parse(window.localStorage.getItem('p+account_info')).Bricks);
 	query = query.toLowerCase();
@@ -201,3 +241,52 @@ function Update(type, query, isLimited, isAvailable) {
 		}
 	}
 }
+
+async function CollectibleCategory() {
+	ItemGrid.innerHTML = ''
+	const CollectibleItemTypes = [
+		"hat",
+		"face",
+		"tool"
+	]
+	const Collectibles = []
+
+	for (let type of CollectibleItemTypes) {
+		const InitialInventory = (await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=' + type + '&limit=100')).json())
+		Collectibles.push(...InitialInventory.inventory.filter((x) => x.asset.isLimited === true))
+
+		if (InitialInventory.pages > 1) {
+			if (InitialInventory.pages > 3) {
+				InitialInventory.pages = 3
+			}
+
+			for (let page = 2; i < InitialInventory.pages; i++) {
+				const PageResult = (await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=' + type + '&limit=100&page=' + page)).json())
+				Collectibles.push(...PageResult.inventory.filter((x) => x.asset.isLimited === true))
+			}
+		}
+	}
+
+	Collectibles.forEach(item => {
+		item = item.asset
+		const ItemColumn = document.createElement('div')
+		ItemColumn.classList = 'px-0'
+		ItemColumn.innerHTML = `
+		<a href="/store/${item.id}" class="text-reset">
+			<div class="card mb-2">
+				<div class="ribbon ribbon-limited ribbon-top-right"><span>Limited</span></div>
+				<div class="card-body">
+					<img src="${item.thumbnail}" class="img-fluid rounded">
+				</div>
+			</div>
+			<h6 class="text-truncate mb-0">
+				${item.name}
+			</h6>
+		</a>
+		<small class="text-muted d-block mb-1">
+			by <a href="/u/Polytoria" class="text-muted">Polytoria</a>
+		</small>
+		`
+		ItemGrid.appendChild(ItemColumn)
+	})
+}

js/account/profile.js

@@ -12,7 +12,7 @@ let Utilities;
 
 if (Username) {
 	(async () => {
-		UserID = (await (await fetch('https://api.polytoria.com/v1/users/find?username=' + Username )).json()).id;
+		UserID = (await (await fetch('https://api.polytoria.com/v1/users/find?username=' + Username )).json());
 		Utilities = await import(chrome.runtime.getURL('resources/utils.js'));
 		Utilities = Utilities.default;
 
@@ -25,7 +25,7 @@ if (Username) {
 			UserIDRow.innerHTML = `
 			<b><i class="fa fa-hashtag text-center d-inline-block" style="width:1.2em"></i> Player ID</b>
 			<span class="float-end">
-				${UserID} <a id="copy" href="#copy"><i class="fad fa-copy" style="margin-left: 5px;"></i></a>
+				${UserID.id} <a id="copy" href="#copy"><i class="fad fa-copy" style="margin-left: 5px;"></i></a>
 			</span>
 			`
 			InfoColumns.children[0].insertBefore(UserIDRow, InfoColumns.children[0].children[1]);
@@ -33,7 +33,7 @@ if (Username) {
 			const CopyButton = UserIDRow.getElementsByTagName('a')[0]
 			CopyButton.addEventListener('click', function(){
 				navigator.clipboard
-					.writeText(UserID)
+					.writeText(UserID.id)
 					.then(() => {
 						CopyButton.classList.add('text-success')
 						CopyButton.children[0].classList = 'fa-duotone fa-circle-check'
@@ -79,12 +79,6 @@ if (Username) {
 				});
 			}
 
-			/*
-			<button class="btn btn-outline-primary 3dviewtoggler isactive" style="position:absolute;bottom:15px;right:10px;width:60px"><i class="toggleIcn fad fa-image"></i></button>
-
-			<button class="btn btn-outline-primary 3dviewtoggler" style="position:absolute;bottom:15px;right:10px;width:60px"><i class="toggleIcn fad fa-360-degrees"></i></button>
-			*/
-
 			AvatarIFrame = document.getElementById('user-avatar-card').getElementsByTagName('iframe')[0]
 			if (Settings.AvatarDimensionToggleOn === true || 1 === 1) {
 				const AvatarCard = document.getElementById('user-avatar-card')
@@ -97,20 +91,32 @@ if (Username) {
 				ToggleButton.addEventListener('click', async function(){
 					if (ToggleButton.children[0].classList.contains('fa-image')) {
 						if (document.getElementById('polyplus-2davatar')) {
+							const AvatarImage = document.getElementById('polyplus-2davatar')
+
+							AvatarImage.width = AvatarIFrame.offsetWidth
+							AvatarImage.height = AvatarIFrame.offsetHeight
+							AvatarImage.style.display = 'block'
 							AvatarIFrame.style.display = 'none'
-							document.getElementById('polyplus-2davatar').style.display = 'block'
+
 							ToggleButton.children[0].classList = 'toggleIcn fad fa-360-degrees'
 						} else {
 							const AvatarImage = document.createElement('img')
 							AvatarImage.id = 'polyplus-2davatar'
 							AvatarImage.width = AvatarIFrame.offsetWidth
 							AvatarImage.height = AvatarIFrame.offsetHeight
+							AvatarImage.style.padding = '20px'
 
-							const UserDetails = (await (await fetch('https://api.polytoria.com/v1/users/' + UserID)).json())
+							const UserDetails = (await (await fetch('https://api.polytoria.com/v1/users/' + UserID.id)).json())
 							AvatarImage.src = UserDetails.thumbnail.avatar
 
 							AvatarIFrame.style.display = 'none'
-							AvatarCard.children[0].insertBefore(AvatarImage, AvatarCard.getElementsByClassName('user-badges')[0])
+
+							const CustomBadge = document.querySelector('#user-avatar-card .badge:has(.pi)')
+							if (CustomBadge === null) {
+								AvatarCard.children[0].insertBefore(AvatarImage, AvatarCard.getElementsByClassName('user-badges')[0])
+							} else {
+								AvatarCard.children[0].insertBefore(AvatarImage, CustomBadge.parentElement)
+							}
 
 							ToggleButton.children[0].classList = 'toggleIcn fad fa-360-degrees'
 						}
@@ -122,6 +128,24 @@ if (Username) {
 				})
 			}
 		});
+
+		if (new URLSearchParams(window.location.search).get('birthday') === 'true') {
+			const JoinDateRow = document.querySelector('#user-stats-card .mb-1:has(.fa-calendar)')
+			const BirthdayCard = document.createElement('div')
+			BirthdayCard.classList = 'card card-themed card-player-birthday mb-2'
+			BirthdayCard.innerHTML = `
+			<div class="card-body">
+				<div class="fw-semibold text-birthday-gradient">
+					<i class="fas fa-cake me-1"></i> It's my ${new Date().getFullYear() - new Date(JoinDateRow.children[1].innerText).getFullYear()}rd Polytoria anniversary!
+				</div>
+				<a href="/inbox/messages/${UserID.id}/compose?anniversary=1" class="btn btn-sm btn-outline-light mt-2"><i class="fas fa-hands-clapping me-1"></i> Send ${UserID.username} congrats</a>
+			</div>
+			`
+			document.getElementById('user-avatar-card').parentElement.insertBefore(BirthdayCard, document.getElementById('user-avatar-card'))
+			JoinDateRow.children[1].innerHTML = '<i class="fas fa-cake"></i> ' + JoinDateRow.children[1].innerHTML
+			JoinDateRow.children[1].classList.add('text-birthday-gradient')
+			JoinDateRow.children[1].classList.add('fw-semibold')
+		}
 	})();
 
 	if (AvatarIFrame === null) {
@@ -168,7 +192,7 @@ if (Username) {
 				alert('Failure to copy sharable 3D avatar URL.');
 			});
 	});
-} else if (UserID && UserID[0] === '@') {
+} else if (Username && Username[0] === '@') {
 	const Username = window.location.pathname.split('/')[2].substring(1);
 
 	let Reference = new URLSearchParams(new URL(window.location.href).search);
@@ -205,7 +229,7 @@ function BestFriends() {
 		FavoriteBtn = document.createElement('button');
 		FavoriteBtn.classList = 'btn btn-warning btn-sm ml-2';
 		if (!(BestFriends.length === Utilities.Limits.BestFriends)) {
-			if (Array.isArray(BestFriends) && BestFriends.includes(parseInt(UserID))) {
+			if (Array.isArray(BestFriends) && BestFriends.includes(parseInt(UserID.id))) {
 				FavoriteBtn.innerText = 'Remove Best Friend Status';
 			} else {
 				FavoriteBtn.innerText = 'Best Friend';
@@ -213,9 +237,9 @@ function BestFriends() {
 		} else {
 			FavoriteBtn.innerText = 'Remove Best Friend Status (max ' + Utilities.Limits.BestFriends + '/' + Utilities.Limits.BestFriends + ')';
 		}
-		if (UserID !== JSON.parse(window.localStorage.getItem('p+account_info')).ID && document.getElementById('add-friend-button').classList.contains('btn-success') === false) {
+		if (UserID.id !== JSON.parse(window.localStorage.getItem('p+account_info')).ID && document.getElementById('add-friend-button').classList.contains('btn-success') === false) {
 			FavoriteBtn.addEventListener('click', function () {
-				Fav(UserID, FavoriteBtn);
+				Fav(UserID.id, FavoriteBtn);
 			});
 		} else {
 			FavoriteBtn.style.display = 'none';
@@ -223,25 +247,25 @@ function BestFriends() {
 		document.querySelectorAll('.section-title.px-3.px-lg-0.mt-3')[0].appendChild(FavoriteBtn);
 
 		function Fav(UserID, btn) {
-			if (UserID === JSON.parse(window.localStorage.getItem('p+account_info')).ID) {
+			if (UserID.id === JSON.parse(window.localStorage.getItem('p+account_info')).ID) {
 				return;
 			}
 			btn.setAttribute('disabled', 'true');
 
 			chrome.storage.sync.get(['PolyPlus_BestFriends'], function (result) {
 				const BestFriends = result.PolyPlus_BestFriends || [];
-				const index = BestFriends.indexOf(parseInt(UserID));
+				const index = BestFriends.indexOf(parseInt(UserID.id));
 
 				if (index !== -1) {
 					// Number exists, remove it
 					BestFriends.splice(index, 1);
 					btn.innerText = 'Best Friend';
-					console.log('Number', parseInt(UserID), 'removed from BestFriends');
+					console.log('Number', parseInt(UserID.id), 'removed from BestFriends');
 				} else {
 					// Number doesn't exist, add it
-					BestFriends.push(parseInt(UserID));
+					BestFriends.push(parseInt(UserID.id));
 					btn.innerText = 'Remove Best Friend Status';
-					console.log('Number', parseInt(UserID), 'added to BestFriends');
+					console.log('Number', parseInt(UserID.id), 'added to BestFriends');
 				}
 
 				chrome.storage.sync.set({PolyPlus_BestFriends: BestFriends, arrayOrder: true}, function () {
@@ -260,7 +284,7 @@ function BestFriends() {
 				BestFriends = result.PolyPlus_BestFriends || [];
 
 				if (!(BestFriends.length === Utilities.Limits.BestFriends)) {
-					if (Array.isArray(BestFriends) && BestFriends.includes(parseInt(UserID))) {
+					if (Array.isArray(BestFriends) && BestFriends.includes(parseInt(UserID.id))) {
 						FavoriteBtn.innerText = 'Remove Best Friend Status';
 					} else {
 						FavoriteBtn.innerText = 'Best Friend';

js/background.js

@@ -80,7 +80,15 @@ const DefaultSettings = {
 	},
 	UploadMultipleDecals: true,
 	GD_ServerBalanceOn: true,
-	AvatarDimensionToggleOn: true
+	AvatarDimensionToggleOn: true,
+	TheGreatDivide: {
+		Enabled: true,
+		UnbalancedIndicatorOn: true,
+		MVPUserIndicatorOn: true,
+		UserStatsOn: true,
+		LeaderboardsOn: true
+	},
+	CollectibleInventoryCatOn: true
 }
 
 // ON EXTENSION INSTALL / RELOAD
@@ -93,20 +101,93 @@ chrome.runtime.onInstalled.addListener(() => {
 	})
 });
 
-chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
+chrome.runtime.onMessage.addListener(async function (request, sender, sendResponse) {
 	if (request.action === 'reload') {
 		chrome.runtime.reload();
-	} else if (request.action === 'sweetalert2') {
+	} else if (request.action === 'greatdivide_stats') {
+		const Statistics = (await (await fetch('https://stats.silly.mom/player_stats?username=' + request.username)).json()).results
+
 		chrome.tabs.query({ active: true, currentWindow: true }, function(tabs){
-			console.log([request.icon, request.title, request.text])
 			chrome.scripting
 				.executeScript({
 					target: {tabId: tabs[0].id},
-					func: OpenSweetAlert2Modal,
+					func: LoadStats,
-					// would have just let it pass thru the object for sweetalert2 - but probably not a good idea lol
+					args: [Statistics]
-					args: [request.icon, request.title, request.text]
 				})
 		})
+
+		const LoadStats = function(stats){			
+			if (stats !== null) {
+				stats = stats[0]
+				document.getElementById('p+greatdivide_stats').innerHTML = `
+				<div class="mb-1">
+					<b>
+						<i class="fa-duotone fa-swords text-center d-inline-block" style="width:1.2em"></i>
+						Kills
+					</b>
+					<span class="float-end">
+						${stats.Kills.toLocaleString()} (${stats.UniqueKills.toLocaleString()} unique)
+					</span>
+				</div>
+				<div class="mb-1">
+					<b>
+						<i class="fa-duotone fa-skull text-center d-inline-block" style="width:1.2em"></i>
+						Deaths
+					</b>
+					<span class="float-end">
+						${stats.Deaths.toLocaleString()}
+					</span>
+				</div>
+				<div class="mb-1">
+					<b>
+						<i class="fa-solid fa-percent text-center d-inline-block" style="width:1.2em"></i>
+						Kill Death Ratio
+					</b>
+					<span class="float-end">
+						${(stats.Kills / stats.Deaths).toFixed(4)}
+					</span>
+				</div>
+				<div class="mb-1">
+					<b>
+						<i class="fa-duotone fa-hundred-points text-center d-inline-block" style="width:1.2em"></i>
+						Points Scored
+					</b>
+					<span class="float-end">
+						${stats.PointsScored.toLocaleString()}
+					</span>
+				</div>
+				<div class="mb-1">
+					<b>
+						<i class="fa-solid fa-money-bill-wave text-center d-inline-block" style="width:1.2em"></i>
+						Cash Earned
+					</b>
+					<span class="float-end">
+						${stats.CashEarned.toLocaleString()}
+					</span>
+				</div>
+				<div class="mb-1">
+					<b>
+						<i class="fa-duotone fa-flag text-center d-inline-block" style="width:1.2em"></i>
+						Flags Captured
+					</b>
+					<span class="float-end">
+						${stats.FlagsCaptured} (${stats.FlagsReturned} returned)
+					</span>
+				</div>
+				<div class="mb-3">
+					<b>
+						<i class="fa-solid fa-box-open text-center d-inline-block" style="width:1.2em"></i>
+						Airdrops Collected
+					</b>
+					<span class="float-end">
+						${stats.AirdropsCollected}
+					</span>
+				</div>
+				`
+			} else {
+				document.getElementById('p+greatdivide_stats').innerHTML = "<div class=\"mb-3\">This user hasn't participated in The Great Divide.</div>"
+			}
+		}
 	}
 });
 
@@ -131,11 +212,13 @@ function GetNext12PM() {
 }
 
 // HANDLE ALARMS FIRING
+/*
 chrome.alarms.onAlarm.addListener(function (alarm) {
 	if (alarm.name === 'PolyPlus-UpdateCheck') {
 		RunUpdateNotifier();
 	}
 });
+*/
 function RunUpdateNotifier() {
 	chrome.storage.local.get(['PolyPlus_LiveVersion', 'PolyPlus_OutOfDate', 'PolyPlus_SkipUpdate'], function (result) {
 		const OutOfDate = result.PolyPlus_OutOfDate || false;
@@ -194,16 +277,54 @@ chrome.contextMenus.removeAll(function () {
 	});
 
 	// COPY ASSET ID CONTEXT MENU ITEM REGISTRATION
+	/*
+	const AssetTypes = ["Place", "User", "Item", "Guild"]
+	AssetTypes.forEach(type => {
+		chrome.contextMenus.create({
+			title: 'Copy ' + type + ' ID',
+			id: 'PolyPlus-Copy' + type + 'ID',
+			contexts: ['link'],
+			documentUrlPatterns: ['https://polytoria.com/*', SettingsURL],
+			targetUrlPatterns: [
+				'https://polytoria.com/places/**'
+			]
+		});
+	})
+	*/
 	chrome.contextMenus.create({
-		title: 'Copy Asset ID',
+		title: 'Copy Place ID',
-		id: 'PolyPlus-CopyID',
+		id: 'PolyPlus-CopyPlaceID',
+		contexts: ['link'],
+		documentUrlPatterns: ['https://polytoria.com/*', SettingsURL],
+		targetUrlPatterns: [
+			'https://polytoria.com/places/**'
+		]
+	});
+	chrome.contextMenus.create({
+		title: 'Copy User ID',
+		id: 'PolyPlus-CopyUserID',
 		contexts: ['link'],
 		documentUrlPatterns: ['https://polytoria.com/*', SettingsURL],
 		targetUrlPatterns: [
-			'https://polytoria.com/places/**',
 			'https://polytoria.com/users/**',
-			'https://polytoria.com/u/**',
+			'https://polytoria.com/u/**'
-			'https://polytoria.com/store/**',
+		]
+	});
+	chrome.contextMenus.create({
+		title: 'Copy Item ID',
+		id: 'PolyPlus-CopyItemID',
+		contexts: ['link'],
+		documentUrlPatterns: ['https://polytoria.com/*', SettingsURL],
+		targetUrlPatterns: [
+			'https://polytoria.com/store/**'
+		]
+	});
+	chrome.contextMenus.create({
+		title: 'Copy Guild ID',
+		id: 'PolyPlus-CopyGuildID',
+		contexts: ['link'],
+		documentUrlPatterns: ['https://polytoria.com/*', SettingsURL],
+		targetUrlPatterns: [
 			'https://polytoria.com/guilds/**'
 		]
 	});
@@ -222,7 +343,7 @@ chrome.contextMenus.removeAll(function () {
 
 // HANDLE CONTEXT MENU ITEMS
 chrome.contextMenus.onClicked.addListener(async function (info, tab) {
-	if (info.menuItemId === 'PolyPlus-CopyID') {
+	if (["CopyPlaceID", "CopyUserID", "CopyItemID", "CopyGuildID"].indexOf(info.menuItemId.split('-')[1]) !== -1) {
 		console.log(info.linkUrl.split('/')[3]);
 		let ID = info.linkUrl.split('/')[4];
 		if (info.linkUrl.split('/')[3] === 'u') {

js/library-download.js

@@ -2,10 +2,17 @@ const AssetID = window.location.pathname.split('/')[2];
 const LibraryType = document.querySelectorAll('ol a')[1].innerText.toLowerCase();
 const LibraryTypes = ['model', 'audio', 'decal', 'mesh', 'shirt', 'pant'];
 
-if (LibraryTypes.some(element => element.startsWith(LibraryType))) {
+if (LibraryTypes.some(element => LibraryType.startsWith(element))) {
 	chrome.storage.sync.get(['PolyPlus_Settings'], async function (result) {
 		Settings = result.PolyPlus_Settings || {};
 
+		if (['model', 'audio', 'decal', 'mesh'].some(element => LibraryType.startsWith(element))) {
+			const Breadcrumbs = document.querySelectorAll('ol a')
+			Breadcrumbs[0].href = '/library'
+			Breadcrumbs[0].innerText = 'Library'
+			Breadcrumbs[1].href = '/library'
+		}
+
 		if (Settings.LibraryDownloadsOn === false) {
 			return;
 		}
@@ -18,7 +25,15 @@ if (LibraryTypes.some(element => element.startsWith(LibraryType))) {
 		DownloadLink.innerHTML = `<i class="fa-duotone fa-download"></i> Download`;
 		Dropdown.insertBefore(DownloadLink, Dropdown.children[Dropdown.children.length - 1]);
 
-		console.log('type', LibraryType, LibraryType.startsWith('shirt'), LibraryType.startsWith('pant'))
+		const SourceLink = document.createElement('a');
+		SourceLink.classList = 'dropdown-item text-primary';
+		SourceLink.href = '#';
+		SourceLink.innerHTML = `<i class="fa-duotone fa-copy"></i> Copy CDN URL`;
+		
+		if (LibraryType.startsWith('audio') || LibraryType.startsWith('decal') || LibraryType.startsWith('shirt') || LibraryType.startsWith('pant') || LibraryType.startsWith('mesh')) {
+			Dropdown.insertBefore(SourceLink, DownloadLink)
+		}
+
 		switch (LibraryType) {
 			case LibraryType.startsWith('model'):
 				DownloadLink.href = 'https://api.polytoria.com/v1/models/get-model?id=' + AssetID;
@@ -27,14 +42,28 @@ if (LibraryTypes.some(element => element.startsWith(LibraryType))) {
 				const AudioBlob = new Blob([document.getElementsByTagName('audio')[0]], {type: 'octet-steam'});
 				DownloadLink.href = URL.createObjectURL(AudioBlob);
 				DownloadLink.download = document.getElementsByTagName('h1')[0].innerText + '.mp3';
+
+				console.log('aaaaa')
+				SourceLink.addEventListener('click', function() {
+					console.log('LCICKED!!')
+					navigator.clipboard
+						.writeText(document.getElementsByTagName('audio')[0].src)
+						.then(() => {})
+						.catch(() => {
+							alert('Failure to copy .png file CDN url to clipboard')
+						});
+				})
+				break;
+				/*
 			case (LibraryType.startsWith('decal')):
 				const DecalBlob = new Blob([document.getElementsByClassName('store-thumbnail')[0]], {type: 'image/png'});
 				DownloadLink.href = URL.createObjectURL(DecalBlob);
 				DownloadLink.download = document.getElementsByTagName('h1')[0].innerText + '.png';
 				break;
+				*/
 		}
 
-		if (LibraryType.startsWith('shirt') || LibraryType.startsWith('pant')) {
+		if (LibraryType.startsWith('shirt') || LibraryType.startsWith('pant') || LibraryType.startsWith('decal')) {
 			let ClothingURL = null;
 			DownloadLink.addEventListener('click', async function () {
 				if (ClothingURL !== null) {
@@ -43,7 +72,6 @@ if (LibraryTypes.some(element => element.startsWith(LibraryType))) {
 				ClothingURL = (await (await fetch('https://api.polytoria.com/v1/assets/serve/' + AssetID + '/Asset')).json());
 
 				if (ClothingURL.success === true) {
-					//const ClothingBlob = new Blob([(await (await fetch(ClothingURL.url)).blob())], {type: 'image/png'})
 					const ClothingBlob = (await (await fetch(ClothingURL.url)).blob())
 					DownloadLink.href = URL.createObjectURL(ClothingBlob);
 					DownloadLink.download = document.getElementsByTagName('h1')[0].innerText + '.png';
@@ -53,6 +81,23 @@ if (LibraryTypes.some(element => element.startsWith(LibraryType))) {
 					alert('Failure to fetch .png file for clothing item');
 				}
 			});
+
+			SourceLink.addEventListener('click', async function(){
+				if (ClothingURL !== null) {
+					return;
+				}
+				ClothingURL = (await (await fetch('https://api.polytoria.com/v1/assets/serve/' + AssetID + '/Asset')).json());
+
+				if (ClothingURL.success === true) {
+					navigator.clipboard.writeText(ClothingURL.url)
+						.then(() => {})
+						.catch(() => {
+							alert('Failure to copy .png file CDN url to clipboard')
+						});
+				} else {
+					alert('Failure to fetch .png file for clothing item');
+				}
+			})
 		} else if (LibraryType.startsWith('mesh')) {
 			let MeshURL = null;
 			DownloadLink.addEventListener('click', async function () {
@@ -70,6 +115,23 @@ if (LibraryTypes.some(element => element.startsWith(LibraryType))) {
 					alert('Failure to fetch .glb file for mesh');
 				}
 			});
+
+			SourceLink.addEventListener('click', async function(){
+				if (MeshURL !== null) {
+					return;
+				}
+				MeshURL = (await (await fetch('https://api.polytoria.com/v1/assets/serve-mesh/' + AssetID)).json());
+
+				if (MeshURL.success === true) {
+					navigator.clipboard.writeText(MeshURL.url)
+						.then(() => {})
+						.catch(() => {
+							alert('Failure to copy .glb file CDN url to clipboard')
+						});
+				} else {
+					alert('Failure to fetch .glb file for mesh');
+				}
+			})
 		}
 	});
 }

js/places/place-view.js

@@ -50,10 +50,6 @@ const Gamepasses = Array.from(GamepassesTab.getElementsByClassName('card')) || [
 		Utilities = await import(chrome.runtime.getURL('resources/utils.js'));
 		Utilities = Utilities.default;
 
-		if (Settings.GD_ServerBalanceOn && PlaceID === '9656') {
-			TheGreatDivide()
-		}
-
 		if (Settings.PinnedGamesOn === true) {
 			PinnedGames();
 		}
@@ -516,37 +512,4 @@ function GetAchievementDifficulty(percent) {
 	} else if (percent >= 0 && percent <= 0.9) {
 		return 'Impossible';
 	}
-}
-
-// Temp Feature for The Great Divide event
-async function TheGreatDivide() {
-	const Team = (await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/greatdivide')).json()).team
-	if (Team !== undefined) {
-		const Servers = Array.from(document.getElementById('servers-tabpane').children)
-
-		Servers.forEach(server => {
-			const TeamCounts = {
-				phantoms: server.getElementsByClassName('border-phantoms').length,
-			 	cobras: server.getElementsByClassName('border-cobras').length
-			}
-
-			let Enemy = "cobras"
-			if (Team === "cobras") { Enemy = "phantoms" }
-
-			if (TeamCounts[Team] < TeamCounts[Enemy]) {
-				console.log(server.getElementsByTagName('button')[0])
-				const UnbalancedText = document.createElement('p')
-				UnbalancedText.classList = 'mb-2'
-				UnbalancedText.style.fontSize = '0.7rem'
-				UnbalancedText.style.color = 'orange'
-				UnbalancedText.innerHTML = `*Potentially Unbalanced <i class="fa-solid fa-circle-info" data-bs-toggle="tooltip" data-bs-title="${TeamCounts.cobras} Cobras and ${TeamCounts.phantoms} Phantoms"></i>`
-				
-				const ServerInfoColumn = server.getElementsByClassName('col-3')[0]
-				ServerInfoColumn.children[0].style.marginBottom = '0px'
-				ServerInfoColumn.insertBefore(UnbalancedText, ServerInfoColumn.children[1])
-
-				Utilities.InjectResource("registerTooltips")
-			}
-		})
-	}
 }

js/sitewide.js

@@ -1,227 +1,214 @@
+console.log('start of script')
+
 var Settings;
 let Theme = ``;
 
 (async () => {
+  console.log('start of async')
   let Utilities = await import(chrome.runtime.getURL('resources/utils.js'));
   Utilities = Utilities.default;
+  console.log('imported utils')
 
   chrome.storage.sync.get(['PolyPlus_Settings'], function (result) {
-      // Merge settings and expected settings to make sure all keys exist
+    console.log("fetched settings: ", result)
-      const RawSettings = result.PolyPlus_Settings;
+    // Merge settings and expected settings to make sure all keys exist
-      Settings = MergeObjects(RawSettings || Utilities.DefaultSettings, Utilities.DefaultSettings);
+    const RawSettings = result.PolyPlus_Settings;
+    Settings = Utilities.MergeObjects(RawSettings || Utilities.DefaultSettings, Utilities.DefaultSettings);
 
-      // Apply theme settings after Settings is defined
+    const PageLoad = async function() {
-      applyThemeSettings();
+      console.log("fired dom load")
-  });
+      if (document.getElementsByClassName('card-header')[0] && document.getElementsByClassName('card-header')[0].innerText === ' Page not found') {
-})();
+        return;
+      }
+      console.log("passed error check")
 
-function applyThemeSettings() {
+      Utilities.InjectResource('getUserDetails');
-  // If theme exists, create a style element to represent it
+      document.body.setAttribute('data-URL', window.location.pathname);
-  if (Settings.ThemeCreator && Settings.ThemeCreator.Enabled === true) {
+
-    switch (Settings.ThemeCreator.BGImageSize) {
+      if (Settings.IRLPriceWithCurrency && Settings.IRLPriceWithCurrency.Enabled === true) {
-      case 0:
+        const IRLResult = await Utilities.CalculateIRL(document.querySelector('.brickBalanceCont').innerText.replace(/\s+/g, ''), Settings.IRLPriceWithCurrency.Currency);
-        Settings.ThemeCreator.BGImageSize = 'fit';
+        // Desktop
-        break;
+        document.querySelector('.text-success .brickBalanceCount').innerHTML += ` (${IRLResult.icon}${IRLResult.result} ${IRLResult.display})`;
-      case 1:
+
-        Settings.ThemeCreator.BGImageSize = 'cover';
+        // Mobile
-        break;
+        document.querySelector('.text-success .brickBalanceCont').innerHTML += ` (${IRLResult.icon}${IRLResult.result} ${IRLResult.display})`;
-      case 2:
+        //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>`
-        Settings.ThemeCreator.BGImageSize = 'contain';
+      }
-        break;
+
+      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) {
+            Needed[i].children[1].innerText = Settings.ModifyNav[i].Label;
+            Needed[i].href = Settings.ModifyNav[i].Link;
+          }
+        }
+      }
     }
-    Theme += `
+    if (document.readyState === 'complete') {
-        :root {
+      PageLoad()
-          --polyplus-navbgcolor: ${Settings.ThemeCreator.NavBGColor};
+    } else {
-          --polyplus-navbordercolor: ${Settings.ThemeCreator.NavBorderColor};
+      document.addEventListener('DOMContentLoaded', PageLoad);
-          --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 {
-          background-color: var(--polyplus-navbgcolor) !important;
-          border-bottom: 1px solid var(--polyplus-navbordercolor) !important;
-        }
-    
-        .nav-sidebar {
-          background-color: var(--polyplus-sidebarbgcolor) !important;
-          border-right: 1px solid var(--polyplus-sidebarbordercolor) !important;
-        }
-    
-        #app {
-          background-color: var(--polyplus-bgcolor) !important;
-          background-image: var(--polyplus-bgimage) !important;
-          background-size var(--polyplus-bgimagesize)
-          color: var(--polyplus-primarytextcolor) !important;
-        }
-    
-        .text-muted {
-          color: var(--polyplus-secondarytextcolor) !important;
-        }
-    
-        a {
-          color: var(--polyplus-linktextcolor) !important;
-        }
-    
-        a:hover {
-          color: var(--polyplus-linkhoveredtextcolor) !important;
-        }
-    
-        a:focus {
-          color: var(--polyplus-linkfocusedtextcolor) !important;
-        }
-    
-        /*
-        a:visited {
-          color: var(--polyplus-linkvisitedtextcolor) !important;
-        }
-        */
-    
-        .card-header {
-          background-color: var(--polyplus-cardheadbgcolor) !important;
-        }
-    
-        .card {
-          background-color: var(--polyplus-cardbodybgcolor) !important;
-          border-color: var(--polyplus-cardbordercolor) !important;
-        }
-    
-        nav a.nav-link {
-          color: var(--polyplus-navitemcolor) !important;
-        }
-    
-        .nav-sidebar .nav-sidebar-button {
-          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";
-  let currentCombination = "";
-  document.addEventListener("keypress", function (e) {
-    currentCombination += e.key;
-    if (currentCombination === combination && document.activeElement.tagName !== "INPUT" && document.activeElement.tagName !== "TEXTAREA") {
-      console.log("Reloading Poly+...");
-      chrome.runtime.sendMessage({ action: "reload" });
-      window.location.reload();
-    } else if (!combination.startsWith(currentCombination)) {
-      currentCombination = "";
     }
-  });
 
-  if (Settings.HideUserAds && Settings.HideUserAds.Enabled === true) {
+    // Apply Theme
-    if (Settings.HideUserAds.Banners && Settings.HideUserAds.Banners === true) {
+    LoadTheme();
-      Theme += `
+
+    const combination = "reload";
+    let currentCombination = "";
+    document.addEventListener("keypress", function (e) {
+      currentCombination += e.key;
+      if (currentCombination === combination && document.activeElement.tagName !== "INPUT" && document.activeElement.tagName !== "TEXTAREA") {
+        console.log("Reloading Poly+...");
+        chrome.runtime.sendMessage({ action: "reload" });
+        window.location.reload();
+      } else if (!combination.startsWith(currentCombination)) {
+        currentCombination = "";
+      }
+    });
+
+    if (Settings.HideUserAds && Settings.HideUserAds.Enabled === true) {
+      if (Settings.HideUserAds.Banners && Settings.HideUserAds.Banners === true) {
+        Theme += `
         div[style^="max-width: 728px;"]:has(a[href^="/ads"]) {
           display: none;
         }
         `;
-    }
+      }
 
-    if (Settings.HideUserAds.Rectangles && Settings.HideUserAds.Rectangles === true) {
+      if (Settings.HideUserAds.Rectangles && Settings.HideUserAds.Rectangles === true) {
-      Theme += `
+        Theme += `
         div[style^="max-width: 300px;"]:has(a[href^="/ads"]) {
           display: none;
         }
         `;
+      }
     }
-  }
 
-  if (Settings.HideNotifBadgesOn === true) {
+    if (Settings.HideNotifBadgesOn === true) {
-    Theme += `
+      document.getElementsByClassName('notifications-toggle')[0].getElementsByTagName('i')[0].classList = 'fa-bell far'
-      .notif-nav .notif-sidebar {
+      Theme += `
+      .notif-nav.notif-sidebar {
+        display: none;
+      }
+
+      .notifications-toggle {
+        opacity: 0.6;
+      }
+
+      .notifications-toggle .unread-indicator {
         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+)
-  const ThemeBlob = new Blob([Theme], { type: 'text/css' });
-  const ThemeURL = URL.createObjectURL(ThemeBlob);
-  document.head.innerHTML += `<link href="${ThemeURL}" rel="stylesheet" type="text/css">`;
-
-  document.addEventListener('DOMContentLoaded', async function () {
-    if (document.getElementsByClassName('card-header')[0] && document.getElementsByClassName('card-header')[0].innerText === ' Page not found') {
-      return;
-    }
-
-    Utilities.InjectResource('getUserDetails');
-    document.body.setAttribute('data-URL', window.location.pathname);
-
-    const UserData = JSON.parse(window.localStorage.getItem('p+account_info'));
-
-    if (Settings.IRLPriceWithCurrency && Settings.IRLPriceWithCurrency.Enabled === true) {
-      const IRLResult = await Utilities.CalculateIRL(document.querySelector('.brickBalanceCont').innerText.replace(/\s+/g, ''), Settings.IRLPriceWithCurrency.Currency);
-      // Desktop
-      document.querySelector('.text-success .brickBalanceCount').innerHTML += ` (${IRLResult.icon}${IRLResult.result} ${IRLResult.display})`;
-
-      // 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) {
-      Array.from(document.querySelectorAll('.text-center:has(a[href^="/ads"])')).forEach(ad => {ad.remove()})
-    }
-    */
-
-    if (Settings.HideNotifBadgesOn === true) {
-      document.getElementsByClassName('notif-nav notif-sidebar').forEach((element) => {
-        element.remove();
-      });
     }
+    
+    // Credit to @SK-Fast (also known as DevPixels) for the improved loading code (taken from his original Poly+, and reformatted to Index Poly+)
+    const ThemeBlob = new Blob([Theme], { type: 'text/css' });
+    const ThemeURL = URL.createObjectURL(ThemeBlob);
+    document.head.innerHTML += `<link href="${ThemeURL}" rel="stylesheet" type="text/css">`;
   });
-}
+})();
 
-function MergeObjects(obj1, obj2) {
+function LoadTheme() {
-  var mergedObj = {};
+  if (!Settings.ThemeCreator || Settings.ThemeCreator.Enabled !== true) { return }
 
-  // Copy the values from obj1 to the mergedObj
+  switch (Settings.ThemeCreator.BGImageSize) {
-  for (var key in obj1) {
+    case 0:
-    mergedObj[key] = obj1[key];
+      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};
   }
 
-  // Merge the values from obj2 into the mergedObj, favoring obj2 for non-existing keys in obj1
+  nav {
-  for (var key in obj2) {
+    background-color: var(--polyplus-navbgcolor) !important;
-    if (!obj1.hasOwnProperty(key)) {
+    border-bottom: 1px solid var(--polyplus-navbordercolor) !important;
-      mergedObj[key] = obj2[key];
-    }
   }
 
-  return mergedObj;
+  .nav-sidebar {
-}
+    background-color: var(--polyplus-sidebarbgcolor) !important;
+    border-right: 1px solid var(--polyplus-sidebarbordercolor) !important;
+  }
+
+  #app {
+    background-color: var(--polyplus-bgcolor) !important;
+    background-image: var(--polyplus-bgimage) !important;
+    background-size var(--polyplus-bgimagesize)
+    color: var(--polyplus-primarytextcolor) !important;
+  }
+
+  .text-muted {
+    color: var(--polyplus-secondarytextcolor) !important;
+  }
+
+  a {
+    color: var(--polyplus-linktextcolor) !important;
+  }
+
+  a:hover {
+    color: var(--polyplus-linkhoveredtextcolor) !important;
+  }
+
+  a:focus {
+    color: var(--polyplus-linkfocusedtextcolor) !important;
+  }
+
+  /*
+  a:visited {
+    color: var(--polyplus-linkvisitedtextcolor) !important;
+  }
+  */
+
+  .card-header {
+    background-color: var(--polyplus-cardheadbgcolor) !important;
+  }
+
+  .card {
+    background-color: var(--polyplus-cardbodybgcolor) !important;
+    border-color: var(--polyplus-cardbordercolor) !important;
+  }
+
+  nav a.nav-link {
+    color: var(--polyplus-navitemcolor) !important;
+  }
+
+  .nav-sidebar .nav-sidebar-button {
+    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;
+  }
+  `;
+}

js/store/item-view.js

@@ -308,13 +308,11 @@ function TryOnItems() {
 		</div>
 	</div>
 	<div class="modal-body"></div>
-  `;
+  	`;
 
 	document.body.prepend(TryOnModal);
 	ItemThumbnail.parentElement.appendChild(TryOnBtn);
 	TryOnModal.children[1].prepend(TryIFrame);
-
-	//Utilities.InjectResource('registerTooltips')
 }
 
 async function HoardersList(min, avatars) {
@@ -324,21 +322,21 @@ async function HoardersList(min, avatars) {
 	const Tab = document.createElement('li');
 	Tab.classList = 'nav-item';
 	Tab.innerHTML = `
-  <a class="nav-link">
+	<a class="nav-link">
-    <i class="fas fa-calculator me-1"></i>
+		<i class="fas fa-calculator me-1"></i>
-    <span class="d-none d-sm-inline"><span class="pilltitle">Hoarders</span>
+		<span class="d-none d-sm-inline"><span class="pilltitle">Hoarders</span>
-  </a>
+	</a>
-  `;
+	`;
 	Tabs.appendChild(Tab);
 
 	const TabContent = document.createElement('div');
 	TabContent.classList = 'd-none';
 	TabContent.innerHTML = `
-  <small class="d-block text-center text-muted" style="font-size: 0.8rem;">
+	<small class="d-block text-center text-muted" style="font-size: 0.8rem;">
-    loading... (this may take a few seconds)
+		loading... (this may take a few seconds)
-  </small>
+	</small>
-  <lottie-player id="avatar-loading" src="https://c0.ptacdn.com/static/images/lottie/poly-brick-loading.2b51aa85.json" background="transparent" speed="1" style="width: 20%;height: auto;margin: -16px auto 50px;margin-top: 0px;" loop="" autoplay=""></lottie-player>
+	<lottie-player id="avatar-loading" src="https://c0.ptacdn.com/static/images/lottie/poly-brick-loading.2b51aa85.json" background="transparent" speed="1" style="width: 20%;height: auto;margin: -16px auto 50px;margin-top: 0px;" loop="" autoplay=""></lottie-player>
-  `;
+	`;
 	document.getElementById('owners').parentElement.appendChild(TabContent);
 
 	// Add tab logic
@@ -645,13 +643,13 @@ function CheckOwner() {
 	const CheckOwnerDiv = document.createElement('div');
 	CheckOwnerDiv.classList = 'mt-3 d-none';
 	CheckOwnerDiv.innerHTML = `
-  <div class="input-group mb-2">
+	<div class="input-group mb-2">
-    <input type="text" class="form-control bg-dark" placeholder="Username..">
+		<input type="text" class="form-control bg-dark" placeholder="Username..">
-    <button class="btn btn-success">Check</button>
+		<button class="btn btn-success">Check</button>
-  </div>
+	</div>
 
-  <b class="text-muted" style="font-size: 0.85rem;"><i class="fa-duotone fa-square-question mr-1"></i> ...</b>
+	<b class="text-muted" style="font-size: 0.85rem;"><i class="fa-duotone fa-square-question mr-1"></i> ...</b>
-  `;
+	`;
 
 	ImageCard.appendChild(CheckOwnerDiv);
 
@@ -698,7 +696,7 @@ function CheckOwner() {
 
 			if (Owns.owned === true) {
 				ResultText.classList = 'text-success';
-				ResultText.innerHTML = '<i class="fa-duotone fa-circle-check mr-1"></i> ' + Username + ' owns #' + Owns.inventory.serial + ' of ' + document.getElementsByTagName('h1')[0].innerText + '".';
+				ResultText.innerHTML = '<i class="fa-duotone fa-circle-check mr-1"></i> ' + Username + ' owns #' + Owns.inventory.serial + ' of "' + document.getElementsByTagName('h1')[0].innerText + '".';
 			} else {
 				ResultText.classList = 'text-danger';
 				ResultText.innerHTML = '<i class="fa-duotone fa-circle-check mr-1"></i> ' + Username + ' does not own "' + document.getElementsByTagName('h1')[0].innerText + '".';

js/store/store.js

@@ -21,24 +21,37 @@ chrome.storage.sync.get(['PolyPlus_Settings'], async function (result) {
 		});
 	}
 
-	if (Settings.StoreOwnTagOn === true) {
-		Inventory = (await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=hat&limit=100')).json());
-		if (Inventory.errors === undefined) {
-			Inventory = Inventory.inventory
-			Inventory.concat(await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=face&limit=100')).json()).inventory;
-			Inventory.concat(await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=tool&limit=100')).json()).inventory;
-			console.log(Inventory);
-			Array.from(ItemGrid.children).forEach((element) => {
-				LoadOwnedTags(element);
-			});
-		} else {
-			console.log(Inventory)
-		}
-	}
-
 	if (Settings.EventItemsCatOn === true) {
 		EventItems();
 	}
+
+	if (Settings.StoreOwnTagOn === true) {
+		chrome.storage.local.get('PolyPlus_InventoryCache', async function(result){
+			console.log(result)
+			if (result.PolyPlus_InventoryCache !== undefined && (new Date().getTime() - result.PolyPlus_InventoryCache[1] < 5000)) {
+				console.log('not undefined')
+				Inventory = result.PolyPlus_InventoryCache[0]
+				Array.from(ItemGrid.children).forEach((element) => {
+					LoadOwnedTags(element);
+				});
+			} else {
+				Inventory = (await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=hat&limit=100')).json());
+				if (Inventory.errors === undefined) {
+					Inventory = Inventory.inventory
+					Inventory = [...Inventory, ...(await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=face&limit=100')).json()).inventory];
+					Inventory = [...Inventory, ...(await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=tool&limit=100')).json()).inventory];
+					Inventory = [...Inventory, ...(await (await fetch('https://api.polytoria.com/v1/users/' + UserID + '/inventory?type=profileTheme&limit=100')).json()).inventory];
+					console.log(Inventory);
+					chrome.storage.local.set({'PolyPlus_InventoryCache': [Inventory, new Date().getTime()]}, function(){})
+					Array.from(ItemGrid.children).forEach((element) => {
+						LoadOwnedTags(element);
+					});
+				} else {
+					console.log(Inventory)
+				}
+			}
+		})
+	}
 });
 
 const observer = new MutationObserver(async function (list) {

resources/avatar-sandbox.html

@@ -2,9 +2,26 @@
 	#options {
 		position: absolute;
 		bottom: 0;
-		margin: 20px;
+		margin-bottom: 15px;
-		margin-bottom: 40px;
 		font-size: 1.25rem;
+		background: #1a1a1a;
+		border-radius: 10px;
+		padding: 2.5px;
+		font-size: 1.25rem;
+
+		/*
+		button iteration #2
+
+		font-size: 1.25rem;
+		background: #333333;
+		border-radius: var(--bs-card-border-radius);
+		padding: 2.5px;
+		font-size: 1.25rem;
+		left: -1px;
+		bottom: -1px;
+		border-top-left-radius: 0px;
+		border-bottom-right-radius: 0px;
+		*/
 	}
 
 	#options *:not(input) {
@@ -18,12 +35,15 @@
 		margin-bottom: 3.5px;
 	}
 </style>
+<div class="alert bg-danger" role="banner">
+	The Avatar Sandbox is currently being rewritten to have better caching and better, more reliable code. It should be included in v1.2.3
+</div>
 <div class="row">
 	<div class="col-12 col-lg-3">
 		<div class="card mcard mb-3">
 			<h6 class="card-header">
 				<i class="fad fa-user-crown"></i>
-				Avatar Sandbox
+				Poly+ Avatar Sandbox
 			</h6>
 			<div class="card-body">
 				<iframe id="viewFrame" style="width: 100%; height: 314px; border-radius: 0.65rem;"></iframe>
@@ -31,43 +51,49 @@
 					<input name="JSONUpload" type="file" accept="application/json" multiple="false" id="jsonUpload" aria-label="Upload JSON!" style="display: none;" />
 
 					<label for="JSONUpload" style="display: block;">
-						<button aria-label="Upload JSON!" onclick="this.parentElement.previousElementSibling.click()">
+						<button aria-label="Upload JSON!" onclick="this.parentElement.previousElementSibling.click()" data-bs-toggle="tooltip" data-bs-title="Upload" data-bs-placement="right">
-							<i class="fa-duotone fa-download"></i>
+							<i class="fa-duotone fa-upload"></i>
 						</button>
 					</label>
 
-					<button id="jsonSave" aria-label="Save as JSON!" style="display: block;">
+					<button id="jsonSave" aria-label="Save as JSON!" style="display: block;" data-bs-toggle="tooltip" data-bs-title="Download" data-bs-placement="right">
-						<i class="fa-duotone fa-upload"></i>
+						<i class="fa-duotone fa-download"></i>
 					</button>
 
-					<button id="openNewTab" aria-label="View in a new tab!" style="display: block;">
+					<button id="openNewTab" aria-label="View in a new tab!" style="display: block;" data-bs-toggle="tooltip" data-bs-title="New Tab" data-bs-placement="right">
 						<i class="fa-duotone fa-up-right-from-square"></i>
 					</button>
 
-					<button aria-label="View in full screen!" style="display: block;" onclick="document.getElementById('viewFrame').requestFullscreen()">
+					<button aria-label="View in full screen!" style="display: block;" onclick="document.getElementById('viewFrame').requestFullscreen()" data-bs-toggle="tooltip" data-bs-title="Full Screen" data-bs-placement="right">
 						<i class="fa-duotone fa-minimize"></i>
 					</button>
 				</div>
 			</div>
 		</div>
+		<button id="myself" class="btn btn-outline-primary w-100 mb-2">
+			<i class="fa-duotone fa-shirt"></i>
+			Load Myself
+		</button>
 		<div class="row mb-3">
-			<div class="col">
-				<button id="myself" class="btn btn-outline-primary w-100">
-					<i class="fa-duotone fa-shirt"></i>
-					Myself
-				</button>
-			</div>
 			<div class="col">
 				<button id="clear" class="btn btn-outline-warning w-100">
 					<i class="fa-duotone fa-trash"></i>
 					Clear
 				</button>
 			</div>
+			<div class="col">
+				<button id="saveOutfit" class="btn btn-outline-success w-100">
+					<i class="fa-duotone fa-save"></i>
+					Save
+				</button>
+			</div>
 		</div>
 		<hr class="mt-2 mb-3">
 		<select class="form-select mb-2" id="load-asset-type">
 			<option value="hat" selected>Hat</option>
+			<option value="tool">Tool</option>
 			<option value="face">Face</option>
+			<hr>
 			<option value="shirt">Shirt</option>
 			<option value="pants">Pants</option>
 			<hr>
@@ -89,13 +115,13 @@
 						<button id="head" class="avatarAction bodypart bp1x1" style="background-color: #e0e0e0;"></button>
 					</div>
 					<div style="margin-bottom: 5px">
-						<button id="rightArm" class="avatarAction bodypart bp1x2" style="background-color: #e0e0e0; margin-right: 5px;"></button
+						<button id="rightArm" class="avatarAction bodypart bp1x2" style="background-color: #e0e0e0; margin-right: 5px;"></button>
-						><button id="torso" class="avatarAction bodypart bp2x2" style="background-color: #e0e0e0;"></button
+						<button id="torso" class="avatarAction bodypart bp2x2" style="background-color: #e0e0e0;"></button>
-						><button class="avatarAction bodypart bp1x2" id="leftArm" style="background-color: #e0e0e0; margin-left: 5px;"></button>
+						<button class="avatarAction bodypart bp1x2" id="leftArm" style="background-color: #e0e0e0; margin-left: 5px;"></button>
 					</div>
 					<div>
-						<button class="avatarAction bodypart bp1x2" id="rightLeg" style="background-color: #e0e0e0; margin-right: 5px; padding-right: 18px;"></button
+						<button class="avatarAction bodypart bp1x2" id="rightLeg" style="background-color: #e0e0e0; margin-right: 5px; padding-right: 18px;"></button>
-						><button id="leftLeg" class="avatarAction bodypart bp1x2" style="background-color: #e0e0e0; padding-right: 18px;"></button>
+						<button id="leftLeg" class="avatarAction bodypart bp1x2" style="background-color: #e0e0e0; padding-right: 18px;"></button>
 					</div>
 				</div>
 			</div>
@@ -137,7 +163,29 @@
 		</ul>
 		<div class="card px-2 pt-2 pb-2 mb-4" style="background: rgba(0, 0, 0, 0.23); border-color: rgba(0, 0, 0, 0.23); border-top-left-radius: 20px; border-top-right-radius: 20px;">
 			<input id="item-search" type="text" class="form-control mb-2" placeholder="Search for an item..." />
-			<div class="row alignleft itemgrid" id="inventory"></div>
+			<div class="row alignleft itemgrid mb-4" id="inventory"></div>
+			<nav id="pagination" style="margin: auto;">
+				<ul class="pagination">
+					<li class="page-item disabled" id="pagination-first">
+						<a class="page-link" href="#!">«</a>
+					</li>
+					<li class="page-item disabled" id="pagination-prev">
+						<a class="page-link" href="#!">‹</a>
+					</li>
+					<li class="page-item active">
+						<a class="page-link">
+							<span class="visually-hidden">Page</span>
+							<span id="pagination-current">1</span>
+						</a>
+					</li>
+					<li class="page-item" id="pagination-next">
+						<a class="page-link" href="#!">›</a>
+					</li>
+					<li class="page-item" id="pagination-last">
+						<a class="page-link" href="#!">»</a>
+					</li>
+				</ul>
+			</nav>
 		</div>
 		<h6 class="card-header mb-2"><i class="fad fa-hat-wizard me-1"></i> Wearing</h6>
 		<div class="card px-2 pt-2 pb-2 mb-4" style="background: rgba(0, 0, 0, 0.23); border-color: rgba(0, 0, 0, 0.23); border-top-left-radius: 20px; border-top-right-radius: 20px;">
@@ -145,3 +193,8 @@
 		</div>
 	</div>
 </div>
+<script>
+	console.log('YPOFWPJGUWRHGUWHPOH')
+	var tooltips = document.querySelectorAll('[data-bs-toggle="tooltip"]');
+	var list = [...tooltips].map((tool) => new bootstrap.Tooltip(tool));
+</script>

resources/utils.js

@@ -100,11 +100,20 @@ export default {
 		},
 		UploadMultipleDecals: true,
 		GD_ServerBalanceOn: true,
-		AvatarDimensionToggleOn: true
+		AvatarDimensionToggleOn: true,
+		TheGreatDivide: {
+			Enabled: true,
+			UnbalancedIndicatorOn: true,
+			MVPUserIndicatorOn: true,
+			UserStatsOn: true,
+			LeaderboardsOn: true
+		},
+		CollectibleInventoryCatOn: true
 	},
 	Limits: {
 		PinnedGames: 10,
 		BestFriends: 15,
+		// Item Wishlist and ImprovedFrLists limit here is not implemented in the code
 		ImprovedFrLists: 20,
 		ItemWishlist: 20,
 		HoardersListPages: 4
@@ -201,6 +210,16 @@ export default {
 				Result = (bricks * 0.49).toFixed(2);
 				Display = 'BRL';
 
+				break;
+
+			// Zimbabwean Dollar
+			case 8:
+				Icon = 'Z$'
+				IsIconAbbr = true
+
+				Result = (bricks * 0.13739106).toFixed(2)
+				Display = 'ZWL'
+
 				break;
 		}
 
@@ -244,7 +263,7 @@ export default {
 		});
 		Node.appendChild(Script);
 	},
-	// MergeObjects function was written by ChatGPT cause I was lazy and it was awhile ago
+	// MergeObjects function was written by ChatGPT cause I was lazy and it was a while ago
 	MergeObjects: function(obj1, obj2) {
 		var mergedObj = {};
 

settings.html

@@ -278,21 +278,54 @@
 			</div>
 		</dialog>
 		<div id="page">
-			<h1 class="text-center" style="text-shadow: 0px 0px 5px orange; padding-bottom: 5px; margin-bottom: 10px;">Poly+ Settings</h1>
+			<h1
-			<div class="card card-body limited-time setting-container mb-3" id="greatdivide-server-unbalance">
+				class="text-center"
+				style="
+					text-shadow: 0px 0px 5px orange;
+					padding-bottom: 5px;
+					margin-bottom: 10px;
+				"
+			>
+				Poly+ Settings
+			</h1>
+			<div class="card card-body limited-time setting-container mb-3" id="greatdivide-server-unbalance" style="background-image: linear-gradient(rgba(0.8, 0.8, 0.8, 0.8), rgba(0.8, 0.8, 0.8, 0.8)), url(/images/greatdivide.png); background-size: cover; background-position: center;">
 				<div class="row">
 					<div class="col-auto">
 						<span class="indicator">&nbsp;</span>
 					</div>
 					<div class="col">
 						<span class="title">
-							"Potentially Unbalanced" Server Tag
+							The Great Divide
-							<button class="btn btn-sm toggle-btn" data-setting="GD_ServerBalanceOn">Toggle</button>
+							<button class="btn btn-sm toggle-btn" data-setting="Enabled" data-parent="TheGreatDivide">Toggle</button>
 						</span>
 					</div>
 				</div>
-				<span class="desc">Quickly check if The Great Divide official event place servers are balanced or not! To be unbalanced, the team opposite of you has to have at least 1 more member in the server than you.</span>
+				<span class="desc">Reinforcements to aid in your quest to bring home the victory to your team, and bring honor to your peers.</span>
-			
+
+				<span class="form-check form-switch">
+					<input class="form-check-input" type="checkbox" role="switch" id="server-unbalanced-greatdivide" data-setting="UnbalancedIndicatorOn" data-parent="TheGreatDivide" />
+					<label class="form-check-label" for="server-unbalanced-greatdivide">"Potentially Unbalanced" indicator in server list </label>
+				</span>
+				<!--
+				<span class="form-check form-switch">
+					<input class="form-check-input" type="checkbox" role="switch" id="mvp-user-greatdivide" data-setting="MVPUserIndicatorOn" data-parent="TheGreatDivide" />
+					<label class="form-check-label" for="mvp-user-greatdivide"> "MVP" User indicator in server list (not implemented yet)</label>
+				</span>
+				-->
+				<span class="form-check form-switch">
+					<input class="form-check-input" type="checkbox" role="switch" id="user-statistics-greatdivide" data-setting="UserStatsOn" data-parent="TheGreatDivide" />
+					<label class="form-check-label" for="user-statistics-greatdivide">User Statistics tab on profiles</label>
+				</span>
+				<!--
+				<span class="form-check form-switch">
+					<input class="form-check-input" type="checkbox" role="switch" id="leaderboards-greatdivide" data-setting="LeaderboardsOn" data-parent="TheGreatDivide" />
+					<label class="form-check-label" for="leaderboards-greatdivide"> Related ranking leaderboards (not implemented yet)</label>
+				</span>
+				-->
+
+				<small class="text-muted mt-1" style="font-size: 0.7rem;">
+					* some features use <a href="https://polytoria.com/u/dargy" target="_blank">@dargy</a>'s public API! thank you!
+				</small>
 				<small class="limited-time-tag mt-1">
 					* available until July 14th
 				</small>
@@ -315,19 +348,8 @@
 				<br />
 				<span class="desc">Get a quick link to the popular person everyone is talking about's profile!</span>
 				<br />
-				<span style="font-size: 0.8rem; color: orange;">* Forum Mentions do not notify the user or show up as a notification on their account.</span>
+				<span class="warning">* Forum Mentions do not notify the user or show up as a notification on their account.</span>
 			</div>
-			<!--
-			<div class="setting-container" id="best-friends">
-				<span class="indicator">&nbsp;</span>
-				<span class="title">
-					Best Friends
-					<button class="btn btn-sm toggle-btn" data-setting="BestFriendsOn">Toggle</button>
-				</span>
-				<br />
-				<span class="desc">Prioritize the bestest of friends on applicable friend lists! (limit: <span id="BestFriends-limit"></span> best friends)</span>
-			</div>
-			-->
 			<div class="setting-container" id="improved-friend-lists">
 				<span class="indicator">&nbsp;</span>
 				<span class="title">
@@ -338,18 +360,7 @@
 				<span class="desc">
 					Accept or decline all friend requests with the click of a button or multi-remove existing friends!
 					<br />
-					<span style="font-size: 0.8rem; color: orange;">* You can only remove up to <span id="ImprovedFrLists-limit"></span> friends at once.</span>
+					<span class="warning">* You can only remove up to <span id="ImprovedFrLists-limit"></span> friends at once.</span>
-				</span>
-			</div>
-			<div class="setting-container" id="upload-multiple-decals">
-				<span class="indicator">&nbsp;</span>
-				<span class="title">
-					Upload multiple decals
-					<button class="btn btn-sm toggle-btn" data-setting="UploadMultipleDecals">Toggle</button>
-				</span>
-				<br />
-				<span class="desc">
-					Lets you quickly upload multiple decals at once!
 				</span>
 			</div>
 			<div class="setting-container" id="irl-price-with-brick-count">
@@ -362,9 +373,9 @@
 				<span class="desc mb-4">
 					See the real life currency value along with Bricks across the site!
 					<br />
-					<span style="font-size: 0.8rem; color: orange;">* Currencies were calculated on <span id="IRLPriceWithCurrency-Date">[DATE]</span>.</span>
+					<span class="warning">* Currencies were calculated on <span id="IRLPriceWithCurrency-Date">[DATE]</span>.</span>
 					<br />
-					<span style="font-size: 0.8rem; color: orange;">* Currencies other than USD are purely approximations.</span>
+					<span class="warning">* Currencies other than USD are purely approximations.</span>
 				</span>
 				<select id="IRLPriceWithCurrencyCurrency" class="form-select form-select-sm mb-2" style="width:350px;" data-setting="Currency" data-parent="IRLPriceWithCurrency">
 					<option value="USD" selected>United States Dollar (USD)</option>
@@ -375,6 +386,7 @@
 					<option value="AUD">Australian Dollar (AUD)</option>
 					<option value="TRY">Turkish Lira (TRY)</option>
 					<option value="BRL">Brazilian Real (BRL)</option>
+					<option value="ZWL">Zimbabwean Dollar (ZWL)</option>
 				</select>
 				<!--
 				<select id="IRLPriceWithCurrencyPackage" class="form-select form-select-sm mb-2" style="width:350px;" data-setting="Package" data-parent="IRLPriceWithCurrency">
@@ -424,7 +436,7 @@
 				<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>
 				<br />
-				<span style="font-size: 0.8rem; color: orange;">* This currently only has a "Creator" username filter on the forum search page, more search filters are yet to come.</span>
+				<span class="warning">* This currently only has a "Creator" username filter on the forum search page, more search filters are yet to come.</span>
 			</div>
 			<div class="setting-container" id="apply-membership-theme">
 				<span class="indicator">&nbsp;</span>
@@ -449,7 +461,7 @@
 				<span class="desc">
 					Quickly cancel several out-bound trades (trades that you have sent) all at once
 					<br />
-					<span style="font-size: 0.8rem; color: orange;">* You can only cancel up to 10 trades at once.</span>
+					<span class="warning">* You can only cancel up to 10 trades at once.</span>
 				</span>
 			</div>
 			<div class="setting-container" id="modify-navbar">
@@ -498,7 +510,7 @@
 				<br />
 				<span class="desc">Quickly see how many bricks a user has gained from one of their places!</span>
 				<br />
-				<span style="font-size: 0.8rem; color: orange;"
+				<span class="warning"
 					>* Gamepass revenue is calculated assuming the price hasn't changed and all users that bought the gamepass, bought it at the same price that it is at the time of calculating.</span
 				>
 			</div>
@@ -584,7 +596,7 @@
 				<br />
 				<span class="desc">Hide those annoying <s>out of context Discord message</s> user ads!</span>
 				<br />
-				<span style="font-size: 0.8rem; color: orange;">* Ads that are shown to help support Polytoria are not hidden.</span>
+				<span class="warning">* Ads that are shown to help support Polytoria are not hidden.</span>
 				<span class="form-check form-switch">
 					<input class="form-check-input" type="checkbox" role="switch" id="hide-user-ads-banner" data-setting="Banners" data-parent="HideUserAds" />
 					<label class="form-check-label" for="hide-user-ads-banner"> Hide Banner User Ads </label>
@@ -594,6 +606,17 @@
 					<label class="form-check-label" for="hide-user-ads-rectangle"> Hide Rectangle User Ads </label>
 				</span>
 			</div>
+			<div class="setting-container" id="upload-multiple-decals">
+				<span class="indicator">&nbsp;</span>
+				<span class="title">
+					Multi-Decal Uploading
+					<button class="btn btn-sm toggle-btn" data-setting="UploadMultipleDecals">Toggle</button>
+				</span>
+				<br />
+				<span class="desc">
+					Quickly upload several decals all at once!
+				</span>
+			</div>
 			<div class="setting-container" id="avatar-dimension-toggle">
 				<span class="indicator">&nbsp;</span>
 				<span class="title">
@@ -605,6 +628,17 @@
 					Quickly switch between a 3D or 2D rendition of somebody's avatar on their profile page!
 				</span>
 			</div>
+			<div class="setting-container" id="collectibles-inventory-category">
+				<span class="indicator">&nbsp;</span>
+				<span class="title">
+					"Collectibles" Inventory Category
+					<button class="btn btn-sm toggle-btn" data-setting="CollectibleInventoryCatOn">Toggle</button>
+				</span>
+				<br />
+				<span class="desc">
+					Sort a player's inventory by all of their limited-edition collectibles!
+				</span>
+			</div>
 			<!---
 			<div class="setting-container" id="auto-ad-bidding">
 				<span class="indicator">&nbsp;</span>
@@ -631,9 +665,9 @@
 						<br />
 						<span class="desc">Traverse a place view page that matches a place's color palette!</span>
 						<br />
-						<span style="font-size: 0.8rem; color: orange;">* Place creators must request a game profile for one to be made.</span>
+						<span class="warning">* Place creators must request a game profile for one to be made.</span>
 						<br />
-						<span style="font-size: 0.8rem; color: orange;">* This feature will be expanded upon in the future.</span>
+						<span class="warning">* This feature will be expanded upon in the future.</span>
 					</div>
 					<div class="setting-container" id="inline-editing">
 						<span class="indicator">&nbsp;</span>
@@ -644,9 +678,9 @@
 						<br />
 						<span class="desc">Quickly edit your asset's details such as name and description on the same page as viewing the asset!</span>
 						<br />
-						<span style="font-size: 0.8rem; color: orange;">* This feature currently only supports places.</span>
+						<span class="warning">* This feature currently only supports places.</span>
 						<br />
-						<span style="font-size: 0.8rem; color: orange;">* This feature is not finished or polished.</span>
+						<span class="warning">* This feature is not finished or polished.</span>
 					</div>
 					<div class="setting-container" id="forum-unix-timestamps">
 						<span class="indicator">&nbsp;</span>
@@ -657,7 +691,7 @@
 						<br />
 						<span class="desc">See a date and time that is adjusted to everyone (who is using Poly+)'s local time</span>
 						<br />
-						<span style="font-size: 0.8rem; color: orange;">* The styling for this feature is not yet done.</span>
+						<span class="warning">* The styling for this feature is not yet done.</span>
 					</div>
 					<div class="setting-container" id="avatar-sandbox">
 						<span class="indicator">&nbsp;</span>
@@ -668,7 +702,7 @@
 						<br />
 						<span class="desc">Create an avatar with all the item possibilities available to your heart's content!</span>
 						<br />
-						<span style="font-size: 0.8rem; color: orange;">* This feature is not polished - things like modifying avatar "Body Colors", pagination, outfits, etc haven't been added.</span>
+						<span class="warning">* This feature is not polished - things like modifying avatar "Body Colors", pagination, outfits, etc haven't been added.</span>
 					</div>
 				</div>
 			</div>

settings.js

@@ -464,4 +464,4 @@ chrome.storage.local.get(['PolyPlus_OutOfDate', 'PolyPlus_LiveVersion', 'PolyPlu
 			});
 		});
 	}
-});
+});

the-great-divide.js

@@ -0,0 +1,127 @@
+chrome.storage.sync.get(['PolyPlus_Settings'], function(result) {
+    Settings = result.PolyPlus_Settings || {};
+
+	if (Settings.TheGreatDivide.Enabled !== true) {
+		return
+	}
+
+	let EventOngoing = true
+	let HasTeam = true
+	if (document.querySelector('#user-avatar-card a[href="/event/the-great-divide"]') === null) { HasTeam = false }
+	if (new Date().getMonth().toString()+new Date().getDate().toString() >= 714) { EventOngoing = false }
+
+    if (Settings.TheGreatDivide.UnbalancedIndicatorOn === true && window.location.pathname.split('/')[1] === 'places' && window.location.pathname.split('/')[2] === '9656') {
+        UnbalancedServerMarkers()
+    }
+
+	console.log('ongoing|has team', EventOngoing, HasTeam)
+	if (Settings.TheGreatDivide.UserStatsOn === true && window.location.pathname.split('/')[1] === 'u') {
+		if (HasTeam === true) {
+			UserStatsTab()
+		} else {
+			if (EventOngoing === true) {
+				UserStatsTab()
+			}
+		}
+	}
+})
+
+async function UnbalancedServerMarkers() {
+	const Team = (await (await fetch('https://api.polytoria.com/v1/users/' + JSON.parse(window.localStorage.getItem('p+account_info')).ID + '/greatdivide')).json()).team
+	if (Team !== undefined) {
+		const Servers = Array.from(document.getElementById('servers-tabpane').children)
+
+		Servers.forEach(server => {
+			const TeamCounts = {
+				phantoms: server.getElementsByClassName('border-phantoms').length,
+			 	cobras: server.getElementsByClassName('border-cobras').length
+			}
+
+			let Enemy = "cobras"
+			if (Team === "cobras") { Enemy = "phantoms" }
+
+			if (new URLSearchParams(window.location.search).has('forceServerUnbalance')) {
+				TeamCounts[Enemy] = 1000
+			}
+
+			if (TeamCounts[Team] < TeamCounts[Enemy]) {
+				const UnbalancedText = document.createElement('p')
+				UnbalancedText.classList = 'mb-2'
+				UnbalancedText.style.fontSize = '0.7rem'
+				UnbalancedText.style.color = 'orange'
+				UnbalancedText.innerHTML = `*Potentially Unbalanced <i class="fa-solid fa-circle-info" data-bs-toggle="tooltip" data-bs-title="${TeamCounts.cobras} Cobras and ${TeamCounts.phantoms} Phantoms" data-bs-placement="right"></i>`
+				
+				const ServerInfoColumn = server.getElementsByClassName('col-3')[0]
+				ServerInfoColumn.children[0].style.marginBottom = '0px'
+				ServerInfoColumn.insertBefore(UnbalancedText, ServerInfoColumn.children[1])
+
+				Utilities.InjectResource("registerTooltips")
+			}
+		})
+	}
+}
+
+async function UserStatsTab() {
+	const Tabs = document.getElementById('user-info-tabs')
+
+	const EventTab = document.createElement('li')
+	EventTab.classList = 'nav-item'
+	EventTab.style.marginLeft = 'auto'
+	EventTab.innerHTML = `
+	<a class="nav-link fw-semibold" href="#!" aria-selected="false" tabindex="-1" role="tab" style="background-clip:text;-webkit-background-clip:text;color:transparent;background-image: linear-gradient(90deg, #1ad05b, #68f);-webkit-text-fill-color: transparent;">
+		<img style="width: 25px;height: auto;" src="https://c0.ptacdn.com/static/images/misc/event/dpoint.af12a3d7.png">
+		Great Divide
+	</a>
+	`
+	Tabs.appendChild(EventTab)
+
+	const TabContainer = document.createElement('div')
+	TabContainer.id = 'p+greatdivide_stats'
+	TabContainer.classList = 'tab-pane fade d-none'
+	TabContainer.innerHTML = `
+	<small class="d-block text-center text-muted" style="font-size: 0.8rem;">
+    	loading...
+  	</small>
+  	<lottie-player id="avatar-loading" src="https://c0.ptacdn.com/static/images/lottie/poly-brick-loading.2b51aa85.json" background="transparent" speed="1" style="width: 20%;height: auto;margin: -16px auto 50px;margin-top: 0px;" loop="" autoplay=""></lottie-player>
+	`
+	document.getElementById('user-friends').parentElement.appendChild(TabContainer)
+
+	const ToggleTab = function(tab){
+		Array.from(Tabs.children).forEach((tab) => {
+			tab.children[0].classList.remove('active');
+		});
+		Array.from(document.getElementById('user-friends').parentElement.children).forEach((tab) => {
+			tab.classList.add('d-none');
+			tab.classList.remove('active');
+			tab.classList.remove('show');
+		});
+		tab.children[0].classList.add('active');
+		
+		let SelectedTab
+		if (tab.children[0].getAttribute('data-bs-target')) {
+			SelectedTab = document.getElementById(tab.children[0].getAttribute('data-bs-target').substring(1))
+		} else {
+			SelectedTab = TabContainer
+		}
+		SelectedTab.classList.add('active');
+		SelectedTab.classList.add('show');
+		SelectedTab.classList.remove('d-none');
+	}
+
+	Array.from(Tabs.children).forEach((tab) => {
+		tab.addEventListener('click', function () {
+			ToggleTab(tab)
+		});
+	});
+
+	let Fetched = false
+	EventTab.addEventListener('click', async function(){
+		if (Fetched === false) {
+			chrome.runtime.sendMessage({
+				action: "greatdivide_stats",
+				username: window.location.pathname.split('/')[2]
+			});
+			Fetched = true
+		}
+	})
+}