var slideInterval = 10000;
    var $flashContainer = $("#prostores-flash");
    
    //accomodate poor ie7 z-index implementation
    if($("body").hasClass("ie7")) {
        //move the flash target inside the slide
        $(".l-col", "#why-prostores").html($flashContainer);
    }
    
    var root = $(".navi").
    tabs(".items > div", {
            effect: 'fade',	
            fadeOutSpeed: "slow", 
            rotate: "true", 
            initialIndex: 0
            })
    .slideshow({ 
        interval: slideInterval
        });
    
    

    var pto, hfto, mainLoop;
    var tabApi = root.data("tabs");
    var $c,n,$i;
    i = 0;
    var tabs = tabApi.getPanes();

    

    var loopF = function() {
        $c = tabApi.getCurrentPane();
        i = ((tabApi.getIndex() + 1) > tabs.length - 1) ? 0 : tabApi.getIndex() + 1; 
		$n = $(tabs[i]);
		
        if($c.hasClass('show-flash')) {
            //old current is flash div so hide it
            if($flashContainer.hasClass("visible")) {
                $flashContainer.removeClass("visible");
            }
        } 
		
		if($n.hasClass('show-flash')) {
            //old current is flash div so hide it
            if(!$flashContainer.hasClass("visible")) {
                $flashContainer.addClass("visible");
            }
		}
        
        
        tabApi.next();
    }
    
    var loopControl = function(cmd) {
        if(cmd == 'stop') {
            //console.log('stopped');
            clearInterval(mainLoop);
        } else if(cmd = 'start') {
            //console.log('started');
            clearInterval(mainLoop);
            //mainLoop = setInterval(loopF, slideInterval);
        }
    }
    
    
    loopControl('start');

    
	var $toggle = $("#toggle");
    $toggle.bind("click", function(){				 
		if ($toggle.hasClass("pause")){
			loopControl('stop');
			$toggle.removeClass("pause")
            .addClass("play");
		}else{
			loopControl('start');
			$toggle.removeClass("play")
            .addClass("pause");			
		}

	});
    
    var stopOnFlashSlide = function(e) {
        $toggle.removeClass("pause")
        .addClass("play");
        //stop the show
        loopControl('stop');
        playing = false;
        
        //clear the timeouts
        clearTimeout(pto);

        //start the new timeout
        /*
        pto = setTimeout(function(){ 
                $flashContainer.removeClass("visible");
                $toggle.removeClass("play")
                .addClass("pause");
                tabApi.next();
                loopControl('start');
                playing = true;
            }
            , slideInterval);
        */
    }
    


    //load the flash object
    var flashvars = {};
    var params = {
            quality: 'high',
            bgcolor: '#fff',
            play: true,
            loop: true,
            wmode: 'transparent',
            scale: 'showall',
            menu: true,
            devicefont: false,
            salign: '',
            allowScriptAccess: 'sameDomain'
        };
    var attributes = {
	onclick: "stopOnFlashSlide();"
    };

    var cb = function(e){
                if(!e.success) {
                    $("#no-flash").css({visibility:"visible"});
                }
        }
    swfobject.embedSWF("flash/ProStoresCF.swf", "prostores-flash-target", "501", "302", "9.0.0", "flash/expressInstall.swf", flashvars, params, attributes,cb);

    
    $(".no-click-advance").unbind('click');
    
    var sf;
    var showFlash = function() {
		clearTimeout(sf);
        sf = setTimeout(function() {
			$flashContainer.addClass('visible');
		}, 500);
    }
    $(".flash-activate").click(showFlash);
    
    
    $("a", "li[id!=flash-tab]").click(function(){
        $flashContainer.removeClass('visible');
	});
    
    //$("#prostores-flash").click(stopOnFlashSlide);

  // Resize footer function for browser window smaller than 1108px wide
  function imageresize() {  
	
	  var contentwidth = $('.home').width();  
	  
	  if ((contentwidth) < '980'){  
	 	 $('#bot').css({'width': '980px'});  
	  } else {  
		 $('#bot').css('width',contentwidth);  
	  }  
  }  


   //trigger events to resize on load, resize, and scroll
  imageresize();//Triggers when document first loads      
	  $(window).bind("resize", function(){//Adjusts image when browser resized  
	  imageresize();  
	  });  
	  
	  $(window).bind("scroll", function(){//Adjusts image when browser resized  
	  imageresize();  
	  });  
	  
	  $(window).bind("load", function(){//Adjusts image when browser resized  
	  imageresize();  
	  });  



    //funky demo button
    var toggleDemo = function(e) {
        e.preventDefault();
        var $elm = $(this);
        if($elm.hasClass('demo-open')) {
            $(e.data.xtra).css({display:"none"});
            $elm.removeClass('demo-open');
            $("#toggle").removeClass("play");
            $("#toggle").addClass("pause");
            loopControl('start');
        } else {
            $("#toggle").removeClass("pause");
            $("#toggle").addClass("play");
            $(e.data.xtra).css({display:"block"});
            $elm.addClass('demo-open');
            loopControl('stop');
        }
        return false;
    }

    var xtra = document.getElementById("open");
    $(document.getElementById("view-demo")).bind("mouseenter", {xtra:xtra}, toggleDemo);
    $(document.getElementById("view-demo")).bind("mouseleave", {xtra:xtra}, toggleDemo);
    $(document.getElementById("view-demo")).bind("click", {}, function(){window.location="http://blog.prostores.com/prostores_learning_center/2010/08/prostores-v10-overview.html"});