Added battleship files
This commit is contained in:
138
Battleships/Lesson2.html
Normal file
138
Battleships/Lesson2.html
Normal file
@@ -0,0 +1,138 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>Lesson 2: Hunt All the Ships!</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||
background: #fff3e0;
|
||||
color: #2c3e50;
|
||||
padding: 20px;
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
h1 {
|
||||
color: #e67e22;
|
||||
text-align: center;
|
||||
border-bottom: 3px solid #f39c12;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
h2 {
|
||||
color: #2c3e50;
|
||||
margin-top: 25px;
|
||||
}
|
||||
.outcome {
|
||||
background: #ffecb3;
|
||||
padding: 15px;
|
||||
border-left: 4px solid #f39c12;
|
||||
margin: 15px 0;
|
||||
}
|
||||
.why {
|
||||
background: #dcedc8;
|
||||
padding: 15px;
|
||||
border-left: 4px solid #8bc34a;
|
||||
margin: 15px 0;
|
||||
}
|
||||
.step {
|
||||
background: #e1f5fe;
|
||||
padding: 12px;
|
||||
margin: 10px 0;
|
||||
border-radius: 6px;
|
||||
border-left: 4px solid #039be5;
|
||||
}
|
||||
code {
|
||||
background: #f1f1f1;
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: monospace;
|
||||
}
|
||||
.time {
|
||||
font-weight: bold;
|
||||
color: #d32f2f;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>🚢 Lesson 2: Hunt All the Ships!</h1>
|
||||
|
||||
<div class="outcome">
|
||||
<h2>✅ Learning Outcomes</h2>
|
||||
<ul>
|
||||
<li>Use <strong>lists</strong> to store multiple ships</li>
|
||||
<li>Create a <strong>game loop</strong> with turns</li>
|
||||
<li>Track game state (<code>hits</code>, <code>turns</code>)</li>
|
||||
<li>Make decisions with <code>for</code> loops and <code>if</code> inside lists</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="why">
|
||||
<h2>💡 Why It Matters</h2>
|
||||
<p>Real games don’t end after one guess! They track <strong>score</strong>, <strong>lives</strong>, and <strong>progress</strong>. Learning to manage game state is how you build Pac-Man, Minecraft, or Roblox games!</p>
|
||||
<p>Lists and loops are used in <em>every</em> programming language — from apps to robots.</p>
|
||||
</div>
|
||||
|
||||
<h2>⏱️ Lesson Plan (40 minutes)</h2>
|
||||
|
||||
<div class="step">
|
||||
<span class="time">0–5 min</span> → <strong>Review & Goal</strong><br>
|
||||
“Last time: 1 ship. Today: <strong>3 ships</strong> and <strong>10 turns</strong>!”<br>
|
||||
Show the enhanced game in action.
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<span class="time">5–20 min</span> → <strong>Upgrade Your Code</strong><br>
|
||||
Edit your Lesson 1 file to this:
|
||||
<pre style="background:#2d2d2d;color:#f8f8f2;padding:10px;border-radius:6px;font-size:14px;">
|
||||
import random
|
||||
|
||||
ships = []
|
||||
while len(ships) < 3:
|
||||
r = random.randint(0, 4)
|
||||
c = random.randint(0, 4)
|
||||
if [r, c] not in ships:
|
||||
ships.append([r, c])
|
||||
|
||||
print("3 ships hidden! 10 turns to find them all.")
|
||||
hits = 0
|
||||
|
||||
for turn in range(10):
|
||||
print("\nTurn", turn + 1)
|
||||
guess_row = int(input("Row (0-4): "))
|
||||
guess_col = int(input("Col (0-4): "))
|
||||
|
||||
if [guess_row, guess_col] in ships:
|
||||
print("🎯 HIT!")
|
||||
ships.remove([guess_row, guess_col])
|
||||
hits += 1
|
||||
if hits == 3:
|
||||
print("🏆 You win!")
|
||||
break
|
||||
else:
|
||||
print("💦 MISS!")
|
||||
|
||||
if hits < 3:
|
||||
print("Game over! You found", hits, "ships.")
|
||||
</pre>
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<span class="time">20–35 min</span> → <strong>Level Up!</strong><br>
|
||||
• Test the game (try to win!)<br>
|
||||
• 🌟 <em>Challenge 1</em>: Let players use <strong>A, B, C</strong> for rows!<br>
|
||||
<code>row_letter = input("Row (A-E): ").upper()</code><br>
|
||||
<code>guess_row = ord(row_letter) - ord('A')</code><br>
|
||||
• 🌟 <em>Challenge 2</em>: Show how many turns are left!
|
||||
</div>
|
||||
|
||||
<div class="step">
|
||||
<span class="time">35–40 min</span> → <strong>Play & Reflect</strong><br>
|
||||
Play your friend’s game! What makes it fun?<br>
|
||||
“Now YOU can make games — not just play them!”
|
||||
</div>
|
||||
|
||||
<h2>🌟 You’re Now a Game Coder!</h2>
|
||||
<p>You’ve learned the core ideas behind almost every game: <strong>hidden objects</strong>, <strong>player input</strong>, <strong>feedback</strong>, and <strong>win/lose conditions</strong>.</p>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user