$(document).ready(function(){
		$(".infodlg").live ( 'mouseenter', function(){ 
			$("#infotext").show(500);
			var top = $(this).offset().top;		
			var top_content = $("#infotext").offsetParent().offset().top;
			top = top-top_content;
			$("#infotext").css({top: top});		
		});
		$(".infodlg").live ( 'mouseleave', function(){ $("#infotext").hide(500);});
		
		$('#productDetails div#fixedDetails #visuals ul li span').bind("click", function(e){
			e.preventDefault();
			
			//Toggle the active stae of a thumbnail
			$('#productDetails div#fixedDetails #visuals ul li').removeClass("active");
			$(this).parent().addClass("active");

			//Alter the image
			var thumbSrc = $("img", this).get(0).src;
			var originalSrc = $("#productDetails div#fixedDetails #visuals #viewport a img").get(0).src;
			
			$("#productImg").attr("jqimg" , "images/temp/artikelen/thumbs/zoom/" + thumbSrc.substring(thumbSrc.lastIndexOf("/") + 1));
			$("#productDetails div#fixedDetails #visuals #viewport a img").get(0).src = originalSrc.substring(0, originalSrc.lastIndexOf("/") + 1) +thumbSrc.substring(thumbSrc.lastIndexOf("/") + 1);
			
			$("#productImg").parent('a.prettyPhoto').attr('rel' , $(this).prev('a.prettyPhoto').attr('id') );
			
			if($("img", this).hasClass('openPopup')){
				$("#viewport #mainImg").addClass('openPopup');					
			}else{
				$("#viewport #mainImg").removeClass('openPopup');									
			}
				
		});
        $(".js_brand_more").click(function () {
                if( $(".brandInformation").is(':visible') ) {
                         var currentDivHeight=$("#specs").height();
                }
                $("#specs").css({'height': (currentDivHeight)+'px'});
                $(".brandInformation").slideToggle("fast");			
        });	
        $(".jqzoom2").jqueryzoom({
				zoomWidth: 320,
				zoomHeight: 540,
				title: false,
				showEffect:'fadein',
				hideEffect:'fadeout',
				fadeoutSpeed: '50',
				fadeinSpeed: '50'
		});
		$('#mainImg a').click(function(){
			var rel = $(this).attr('rel');
			$('#'+rel).click();
		});
        $("a[rel^='prettyPhoto']").prettyPhoto({
                animation_speed: 'fast', /* fast/slow/normal */
                slideshow: false, /* false OR interval time in ms */
                autoplay_slideshow: false, /* true/false */
                opacity: 0.80, /* Value between 0 and 1 */
                show_title: false, /* true/false */
                allow_resize: true, /* Resize the photos bigger than viewport. true/false */
                default_width: 500,
                default_height: 344,
                counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */
                theme: 'pp_default', /* light_rounded / dark_rounded / light_square / dark_square / facebook */
                horizontal_padding: 200, /* The padding on each side of the picture */
                hideflash: false, /* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto */
                wmode: 'opaque', /* Set the flash wmode attribute */
                autoplay: true, /* Automatically start videos: True/False */
                modal: false, /* If set to true, only the close button will close the window */
                deeplinking: true, /* Allow prettyPhoto to update the url to enable deeplinking. */
                overlay_gallery: true, /* If set to true, a gallery will overlay the fullscreen image on mouse over */
                keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */
                changepicturecallback: function(){}, /* Called everytime an item is shown/changed */
                callback: function(){}, /* Called when prettyPhoto is closed */
                ie6_fallback: true,
                markup: '<div class="pp_pic_holder"> \
                                        <div class="ppt">&nbsp;<\/div> \
                                        <div class="pp_top"> \
                                                <div class="pp_left"><\/div> \
                                                <div class="pp_middle"><\/div> \
                                                <div class="pp_right"><\/div> \
                                        <\/div> \
                                        <div class="pp_content_container"> \
                                                <div class="pp_left"> \
                                                <div class="pp_right"> \
                                                        <div class="pp_content"> \
                                                                <div class="pp_loaderIcon"><\/div> \
                                                                <div class="pp_fade"> \
                                                                        <a class="pp_close" style="z-index:5000;right: 18px;" href="#">Close<\/a> \
                                                                        <div class="pp_hoverContainer"> \
                                                                                <a class="pp_next" href="#">next<\/a> \
                                                                                <a class="pp_previous" href="#">previous<\/a> \
                                                                        <\/div> \
                                                                        <div id="pp_full_res"><\/div> \
                                                                        <div class="pp_details"> \
                                                                                <div class="pp_nav"> \
                                                                                        <a href="#" class="pp_arrow_previous">Previous<\/a> \
                                                                                        <p class="currentTextHolder">0/0<\/p> \
                                                                                        <a href="#" class="pp_arrow_next">Next<\/a> \
                                                                                <\/div> \
                                                                                \ {pp_social} \
                                                                        <a href="#" style="right:0;top:6px;" class="pp_expand" title="Expand the image">Expand<\/a>	 \
                                                                        <\/div> \
                                                                <\/div> \
                                                        <\/div> \
                                                <\/div> \
                                                <\/div> \
                                        <\/div> \
                                        <div class="pp_bottom"> \
                                                <div class="pp_left"><\/div> \
                                                <div class="pp_middle"><\/div> \
                                                <div class="pp_right"><\/div> \
                                        <\/div> \
                                <\/div> \
                                <div class="pp_overlay"><\/div>',
                gallery_markup: '',
                social_tools: false

        });

});