Skip to main content

The Core HTML

Each Flaremap JS application has its own HTML file, the "core HTML". The core HTML contains several parts – some which are unique to each application and some that are the same for each application. The core HTML:

  • Contains the HTML structure for the application layout. (Same for each application.)
  • References all the application support files. (Same for each application.)
  • References the Flaremap configuration file – See Part 3. (Unique to each application.)
  • References the Flaremap style sheet (CSS). (Unique to each application.)
  • Contains the cell mouseover box details – See Part 5. (Unique to each application.)
  • Contains the group mouseover box details – See Part 5. (Unique to each application.)

For an example Flaremap JS core HTML file, see the file "salesforce.html".

Modifying the HTML structure is not recommended. However, in versions 6.2+, a blank DIV has been added to the HTML to allow for a custom heading to be added. Also in versions 6.2+, an animated “Loading...” screen has been added. See below for details.

How to add a custom heading to your application

Available in versions 6.2+: A blank DIV has been added to the HTML to allow for a custom heading. Anything entered inside this DIV will appear above the application – on all devices. The DIV has the ID #flaremapHeadingContainer and should be placed as the first DIV inside the #pageContainer DIV. See the snippet below as an example.

<body>
<div id="pageContainer">
<div id="flaremapHeadingContainer">
Insert custom heading here
</div>
<div id="gscContainer" style="display:none;">

...

Animated “Loading...” screen

The “Loading...” screen is meant to provide the user with a simple interface while the application and data load. The “Loading...” screen will automatically fade out when the page has finished loading. The “Loading” screen is purely aesthetic and can be disabled by deleting the entire contents of the DIV .loading_indicator.