25 May, 2022
Blog
By Anders Svensson
In our previous article Par1 of this series, we presented the Agama AWE SDK, the requirements needed to create a simple application to provide real use for Agama customers and the configuration of the project.
In the second part of the series, we're diving into how to create the layout and styling, and also elaborate on the application logic.
We have created a boilerplate application and defined the configuration parameters that shall be possible for the users to adapt. It is now time to start creating the actual functionality of the application. An important part of that is the actual layout and structure of the presentation, which for these applications is controlled by standard HTML, CSS, and JavaScript. In the application index.html below, we have modified the boilerplate HTML structure and instead defined a set of div:s used as placeholders for the configured test name and a div for the status indicator.
The ADE will automatically update the UI while editing and saving HTML so the structural changes will be shown immediately. The result is not interesting right now as we have not yet populated the div:s with any content and styling, so the result is still just an empty screen.
The Application logic To start populating the application with the configured content, test logic and the test status results, we need to start adding JavaScript code.
The main application entry point that is called by the Agama application framework is the onUpdate function. This function has two parameters, state and reason. The state parameter is an object that contains the configuration of the application. So, all the parameters that we defined in the JSON returned in the onConfiguration function, will be available in this object. The reason parameter is an integer stating why the function is being called; it allows us to implement different handling and behavior depending on this. In our application we must handle the create and configuration change reason. In the code above one can see how easily and obviously we can access and use the different configuration parameters that we have defined.
The program logic needed to implement the functionality is quite simple. When the application is created, we set up a timer that ensures that our test function update() is called at the user configured interval. The update() function in turn calls the defined REST API and checks the result codes against the configured, and depending on the result adding either a fail or ok CSS class to the status div.
The current result is now as above. We can now see the defined test name, in this case VoD system (which is the name we configured) but we do not see any status symbol. That is correct and it is because we have not yet added the styling for the status div.
Styling Adding CSS styling for the application is the last step in getting the applications appearance and functionality in-place. We use the automatically created file css/style.css and add the following.
It is here where we define the fail to indicate with an orange background, and ok to indicate with a green background.
Yes, now it looks more promising!
Most recent headlines
05/01/2027
Worlds first 802.15.4ab-UWB chip verified by Calterah and Rohde & Schwarz to be ...
04/08/2026
Dalet, a leading technology and service provider for media-rich organizations, t...
04/07/2026
April 7 2026, 19:00 (PDT) Detective Conan: Fallen Angel of the Highway Opens in...
02/06/2026
The TV agency was one of the earliest adopters of Nielsen's local television...
02/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
02/06/2026
Grass Valley today announced that Australian News Channel (ANC), operator of Sky News Australia, has deployed Grass Valley AMPP to transform its newsroom produc...
02/06/2026
Studio Technologies, a leading manufacturer of high-quality audio, video, and fiber-optic solutions, announces its new Model 385 Mic/Intercom Beltpack. The Mode...
02/06/2026
The Riedel Group today announced the appointment of Gudrun Scharler as CEO of Riedel Networks. She succeeds Michael Martens, who has led Riedel Networks since 2...
02/06/2026
More signals, higher quality, and outstanding ingest and streaming flexibility deliver professional results in a small, all-in-one footprint...
02/06/2026
farmerswife will be featured on the Modena Media & Entertainment stand at this year's Mediatech Africa 2026, giving visitors an opportunity to explore the l...
02/06/2026
PTZOptics will showcase a new generation of intelligent video workflows at InfoComm 2026, June 17 19, Las Vegas. Visitors to booth N8227 will see how PTZOptics ...
02/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
02/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
02/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
02/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
02/06/2026
Trust has become a commercial issue With global advertising spend forecast to exceed US$1 trillion this year*, the commercial consequences of weak governance co...
02/06/2026
June sees Ireland's cultural calendar in full bloom, as RT Supporting the Arts showcases a vibrant and wide-ranging programme spanning music, theatre, visu...
02/06/2026
After The Traitors Ireland launched in 2025, Irish audiences proved to have a taste for the global hit reality show. This Bank Holiday Monday fans can indulge e...
01/06/2026
In its sixth year, the broadcaster's coverage has become a global brand and ...
01/06/2026
Designed to solve a common problem in broadcasting, the automated workflow detects, identifies, removes, and documents copyrighted music
AudioShake has introdu...
01/06/2026
The sports-analytics company combines its data with proprietary AI to help leagu...
01/06/2026
Category line-up & sponsors announced
Photo: Paul Clarke
The Production Music Awards (PMA) have announced that submissions are now officially open ahead of...
01/06/2026
New hybrid sample/synthesis instrument revealed
Excite Audio have just released the latest instalment in their Evolve series, which has been developed in co...
01/06/2026
Latest TONEX expansion captures three rare vintage amps
The newest addition to IK Multimedia's ever-growing TONEX line-up introduces a set of three incr...
01/06/2026
Musically intelligent soft synth gets upgraded
Scaler Music will be probably be best known to many for their music theory tools, but their product range al...
01/06/2026
SBS confirms its broadcast sponsors for FIFA World Cup 2026
1 June, 2026
Media releases
SBS has secured Hyundai, Hisense, Macca's, Rexona, bet365, Com...
01/06/2026
Rohde & Schwarz Satellite Industry Days 2026 guided by the motto From Earth to ...
01/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
01/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
01/06/2026
Marshall Electronics is showcasing a comprehensive lineup of next-generation POV cameras, purpose-built to power today's connected AV environments, at InfoC...
01/06/2026
Adobe Announces Concept to Vector
Deepa Subramaniam June 1, 2026
0 Comments
One of the biggest frustrations we hear from designers is how difficult it...
01/06/2026
Vampire Feature Night Patrol Graded with DaVinci Resolve Studio
Brie Clayton June 1, 2026
0 Comments
Colorist shapes dark, gritty tone for horror thri...
01/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
01/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
01/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
01/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
01/06/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
01/06/2026
Luxembourg, June 1, 2026 - SES, a leading space solutions company, and Viva, Mexico's ultra low-cost airline, launched fast and reliable multi-orbit satelli...
01/06/2026
Agentic AI is getting physical.
At COMPUTEX on Tuesday, NVIDIA announced NVIDIA JetPack 7.2 and NVIDIA NemoClaw support on NVIDIA Jetson.
JetPack 7.2 brings a...
01/06/2026
Financial institutions have spent years building AI: fraud models, credit models...
01/06/2026
Mardi 2 juin 14h00
FilmLight (ARRI), 10 rue Ren Boulanger, 75010 Paris
Rejoignez-nous pour d couvrir comment FLAPI (l'API FilmLight) peut transformer e...
01/06/2026
January 6 2026, 05:30 (PST) Dolby Sets the New Standard for Premium Entertainment at CES 2026
Throughout the week, Dolby brings to life the latest innovatio...
31/05/2026
Olivia P rez-Collellmir to Premiere Original Work at Gaud Centennial in Barcelona The Berklee graduate and faculty member will debut her choral symphony with...
31/05/2026
Back to All News
Netflix Wins 15 Awards at the Canadian Screen Awards - See Pho...
31/05/2026
Taiwan is home to more than 500 NVIDIA ecosystem partners. More than 1 million N...
31/05/2026
As factories move from isolated automation to plant-wide intelligence, manufacturers need AI systems that can connect live machine signals, quality systems, wor...
31/05/2026
The NVIDIA AI Cloud ecosystem is accelerating the global buildout of AI factory infrastructure. Partners are expanding capacity to meet growing demand from ente...
30/05/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
30/05/2026
Share
Copy link
Facebook
X
Linkedin
Bluesky
Email...
25 May, 2022
