Upgraded typing game, chat backend, and main index files #1516

TacticalReader · 2025-09-22T10:59:47Z

Description

Please include a summary of the changes and the related issue. Please also include relevant motivation and context.

Fixes # (issue)

Type of change

Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds functionality)
Breaking change (fix or feature that would cause existing functionality to not work as expected)
This change requires a documentation update

TacticalReader · 2025-09-22T11:01:31Z

@microsoft-github-policy-service agree

TacticalReader

Review of Changes: Pull Request #1516 – "Upgraded typing game, chat backend, and main index files"

Major Components Updated:

Typing Game (4-typing-game/solution/index.*):
- Improved CSS for layout, responsiveness, and design elements.
- HTML structure refactored for clarity and accessibility.
- JavaScript logic upgraded for better gameplay, flow, and feedback.
Chat Project Backend (9-chat-project/solution/backend/python/api.py, llm.py):
- API endpoints and chat logic streamlined for reliability.
- Refactored backend code: cleaner functions, improved modularity, possibly optimized or bug-fixed.
- LLM logic updated for better message handling and context tracking.
Core Files (index.css, index.html):
- UI/UX enhancements for landing page.
- Better styling, new elements, and structural changes.

Educational Content Improvements:

Numerous assignment and README files (mainly for lessons/chapters) rewritten for clarity:
- More descriptive assignment instructions for HTML, CSS, and JavaScript basics.
- Enhanced rubrics—examples, structure, and expectations are clearer.
- Modernized assignment objectives (using Flexbox/Grid, semantic HTML, etc.).

Code Quality Observations:

Added Font Awesome (icon library) for rich navigation and UI elements.
Improved semantic HTML, accessibility features, and code comments.
All changes appear non-breaking, focusing on enhancement without disrupting existing functionality.

Suggestions for Further Improvement:

Test the updated game and chat app across browsers and devices to verify responsiveness.
Consider adding automated tests (unit/smoke) for backend APIs if not present.
Document new features in an updated README so contributors can utilize and extend easily.
Ensure assignment examples align with modern standards and best practices.

Copilot

Pull Request Overview

Comprehensive UI/UX, accessibility, and backend refactors across multiple lesson projects. Key updates include adding theming, icons, richer layouts, expanded backend API with logging, and feature enhancements to the typing, banking, chat, and space game demos.

Introduces extensive new HTML/CSS (navigation, dialogs, theming, responsiveness, a11y attributes).
Adds backend robustness (LLM wrapper, health/test endpoints, logging) but also introduces security and HTML/JS integration issues.
Refactors mini‑apps (typing game, space game, banking) with new logic; several structural and semantic regressions were introduced (invalid HTML, missing scripts, disabled input not re‑enabled, unsafe CORS, over‑permissive logging).

Reviewed Changes

Copilot reviewed 24 out of 24 changed files in this pull request and generated 16 comments.

Show a summary per file

File	Description
index.html	Added external fonts & analytics script modifications; introduced invalid placement of DOCTYPE and link plus malformed script content.
index.css	Large design system and component styles added; contains duplicated selectors.
for-teachers.md	Expanded educator instructions; minor redundancy in link text.
9-chat-project/solution/frontend/index.html	Accessibility, theming, and UI controls added for chat app.
9-chat-project/solution/backend/python/llm.py	Added logging, env validation, configurable model; potential sensitive prompt logging.
9-chat-project/solution/backend/python/api.py	Added structured JSON endpoints and error handling; permissive CORS & debug enabled.
8-code-editor/1-using-a-code-editor/README.md	Rewritten lesson content with expanded structure.
7-bank-project/solution/styles.css	Full redesign with tokens, theming, responsiveness.
7-bank-project/solution/index.html	Reworked SPA templates with accessibility and modal patterns.
7-bank-project/solution/app.js	Major refactor: routing, state mgmt, formatting, currency/date utilities.
6-space-game/solution/index.html	Rebuilt game shell with HUD, dialogs, controls; style tag misplacement.
6-space-game/solution/app.js	Completely new game engine logic (loop, input, entities, scoring).
6-space-game/2-drawing-to-canvas/solution/index.html	Enhanced themed page but removed script inclusion and missing closing body tag.
6-space-game/2-drawing-to-canvas/solution/app.js	Refactored drawing helpers and enemy layout logic.
4-typing-game/solution/index.js	Modernized typing game logic; missed re‑enabling disabled input on restart.
4-typing-game/solution/index.html	Added icons, duplicate body content and inline date/time script causing structural issues.
4-typing-game/solution/index.css	Full new UI styling layer.
3-terrarium/solution/style.css	Added navigation, footer, responsive enhancements.
3-terrarium/solution/index.html	Added nav, header/footer; potential invalid Font Awesome icon usage.
Multiple assignment *.md files	Expanded and clarified assignment instructions and rubrics.

Comments suppressed due to low confidence (1)

4-typing-game/solution/index.js:1

After finishing a round the input is disabled (line 72), but startGame does not re-enable it; subsequent starts will fail. Add typedValueElement.disabled = false; at the beginning of startGame.

// Typing Game - Modern ES6+ Version

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

Copilot · 2025-10-03T08:11:16Z

index.html

+<!-- Add Google Fonts -->
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet"><!DOCTYPE html>


The DOCTYPE must be the very first element in the document, and the element belongs inside . Also the DOCTYPE is appended to the end of the tag on the same line, which is invalid. Move to the top (line 1) and relocate the into the section on its own line.

Copilot · 2025-10-03T08:11:17Z

index.html

