ArchipelagoMW · black-sliver · Feb 19, 2023 · Jan 11, 2023 · Jan 12, 2023 · Jan 12, 2023
diff --git a/WebHostLib/static/styles/timespinnerTracker.css b/WebHostLib/static/styles/timespinnerTracker.css
@@ -1,36 +1,130 @@
-#player-tracker-wrapper{
+#player-tracker-wrapper {
     margin: 0;
 }
 
-#inventory-table{
+#inventory-table {
     border-top: 2px solid #000000;
     border-left: 2px solid #000000;
     border-right: 2px solid #000000;
     border-top-left-radius: 4px;
     border-top-right-radius: 4px;
     padding: 3px 3px 10px;
-    width: 384px;
+    width: 374px;
     background-color: #8d60a7;
+
+    display: grid;
+    grid-template-rows: repeat(5, 48px);
 }
 
-#inventory-table td{
-    width: 40px;
-    height: 40px;
-    text-align: center;
-    vertical-align: middle;
+#inventory-table img {
+    display: block;
 }
 
-#inventory-table img{
-    height: 100%;
+#inventory-table div.table-row {
+    display: grid;
+    grid-template-columns: repeat(5, 1fr);
+}
+
+#inventory-table div.C1 {
+    grid-column: 1;
+    place-content: center;
+    place-items: center;
+    display: flex;
+}
+#inventory-table div.C2 {
+    grid-column: 2;
+    place-content: center;
+    place-items: center;
+    display: flex;
+}
+#inventory-table div.C3 {
+    grid-column: 3;
+    place-content: center;
+    place-items: center;
+    display: flex;
+}
+#inventory-table div.C4 {
+    grid-column: 4;
+    place-content: center;
+    place-items: center;
+    display: flex;
+}
+#inventory-table div.C5 {
+    grid-column: 5;
+    place-content: center;
+    place-items: center;
+    display: flex;
+}
+
+#inventory-table img {
     max-width: 40px;
     max-height: 40px;
     filter: grayscale(100%) contrast(75%) brightness(30%);
 }
 
-#inventory-table img.acquired{
+#inventory-table img.acquired {
     filter: none;
 }
 
+#inventory-table img.acquired.purple { /*00FFFF*/
+    filter: hue-rotate(270deg) saturate(6) brightness(0.8);
+}
+#inventory-table img.acquired.cyan { /*FF00FF*/
+    filter: hue-rotate(138deg) saturate(10) brightness(0.8);
+}
+#inventory-table img.acquired.green { /*32CD32*/
+    filter: hue-rotate(84deg) saturate(10) brightness(0.7);
+}
+
+#inventory-table div.image-stack {
+    display: grid;
+    position: relative;
+    grid-template-columns: 1fr;
+    grid-template-rows: 1fr;
+}
+
+#inventory-table div.image-stack div.stack-back {
+    grid-column: 1;
+    grid-row: 1;
+}
+
+#inventory-table div.image-stack div.stack-front {
+    grid-column: 1;
+    grid-row: 1;
+    display: grid;
+    grid-template-columns: 20px 20px;
+    grid-template-rows: 20px 20px;
+}
+
+#inventory-table div.image-stack div.stack-top-left {
+    grid-column: 1;
+    grid-row: 1;
+    z-index: 1;
+}
+
+#inventory-table div.image-stack div.stack-top-right {
+    grid-column: 2;
+    grid-row: 1;
+    z-index: 1;
+}
+
+#inventory-table div.image-stack div.stack-bottum-left {
+    grid-column: 1;
+    grid-row: 2;
+    z-index: 1;
+}
+
+#inventory-table div.image-stack div.stack-bottum-right {
+    grid-column: 2;
+    grid-row: 2;
+    z-index: 1;
+}
+
+#inventory-table div.image-stack div.stack-front img {
+    width: 20px;
+    height: 20px;
+}
+
 #inventory-table div.counted-item {
     position: relative;
 }
@@ -44,7 +138,7 @@
     right: 0;
 }
 
-#location-table{
+#location-table {
     width: 384px;
     border-left: 2px solid #000000;
     border-right: 2px solid #000000;
@@ -57,13 +151,13 @@
     cursor: default;
 }
 
