Files
Vectry 6df2002d31 Initial release: PokeRogue Type Effectiveness extension
Chrome/Firefox MV3 extension that shows move type effectiveness during
PokeRogue battles. Features:

- Auto-detects battle state via Phaser game bridge (MAIN world)
- Shows effectiveness multiplier, base power, and physical/special category
- Supports single and double battles
- Manual type calculator mode as fallback
- Draggable overlay with dark theme matching PokeRogue aesthetic
- Settings popup with position, opacity, and display options
- Complete Gen 6+ type chart (18 types) from PokeRogue source data
- Type colors matching PokeRogue's own color scheme
2026-02-12 18:03:09 +00:00

87 lines
2.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PokeRogue Type Effectiveness</title>
<link rel="stylesheet" href="popup.css">
</head>
<body>
<div class="popup">
<div class="popup-header">
<img src="../icons/icon-32.png" alt="icon" class="popup-icon">
<div>
<h1 class="popup-title">Type Effectiveness</h1>
<p class="popup-subtitle" id="statusText">Connecting...</p>
</div>
</div>
<div class="popup-section">
<label class="popup-toggle">
<input type="checkbox" id="enableToggle" checked>
<span class="toggle-slider"></span>
<span class="toggle-label">Enable Overlay</span>
</label>
</div>
<div class="popup-section">
<label class="popup-toggle">
<input type="checkbox" id="manualMode">
<span class="toggle-slider"></span>
<span class="toggle-label">Manual Mode</span>
</label>
<p class="popup-hint">Use type calculator instead of auto-detection</p>
</div>
<div class="popup-divider"></div>
<div class="popup-section">
<label class="popup-label">Position</label>
<div class="popup-position-grid">
<button class="pos-btn" data-pos="top-left" title="Top Left">&#x2196;</button>
<button class="pos-btn" data-pos="top-right" title="Top Right">&#x2197;</button>
<button class="pos-btn" data-pos="bottom-left" title="Bottom Left">&#x2199;</button>
<button class="pos-btn" data-pos="bottom-right" title="Bottom Right">&#x2198;</button>
</div>
</div>
<div class="popup-section">
<label class="popup-label">
Opacity
<span id="opacityValue">90%</span>
</label>
<input type="range" id="opacitySlider" min="30" max="100" value="90" class="popup-slider">
</div>
<div class="popup-divider"></div>
<div class="popup-section">
<label class="popup-label">Display Options</label>
<label class="popup-checkbox">
<input type="checkbox" id="showMoveNames" checked>
<span>Show move names</span>
</label>
<label class="popup-checkbox">
<input type="checkbox" id="showPower" checked>
<span>Show base power</span>
</label>
<label class="popup-checkbox">
<input type="checkbox" id="showCategory" checked>
<span>Show physical/special</span>
</label>
<label class="popup-checkbox">
<input type="checkbox" id="compactMode">
<span>Compact mode</span>
</label>
</div>
<div class="popup-footer">
<button id="refreshBtn" class="popup-btn">Refresh</button>
<span class="popup-version">v1.0.0</span>
</div>
</div>
<script src="popup.js"></script>
</body>
</html>