+    (function(c,l,a,r,i,t,y){    <!-- Add Font Awesome -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">


HTML comments and a tag have been inserted inside a <script> block, breaking the JavaScript IIFE and resulting in a syntax/runtime error. Remove the HTML comment and move the <link rel="stylesheet" ...> element into (outside the <script>).

Copilot · 2025-10-03T08:11:17Z

index.css

+body {
+  font-family: 'Inter', Arial, sans-serif;
+}
+/* Body and Typography */
+body {
+  font-family: 'Inter', Arial, sans-serif;
+  background: #f7f8fa;
+  color: #222;
+  margin: 0;
+  padding: 0;
+}


Duplicate body selectors (lines 4–6 and 8–14) repeat the font-family declaration. Remove the first block or consolidate into a single body rule to avoid confusion.

Copilot · 2025-10-03T08:11:17Z

index.css

 .app-nav ul li {
  width: max-content;
+}


Duplicate .app-nav ul li rule appears twice; keep a single definition to reduce redundancy.

Copilot · 2025-10-03T08:11:17Z

index.css

+.app-nav ul li {
+  width: max-content;
+}
+


Duplicate .app-nav ul li rule appears twice; keep a single definition to reduce redundancy.

Suggested change

.app-nav ul li {

width: max-content;

}

Copilot · 2025-10-03T08:11:20Z

6-space-game/2-drawing-to-canvas/solution/index.html

+    <i class="fa-solid fa-star"></i> Score: <span id="score">0</span>
+    <i class="fa-solid fa-heart"></i> Lives: <span id="lives">3</span>
+  </div>
+  <canvas id="canvas" width="1024" height="768"></canvas>


The closing tag is missing and the original <script src="app.js"></script> was removed, so the game logic will not run. Reintroduce the script tag before and add a proper closing tag.

Suggested change

<canvas id="canvas" width="1024" height="768"></canvas>

<canvas id="canvas" width="1024" height="768"></canvas>

<script src="app.js"></script>

</body>

Copilot · 2025-10-03T08:11:20Z

4-typing-game/solution/index.html

+				<!-- ...existing code... -->
+		<body>
+			<h1>
+				<i class="fas fa-keyboard"></i> Practice your typing
+			</h1>


A second tag and duplicate heading/content are nested inside the existing body, creating invalid HTML and duplicated UI. Remove the duplicate block and consolidate the datetime section into the original structure.

Copilot · 2025-10-03T08:11:20Z

4-typing-game/solution/index.html

+		 <script>	
+						// ...existing code...
+
+			function updateDateTime() {


Inline script logic duplicates functionality and is embedded after the main script include; prefer moving this datetime script into a separate JS module or the existing index.js to keep behavior consolidated and avoid scattered inline code.

Copilot · 2025-10-03T08:11:21Z

4-typing-game/solution/index.html

+			setInterval(updateDateTime, 60000);
+
+			// ...existing code...
+		 </script>


Inline script logic duplicates functionality and is embedded after the main script include; prefer moving this datetime script into a separate JS module or the existing index.js to keep behavior consolidated and avoid scattered inline code.

Copilot · 2025-10-03T08:11:21Z

3-terrarium/solution/index.html

-		<div id="page">
-			<h1>My Terrarium</h1>
+        <header>
+            <h1><i class="fas fa-jar"></i> My Terrarium</h1>


[nitpick] The icon class 'fa-jar' may not exist in the loaded Font Awesome version (could render as a missing icon). Verify the icon name (e.g., 'fa-jar-wheat' or another available icon) or remove it to avoid broken UI.

Suggested change

<h1><i class="fas fa-jar"></i> My Terrarium</h1>

<h1><i class="fas fa-seedling"></i> My Terrarium</h1>

Upgraded typing game, chat backend, and main index files

Upgraded typing game, chat backend, and main index files

6b4769e

TacticalReader commented Sep 22, 2025

View reviewed changes

TacticalReader added 3 commits September 22, 2025 16:47

Update index.html

490646a

Update app.js

91706b8

Update index.html

5887b47

TacticalReader closed this Sep 22, 2025

TacticalReader reopened this Sep 22, 2025

TacticalReader added 10 commits September 22, 2025 17:13

Update index.html

0aebbee

Update styles.css

74ea0ca

Update app.js

b0b711d

Update index.html

9487e88

Update app.js

acaf91c

Update index.html

60efd3c

Update for-teachers.md

8796fdf

Update README.md

214f75c

Update README.md

86007bd

Update index.html

f0243c7

leestott requested a review from Copilot October 3, 2025 08:07

leestott approved these changes Oct 3, 2025

View reviewed changes

leestott merged commit 6934238 into microsoft:main Oct 3, 2025
1 check passed

Copilot AI reviewed Oct 3, 2025

View reviewed changes

vain-Liang pushed a commit to vain-Liang/Web-Dev-For-Beginners that referenced this pull request Oct 14, 2025

Merge pull request microsoft#1516 from TacticalReader/main

8498239

Upgraded typing game, chat backend, and main index files

		<!-- Add Google Fonts -->
		<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet"><!DOCTYPE html>

		(function(c,l,a,r,i,t,y){ <!-- Add Font Awesome -->
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">

	<h1><i class="fas fa-jar"></i> My Terrarium</h1>
	<h1><i class="fas fa-seedling"></i> My Terrarium</h1>

Upgraded typing game, chat backend, and main index files #1516

Upgraded typing game, chat backend, and main index files #1516

Uh oh!

Conversation

TacticalReader commented Sep 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Type of change

Uh oh!

TacticalReader commented Sep 22, 2025

Uh oh!

TacticalReader left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

TacticalReader commented Sep 22, 2025 •

edited

Loading