$(document).ready(function($){



	if($.browser.msie && $.browser.version == '6.0') {
		$.fn.suy({
			delay: 0,
			dialogOptions: {
				width: 660,
				height: 500
			}
		});
	}
	
	$(document).accessibleFormFields();	
	
	$('img#background').backscale({
		speed: 1500
	});
	
	$('a#footer-link-fullscreen').click(function() {
		alert('Druk op F11 op uw toetsenbord om de fullscreen-modus van uw browser te activeren.');
		
		return false;
	});
	
	$('.scrollable-area').jScrollPane();

	
	//browseMessagesFunctionality();
        $(".tweets").tweet({
		username: "planbhaarlem",
		avatar_size: 0,
		count: 5,
		loading_text: "Tweets laden...",
		refresh_interval: 30
	});

        fncSetupScroll($('#twitter'));
        fncSetupScroll($('#linkedin'));

        $('.searchBtn').click(function() {
            $('#frmSearch').submit();
        });

        $.get('/linkedin.php', function(data) {
           $('#linkedin .scroll ul').html(data);
        });
        
        portfolio();
        dimensionsFixes();
	writeTime();
	setInterval("writeTime()", 60000);

        applyCorners();

});

$(window).load(dimensionsFixes);
$(window).resize(dimensionsFixes);

var fncSetupScroll = function(el) {
    var scroll = el.find('div.scroll');
    var height = scroll.height();
    var speed = 5;

    if($.browser.msie) {
        scroll.before('<img src="/images/arrow_up.png" style="position: absolute; margin-left: -25px; margin-top: 15px; cursor: pointer;" class="scroll_up" />');
        scroll.before('<img src="/images/arrow_down.png" style="position: absolute; margin-left: -25px; margin-top: ' + (height- 28) + 'px; cursor: pointer;" class="scroll_down" />');
    }
    else {
        scroll.before('<img src="/images/arrow_up.png" style="position: absolute; margin-left: -25px; margin-top: 25px; cursor: pointer;" class="scroll_up" />');
        scroll.before('<img src="/images/arrow_down.png" style="position: absolute; margin-left: -25px; margin-top: ' + (height- 18) + 'px; cursor: pointer;" class="scroll_down" />');
    }

    el.find('img.scroll_down').mouseover(function() {
        var ul = el.find('ul');
        var ulheight = ul.height();
        var pos = ul.css('marginTop');
        pos = parseInt(pos.substr(0, pos.length - 2));
        

        var time = ( ulheight - height + pos) * speed;

        

        ul.animate({marginTop: (height - ulheight) + 'px'}, time);

    }).mouseout(function() {
        var ul = el.find('ul');
        ul.stop();
    });
    el.find('img.scroll_up').mouseover(function() {
        var ul = el.find('ul');
        var ulheight = ul.height();
        var pos = ul.css('marginTop');
        pos = parseInt(pos.substr(0, pos.length - 2));


        var time = ( ulheight - height - pos) * speed / 2;



        ul.animate({marginTop: '0px'}, time);

    }).mouseout(function() {
        var ul = el.find('ul');
        ul.stop();
    });


}

function writeTime() {
	var months = ['januari','februari','maart','april','mei','juni','juli','augustus','september','oktober','november','december'];
	var date = new Date();
	var currentDate = {
		hours: date.getHours(),
		minutes: date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes(),
		day: date.getDate(),
		month: months[date.getMonth()],
		year: date.getFullYear()
	};
	
	$('div#header small').html(
		'tijd ' + currentDate.hours + ':' + currentDate.minutes + ' ' +
		'datum ' + currentDate.day + ' ' + currentDate.month + ' ' + currentDate.year
	);	
	
};

function dimensionsFixes() {
	
	if($(document).height() <= 720) {
		$('div#wrapper').height($(document).height());
	} else {
		$('div#wrapper').css('height','100%');
	}

	if($(window).width() <= $('div#middle').outerWidth()) {
		$('div#header,div#footer').width($('div#middle').outerWidth());
	} else {
		$('div#header,div#footer').css('width','100%');
	}

	if($('div#portfolio').length == 0){ // Only on other pages then portfolio
//		if($(window).width() <= 1400) {
			$('div#main').css({
				marginLeft: 15,
				marginRight: 15
			});
			$('div#middle').width(1205);
//		} else if($(window).width() <= 1600) {
//			$('div#main').css({
//				marginLeft: 30,
//				marginRight: 30
//			});
//			$('div#middle').width(1230);
//		} else if($(window).width() <= 1800) {
//			$('div#main').css({
//				marginLeft: 45,
//				marginRight: 45
//			});
//			$('div#middle').width(1260);
//		}  else if($(window).width() <= 2000) {
//			$('div#main').css({
//				marginLeft: 60,
//				marginRight: 60
//			});
//			$('div#middle').width(1290);
//		}
	}
	
	if($.browser.msie && parseInt($.browser.version) < 9){
		$('ul#navigation li').each(function() {
			//var w = $(this).widt
			$('ul', this).css('width',$('ul', this).width() + 'px');
			$('ul', this).css('left', $(this).position().left+'px');
		});
	}
};

