rendering ...

Overview

The appname.html file is the primary .HTML file that defines the system. Its name should be unique and refer to the application since it is what the User sees. Samples include the Deps.htm and Chqs.htm in the Apps and tutorial examples.

Most of the appname.html is boiler plate with certain parts changed to customize it to the specific application. The standard templates are referenced extensively to allow the actual `appname.html' code be minimal.

Custom templates can be included at the end of the file appname.html to allow for sophisticated page structures.

Note By convention the examples use an extension of .HTM to differentiate them from the .HTML files generated by the ngdoc system. This makes searching for use cases much easier. It is not mandatory to follow this convention.

The major sections of the appname.html file are as follows:

<head> section

This section defines the stylesheet to use and the required .JS files. The sequence of the latter is important. It would contain the reference to the parallel appname-js that contains the Table definitions.

The samples are documented and can be used to create new appname.html files.

Here is a sample from the Deps.htm file.

<head>
  <link rel=stylesheet type ="text/css" href="/apps/Deps.css" title=defualt>
  <script src="tri/ut.js"></script>
  <script src="tri/angular.min.js"></script>
  <script src="tri/TRI.min.js"></script>
  <script src="AppsConfig.js"></script>
  <script src="Deps.js"></script>
  <script src="TableDonors.js"></script>
  <script src="TableEnvelopes.js"></script>
  <title>Defined during bootstrap</title>
</head>

Lines 3 through 6 are required in that sequence to load the Triangular environment.

<body id=bodyID> section

This section defines the main page structure. Much of it is boilerplate. The samples are documented and can be used to create new appname.html files.

<object data=... id=apps-templates ...> section

This is a standard statement used to load the standard templates.

The data keyword is a URL used to cause the browser to load into memory the complete set of standard templates from 'AppsBase.htm'. The cross-domain restictions of modern browsers prevent access to these standard templates so a script at the end of 'AppsBase.htm' transmits them using the windows message event handler. See hookMsgListener for more details.

As part of the data URL is a ?app=xxx specfication which is used to locate the application being fired up. The xxx value must match the name of the appname.html file actually used (such as ?app=Deps for the Deps.htm case).

<object id=cust-templates ...> section

This is the section that defines the custom templates.

Each template is bracketed with a <pre class=template id="xxx.html">...</pre> statement and where xxx is the name used to reference the template in the macro fetch directive.

The first template by convention is a stylesheet for all of the custom templates or to modify the appearance of standard templates. This stylesheet ends up being parsed early in the bootstrap cycle and applies to all page section loaded. That is, there is no way was found to disable or hide sections of the stylesheet.