top

Mouse Event Handling

Published 2014-10-27 | (Compatible with SDK 3.5,4.5,5.0,5.1 and 2012,2013,2014 models)

Learn how to catch and handle mouse events in Samsung Smart TV applications

Generally, mouse event handling in Smart TV apps is not significantly different from common JavaScript rules. It has just two small differences in mouse event handling.

  1. Move onKeyDown position from <anchor> tag to <body> tag

    <body style="background: transparent;" leftmargin="0" topmargin="0" onKeyDown="handleKeyDown();">
        <div id="BG"></div>
        <div id="test" style="cursor: hand;"
            onclick="document.getElementById('test').innerHTML='clicked'"
            onmouseover="document.getElementById('test').innerHTML='mouseover'"
            onmouseout="document.getElementById('test').innerHTML='mouseout'"
            onmousewheel="document.getElementById('test').innerHTML='mousewheel'"
            onkeydown="alert('div keydown');"></div>
        <h2>Wheel Delta value: <span id="wheelvalue"></span></h2>
    </body>
    

In 2011 App Engine, it has only one input device(remote control) and its focus is always fixed to an anchor tag. After replaced with 2012 App Engine, apps can support various input device like mouse, key board and smart control. In this situation, if focus in use moves to other element by other device, the previous device can’t handle new key event any more. So, to handle key event on entire web view, onKeyDown should be move from anchor tag to body tag.

  1. Include mouse tag in Config.xml file.

    Config.xml

    <width>1280</width>
    <height>720</height>
    <mouse>y</mouse>
    <author>
        <name>Samsung Electronics</name>
        <email></email>
        <link>http://www.pavv.co.kr</link>
        <organization>Samsung</organization>
    </author>
    <type>user</type>
    

When app is executed, the App Manager opens config.xml file and checks <mouse> tag’s value. If the value is y, App Manager handles mouse event; and if the <mouse> tag have n, App Manager blocks every mouse input. By default (if <mouse> tag is missing from config.xml) mouse is disabled, so the existing applications which were written for 2011 application engine will still work but without any mouse support. So, to support mouse in such applications, position of onKeyDown should be changed and then mouse can be enabled by introducing <mouse> tag in config.xml.

Note

If there is no <mouse> tag in config.xml, App Manager recognizes <mouse> tag as n value.

n is the default value.