if($.browser.msie && parseInt($.browser.version) < 9){
document.write('<script src="/static/js/shadedborder.js" type="text/javascript"></script>');
	

}
function applyCorners() {
	var gridCornerRadius = '35px';
	
	

	if($.browser.msie && parseInt($.browser.version) < 9){
//		$('div.visuals > div.inner').corner('tr 100px cc:#fff');
                gridCornerRadius += ' cc:#fff';
                $('li#grid-block-1 a').corner('tr bl br ' + gridCornerRadius);
                $('li#grid-block-2 a').corner('tl bl br ' + gridCornerRadius);
                $('li#grid-block-3 a').corner('tr bl br ' + gridCornerRadius);
                $('li#grid-block-4 a').corner('tl tr bl ' + gridCornerRadius);
                $('li#grid-block-5 a').corner('tl tr bl ' + gridCornerRadius);
                $('li#grid-block-6 a').corner('tl tr br ' + gridCornerRadius);
                $('li#grid-block-7 a').corner('tl bl br ' + gridCornerRadius);
                $('li#grid-block-8 a').corner('tl bl br ' + gridCornerRadius);
                $('li#grid-block-9 a').corner('tr bl br ' + gridCornerRadius);

//                var url = $('#bordered-div').css('backgroundImage');
//
                var border = RUZEE.ShadedBorder.create({ corner:100, edges: 'tr' });
//                $('#bordered-div .sb-inner').css('background-image', url);
                border.render('bordered-div');
//                $('#bordered-div .sb-inner').css('background-image', url);
var i =0;
var x = -269;
                $('.sb-inner').each(function() {
                    if($(this).css('z-index') == 2) {
                        if(!$(this).css('filter').length) {
                            var y = $(this).height() - 100;
                            x--

                            $(this).css('background-position', x + 'px ' + y + 'px' );
                        }
                        else {
//                            $(this).css('filter', 'alpha(opacity=0)');
                        }
                    }
                    else if($(this).width() == 100) {
                        $(this).css('background-position', '-270px -100px' );
                    }
                    else if($(this).height() == 100) {

                        $(this).css('background-position', '0px 0px' );
                    }
                    else {
                        $(this).css('background-position', '100px -100px' );
                    }

                });


	} else {
		$('div.visuals > div.inner').corner('tr 100px');
                $('li#grid-block-1 a').corner('tr bl br ' + gridCornerRadius);
                $('li#grid-block-2 a').corner('tl bl br ' + gridCornerRadius);
                $('li#grid-block-3 a').corner('tr bl br ' + gridCornerRadius);
                $('li#grid-block-4 a').corner('tl tr bl ' + gridCornerRadius);
                $('li#grid-block-5 a').corner('tl tr bl ' + gridCornerRadius);
                $('li#grid-block-6 a').corner('tl tr br ' + gridCornerRadius);
                $('li#grid-block-7 a').corner('tl bl br ' + gridCornerRadius);
                $('li#grid-block-8 a').corner('tl bl br ' + gridCornerRadius);
                $('li#grid-block-9 a').corner('tr bl br ' + gridCornerRadius);
                $('#bordered-div').corner('tr 100px');
	}
	
};

function browseMessagesFunctionality() {
	var itemLength = $('div#twitter ul li').length;
	var speed = 500;
	var curr = 0;
	
	$('div.block ul').after('<a href="#" id="prev" title="Vorige tweet">prev</a>');
	$('div.block ul').after('<a href="#" id="next" title="Next tweet">next</a>');
	$('div.block ul').css({overflow: 'hidden'});

			
	$('a#prev,a#next').live('click', function() {
		var to = $(this).attr('id') == 'next' ? curr++ : curr--;
		
		$('div#twitter ul').animate({scrollTop:  100}, speed);
	});

};


