function pageLoad() {
    var hetdomein = $('.jsPath').val();
    //alert(hetdomein);
    maakflash(hetdomein);

    $('.popup').click(function() {
        var titel = $(this).attr('title');
        var url = $(this).attr('href');
        $.modal.close();
        maakmodal(url, titel, 1);
        return false;
    });

    maakclouds();
    maakclouds_image();

}

$('document').ready(function start() {
    productstyle_chooser();
    aktiecarousel(6);

    //in winkelwagen? break uit frame
    if ($('#ctl00_ctl00_ctl00_center_left_left_upShoppingcart').length > 0) {
        if (top.location != self.location) {
            top.location = self.location.href
        }
    }

    if ($('#bymeCarousel').length > 0) {
        /**
        * We use the initCallback callback
        * to assign functionality to the controls
        */
        var carousel_1;
        function carousel_1_initCallback(carousel) {
            carousel.selected = 1
            jQuery('.carousel_1_control a').bind('click', function() {
                //alert(this.className)
                carousel.startAuto(0);
                carousel.scroll(this.className);
                return false;

            });

            jQuery('#box_carousel_next').bind('click', function() {
                carousel.next();
                carousel.startAuto(0);

                return false;
            });

            jQuery('#box_carousel_prev').bind('click', function() {
                carousel.prev();
                carousel.startAuto(0);

                return false;
            });

            // Pause autoscrolling if the user moves with the cursor over the clip.
            carousel.clip.hover(function() {
                carousel.stopAuto();
            }, function() {
                carousel.startAuto();
            });

        };

        function carousel_1_beforeAnimation(carousel, element, i, status) {
            //$('#carousel_1_slide_' + carousel.selected).attr("src", "img/slide_off.gif");
            var idx = carousel.index(i, carousel.options.size);
            carousel.add(i, carousel.get(idx).html())
        }

        function carousel_1_afterAnimation(carousel, element, index, status) {
            var idx = carousel.index(index, carousel.options.size);
            carousel.selected = idx
            //$('#carousel_1_slide_' + idx).attr("src", "img/slide_on.gif");
        }

        function carousel_1_itemVisibleOutCallback(carousel, item, i, state, evt) {
            if (i > carousel.options.size || i < 0) {
                carousel.remove(i);
            }
            carousel.startAuto();
        };


        $('#bymeCarousel').jcarousel({
            scroll: 1,
            wrap: 'circular',
            initCallback: carousel_1_initCallback,
            itemVisibleInCallback: {
                onBeforeAnimation: carousel_1_beforeAnimation,
                onAfterAnimation: carousel_1_afterAnimation
            },
            itemVisibleOutCallback: carousel_1_itemVisibleOutCallback
        });
    }



    if ($('.largeimage').length > 0) {
        $('.largeimage').cluetip({ splitTitle: '|',
            showTitle: false,
            width: 410,      // The width of the clueTip
            height: 411,   // The height of the clueTip
            positionBy: 'fixed',   // Sets the type of positioning: 'auto', 'mouse','bottomTop', 'fixed'
            tracking: false,    // if true, clueTip will track mouse movement (experimental)
            dropShadow: false,     // set to false if you don't want the drop-shadow effect on the clueTip
            dropShadowSteps: 6,        // adjusts the size of the drop shadow
            cursor: 'pointer',
            waitImage: false,     // whether to show a "loading" img, which is set in jquery.cluetip.css
            cluetipClass: 'bymeimage', // class added to outermost clueTip div in the form of 'cluetip-' + clueTipClass.
            topOffset: -390,       // Number of px to offset clueTip from top of invoking element
            leftOffset: -80,       // Number of px to offset clueTip from left of invoking element
            cluezIndex: 9997,       // Sets the z-index style property of the clueTip
            sticky: false    // keep visible until manually closed
        });
    }



    /* MODALSSSSSS */
    $('.del').live('click', function(e) {
        var gadoor = $(this).attr('href');
        var wat_verwijderen = $(this).attr('rel');
        //is het een delete button in gridview; pak de rel in de grid-kader voor de juiste delete-text
        if (wat_verwijderen.length == 0) { wat_verwijderen = $(this).parents('.grid-kader').attr('title'); }
        wat_verwijderen = wat_verwijderen + ' ';

        e.preventDefault();
        // example of calling the confirm function
        // you must use a callback function to perform the "yes" action
        confirm(false, function() {
            //alert(gadoor);
            window.location.href = gadoor;
        }
        );
    });



    /* MODALSSSSSS in winkelwagen*/
    $('#cart .del-cart').live('click', function(e) {
        var gadoor = $(this).attr('href');
        var wat_verwijderen = $(this).parents('.order').find('.artikel a').html();
        e.preventDefault();
        // example of calling the confirm function
        // you must use a callback function to perform the "yes" action
        //alert(wat_verwijderen);
        confirm(wat_verwijderen, function() {
            //alert(gadoor);
            window.location.href = gadoor;
        }
        );
    });


    //zorg dta de carousel goed komt */
    //$('#bymeCarousel li:last').addClass('last');


    $('#faq .faq').click(function() {
        $(this).parents('.section').find('.answer').toggle();
        $(this).blur();
    });


    $('#thumbnails-product a').click(function() {
        $('#thumbnails-product a').removeClass('active');
        $(this).addClass('active');
        $(this).blur();
        var img = $(this).attr('href');
        $('.detail-product-pic img.mainpic').attr('src', img);
        return false;
    });

});



