Ext.define('ES.Projects', {
    singleton: true,
    
    projects: null,
    pos: 0,
    
    init: function(projects) {
        var me = this;
        
        me.projects = projects;
        me.showNext();
        
        me.el = Ext.get('box_projects_image');
    },
    
    showNext: function() {
        Ext.callback(this.next, this, null, 4000);
    },
    
    next: function() {
        var me = this,
            project;
        
        me.pos++;
        
        if (me.pos == me.projects.length) {
            me.pos = 0;
        }
        
        project = me.projects[me.pos];
        
        me.el.animate({
            to: {
                opacity: 0
            },
            listeners: {
                afteranimate: function() {
                    me.el.set({src: 'public/images/portfolio_mini/' + project.image});
                    new Ext.fx.Anim({
                        target: me.el,
                        to: {
                            opacity: 1
                        },
                        duration: 1000,
                        listeners: {
                            afteranimate: function() {
                                me.showNext();
                            }
                        }
                    })
                    
                    
                }
            }
        })
        
    }
})