<!DOCTYPE html
  PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<!--
Copyright (c) 2006 UGS Corp.

All Rights Reserved.

This software and related documentation are proprietary to UGS Corp.
-->
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
      <title>Sample Web Page</title>
      <script language="javaScript">
        abridged="false";
        displayConditions=new Array();
      </script>
      <link type="text/css" href="../css/main_styles.css" rel="stylesheet">
   </head>
   <body class="bodydocs" onload="top.pageLoader()" bgcolor="#FFFFFF">
      <div class="title_topic4" id="xps10_pagetitle">Sample Web Page</div>
      <hr noshade="true">
      <p class="para_topic"> The sample web page shown below was built from HTML output files generated by Web Express, and is based on an NX assembly of the top section of a tripod. For the purposes of this sample, the assembly is considered to be ready for manufacture by the imaginary company, Mercutio Ltd.</p>
      <p class="para_topic"> Everything you see in the sample data was generated directly from NX by the processing of a template file. Some of the graphics, such as the company logo, were generated in advance, but the remaining images and data were all generated via a template. The complete sample web page, contains 11 HTML files and 16 image files, all hyper-linked together.</p>
      <p class="para_topic"> The sample page consists of 3 frames, so you would need a frames compatible browser to view it. The overall page design has a top frame area for basic company information, company logos and other generic information, a left hand frame for general assembly information, and a right hand frame for details about components of the assembly.</p>
      <p class="para_topic"> Creating the sample page actually used two template files.</p>
      <p class="para_topic"> assembly.htt</p>
      <p class="para_topic"> An assembly level template was used to generate the main page, including the frame sets, the top section and the left hand sections. This template was run against the main assembly part using the Apply to Assembly option in the Web Express dialog.</p>
      <p class="para_topic"> component.htt</p>
      <p class="para_topic"> A component template was used to generate detailed information about each component. This template was also run against the main assembly part, but using the Apply to Each Component option. With that option turned ON the publisher visited each component of the assembly and applied the template to each one. The generation time for the component data was roughly 6 minutes on an HP-735, and included the generation of shaded images and VRML data.</p>
      <table border="0">
         <tr>
            <td valign="top" align="left"><img align="left" src="../graphics/note.gif" alt="Note" title="Note"></td>
            <td valign="bottom" align="left" width="100%">
               <div class="para_note">
                  <p class="para_note_body">  See the documentation for the basic syntax of embedded commands. Also see the NX Summary of Embedded Commands.</p>
                  <p class="para_note_body"></p>
               </div>
            </td>
         </tr>
      </table>
      <div class="title_division"> Sample HTML Web Page</div>
      <p class="para_division"> Mixed in with the basic HTML commands are special NX embedded commands used to perform special functions in the template. These embedded commands have a similar structure to HTML tags.</p>
      <p class="para_division">The template constructed in the following example is the same one used to create the detailed component information for the sample web page.</p>
      <div class="figure">
         <p align="center"><img align="bottom" src="graphics/fil_webfr07.gif"></p>
         <p class="para_figure">For this example, actual database calls which require the CGI-BIN programs have been removed so that the resulting pages are more portable and will correctly operate in any browser/server environment. As a result changes to the &quot;Change Request&quot; screen will not be saved or restored in the demo.</p>
      </div>
      <div class="title_figure"> Sample HTML Web Page</div>
      <p class="para_division">   </p>
      <div class="title_division"> Setting the Output File</div>
      <p class="para_division"> The template begins with a &lt;@UGFILE...&gt; command. This command changes the output file that the publisher is writing:</p>
      <p class="para_division"> &lt;@UGFILE NAME=&quot;&lt;@UGVAR&gt;/&lt;@UGPARTINFO NAME=&quot;WORK&quot;&gt;.html&quot; MODE=&quot;w+&quot;&gt;</p>
      <p class="para_division"> Two other commands are used inside the &lt;@UGFILE...&gt; command. The &lt;@UGVAR...&gt; command is used to return the output directory, and the &lt;@UGPARTINFO&gt; command returns the current work part.</p>
      <p class="para_division"> The result of the &lt;@UGFILE...&gt; command line is to set the output file to something like:</p>
      <p class="para_division"> /users/stephens/www_docs/sample/brass_screw.html</p>
      <div class="title_division"> Creating a Shaded Image</div>
      <p class="para_division"> Two commands are used to generate the shaded image, a &lt;@UGSHADE...&gt; command, and a &lt;@UGRUN...&gt; command. They look like this in the template:</p>
      <p class="para_division"> &lt;@UGSHADE FILE=&quot;&lt;@UGVAR&gt;/images/&lt;@UGPARTINFO NAME=&quot;WORK&quot;&gt;.tif&quot; FORMAT=&quot;&lt;!--Shaded file = $NAME -&rarr; &quot; PART=&quot;WORK&quot; X=&quot;200&quot; Y=&quot;200&quot; METHOD=&quot;IMPROVED&quot; DISPLAY=&quot;YES&quot;&gt;</p>
      <p class="para_division">  &lt;@UGRUN PROGRAM=&quot;/users/stephens/bin/tif2gif&quot; PARAMETERS=&quot;&lt;@UGVAR&gt;/images/&lt;@UGPARTINFO NAME=&quot;WORK&quot;&gt;&quot;&gt;</p>
      <p class="para_division"> Again, there are calls to &lt;@UGVAR...&gt; and &lt;@UGPARTINFO&gt; to set the proper directory and file name for the shaded image. The shade command is used to generate a 200 x 200 pixel image using the Improved shading mode. The output from the shade command is a TIFF image, which presents a problem in that TIFF cannot be directly placed into a Web document.</p>
      <p class="para_division"> To get the generated image into a usable form, the &lt;@UGRUN...&gt; command is used. The program that is executed by the run command (tif2gif) is a TIFF to GIF converter. The single parameter needed by the program is the name of the TIFF file, and once again &lt;@UGVAR...&gt; and &lt;@UGPARTINFO...&gt; are used to generate the name.</p>
      <div class="title_division"> HTML Header</div>
      <p class="para_division"> Now that we have the shaded image, we have everything we need to put a header into the file. For the most part, the header is plain HTML, with a few embedded calls to &lt;@UGPARTINFO...&gt; to get the file names correct, and to fetch some basic information from the part.</p>
      <p class="para_division"> &lt;table&gt; &lt;td&gt; &lt;A HREF=&quot;images/&lt;@UGPARTINFO NAME=&quot;WORK&quot;&gt;.tif&quot;&gt;   &lt;IMG SRC=&quot;images/&lt;@UGPARTINFO NAME=&quot;WORK&quot;&gt;.gif&quot;&gt;&lt;/A&gt; &lt;/td&gt; &lt;td&gt; &lt;table BGCOLOR=&quot;#AAAAFF&quot;&gt;   &lt;th COLSPAN=2&gt;&lt;font size=6&gt;MERCUTIO Ltd.&lt;/font&gt;&lt;/th&gt;&lt;tr&gt;   &lt;td&gt;Part Name:&lt;/td&gt;&lt;td&gt;&lt;@UGPARTINFO NAME=&quot;WORK&quot;&gt;&lt;/td&gt;&lt;tr&gt;   &lt;td&gt;Description:&lt;/td&gt;&lt;td&gt;&lt;@UGPARTINFO NAME=&quot;WORK&quot;   FORMAT=&quot;$DESC&quot;&gt;&lt;/td&gt;&lt;tr&gt;   &lt;td&gt;Creation:&lt;/td&gt;&lt;td&gt;&lt;@UGPARTINFO NAME=&quot;WORK&quot;   FORMAT=&quot;$CRDATE $CRTIME&quot;&gt;&lt;/td&gt;&lt;tr&gt;   &lt;td&gt;Units:&lt;/td&gt;&lt;td&gt;&lt;@UGPARTINFO NAME=&quot;WORK&quot;   FORMAT=&quot;$UNITS&quot;&gt;&lt;/td&gt; &lt;/table&gt; &lt;/td&gt; &lt;/table&gt;</p>
      <p class="para_division"> The net result header:</p>
      <div class="figure">
         <p align="center"><img align="bottom" src="graphics/fil_webfr06.gif"></p>
      </div>
      <div class="title_figure"> HTML Header</div>
      <p class="para_division"> A typical case is how the creation date is generated. The source was:</p>
      <p class="para_division"> &lt;@UGPARTINFO NAME=&quot;WORK&quot; FORMAT=&quot;$CRDATE $CRTIME&quot;&gt;</p>
      <p class="para_division"> The FORMAT statement refers to the parameters $CRDATE and $CRTIME, which are the creation date and time. The @UGPARTINFO command returns the string 6-Mar-96 10:42, and puts it in the output HTML file. The NAME=&quot;WORK&quot; keyword is optional since that is the default value for the NAME keyword.</p>
      <div class="title_division"> Grabbing Information about Drawings</div>
      <p class="para_division"> We can now use the &lt;@UGDRAWING...&gt; command in the template to extract information about any drawings in the work part. </p>
      <p class="para_division"> The source code for the template is:</p>
      <p class="para_division"> &lt;@UGDRAWING NAME=&quot;*&quot; PART=&quot;WORK&quot;   HEADER=&quot;&lt;hr&gt;&lt;table BGCOLOR=&quot;#FFFFAA&quot; BORDER=1&gt;\n   &lt;tr BGCOLOR=&quot;#AAAAFF&quot;&gt;   &lt;th COLSPAN=6&gt;&lt;FONT size=6&gt;Drawing Summary&lt;/font&gt;&lt;/th&gt;&lt;tr&gt;\n   &lt;th&gt;Name&lt;/th&gt;&lt;th&gt;Height&lt;/th&gt;&lt;th&gt;Width&lt;/th&gt;   &lt;th&gt;Scale&lt;/th&gt;&lt;th&gt;Units&lt;/th&gt;&lt;th&gt;Out of Date&lt;/th&gt;\n&quot;   FORMAT=&quot;&lt;tr&gt;&lt;td&gt;$NAME&lt;/td&gt;&lt;td&gt;$HEIGHT&lt;/td&gt;&lt;td&gt;$WIDTH&lt;/td&gt;   &lt;td&gt;$SCALE&lt;/td&gt;&lt;td&gt;$UNITS&lt;/td&gt;&lt;td&gt;$FLAG&lt;/td&gt;\n&quot;   FOOTER=&quot;&lt;/table&gt;\n&quot;&gt;</p>
      <p class="para_division"> The NAME keyword is set to &quot;*&quot; to get information on all drawings. PART is set to WORK for clarity, but that is the default. A HEADER keyword is used to build the HTML table and put titles on each output column. The FORMAT command includes HTML table tags, and references the numbered parameters of the &lt;@UGDRAWING...&gt; command that will be included in the table.</p>
      <p class="para_division"> The FOOTER keyword just closes down the HTML table. The net result data summary table:</p>
      <div class="figure">
         <p align="center"><img align="bottom" src="graphics/fil_webfr05.gif"></p>
      </div>
      <div class="title_figure"> HTML Drawing Info</div>
      <div class="title_division"> Including Spreadsheet Information</div>
      <p class="para_division"> The next two embedded commands in the template file are used to extract information from the NX Spreadsheet. We will look at the two commands separately since they use slightly different formatting options. The first command, &lt;@UGSPREADSHEET...&gt;, is used to format a spreadsheet that contains basically text information.</p>
      <p class="para_division"> The command for the sample template file is:</p>
      <p class="para_division"> &lt;@UGSPREADSHEET NAME=&quot;DEFAULT_SHEET&quot; PART=&quot;WORK&quot;  HEADER=&quot;&lt;hr&gt;&lt;table BORDER=0&gt;\n   &lt;tr BGCOLOR=&quot;#AAAAFF&quot;&gt;   &lt;th COLSPAN=$MAXCOLUMN&gt;Gateway Spreadsheet Data&lt;/th&gt;\n&quot;  FORMAT=&quot;AUTO&quot; FOOTER=&quot;&lt;/table&gt;\n&quot; LABELS=&quot;NO&quot;&gt;</p>
      <p class="para_division"> The &lt;@UGSPREADSHEET...&gt; command fetches the Gateway spreadsheet, (NAME=&quot;DEFAULT_SHEET&quot;), and uses the automatic formatter (FORMAT=&quot;AUTO&quot;). Since the format is for text information, the column and row labels have been turned off by setting LABELS=&quot;NO&quot;. The HEADER and FOOTER for the command set up an HTML table, along with some color information. </p>
      <p class="para_division"> The result data table:</p>
      <div class="figure">
         <p align="center"><img align="bottom" src="graphics/fil_webfr04.gif"></p>
      </div>
      <div class="title_figure"> Gateway Spreadsheet Data</div>
      <table border="0">
         <tr>
            <td valign="top" align="left"><img align="left" src="../graphics/note.gif" alt="Note" title="Note"></td>
            <td valign="bottom" align="left" width="100%">
               <div class="para_note">
                  <p class="para_note_body"> NOTE : A frame on the web page for the tripod_top assembly part, and not the brass_screw assembly part. Even though data is taken from the spreadsheet, it looks more like plain ASCII from a text file. The output from the Modeling spreadsheet takes a different approach. The command to dump the Modeling spreadsheet is very similar to the previous example, but in this case the LABELS are turned on.</p>
                  <p class="para_note_body"></p>
               </div>
            </td>
         </tr>
      </table>
      <p class="para_division"> The basic template command is:</p>
      <p class="para_division"> &lt;@UGSPREADSHEET NAME=&quot;MODELING_SHEET&quot; PART=&quot;WORK&quot;  HEADER=&quot;&lt;hr&gt;&lt;table BGCOLOR=&quot;#FFFFAA&quot; BORDER=1&gt;\n   &lt;tr BGCOLOR=&quot;#AAAAFF&quot;&gt;   &lt;th COLSPAN=$MAXCOLUMN&gt;Modeling Spreadsheet Data&lt;/th&gt;\n&quot;  FORMAT=&quot;AUTO&quot; FOOTER=&quot;&lt;/table&gt;\n&quot;&gt;</p>
      <p class="para_division"> The result data table:</p>
      <div class="figure">
         <p align="center"><img align="bottom" src="graphics/fil_webfr03.gif"></p>
      </div>
      <div class="title_figure"> Modeling Spreadsheet Data</div>
      <div class="title_division"> Finishing Up with Attributes</div>
      <p class="para_division"> The last step in specifying the template file is to fetch any part attributes for the work part. This is done with the &lt;@UGATTRIBUTES...&gt; command. The template command is shown below:</p>
      <p class="para_division"> &lt;@UGATTRIBUTE TITLE=&quot;*&quot; OBJECT=&quot;PART&quot;   HEADER=&quot;&lt;p&gt;&lt;table BGCOLOR=&quot;#FFFFAA&quot; border=2&gt;   &lt;th BGCOLOR=&quot;#AAAAFF&quot;&gt;Part Attribute Information for $NAME&lt;/th&gt;\n   &lt;tr&gt;&lt;td&gt;&lt;pre&gt;\n&quot;   FORMAT=&quot;$TITLE = $VALUE\n&quot;   FOOTER=&quot;\n&lt;/pre&gt;&lt;/td&gt;&lt;tr&gt;&lt;/table&gt;&quot;&gt;</p>
      <p class="para_division"> The output is formatted into a table, with the contents of the table being a pre-formatted section in HTML. </p>
      <p class="para_division"> The result data table:</p>
      <div class="figure">
         <p align="center"><img align="bottom" src="graphics/fil_webfr02.gif"></p>
      </div>
      <div class="title_figure"> Part Attribute Data</div>
   </body>
</html>