-#location-table th{
+#location-table th {
     vertical-align: middle;
     text-align: left;
     padding-right: 10px;
 }
 
-#location-table td{
+#location-table td {
     padding-top: 2px;
     padding-bottom: 2px;
     line-height: 20px;
@@ -82,7 +176,7 @@
     font-weight: bold;
 }
 
-#location-table img{
+#location-table img {
     height: 100%;
     max-width: 30px;
     max-height: 30px;

diff --git a/WebHostLib/templates/timespinnerTracker.html b/WebHostLib/templates/timespinnerTracker.html
@@ -8,79 +8,94 @@
 
 <body>
     <div id="player-tracker-wrapper" data-tracker="{{ room.tracker|suuid }}">
-        <table id="inventory-table">
-            <tr>
-                <td><img src="{{ icons['Timespinner Wheel'] }}" class="{{ 'acquired' if 'Timespinner Wheel' in acquired_items }}" title="Timespinner Wheel" /></td>
-                <td><img src="{{ icons['Timespinner Spindle'] }}" class="{{ 'acquired' if 'Timespinner Spindle' in acquired_items }}" title="Timespinner Spindle" /></td>
-                <td><img src="{{ icons['Timespinner Gear 1'] }}" class="{{ 'acquired' if 'Timespinner Gear 1' in acquired_items }}" title="Timespinner Gear 1" /></td>
-                <td><img src="{{ icons['Timespinner Gear 2'] }}" class="{{ 'acquired' if 'Timespinner Gear 2' in acquired_items }}" title="Timespinner Gear 2" /></td>
-                <td><img src="{{ icons['Timespinner Gear 3'] }}" class="{{ 'acquired' if 'Timespinner Gear 3' in acquired_items }}" title="Timespinner Gear 3" /></td>
-            </tr>
-            <tr>
-                <td><img src="{{ icons['Talaria Attachment'] }}" class="{{ 'acquired' if 'Talaria Attachment' in acquired_items or 'QuickSeed' in options }}" title="Talaria Attachment" /></td>
-                <td><img src="{{ icons['Succubus Hairpin'] }}" class="{{ 'acquired' if 'Succubus Hairpin' in acquired_items }}" title="Succubus Hairpin" /></td>
-                <td><img src="{{ icons['Lightwall'] }}" class="{{ 'acquired' if 'Lightwall' in acquired_items }}" title="Lightwall" /></td>
-                <td><img src="{{ icons['Celestial Sash'] }}" class="{{ 'acquired' if 'Celestial Sash' in acquired_items }}" title="Celestial Sash" /></td>
-                <td><img src="{{ icons['Twin Pyramid Key'] }}" class="{{ 'acquired' if 'Twin Pyramid Key' in acquired_items }}" title="Twin Pyramid Key" /></td>
-            </tr>
-            <tr>
-                <td><img src="{{ icons['Security Keycard A'] }}" class="{{ 'acquired' if 'Security Keycard A' in acquired_items }}" title="Security Keycard A" /></td>
-                <td><img src="{{ icons['Security Keycard B'] }}" class="{{ 'acquired' if 'Security Keycard B' in acquired_items }}" title="Security Keycard B" /></td>
-                <td><img src="{{ icons['Security Keycard C'] }}" class="{{ 'acquired' if 'Security Keycard C' in acquired_items }}" title="Security Keycard C" /></td>
-                <td><img src="{{ icons['Security Keycard D'] }}" class="{{ 'acquired' if 'Security Keycard D' in acquired_items }}" title="Security Keycard D" /></td>
-                {% if 'DownloadableItems' in options %}
-                    <td><img src="{{ icons['Library Keycard V'] }}" class="{{ 'acquired' if 'Library Keycard V' in acquired_items }}" title="Library Keycard V" /></td>
-                {% else %}
-                    <td></td>
-                {% endif %}   
-            </tr>
-            <tr>
-                {% if 'DownloadableItems' in options %}
-                    <td><img src="{{ icons['Tablet'] }}" class="{{ 'acquired' if 'Tablet' in acquired_items }}" title="Tablet" /></td>
-                {% else %}
-                    <td></td>
-                {% endif %}    
-                <td><img src="{{ icons['Elevator Keycard'] }}" class="{{ 'acquired' if 'Elevator Keycard' in acquired_items }}" title="Elevator Keycard" /></td>
-                {% if 'EyeSpy' in options %}
-                    <td><img src="{{ icons['Oculus Ring'] }}" class="{{ 'acquired' if 'Oculus Ring' in acquired_items }}" title="Oculus Ring" /></td>
-                {% else %}
-                    <td></td>
-                {% endif %}   
-                <td><img src="{{ icons['Water Mask'] }}" class="{{ 'acquired' if 'Water Mask' in acquired_items }}" title="Water Mask" /></td>
-                <td><img src="{{ icons['Gas Mask'] }}" class="{{ 'acquired' if 'Gas Mask' in acquired_items }}" title="Gas Mask" /></td>
-            </tr>
-            <tr>
-                {% if 'GyreArchives' in options %}
-                    <td><img src="{{ icons['Kobo'] }}" class="{{ 'acquired' if 'Kobo' in acquired_items }}" title="Kobo" /></td>
-                    <td><img src="{{ icons['Merchant Crow'] }}" class="{{ 'acquired' if 'Merchant Crow' in acquired_items }}" title="Merchant Crow" /></td>
-                {% else %}
-                    <td></td>
-                    <td></td>
-                {% endif %}
-
+        <div id="inventory-table">
+            <div class="table-row">
+                <div class="C1"><img src="{{ icons['Timespinner Wheel'] }}" class="{{ 'acquired' if 'Timespinner Wheel' in acquired_items }}" title="Timespinner Wheel" /></div>
+                <div class="C2"><img src="{{ icons['Timespinner Spindle'] }}" class="{{ 'acquired' if 'Timespinner Spindle' in acquired_items }}" title="Timespinner Spindle" /></div>
+                <div class="C3"><img src="{{ icons['Timespinner Gear 1'] }}" class="{{ 'acquired' if 'Timespinner Gear 1' in acquired_items }}" title="Timespinner Gear 1" /></div>
+                <div class="C4"><img src="{{ icons['Timespinner Gear 2'] }}" class="{{ 'acquired' if 'Timespinner Gear 2' in acquired_items }}" title="Timespinner Gear 2" /></div>
+                <div class="C5"><img src="{{ icons['Timespinner Gear 3'] }}" class="{{ 'acquired' if 'Timespinner Gear 3' in acquired_items }}" title="Timespinner Gear 3" /></div>
+            </div>
+            <div class="table-row">
+                <div class="C1"><img src="{{ icons['Talaria Attachment'] }}" class="{{ 'acquired' if 'Talaria Attachment' in acquired_items or 'QuickSeed' in options }}" title="Talaria Attachment" /></div>
+                <div class="C2"><img src="{{ icons['Succubus Hairpin'] }}" class="{{ 'acquired' if 'Succubus Hairpin' in acquired_items }}" title="Succubus Hairpin" /></div>
+                <div class="C3"><img src="{{ icons['Lightwall'] }}" class="{{ 'acquired' if 'Lightwall' in acquired_items }}" title="Lightwall" /></div>
+                <div class="C4"><img src="{{ icons['Celestial Sash'] }}" class="{{ 'acquired' if 'Celestial Sash' in acquired_items }}" title="Celestial Sash" /></div>
+                <div class="C5">
+                    <div class="image-stack">
+                        <div class="stack-back">
+                            <img src="{{ icons['Twin Pyramid Key'] }}" class="{{ 'acquired' if 'Twin Pyramid Key' in acquired_items or 'UnchainedKeys' in options }}" title="Twin Pyramid Key" />
+                        </div>
+                        <div class="stack-front">
+                    {% if 'UnchainedKeys' in options %}
+                        {% if 'EnterSandman' in options %}
+                            <div class="stack-top-right">
+                                <img src="{{ icons['Twin Pyramid Key'] }}" class="green {{ 'acquired' if 'Mysterious Warp Beacon' in acquired_items }}" title="Mysterious Warp Beacon" />
+                            </div>
+                        {% endif %}
+                            <div class="stack-bottum-left">
+                                <img src="{{ icons['Twin Pyramid Key'] }}" class="cyan {{ 'acquired' if 'Timeworn Warp Beacon' in acquired_items }}" title="Timeworn Warp Beacon" />
+                            </div>
+                            <div class="stack-bottum-right">
+                                <img src="{{ icons['Twin Pyramid Key'] }}" class="purple {{ 'acquired' if 'Modern Warp Beacon' in acquired_items }}" title="Modern Warp Beacon" />
+                            </div>
+                    {% endif %}
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="table-row">
+                <div class="C1"><img src="{{ icons['Security Keycard A'] }}" class="{{ 'acquired' if 'Security Keycard A' in acquired_items }}" title="Security Keycard A" /></div>
+                <div class="C2"><img src="{{ icons['Security Keycard B'] }}" class="{{ 'acquired' if 'Security Keycard B' in acquired_items }}" title="Security Keycard B" /></div>
+                <div class="C3"><img src="{{ icons['Security Keycard C'] }}" class="{{ 'acquired' if 'Security Keycard C' in acquired_items }}" title="Security Keycard C" /></div>
+                <div class="C4"><img src="{{ icons['Security Keycard D'] }}" class="{{ 'acquired' if 'Security Keycard D' in acquired_items }}" title="Security Keycard D" /></div>
+            {% if 'DownloadableItems' in options %}
+                <div class="C5"><img src="{{ icons['Library Keycard V'] }}" class="{{ 'acquired' if 'Library Keycard V' in acquired_items }}" title="Library Keycard V" /></div>
+            {% endif %}   
+            </div>
+            <div class="table-row">
+            {% if 'DownloadableItems' in options %}
+                <div class="C1"><img src="{{ icons['Tablet'] }}" class="{{ 'acquired' if 'Tablet' in acquired_items }}" title="Tablet" /></div>
+            {% endif %}    
+                <div class="C2"><img src="{{ icons['Elevator Keycard'] }}" class="{{ 'acquired' if 'Elevator Keycard' in acquired_items }}" title="Elevator Keycard" /></div>
+            {% if 'EyeSpy' in options %}
+                <div class="C3"><img src="{{ icons['Oculus Ring'] }}" class="{{ 'acquired' if 'Oculus Ring' in acquired_items }}" title="Oculus Ring" /></div>
+            {% endif %}   
+                <div class="C4"><img src="{{ icons['Water Mask'] }}" class="{{ 'acquired' if 'Water Mask' in acquired_items }}" title="Water Mask" /></div>
+                <div class="C5"><img src="{{ icons['Gas Mask'] }}" class="{{ 'acquired' if 'Gas Mask' in acquired_items }}" title="Gas Mask" /></div>
+            </div>
+            <div class="table-row">
+            {% if 'GyreArchives' in options %}
+                <div class="C1"><img src="{{ icons['Kobo'] }}" class="{{ 'acquired' if 'Kobo' in acquired_items }}" title="Kobo" /></div>
+                <div class="C2"><img src="{{ icons['Merchant Crow'] }}" class="{{ 'acquired' if 'Merchant Crow' in acquired_items }}" title="Merchant Crow" /></div>
+            {% endif %}
+                <div class="C3">
                 {% if 'Djinn Inferno' in acquired_items %}
