|
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 7 Story — Stargazing and Space Travel</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
body {
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
margin: 0; padding: 0;
background: #f5f5fb; color: #222;
}
.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;}
.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; }
.charts-stack img{
width: 115%;
height:auto;
border-radius:12px;
border:1px solid #dde3ff;
display:block;
margin: 0 auto 1rem;
}
.chart-sticky{ position: sticky; top: 1rem; }
@media (max-width: 900px){
.two-col{ grid-template-columns:1fr; }
.chart-sticky{ position: static; }
.charts-stack img{ width:100%; }
}
input[type="text"], input[type="number"]{
width:100%;
max-width:260px;
padding:0.35rem 0.45rem;
font-size:0.95rem;
border-radius:8px;
border:1px solid #c3cade;
margin-top:0.25rem;
box-sizing:border-box;
}
textarea{
width:100%;
max-width:640px;
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;
}
.row-grid{
display:grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1rem 1.4rem;
margin-top:0.6rem;
clear:both;
}
@media (max-width: 900px){
.row-grid{ grid-template-columns:1fr; }
}
.buttons-row{
margin-top:1rem;
display:flex;
flex-wrap:wrap;
gap:0.6rem;
}
button{
border-radius:999px;
border:none;
padding:0.45rem 0.95rem;
font-size:0.92rem;
cursor:pointer;
background:#325dff;
color:#fff;
}
button.secondary{ background:#e4e8fb; color:#243152; }
button:active{ transform: translateY(1px); }
.correct{ background-color:#e4f9e7 !important; border-color:#2e9a48 !important; }
.incorrect{ background-color:#fde3e3 !important; border-color:#cc3d3d !important; }
.hint, .solution{
margin-top:0.9rem;
padding:0.8rem 0.9rem;
border-radius:10px;
border:1px solid #dde3ff;
background:#f6f7ff;
font-size:0.92rem;
display:none;
}
.reader {
border: 1px solid #dde3ff;
border-radius: 12px;
padding: 0.9rem 1rem;
background: #f6f7ff;
margin: 1rem 0 1.2rem;
}
.reader-controls {
display: flex;
flex-wrap: wrap;
gap: 10px 14px;
align-items: center;
margin-bottom: 0.7rem;
font-size: 0.95rem;
}
.reader textarea {
width: 100%;
box-sizing: border-box;
border-radius: 10px;
border: 1px solid #c3cade;
padding: 10px;
font-size: 0.95rem;
line-height: 1.45;
background: #fff;
white-space: pre-wrap;
}
.reader-buttons {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 0.7rem;
}
.reader-buttons button {
border: 1px solid #c3cade;
background: #fff;
border-radius: 10px;
padding: 8px 10px;
font-size: 0.95rem;
cursor: pointer;
color:#222;
}
.reader-buttons button:hover { background: #f3f6ff; }
.hintline { font-size: 0.9rem; color: #666; margin: 0.3rem 0 0; }
</style>
</head>
<body>
<div class="page" style="max-width:980px;">
<div style="font-size:0.95rem; margin-bottom:0.8rem;">
<a href="adventure_7_home.html">← Back to Adventure 7 Home</a>
<span style="color:#666;"> | </span>
<a href="index.html">Back to Hub</a>
</div>
<h1>🪐 Adventure 7 Story</h1>
<div class="subtitle">A Short History of Stargazing and Space Travel</div>
<h2>🔊 Read‑Aloud (English voices)</h2>
<p class="hintline">Choose an English voice, then press <b>Read Aloud</b>. You can adjust rate and pitch.</p>
<div class="reader">
<div class="reader-controls">
<label for="voiceSelect"><strong>Voice:</strong></label>
<select id="voiceSelect"></select>
<label for="rate"><strong>Rate:</strong></label>
<input id="rate" type="range" min="0.7" max="1.3" step="0.05" value="1.0" />
<span id="rateVal">1.0</span>
<label for="pitch"><strong>Pitch:</strong></label>
<input id="pitch" type="range" min="0.7" max="1.3" step="0.05" value="1.0" />
<span id="pitchVal">1.0</span>
</div>
<textarea id="storyText" rows="16" spellcheck="false">A Short History of Stargazing and Space Travel
From Ancient Wonder to Modern Rockets and the Edge of Time
For thousands of years, people looked up at the night sky and believed they were seeing the stars exactly as they were in that moment. They drew constellations, told stories, predicted seasons, and navigated oceans by those tiny lights. The sky felt eternal and unchanging.
What ancient people didn’t know is one of the most astonishing ideas in science: when we look at the stars, we are looking into the past. Light takes time to travel. A star 100 light-years away shows us what it looked like 100 years ago. A galaxy a million light-years away shows us a million years into the past.
Only in the last century have we built tools powerful enough to truly understand this. The Hubble Space Telescope revealed galaxies so far away that their light began its journey when dinosaurs walked the Earth. And today, the James Webb Space Telescope can see even farther — capturing light from the first galaxies that formed after the Big Bang. Seeing the early universe is a modern superpower that didn’t exist for 99.99% of human history.
A thousand years ago, Persian scholars were among the world’s best observers of the sky. Astronomers like Omar Khayyam measured the Sun’s motion so precisely that the Jalali Calendar he helped design remains one of the most accurate calendars ever created. Their observations helped transform the sky from myth into mathematics.
Fast forward to the 20th century: rockets finally carried us closer to the stars. Before humans flew, scientists sent animals — monkeys, dogs, and chimpanzees — to learn how living bodies react in space. Then, in 1961, Yuri Gagarin became the first human to orbit Earth, calling out, “I see Earth… it is beautiful.” After that the space race started and eight years later, humans walked on the Moon for the very first time.
Today, rockets like SpaceX’s Falcon Heavy and Starship launch spacecraft toward planets, asteroids, and icy moons. Future missions will explore worlds like Europa, a moon hiding a massive ocean beneath its frozen surface — one of the best places to search for life.
From ancient stargazers to Persian astronomers, to modern rocket scientists, one thing has always stayed the same: Humans look up. We wonder. And we explore. And the next chapter belongs to students like you.</textarea>
<div class="reader-buttons">
<button id="speakBtn">▶ Read Aloud</button>
<button id="pauseBtn">⏸ Pause</button>
<button id="resumeBtn">▶ Resume</button>
<button id="stopBtn">⏹ Stop</button>
</div>
<p class="hintline">Tip: If you don’t see voices, refresh the page once.</p>
</div>
<p>A Short History of Stargazing and Space Travel</p>
<p>From Ancient Wonder to Modern Rockets and the Edge of Time</p>
<p>For thousands of years, people looked up at the night sky and believed they were seeing the stars exactly as they were in that moment. They drew constellations, told stories, predicted seasons, and navigated oceans by those tiny lights. The sky felt eternal and unchanging.</p>
<p>What ancient people didn’t know is one of the most astonishing ideas in science: when we look at the stars, we are looking into the past. Light takes time to travel. A star 100 light-years away shows us what it looked like 100 years ago. A galaxy a million light-years away shows us a million years into the past.</p>
<p>Only in the last century have we built tools powerful enough to truly understand this. The Hubble Space Telescope revealed galaxies so far away that their light began its journey when dinosaurs walked the Earth. And today, the James Webb Space Telescope can see even farther — capturing light from the first galaxies that formed after the Big Bang. Seeing the early universe is a modern superpower that didn’t exist for 99.99% of human history.</p>
<p>A thousand years ago, Persian scholars were among the world’s best observers of the sky. Astronomers like Omar Khayyam measured the Sun’s motion so precisely that the Jalali Calendar he helped design remains one of the most accurate calendars ever created. Their observations helped transform the sky from myth into mathematics.</p>
<p>Fast forward to the 20th century: rockets finally carried us closer to the stars. Before humans flew, scientists sent animals — monkeys, dogs, and chimpanzees — to learn how living bodies react in space. Then, in 1961, Yuri Gagarin became the first human to orbit Earth, calling out, “I see Earth… it is beautiful.” After that the space race started and eight years later, humans walked on the Moon for the very first time.</p>
<p>Today, rockets like SpaceX’s Falcon Heavy and Starship launch spacecraft toward planets, asteroids, and icy moons. Future missions will explore worlds like Europa, a moon hiding a massive ocean beneath its frozen surface — one of the best places to search for life.</p>
<p>From ancient stargazers to Persian astronomers, to modern rocket scientists, one thing has always stayed the same: Humans look up. We wonder. And we explore. And the next chapter belongs to students like you.</p>
<div class="footer">Dr. Super & Spark — Powered by ChatGPT</div>
</div>
<script>
const voiceSelect = document.getElementById("voiceSelect");
const storyText = document.getElementById("storyText");
const speakBtn = document.getElementById("speakBtn");
const pauseBtn = document.getElementById("pauseBtn");
const resumeBtn = document.getElementById("resumeBtn");
const stopBtn = document.getElementById("stopBtn");
const rate = document.getElementById("rate");
const pitch = document.getElementById("pitch");
const rateVal = document.getElementById("rateVal");
const pitchVal = document.getElementById("pitchVal");
rate.addEventListener("input", () => rateVal.textContent = rate.value);
pitch.addEventListener("input", () => pitchVal.textContent = pitch.value);
let voices = [];
let utterance = null;
function isEnglishVoice(v) {
const lang = (v.lang || "").toLowerCase();
return lang.startsWith("en");
}
function loadVoices() {
voices = window.speechSynthesis.getVoices().filter(isEnglishVoice);
voiceSelect.innerHTML = "";
if (!voices.length) {
const opt = document.createElement("option");
opt.textContent = "No English voices found";
voiceSelect.appendChild(opt);
return;
}
voices.forEach((v, i) => {
const opt = document.createElement("option");
opt.value = i;
opt.textContent = `${v.name} (${v.lang})`;
voiceSelect.appendChild(opt);
});
const preferred = voices.findIndex(v => (v.lang || "").toLowerCase().startsWith("en-us"));
if (preferred >= 0) voiceSelect.value = preferred;
}
if ("speechSynthesis" in window) {
loadVoices();
window.speechSynthesis.onvoiceschanged = loadVoices;
} else {
voiceSelect.innerHTML = "<option>Speech synthesis not available</option>";
}
function stopSpeaking() {
window.speechSynthesis.cancel();
utterance = null;
}
speakBtn.addEventListener("click", () => {
stopSpeaking();
const text = storyText.value.trim();
if (!text) return;
utterance = new SpeechSynthesisUtterance(text);
const v = voices[parseInt(voiceSelect.value || "0", 10)];
if (v) utterance.voice = v;
utterance.rate = parseFloat(rate.value);
utterance.pitch = parseFloat(pitch.value);
utterance.lang = (v && v.lang) ? v.lang : "en-US";
window.speechSynthesis.speak(utterance);
});
pauseBtn.addEventListener("click", () => window.speechSynthesis.pause());
resumeBtn.addEventListener("click", () => window.speechSynthesis.resume());
stopBtn.addEventListener("click", stopSpeaking);
</script>
</body>
</html>