$(document).ready(function() {
   
    $(".items .item").click(function() {
        //alert($(this).children("a").attr('href'));
        //alert($(this).find(".video-img img").attr('src'));
        var obj = { file: $(this).children("a").attr('href'), image: $(this).find(".video-img img").attr('src') };
        player.sendEvent('LOAD', obj);
        player.sendEvent('PLAY');

    });
    try {
        $("#scrollable").scrollable({

            // default size is 5 
            size: 4,

            // set this to true when you want your items to be scrolled vertically 
            vertical: false,

            // default scrolling time in milliseconds  
            speed: 300,

            /*  
            default selector for nested element that will have  
            "move backwards" action automatically bind to it 
            */
            prev: '.prev',


            // default selector for "move onwards" action 
            next: '.next',

            /* 
            default selector for nested element that will contain a navigator 
            for swithing between pages. more about this in next chapter. 
            */
            navi: '.navi',


            // a flag whether scrolling starts over when last item is exceeded  
            loop: false,


            // HTML element name for single navigational entry inside navigator 
            naviItem: 'div',


            // CSS class name for clicked items and active naviItem elements 
            activeClass: 'active',

            /* 
            Items are selected by this selector. If none is found items will 
            be all elements that are directly nested under the root element  
            */
            items: '.items',

            /* 
            A function that is triggered when items are scrolled. Inside this 
            function this- variable points to the current scrollable instance 
            and you can use it's API (described later) 
            */
            onSeek: null

        });    
   }
    catch (e) { }
});