-                    <td><img src="{{ icons['Djinn Inferno'] }}" class="acquired" title="Djinn Inferno" /></td>
+                    <img src="{{ icons['Djinn Inferno'] }}" class="acquired" title="Djinn Inferno" />
                 {% elif 'Pyro Ring' in acquired_items %}
-                    <td><img src="{{ icons['Pyro Ring'] }}" class="acquired" title="Pyro Ring" /></td>
+                    <img src="{{ icons['Pyro Ring'] }}" class="acquired" title="Pyro Ring" />
                 {% elif 'Fire Orb' in acquired_items %}
-                    <td><img src="{{ icons['Fire Orb'] }}" class="acquired" title="Fire Orb" /></td>
+                    <img src="{{ icons['Fire Orb'] }}" class="acquired" title="Fire Orb" />
                 {% elif 'Infernal Flames' in acquired_items %}
-                    <td><img src="{{ icons['Infernal Flames'] }}" class="acquired" title="Infernal Flames" /></td>
+                    <img src="{{ icons['Infernal Flames'] }}" class="acquired" title="Infernal Flames" />
                 {% else %}
-                    <td><img src="{{ icons['Djinn Inferno'] }}" title="Djinn Inferno" /></td>
+                    <img src="{{ icons['Djinn Inferno'] }}" title="Djinn Inferno" />
                 {% endif %}
