Weeks 6 - 7

Assignment #3 - due Thursday, February 26th.

Using HTML, JavaScript and/or CSS, but not using the HTML <select> tag, make a "drop-down" object that behaves as much as possible like a <select>. When the user selects a particular option, append its value to an event log (a textarea or div tag).

Assignment #4 -- widgets (to be worked on individually and concurrently with other assignments)

Don't forget --  final projects

An HTML table as an array of objects

Screen partitioner

Editing and displaying JavaScript, HTML, and SVG

Beginning with SVG

Overview

The very basics

More adventurous stuff

Dailey's book (under revision)

Other SVG topics

Disabling text selection

Handling keystrokes in SVG -- moving toward a textarea

another suggestion for a text area: lay the text along a dynamically defined path consisting of lines that fill a region.

Putting things along a bezier curve.

An example of radio buttons

Putting a bunch of rectangular click-things (button-like objects) across the bottom of the screen

Measuring things

Announcing source code of an SVG object

A 3D SVG interface

New stuff

A standard template involving namespaces, script, tags, and DOM calls.

The simplest SVG document (working across browsers)

GetCTM -- finding the bounding box after transformations

creating and dragging (simplified code)

creating and dragging (manually or automatically)

Others at http://srufaculty.sru.edu/david.dailey/svg/SVGAnimations.htm

 

XML oddity:

If you try to put the following in an SVG file:

<script> for (i=0;i<12;i++) {somecode()}</script>

then browsers will not be happy. 

 the preferred solution:

<script> <![CDATA[ for (i=0;i<12;i++) {somecode()} //]]> </script>

Id est, put CDATA descriptor around the material inside the script tag. It convinces the browser not to interpret the stuff in the middle.