715 lines
No EOL
28 KiB
HTML
715 lines
No EOL
28 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Inventory Search - Dereth Tracker</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
<style>
|
|
/* Override main app styles to enable scrolling */
|
|
html, body {
|
|
overflow: auto !important;
|
|
height: auto !important;
|
|
display: block !important;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 11px;
|
|
font-family: Arial, sans-serif;
|
|
background: #f0f0f0;
|
|
}
|
|
|
|
/* Inventory-specific styles */
|
|
.inventory-container {
|
|
display: flex;
|
|
gap: 5px;
|
|
padding: 5px;
|
|
}
|
|
|
|
.character-sidebar {
|
|
width: 120px;
|
|
background: white;
|
|
border: 1px solid #999;
|
|
padding: 3px;
|
|
height: fit-content;
|
|
}
|
|
|
|
.character-sidebar h4 {
|
|
margin: 0 0 3px 0;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
color: #000;
|
|
}
|
|
|
|
.character-list {
|
|
max-height: 300px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.character-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 1px;
|
|
font-size: 9px;
|
|
}
|
|
|
|
.character-item input[type="checkbox"] {
|
|
margin: 0 2px 0 0;
|
|
width: 9px;
|
|
height: 9px;
|
|
}
|
|
|
|
.character-item label {
|
|
cursor: pointer;
|
|
color: #000;
|
|
flex: 1;
|
|
}
|
|
|
|
.main-content {
|
|
flex: 1;
|
|
}
|
|
|
|
.inventory-header {
|
|
background: #333;
|
|
color: white;
|
|
padding: 4px 8px;
|
|
margin-bottom: 5px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.inventory-header h1 {
|
|
margin: 0;
|
|
font-size: 14px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.search-form {
|
|
background: white;
|
|
padding: 5px;
|
|
border: 1px solid #ccc;
|
|
}
|
|
|
|
.filter-row {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-bottom: 5px;
|
|
align-items: center;
|
|
}
|
|
|
|
.filter-group {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 3px;
|
|
}
|
|
|
|
.filter-group label {
|
|
font-weight: bold;
|
|
font-size: 10px;
|
|
color: #000;
|
|
}
|
|
|
|
input[type="text"],
|
|
input[type="number"],
|
|
select {
|
|
border: 1px solid #999;
|
|
padding: 1px 3px;
|
|
font-size: 11px;
|
|
height: 18px;
|
|
}
|
|
|
|
input[type="text"] {
|
|
width: 120px;
|
|
}
|
|
|
|
input[type="number"] {
|
|
width: 40px;
|
|
}
|
|
|
|
select {
|
|
width: 100px;
|
|
}
|
|
|
|
.filter-section {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 5px;
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
.section-label {
|
|
font-weight: bold;
|
|
font-size: 10px;
|
|
min-width: 50px;
|
|
padding-top: 2px;
|
|
color: #000;
|
|
}
|
|
|
|
.checkbox-container {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 10px;
|
|
flex: 1;
|
|
}
|
|
|
|
.checkbox-item {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 9px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.checkbox-item input[type="checkbox"] {
|
|
margin: 0 1px 0 0;
|
|
width: 9px;
|
|
height: 9px;
|
|
}
|
|
|
|
.checkbox-item label {
|
|
cursor: pointer;
|
|
color: #000;
|
|
}
|
|
|
|
.search-actions {
|
|
display: flex;
|
|
gap: 5px;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.btn {
|
|
padding: 2px 8px;
|
|
border: 1px solid #999;
|
|
background: #e0e0e0;
|
|
font-size: 10px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.btn-primary {
|
|
background: #4a80c0;
|
|
color: white;
|
|
border-color: #336699;
|
|
}
|
|
|
|
.btn:hover {
|
|
background: #d0d0d0;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background: #336699;
|
|
}
|
|
|
|
.results-container {
|
|
background: white;
|
|
border: 1px solid #999;
|
|
margin-top: 5px;
|
|
max-height: calc(100vh - 150px);
|
|
overflow: auto;
|
|
}
|
|
|
|
.results-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
font-size: 10px;
|
|
color: #000;
|
|
}
|
|
|
|
.results-table th {
|
|
background: #d0d0d0;
|
|
padding: 1px 3px;
|
|
text-align: left;
|
|
font-weight: bold;
|
|
border: 1px solid #999;
|
|
position: sticky;
|
|
top: 0;
|
|
font-size: 9px;
|
|
}
|
|
|
|
.results-table td {
|
|
padding: 1px 3px;
|
|
border: 1px solid #ddd;
|
|
}
|
|
|
|
.results-table tbody tr:hover {
|
|
background-color: #f0f0f0;
|
|
}
|
|
|
|
.item-name {
|
|
color: #0066cc;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.status-equipped {
|
|
color: #008800;
|
|
}
|
|
|
|
.status-inventory {
|
|
color: #5f6368;
|
|
}
|
|
|
|
.loading {
|
|
text-align: center;
|
|
padding: 20px;
|
|
color: #5f6368;
|
|
font-size: 11px;
|
|
}
|
|
|
|
.no-results {
|
|
text-align: center;
|
|
padding: 20px;
|
|
color: #5f6368;
|
|
font-size: 11px;
|
|
}
|
|
|
|
.error {
|
|
text-align: center;
|
|
padding: 10px;
|
|
color: #d93025;
|
|
background: #fef7e0;
|
|
margin: 5px;
|
|
font-size: 11px;
|
|
}
|
|
|
|
.results-info {
|
|
padding: 3px 5px;
|
|
background: #f0f0f0;
|
|
border-bottom: 1px solid #999;
|
|
font-weight: normal;
|
|
color: #333;
|
|
font-size: 10px;
|
|
}
|
|
|
|
.back-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
color: #1a73e8;
|
|
text-decoration: none;
|
|
font-weight: 500;
|
|
margin-bottom: 16px;
|
|
transition: color 0.2s;
|
|
}
|
|
|
|
.back-link:hover {
|
|
color: #1557b0;
|
|
}
|
|
|
|
.back-link::before {
|
|
content: "←";
|
|
margin-right: 8px;
|
|
font-size: 1.2rem;
|
|
}
|
|
|
|
/* Set Analysis specific styles */
|
|
.set-analysis-section {
|
|
background: white;
|
|
border: 1px solid #999;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.set-analysis-form {
|
|
background: #f8f8f8;
|
|
padding: 8px;
|
|
border-bottom: 1px solid #ddd;
|
|
}
|
|
|
|
.set-analysis-form h3 {
|
|
margin: 0 0 8px 0;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
color: #333;
|
|
}
|
|
|
|
.set-analysis-form select {
|
|
width: 140px;
|
|
}
|
|
|
|
.text-right {
|
|
text-align: right;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="inventory-header">
|
|
<h1>Inventory Search</h1>
|
|
<a href="/" style="color: white; text-decoration: none; font-size: 11px;">← Back</a>
|
|
</div>
|
|
|
|
<div class="inventory-container">
|
|
<!-- Character Selection Sidebar -->
|
|
<div class="character-sidebar">
|
|
<h4>Characters</h4>
|
|
<div class="character-item">
|
|
<input type="checkbox" id="char_all" checked>
|
|
<label for="char_all">All Characters</label>
|
|
</div>
|
|
<div class="character-list" id="characterList">
|
|
<!-- Character checkboxes will be populated by JavaScript -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="main-content">
|
|
<form class="search-form" id="inventorySearchForm">
|
|
<!-- Row 0: Equipment Type Selection -->
|
|
<div class="filter-row">
|
|
<div class="filter-group">
|
|
<label>Type:</label>
|
|
<div style="display: flex; gap: 10px;">
|
|
<label style="display: flex; align-items: center; font-weight: normal;">
|
|
<input type="radio" name="equipmentType" id="armorOnly" value="armor" checked style="margin-right: 3px;">
|
|
Armor Only
|
|
</label>
|
|
<label style="display: flex; align-items: center; font-weight: normal;">
|
|
<input type="radio" name="equipmentType" id="jewelryOnly" value="jewelry" style="margin-right: 3px;">
|
|
Jewelry Only
|
|
</label>
|
|
<label style="display: flex; align-items: center; font-weight: normal;">
|
|
<input type="radio" name="equipmentType" id="allItems" value="all" style="margin-right: 3px;">
|
|
All Items
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Row 0.5: Slot Selection -->
|
|
<div class="filter-row">
|
|
<div class="filter-group">
|
|
<label>Slot:</label>
|
|
<select id="slotFilter">
|
|
<option value="">All Slots</option>
|
|
<optgroup label="Armor Slots">
|
|
<option value="Head">Head</option>
|
|
<option value="Chest">Chest</option>
|
|
<option value="Upper Arms">Upper Arms</option>
|
|
<option value="Lower Arms">Lower Arms</option>
|
|
<option value="Hands">Hands</option>
|
|
<option value="Abdomen">Abdomen</option>
|
|
<option value="Upper Legs">Upper Legs</option>
|
|
<option value="Lower Legs">Lower Legs</option>
|
|
<option value="Feet">Feet</option>
|
|
<option value="Shield">Shield</option>
|
|
</optgroup>
|
|
<optgroup label="Jewelry Slots">
|
|
<option value="Neck">Neck</option>
|
|
<option value="Left Ring">Left Ring</option>
|
|
<option value="Right Ring">Right Ring</option>
|
|
<option value="Left Wrist">Left Wrist</option>
|
|
<option value="Right Wrist">Right Wrist</option>
|
|
<option value="Trinket">Trinket</option>
|
|
</optgroup>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Row 1: Basic filters -->
|
|
<div class="filter-row">
|
|
<div class="filter-group">
|
|
<label>Name:</label>
|
|
<input type="text" id="searchText" placeholder="Item name">
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>Status:</label>
|
|
<select id="searchEquipStatus">
|
|
<option value="all">All</option>
|
|
<option value="equipped">Equipped</option>
|
|
<option value="unequipped">Inventory</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Row 2: Stats -->
|
|
<div class="filter-row">
|
|
<div class="filter-group">
|
|
<label>Armor:</label>
|
|
<input type="number" id="searchMinArmor" placeholder="Min">
|
|
<span>-</span>
|
|
<input type="number" id="searchMaxArmor" placeholder="Max">
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>Crit:</label>
|
|
<input type="number" id="searchMinCritDamage" placeholder="Min">
|
|
<span>-</span>
|
|
<input type="number" id="searchMaxCritDamage" placeholder="Max">
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>Dmg:</label>
|
|
<input type="number" id="searchMinDamageRating" placeholder="Min">
|
|
<span>-</span>
|
|
<input type="number" id="searchMaxDamageRating" placeholder="Max">
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>Heal:</label>
|
|
<input type="number" id="searchMinHealBoost" placeholder="Min">
|
|
<span>-</span>
|
|
<input type="number" id="searchMaxHealBoost" placeholder="Max">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Equipment Sets -->
|
|
<div class="filter-section">
|
|
<label class="section-label">Set:</label>
|
|
<div class="checkbox-container" id="equipmentSets">
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_14" value="14">
|
|
<label for="set_14">Adept's</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_16" value="16">
|
|
<label for="set_16">Defender's</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_13" value="13">
|
|
<label for="set_13">Soldier's</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_21" value="21">
|
|
<label for="set_21">Wise</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_40" value="40">
|
|
<label for="set_40">Heroic Protector</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_41" value="41">
|
|
<label for="set_41">Heroic Destroyer</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_46" value="46">
|
|
<label for="set_46">Relic Alduressa</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_47" value="47">
|
|
<label for="set_47">Ancient Relic</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_48" value="48">
|
|
<label for="set_48">Noble Relic</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_15" value="15">
|
|
<label for="set_15">Archer's</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_19" value="19">
|
|
<label for="set_19">Hearty</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_20" value="20">
|
|
<label for="set_20">Dexterous</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_22" value="22">
|
|
<label for="set_22">Swift</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_24" value="24">
|
|
<label for="set_24">Reinforced</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_26" value="26">
|
|
<label for="set_26">Flame Proof</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="set_29" value="29">
|
|
<label for="set_29">Lightning Proof</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Legendary Cantrips -->
|
|
<div class="filter-section">
|
|
<label class="section-label">Cantrips:</label>
|
|
<div class="checkbox-container" id="cantrips">
|
|
<!-- Legendary Attributes -->
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_strength" value="Legendary Strength">
|
|
<label for="cantrip_legendary_strength">Strength</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_endurance" value="Legendary Endurance">
|
|
<label for="cantrip_legendary_endurance">Endurance</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_quickness" value="Legendary Quickness">
|
|
<label for="cantrip_legendary_quickness">Quickness</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_coordination" value="Legendary Coordination">
|
|
<label for="cantrip_legendary_coordination">Coordination</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_willpower" value="Legendary Willpower">
|
|
<label for="cantrip_legendary_willpower">Willpower</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_focus" value="Legendary Focus">
|
|
<label for="cantrip_legendary_focus">Focus</label>
|
|
</div>
|
|
<!-- Legendary Weapon Skills -->
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_finesse" value="Legendary Finesse Weapons">
|
|
<label for="cantrip_legendary_finesse">Finesse</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_heavy" value="Legendary Heavy Weapons">
|
|
<label for="cantrip_legendary_heavy">Heavy</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_light" value="Legendary Light Weapons">
|
|
<label for="cantrip_legendary_light">Light</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_missile" value="Legendary Missile Weapons">
|
|
<label for="cantrip_legendary_missile">Missile</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_twohanded" value="Legendary Two Handed Combat">
|
|
<label for="cantrip_legendary_twohanded">Two-handed</label>
|
|
</div>
|
|
<!-- Legendary Magic Skills -->
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_war" value="Legendary War Magic">
|
|
<label for="cantrip_legendary_war">War Magic</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_void" value="Legendary Void Magic">
|
|
<label for="cantrip_legendary_void">Void Magic</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_creature" value="Legendary Creature Enchantment">
|
|
<label for="cantrip_legendary_creature">Creature</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_item" value="Legendary Item Enchantment">
|
|
<label for="cantrip_legendary_item">Item</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_life" value="Legendary Life Magic">
|
|
<label for="cantrip_legendary_life">Life Magic</label>
|
|
</div>
|
|
<!-- Legendary Defense -->
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_magic_defense" value="Legendary Magic Defense">
|
|
<label for="cantrip_legendary_magic_defense">Magic Def</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="cantrip_legendary_melee_defense" value="Legendary Melee Defense">
|
|
<label for="cantrip_legendary_melee_defense">Melee Def</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Legendary Wards -->
|
|
<div class="filter-section">
|
|
<label class="section-label">Wards:</label>
|
|
<div class="checkbox-container" id="protections">
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_flame" value="Legendary Flame Ward">
|
|
<label for="protection_flame">Flame</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_frost" value="Legendary Frost Ward">
|
|
<label for="protection_frost">Frost</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_acid" value="Legendary Acid Ward">
|
|
<label for="protection_acid">Acid</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_storm" value="Legendary Storm Ward">
|
|
<label for="protection_storm">Storm</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_slashing" value="Legendary Slashing Ward">
|
|
<label for="protection_slashing">Slashing</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_piercing" value="Legendary Piercing Ward">
|
|
<label for="protection_piercing">Piercing</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_bludgeoning" value="Legendary Bludgeoning Ward">
|
|
<label for="protection_bludgeoning">Bludgeoning</label>
|
|
</div>
|
|
<div class="checkbox-item">
|
|
<input type="checkbox" id="protection_armor" value="Legendary Armor">
|
|
<label for="protection_armor">Armor</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="search-actions">
|
|
<button type="button" class="btn btn-secondary" id="clearBtn">Clear All</button>
|
|
<button type="submit" class="btn btn-primary">Search Items</button>
|
|
<button type="button" class="btn btn-secondary" id="setAnalysisBtn">Analyze Sets</button>
|
|
<button type="button" class="btn btn-secondary" id="slotViewBtn">Slot View</button>
|
|
</div>
|
|
</form>
|
|
|
|
<!-- Set Analysis Section -->
|
|
<div class="set-analysis-section" id="setAnalysisSection" style="display: none;">
|
|
<div class="set-analysis-form">
|
|
<h3>Equipment Set Combination Analysis</h3>
|
|
<div class="filter-row">
|
|
<div class="filter-group">
|
|
<label>Primary Set (5 pieces):</label>
|
|
<select id="primarySetSelect">
|
|
<option value="14">Adept's Set</option>
|
|
<option value="16">Defender's Set</option>
|
|
<option value="13">Soldier's Set</option>
|
|
<option value="21">Wise Set</option>
|
|
<option value="40">Heroic Protector</option>
|
|
<option value="41">Heroic Destroyer</option>
|
|
<option value="46">Relic Alduressa</option>
|
|
<option value="47">Ancient Relic</option>
|
|
<option value="48">Noble Relic</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<label>Secondary Set (4 pieces):</label>
|
|
<select id="secondarySetSelect">
|
|
<option value="13">Soldier's Set</option>
|
|
<option value="14">Adept's Set</option>
|
|
<option value="16">Defender's Set</option>
|
|
<option value="21">Wise Set</option>
|
|
<option value="40">Heroic Protector</option>
|
|
<option value="41">Heroic Destroyer</option>
|
|
<option value="46">Relic Alduressa</option>
|
|
<option value="47">Ancient Relic</option>
|
|
<option value="48">Noble Relic</option>
|
|
</select>
|
|
</div>
|
|
<div class="filter-group">
|
|
<button type="button" class="btn btn-primary" id="runSetAnalysis">Analyze</button>
|
|
<button type="button" class="btn btn-secondary" id="backToSearch">Back to Search</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="results-container" id="setAnalysisResults">
|
|
<div class="no-results">Select primary and secondary sets above and click "Analyze" to find valid combinations.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slot View Section -->
|
|
<div class="slot-view-section" id="slotViewSection" style="display: none;">
|
|
<div class="slot-view-header">
|
|
<h3>Equipment Slot View</h3>
|
|
<div class="filter-row">
|
|
<button type="button" class="btn btn-primary" id="loadSlotView">Load Items</button>
|
|
<button type="button" class="btn btn-secondary" id="backToSearchFromSlots">Back to Search</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="slots-grid" id="slotsGrid">
|
|
<!-- Slots will be populated by JavaScript -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="results-container" id="searchResults">
|
|
<div class="no-results">Enter search criteria above and click "Search Items" to find inventory items.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="inventory.js"></script>
|
|
</body>
|
|
</html> |