Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 1 Introduction The JavaScript Programming Language Applets The Java Programming Language Guest Books Web Page Counters Server-Side Includes

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 2 Introduction JavaScript and HTML Event Handlers Sample JavaScript Code The JavaScript Programming Language

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 3 Scripting language Not Java Statements usually embedded in HTML code Simple, interpreted programming language The JavaScript Programming Language Introduction

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 4 Common uses: Alert boxes Color fades Dynamic-conversion form elements Information in status line Verify form input The JavaScript Programming Language Introduction

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 5 JavaScript-enabled browser LANGUAGE SRC.js The JavaScript Programming Language JavaScript and HTML

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 6 <!- - Begin hiding for browsers that cannot process JavaScript. Include JavaScript statements here. … Last JavaScript statement goes here. End hiding script. - -> The JavaScript Programming Language JavaScript and HTML

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 7 JavaScript and HTML onLoad Example <!- - Begin hiding for browsers that cannot support script. function ready(){ document.forms[0].elements[0].value=“Lets go!” } //Stop hiding script. -->

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 8 onMouseOver and onMouseOut onMouseOver When you move mouse over item, action triggered onMouseOut When you move mouse out of area, action triggered The JavaScript Programming Language Event Handlers

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 9 onMouseOver and onMouseOut <A HREF = “ASSIGNMENTS/assign.html” onMouseOver = “loadimage(‘01’,’GRAPHICS/4ON.GIF’); status = ‘Assignments’; return true;” onMouseOut = “loadimage(‘01’, `GRAPHICS/4OFF.GIF’); status = ‘ ‘; return true;”> <IMG SRC = “GRAPHICS/4OFF.GIF” WIDTH = “42” HEIGHT = “42” NAME = “01” ALT = “Assignments” BORDER = “0”> The JavaScript Programming Language Event Handlers

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 10 The JavaScript Programming Language Event Handlers When user mouses over image: Function call made to JavaScript routine loadimage() Assignments displayed in status line return true; indicates browser can return normally from processing JavaScript

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 11 The JavaScript Programming Language Event Handlers onClick and Alert Box <A HREF = “killface.html” onClick = “alert(‘Thanks for loading my page:Killface.’)”> Killface’s Page

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 12 The JavaScript Programming Language Event Handlers

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 13 Event Handlers onChange and Confirm Box, Prompt Box Confirm Box function question(yourname) { var name = yourname.value var theAnswer = confirm(“Are you really “ + name + “?”) (Or: var theAnswer = prompt(“What is your name”, “”)) }

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 14 <FORM ACTION = METHOD = “post”> Temperature Conversion Example Using JavaScript The JavaScript Programming Language Sample JavaScript Code

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 15 <INPUT TYPE = “text” NAME= “cels” VALUE = “0” SIZE= “3” MAXLENGTH = “3” onChange = “fahr.value = Math.round(10 * (1.8 * this.value + 32))/10;”> ° C equals The JavaScript Programming Language Sample JavaScript Code

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 16 <INPUT TYPE = “text” NAME= “fahr” VALUE = “32” SIZE= “3” MAXLENGTH = “3” onChange = “cels.value = Math.round(10 * (this.value - 32)/1.8)/10;”> ° F The JavaScript Programming Language Sample JavaScript Code

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 17 NAME = “fahr” fahr.value Math.round() The JavaScript Programming Language Sample JavaScript Code

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 18 Introduction HTML Applet Tags Java-Enabled Browsers Sample Applets Applets

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 19 “Little application” Primary features: Information is dynamic Can respond to input Program downloaded from Web server Runs locally Applets Introduction

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 20 Attributes: ALIGNALT CODECODEBASE HEIGHTHSPACE NAMEVSPACE WIDTH Applets HTML Applet Tags

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 21 Browsers that are text-only or not Java-enabled ignore applet tags Display messages Applets Java-Enabled Browsers

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 22 <APPLETCODE = “HiMom.class” HEIGHT = “75” WIDTH = “125”> <PARAMNAME = “message” VALUE = “Hi Mom. How do you like my applet?”> Applets Sample Applets

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 23 Applets Sample Applets

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 24 Introduction Java and Object-Oriented Programming The Java Programming Language

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 25 Sun Microsystems Oak Java Virtual Machine The Java Programming Language Introduction

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 26 Java supports object-oriented programming (OOP) Class Subclasses: children of parent class Applet class The Java Programming Language Java and Object-Oriented Programming

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 27 Standard Input Fields of a Guest Book Guest Book Dynamics Mailto Guest Books Guest Books

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 28 address Message Name URL Guest Books Standard Input Fields of a Guest Book

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 29 Created using form ACTION attribute specifies name of CGI script post METHOD sends parameters During sign in and updating: Guest fills out form Submits via SUBMIT button Parameters sent to CGI script Web server runs the CGI program World writeable file Guest Books Guest Book Dynamics

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 30 ACTION attribute specifies a mailto hyperlink Typical guest book: Form in which user signs in Collection of previous entries CGI script processes sign-ins * manually in mailto guest books Guest Books Mailto Guest Books

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 31 HTML Code for a Counter Counter Usefulness Counter Display Decision Web Page Counters

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 32 Absolute URL for CGI script as value of SRC attribute of image tag Parameters passed using get METHOD Web Page Counters HTML Code for a Counter <IMG SRC =“ counter?data=ellen.dat&style=1” ALIGN = “absmiddle” ALT = “counter” HEIGHT = “20” WIDTH = “70”>

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 33 Number of hits per page Advertising rates Web Page Counters Counter Usefulness Some users offended by counters Counter Display Decision

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 34 Common Inclusions Utilization Server-Side Includes

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 35 Sends command to Web server from inside HTML document Another HTML document inside current one Counter Current time and date Last-modified date Random quote Random page Server-Side Includes Common Inclusions

Web Programming Material From Greenlaw/Hepp, In-line/On-line: Fundamentals of the Internet and the World Wide Web 36 Syntax to run a program: Syntax to insert HTML document Server-Side Includes Utilization