|
Server : Apache/2.4.62 System : FreeBSD fbsdweb2.web.rcn.net 14.1-RELEASE FreeBSD 14.1-RELEASE releng/14.1-n267679-10e31f0946d8 GENERIC amd64 User : www ( 80) PHP Version : 8.3.8 Disable Function : NONE Directory : /domains/drsuper/CalculusMechanics/ |
Upload File : |
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Adventure 14 – Activity 1 (Student)</title>
<meta name="viewport" content="width=device-width,initial-scale=1" />
<!-- ✅ ADD CALCULATOR CSS HERE -->
<link rel="stylesheet" href="images/calc-popup.css">
<style>
body {font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; margin: 0; padding: 0; background: #f5f5fb; color: #222; font-size:18px;}
.page{width:100%; box-sizing:border-box; padding:1.8rem 5vw 3rem; background:#fff; max-width:none; margin:0 auto;}
h1{margin:0.2rem 0 0.25rem; font-size:2rem;}
.subtitle{color:#555; margin:0 0 1.2rem; line-height:1.45;}
h2{margin-top:1.4rem; margin-bottom:0.4rem; font-size:1.25rem;}
p{margin:0.35rem 0 0.7rem; line-height:1.55;}
ul{margin-top:0.3rem; padding-left:1.2rem;}
li{margin:0.25rem 0;}
a{color:#1f4ed8; text-decoration:none;}
a:hover{text-decoration:underline;}
.card{border:1px solid #dde3ff; background:#f6f7ff; border-radius:14px; padding:1rem 1rem 0.95rem; margin-top:0.7rem;}
code{background:#fff; border:1px solid #d9def5; padding:2px 6px; border-radius:8px;}
.callout{background:#fff9e5; border-radius:10px; border:1px solid #f0e0a0; padding:0.9rem 1rem; font-size:0.98rem; margin:1rem 0;}
.footer{margin-top:2.2rem; font-size:0.9rem; color:#777; text-align:left; border-top:1px solid #eee; padding-top:0.8rem;}
.two-col{display:grid;grid-template-columns: 1.15fr 0.85fr;gap: 2rem;align-items:start;clear:both;}
.right-col{ text-align:center; position:sticky; top:1rem; align-self:start;}
.charts-stack img{width:100%;height:auto;border-radius:12px;border:1px solid #dde3ff;display:block;margin: 0 auto 1rem;max-width:100%;}
@media (max-width: 900px){ .two-col{grid-template-columns:1fr;} .right-col{position:static;} }
input[type="text"], input[type="number"]{width:100%; max-width:280px; padding:0.35rem 0.45rem; font-size:0.98rem; border-radius:8px; border:1px solid #c3cade; margin-top:0.25rem; box-sizing:border-box;}
textarea{width:100%; max-width:720px; padding:0.45rem 0.55rem; font-size:0.95rem; border-radius:10px; border:1px solid #c3cade; margin-top:0.25rem; box-sizing:border-box; line-height:1.45;}
button {
background: #e9f0ff;
border: 2px solid #6b8cff;
border-radius: 0;
padding: 10px 18px;
font-size: 1rem;
cursor: pointer;
box-shadow: 0 3px 0 #4f6fe6;
transition: all 0.12s ease;
}
button:hover { background: #f3f7ff; }
button:active { background: #cddcff; box-shadow: 0 1px 0 #4f6fe6; transform: translateY(2px); }
button.checked {
background: #dff5e1;
border-color: #3a9b3a;
box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
}
button.sampled {
background: #fff3d9;
border-color: #d9a441;
box-shadow: inset 0 2px 4px rgba(0,0,0,0.15);
}
.correct{ background-color:#e4f9e7 !important; border-color:#2e9a48 !important; }
.incorrect{ background-color:#fde3e3 !important; border-color:#cc3d3d !important; }
.eq{font-size:1.06rem; margin:0.55rem 0; padding-left:0.4rem;}
.scoreline{margin:0; padding:0; color:#555;}
</style>
</head>
<body>
<div class="page">
<div style="display:flex; flex-wrap:wrap; gap:12px; margin-bottom:0.8rem; align-items:center;">
<a href="index.html"><button>🧭 Hub</button></a>
<a href="ss_adventure_14_home.html"><button class="secondary">🏠 Home</button></a>
<a href="ss_adventure_14_story.html"><button class="secondary">📜 Story</button></a>
<a href="ss_adventure_14_activity1_solution.html"><button class="secondary">🧠 Solution</button></a>
<button type="button" onclick="useSamples()">🟡 Use Sample Values</button>
<button type="button" onclick="checkAll()">✅ Check Answers</button>
<span id="score" class="subtitle scoreline"></span>
</div>
<h1>🧩 Adventure 14 — Activity 1</h1>
<div class="subtitle">The Moon, Gravity, and Circular Motion</div>
<div class="two-col">
<div class="left-col">
<div class="callout">
<b>Goal:</b> Use Newton’s law of gravitation and circular motion to derive the Moon’s orbital speed and orbital period.
</div>
<div class="card">
<h2>2) Key Equations and Derivation</h2>
<p>The Moon stays in orbit because gravity provides the inward force required for circular motion.</p>
<p class="eq"><b>Newton’s gravitational force:</b> F = GMm / R²</p>
<p>where <b>G</b> is the gravitational constant, <b>M</b> is Earth’s mass, <b>m</b> is the Moon’s mass, and <b>R</b> is the Earth–Moon distance.</p>
<p class="eq"><b>Circular motion requirement:</b> F = mv² / R</p>
<p>Since gravity is the force that keeps the Moon in circular motion, we set the two expressions equal:</p>
<p class="eq"><b>GMm / R² = mv² / R</b></p>
<p>Cancel <b>m</b> and multiply both sides by <b>R</b>:</p>
<p class="eq"><b>GM / R = v²</b></p>
<p>Therefore the orbital speed is:</p>
<p class="eq"><b>v = √(GM / R)</b></p>
</div>
<div class="card">
<h2>3) Compute the Moon’s Orbital Speed</h2>
<p>Use these values:</p>
<ul>
<li><b>G</b> = 6.67 × 10<sup>−11</sup> N·m²/kg²</li>
<li><b>M</b> = 5.97 × 10<sup>24</sup> kg</li>
<li><b>R</b> = 3.84 × 10<sup>8</sup> m</li>
</ul>
<p>Substitute into <code>v = √(GM/R)</code> and compute the Moon’s speed in m/s.</p>
<input type="number" step="any" id="speed_ms" placeholder="m/s">
<p>Convert your result to km/s.</p>
<input type="number" step="any" id="speed_kms" placeholder="km/s">
</div>
<div class="card">
<h2>4) Compute the Orbital Period</h2>
<p>The Moon travels one full circle in one orbit, so first compute the circumference:</p>
<p class="eq"><b>distance = 2πR</b></p>
<input type="number" step="any" id="circ" placeholder="circumference in meters">
<p>Now use:</p>
<p class="eq"><b>time = distance / speed</b></p>
<p>Orbital period in seconds:</p>
<input type="number" step="any" id="period_s" placeholder="seconds">
<p>Convert the result into days.</p>
<input type="number" step="any" id="period_d" placeholder="days">
</div>
<div class="card">
<h2>5) Interpretation</h2>
<p>Why does the Moon not crash into Earth?</p>
<textarea rows="3"></textarea>
<p>What would happen if the Moon moved more slowly?</p>
<textarea rows="3"></textarea>
<p>What would happen if the Moon moved more quickly?</p>
<textarea rows="3"></textarea>
</div>
<div class="card">
<h2>1) The Big Idea</h2>
<p>Complete the sentence in your own words:</p>
<p><b>The Moon stays in orbit because</b></p>
<textarea id="bigidea" rows="3" placeholder="Write the main idea in words"></textarea>
</div>
</div>
<div class="right-col">
<div class="charts-stack">
<img src="images/adventure_14_activity1_diagram.png" alt="Centrifugal Force Moon's orbit ">
<img src="images/adventure_14_activity1_diagram_2.png" alt="Centrifugal Force Moon's orbit ">
</div>
</div>
</div>
<div class="footer">Dr. Super & Spark — Powered by ChatGPT</div>
</div>
<script>
function mark(el, ok){
if(!el) return;
el.classList.remove('correct','incorrect');
el.classList.add(ok ? 'correct' : 'incorrect');
}
function approx(val, target, rel=0.03){
return Math.abs(val-target) <= Math.max(1e-12, Math.abs(target)*rel);
}
function clearStates(){
['speed_ms','speed_kms','circ','period_s','period_d'].forEach(id => {
const el = document.getElementById(id);
if(el) el.classList.remove('correct','incorrect');
});
document.getElementById('score').textContent = '';
}
function useSamples(){
const samples = {
speed_ms:'1018',
speed_kms:'1.018',
circ:'2.414e9',
period_s:'2.37e6',
period_d:'27.4'
};
Object.entries(samples).forEach(([id,val]) => {
const el = document.getElementById(id);
if(el) el.value = val;
});
checkAll();
}
function checkAll(){
clearStates();
const answers = [
['speed_ms', 1018, 0.04],
['speed_kms', 1.018, 0.04],
['circ', 2.414e9, 0.04],
['period_s', 2.37e6, 0.04],
['period_d', 27.4, 0.04]
];
let okCount = 0;
answers.forEach(([id,target,rel]) => {
const el = document.getElementById(id);
const ok = approx(Number(el.value), target, rel);
mark(el, ok);
if(ok) okCount++;
});
document.getElementById('score').textContent = 'Score: ' + okCount + ' / ' + answers.length;
}
</script>
<script src="images/calc-popup.js"></script>
</body>
</html>