Changing the color of the FLIGHT STATUS with the script

A) Open the Simpleway template in Designer

1. Open the Templates tab. 

2. Select the Simpleway template which uses the List with flight status/remark element.

B) Click the Elements button and select the List element.

C) Click the row button of the selected List element in the Format editor.

D) Row templates sub-window

Click the three dots button and select the Edit option. 

E) Click on the Elements button and select the Dynamic label element of the Remark (status).

F) Click the Edit element script button under Advanced section.

G) Edit script sub-window

1. Type or copy the provided script into the Edit script field.

2. Click the Save button.

Replace the setTextColor function by setBackground if you wish to change the background color of the text instead. 

You may also want to use Hex color codes of your own to fit the design of the template theme.

Note:

In this example, we set different colors for flight status remarks based on their content. The code retrieves the flight remark, converts it to lowercase for consistent comparison, and then applies specific colors based on the remark text:

If the remark is "canceled" or "cancelled," we apply the canceledColor.

If the remark is "delayed," we apply the delayedColor.

For any other status, we apply the defaultColor.

var remark = get("target.targetInfo.remark").toLowerCase();

var canceledColor = "#FF5733";
var delayedColor = "#FFF200";
var defaultColor = "#FFFFFF";

if (remark === "cancelled" || remark === "canceled") {
  setTextColor(canceledColor);
} else if (remark === "delayed") {
  setTextColor(delayedColor);
} else {
  setTextColor(defaultColor);
}

H) Click Save again, and then exit the subdesigner using the Back button.

I) Row templates subwindow 

1. Select the row item.

J) Click the Save & Publish button. Now the template is ready to be assigned and shown on your display.