Create and Debug your first Application with Netgem
Posted By : Ajit Jati | 14-Nov-2013
After successfully setting up the netgem environment , one should seek to learn the first hello world program on tv as well as on debugging from monitor.This blog will drive you through the steps to create your first netgem application.
- We will start our application with NGM.application.start().it will load the corresponding js file automatically related to the main form.so replace the index.html with the following code.
<html><head>
<meta http-equiv="cache-control" content="no-cache">
<script src="lib:/module/public/std.js"></script>
<script>navigator.report_catch = 1</script>
<script>
NGM.application.start({
MainForm: "MyListFormWidget",
Thema: {"file": "myThema.json"}
});
</script>
<script>NGM.trace("Hello world")</script>
</head></html>
Note :You must enable the setting navigator.report_catch to display exception information on your monitor. For debug purpose we must disable http cahe i.e content="no-cache".
NGM.trace() method displays messages in monitor.
- Now Myformwidget.js will be loaded.The first function will be called in it is onEnter.So replace the with the following code.
FormWidget.registerTypeStandard("MyFormWidget");
function MyFormWidget(_json, _options)
{
this.super(_json, _options);
this._userData = _options.userData; // use UserData as you want
}
MyFormWidget.inherits(FormWidget);
MyFormWidget.prototype.onEnter = function onEnter(_data)
{
var ctx = canvas.getContext("2d");
ctx.clear();
ctx.fillStyle = "white";
ctx.fillText(50, 40, "Hello world");
canvas.animation.setEnable().move(320, 240).start();
canvas.animation.show(1000).start();
this._canvas = canvas;
}
MyFormWidget.prototype.onExit = function onExit()
{
}
MyFormWidget.prototype.onKeyPress = function onKeyPress(_key)
{
NGM.trace("myForm received a key: " + _key);
return false;
}
- In the onEnter function,we will craete a pure javascript canvas object with specified parameters(width = 320, height =260 etc)and initialize graphic buffer as well.
- Bydefault Canvas is disable and hidden , we have to enable it by setEnable.
- canvas.animation.show(1000).start() will start the buffer with fade effect after 1 sec.
- this._canvas = canvas makes sure no more reference on it will cause destruction.
Finally you can see something like this picture with some effects on your tv. 
Cheers :))
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Ajit Jati
Ajit is an proficient Project Manager specializing in Mobile technologies. He possesses extensive development experience in Titanium, Android, Kotlin, Roku, and PHP. Ajit has successfully delivered various projects in the OTT, AR/VR, and Travel industries. His skill set includes developing and maintaining project plans, schedules, and budgets, ensuring timely delivery while staying within the allocated budget. He excels in collaborating closely with clients to define project scope and requirements, establish project timelines and milestones, and effectively manage expectations. He conducts regular project status meetings, ensuring effective communication and providing updates to clients and stakeholders on project progress, risks, and issues. Furthermore, Ajit takes on the role of a coach and mentor for team,offering guidance on project management best practices and assisting in their skill development.