function confirm(message, callback) {
    $('#confirm').modal({
        close: false,
        position: [, ],
        overlayId: 'confirmModalOverlay',
        containerId: 'confirmModalContainer',
        onShow: function(dialog) {

            //alert(message)
            //alert(message);
            if (message != false) {
                dialog.data.find('.message').prepend('\'' + trim(message) + '\' ');
            }


            // if the user clicks "yes"
            dialog.data.find('.yes').click(function() {
                // call the callback
                if ($.isFunction(callback)) {
                    callback.apply();
                }
                // close the dialog
                $.modal.close();
            });
        }
    });
}
/* EINDE MODALS! */

function trim(value) {
    value = value.replace(/^\s+/, '');
    value = value.replace(/\s+$/, '');
    return value;
}

 function maakflash(url) {
    $('h1#page-title').each(function() {
        var detekst = trim($(this).text());
        //alert(detekst);
        $(this).flash(
			{
			    src: url + 'Flashtext/pagetitle.swf',
			    width: 520,
			    height: 40,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "FF0000" }
			}, { update: false }
		);
		});

		$('#header #slogan').each(function() {
		    var detekst = trim($(this).text());
		    $(this).flash(
			{
			    src: url + 'Flashtext/pagetitle.swf',
			    width: 520,
			    height: 40,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "FF0000" }
			}, { update: false }
		);
		});

		$('.kader h1.heading,.kader h1.myriad, #two-columns-profile-container .kader h1').each(function() {
		    var detekst = trim($(this).text());
		    //alert(detekst);
		    $(this).flash(
			{
			    src: url + 'Flashtext/kop.swf',
			    width: 520,
			    height: 25,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "FF0000" }
			}, { update: false }
		);
		});


		$('#vertel-het-door h3, .kader h3').each(function() {
		    var detekst = trim($(this).text());
		    $(this).flash(
			{
			    src: url + 'Flashtext/kader_title.swf',
			    width: 520,
			    height: 20,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "FFFFFF" }
			}, { update: false }
		);
		});


		$('.kader h4').each(function() {
		    var detekst = trim($(this).text());
		    $(this).flash(
			{
			    src: url + 'Flashtext/kader_title.swf',
			    width: 520,
			    height: 20,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "000000" }
			}, { update: false }
		);
		});

