Steps to Convert a Tizen Application to Orsay

4waytechnologies

4 Way Technologies is a premium IT services company that develops web, mobile, and SMART TV applications using cutting-edge technologies like React, Node.JS, Deno, Go lang, AWS, and AEM. We establish our thought leadership by sharing content and insights around technology.

4 Way Technologies is a leading Samsung TV App Development Company across the globe. We have expert teams of developers who are proficient in delivering you the robust, feature-rich, and powerful Samsung TV applications. We provide a number of impeccable services to our customers such as migration of your legacy systems to Cloud, security, future support, complete application management, and more. These services are responsible for increasing the growth of your business and outperforming your competitors.

The Samsung TV app development is developed using HTML and CSS. When the native component of the Smart TV is not being used, it is used in developing the application for it to run on the different Smart TV’s like the Tizen, LG, Opera, Smart Alliance, Orsay.

This article will help you in understanding the steps required to convert a Tizen-based application to Orsay.

Introduction

The Samsung TV app developer requires the Tizen code and the Samsung Smart TV SDK along with the IDE. Additionally, the Samsung TV app developer will need to have immense knowledge about HTML, JavaScript, AngularJS, and CSS. Just like the Samsung TV app development process, there are some necessary steps required for the conversion of the Tizen application to the Orsay.

So, let’s dive in!

What are the Steps to Convert a Tizen Application to Orsay?

The sample project was created for Orsay TV. The AngularJS based application is completely based on the HTML/UI component type, instead of the usual Native UI component. Here, the focus handling is being done by either the AngularJS or the JavaScript as well.

The Samsung Tv app developer, on creating the project for the Orsay TV, will find two files automatically created namely the widget.info and config.xml. This widget.info is mainly responsible for managing the resolution.

The other file config.xml is the one that has the complete configuration of the entire project. The Samsung TV app developer will now delete the config file of the Tizen application and paste the contents in the project created.

Now, in the Samsung TV app development, the Tizen OS dependent file needs to be deleted from the index by the Samsung TV app developer.

<script src=”$WEBAPIS/webapis/webapis.js” type=”text/javascript”></script>

The next major step will be to add the common API in the Index.html file in order to run the application in the Samsung app development process.

<!– Common widget API–><script type=”text/javascript”

src=”$MANAGER_WIDGET/Common/API/Plugin.js”></script>

<script type=”text/javascript” language=”javascript” src=”$MANAGER_WIDGET/Common/API/TVKeyValue.js”></script>

The Caph library that is very much required for the Samsung TV app development can be added by the Samsung TV app developer in the Index.html.

<!– Caph Library –>

<script src=”$CAPH/1.0.0/caph-level1-unified.min.js” type=”text/javascript”></script>

The function is then added to the onload of the body section to start the application.

<body onload=”func_onLoad();”> </body>

The next step will be to add the script to the head section of the index.html that contains the function named func_onLoad() that is required to start the application in the Samsung TV app development.

<script>
var flag = false;
var widgetAPI = new Common.API.Widget();
var pluginAPI = new Common.API.Plugin();
function func_onLoad() 
{
if (typeof curWidget != ‘undefined’) 
{
curWidget.setPreference(“ready”, “true”);
}
if (!caph.platform.dtv.Browser
|| caph.platform.dtv.Browser.browserType().sectvbd) 
{
}
else
{
widgetAPI.sendReadyEvent();
}
}
window.onShow = function(e);
{
if (flag === false)
{
flag = true;
widgetAPI.sendReadyEvent();
}}
</script>

Now, from the Samsung TV app development, the mapping of TV keys will have to change from the Tizen to the Orsay. Now in the Development of Samsung SMART TV App, the application now runs successfully with the entire focus of the application. The changed Mapping keys can be coded like below:

var tvKeyOrsay = new Common.API.TVKeyValue();
var tvKey =
{
KEY_RETURN : tvKeyOrsay.KEY_RETURN,
KEY_PANEL_RETURN : tvKeyOrsay.KEY_PANEL_RETURN,
KEY_EXIT : tvKeyOrsay.KEY_EXIT
};

The Samsung TV app developer then will have to completely block the default navigation to return the keys of the remote control.

window.addEventListener(“keydown”, function (event)
{
switch (event.keyCode)
{
case tvKey.KEY_RETURN:
var widgetAPI = new Common.API.Widget();
widgetAPI.blockNavigation(event);
break;
}}

The next step is that the Samsung TV app developer needs to completely change the exit key functionality that helps in the Samsung TV app development conversion.

window.addEventListener (“keydown”, function (event)
{
switch (event.keyCode)
{
case tvKey.KEY_EXIT:
var widgetAPI = new Common.API.Widget();
widgetAPI.sendExitEvent(event);
break;
}
}

For the Samsung app development, the above steps should be followed sequentially to convert the Tizen application to Orsay. Features like network connection scanning, keyboard handling, application resolution can also be achieved to utilize the full advantages of the Android TV app development.

Few of the points to be noticed for the Samsung TV app developer during this conversion is to always include the platform dependent features in a single place, prefer creating unique platform dependent functions to perform the various operations like the return, exit etc.

Conclusion

We hope you will find this tutorial helpful. After going through the above-mentioned approaches, you as a Samsung TV app developer can easily convert Tizen to Samsung TV application development medium like Orsay thereby converting applications for different Smart TVs. Please provide your valuable feedback in the comment section below.