
var isplaying = true;
function show_controls() {
	var T = '    ';
	var output = '';

	output += T+T+'<div id="carrousel_controls">'+"\n";
	output += T+T+T+'<div id="carrousel_start_stop">'+"\n";
    output += T+T+T+T+'<a id="btn_stop" class="btn_stopstart_carrousel" title="Druk op de spatiebalk om de animatie stoppen."><img src="templates/images/portal/carrousel-icon-stop.png" alt="Stop"></a>'+"\n";
    output += T+T+T+T+'<a id="btn_start" class="btn_stopstart_carrousel" title="Druk op de spatiebalk om de animatie starten."><img src="templates/images/portal/carrousel-icon-play.png" alt="Start"></a>'+"\n";
    output += T+T+T+'</div>'+"\n";
	output += T+T+T+'<div id="carrousel_pager"></div>'+"\n";
	output += T+T+T+'</div>'+"\n";
	document.write(output);
}

var stop = function() {
    isplaying = false;
    $('div#carrousel').cycle('pause');
    $('div#carrousel_controls a#btn_stop').hide();
    $('div#carrousel_controls a#btn_start').show();
}

var start = function() {
    isplaying = true;
    $('div#carrousel').cycle('resume');
    $('div#carrousel_controls a#btn_start').hide();
    $('div#carrousel_controls a#btn_stop').show();
}

$(window).load(function() {
    $('div#carrousel').cycle({
        fx:         'fade',
        speed:      'slow',
        timeout:    6000,
        pager:      '#carrousel_pager'
    });
    
    $('div#carrousel_controls a#btn_start').hide();
    
    $('div#carrousel_controls a#btn_stop').click(stop);  
    $('div#carrousel_controls a#btn_start').click(start);

    var focusflag = false;
    $("input, textarea").focus(function() {
        focusflag = true;
    })
    
    $("input, textarea").blur(function() {
        focusflag = false;
    })
    
    $(document).keypress(function(e) {
        if (e.which == 32 && focusflag === false) {
            e.preventDefault();
            (isplaying === true) ? stop() : start();
        }
    });
	
	
	$("#carrousel_pager a").css({ opacity: 0.6 });

	$('#carrousel_pager a').hover(function() {
        $(this).fadeTo('fast', 1);
        }, function() {
        $(this).fadeTo('fast', 0.6);
	});
    
    $('#portalnav li.item_9 a').hover(function() {
        $('#carrousel_controls').css('display', 'none');
        }, function() {
        $('#carrousel_controls').css('display', 'block');
	});
    
    
 	
});

