Nordson Online Documentation System
N.O.D.S.
Webmaster’s
Technical Manual
29 January, 2001
29 January 2001 Nordson Online Webmaster’s Technical Manual
Documentation System
Table of Contents
Overview 1
Scope 1
Purpose 1
Description 1
General 1
Specific 1
The Header Frame 1
The Navigation Frame 3
The Main Frame 3
The Filler Frame 3
Navigation 4
Operating Instructions 5
Opening the web site 5
Locating a document using the Hierarchical Method 5
Locating a document using the Search Method 5
Displaying Equipment Dimensions 6
Layout 7
Frames 7
Frame Numbering 7
HTML Pages 7
Active Server Pages 8
Enhanced Column Header Titles 8
Sort Criteria Selection 8
Database Fields 8
Programming 9
HTML 9
Changing Two Frames Simultaneously 9
DHTML 9
Fade In/Fade Out 9
Animated Icons 9
JavaScript 10
Popups 10
Element 1 10
Element 2 10
VBScript 11
Mouseovers 11
Element 1 11
Element 2 12
Element 3 12
Element 4 13
Site Map 15
NODSTechManual.doc DRAFT i
29 January 2001 Nordson Online Webmaster’s Technical Manual
Documentation System
Overview
Scope
This document covers the navigation code, and the document database content and structure used in the Nordson Online Documentation System (N.O.D.S.).
Purpose
This document provides the necessary information for maintaining and developing new areas of the Nordson Online Documentation System (N.O.D.S.).
Description
General
This web site provides the necessary navigation to access the majority of Nordson Corporation’s technical documentation on their Hot Melt Systems. A block diagram of the web site layout is shown in Appendix A to this document.
The system uses a combination of HyperText Markup Language (HTML), Dynamic HyperText Markup Language (DHTML), Javascript and Visual Basic Script (VBScript) to present the user with a simple and convenient method of locating the technical documentation they require to maintain their Nordson equipment.
The system is also configured, without software changes, to be copied to Compact Disk - Read Only Memory (CD-ROM) format for distribution with the initial delivery of the equipment, removing the requirement for the delivery of technical documentation via printed media (paper manuals).
The system includes a help feature to instruct users on the basic operation of the system. This help system may be augmented by an online adjunct providing “tips and tricks” for getting the most out of the system.
Specific
The typical web page comprises four major areas, called “frames”:
The Header Frame
The Header frame (see Figure 2) contains those controls which are available to the user at all times. These controls are:
Help: The Help feature provides the user with assistance on the basic navigation, document access and storage, printing and document transmission concepts used in the web site.
Feedback: The Feedback subsystem allows users to report problems encountered while using the web site and also to forward comments and suggestions to the Webmaster. The system is currently set up to open an e-mail window, automatically addressed to , but this e-mail link should ultimately be addressed to a mailbox.
Search: The Search button opens a second browser window, allowing the user to select the sort order of the Search window (). This, in turn, opens an Active Server Page (ASP), shown in , that allows the user to type in the information to select either an individual document, or a range of documents meeting the selection criteria.
Figure 1: The N.O.D.S. Welcome Page
This section of the web site also includes a German language version of the welcome page. This version is accessed by clicking on the German flag. Conversely, when the German language welcome page is displayed, clicking on the American flag returns the user to the English language version of the welcome page.
Figure 2: The Header Frame
The Navigation Frame
All web site navigation controls are located in the Navigation frame (see
Figure 3). The contents of this frame change to provide the valid menu options for the level the user selected in the previous menu. Navigation is provided by hyperlinks which, depending on the desired change in level, may change either one or two frames simultaneously. If two frames are changed simultaneously, additional code is used to effect this change. A detailed description of this code is located in the section entitled Changing Two Frames Simultaneously, on Page 9.
The Main Frame
The Main frame, shown in Figure 4, contains the pages called by the navigation menus. This area provides the bulk of the narrative information on the site, including lists of the documents available for each major product and type of equipment.
The Filler Frame
The Filler frame takes up all of the space beyond 640 pixels from the left hand edge of the browser screen. This approach has been taken to accommodate older desktops and laptops, which are limited to a resolution of 640 x 480 pixels and prevent the main frame horizontal scrollbar from being displayed. Computers with higher resolutions will display the filler area to the right of the Main frame, whereas screens with a 640 x 480 resolution will not.
For more information on frames, turn to Frames, on page 7.
Figure 4: The Main Frame
Navigation
The system comprises two methods of locating a technical document:
Drill-Down: A number of hierarchical, hyperlink driven navigation menus allow the user to “drill-down” to the required technical document by selecting menu options from several levels, each covering more specific portions of a product or major item of equipment.
Search: Using Active Server Page (ASP) format, linked to a Microsoft Access® database, a user with Electronic Database (EDB) Number, Manual Part Number or Title information can search for the required technical document through a listing of all the documents in the database.
NODSTechManual.doc DRAFT 35
29 January 2001 Nordson Online Webmaster’s Technical Manual
Documentation System
Operating Instructions
Opening the web site
- Connect to the Internet.
- Log onto the Nordson Online Documentation System web site at http://emanualsnordson.eyemg.com. The browser displays the main menu (see Figure 1).
- Decide whether you want to locate your document by Hierarchical or Search method. For instructions on locating a document by either of these methods, see below.
Locating a document using the Hierarchical Method
- Click on the Hot Melt menu option. The browser displays the Hot Melt Product Line page and menu (see ).
- Either:
- Click on the name of the product line from the navbar, or;
- Click on the name of the product or item of equipment from the list on the main page.
Notes: If a subsequent selection list is available (as indicated by the icon), select the product or item you wish to view and click on it to display the next lower menu. If the navigation menu displays the icon next to a menu option, there are no further submenus.
To return to a previous menu, click on the appropriate icon.
To return to the Home Page, click on the icon.
- Select the document you wish to view.
- Click on the icon to open the selected document in Portable Document Format (PDF).
Notes: You will need a copy of Adobe Acrobat Reader 4.0 or later to view any PDF document contained in this web site.
If the document you wish to view is marked with the icon, it is not currently available, but will be added at a later date.
Locating a document using the Search Method
- Click on the Search menu option, located in the Header frame. The browser opens a new window, displaying the Search By menu (see ).
- Select a and click on search criteria from the Search By menu.
- Depending on the sort order you selected in Step 2, you can use the Find field to narrow your search. The find an individual document, or a range of documents. Depending on your currently selected Search By criteria, type in:
Search By Criteria / Search String
Old EDB Number / The start of the EDB number
New EDB Number / Any part of the EDB number
Manual Part Number / The start of the part number
Title / Any part of the title
Tip: To change the sort order, simply click on the column title for the new sort order you wish to invoke. The table is resorted in ascending order only.
- Select the document you want to view, and click on the icon.
Note: You will need a copy of Adobe Acrobat Reader 4.0 or later to view any PDF document contained in this web site.
If the document you wish to view is marked with the icon, it is not currently available, but will be added at a later date.
Displaying Equipment Dimensions
In the 3000 Vista section of the website, you can view the dimension of each of the melter configurations directly from an image of the melter. To see a working example of this feature:
- Select 3000 Vista from the Product Type menu.
- Select 3400V from the 3000V Product Line Menu.
- Select Specifications from the 3400V Manuals menu.
- Select the icon next to Dimensions from the bottom of the 3400 Vista Specifications page. A popup window appears, displaying a three-view line drawing of the 3400 Melter.
- Place your cursor over a dimension reference (A, B, C etc.) on the line drawing. The relevant dimensions are displayed in the lower left quadrant of the popup window.
- To view a table of the entire list of dimensions, in both Imperial (inches) and Metric (centimeters) format, click on the area marked “Click here for a complete table”. A second window opens to display this table, which can be printed.
NODSTechManual.doc DRAFT 35
29 January 2001 Nordson Online Webmaster’s Technical Manual
Documentation System
Layout
Frames
The N.O.D.S. website divides the browser into specific areas (called “frames”) for displaying both fixed and changing information on the same screen. The entire collection of frames (called a “frameset”) employed by N.O.D.S. consists of four frames, as shown in Figure 5. The parameters of each frame (all dimensions are in pixels) are:
HEADERWidth: full page Height: 34 px, Borders: top=0 px, left=0 px, no scrollbars, not resizable
NAVBAR
Width: 140 px
Height: Remainder of page
Borders:
top=0 px,
left=0 px,
scrollbars as needed,
not resizable / MAIN
Width: 500 pixels
Height: Remainder of page
Borders: top=5 px, left=5 px,
scrollbars as needed,
not resizable / FILLER
Width: Remainder of page
Height: Remainder of page
Borders: top=0 px, left=0 px,
no scrollbars
not resizable
Figure 5: Frameset Parameters
The Frames Page border properties are set to zero, removing any borders from the frameset.
Frame Numbering
The frames in a frameset are assigned a reference number, starting with zero and based on the order in which that frame’s parameters are in identified in the frameset object. In the case of the N.O.D.S. frameset, the frames are numbered as follows:
0 / HEADER frame1 / NAVBAR frame
2 / MAIN frame
3 / FILLER frame
HTML Pages
The majority of pages in the N.O.D.S. web site contain standard HTML coding. For rapid application development, convenience and ease of maintenance, this coding was developed using Microsoft FrontPage 2000. A typical page is laid out with all text and graphics contained in a table set to a width of 475 pixels, which is equivalent to 95% of the width of the main frame. Tables are also used to control the format and placement of text and graphics within each page.
Two major colors (in addition to black and white) are employed. These colors are:
Color / R / G / B / Hex Code / Primary Use(s)80 / 124 / 167 / #507CA7 / Hyperlinks, horizontal lines, backgrounds
187 / 205 / 223 / #BBCDDF / Cell shading
Active Server Pages
An Active Server Page (ASP) is a set of code that runs in the server-side execution environment of a Client/Server system. It enables a client to query a database on a server and return the results to the client browser. ASPs providing access to corporate databases and applications to any browser.
The ASPs used in this system display the contents of the Access database EDB2000.mdb, which holds a list of all the documents available from this web site. They were designed using FrontPage 2000, then modified for aesthetics and the addition of the changeable sort order feature (see Locating a document using the Search Method, on page 5). These modifications and additions include:
Enhanced Column Header Titles
The column header titles were modified to conform with the color scheme and text attributes of the rest of the web site. To achieve this, the following code changes were made:
From / ToTo fix the width of the table and to remove the table borders:
<table width="100%" border="1" / <table width="610" cellspacing="0" cellpadding="0" border="0">
To display each column title as a button and to change the cursor from the default icon to the link icon:
<td<b>[Column Heading Label]</b</td> / <td width=[column width] style="background-color: #507CA7; color: #000000; border-style: outset; border-color: #507CA7" onmouseover="this.style.cursor='hand'" onmouseout="this.style.cursor='default'"<b<font face="Arial" size="2">[Column Heading Label]</font</b</td>
(see Note, below)
Sort Criteria Selection
To allow the user to change the sort order of the results table, the following hyperlink code was added outside of the cell declaration:
<a href="[sort order page corresponding to the column heading]"<td. . . </td</a>Note: For each of the ASP pages, the column by which the table is currently sorted does not include the Sort Criteria Selection code or the cursor change code (onmouseover="this.style.cursor='hand'" onmouseout="this.style.cursor='default'). Additionally, the text for the current sort order column is displayed in white (<font face="Arial" size="2" color="#FFFFFF">), instead of the default, black.
Database Fields
To include the functionality of the standard animated book icon (see “Animated Icons”, on page 9) a Location field was added to the EDB2000 database. This field contains one of two code blocks:
If the manual is not available, the Location field contains the code block: