Notes On Chapter Thirty-Seven -- Active Web Document Technologies (Java, JavaScript)

• 37.1 Introduction
  
  
  • Motivation for Active Documents
  • Earlier Server-Based Technology
  • Translation Steps To Prepare and Load
  • Java Technology, Language & Applets
  
  
• 37.2 Continuous Update With Server Push and Client Pull
  
  
  • With dynamic document technology, the user must make a request to get a screen update. That happens automatically with an active document.
    
    
  • Early Techniques:
    
    
    • Server Push: Server sends new content periodically (without being asked)
    • Client Pull: Browser periodically requests and displays the (next version of) the document (without the user having to ask.)
    
    
  • The early techniques overworked the server. Updates were slow.
  
  
• 37.3 Active Documents And Server Overhead
  
  
  • It made sense to take an approach under which the browsers run the program that produces updates for the screen.
    
    
    • It distributes the work among many processors.
    • Many changes require no use of network bandwidth.
    
    
• 37.4 Active Document Representation And Translation
  
  
  • Typically a programmer prepares an active document program in source form using a programming language, such as Java.
    
    
  • The source is compiled into a binary form and saved on the server's machine.
    
    
  • A browser makes a request and downloads a copy of the binary file.
    
    
  • The browser then performs operations comparable to linking in order to make the program executable on the host machine.
    
    
  • Finally the browser loads and executes the program.
    
    
  • Click here to see a Java TicTacToe Game
    
    
  • There is some Java code based on the text examples here.
  
  
• 37.5 Java Technology
  
  
  • Sun Microsystem's technology for producing and executing active documents.
    
    
  • A Java applet is an active document program.
    
    
  • Java Technology Includes:
    • The Java Programming Language
    • The Java Runtime Environment (support for execution)
    • The Java Class Library (built-in functions for common programming chores)
  
  
• 37.6 The Java Programming Language
  
  
  • 37.6.1 Language Characteristics
    • High Level (not like assembly lang)
    • General Purpose
    • Similar to C++
    • Object Oriented
    • Dynamic (created at run-time - objects and some bindings )
    • Strongly Typed (must declare the data type of each data object & use only the allowed operations on each object.)
    • Statically Type Checked (all type compatibility checking is performed at compile-time)
    • Concurrent (the programs can have multiple threads of execution - "multitasking")
    
    
  • 37.6.2 Similarities to C++
  
  
• 37.7 The Java Runtime Environment
  
  Characterized by:
  • Interpretive Execution - Java bytecode is a machine-independent binary representation that must be interpreted.
  • Automatic Garbage Collection - reclamation of memory the program cannot reference
  • Multi-Threaded Execution - support for concurrent thread execution
  • Internet Access - system includes a socket library
  • Graphics Support - a Java program can create windows containing text and/or graphics.
    
    
  • 37.7.1 Machine Independence and Portability
    
    
    • One may port Java bytecode to any system that supports Java.
  
  
• 37.8 The Java Library
  
  
  • A library of class definitions
    
    
  • There are classes for:
    • Graphics Manipulation (display control)
    • Low-Level Network I/O (e.g. use TCP or UDP)
    • Interaction With A Web Server (e.g. fetch an item from a URL)
    • Runtime System Access (e.g. thread creation)
    • File I/O (e.g. for long-term state)
    • Conventional Data Structures
    • Event Capture (e.g. mouse clicks)
    • Exception Handling
  
  
• 37.9 A Graphics Toolkit
  
  
  • A range of high- and low-level facilities are available for manipulation of the display and interaction with the user.
  
  
• 37.10 Using Java Graphics On A Particular Computer
  
  
  • Java applets do not contain code to manipulate specific hardware.
    
    
  • To make Java portable, a Java runtime environment uses a concept known as a factory. Before execution of an applet the runtime environment establishes a mapping between each native Java graphics operation and a corresponding intermediate function that is able to use the computer's window system to implement the operation.
  
  
• 37.11 Java Interpreters And Browsers
  
  
  • A browser that supports Java must have a Java interpreter that fetches, decodes and executes Java bytecodes.
    
    
  • The interpreter must support the Java runtime environment.
    
    
• 37.12 Compiling A Java Program
  
  
  • The programmer creates a source file (*.java file)
    
    
  • Someone compiles the program using the Java compiler called javac
    
    
  • The output of the compiler is a program represented as Java bytecode. (*.class file)
  
  
• 37.13 An Example Applet
  
  
  • Click here to run the applet clickcount.
    
    
  • Characteristics of clickcount:
    • Unlike a CGI program, it maintains state information locally.
    • Unlike a CGI program, it does not contact the server before updating the screen.
    
    
  • The code for the clickcount applet:

    ---

    /* 
           Import all matching classes: 
           the standard Applet and Abstract Window
           Toolkit classes.
    */  
    import java.applet.*;
    import java.awt.*; 
    /*
          Declare class "clickcount" 
          as a subclass of class "Applet"
    */  
    public class clickcount extends Applet
    {  /* start class clickcount */   
      int count ;
      TextField f; 
          /*
                This code builds the display 
                of the applet (Figure  37.3 at right)
                It redefines "init"
          */  
      public void init ()
      {  /* start class init */  
        count = 0;
           /*
                 Create an instance of "Button" 
                 and add it to the applet's
                 window.
           */  
        add(new Button ("Click Here") );
        f = new TextField 
            ("   The button has not been clicked at all.");
        f.setEditable(false);
        add(f);   /* Associate f with the applet window. */  
     }  /* end class init */
          /*
                This code redefines "action."  
                It determines the action performed
                when the user clicks on the button.
          */  
      public boolean action (Event e, Object arg) 
      {  /* start class action  */ 
         if ( ( (Button) e.target).getLabel() == "Click Here")
         { /* start if  */ 
            count += 1;
            f.setText 
            ("     The button has been clicked " + count + " times.");
         } /* end if  */  
         return true;
      }   /* end class action  */  
    } /* end class clickcount */  
    

    ---

