Unable to control volume in samsung smart tv application

Question

I'm putting various content in the div tag in index.html. One of them is video. When video is selected from the menu, i put player and audio objects and initialize them:

var html_data = '<object id="pluginPlayer" border=0 classid="clsid:SAMSUNG-INFOLINK-PLAYER"></object>';
html_data += '<object id="pluginAudio" border=0 classid="clsid:SAMSUNG-INFOLINK-AUDIO"></object>';
widgetAPI.putInnerHTML($('#main-content')[0], html_data);

and i initialize them with

Player.init();
Audio.init();
Player.setVideoURL(url);
Player.playVideo();

Video starts to play and when i try to control the volume with + and - volume keys i get the following trace:

Error Detail: Uncaught TypeError: Object #<HTMLObjectElement> has no method 'SetVolumeWithKey'

On the other hand, player (initialized and used in the same way) has no problems with its methods.

Here is the code:

index.html

<script type="text/javascript" language="javascript" src="$MANAGER_WIDGET/Common/API/Widget.js"></script>
<script type="text/javascript" language="javascript" src="$MANAGER_WIDGET/Common/API/TVKeyValue.js"></script>
<script type="text/javascript" language="javascript" src="$MANAGER_WIDGET/Common/API/Plugin.js"></script>
<script type="text/javascript" language="javascript" src='$MANAGER_WIDGET/Common/jquery.js'></script>
...
<script language="javascript" type="text/javascript" src="app/javascript/Main.js"></script>
<script language="javascript" type="text/javascript" src="app/javascript/Player.js"></script>
<script language="javascript" type="text/javascript" src="app/javascript/Audio.js"></script>

Main.js

Main.keyDown = function()
{
    var keyCode = event.keyCode;
    switch(keyCode){
    ...
        case tvKey.KEY_VOL_DOWN:
        case tvKey.KEY_PANEL_VOL_DOWN:
            alert("VOL_DOWN");
            Audio.setRelativeVolume(1);
        break; 
    }
    ...
}

Audio.js

var Audio =
{
    plugin : null
}

Audio.init = function(){
    var success = true;
    this.plugin = document.getElementById("pluginAudio");
    if (!this.plugin)
    {
        success = false;
    }
    return success;
}

Audio.setRelativeVolume = function(delta){
    //error reports here 
    this.plugin.SetVolumeWithKey(delta);
}

Audio.getVolume = function(){
    alert("Volume : " +  this.plugin.GetVolume());
    return this.plugin.GetVolume();
}

I've tried to add pluginAudio object to head of html, before and after .js calls, tried to register/unregister keys with

Main.onLoad = function(){

    window.onshow = function () {
        //pluginAPI.registKey(tvKey.KEY_VOL_UP);
        //pluginAPI.registKey(tvKey.KEY_VOL_DOWN);
        //pluginAPI.registKey(tvKey.KEY_PANEL_VOL_UP);
        //pluginAPI.registKey(tvKey.KEY_PANEL_VOL_DOWN);
        //pluginAPI.unregistKey(tvKey.KEY_VOL_UP);
        //pluginAPI.unregistKey(tvKey.KEY_VOL_DOWN);
    }
}

and even tried Samsung test app from dev forum, and I get the same error when trying the volume keys.

Any ideas what is wrong, please? I need to control custom video (not TV program) volume with volume up and down keys (key values 7 and 11 - if not mistaking).

Answer 1

It turns out that the solution is quite simple. I'll answer the questions in case someone else has the similar problem like me.

First of all, I need additional objects in index.html head (and moved Audio there also):

<object id="pluginAudio" border=0 classid="clsid:SAMSUNG-INFOLINK-AUDIO"></object>
<object id="pluginObjectTVMW" border="0" classid="clsid:SAMSUNG-INFOLINK-TVMW"></object>
<object id="pluginObjectNNavi" border=0 classid="clsid:SAMSUNG-INFOLINK-NNAVI"></object>

pluginObjectTVMW can be declared in:

var Main =
{
    pluginAPI: null
};

Main difference is that I was trying window.onshow, but it needs to be window.onLoad, so it should be like this (module has time to load):

Main.onLoad = function(){

    window.onLoad = function () {
        Main.pluginAPI = document.getElementById("pluginObjectTVMW");
        Audio.init();
        NNaviPlugin = document.getElementById("pluginObjectNNavi");

        NNaviPlugin.SetBannerState(1);

        pluginAPI.unregistKey(tvKey.KEY_VOL_UP);
        pluginAPI.unregistKey(tvKey.KEY_VOL_DOWN);
        //unregister other keys as explained in NNavi module below
    }
}

NNavi module explanation from Playing Embedded MP3 with TV Volume On-screen Display tutorial:

The NNavi module controls Samsung Smart TV specific functions (for example, DUID and ServerType ) in the DTV platform. The SetBannerState(nState) function of the NNavi module shows the TV volume. nState is set to ‘1’ to show the volume OSD. To show the Volume OSD on screen, volume keys, Mute , Exit , Menu and Internet@TV keys are unregistered using the unregist() function of Common.API.Plugin.

and the change in Audio is:

Audio.setRelativeVolume = function(delta){
    this.plugin.SetVolumeWithKey(delta);
    //apply volume to player
    Player.plugin.audioVol(this.plugin.GetVolume);
}

One final note is that I've moved Audio plugin to head tag, instead of inserting it "on demand" like Player, like I've stated in the beginning.

That is basically it. A beginners mistake for not waiting to fully load stuff, but I got tricked by Player (pluginPlayer) being ready immediately.

Regards