Weeks 10 - 12

Form elements review

Conditionals:

guess the magic word:  if (q=="xxx") happy() else unhappy()

Here's a place to try things out.

Loops:

how many copies?:    i=0;s=""; while (i++<q) {s=s+"copy "}

simpler version?

Make your script determine when the puzzle has been solved. That is: whenever the picture is reassembled  by the user (that is, all six pieces are adjacent to one another in the order they were originally in your picture -- you may assume that the "blank" is at the extreme right of the picture):

1. first congratulate the user with an alert box, telling them how many clicks it took them to solve the puzzle,
2. then let the pictures revert to the original "scrambled" order.

Here's a little something which might help with swapping. something I'll talk about one day

Here are some of the things I demonstrated in class:

•  hardest parts,  -- shows strategy for detecting solution, together with strategy for knowing if an image has correct src (based on technique 3. below)

• swap to red -- annotated example that shows how the first swap works to swap contents of last position with any image clicked upon

• copycopy -- simple concatenation (may help to explain simple loop example here)

Issues:

1. How to let a function know which image was clicked? 

   <span onclick="f(7)"><img src="pic7.jpg"></span>

2. How to put a new image at that location? 

   function f(x){document.images[x].src="new.jpg"}

3. How to know if an image is where you want it to be?

   See strategies, below.

    

4. How to do something to all the images? 

   while (i++<numberofimages){document.images[i].src="new.jpg"}

5. How to restore the scrambled order?

   a. 
   document.images[1].src="pic5.jpg"; 
   document.images[2].src="pic3.jpg";
   document.images[3].src="pic6.jpg";
   etc.

   or

   b. 
   A=new Array(5,3,6,2,1,7,4);
   while (i++<numberofimages){document.images[i].src="pic"+A[i]+"jpg"}

1. Load images in "solved" order first then determine resolved file addresses
2. Use string manipulation to pull off only the relevant characters
3. Remember which image is where through an array

New stuff for coming weeks:

random numbers, (teleology, mechanism and pragmatism) and evaluating a random number generator