Structure
A function is implemented within the TcHmi namespace. Implementation outside the namespace is not possible, since otherwise the function would not be available in the TwinCAT HMI framework. The function is registered in the framework via the framework API function "registerFunctionEx" (from version 1.12) or "registerFunction" so that it is available at runtime.
The following example implements the conversion of a temperature from Fahrenheit to Celsius and returns the calling point.
Base structure of a TypeScript function
module TcHmi {
export module Functions {
export module TcHmiProject40 {
export function FahrToCels(TempInFahr: number | string) {
// variable for the return value
var value = TempInFahr;
// check the type of the parameter
if (typeof TempInFahr === 'number') {
// parameter is already a number
// convert the parameter value to Celsius
value = ((TempInFahr - 32) * (5 / 9));
} else if (typeof TempInFahr === 'string') {
// parameter is a string
// convert the parameter type and the parameter value
value = ((parseFloat(TempInFahr) - 32) * (5 / 9));
}
// return the converted parameter
return value;
}
}
registerFunctionEx('FahrToCels', 'TcHmi.Functions.TcHmiProject40', TcHmiProject40.FahrToCels);
}
}
Base structure of a JavaScript function (from version 1.12)
(function (/** @type {globalThis.TcHmi} */ TcHmi) {
var Functions;
(function (/** @type {globalThis.TcHmi.Functions} */ Functions) {
var TcHmiProject40;
(function (TcHmiProject40) {
function FahrToCels(TempInFahr) {
// variable for the return value
var value = TempInFahr;
// check the type of the parameter
if (typeof TempInFahr === 'number') {
// parameter is already a number
// convert the parameter value to celsius
value = ((TempInFahr - 32) * (5 / 9));
}else if (typeof TempInFahr === 'string') {
// parameter is a string
// convert the parameter type and the parameter value
value = ((parseFloat(TempInFahr) - 32) * (5 / 9));
}
// return the converted parameter
return value;
}
TcHmiProject40.FahrToCels = FahrToCels;
})(TcHmiProject40 = Functions.TcHmiProject40 || (Functions.TcHmiProject40 = {}));
Functions.registerFunctionEx('FahrToCels', 'TcHmi.Functions.TcHmiProject40', TcHmiProject40.FahrToCels);
})(Functions = TcHmi.Functions || (TcHmi.Functions = {}));
})(TcHmi);
Base structure of a JavaScript function (from version 1.8)
// required namespace TcHmi
(function (/** @type {globalThis.TcHmi} */ TcHmi) {
// name and parameters of the function defined in json
var FahrToCels = function (TempInFahr) {
// variable for the return value
var value = TempInFahr;
// check the type of the parameter
if (typeof TempInFahr === 'number') {
// parameter is already a number
// convert the parameter value to celsius
value = ((TempInFahr - 32) * (5 / 9));
}
else if (typeof TempInFahr === 'string') {
// parameter is a string
// convert the parameter type and the parameter value
value = ((parseFloat(TempInFahr) - 32) * (5 / 9));
}
// return the converted parameter
return value;
};
// register the function in the framework
TcHmi.Functions.registerFunction('FahrToCels', FahrToCels);
})(TcHmi);
References to the framework and jQuery within the function's JavaScript file are created to enhance IntelliSense support. This is not necessary with TypeScript.
// TcHmi Version 1.12
/// <reference path="../Packages/Beckhoff.TwinCAT.HMI.Framework.12.742.1/runtimes/native1.12-tchmi/TcHmi.d.ts" />
// TcHmi Version 1.8
// Provider for a best effort Intellisense of Visual Studio 2017/2019.
/// <reference path="C:\TwinCAT\Functions\TE2000-HMI-Engineering\Infrastructure\TcHmiFramework\Latest\Lib\jquery.d.ts" />
/// <reference path="C:\TwinCAT\Functions\TE2000-HMI-Engineering\Infrastructure\TcHmiFramework\Latest\TcHmi.d.ts" />
/// <reference path="C:\TwinCAT\Functions\TE2000-HMI-Engineering\Infrastructure\TcHmiFramework\Latest\Controls\System\TcHmiControl\Source.d.ts" />
// Provider for a best effort Intellisense of Visual Studio 2013/2015.
/// <reference path="C:\TwinCAT\Functions\TE2000-HMI-Engineering\Infrastructure\TcHmiFramework\Latest\Lib\jquery\jquery.js" />
/// <reference path="C:\TwinCAT\Functions\TE2000-HMI-Engineering\Infrastructure\TcHmiFramework\Latest\TcHmi.js" />
Further Information