Hugging Face's logo

Spaces:
GeminiLight
/
capture-fish
Running

App Files Community
GeminiLight commited on
Commit
79050de
·
verified ·
1 Parent(s): add1535

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +926 -19
  3. prompts.txt +2 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Capture Fish
3
- emoji: 😻
4
- colorFrom: green
5
- colorTo: pink
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: capture-fish
3
+ emoji: 🐳
4
+ colorFrom: purple
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,926 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="zh-CN">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>欢乐捕鱼</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ @keyframes bubbleFloat {
11
+ 0% { transform: translateY(0) scale(0.8); opacity: 0; }
12
+ 50% { opacity: 0.8; }
13
+ 100% { transform: translateY(-100px) scale(1.2); opacity: 0; }
14
+ }
15
+
16
+ @keyframes fishSwim {
17
+ 0% { transform: translateX(0) rotateY(0deg); }
18
+ 50% { transform: translateX(10px) rotateY(0deg); }
19
+ 51% { transform: translateX(10px) rotateY(180deg); }
20
+ 100% { transform: translateX(0) rotateY(180deg); }
21
+ }
22
+
23
+ .bubble {
24
+ animation: bubbleFloat 2s forwards;
25
+ }
26
+
27
+ .fish-animation {
28
+ animation: fishSwim 3s infinite;
29
+ }
30
+
31
+ #gameCanvas {
32
+ background: linear-gradient(to bottom, #1a237e, #00bcd4);
33
+ border-radius: 10px;
34
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
35
+ }
36
+
37
+ .wave {
38
+ background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1200 120" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none"><path d="M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.21,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z" opacity=".25" fill="%2300bcd4"/><path d="M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z" opacity=".5" fill="%2300bcd4"/><path d="M0,0V5.63C149.93,59,314.09,71.32,475.83,42.57c43-7.64,84.23-20.12,127.61-26.46,59-8.63,112.48,12.24,165.56,35.4C827.93,77.22,886,95.24,951.2,90c86.53-7,172.46-45.71,248.8-84.81V0Z" fill="%2300bcd4"/></svg>');
39
+ background-size: cover;
40
+ height: 60px;
41
+ position: absolute;
42
+ bottom: 0;
43
+ width: 100%;
44
+ }
45
+
46
+ .powerup {
47
+ animation: pulse 1.5s infinite;
48
+ }
49
+
50
+ @keyframes pulse {
51
+ 0% { transform: scale(1); }
52
+ 50% { transform: scale(1.1); }
53
+ 100% { transform: scale(1); }
54
+ }
55
+
56
+ .hook-line {
57
+ transition: all 0.1s ease-out;
58
+ }
59
+ </style>
60
+ </head>
61
+ <body class="bg-gray-900 text-white min-h-screen flex flex-col items-center justify-center p-4">
62
+ <div class="max-w-4xl w-full">
63
+ <header class="flex justify-between items-center mb-6">
64
+ <h1 class="text-4xl font-bold text-blue-300 flex items-center">
65
+ <i class="fas fa-fish mr-3"></i> 欢乐捕鱼
66
+ </h1>
67
+ <div class="flex items-center space-x-4">
68
+ <div class="bg-blue-900 bg-opacity-50 px-4 py-2 rounded-lg flex items-center">
69
+ <span class="text-yellow-300 mr-2">分数:</span>
70
+ <span id="score" class="font-bold text-xl">0</span>
71
+ </div>
72
+ <div class="bg-blue-900 bg-opacity-50 px-4 py-2 rounded-lg flex items-center">
73
+ <span class="text-green-300 mr-2">金币:</span>
74
+ <span id="coins" class="font-bold text-xl">100</span>
75
+ </div>
76
+ <div class="bg-blue-900 bg-opacity-50 px-4 py-2 rounded-lg flex items-center">
77
+ <span class="text-red-300 mr-2">时间:</span>
78
+ <span id="time" class="font-bold text-xl">60</span>
79
+ </div>
80
+ </div>
81
+ </header>
82
+
83
+ <div class="relative">
84
+ <canvas id="gameCanvas" width="800" height="500" class="w-full border-4 border-blue-800 relative overflow-hidden"></canvas>
85
+ <div class="wave"></div>
86
+
87
+ <!-- 游戏开始界面 -->
88
+ <div id="startScreen" class="absolute inset-0 flex flex-col items-center justify-center bg-black bg-opacity-70 rounded-lg">
89
+ <div class="text-center p-8 bg-blue-900 bg-opacity-80 rounded-xl max-w-md">
90
+ <h2 class="text-3xl font-bold text-blue-300 mb-4">欢乐捕鱼</h2>
91
+ <p class="mb-6 text-blue-100">使用鼠标移动鱼钩，点击放下鱼钩捕鱼。收集金币升级装备，捕获稀有鱼类获得高分！</p>
92
+ <div class="mb-6">
93
+ <label for="difficulty" class="block text-blue-200 mb-2">选择难度:</label>
94
+ <select id="difficulty" class="bg-blue-800 text-white rounded px-3 py-2 w-full">
95
+ <option value="easy">简单</option>
96
+ <option value="medium" selected>中等</option>
97
+ <option value="hard">困难</option>
98
+ </select>
99
+ </div>
100
+ <button id="startButton" class="bg-green-600 hover:bg-green-700 text-white font-bold py-3 px-8 rounded-full text-lg transition-all transform hover:scale-105">
101
+ <i class="fas fa-play mr-2"></i> 开始游戏
102
+ </button>
103
+ </div>
104
+ </div>
105
+
106
+ <!-- 游戏结束界面 -->
107
+ <div id="gameOverScreen" class="absolute inset-0 hidden flex-col items-center justify-center bg-black bg-opacity-70 rounded-lg">
108
+ <div class="text-center p-8 bg-blue-900 bg-opacity-80 rounded-xl max-w-md">
109
+ <h2 class="text-3xl font-bold text-red-400 mb-2">游戏结束</h2>
110
+ <p class="text-xl mb-1">最终得分: <span id="finalScore" class="text-yellow-300">0</span></p>
111
+ <p class="text-lg mb-1">捕获鱼类: <span id="totalFish" class="text-blue-300">0</span></p>
112
+ <p class="text-lg mb-6">获得金币: <span id="totalCoins" class="text-green-300">0</span></p>
113
+ <div class="flex space-x-4 justify-center">
114
+ <button id="restartButton" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-6 rounded-full transition-all transform hover:scale-105">
115
+ <i class="fas fa-redo mr-2"></i> 重新开始
116
+ </button>
117
+ <button id="menuButton" class="bg-gray-600 hover:bg-gray-700 text-white font-bold py-2 px-6 rounded-full transition-all transform hover:scale-105">
118
+ <i class="fas fa-home mr-2"></i> 主菜单
119
+ </button>
120
+ </div>
121
+ </div>
122
+ </div>
123
+
124
+ <!-- 升级商店 -->
125
+ <div id="upgradeScreen" class="absolute inset-0 hidden flex-col items-center justify-center bg-black bg-opacity-70 rounded-lg">
126
+ <div class="text-center p-6 bg-blue-900 bg-opacity-80 rounded-xl max-w-2xl w-full">
127
+ <h2 class="text-2xl font-bold text-blue-300 mb-4">渔具商店</h2>
128
+ <div class="grid grid-cols-3 gap-4 mb-6">
129
+ <div class="bg-blue-800 bg-opacity-60 p-4 rounded-lg">
130
+ <h3 class="font-bold text-yellow-300 mb-2">鱼钩尺寸</h3>
131
+ <p class="text-sm text-blue-100 mb-2">当前: <span id="hookSizeLevel" class="text-white">1级</span></p>
132
+ <p class="text-xs text-blue-200 mb-3">增加捕获大鱼几率</p>
133
+ <button class="upgrade-btn bg-blue-600 hover:bg-blue-700 text-white text-sm py-1 px-3 rounded" data-upgrade="hookSize">
134
+ 升级 (<span class="cost" data-cost="50">50</span>金币)
135
+ </button>
136
+ </div>
137
+ <div class="bg-blue-800 bg-opacity-60 p-4 rounded-lg">
138
+ <h3 class="font-bold text-yellow-300 mb-2">鱼线长度</h3>
139
+ <p class="text-sm text-blue-100 mb-2">当前: <span id="lineLengthLevel" class="text-white">1级</span></p>
140
+ <p class="text-xs text-blue-200 mb-3">可以到达更深水域</p>
141
+ <button class="upgrade-btn bg-blue-600 hover:bg-blue-700 text-white text-sm py-1 px-3 rounded" data-upgrade="lineLength">
142
+ 升级 (<span class="cost" data-cost="40">40</span>金币)
143
+ </button>
144
+ </div>
145
+ <div class="bg-blue-800 bg-opacity-60 p-4 rounded-lg">
146
+ <h3 class="font-bold text-yellow-300 mb-2">鱼饵质量</h3>
147
+ <p class="text-sm text-blue-100 mb-2">当前: <span id="baitQualityLevel" class="text-white">1级</span></p>
148
+ <p class="text-xs text-blue-200 mb-3">吸引更多稀有鱼类</p>
149
+ <button class="upgrade-btn bg-blue-600 hover:bg-blue-700 text-white text-sm py-1 px-3 rounded" data-upgrade="baitQuality">
150
+ 升级 (<span class="cost" data-cost="60">60</span>金币)
151
+ </button>
152
+ </div>
153
+ </div>
154
+ <button id="continueButton" class="bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-6 rounded-full">
155
+ <i class="fas fa-arrow-right mr-2"></i> 继续游戏
156
+ </button>
157
+ </div>
158
+ </div>
159
+ </div>
160
+
161
+ <div class="mt-6 flex justify-between items-center">
162
+ <div class="bg-blue-900 bg-opacity-50 px-4 py-3 rounded-lg">
163
+ <h3 class="text-lg font-semibold text-blue-300 mb-2">稀有鱼类</h3>
164
+ <div class="flex space-x-4">
165
+ <div class="flex items-center">
166
+ <div class="w-6 h-6 bg-yellow-400 rounded-full mr-2"></div>
167
+ <span>小黄鱼 (10分)</span>
168
+ </div>
169
+ <div class="flex items-center">
170
+ <div class="w-6 h-6 bg-red-500 rounded-full mr-2"></div>
171
+ <span>红鲤鱼 (30分)</span>
172
+ </div>
173
+ <div class="flex items-center">
174
+ <div class="w-6 h-6 bg-purple-500 rounded-full mr-2"></div>
175
+ <span>紫金鱼 (50分)</span>
176
+ </div>
177
+ </div>
178
+ </div>
179
+
180
+ <div class="flex space-x-4">
181
+ <button id="upgradeButton" class="bg-yellow-600 hover:bg-yellow-700 text-white font-bold py-2 px-6 rounded-full hidden">
182
+ <i class="fas fa-store mr-2"></i> 升级渔具
183
+ </button>
184
+ <button id="soundButton" class="bg-purple-600 hover:bg-purple-700 text-white font-bold py-2 px-6 rounded-full">
185
+ <i class="fas fa-volume-up mr-2"></i> 音效
186
+ </button>
187
+ </div>
188
+ </div>
189
+ </div>
190
+
191
+ <!-- 游戏音效 -->
192
+ <audio id="castSound" src="https://assets.mixkit.co/sfx/preview/mixkit-arrow-whoosh-1491.mp3" preload="auto"></audio>
193
+ <audio id="catchSound" src="https://assets.mixkit.co/sfx/preview/mixkit-winning-chimes-2015.mp3" preload="auto"></audio>
194
+ <audio id="coinSound" src="https://assets.mixkit.co/sfx/preview/mixkit-coins-handling-1939.mp3" preload="auto"></audio>
195
+ <audio id="upgradeSound" src="https://assets.mixkit.co/sfx/preview/mixkit-achievement-bell-600.mp3" preload="auto"></audio>
196
+ <audio id="gameOverSound" src="https://assets.mixkit.co/sfx/preview/mixkit-sad-game-over-trombone-471.mp3" preload="auto"></audio>
197
+ <audio id="bgMusic" loop src="https://assets.mixkit.co/music/preview/mixkit-relaxing-waves-1391.mp3" preload="auto"></audio>
198
+
199
+ <script>
200
+ // 游戏状态
201
+ const gameState = {
202
+ score: 0,
203
+ coins: 100,
204
+ time: 60,
205
+ gameRunning: false,
206
+ soundEnabled: true,
207
+ paused: false,
208
+ casting: false,
209
+ hookDepth: 0,
210
+ maxDepth: 300,
211
+ fishCaught: 0,
212
+ upgrades: {
213
+ hookSize: { level: 1, cost: 50, value: 1 },
214
+ lineLength: { level: 1, cost: 40, value: 300 },
215
+ baitQuality: { level: 1, cost: 60, value: 1 }
216
+ },
217
+ difficulty: 'medium'
218
+ };
219
+
220
+ // 获取DOM元素
221
+ const canvas = document.getElementById('gameCanvas');
222
+ const ctx = canvas.getContext('2d');
223
+ const scoreElement = document.getElementById('score');
224
+ const coinsElement = document.getElementById('coins');
225
+ const timeElement = document.getElementById('time');
226
+ const startScreen = document.getElementById('startScreen');
227
+ const gameOverScreen = document.getElementById('gameOverScreen');
228
+ const upgradeScreen = document.getElementById('upgradeScreen');
229
+ const finalScoreElement = document.getElementById('finalScore');
230
+ const totalFishElement = document.getElementById('totalFish');
231
+ const totalCoinsElement = document.getElementById('totalCoins');
232
+ const startButton = document.getElementById('startButton');
233
+ const restartButton = document.getElementById('restartButton');
234
+ const menuButton = document.getElementById('menuButton');
235
+ const upgradeButton = document.getElementById('upgradeButton');
236
+ const continueButton = document.getElementById('continueButton');
237
+ const soundButton = document.getElementById('soundButton');
238
+ const difficultySelect = document.getElementById('difficulty');
239
+
240
+ // 升级按钮元素
241
+ const hookSizeLevel = document.getElementById('hookSizeLevel');
242
+ const lineLengthLevel = document.getElementById('lineLengthLevel');
243
+ const baitQualityLevel = document.getElementById('baitQualityLevel');
244
+ const upgradeButtons = document.querySelectorAll('.upgrade-btn');
245
+
246
+ // 获取音效元素
247
+ const castSound = document.getElementById('castSound');
248
+ const catchSound = document.getElementById('catchSound');
249
+ const coinSound = document.getElementById('coinSound');
250
+ const upgradeSound = document.getElementById('upgradeSound');
251
+ const gameOverSound = document.getElementById('gameOverSound');
252
+ const bgMusic = document.getElementById('bgMusic');
253
+
254
+ // 游戏对象
255
+ const player = {
256
+ x: canvas.width / 2,
257
+ y: 30,
258
+ hookX: canvas.width / 2,
259
+ hookY: 30,
260
+ rodLength: 150,
261
+ hookSize: 10,
262
+ lineCast: false,
263
+ lineRetracting: false,
264
+ fishOnLine: null
265
+ };
266
+
267
+ const fishes = [];
268
+ const bubbles = [];
269
+ let gameTimer;
270
+ let countdownTimer;
271
+
272
+ // 鱼类数据
273
+ const fishTypes = [
274
+ { name: '小黄鱼', color: '#FBBF24', score: 10, speed: 1.5, size: 20, rarity: 0.6 },
275
+ { name: '蓝刀鱼', color: '#60A5FA', score: 20, speed: 2, size: 25, rarity: 0.3 },
276
+ { name: '红鲤鱼', color: '#F87171', score: 30, speed: 1.8, size: 30, rarity: 0.2 },
277
+ { name: '绿草鱼', color: '#34D399', score: 15, speed: 1.2, size: 35, rarity: 0.5 },
278
+ { name: '紫金鱼', color: '#A78BFA', score: 50, speed: 2.5, size: 40, rarity: 0.1 }
279
+ ];
280
+
281
+ // 事件监听器
282
+ startButton.addEventListener('click', startGame);
283
+ restartButton.addEventListener('click', startGame);
284
+ menuButton.addEventListener('click', showMenu);
285
+ upgradeButton.addEventListener('click', showUpgradeScreen);
286
+ continueButton.addEventListener('click', resumeFromUpgrade);
287
+ soundButton.addEventListener('click', toggleSound);
288
+
289
+ // 升级按钮事件
290
+ upgradeButtons.forEach(button => {
291
+ button.addEventListener('click', function() {
292
+ const upgradeType = this.getAttribute('data-upgrade');
293
+ purchaseUpgrade(upgradeType);
294
+ });
295
+ });
296
+
297
+ canvas.addEventListener('mousemove', (e) => {
298
+ if (!gameState.gameRunning || gameState.paused) return;
299
+
300
+ const rect = canvas.getBoundingClientRect();
301
+ player.x = e.clientX - rect.left;
302
+
303
+ if (!player.lineCast) {
304
+ player.hookX = player.x;
305
+ }
306
+ });
307
+
308
+ canvas.addEventListener('click', (e) => {
309
+ if (!gameState.gameRunning || gameState.paused) return;
310
+
311
+ if (!player.lineCast && !player.lineRetracting) {
312
+ castLine();
313
+ } else if (player.lineCast && !player.lineRetracting && player.hookDepth >= player.hookY) {
314
+ // 尝试收线
315
+ startReeling();
316
+ }
317
+ });
318
+
319
+ // 游戏函数
320
+ function startGame() {
321
+ // 设置难度
322
+ gameState.difficulty = difficultySelect.value;
323
+
324
+ // 重置游戏状态
325
+ gameState.score = 0;
326
+ gameState.coins = 100;
327
+ gameState.time = getInitialTime();
328
+ gameState.gameRunning = true;
329
+ gameState.paused = false;
330
+ gameState.casting = false;
331
+ gameState.hookDepth = 0;
332
+ gameState.fishCaught = 0;
333
+
334
+ // 重置玩家状态
335
+ player.x = canvas.width / 2;
336
+ player.hookX = canvas.width / 2;
337
+ player.hookY = 30;
338
+ player.lineCast = false;
339
+ player.lineRetracting = false;
340
+ player.fishOnLine = null;
341
+
342
+ // 清空游戏对象
343
+ fishes.length = 0;
344
+ bubbles.length = 0;
345
+
346
+ // 更新UI
347
+ scoreElement.textContent = gameState.score;
348
+ coinsElement.textContent = gameState.coins;
349
+ timeElement.textContent = gameState.time;
350
+
351
+ // 隐藏界面
352
+ startScreen.classList.add('hidden');
353
+ gameOverScreen.classList.add('hidden');
354
+ upgradeScreen.classList.add('hidden');
355
+ upgradeButton.classList.remove('hidden');
356
+
357
+ // 开始背景音乐
358
+ if (gameState.soundEnabled) {
359
+ bgMusic.currentTime = 0;
360
+ bgMusic.play();
361
+ }
362
+
363
+ // 开始游戏计时
364
+ clearInterval(gameTimer);
365
+ clearInterval(countdownTimer);
366
+
367
+ gameTimer = setInterval(spawnFish, 1000);
368
+ countdownTimer = setInterval(updateCountdown, 1000);
369
+
370
+ // 开始游戏循环
371
+ requestAnimationFrame(gameLoop);
372
+ }
373
+
374
+ function getInitialTime() {
375
+ switch (gameState.difficulty) {
376
+ case 'easy': return 90;
377
+ case 'medium': return 60;
378
+ case 'hard': return 45;
379
+ default: return 60;
380
+ }
381
+ }
382
+
383
+ function showMenu() {
384
+ gameState.gameRunning = false;
385
+ clearInterval(gameTimer);
386
+ clearInterval(countdownTimer);
387
+
388
+ gameOverScreen.classList.add('hidden');
389
+ upgradeScreen.classList.add('hidden');
390
+ startScreen.classList.remove('hidden');
391
+ upgradeButton.classList.add('hidden');
392
+
393
+ if (gameState.soundEnabled) {
394
+ bgMusic.pause();
395
+ }
396
+ }
397
+
398
+ function showUpgradeScreen() {
399
+ gameState.paused = true;
400
+ updateUpgradeDisplay();
401
+ upgradeScreen.classList.remove('hidden');
402
+ }
403
+
404
+ function resumeFromUpgrade() {
405
+ gameState.paused = false;
406
+ upgradeScreen.classList.add('hidden');
407
+ }
408
+
409
+ function updateUpgradeDisplay() {
410
+ hookSizeLevel.textContent = `${gameState.upgrades.hookSize.level}级`;
411
+ lineLengthLevel.textContent = `${gameState.upgrades.lineLength.level}级`;
412
+ baitQualityLevel.textContent = `${gameState.upgrades.baitQuality.level}级`;
413
+
414
+ // 更新升级按钮成本和状态
415
+ upgradeButtons.forEach(button => {
416
+ const upgradeType = button.getAttribute('data-upgrade');
417
+ const cost = gameState.upgrades[upgradeType].cost;
418
+ const costElement = button.querySelector('.cost');
419
+
420
+ costElement.textContent = cost;
421
+ costElement.setAttribute('data-cost', cost);
422
+
423
+ // 禁用不够钱的升级
424
+ if (gameState.coins < cost) {
425
+ button.disabled = true;
426
+ button.classList.add('opacity-50');
427
+ button.classList.remove('hover:bg-blue-700');
428
+ } else {
429
+ button.disabled = false;
430
+ button.classList.remove('opacity-50');
431
+ button.classList.add('hover:bg-blue-700');
432
+ }
433
+ });
434
+ }
435
+
436
+ function purchaseUpgrade(type) {
437
+ const upgrade = gameState.upgrades[type];
438
+
439
+ if (gameState.coins >= upgrade.cost) {
440
+ gameState.coins -= upgrade.cost;
441
+ coinsElement.textContent = gameState.coins;
442
+
443
+ upgrade.level++;
444
+
445
+ // 根据升级类型增加效果
446
+ switch (type) {
447
+ case 'hookSize':
448
+ upgrade.value = upgrade.level;
449
+ player.hookSize = 10 + (upgrade.level - 1) * 3;
450
+ break;
451
+ case 'lineLength':
452
+ upgrade.value = 300 + (upgrade.level - 1) * 50;
453
+ gameState.maxDepth = upgrade.value;
454
+ break;
455
+ case 'baitQuality':
456
+ upgrade.value = upgrade.level;
457
+ break;
458
+ }
459
+
460
+ // 增加下一次升级成本
461
+ upgrade.cost = Math.floor(upgrade.cost * 1.5);
462
+
463
+ // 更新显示
464
+ updateUpgradeDisplay();
465
+
466
+ if (gameState.soundEnabled) {
467
+ upgradeSound.currentTime = 0;
468
+ upgradeSound.play();
469
+ }
470
+ }
471
+ }
472
+
473
+ function toggleSound() {
474
+ gameState.soundEnabled = !gameState.soundEnabled;
475
+
476
+ if (gameState.soundEnabled) {
477
+ soundButton.innerHTML = '<i class="fas fa-volume-up mr-2"></i> 音效';
478
+ if (gameState.gameRunning && !gameState.paused) {
479
+ bgMusic.play();
480
+ }
481
+ } else {
482
+ soundButton.innerHTML = '<i class="fas fa-volume-mute mr-2"></i> 音效';
483
+ bgMusic.pause();
484
+ }
485
+ }
486
+
487
+ function gameOver() {
488
+ gameState.gameRunning = false;
489
+ clearInterval(gameTimer);
490
+ clearInterval(countdownTimer);
491
+
492
+ finalScoreElement.textContent = gameState.score;
493
+ totalFishElement.textContent = gameState.fishCaught;
494
+ totalCoinsElement.textContent = gameState.coins;
495
+ gameOverScreen.classList.remove('hidden');
496
+ upgradeButton.classList.add('hidden');
497
+
498
+ if (gameState.soundEnabled) {
499
+ bgMusic.pause();
500
+ gameOverSound.play();
501
+ }
502
+ }
503
+
504
+ function updateCountdown() {
505
+ gameState.time--;
506
+ timeElement.textContent = gameState.time;
507
+
508
+ if (gameState.time <= 0) {
509
+ gameOver();
510
+ }
511
+ }
512
+
513
+ function castLine() {
514
+ player.lineCast = true;
515
+ player.hookY = 30;
516
+ player.hookDepth = 0;
517
+
518
+ if (gameState.soundEnabled) {
519
+ castSound.currentTime = 0;
520
+ castSound.play();
521
+ }
522
+ }
523
+
524
+ function startReeling() {
525
+ player.lineRetracting = true;
526
+ }
527
+
528
+ function spawnFish() {
529
+ if (!gameState.gameRunning || gameState.paused) return;
530
+
531
+ // 根据难度调整生成频率
532
+ let spawnChance = 0.7; // 默认中等难度
533
+ if (gameState.difficulty === 'easy') spawnChance = 0.9;
534
+ if (gameState.difficulty === 'hard') spawnChance = 0.5;
535
+
536
+ if (Math.random() > spawnChance) return;
537
+
538
+ // 根据鱼饵质量调整稀有鱼出现几率
539
+ const baitFactor = gameState.upgrades.baitQuality.value * 0.1;
540
+
541
+ // 选择鱼类型，考虑稀有度
542
+ let availableFish = fishTypes.map(fish => {
543
+ // 提高稀有鱼的几率基于鱼饵质量
544
+ const adjustedRarity = Math.min(1, fish.rarity + baitFactor);
545
+ return { ...fish, selectionWeight: adjustedRarity };
546
+ });
547
+
548
+ // 根据权重随机选择鱼
549
+ const totalWeight = availableFish.reduce((sum, fish) => sum + fish.selectionWeight, 0);
550
+ let random = Math.random() * totalWeight;
551
+ let selectedFish;
552
+
553
+ for (const fish of availableFish) {
554
+ if (random < fish.selectionWeight) {
555
+ selectedFish = fish;
556
+ break;
557
+ }
558
+ random -= fish.selectionWeight;
559
+ }
560
+
561
+ // 确保总是选择一种鱼
562
+ selectedFish = selectedFish || availableFish[0];
563
+
564
+ // 随机位置 (从左右两侧出现)
565
+ const side = Math.random() > 0.5 ? 1 : -1;
566
+ const x = side > 0 ? -selectedFish.size : canvas.width + selectedFish.size;
567
+ const y = 100 + Math.random() * (canvas.height - 200);
568
+
569
+ // 随机速度 (基于难度)
570
+ let speed = selectedFish.speed;
571
+ if (gameState.difficulty === 'easy') speed *= 0.8;
572
+ if (gameState.difficulty === 'hard') speed *= 1.3;
573
+
574
+ fishes.push({
575
+ x: x,
576
+ y: y,
577
+ width: selectedFish.size,
578
+ height: selectedFish.size / 2,
579
+ speed: speed * side,
580
+ color: selectedFish.color,
581
+ score: selectedFish.score,
582
+ name: selectedFish.name,
583
+ direction: side,
584
+ value: selectedFish.score,
585
+ wiggle: Math.random() * 5
586
+ });
587
+ }
588
+
589
+ function spawnBubble(x, y, size) {
590
+ bubbles.push({
591
+ x: x,
592
+ y: y,
593
+ size: size,
594
+ speed: 1 + Math.random() * 2,
595
+ opacity: 0.3 + Math.random() * 0.7
596
+ });
597
+ }
598
+
599
+ function updatePlayer() {
600
+ // 更新鱼钩位置
601
+ if (player.lineCast && !player.lineRetracting) {
602
+ // 放下鱼线
603
+ player.hookY += 3;
604
+ player.hookDepth = player.hookY;
605
+
606
+ // 随机生成气泡
607
+ if (Math.random() < 0.05) {
608
+ spawnBubble(
609
+ player.hookX + (Math.random() * 20 - 10),
610
+ player.hookY,
611
+ 3 + Math.random() * 7
612
+ );
613
+ }
614
+
615
+ // 检查是否到达最大深度
616
+ if (player.hookY >= gameState.maxDepth) {
617
+ startReeling();
618
+ }
619
+ } else if (player.lineRetracting) {
620
+ // 收回鱼线
621
+ player.hookY -= 5;
622
+
623
+ // 如果有鱼在钩上，一起拉上来
624
+ if (player.fishOnLine) {
625
+ player.fishOnLine.y -= 5;
626
+
627
+ // 检查是否到达水面
628
+ if (player.hookY <= 30) {
629
+ // 捕获成功
630
+ gameState.score += player.fishOnLine.value;
631
+ gameState.coins += Math.floor(player.fishOnLine.value / 2);
632
+ gameState.fishCaught++;
633
+
634
+ scoreElement.textContent = gameState.score;
635
+ coinsElement.textContent = gameState.coins;
636
+
637
+ // 从鱼数组中移除
638
+ const index = fishes.indexOf(player.fishOnLine);
639
+ if (index !== -1) {
640
+ fishes.splice(index, 1);
641
+ }
642
+
643
+ player.fishOnLine = null;
644
+
645
+ if (gameState.soundEnabled) {
646
+ catchSound.currentTime = 0;
647
+ catchSound.play();
648
+ coinSound.currentTime = 0;
649
+ coinSound.play();
650
+ }
651
+ }
652
+ }
653
+
654
+ // 检查是否完全收回
655
+ if (player.hookY <= 30) {
656
+ player.lineCast = false;
657
+ player.lineRetracting = false;
658
+ player.hookY = 30;
659
+ }
660
+ }
661
+ }
662
+
663
+ function updateFishes() {
664
+ for (let i = fishes.length - 1; i >= 0; i--) {
665
+ const fish = fishes[i];
666
+
667
+ // 更新鱼的位置
668
+ fish.x += fish.speed;
669
+ fish.wiggle += 0.1;
670
+
671
+ // 随机生成气泡
672
+ if (Math.random() < 0.01) {
673
+ spawnBubble(
674
+ fish.x - fish.width/2 + (Math.random() * fish.width),
675
+ fish.y + (Math.random() * fish.height) - fish.height/2,
676
+ 2 + Math.random() * 5
677
+ );
678
+ }
679
+
680
+ // 检查是否游出屏幕
681
+ if ((fish.direction > 0 && fish.x > canvas.width + fish.width) ||
682
+ (fish.direction < 0 && fish.x < -fish.width)) {
683
+ fishes.splice(i, 1);
684
+ }
685
+
686
+ // 检查是否咬钩
687
+ if (player.lineCast && !player.lineRetracting && !player.fishOnLine) {
688
+ const hookSize = player.hookSize * gameState.upgrades.hookSize.value;
689
+
690
+ // 简单碰撞检测
691
+ if (Math.abs(fish.x - player.hookX) < fish.width/2 + hookSize/2 &&
692
+ Math.abs(fish.y - player.hookY) < fish.height/2 + hookSize/2) {
693
+
694
+ // 根据鱼的大小和钩的大小计算捕获几率
695
+ const catchChance = Math.min(0.8, hookSize / fish.width);
696
+
697
+ if (Math.random() < catchChance) {
698
+ player.fishOnLine = fish;
699
+
700
+ // 改变鱼的颜色表示被捕获
701
+ fish.color = '#FFFFFF';
702
+ }
703
+ }
704
+ }
705
+ }
706
+ }
707
+
708
+ function updateBubbles() {
709
+ for (let i = bubbles.length - 1; i >= 0; i--) {
710
+ const bubble = bubbles[i];
711
+ bubble.y -= bubble.speed;
712
+
713
+ // 移除超出屏幕的气泡
714
+ if (bubble.y < -bubble.size) {
715
+ bubbles.splice(i, 1);
716
+ }
717
+ }
718
+ }
719
+
720
+ function drawBackground() {
721
+ // 绘制渐变背景
722
+ const gradient = ctx.createLinearGradient(0, 0, 0, canvas.height);
723
+ gradient.addColorStop(0, '#1a237e');
724
+ gradient.addColorStop(1, '#00bcd4');
725
+ ctx.fillStyle = gradient;
726
+ ctx.fillRect(0, 0, canvas.width, canvas.height);
727
+
728
+ // 绘制海底
729
+ ctx.fillStyle = '#5C4033';
730
+ ctx.beginPath();
731
+ ctx.moveTo(0, canvas.height);
732
+
733
+ // 创建波浪形海底
734
+ for (let x = 0; x <= canvas.width; x += 20) {
735
+ const y = canvas.height - 30 + Math.sin(x * 0.02) * 15;
736
+ ctx.lineTo(x, y);
737
+ }
738
+
739
+ ctx.lineTo(canvas.width, canvas.height);
740
+ ctx.closePath();
741
+ ctx.fill();
742
+
743
+ // 绘制一些海底植物
744
+ drawSeaPlants();
745
+ }
746
+
747
+ function drawSeaPlants() {
748
+ // 海草
749
+ ctx.save();
750
+ for (let i = 0; i < 10; i++) {
751
+ const x = Math.random() * canvas.width;
752
+ const height = 30 + Math.random() * 70;
753
+
754
+ ctx.fillStyle = `hsl(${100 + Math.random() * 40}, 70%, 40%)`;
755
+ ctx.beginPath();
756
+ ctx.moveTo(x, canvas.height);
757
+
758
+ // 弯曲的海草
759
+ for (let y = canvas.height; y >= canvas.height - height; y -= 5) {
760
+ const offset = Math.sin((canvas.height - y) * 0.1) * 15;
761
+ ctx.lineTo(x + offset, y);
762
+ }
763
+
764
+ ctx.lineTo(x, canvas.height);
765
+ ctx.closePath();
766
+ ctx.fill();
767
+ }
768
+ ctx.restore();
769
+ }
770
+
771
+ function drawPlayer() {
772
+ ctx.save();
773
+
774
+ // 绘制钓竿
775
+ ctx.strokeStyle = '#78350F';
776
+ ctx.lineWidth = 3;
777
+ ctx.beginPath();
778
+ ctx.moveTo(player.x, 0);
779
+ ctx.lineTo(player.x, player.rodLength);
780
+ ctx.stroke();
781
+
782
+ // 绘制鱼线
783
+ ctx.strokeStyle = 'rgba(255, 255, 255, 0.7)';
784
+ ctx.lineWidth = 1;
785
+ ctx.beginPath();
786
+ ctx.moveTo(player.x, player.rodLength);
787
+ ctx.lineTo(player.hookX, player.hookY);
788
+ ctx.stroke();
789
+
790
+ // 绘制鱼钩
791
+ ctx.fillStyle = '#D4D4D8';
792
+ ctx.beginPath();
793
+ ctx.arc(player.hookX, player.hookY, player.hookSize/2, 0, Math.PI * 2);
794
+ ctx.fill();
795
+
796
+ // 如果有鱼在钩上，绘制鱼
797
+ if (player.fishOnLine) {
798
+ const fish = player.fishOnLine;
799
+ drawFish(fish, true);
800
+ }
801
+
802
+ ctx.restore();
803
+ }
804
+
805
+ function drawFishes() {
806
+ for (const fish of fishes) {
807
+ drawFish(fish);
808
+ }
809
+ }
810
+
811
+ function drawFish(fish, onHook = false) {
812
+ ctx.save();
813
+
814
+ if (onHook) {
815
+ // 被钩住的鱼
816
+ ctx.translate(player.hookX, player.hookY);
817
+ ctx.rotate(Math.PI / 2);
818
+ } else {
819
+ // 游动的鱼
820
+ ctx.translate(fish.x, fish.y);
821
+ if (fish.direction < 0) {
822
+ ctx.scale(-1, 1);
823
+ }
824
+
825
+ // 摆动效果
826
+ ctx.rotate(Math.sin(fish.wiggle) * 0.1);
827
+ }
828
+
829
+ // 鱼身
830
+ ctx.fillStyle = fish.color;
831
+ ctx.beginPath();
832
+ ctx.ellipse(0, 0, fish.width / 2, fish.height / 2, 0, 0, Math.PI * 2);
833
+ ctx.fill();
834
+
835
+ // 鱼尾
836
+ ctx.beginPath();
837
+ ctx.moveTo(-fish.width / 2, 0);
838
+ ctx.lineTo(-fish.width / 2 - 10, -fish.height / 2);
839
+ ctx.lineTo(-fish.width / 2 - 10, fish.height / 2);
840
+ ctx.closePath();
841
+ ctx.fill();
842
+
843
+ // 鱼眼
844
+ ctx.fillStyle = 'white';
845
+ ctx.beginPath();
846
+ ctx.arc(fish.width / 4, -fish.height / 4, fish.width / 8, 0, Math.PI * 2);
847
+ ctx.fill();
848
+
849
+ ctx.fillStyle = 'black';
850
+ ctx.beginPath();
851
+ ctx.arc(fish.width / 4, -fish.height / 4, fish.width / 16, 0, Math.PI * 2);
852
+ ctx.fill();
853
+
854
+ ctx.restore();
855
+ }
856
+
857
+ function drawBubbles() {
858
+ ctx.save();
859
+
860
+ for (const bubble of bubbles) {
861
+ ctx.fillStyle = `rgba(173, 216, 230, ${bubble.opacity})`;
862
+ ctx.beginPath();
863
+ ctx.arc(bubble.x, bubble.y, bubble.size, 0, Math.PI * 2);
864
+ ctx.fill();
865
+
866
+ // 气泡高光
867
+ ctx.fillStyle = `rgba(255, 255, 255, ${bubble.opacity * 0.7})`;
868
+ ctx.beginPath();
869
+ ctx.arc(bubble.x - bubble.size/3, bubble.y - bubble.size/3, bubble.size/4, 0, Math.PI * 2);
870
+ ctx.fill();
871
+ }
872
+
873
+ ctx.restore();
874
+ }
875
+
876
+ function drawDepthMeter() {
877
+ if (!player.lineCast) return;
878
+
879
+ ctx.save();
880
+
881
+ // 背景
882
+ ctx.fillStyle = 'rgba(0, 0, 0, 0.5)';
883
+ ctx.fillRect(20, 50, 20, gameState.maxDepth);
884
+
885
+ // 当前深度
886
+ const depthPercentage = player.hookDepth / gameState.maxDepth;
887
+ ctx.fillStyle = '#3B82F6';
888
+ ctx.fillRect(20, 50 + depthPercentage * gameState.maxDepth, 20, 5);
889
+
890
+ // 文本
891
+ ctx.fillStyle = 'white';
892
+ ctx.font = '12px Arial';
893
+ ctx.fillText('深度', 25, 40);
894
+
895
+ ctx.restore();
896
+ }
897
+
898
+ // 游戏循环
899
+ function gameLoop() {
900
+ if (!gameState.gameRunning || gameState.paused) return;
901
+
902
+ // 清除画布
903
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
904
+
905
+ // 绘制背景
906
+ drawBackground();
907
+
908
+ // 更新游戏状态
909
+ updatePlayer();
910
+ updateFishes();
911
+ updateBubbles();
912
+
913
+ // 绘制游戏对象
914
+ drawFishes();
915
+ drawBubbles();
916
+ drawPlayer();
917
+ drawDepthMeter();
918
+
919
+ requestAnimationFrame(gameLoop);
920
+ }
921
+
922
+ // 初始显示开始界面
923
+ showMenu();
924
+ </script>
925
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=GeminiLight/capture-fish" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
926
+ </html>
prompts.txt ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ 生成一个坦克之王游戏
2
+ 帮我生成一个捕鱼‘