/* home.js */

Ext.onReady(function() {
    
    function setSelectedCollection(index) {
        var collection_paging_li, photo_li;
        collection_paging_li = Ext.fly('collection_paging-' + index);
        collection_paging_li.radioClass('selected');
        photo_li = Ext.fly('multimedia-item-' + index);
        photo_li.radioClass('selected');
        collection_index = index;
    }

    collection = Ext.get('multimedia');
    collection.on('mouseover', function() {
        pause_collection = true;
    });
    collection.on('mouseout', function() {
        pause_collection = false;
    });

    photos = Ext.select('ul.multimedia-items li', false, 'multimedia'),
    collection_paging = Ext.fly('multimedia').createChild({ tag: 'ul', cls: 'paging' }),
    photos.each(function(el, array, index) {
        var collection_paging_li = collection_paging.createChild({ tag: 'li', id: 'collection_paging-' + (index + 1), html: index + 1});
        el.dom.id = 'multimedia-item-' + (index + 1);
        if(index == 0) {
            setSelectedCollection(1);
        }
    });

    collection_paging.on('click', function(evt, t, o) {
        var collection_paging_li, collection_paging_index, photo_li;
        collection_paging_li = Ext.fly(t);
        collection_paging_index = collection_paging_li.dom.id.split('-')[1];
        setSelectedCollection(collection_paging_index);
    }, this, {
        delegate: 'li'
    });

    var pause_collection = false;
    var collection_index = 0;
    var collection_task = {
        run: function(){
            if(!pause_collection){
                if(collection_index >= photos.elements.length)
                    collection_index = 0;
                collection_index++;
                setSelectedCollection(collection_index);
            }
        },
        interval: 4000 //4 second
    }
    Ext.TaskMgr.start(collection_task);

    social_media = Ext.get('social-media');
    if(social_media && social_media.hasClass('has_facebook') && social_media.hasClass('has_twitter')){

        function setSelectedSocialMedia(item){
            social_media_paging_li = Ext.fly('social_media_paging-' + item);
            social_media_paging_li.radioClass('selected');
            social_media_dl = Ext.select('#social-media dl.social-media-sources', true).item(0);
            if(social_media_dl.hasClass(social_media_item))
               social_media_dl.removeClass(social_media_item);
            if(!social_media_dl.hasClass(item))
                social_media_dl.addClass(item);
            social_media_item = (social_media_item == 'facebook') ? 'twitter' : 'facebook';
        }

        social_media.on('mouseover', function() {
            pause_social_media = true;
        });
        social_media.on('mouseout', function() {
            pause_social_media = false;
        });
        
        social_media_paging = Ext.fly('social-media').createChild({ tag: 'ul', cls: 'paging' }),
        social_media_paging.createChild({ tag: 'li', id: 'social_media_paging-facebook', html: 'Facebook'});
        social_media_paging.createChild({ tag: 'li', id: 'social_media_paging-twitter', html: 'Twitter'});
        setSelectedSocialMedia('facebook');
    
        social_media_paging.on('click', function(evt, t, o) {
            var social_media_paging_li, social_media_paging_index;
            social_media_paging_li = Ext.fly(t);
            social_media_paging_item = social_media_paging_li.dom.id.split('-')[1];
            setSelectedSocialMedia(social_media_paging_item);
        }, this, {
            delegate: 'li'
        });

        var pause_social_media = false;
        var social_media_item = 'facebook';
        var social_media_task = {
            run: function(){
                if(!pause_social_media){
                    setSelectedSocialMedia((social_media_item == 'facebook') ? 'twitter' : 'facebook');
                }
            },
            interval: 4000 //4 second
        }
//        Ext.TaskMgr.start(social_media_task);
    }
});