264 lines
12 KiB
HTML
264 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||
<title>Clicker Game - PonyWave Tools</title>
|
||
<meta property="og:title" content="Clicker Game | PonyWave Tools">
|
||
<meta property="og:description" content="Ein einfaches Clicker-Spiel mit Upgrades und Achievements">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:url" content="https://tools.ponywave.de/clicker">
|
||
<meta property="og:image" content="https://tools.ponywave.de/clicker/icon.png">
|
||
<link rel="icon" href="icon.png">
|
||
|
||
<!-- Umami Tracking -->
|
||
<script defer src="https://stats.ponywave.de/script" data-website-id="9ef713d2-adb9-4906-9df5-708d8a8b9131" data-tag="clicker"></script>
|
||
|
||
<link rel="stylesheet" href="style.css">
|
||
</head>
|
||
<body>
|
||
<h1>🎮 Clicker Game</h1>
|
||
|
||
<nav>
|
||
<button class="tab active" onclick="switchTab('game')">Spiel</button>
|
||
<button class="tab" onclick="switchTab('stats')">Statistiken</button>
|
||
<button class="tab" onclick="switchTab('upgrades')">Upgrades</button>
|
||
<button class="tab" onclick="switchTab('achievements')">Achievements</button>
|
||
<button class="tab" onclick="switchTab('settings')">Einstellungen</button>
|
||
</nav>
|
||
|
||
<!-- Game Tab -->
|
||
<div class="tab-content active" id="game">
|
||
<div id="score-container">
|
||
<div id="score">0</div>
|
||
</div>
|
||
<button class="button" onclick="clickScore()" id="clickButton">KLICKEN</button>
|
||
|
||
<div class="card" onclick="buyClickPower()" id="clickPowerCard">
|
||
<strong>Klick-Power erhöhen (+<span id="clickPowerValue">1</span>)</strong><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="clickPowerCost">10</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="clickPowerProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyIdle()" id="idleCard">
|
||
<strong>Idle-Power erhöhen (+<span id="idleValue">1</span>/s)</strong><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="idleCost">20</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="idleProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyAutoClicker()" id="autoClickerCard">
|
||
<strong>Auto-Klicker (<span id="autoClickerCount">0</span>)</strong><br>
|
||
<span style="color: var(--label-color)" id="autoClickerDesc">Klickt automatisch alle 5s</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="autoClickerCost">100</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="autoClickerProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<button class="button prestige" id="prestigeBtn" onclick="prestige()" style="display:none;">
|
||
Prestige (Zurücksetzen für +<span id="prestigeBonus">1</span>x Multiplikator)
|
||
</button>
|
||
</div>
|
||
|
||
<div class="tab-content" id="stats">
|
||
<div class="card">
|
||
<div class="stats-line"><strong>Gesamte Klicks:</strong> <span id="totalClicks">0</span></div>
|
||
<div class="stats-line"><strong>Klick-Power:</strong> <span id="clickPowerStat">1</span></div>
|
||
<div class="stats-line"><strong>Idle-Power:</strong> <span id="idleStat">0/s</span></div>
|
||
<div class="stats-line"><strong>Auto-Klicker:</strong> <span id="autoClickerStat">0 (0/s)</span></div>
|
||
<div class="stats-line"><strong>Prestige Level:</strong> <span id="prestigeLevel">0</span></div>
|
||
<div class="stats-line"><strong>Prestige Bonus:</strong> <span id="prestigeBonusStat">1x</span></div>
|
||
<div class="stats-line"><strong>Spielzeit:</strong> <span id="timePlayed">0s</span></div>
|
||
<div class="stats-line"><strong>Gesamtpunktzahl:</strong> <span id="totalScore">0</span></div>
|
||
<div class="stats-line"><strong>Punkterate:</strong> <span id="scoreRate">0/s</span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-content" id="upgrades">
|
||
<div class="card" onclick="buyDoubleClick()" id="doubleClickCard">
|
||
<strong>Doppelte Klick-Power</strong><br>
|
||
<span style="color: var(--label-color)">Verdoppelt deine Klick-Power</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="doubleClickCost">500</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="doubleClickProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyIdleMultiplier()" id="idleMultiplierCard">
|
||
<strong>Idle-Multiplikator</strong><br>
|
||
<span style="color: var(--label-color)">Macht Idle-Generierung 2x effektiver</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="idleMultiplierCost">1000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="idleMultiplierProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyClickMultiplier()" id="clickMultiplierCard">
|
||
<strong>Klick-Multiplikator</strong><br>
|
||
<span style="color: var(--label-color)">Macht alle Klicks 1,5x effektiver</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="clickMultiplierCost">2000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="clickMultiplierProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyFastAutoClicker()" id="fastAutoClickerCard">
|
||
<strong>Schnelle Auto-Clicker</strong><br>
|
||
<span style="color: var(--label-color)">Auto-Clicker klicken alle 3s statt 5s</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="fastAutoClickerCost">5000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="fastAutoClickerProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyAutoClickerBoost()" id="autoClickerBoostCard">
|
||
<strong>Auto-Clicker Boost</strong><br>
|
||
<span style="color: var(--label-color)">Auto-Clicker sind 2x stärker</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="autoClickerBoostCost">10000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="autoClickerBoostProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyMegaClick()" id="megaClickCard">
|
||
<strong>Mega-Klick</strong><br>
|
||
<span style="color: var(--label-color)">Klicks sind 3x stärker</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="megaClickCost">15000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="megaClickProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyHyperIdle()" id="hyperIdleCard">
|
||
<strong>Hyper Idle</strong><br>
|
||
<span style="color: var(--label-color)">Idle-Power ist 3x stärker</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="hyperIdleCost">20000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="hyperIdleProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyPrestigeBoost()" id="prestigeBoostCard">
|
||
<strong>Prestige-Boost</strong><br>
|
||
<span style="color: var(--label-color)">Prestige gibt doppelten Bonus</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="prestigeBoostCost">25000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="prestigeBoostProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buySuperMultiplier()" id="superMultiplierCard">
|
||
<strong>Super-Multiplikator</strong><br>
|
||
<span style="color: var(--label-color)">Alle Einnahmen +50%</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="superMultiplierCost">30000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="superMultiplierProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyTimeBonus()" id="timeBonusCard">
|
||
<strong>Zeit-Bonus</strong><br>
|
||
<span style="color: var(--label-color)">+5% zu allem pro Stunde Spielzeit</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="timeBonusCost">35000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="timeBonusProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyGoldenClick()" id="goldenClickCard">
|
||
<strong>Golden Click</strong><br>
|
||
<span style="color: var(--label-color)">10% Chance auf kritischen Klick (10x)</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="goldenClickCost">40000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="goldenClickProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyComboSystem()" id="comboSystemCard">
|
||
<strong>Combo-System</strong><br>
|
||
<span style="color: var(--label-color)">Schnelle Klicks geben +10% Bonus</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="comboSystemCost">50000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="comboSystemProgress"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" onclick="buyUltraPower()" id="ultraPowerCard">
|
||
<strong>Ultra-Power</strong><br>
|
||
<span style="color: var(--label-color)">Alle Multiplikatoren +50%</span><br>
|
||
<span style="color: var(--label-color)">Kosten: <span id="ultraPowerCost">75000</span></span>
|
||
<div class="progress-container">
|
||
<div class="progress-bar" id="ultraPowerProgress"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tab-content" id="achievements">
|
||
<div id="achievementsList"></div>
|
||
</div>
|
||
|
||
<div class="tab-content" id="settings">
|
||
<div class="toggle" onclick="toggleNotifications()">
|
||
<span>Benachrichtigungen</span>
|
||
<span id="notificationStatus">AN</span>
|
||
</div>
|
||
<button class="button" onclick="openShareModal()" style="margin-top: 20px;">Erfolge teilen 🎉</button>
|
||
<button class="button" onclick="resetGame()" style="background: var(--danger); margin-top: 20px;">Spiel zurücksetzen</button>
|
||
</div>
|
||
|
||
<div id="notifications"></div>
|
||
<div id="shareModal" class="modal">
|
||
<div class="modal-overlay" onclick="closeShareModal()"></div>
|
||
<div class="modal-content">
|
||
<button class="modal-close" onclick="closeShareModal()">×</button>
|
||
<h2 style="color: var(--secondary-color); margin-bottom: 20px;">🎉 Erfolge teilen</h2>
|
||
|
||
<div class="share-variants">
|
||
<button class="share-variant-btn" onclick="selectShareVariant(1)">Variante 1</button>
|
||
<button class="share-variant-btn" onclick="selectShareVariant(2)">Variante 2</button>
|
||
<button class="share-variant-btn" onclick="selectShareVariant(3)">Variante 3</button>
|
||
</div>
|
||
|
||
<textarea id="shareText" class="share-textarea"></textarea>
|
||
|
||
<div class="share-buttons">
|
||
<button class="button" onclick="copyShareText()">📋 Text kopieren</button>
|
||
</div>
|
||
|
||
<div class="social-share">
|
||
<p style="margin-bottom: 10px; color: var(--label-color);">Oder direkt teilen:</p>
|
||
<div class="social-buttons">
|
||
<button class="social-btn twitter" onclick="shareToSocial('twitter')">
|
||
<span style="font-size: 1.2em;">𝕏</span> X
|
||
</button>
|
||
<button class="social-btn whatsapp" onclick="shareToSocial('whatsapp')">
|
||
📱 WhatsApp
|
||
</button>
|
||
<button class="social-btn telegram" onclick="shareToSocial('telegram')">
|
||
✈️ Telegram
|
||
</button>
|
||
<button class="social-btn facebook" onclick="shareToSocial('facebook')">
|
||
👍 Facebook
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="copyFeedback" class="copy-feedback">✓ In Zwischenablage kopiert!</div>
|
||
</div>
|
||
</div>
|
||
|
||
<footer>
|
||
<p>
|
||
<a href="https://tools.ponywave.de/">Zurück zur Startseite</a> |
|
||
© <span id="currentYear"></span> Akamaru | Made with <span class="heart">❤️</span> by Claude
|
||
</p>
|
||
</footer>
|
||
|
||
<script src="script.js"></script>
|
||
</body>
|
||
</html>
|