The HTML producer in CasparCG server expects to be able to call 4 core functions in the Javascript of your template. The four primary functions are:
play() - called when the template is run (client F2 key). Your code for play() defines how the template adds your template content onto the display.
update(str) - This function receives the data sent by the client as either XML wrapped text or as JSON (tick box in the client inspector for the template item). Your code has to parse the str string into the elements, then copy the values into the HTML elements. Invoked as part of the play() request or when you send new data using the F6 function key.
stop() - This function is called when the client sends the stop command (function key F1). Your code in the stop function defines how the template removes data from the screen (cut, fade, move etc).
next() - This function is called when the template runs in several time blocks, pausing at the end of each block. A call to next() runs the next phase of the timeline animation.