function portfolio() {
	var columnsWidth = 0;
	var offset = -475; // Offset used for centering
	var prefix = 'col-'; // Use prefix to prevent automatic anchor-jumping

	$('div#portfolio h2').prepend('&gt;&gt; ');

	$('div#portfolio div.scroll').css('overflow','hidden');

	$('div#portfolio div.column').each(function(i) {
		//var blocks = $('ul li', this).length;
		columnsWidth += $(this).outerWidth(true);
	});

	$('div#portfolio div.columns').width(columnsWidth); // Dynamic width

	/*
	$('div#portfolio div.hotspot-left').mousemove(function() {
		$('div.scroll').trigger('prev');
	});

	$('div#portfolio div.hotspot-right').mousemove(function() {
		$('div.scroll').trigger('next');
	});
	*/

	$(document).keydown(function(e) {
		switch(e.keyCode) {
			case 37:
				$('div.scroll').trigger('prev');
				break;
			case 39:
				$('div.scroll').trigger('next');
				break;
		}
	});

	$('div#portfolio').serialScroll({
		target: 'div.scroll',
		items: 'div.column',
		prev:'a.top-previous,a.bottom-previous',
		next:'a.top-next,a.bottom-next',
		navigation: 'div.anchors li a',
		stop: true,
		duration: 800,
		constant: false,
		cycle: false,
		jump: true,
		offset: offset,
		onBefore: function(e,elem) {
			var anchor = elem.id.replace(prefix,'');

			window.location.hash = anchor; // Set hash
			$('div.anchors li').removeClass('active');
			$('div.anchors li a[href=#'+anchor+']').parent().addClass('active'); // Make link active
		}
	});

	if(window.location.hash) { // Jump to hash-element
		var hash = window.location.hash.replace('#',''); // Get hash
		var $elem = $('div#' + prefix + hash); // Set element

		if($elem.length == 1){
			$('div.scroll').scrollLeft($elem.position().left - Math.abs(offset));
			$('div.scroll').trigger('notify', $elem);
			$('div.anchors li a[href=#'+hash+']').parent().addClass('active');
		}
	} else { // Select first if hash isn't provided
		$('div.anchors li:first-child').addClass('active');
	}

	var popupWidth = 460;
	var popupHeight = 575;

	if($.browser.msie && parseInt($.browser.version) < 8) { // Msie 7 popup width/height fix
		popupWidth = 480;
		popupHeight = 655;
	}

        function calcWidth() {
            var width = $('div#popup div.image-container img').width();
            if(width < 360) return popupWidth + 360;
            else return popupWidth + width;
        }

	$('a[rel=project]').colorbox({
		transition: 'elastic',
		iframe: false,
		rel: 'nofollow',
		width: popupWidth + 315,
		height: popupHeight,
		opacity: 0.5,
                scrolling: false,
		title: false,
                onComplete: function() {

                    $('div#popup div.image-browser ul li a').each(function() {
                        if($(this).attr('href') == '/images/spacer.gif') {
                            $(this).parent().remove();
                        }
                    })

                    $('div#popup div.image-browser ul li a').click(function() {
                            var image = new Image();
                            var filepath = $(this).attr('href');
                            var pair = $(this).attr('title').split('-',2);


                            $('div#popup div.image-container img').hide();
                            $('div.image-container p').hide();

                            $(image).load(function () {

                                    $('div#popup div.image-container img').attr('src', filepath);
                                    var width = $('div#popup div.image-container img').width();
//                                    $('div#popup div.image-container').animate({width: width}, 0);
                                    $('div#popup div.image-container').css({width: width});
//                                    $('div#popup').animate({ width : 520 + width} , 0);
//                                    $('div#popup-main').animate({ width : 420 + width}, 0);
                                    $('div#popup-wrapper').animate({ width : 385 + width}, 0);


                                    $.colorbox.resize({ width: calcWidth(),
                                                        height: popupHeight
                                            });

//                                    $('div#cboxLoadedContent').css('overflow', 'hidden');
                                    $('div#cboxLoadedContent').css('width', 'auto');

                                    $('div.image-container p strong').text(pair[0]);
                                    $('div.image-container p span').text(pair[1]);
                                    $('div#popup div.image-container img').fadeIn(1000);
                                    $('div.image-container p').show();
                            }).error(function() {
                                    $('div.image-container p strong').html('Oeps');
                                    $('div.image-container p span').html('De afbeelding die u opvroeg bestaat niet.');
                                    $('div.image-container p').show();
                            }).attr('src', filepath);

                            $('div#popup div.image-browser ul li').removeClass('selected');
                            $(this).parent().addClass('selected');

                            return false;
                    });

                    var width = $('div#popup div.image-container img').width();
                    $('div#popup div.image-container').css({width: width});
//                                    $('div#popup').animate({ width : 520 + width} , 0);
//                                    $('div#popup-main').animate({ width : 420 + width}, 0);
                                    $('div#popup-wrapper').animate({ width : 385 + width}, 0);


                                    $.colorbox.resize({ width: calcWidth(),
                                                        height: popupHeight
                                            });

                                    $('div#cboxLoadedContent').css('width', 'auto');
                    }
	});

	

};