migrating legacy platform to tizen this topic describes how to convert applications from samsung legacy platform to tizen related info application api avplay api filesystem api web storage api to migrate an application from samsung legacy platform to tizen, you must import the project to the tizen studio, and make the necessary changes in the code importing an application project to import a samsung legacy platform application to tizen remove the existing "config xml" and "widget info" files from the application importantthe samsung legacy platform "config xml" file is not compatible with tizen create the project in the tizen studio you can do this in 2 different ways create a new web project in the tizen studio using the "empty" template and copy the existing application files to the new project import the existing samsung legacy platform project to the tizen studio as a tizen web project to import an existing project in the tizen studio menu, go to "file > import" select "general > existing projects into workspace" and click "next" select the existing project folder or archive file for more information, see creating web applications create a new "config xml" file for your project for more information, see configuring web applications ensuring html5 compatibility to conform to html5 standards, modules from the samsung legacy platform common modules api, such as the "widget js" and "plugin js" libraries, are no longer supported in tizen, the application manager functionalities are handled using the application api "widget js" library replace the "widget js" library methods with their html5 equivalents in tizen samsung legacy platform tizen widgetapi putinnerhtml pdiv,pcontents pdiv innerhtml = pcontents widgetapi blocknavigation event preventdefault widgetapi sendreadyevent - widgetapi sendexitevent tizen application getcurrentapplication exit widgetapi sendreturnevent tizen application getcurrentapplication hide table 1 tizen equivalents to samsung legacy platform "widget js" methods curwidget object the curwidget object is not used in tizen before curwidget id after tizen application getcurrentapplication appinfo id log messages in tizen, the alert method is used to display popup windows use the console log method to print log messages viewport configuration to display an application in fullscreen, set the application width as the viewport width in the "index html" file <meta name="viewport" content="width=960" /> for more information, see managing screen resolution setting content security policy you must set the content security policy in the "config xml" file tizen supports the w3c standard warp security rules to set the content security policy for the application in the "policy" tab of the configuration editor in the tizen studio, add a line to the table by clicking "+" in the "network url" column, enter your server address in the "allow subdomain" column, switch the value to "true" by clicking the table cell ensuring user interaction tizen handles user interaction differently from samsung legacy platform anchor elements in samsung legacy platform, when mouse devices were not supported, applications registered the keydown event for clicks on an anchor element in tizen, use the click event for mouse and remote control clicks to migrate key handling on anchor elements to tizen if there is only 1 anchor element, in the body element, register the key handler at the anchor element if there are multiple anchor elements, key handlers are needed, but each case can be implemented differently depending on the context ime tizen provides the ime by default when an input element is focused, the ime appears automatically you do not need to create the ime using the imeshell method for more information on implementing the ime in tizen, see keyboard/ime key values the key values in the samsung legacy platform "tvkeyvalue js" library have changed in tizen if you want to continue using the same keyvalue enumeration as before, include the tizentvkeyvalue js file direct download <script src="common/api/tizentvkeyvalue js"></script> // tizentvkeyvalue js maps tizen keycode values to legacy platform' js // you can use the same "keyvalue" values from the legacy platform var tvkey = new common api tvkeyvalue ; play/pause key the basic remote control was distributed with samsung tvs until 2014 since 2015, samsung smart tvs are distributed with a samsung smart remote the samsung smart remote has a "play/pause" key, and you must make sure your tizen application handles its key clicks correctly during media playback, clicking the "play/pause" key must pause playback, and clicking it while playback is paused must resume playback supporting multitasking multitasking is supported by default on samsung tvs using tizen unlike in samsung legacy platform, you do not need to configure multitasking in the "config xml" file however, you must register an event handler for visibility changes the sendreturnevent , onpause , and onresume methods are not used in tizen before window onpause = function { // pause } window onresume = function { // resume } after document addeventlistener "visibilitychange", function { if document hidden { // something you want to do when application is paused console log "lifecycle [pause]" ; // this code handles playing media when application is hidden // webapis avplay suspend ; } else { // something you want to do when application is resumed console log "lifecycle [resume]" ; // this code handles playing media when application is visible // webapis avplay restore ; } } ; implementing screensaver in samsung legacy platform, the application controlled the screensaver using the setonscreensaver and setoffscreensaver methods the screensaver functionality is handled by the samsung product api in tizen before var nnaviplugin = document getelementbyid "pluginobjectnnavi" ; // screensaver on var screenstateon = 3; nnaviplugin sendeventtodevice screenstateon, 1 ; // screensaver off // var screenstateoff = 4; //screensaver off // nnaviplugin sendeventtodevice screenstateoff, 1 ; after function onsuccess data { console log "setscreensavervalue = " + data ; } function onerror error { console log "error code " + error code ; } try { // screensaver on var screenstate = webapis appcommon appcommonscreensaverstate screen_saver_on; // screensaver off var screenstate = webapis appcommon appcommonscreensaverstate screen_saver_off; var value = webapis appcommon setscreensaver screenstate, onsuccess, onerror ; } catch error { console log " error code = " + error code ; } for more information, see setting screensaver playing media in samsung legacy platform, media playback was implemented using a plugin object and the player api these are not supported in tizen in tizen, you can implement media playback in 2 different ways using the html5 video and audio elements common media formats can be played using the html5 video and audio elements for more information, see using video elements and using audio elements using the avplay api from the samsung product api the avplay api has additional features, such as support for drm technologies and live streaming for more information, see using avplay to implement media playback with a video element player implementation before // getelement var videoelem = document getelementbyid "pluginplayer" ; // setdisplayarea videoelem setdisplayarea left, top, width, height ; // set any value // init videoelem initplayer url ; // set your url // after initplayer is called seek play to sec videoelem startplayback sec ; // set any value // play videoelem play url ; // set your url // pause videoelem pause ; // resume videoelem resume ; // stop videoelem stop ; // rewind / fast forward videoelem jumpforward sec ; videoelem jumpbackward sec ; // get duration var duration = videoelem getduration ; // get mute status var mutestatus = videoelem getusermute ; // set mute videoelem setusermute true ; // videoelem setusermute false ; // set volume videoelem setvolumewithkey 0 ; // get volume var volume = videoelem getvolume ; after // getelement var videoelem = document createelement "video" ; videoelem style backgroundcolor = "#000"; document body appendchild videoelem ; // setdisplayarea videoelem style left = left + "px"; // set any value videoelem style top = top + "px"; // set any value videoelem style width = width + "px"; // set any value videoelem style height = height + "px"; // set any value // init videoelem src = url; // set your url videoelem load ; // seek play to sec if sec > 0 { var jumper = function { this currenttime = sec; this removeeventlistener 'loadedmetadata', jumper ; }; videoelem addeventlistener 'loadedmetadata', jumper ; } videoelem play ; // play videoelem src = url; // set your url videoelem play ; // pause videoelem pause // resume videoelem play ; // stop if videoelem readystate > 0 { videoelem src = ''; } // rewind / fast forward videoelem currenttime += sec; videoelem currenttime -= sec; // get duration var duration = videoelem duration * 1000; // get mute status var mutestatus = videoelem muted; // set mute videoelem muted = true; // videoelem muted = false; // set volume deprecated // get volume var volume = videoelem volume; event handler implementation before // load metadata videoelem onstreaminfoready // time update videoelem oncurrentplaytime = "player oncurrentplaytime"; // ended videoelem onrenderingcomplete; // buffering event videoelem onbufferingstart = "player onbufferingstart"; videoelem onbufferingcomplete = "player onbufferingcomplete"; // error videoelem onrendererror = "player onrendererror"; videoelem onstreamnotfound = "player onstreamnotfound"; videoelem onconnectionfailed = "player onconnectionfailed"; videoelem onnetworkdisconnected = "player onnetworkdisconnected"; after // load metadata videoelem addeventlistener 'loadedmetadata', function {}, false ; // time update videoelem addeventlistener 'timeupdate',function { player oncurrentplaytime this currenttime * 1000 ; }, false ; // ended videoelem addeventlistener 'ended', function {}, false ; // buffering event var bbuffering = false; videoelem addeventlistener "stalled", function e { console log "stalled" ; !bbuffering && player onbufferingstart ; bbuffering = true; }, false ; videoelem addeventlistener "waiting", function e { console log "waiting" ; !bbuffering && player onbufferingstart ; bbuffering = true; }, false ; videoelem addeventlistener "timeupdate", function e { bbuffering && player onbufferingcomplete ; bbuffering = false; } ; // error videoelem addeventlistener "error", function e { if this getattribute "src" === "" && this error code === mediaerror media_err_src_not_supported { // media_err_src_not_supported occurs // when changing or initializing source during playback // do not treat this as an error // this src is not null string but baseuri "index html" path // use the getattribute method to get the current source } else if this error && typeof this error code === "number" { switch this error code { case mediaerror media_err_aborted player onconnectionfailed call playerevtlistener, e ; break; case mediaerror media_err_encrypted case mediaerror media_err_decode case mediaerror media_err_src_not_supported player onrendererror call player, e ; break; case mediaerror media_err_network player onnetworkdisconnected call player, e ; break; default playerevtlistener onrendererror call player, e ; } } } ; accessing file system samsung legacy platform provided 2 file system apis the asynchronous filesystem api of the webapi module the synchronous filesystem method of the browser api if you use the asynchronous filesystem api, you do not need to make changes to the application logic in tizen, however, the filesystem api is no longer part of the webapi module but a tizen api before webapis filesystem resolve after tizen filesystem resolve tizen does not provide a synchronous file system api if you used the filesystem method, you must change your application implementation in one of the following ways adapt the application logic to use the file system asynchronously and use the filesystem api before var filesystemobj = new filesystem ; var fileobj = filesystem obj opencommonfile curwidget id + "sample data", "w" ; fileobj writeall "something to write " ; var str = fileobj readall ; filesystemobj closecommonfile fileobj ; filesystemobj deletecommonfile curwidget id + "sample data" ; after var str; tizen filesystem resolve "wgt-private", function dir { dir createfile "sample data" ; dir resolve "wgt-private/sample data" openstream "rw", function stream { stream write "something to write " ; str = stream read 100 ; stream close ; tizen filesystem resolve "wgt-private", function dir2 { dir2 deletefile "wgt-private/sample data" ; } ; } ; } ; if it is difficult to adapt the synchronous logic to asynchronous logic, you can use the web standard web storage api for more information, see using web storage importantthe localstorage object has weak security, as other applications can also access the data always use a unique key value, and always encrypt security- or privacy-related data stored in the localstorage object before // write data var filesystemobj = new filesystem ; var fileobj = filesystemobj opencommonfile curwidget id + '/testfile data', 'w' ; fileobj writeall 'something to write ' ; filesystemobj closecommonfile fileobj ; // read data var fileobj = filesystemobj opencommonfile curwidget id + '/testfile data', 'r' ; var strresult = fileobj readall ; // delete file var bresult = filesystemobj deletecommonfile curwidget id + '/testfile data' ; // validation check var bvalid = filesystemobj isvalidcommonpath curwidget id ; after // write data localstorage setitem 'testfile', 'something to write ' ; // read data var strresult = localstorage getitem 'testfile' ; // delete file localstorage removeitem 'testfile' ; // validation check // always true
