From 90dab88d0eb4a479b3b541704c2e2ebad341820f Mon Sep 17 00:00:00 2001
From: Index <xv.media.address@gmail.com>
Date: Sun, 14 Jul 2024 16:36:34 -0500
Subject: [PATCH] feat: add "time played" feature to debug page

---
 js/extra-pages.js | 22 ++++++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/js/extra-pages.js b/js/extra-pages.js
index 298bd63..dc63b46 100644
--- a/js/extra-pages.js
+++ b/js/extra-pages.js
@@ -242,7 +242,7 @@ if (window.location.pathname.split('/')[3] === 'polyplus' && window.location.has
 	});
 } else if (window.location.pathname.split('/')[3] === 'polyplus' && window.location.hash === '#debug') {
 	document.addEventListener('DOMContentLoaded', function () {
-		chrome.storage.sync.get(['PolyPlus_Settings', 'PolyPlus_PinnedGames', 'PolyPlus_BestFriends', 'PolyPlus_ItemWishlist', 'PolyPlus_AvatarSandboxOutfits'], function(sync) {
+		chrome.storage.sync.get(['PolyPlus_Settings', 'PolyPlus_PinnedGames', 'PolyPlus_BestFriends', 'PolyPlus_ItemWishlist', 'PolyPlus_AvatarSandboxOutfits', 'PolyPlus_TimePlayed'], function(sync) {
 			chrome.storage.local.get(['PolyPlus_InventoryCache'], function(local){
 				document.querySelector('#main-content .container').innerHTML = `
 				<style>
@@ -344,7 +344,7 @@ if (window.location.pathname.split('/')[3] === 'polyplus' && window.location.has
 								<div class="card-header">
 									<span class="badge bg-primary" style="margin-right: 5px; vertical-align: text-bottom;">Sync</span>
 									Avatar Sandbox Outfits
-									<small class="text-muted" style="font-size: 0.7rem;">(${(sync.PolyPlus_AvatarSandboxOutfits|| []).length})</small>
+									<small class="text-muted" style="font-size: 0.7rem;">(${(sync.PolyPlus_AvatarSandboxOutfits || []).length})</small>
 								</div>
 							</a>
 							<div class="card-body collapse" id="avatar-sandbox-outfits">
@@ -357,6 +357,24 @@ if (window.location.pathname.split('/')[3] === 'polyplus' && window.location.has
 								</div>
 							</div>
 						</div>
+						<div class="card mb-3">
+							<a class="text-reset" data-bs-toggle="collapse" href="#time-played" role="button" aria-expanded="false" aria-controls="item-wishlist">
+								<div class="card-header">
+									<span class="badge bg-primary" style="margin-right: 5px; vertical-align: text-bottom;">Sync</span>
+									Time Played
+									<small class="text-muted" style="font-size: 0.7rem;">(${(Object.keys(sync.PolyPlus_TimePlayed) || []).length} places tracked)</small>
+								</div>
+							</a>
+							<div class="card-body collapse" id="time-played">
+								<div style="padding: 10px; background: #171717; font-family: monospace; color: orange; font-size: 0.8rem; border-radius: 10px; position: relative;">
+									${JSON.stringify((sync.PolyPlus_TimePlayed || []), null, 2)
+										.replaceAll('\n','<br>')
+										.replaceAll(' ', '&nbsp;')
+										.replaceAll('\t', '&nbsp;&nbsp;&nbsp;&nbsp;')}
+									<button class="btn btn-warning btn-sm" style="position: absolute; top: 0; right: 0; margin: 10px;" onclick="navigator.clipboard.writeText('${JSON.stringify((sync.PolyPlus_AvatarSandboxOutfits || []))}') .then(() => {alert('copied')}) .catch(() => {});">copy</button>
+								</div>
+							</div>
+						</div>
 						<div class="card">
 							<a class="text-reset" data-bs-toggle="collapse" href="#inventory-cache" role="button" aria-expanded="false" aria-controls="inventory-cache">
 								<div class="card-header">