/* pakketten 
		$('.pakket .pakket-content h1').each(function() {
		    var detekst = trim($(this).text());
		    $(this).flash(
			{
			    src: url + 'Flashtext/kader_title.swf',
			    width: 520,
			    height: 20,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "000000" }
			}
		);
		});

		$('.pakket .action h1').each(function() {
		    var detekst = trim($(this).text());
		    $(this).flash(
			{
			    src: url + 'Flashtext/kader_title.swf',
			    width: 520,
			    height: 20,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "FFFFFF" }
			}
		);
		});
*/


		$('#two-columns-container .kader h1').each(function() {
		    var detekst = trim($(this).text());
		    $(this).flash(
			{
			    src: url + 'Flashtext/kader_title.swf',
			    width: 520,
			    height: 20,
			    wmode: 'transparent',
			    menu: false,
			    flashvars: { detekst: detekst, kleur: "FFFFFF" }
			}, { update: false }
		);
		});
		
		$('h1#page-title,#header h1,.kader h1.heading,.kader h1.myriad,#two-columns-profile-container .kader h1,#vertel-het-door h3,.kader h3,.kader h4,#two-columns-container .kader h1,#header #slogan').css({ 'visibility': 'visible' });
}
//einde maakflash functies


//tel aantal iframes

function maakmodal(url, titel, sluit) {

        var de_text = '<div class="top">&nbsp;</div><h1 class="popup-title">' + titel + '</h1><a href="javascript:void(0);" onclick="$.modal.close();" class="close">close</a><p class="message"></p>';
        
        if (sluit == 1) { var sluiten = true; } else { var sluiten = false; }
        $(de_text).modal({
            position: [, ],
            close: sluiten
        });       
        $('p.message').append('<iframe id="commentiframe" frameborder="0" border="0" cellspacing="0" marginwidth="0" marginheight="0" />');
        $('#commentiframe').attr('style', 'border-width:0;border:none;background:transparent none;');
        $('#commentiframe').attr('allowTransparency', 'True');
        $('#commentiframe').attr('frameborder', '0');
        $('#commentiframe').attr('src', url);
        resize_iframe();

        $("#commentiframe").load(function() {
            $('iframe').after('<div class="bottom">&nbsp;</div>');
            setTimeout("$(window).trigger('resize.simplemodal'); $('#simplemodal-container').css({'visibility':'visible'});", 10);
        });
   }



 
   
   
   function sluit() { $.modal.close(); };

   function zetgoed() {
       resize_iframe();
       $('#simplemodal-container').css({ 'height': '400px' });  
   }


   function maakclouds() {
       $('.cloud').hover(function() {
           var linktitel = $(this).attr('alt');
           if (linktitel != "") {
               var pos = $(this).offset();
               $('#container').after("<div class='textbox'><div class='top'>&nbsp;</div><div class='left'>&nbsp;</div><div class='right'>&nbsp;</div><div class='topleft'>&nbsp;</div><div class='topright'>&nbsp;</div><p>" + linktitel.toString() + "</p><div class='bottomright'>&nbsp;</div><div class='bottom'>&nbsp;</div><div class='puntje'>&nbsp;</div></div>");
               $('.textbox').css('zIndex', '1000');
               hoogte = $('.textbox').height();
               $('.textbox .right').css('height', hoogte - 10 + 'px');
               $('.textbox .left').css('height', hoogte + 'px');
               $('.textbox').css('left', (pos.left + 10) + 'px');
               $('.textbox').css('top', ((pos.top - hoogte) - 10) + 'px');
               //$('.textbox').fadeIn('fast');
               $('.textbox').show();
           }
       }, function() {
           $('.textbox').hide();
           $('.textbox').remove();
       });
   }


   function maakclouds_image() {
       $('.cloud2').click(function() { return false });
       $('.cloud2').hover(function() {
           var linktitel = $(this).attr('alt');
           if (linktitel != "") {
               var pos = $(this).offset();
               $('#container').after("<div class='textbox'><div class='top'>&nbsp;</div><div class='left'>&nbsp;</div><div class='right'>&nbsp;</div><div class='topleft'>&nbsp;</div><div class='topright'>&nbsp;</div><p>" + linktitel.toString() + "</p><div class='bottomright'>&nbsp;</div><div class='bottom'>&nbsp;</div><div class='puntje'>&nbsp;</div></div>");
               $('.textbox').css('zIndex', '1000');
               hoogte = $('.textbox').height();
               $('.textbox .right').css('height', hoogte - 10 + 'px');
               $('.textbox .left').css('height', hoogte + 'px');
               $('.textbox').css('left', (pos.left + 85) + 'px');
               $('.textbox').css('top', ((pos.top - hoogte) - 80) + 'px');
               $('.textbox').addClass('foto');


               
               //$('.textbox').fadeIn('fast');
               $('.textbox').show();
           }
       }, function() {
           $('.textbox').hide();
           $('.textbox').remove();
       });
   }





   //aktiecarousel!
   function aktiecarousel(start) {
       
       if ($('#bymeCarousel-action').length > 0) {
        //alert('bla');
           /**
           * We use the initCallback callback
           * to assign functionality to the controls
           */
           var carousel_1;
           function carousel_1_initCallback(carousel) {
               carousel.selected = 1


               jQuery('#box_carousel_next').bind('click', function() {
                   carousel.next();
                   carousel.startAuto(0);
                   return false;
               });


               jQuery('#box_carousel_prev').bind('click', function() {
                   carousel.prev();
                   carousel.startAuto(0);
                   return false;
               });


               jQuery('.jcarousel-prev').bind('click', function() {
                   disablePrev();
                   setTimeout("pakprev()", 300); 
                   return false;
               });

               jQuery('.jcarousel-next').bind('click', function() {
                   disableNext();
                   setTimeout("paknext()", 300);                 
                   return false;
               });

              

               // Pause autoscrolling if the user moves with the cursor over the clip.
               carousel.clip.hover(function() {
                   carousel.stopAuto();
               }, function() {
                   carousel.startAuto();
               });


               carousel.clip.click(function() {
                   //var welke = $(this).find('a').attr(rel);
                   // welke = 5;
                   // alert($(this).idx);
                   //  carousel.scroll(jQuery.jcarousel.intval(jQuery.jcarousel.intval(welke)));
                   return false;
               });

           };

           function carousel_1_beforeAnimation(carousel, element, i, status) {
               //$('#carousel_1_slide_' + carousel.selected).attr("src", "img/slide_off.gif");
               var idx = carousel.index(i, carousel.options.size);
               carousel.add(i, carousel.get(idx).html());
               carousel.add((i + 1), carousel.get(idx + 1).html());
               //carousel.add((i + 2), carousel.get(idx + 2).html());
           }

           function carousel_1_afterAnimation(carousel, element, index, status) {
               var idx = carousel.index(index, carousel.options.size);
               carousel.selected = idx
               now_active = $('#bymeCarousel-action li a.active').attr('rel');
               laatzien(now_active)           
           }

           function carousel_1_itemVisibleOutCallback(carousel, item, i, state, evt) {
               if (i > carousel.options.size || i < 0) {
                   carousel.remove(i +1);
               }
               carousel.startAuto();
           };



           $('#bymeCarousel-action').jcarousel({
              // buttonNextHTML: '<div>Bla</div>',
             //  buttonPrevHTML: '<div>Bla</div>',
               scroll: 1,
               start: start,
               wrap: 'circular',
               initCallback: carousel_1_initCallback,
               itemVisibleInCallback: {
                   onBeforeAnimation: carousel_1_beforeAnimation,
                   onAfterAnimation: carousel_1_afterAnimation
               },
               itemVisibleOutCallback: carousel_1_itemVisibleOutCallback
           });
           
       }
       //alert('opnieuw geinitialiseerd');




   }


   function disablePrev() {
    $('#disable-prev').show()
   }

   function disableNext() {
    $('#disable-next').show()
   }
      
   function laatzien(now_active) {
       declass = '.' + now_active;
       $('[rel="extra-info-container"]').each(function() {  $(this).hide();    });
       $(declass).show();
       $('#disable-next').hide();
       $('#disable-prev').hide()
   }
   
   function paknext() {
                      $('#bymeCarousel-action li a.active').addClass('active-old').parents('li').next('li').find('a').addClass('active');
                   $('#bymeCarousel-action li a.active.active-old').removeClass('active active-old');
               }

               function pakprev() {
                   $('#bymeCarousel-action li a.active').addClass('active-old').parents('li').prev('li').find('a').addClass('active');
                   $('#bymeCarousel-action li a.active.active-old').removeClass('active active-old');
               }




   jQuery.fn.center = function() {
       this.css("position", "absolute");
       this.css("top", ($(window).height() - this.height()) / 2 + $(window).scrollTop() + "px");
       this.css("left", ($(window).width() - this.width()) / 2 + $(window).scrollLeft() + "px");
       return this;
   }

   function youtubepopup() {
       $('body').append('<div id="youtube-popup-overlay"></div>');
       $('body').append('<div id="youtube-popup"><h2>ByMe instructiefilm</h2><a href="javascript:youtubepopup_close()" class="close">X</a><div id="youtube-popup-content"></div></div>');
       $('#youtube-popup-content').append('<object width="640" height="385"><param name="movie" value="http://www.youtube.com/v/tnp6HJAH00E&hl=nl_NL&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/tnp6HJAH00E&hl=nl_NL&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>');
       $('#youtube-popup').center();
       $('#youtube-popup').show();
       
   }
   function youtubepopup_close() {
       $('#youtube-popup-overlay').remove();
       $('#youtube-popup').remove();
   }



   function imagepopup(imageurl,title,url) {
       $('body').append('<div id="imagepopup-overlay"></div>');
       $('body').append('<div id="imagepopup"><div class="top">&nbsp;</div><h2>'+ title +'</h2><a href="javascript:imagepopup_close()" class="close">X</a><div id="imagepopup-content"><table width="100%"><tr><td align="center" valign="middle"><img src="" id="productimage-zoom"/></td></tr></table></div><a href="#" class="btn-ontwerpen">Ontwerpen</a><div class="bottom">&nbsp;</div></div>');
       $('#productimage-zoom').css("visibility","hidden");
       $('#productimage-zoom').attr('src',imageurl);
       
        $('#productimage-zoom').load(function() {             
           $('#productimage-zoom').css("visibility","visible");
           $('#imagepopup').center();
           $('#imagepopup').show();
        });
       init_closeonoverlay();
       
       $('.btn-ontwerpen').bind('click',function() {
        pageTracker._trackPageview('/product maken/naar wizard');
        //doGoal(this); 
        //return false;
       });
       
       $('.btn-ontwerpen').attr('href', 'javascript:openFullScreen("'+url+'")');
       //$('.btn-ontwerpen').attr('target', '_blank');
   }
  function init_closeonoverlay() {
    $('#imagepopup-overlay').click(imagepopup_close);
  }
   function imagepopup_close() {
       $('#imagepopup-overlay').remove();
       $('#imagepopup').remove();
   }

   /* productstijlen zoeker detailpagina */



   function productstyle_chooser() {
       imagepath = "grfx/TEMPTHUMB/";
       titel = $('#productstyle-chooser #products ul li .active').attr('rel');
       image = $('#productstyle-chooser #products ul li .active').html();
       $('#productstyle-chooser #current-product-name').html(titel)
       $('#productstyle-chooser #current-product-image').attr('src', imagepath + image);
       $('#productstyle-chooser #current-product-image').show();

       $('#container #product-detail #productstyle-chooser .categories a').click(function() {
           $(this).parents('.categories').find('a').removeClass('active');
           $(this).addClass('active');
       });
       //plaatje
       //alert(image);
       //naam
       //alert(titel);      
       return false;       
   }
   function imagechooserNext() {
       current_el = $('#productstyle-chooser #products ul li .active');
       next_el = $(current_el).removeClass('active').parents('li').next('li').find('div');
       if ($(next_el).length > 0) { $(next_el).addClass('active'); } else {
           $(current_el).parents('ul').find('li:first').find('div').addClass('active');  }
           $(this).blur();    
       productstyle_chooser();
   }
   function imagechooserPrev() {
       current_el = $('#productstyle-chooser #products ul li .active');
       prev_el = $(current_el).removeClass('active').parents('li').prev('li').find('div');
       if ($(prev_el).length > 0) { $(prev_el).addClass('active'); } else {
           $(current_el).parents('ul').find('li:last').find('div').addClass('active');
       }
       $(this).blur();    
       productstyle_chooser();
   }
   function imagechooseCat(cat) {
       $('#productstyle-chooser #products ul li div').removeClass('active');
       $('#productstyle-chooser #products ul#' + cat).find('li:first').find('div').addClass('active');
       $(this).blur();    
       productstyle_chooser();
   }