-
+                </div>
+                <div class="C4">
                 {% if 'Royal Ring' in acquired_items %}
-                    <td><img src="{{ icons['Royal Ring'] }}" class="acquired" title="Royal Ring" /></td>
+                    <img src="{{ icons['Royal Ring'] }}" class="acquired" title="Royal Ring" />
                 {% elif 'Plasma Geyser' in acquired_items %}
-                    <td><img src="{{ icons['Plasma Geyser'] }}" class="acquired" title="Plasma Geyser" /></td>
+                    <img src="{{ icons['Plasma Geyser'] }}" class="acquired" title="Plasma Geyser" />
                 {% elif 'Plasma Orb' in acquired_items %}
-                    <td><img src="{{ icons['Plasma Orb'] }}" class="acquired" title="Plasma Orb" /></td>
+                    <img src="{{ icons['Plasma Orb'] }}" class="acquired" title="Plasma Orb" />
                 {% else %}
-                    <td><img src="{{ icons['Royal Ring'] }}" title="Royal Ring" /></td>
+                    <img src="{{ icons['Royal Ring'] }}" title="Royal Ring" />
                 {% endif %}
-            </tr>
-        </table>
+                </div>
+            </div>
+        </div>
+
         <table id="location-table">
             {% for area in checks_done %}
             <tr class="location-category" id="{{area}}-header">