• 37.14 Invoking An Applet
  
  
  • Typically a browser executes a java program when it encounters these tags: <APPLET> </APPLET> within an HTML document. Example:

    
    <HTML><HEAD><TITLE> Java Demo </TITLE> </HEAD><BODY>
    <H2><CENTER> <FONT SIZE=5>Java Demo</FONT> </CENTER></H2>
    <APPLET codebase="." code="clickcount.class" 
    width=500 height=100></APPLET>
    </BODY></HTML>   
    

• 37.15 Example Of Interaction With A Browser
  
  
  • The buttons Java program is an example of an applet that interacts with both the HTTP and HTML facilities in the browser.
    
    
  • The applet uses the HTTP client to retrieve documents and the HTML interpreter to display them.
    
    
  • Run buttons.
    
    
  • The code for the buttons applet:

    ---

    import java.applet.*;
    import java.net.*;
    import java.awt.*;
    
    public class buttons extends Applet 
    {
       public void init() 
       {
          add(new Button("Yin"));
          add(new Button("Yang"));
       }
       public boolean action(Event e, Object arg) 
       {
          if (((Button) e.target).getLabel() == "Yin") 
          {
             try {getAppletContext().showDocument 
                     (new URL("http://www.apple.com"));}
             catch (Exception ex) 
             {  /* note: code to handle 
                   the exception goes here */ }
          }
          else if (((Button) e.target).getLabel() == "Yang") 
               {
                  try {getAppletContext().showDocument
                          (new URL("http://www.microsoft.com")); }
                  catch (Exception ex) 
                  { /* note: code to handle 
                       the exception goes here */   }
               }
          return true;
       } /* end public boolean action */  
    } /* end public class buttons */  
    

    ---

  
  
• 37.16 Errors And Exception Handling
  
  
  • The simple example above ignores exceptions (errors). However it uses a try-catch format that supports exception-handling.
  
  
• 37.17 JavaScript Technology
  
  
  • JavaScript is an alternative to Java.
    • client downloads in source form
    • client uses an interpreter to execute the script
    • an HTML page can contain a JavaScript
    • No compiler required
    • However, the source representation is less compact than bytecode. It takes longer to download and interpret.
    • Run it: countScript.html.
    
    
  • View the source code of countScript.html and read the comments:

    ---

    
    <HTML> <HEAD> <TITLE> JavaScript counter </TITLE> </HEAD>
    
    <! THE onLoad DIRECTIVE IN THE BODY TAG HERE MEANS THE
    BROWSER WILL INVOKE FUNCTION incrementcount WHENEVER THE
    DOCUMENT IS LOADED.  THE EFFECT OF THIS IS TO INITIALIZE
    THE DIALOG PANEL.-> 
    
    <BODY onLoad="return incrementcount(document.demo);">
    
    <! THE JAVASCRIPT PART OF THE HTML DOCUMENT STARTS HERE.
    THE JavaScript INTERPRETER TRANSLATES THIS SECTION.
    IT CONTAINS THE DEFINITION OF A FUNCTION.  THE FUNCTION CHOOSES A
    MESSAGE TO DISPLAY BASED ON THE VALUE OF A VARIABLE n, AND
    THEN IT DISPLAYS THE MESSAGE. -> 
    
    <SCRIPT>  
    var n;
    n = -1;
    
    function incrementcount (form)
    {
      n = n + 1 ;
    
      if (n==0)
      {
        s = "  The button has not been clicked at all.  " ;
      }
      else
      {
        s = "  The button has been clicked " + n + " times." ;
      }
      form.elements["OutputArea"].value = s ;
    }
    </SCRIPT>
    
    <! THE JAVASCRIPT PART OF THE HTML DOCUMENT ENDS HERE. ->  
    
    <CENTER>
    
    <! HTML DIRECTIVE TO DISPLAY A FORM ->   
    <BR><BR>
    <FORM NAME="demo">
    
    <! SPECIFY THE FUNCTION TO EXECUTE 
          WHEN THE BUTTON IS CLICKED ->   
    <INPUT TYPE="BUTTON" NAME="ButtonClick" value="Click here "
        onClick="incrementcount(this.form);">
    
    <! SPECIFY THE DISPLAY AREA ->   
    <TEXTAREA NAME="OutputArea" ROWS=1 COLS=42>
    </TEXTAREA> </FORM> </CENTER> </BODY> </HTML>
    

    ---

• 37.18 Alternatives
  
  
  • Microsoft active web page technologies
  
  
• 37.19 Summary