This is a jQuery extension module which provides functionality to navigate the focusable elements using the remote controller which is a main input device of TV. It consists of 3 parts: the 'focusable' attribute which represents focusable elements, the 'nearestFocusableFinder' which is in charge of searching for the nearest focusable elements, and the 'controller' which provides the focus related behaviors.
Example
js
$(document).ready(function() {
$.caph.focus.init(function(nearestFocusableFinderProvider, controllerProvider) {
controllerProvider.onFocused(function(event, originalEvent) {
$(event.currentTarget).css({
border: '1px solid yellow'
});
});
controllerProvider.onBlurred(function(event, originalEvent) {
$(event.currentTarget).css({
border: ''
});
});
});
});html
<body>
<div>
<div focusable>UP</div>
<div focusable>DOWN</div>
</div>
</body>