UI File

The ui.js file constitutes a dynamic solution for updating the user interface of our calculator, which responds in real-time to user inputs. The file is constructed using javascript, featuring compatibility with either jQuery or generic vanilla javascript for DOM manipulation. Upon each user input, the file is executed for seamless interface updates.

Moreover, the file is capable of updating both the canvas and div elements specified within the input variables of your config.json, making it a versatile tool for UI enhancements.

Template

// Get the current input from your calculator

var input = SKYCIV_DESIGN.designConfig.getInput();

// Replace ui-canvas with whatever id you have given your canvas

var canvas = document.getElementById("ui-canvas");

var ctx = canvas.getContext("2d");

// Clear the previous data on the canvas

ctx.clearRect(0, 0, canvas.width, canvas.height);

ctx.fillText("Updating the canvas with some text");