Flash & JavaScript Mariela Hristova October 19, 2004 INF 385E – Fall 2004 – School of Information

Agenda Flash basics, uses, examples, pros & cons JavaScript basics, uses, examples, pros & cons Sorry for standing, but it helps me with timing.

Flash

Background Flash content is Animated Interactive Efficient Complex It can be found On the Web In PlayStation consoles In ATMs In handheld devices

Software Macromedia MX Flash FLASHtyper SWiSH MIX FX + Various tools on the Web

Functionality Design Graphics creation Timeline for Animation Symbols for Buttons Sound effects Code Action Scripts Event Handlers Arrays Built-in Objects Publishing Options: Flash Player format, SWF format, HTML.

Integration with HTML Embedded in HTML Uses both OBJECT and EMBED for browser compatibility Text for Flash content could come from a separate file.

Uses & Examples Navigation Animation Headers Web site intros Interaction Interface sliders color selection function icons Games Free Range Graphics - concept animation for publicity and activism

Pros & Cons Pros Works well with HTML Great for internet- based applications Standards compliant Improved usability Cons Long loading times Interferes with search engines Breaks the BACK button Flawed accessibility Requires Flash Player

JavaScript

Background created by Netscape in late 1995 to allow for interactive Web pages JavaScript is different from Java

Definition JavaScript is scripting language that is cross-platform object-oriented integrated / embedded in HTML Core Objects Array Date Math Language Elements Operators Control Structures Statements

Extension: Client vs. Server Client-Side Objects to control a browser Document Object Model – DOM Server-Side Communication with a relational database File manipulation on a server Continuity of information for applications

Events & Actions Basic Attributes ONLOAD Event Attributes onMouseOver onMouseOut onClick F: C: <input type="button" name="calc" value="calc" onClick="this.form.C.value=(5/9)* (this.form.F.value-32)">

Objects function message() { alert("This alert box was called with the onload event") } Arrays Strings Browser objects Document objects Functions defined in HEAD or externally called in the BODY

Uses & Examples Navigation Animation Calendars Dynamic content Syndication Form verification & control Browser control: mouse extras, pop-up windows, scroll bars, etc. Dynamic Drive Dynamic Drive DHTML & JavaScript Code library Open Cube DHTML Menu / JavaScript Menu Developer

Pros & Cons Pros Saves bandwidth Easy to implement Adds interaction Instant gratification Works well with HTML Cons Java plug-in required Browser-specific DOM implementations Disorienting if overdone Dubious security

Conclusion Dynamic Content and Functionality What choices do we have?

References Flash Tutorial. (2004). W3Schools. Retrieved on October 16, 2004, from JavaScript Overview. (n.d.). Enterprise Edition Server-Side JavaScript Guide. Retrieved on October 16, 2004, from 10/intro.htm#13092http://docs.sun.com/source/ /intro.htm#13092 Nielsen, Jakob. (2000). Flash: 99% Bad. Useit.com. Retrieved on October 16, 2004, from Thiele, James. (2002). Hands-On JavaScript: Overview. Retrieved on October 15, 2004, from Raynolds, Mark, et al. (1996). Special Edition Using JavaScript. Retrieved on October 15, 2004, from