eaglelandsonce/Python_Week_1
0
1<!DOCTYPE html>2<html lang="en">3<head>4 <meta charset="UTF-8" />5 <meta name="viewport" content="width=device-width, initial-scale=1.0"/>6 <title>Week 1 Python Questions</title>7 <style>8 body{font-family:Arial,sans-serif;display:flex;flex-direction:column;align-items:center;background:#f0f0f0;margin:0}9 h1{color:#0078D4}10 #game-board{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:100px;gap:2px;margin:20px 0;background:#000;border:4px solid #000;width:90%}11 .category{background:#005a9e;color:#fff;font-weight:bold;display:flex;justify-content:center;align-items:center;text-align:center;font-size:18px;border:1px solid #000}12 .card{background:#0078D4;color:#fff;display:flex;justify-content:center;align-items:center;font-size:16px;font-weight:bold;cursor:pointer;border:1px solid #000;text-align:center;transition:background-color .3s}13 .card:hover{background:#005a9e}14 .card.disabled{background:#ccc;cursor:default}15 #question-display{width:80%;text-align:center;margin-bottom:20px}16 #score{font-size:24px;font-weight:bold;color:#0078D4}17 .answer-container{display:flex;flex-wrap:wrap;justify-content:center;margin-top:20px}18 .answer-btn{margin:5px;padding:10px 15px;font-size:18px;cursor:pointer;text-align:center;border:2px solid #005a9e;border-radius:5px;background:#0078D4;color:#fff;font-weight:bold;transition:background-color .3s,color .3s}19 .answer-btn:hover{background:#005a9e;color:#f0f0f0}20 .answer-btn.disabled{background:#ccc;color:#666;cursor:not-allowed}21 .feedback{margin-top:10px;font-size:18px;font-weight:bold}22 .question-text{font-size:24px;line-height:1.5;text-align:left;background:#fff;border:1px solid #ddd;padding:14px;border-radius:8px;white-space:pre-wrap}23 .dd-badge{display:inline-block;margin-bottom:10px;padding:6px 12px;font-weight:bold;border-radius:999px;border:2px solid #ff9800;color:#ff9800;background:#fff6e6}24 </style>25</head>26<body>27 <h1>Week 1 Python Questions</h1>28 <div id="game-board">29 <div class="category">Variables & Data Structures</div>30 <div class="category">Operators</div>31 <div class="category">Conditional Statements</div>32 <div class="category">Looping Statements</div>33 <div class="category">Functions</div>34 </div>35 <div id="question-display"></div>36 <div id="score">Score: 0</div>37 38 <script>39 const categories = [40 "Variables & Data Structures",41 "Operators",42 "Conditional Statements",43 "Looping Statements",44 "Functions"45 ];46 47 // ✅ Clean, verified Q&A set (each has exactly 3 choices; correct index points to the right one)48 const questions = [49 // Variables & Data Structures50 [51 {52 q: "Which statement best describes Python variables?",53 a: [54 "They are names bound to objects; names can be rebound",55 "They must be declared with a type keyword before use",56 "They can only reference numbers and strings"57 ],58 correct: 059 },60 {61 q: "Which Python data structures are mutable?",62 a: ["List and Dictionary", "Tuple and String", "Set and Tuple"],63 correct: 064 },65 {66 q: "Which slice returns ['four', 5] from my_list = [1, 'two', 3.5, 'four', 5, 6.0, 'seven', 8.2]?",67 a: ["my_list[3:5]", "my_list[2:4]", "my_list[-4:-2]"],68 correct: 069 }70 ],71 // Operators72 [73 {74 q: "Which pairing correctly matches Python operators with operations?",75 a: ["+ for addition, - for subtraction", "** for modulus, % for exponentiation", "% for division, / for multiplication"],76 correct: 077 },78 {79 q: "What is the result of 2 + 3 * 4 in Python?",80 a: ["14", "20", "24"],81 correct: 082 },83 {84 q: "Which operator performs exponentiation in Python?",85 a: ["**", "^", "exp()"],86 correct: 087 }88 ],89 // Conditional Statements90 [91 {92 q: "What does 'elif' do in Python?",93 a: [94 "Tests another condition if previous tests were False",95 "Runs when the preceding 'if' was True",96 "Is mandatory after every 'if'"97 ],98 correct: 099 },100 {101 q: "Which keyword begins the fallback block when no prior condition was True?",102 a: ["else", "otherwise", "default"],103 correct: 0104 },105 {106 q: "Given: if x > 10: print('Greater')\nelif x == 10: print('Equal')\nelse: print('Less')\nWhat prints when x == 10?",107 a: ["Equal", "Greater", "Less"],108 correct: 0109 }110 ],111 // Looping Statements112 [113 {114 q: "Which is true of Python's 'for' loop?",115 a: [116 "It iterates over items of an iterable",117 "It repeats while a condition is True",118 "It requires a manual counter only"119 ],120 correct: 0121 },122 {123 q: "What does this print?\nfor i in range(1, 4):\n print(i, end=' ')",124 a: ["1 2 3 ", "0 1 2 ", "1 2 3 4 "],125 correct: 0126 },127 {128 q: "Best loop for iterating a list when the number of passes is known?",129 a: ["for loop", "while loop", "do-while loop"],130 correct: 0131 }132 ],133 // Functions134 [135 {136 q: "Primary purpose of functions in Python?",137 a: [138 "Encapsulate reusable logic into named blocks",139 "Declare compile-time constants",140 "Only execute once per program"141 ],142 correct: 0143 },144 {145 q: "How do you define a function?",146 a: ["def my_func(params):", "function my_func(params):", "define my_func(params):"],147 correct: 0148 },149 {150 q: "Which statement about 'return' is false?",151 a: [152 "Every function must include a 'return' statement",153 "A function can return multiple values",154 "A function may have multiple 'return' paths"155 ],156 correct: 0157 }158 ]159 ];160 161 let score = 0;162 const totalCards = 15;163 let answeredCards = 0;164 const gameBoard = document.getElementById("game-board");165 const questionDisplay = document.getElementById("question-display");166 const scoreDisplay = document.getElementById("score");167 168 // ⚖️ Even distribution of correct positions (0..2) across 15 questions169 const correctPositions = (() => {170 const arr = Array.from({ length: totalCards }, (_, i) => i % 3); // five of each171 for (let i = arr.length - 1; i > 0; i--) {172 const j = Math.floor(Math.random() * (i + 1));173 [arr[i], arr[j]] = [arr[j], arr[i]];174 }175 return arr;176 })();177 178 // 🧪 Tiny validator: logs distribution counts so you can confirm (should be {0:5,1:5,2:5})179 (function validateDistribution() {180 const counts = {0:0,1:0,2:0};181 correctPositions.forEach(p => counts[p]++);182 console.log("Correct answer position distribution:", counts);183 })();184 185 // 🎯 DAILY DOUBLE: pick exactly one card index (0..14)186 const dailyDoubleIndex = Math.floor(Math.random() * totalCards);187 188 // Memo for per-question permuted choices189 const questionMeta = new Map(); // "c-d" -> { choices:[...3], correctIndex, isDailyDouble, valueMultiplier }190 function qIndex(category, difficulty) {191 return category * 3 + difficulty; // 0..14192 }193 194 function createBoard() {195 for (let row = 0; row < 3; row++) {196 for (let col = 0; col < 5; col++) {197 const card = document.createElement("div");198 card.className = "card";199 card.textContent = "$" + (row + 1) * 100;200 card.onclick = () => showQuestion(col, row, card);201 gameBoard.appendChild(card);202 }203 }204 }205 206 function prepareChoices(category, difficulty) {207 const key = `${category}-${difficulty}`;208 if (questionMeta.has(key)) return questionMeta.get(key);209 210 const q = questions[category][difficulty];211 const baseChoices = q.a.slice(); // exactly length 3212 const origCorrect = q.correct;213 214 // Start with a random permutation215 const idxs = [0, 1, 2];216 for (let i = idxs.length - 1; i > 0; i--) {217 const j = Math.floor(Math.random() * (i + 1));218 [idxs[i], idxs[j]] = [idxs[j], idxs[i]];219 }220 221 // Ensure the correct answer ends up at the prescribed position222 const targetPos = correctPositions[qIndex(category, difficulty)];223 const currentPosOfCorrect = idxs.indexOf(origCorrect);224 if (currentPosOfCorrect !== targetPos) {225 const swapIdx = idxs[targetPos];226 idxs[targetPos] = origCorrect;227 idxs[currentPosOfCorrect] = swapIdx;228 }229 230 const choices = idxs.map(i => baseChoices[i]);231 const correctIndex = targetPos;232 233 // Daily Double flag and value multiplier for this card234 const isDD = qIndex(category, difficulty) === dailyDoubleIndex;235 const valueMultiplier = isDD ? 2 : 1;236 237 const meta = { choices, correctIndex, isDailyDouble: isDD, valueMultiplier };238 questionMeta.set(key, meta);239 return meta;240 }241 242 function showQuestion(category, difficulty, cardElement) {243 if (cardElement.classList.contains("disabled")) return;244 245 const q = questions[category][difficulty];246 const { choices, isDailyDouble } = prepareChoices(category, difficulty);247 248 const ddBadge = isDailyDouble249 ? `<div class="dd-badge">🔥 DAILY DOUBLE!</div>`250 : "";251 252 const answerHtml = choices253 .map((answer, idxChoice) =>254 `<button class="answer-btn" onclick="checkAnswer(${category}, ${difficulty}, ${idxChoice})">${answer}</button>`255 )256 .join("");257 258 const baseValue = (difficulty + 1) * 100;259 const displayValue = isDailyDouble ? baseValue * 2 : baseValue;260 261 questionDisplay.innerHTML = `262 ${ddBadge}263 <h2>${categories[category]} for $${displayValue}</h2>264 <div class="question-text">${q.q}</div>265 <div class="answer-container">${answerHtml}</div>`;266 267 cardElement.classList.add("disabled");268 cardElement.style.backgroundColor = "#cccccc";269 answeredCards++;270 }271 272 function checkAnswer(category, difficulty, selectedIndex) {273 const key = `${category}-${difficulty}`;274 const meta = questionMeta.get(key);275 const isCorrect = selectedIndex === meta.correctIndex;276 const baseValue = (difficulty + 1) * 100;277 const value = baseValue * meta.valueMultiplier;278 279 document.querySelectorAll(".answer-btn").forEach(btn => {280 btn.disabled = true;281 btn.classList.add("disabled");282 });283 284 if (isCorrect) {285 score += value;286 questionDisplay.innerHTML += `<p class="feedback" style="color:green">Correct! You earned $${value}.</p>`;287 } else {288 score -= value;289 const correctText = meta.choices[meta.correctIndex];290 questionDisplay.innerHTML += `<p class="feedback" style="color:red">Wrong! You lost $${value}. Correct answer: ${correctText}</p>`;291 }292 293 scoreDisplay.textContent = "Score: " + score;294 if (answeredCards === totalCards) endGame();295 }296 297 function endGame() {298 questionDisplay.innerHTML = `<h2>Game Over!</h2><p>Your final score is $${score}.</p>`;299 }300 301 window.checkAnswer = checkAnswer;302 createBoard();303 </script>304</body>305</html>306