var index = 0;
Ext.onReady(function(){

    var catalog = [{
        id:'title',
        title: 'InLead Management',
        cls:'slide-item-over',
        slides: [{
            url: 'product.php?name=inlead',
			image: 'slider/inLead.png',
			title: 'SMART WAY TO MANAGE YOUR FRANSHISE',
            text: 'If you have a sizeable franchise operation and your franchisees are involved in '
				+ 'Customer Relationship Management then this is the right solution for you.'            
        }]
    },{
        id:'title',
        title: 'Campaign Management System',
        slides: [{
                url: 'product.php?name=cmsweb',
				image: 'slider/cmsWeb.png',
				title: 'CHANGE YOUR BUSINESS MANAGEMENT',				
                text: 'With a large large volume of data spread in different databases and in single Pc’s'
	                + 'you can not effectivly track data change, you can not track history of data, you'
	                + 'can not create campaigns, track client response or view and measure efficiency.'
	                + 'Since this is very wide problem, we at Ilumnis have creted a tool to satisfy this'
	                + 'kind of needs for your company.'
        }]
    },{
        id:'title',
        title: 'Jobs',
        slides: [{
                url: 'jobs.php',
				image:'slider/jobs.png',
				title:'We handle many parts of your marketing effort like data processing needs',                
				text: 'Data cleaning, data acquisition, modeling and campaign management. We provide online reporting so you can get feedback about consequences of your actions in a timely fashion. We develop other functionality around your marketing effort so you can avoid high cost of large software systems.'       
        }]    
    },{
        id:'title',
        title: 'HTTP File Transfer',
        slides: [{
                url: 'product.php?name=fltrs',
                image: 'slider/fileTransfer.png',
                title: 'Transferring files with sensitive information over the internet',                
                text: 'HTTP File Transfer is Web 2.0 (AJAX driven) application which can be used for file transferring via HTTP(S) protocol. You can upload, download and delete files, create or delete folders on server, depending on your user privileges. This application is easy to use because it has interactive and intuitive Explorer-like web interface– it has a folder tree, details area and right mouse buttons can be used for available options so.'
        }]
    },{
        id:'title',
        title: 'Custom Software Development',
        slides: [{
                url: 'service.php?name=1_softdev',
                image: 'slider/cstDev.png',
                title: 'CUSTOM SOFTWARE DEVELOPMENT',
                text: 'We can design a solution that integrates with the existing products and systems you are currently using. Our products are always designed to grow in order to meet the future needs of your business, and to integrate new technological advancements.'
        }]
    }];

    var tpl = new Ext.XTemplate(
            //'<ul>',
            '<tpl for=".">',
                '<div class="slide-item {cls}" id="slide-{#}">&#160;&#160;&#160;&#160;<span>{title}</span></div>',
                //'<li class="slide-item {cls}" id="slide-{#}">&#160;&#160;&#160;&#160;<span>{title}</span>',
            '</tpl>'
            //'</ul>'
    );

    //tpl.overwrite('slide-menu', catalog);

    var slidesTpl = new Ext.XTemplate(
            '<tpl for="slides">', 
				'<div class="slide-image"><img alt="" src="images/{image}"/></div>',
				'<div class="slide-text">',					
					'<h1>{title}</h1>',
					'<p>{text}</p>',
				'</div>',
				'<div class="slide-moreinfo"><a href="{url}"><img src="gfx/blank.gif" alt="Read more" title="Read more" /></a></div>',
            '</tpl>'
    );

    var imgTpl = new Ext.XTemplate(
        '<dl>',
            '<tpl for="slides">',
            '<dt><a href="{url}" target="_blank">',
                '<img alt="" class="slide-image" src="/ilumnisweb/images/{icon}"/></a><br/>',
                '<div>{html}</div>',
            '</dt>',
            '</tpl>',
        '</dl>'
    );

    //var menu = Ext.get('slide-menu');
    var box = Ext.get('slide-box');
    var buttonForward = Ext.get('forward');
    var buttonBackward = Ext.get('backward');

    var running = null;
	active = box.child('div.slide-slider');
    function clearRunning(){
        running = null;
    }
    
    var task = {
        run: function()
        {           
            var s = catalog[index];
            if(running){
                running.stopFx();
            }
            if(active){
                //active.slideOut('r', {duration: .75, remove:true});
                active.fadeOut({
					endOpacity: 0,
					easing: 'easeOut',
					duration: 1,
					remove: false,
					useDisplay: false
                });
            }else{
                box.child('div').hide();
            }
            s.el = new Ext.Element(document.createElement('div'));
            s.el.addClass('slide-slider');
            s.el.enableDisplayMode();
            if(s.id != 'title'){
                imgTpl.overwrite(s.el.dom, s);
            }else{
                slidesTpl.overwrite(s.el.dom, s);
            }
            s.el.appendTo(box);
            //s.el.slideIn('l', {callback: clearRunning, duration: .75});
            s.el.fadeIn({
				endOpacity: 0,
				easing: 'easeIn',
				duration: 3,
				remove: false,
				useDisplay: false
            });
            running = s.el;
            active = s.el;
			if(index == catalog.length - 1)
				index = -1;
			index ++;
        },
        interval: 10000
    }
    
    var runner = new Ext.util.TaskRunner();
    runner.start(task);    
	
	buttonForward.on('click', function(e,t){
		isPaused = false;
		runner.stop(task);
		runner.start(task);
	});
		
	buttonBackward.on('click', function(e,t){
		isPaused = false;
		runner.stop(task);
		index -= 2;
		if(index == -1)
			index = catalog.length - 1;
		else if(index == -2)
			index = catalog.length - 2;
            
		runner.start(task);
	});
			
    box.on('mouseover', function(e, t){	
		isPaused = true;				
    	task.interval = 1000000;
        if(t = e.getTarget('img.slide-image')){
            Ext.fly(t).up('dt').addClass('slide-over');
        }
    });
    box.on('mouseout', function(e, t){    
        //runner.start(task);
        task.interval = 10000;	
        if(t = e.getTarget('img.slide-image')){
            Ext.fly(t).up('dt').removeClass('slide-over');
        }
    });
    
    
});

function Index(index)
{
	return index;
}