Creating Databases applications for the Web Basic HTML review, forms Preview: Server side vs client side Flash HW: Review HTML forms and FLASH examples

Caution Chicken and egg problem: what to explain first Try some skipping ahead to motivate explanations.

Hypertext markup language Interpreted by browser on client Displays information Gathers information to send to server (PHP) –Most typical way: HTML form – element with extra information in query string (explained soon)

HTML review Ordinary text plus tags. Tags are singletons or pairs template for all html files:......

HTML examples My summer vacation Creating an html file requires attention to detail …

HTML Tables Used to display data from database! Often, [your] PHP code will generate the table tags: tr, td

HTML tags referencing files Continue

Reprise Information entered into form will be sent to the file indicated in the action attribute

Structure CLIENT Browser (Firefox): Requests URL SERVER PHP interpreter SERVER DBMS (MySQL) Build HTML page

Notes method=get produces the so-called query string. We can also generate query strings using php OR as direct call –Direct calls can be done for testing method=post sends data another way (via HTTP headers). Benefit is that less is revealed to user. Think of it also as lack of clutter. Older practice in PHP could refer to POST or GET or cookies or variables in the same way. Current suggested practice for PHP is to distinguish these. Alternative: action="mailto: address"

Query string Name = value pairs –Name is the name of the element –Value is what the person entering data into the form types in Query string will be URL?name1=value1&name2=value2… Blanks will be changed to +. May be other substitutions. –Special characters, including blanks can require special handling at php end.

First Name Last Name Choose one New Media Math/Computer science Other LAS Conservatories Continuing education placeholder

Script referred to by action The php file probably will contain html and code that produces html. –This is reason to know the tags. The php code will be inside special delimiters –REPEAT WARNING: tricky syntax. Much fussing about quotation marks. –more on this later.

After clicking send Browser goes to the file indicated by the action parameter The URL for this is the following (one long string, not split into multiple lines): file:///X|/accepts_data.htm?fname=J eanine&lname=Meyer&category=newmed ia

Second example: file:///X|/accepts_data.htm?fname=J ohn&lname=Smith&category=arts

One more example that doesn't do anything! Generate query string Coffee shop Coffee Hot Cocoa Chai Tall Grand Super Name:

Flash Timeline Actions Timeline can contain movie clip instances that have their own time line. –For example: Chasing Bo moves around Bo that [may] be animated by its own frame-by- frame animation

Flash events Mouse events Interface (for example, radio button) URL request completion event For all events, the setting of the handler is done using object.addEventListener(name of event, name of function to respond to event)

Flash The two Flash examples use php but not MySQL. They do need to be tested on the server! Demonstrate –Election –Catching Bo

Flash /Actionscript ActionScript 3.0 many facilities for obtaining information from user Send (invoke) other file using –URLRequest –URLVariables –URLLoader

Set up Flash objects var variables:URLVariables = new URLVariables(); var request:URLRequest = new URLRequest(); var loader:URLLoader = new URLLoader(); request.url = "change.php"; Equivalent to setting action in HTML

Passing information Defines any number of [programmer defined] properties of the variables object variables.who = …. Set the request object to use the variables object request.data = variables; Issue the request loader.load(request); Set up a listener to act when request is complete loader.addEventListener(Event.COMPLETE, completeWriting); Some function

Catching Bo Premise is that when player catches Bo, she/he can send a message to someone. Uses URLRequest and URLVariables objects –Defines.body,.to,.from,.subject properties of the variables object Doesn't use a URLLoader object Constructs message

ActionScript variables.body="I caught Bo on "+caught+ ". Visit "+gameURL; variables.to=toaddress.text; variables.subject="news"; variables.from = fromaddress.text; request.data = variables; request.method=URLRequestMethod.POST; sendToURL(request);

Cautions Need to be aware of where (client or server) code is executed And timing: some things are done immediately, and some need time to complete. –Chasing Bo: didn't need to wait for completion. –NOTE: did NOT check for success. Could have been a bad address.

Flash source If time: Examine code for Catching Bo Look at send .php NOTE: generally, cannot examine php source. Try – –The source you see is the HTML only.

<?php $to = $_POST['to']; $subject = $_POST['subject']; $body = $_POST['body']; $headers = "From: ". $_POST['from']; if (mail($to, $subject, $body,$headers)) { echo("Your message was sent"); } else { echo("There was a problem."); } /* the error messages will not appear if called from Flash application, but will appear if called from html */ ?>

Homework Write HTML script with a form with –several input elements –Use method=get –Use placeholder action=dummy.html –Submit element Test (there will be an error message since dummy.html does not exist!). Look at the query string generated Examine & build your own Flash example, for sending Catching Bo –Create and upload send .php. Create.fla file; Publish and upload.html and.swf files. Does not exist