Class: HtmlHandler

HtmlHandler

new HtmlHandler()

Class responsible for adding and editing html related elements. This class adds to and creates Html elements such as dropdown options for manoeuvres, the movie reel for represnting a break down of moves, and the stats bar displayed on top of the canvas.
Source:

Methods

addContent(renderer)

Adds options to manoeuvre drop down list, each from the manoeuvre array gained from the JSON file. Also appends the renderer element to the container div, which will contain the scene.
Parameters:
Name Type Description
renderer Renderer Renderer object where objects and effects will be added. Represents the canvas on the HTML side
Source:

addHelpManoeuvreList(manoeuvres)

Adds the list of manoeuvres from the JSON file to the help section, and adds each manoeuvre with its name and OLAN string to a list element. This means no need to write the html statically.
Parameters:
Name Type Description
manoeuvres Array Array of all the manoeuvres from the JSON file
Source:

addMoveReel(moves)

Creates and edits the move reel display at bottom of canvas, depending on how many moves there are in the OLAN input. Divides into 5, and any extra will be hidden as the play runs through the scenario. Also compensates for the location of the footer by moving items up above the reel, to prevent blocks from being covered by the copywrite or stats elements.
Parameters:
Name Type Description
moves Array Array of moves each representing an OLAN string.
Source:

addStatsBar(stats)

Adds the statistics element based from the Stats.js script for showing FPS whilst running.
Parameters:
Name Type Description
stats Stats Statistical appearence object of Frames per second using Stats,js library.
Source:

disableReelNavigation(disabled)

Disables both left and right arrows for navigating the movie-reel.
Parameters:
Name Type Description
disabled Boolean Whether or not to disable the arrows.
Source:

enableOLANInput(enable)

Enables and disables the input box in the header of the page to ensure user can only type when permitted. Useful for blocking input when models and other JSON is being loaded.
Parameters:
Name Type Description
enable Boolean Boolean flag for enabling/ disabling OLAN input field
Source:

enableOLANInput(enable)

Enables and disables the input box in the header of the page to ensure user can only type when permitted. Useful for blocking input when models and other JSON is being loaded.
Parameters:
Name Type Description
enable Boolean Boolean flag for enabling/ disabling OLAN input field
Source:

getAnimateTime() → {Long}

The getter method for the time field which keeps track of where the animation has got to in terms of an overall percentage of the routine. Also checks when the time field has reached the end of its animation path, and resets back to the start, alongside calling the reset of the move reel.
Source:
Returns:
time Current animate time.
Type
Long

hideShowReel()

Toggles the visibility of the move reel, which is called when the user presses the toggle button.
Source:

moveReelLeft()

Moves the reel left, but also checks if the limit to the left has already been reached. If so, hids the left arrow button.
Source:

moveReelRight()

Moves the reel right, but also checks if the limit to the right has already been reached. If so, hids the right arrow button.
Source:

resetReel(moves)

Resets the move reel, by removing the hidden attributes from all the manoeuvres.
Parameters:
Name Type Description
moves Integer The amount of manoeuvres to reset the hidden attribute.
Source:

scrollReel(time)

Moves the reel along by 5 places each time the animation completes 5 manoeuvres. Does this by hiding the four or more previus elements with the 'hidden' class.
Parameters:
Name Type Description
time Float The current amount of distance travelled in realtion to the amount of manoeuvres
Source:

showImportSuccess(success)

Function for displaying the message provided back after attempting to upload and import a manoeuvre set json file. Can either be a success or an error.
Parameters:
Name Type Description
success Boolean Flag for error or success
Source:

showLoadingImport(visible)

Shows or hides the loading bar when uploading a JSON file.
Parameters:
Name Type Description
visible Boolean Show or hide the loading bar.
Source:

showReelBrowser(length)

Shows both arrows depending on whether there are more than 5 manoeuvres thus filling up the spaces at the bottom of the canvas.
Parameters:
Name Type Description
length Integer The amount manoeuvres displayed in the reel
Source:

showReelToggle(reelLength)

Checks the amount of manoeuvres displayed in the reel, if there are none, then do not show the toggle button, otherwise show it.
Parameters:
Name Type Description
reelLength Integer The amount manoeuvres displayed in the reel
Source:

toggleReelButtonLeft(left)

Hides and dsplays the left arrow button for naviating the movie-reel.
Parameters:
Name Type Description
left Boolean Whether to show the left button or not.
Source:

toggleReelButtonRight(right)

Hides and dsplays the right arrow button for naviating the movie-reel.
Parameters:
Name Type Description
right Boolean Whether to show the right button or not.
Source:

updateMoveReel(time, moves)

Updates the move reel progress bars. Gets the current percentage of each move in relation to the overall time complete. Fills the bars already in the html with the width of each individual percentage.
Parameters:
Name Type Description
time Float The current amount of distance travelled in realtion to the amount of manoeuvres
moves Integer The number of manoeuvres in the scenario
Source:

warnManoeuvres(toggle)

Shows or hides the waring message for manoeuvres that pass under the 0,0,0 location. Toggles the html to fade in or out each time it is called.
Parameters:
Name Type Description
toggle Boolean Show or hide the warning message.
Source: