Resources

//HTML: Basics
//HTML: Lists
//HTML: Tables
//HTML: Two kinds of tables

//INIT: Datatypes

//STYLE: Capitalizing tags
//STYLE: Choosing an editor
//STYLE: Formatting code with tab indents

The role of Otto the Robot will now be played by...

Let's watch an introductory video about organizing your thoughts around a problem:

Hidden Agenda

• Show your brand new HTML skills
• Play nicely with other humans
• See how dang picky computers are in one big overworked metaphor
• Program with great style
• Transform all students into mindless robots! MWAAAAAH HAAAA HAAAAAA!

Saving your work

You will discuss your solution through an HTML report that each of you will create individually.

Save the empty template as "1.04H-OttoTheRobot-LastName.html" in your Computer Programming 12 directory.

Evaluation

• ___/10 — HTML: Creates the following correctly using HTML tags:
  • a heading
  • a paragraph
  • some strong text
  • an image
  • an ordered or unordered list
  • list items correctly
  • a table (Hmmm... I wonder where I should put it?)
  • table rows
  • table category headers cells
  • table data cells
• ___/10 — PROCESS: Completion and quality of answers to questions
• ___/10 — STYLE: Indentation, filenames, lower-case HTML tags
  • change log
  • author's name
  • correct filename
  • lowercase html tags
  • correct indentation

Working in groups of 2-4 students, complete the problem solving process to solve the following problem: getting a student from our classroom (sitting in a chair) to the library in the most efficient way. The student must be sitting in a chair in the library (or alternately, standing in front of the library doors) for the solution to be complete.

Hints

• You will be required to gather other information such as hall distances, number of steps, and location of rooms
• You may want to break down the entire solution into smaller parts (object oriented analysis)

Problem solving process

1. Understand the problem (collect info to gather a knowledge base)
2. Identify alternative solutions
3. Select the best solution
4. List the instructions to get to the cafeteria
5. Evaluate your solution (test your steps)

OttoCode® — instructing Otto the Robot

The person in your group playing Otto the Robot can only understand these instructions:

• STD — Stand
• SIT — Sit
• FWD — Take a step forward (must be standing)
• DWN — Take step down a stair (must be standing)
• UP — Take a step up a stair (must be standing)
• RT — Turn right
• RPT(X) — Repeat instructions x times (x can be any number) — example: RPT(3) FWD
• Otto always begins in a seated position

For example: if you wanted Otto to stand up, turn right, walk four steps forward, then sit down, the OttoCode® would be:

1. STD
2. RT
3. RPT(4) FWD
4. SIT

The assignment

1. Create the empty framework of your HTML report
2. Gather together a team of 2-4 students and start answering questions
3. Break your solution down into 5-9 chunks, and then write out the OttoCode® for each chunk
4. Do a trial run of your solution with a student volunteering to be Otto
5. Complete your HTML report individually and then hand it in

Code an HTML document that looks more or less like this:

Extend & expand

• Can you organize your list of commands into an HTML table?
• Please find a gorgeous picture of Otto to add to your report