CS 330 Programming Class 3

1
CS 330 Programming Class 3

• Programming plan for 9/10/07
• Flanagan Ch 13 and 14
• Homework
• debugging OK?
• how do the sayings on the schedule page work?
• how might you modify sudoku?

2
The Web Browser Environment (13.1)

• 
  Idea hierarchy of objects (Figure 13-1, p. 238)

3
The Web Browser Environment (13.1)

• window
• the highest level object, everything is relative
  to it
• subsidiary objects document, frames, history,
  location, ...
• document
• the contents (an HTML document that is displayed
  in the window)
• Opening a new window
• function popup(mylink, windowname)
• window.open(mylink, windowname,
• 'width550, height300,
  resizable')
• return false
• or see http//aurora.wells.edu/cs330/330_sch.htm

4
Document

• The contents
• an HTML document that is displayed in the window
• properties window.document.lastModified
  (or
  document.lastModified)
• Other document properties
• forms
• e.g. window.document.forms0.element0
• or document.simpleForm.Number1
• (see forms.htm)
• anchors , links , images ...

5
Example

• _top and parent in footer.htm for my course
  pages
• ltlink href"cs06.css" rel"stylesheet"
  type"text/css"gt
• lthr /gt
• ltspan class"floatright"gt
• lta href"index.htm" target"_top"gtGo to CCS
  homelt/agtlt/spangt
• copy2007 Carol C. Shilepsky ltbr /gt
• ltemgt
• ltscript type"text/javascript"gt
• var date new Date(parent.document.lastModi
  fied)
• document.write('Last updated ',
  date.getMonth()1,
• '/',date.getDate(),'/',date.ge
  tFullYear())
• lt/scriptgt
• lt/emgt
• window_properties.htm. Why isn't a width change
  reflected in the table?

6
Other Windows Subsidiaries

• frames an array of the frames
• a page with three frames
• window.frame0 (or frame0)
• window.frame1
• window.frame2
• history where you have been
• location
• the current URL
• load a new screen with location.replace("xx.htm")
• navigator
• information about the browser
• old style write versions of the page for each
  browser
• less important as browsers become more
  standardized

0
1
2
7
JavaScript Role (13.1.4)

• Add behaviour to the content and its presentation
• calculate loan payments
• Make it easier to transmit information
• visual effects such as rollovers to guide input
• Selective content display
• digits in sudoku

8
Unobtrusive JavaScript (13.1.5)

• Not all browsers handle JavaScript well
• Goals
• separate JavaScript code from HTML markup (e.g.
  put functions in header)
• use "include" files
• graceful degradation (does it work with no
  JavaScript?)
• consider accessibility (some people cannot use a
  mouse, others cannot use the keyboard onchange
  versus onclick)

9
Chapter 14 Scripting Browser Windows

• 14.1 Timers
• code timed to execute at a specific time or
  intervals
• often it is initiated when the page is loaded via
  an attribute in ltbodygt or triggered by another
  event and executed at subsequent intervals
• timeout.htm
• more examples later
• 14.3 Testing Browser Capabilities
• a clumsy way to see if a feature is implemented
• if (window.feature)
• //use it
• else //alternate code
• see ccs home page

10
Chapter 14

• Text example 14-4.htm
• setInterval executes a function at specified
  intervals
• clearInterval cancels it
• note how everything is attached to the bounce
  object
• 14.5 Dialog Boxes windows methods that use
  pop-up boxes
• alert displays a message until user confirms
  (onload.htm)
• confirm (confirm.htm)
• expects confirmation (OK) or not (cancel)
• example select from versions of a page
  onLoadif confirm(Do you want a text p. 233
• prompt (prompt.htm)
• variableName prompt(displayed message)
• the text entered is assigned to variableName

11
Chapter 14

• 14.6 Scripting the Status Line
• windows properties for controlling the status
  line msg
• So far mouse over a hypertext link displays the
  URL
• User controlled Page contains a status command
• window.status message (or status message)
• defaultStatus property can also be set
• status.htm (may need to enable status bar in
  Firefox)
• 14.7 Error Handling (read)