This is an AngularJS 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' directives which represent focusable elements, the 'nearestFocusableFinder' which is in charge of searching for the nearest focusable elements, and the 'focusController' which provides the focus related behaviors.
Example
js
var myApp = angular.module('myApp', ['caph.focus']);
myApp.controller('myController', function($scope) {
$scope.focus = function($event) {
$($event.currentTarget).css({
border: '1px solid yellow'
});
}
$scope.blur = function($event) {
$($event.currentTarget).css({
border: ''
});
}
});html
<body ng-app="myApp">
<div ng-controller="myController">
<div focusable on-focused="focus($event)" on-blurred="blur($event)">UP</div>
<div focusable on-focused="focus($event)" on-blurred="blur($event)">DOWN</div>
</div>
</body>