Netscape 6, Part VII: Object-Oriented DOCJSLIB 3.1
Structuring your Application
Our demo application includes three applications in one:
- A Tic-Tac-Toe Game
- Popout Menus
- A Page Watermark
The general structure of the application page is similar to what we presented in our previous column, Netscape 6, Part VI: Object-Oriented DOCJSLIB 1.2. Read the other column carefully to get acquainted with the principles of object-oriented programming in general and object-oriented JavaScript in particular. We first load the browser sniffer:
<SCRIPT LANGUAGE="JavaScript" SRC="browserSniffer.js"></SCRIPT>
We then load the browser-independent superclass object:
<SCRIPT LANGUAGE="JavaScript" SRC="docjslibSuperClass.js"></SCRIPT>
We decide which subclass object to load in the following javascript code:
<SCRIPT LANGUAGE="JavaScript" SRC="createTheProperSubClass.js"></SCRIPT>
We load all four subclass objects, for Internet Explorer 4.x, Internet Explorer 5.x, Netscape Navigator 4.x, and Netscape 6 in createTheProperSubClass.js:
var browserType = new browserSniffer();
if (browserType.ie4) {document.write('<SCRIPT LANGUAGE="JavaScript"
SRC="docjslibIE4SubClass.js"><\/SCRIPT>');}
else if (browserType.ie5) {document.write('<SCRIPT LANGUAGE="JavaScript"
SRC="docjslibIE5SubClass.js"><\/SCRIPT>');}
else if (browserType.ns4) {document.write('<SCRIPT LANGUAGE="JavaScript"
SRC="docjslibNS4SubClass.js"><\/SCRIPT>');}
else if (browserType.ns6) {document.write('<SCRIPT LANGUAGE="JavaScript"
SRC="docjslibNS6SubClass.js"><\/SCRIPT>');}
So far, we have loaded object constructor in the form of function definitions. We create the proper subclass and an instance of it next:
var classSelectionObj = new createTheProperSubClass();
var myBrowserAPIObj = classSelectionObj.getTheProperSubClass();
The rest of the page includes the code for the three applications. To make the code more readable, we enclosed each application in a separate <SCRIPT> tag. They can all be in a single tag, of course.