diff --git a/setup.py b/setup.py
@@ -45,6 +45,7 @@
     "Rogue Legacy",
     "Donkey Kong Country 3",
     "Super Mario World",
+    "Timespinner"
 }
 
 if os.path.exists("X:/pw.txt"):

diff --git a/worlds/timespinner/Items.py b/worlds/timespinner/Items.py
@@ -6,6 +6,7 @@ class ItemData(NamedTuple):
     count: int = 1
     progression: bool = False
     useful: bool = False
+    trap: bool = False
 
 # A lot of items arent normally dropped by the randomizer as they are mostly enemy drops, but they can be enabled if desired
 item_table: Dict[str, ItemData] = {
@@ -190,7 +191,15 @@ class ItemData(NamedTuple):
     'Hope Ring': ItemData('Orb Passive', 1337178),
     'Max HP': ItemData('Stat', 1337179, 12),
     'Max Aura': ItemData('Stat', 1337180, 13),
-    # 1337181 - 1337248 Reserved
+    'Timeworn Warp Beacon': ItemData('Relic', 1337181, progression=True),
+    'Modern Warp Beacon': ItemData('Relic', 1337182, progression=True),
+    'Mysterious Warp Beacon': ItemData('Relic', 1337183, progression=True),
+    'Meteor Sparrow Trap': ItemData('Trap', 1337184, 0, trap=True),
+    'Poison Trap': ItemData('Trap', 1337185, 0, trap=True),
+    'Chaos Trap': ItemData('Trap', 1337186, 0, trap=True),
+    'Neurotoxin Trap': ItemData('Trap', 1337187, 0, trap=True),
+    'Bee Trap': ItemData('Trap', 1337188, 0, trap=True),
+    # 1337189 - 1337248 Reserved
     'Max Sand': ItemData('Stat', 1337249, 14)
 }
 
@@ -230,19 +239,6 @@ class ItemData(NamedTuple):
     'Corruption'
 )
 
-# weighted
-starter_progression_items: Tuple[str, ...] = (
-    'Talaria Attachment',
-    'Talaria Attachment',
-    'Succubus Hairpin',
-    'Succubus Hairpin',
-    'Timespinner Wheel',
-    'Timespinner Wheel',
-    'Twin Pyramid Key',
-    'Celestial Sash',
-    'Lightwall'
-)
-
 filler_items: Tuple[str, ...] = (
     'Potion',
     'Ether',