// this is the js needed for the new robvangeffen.nl website.




// img in mainfoto should get the following style when filename ends with "_"
// padding:1px; border-color:#aa8



if (typeof(console)!=='object') { console = { log: function (a) { return true; } } }
if (typeof(pagina)==='undefined') { var pagina=''; }

var rob = {
    'version'         : '0.1',
    'themecolor'      : '43',
    'themenumber'     : '1',
    'pagina'          : 0,   // page should be calculated...
    'activephoto'     : 0,
    'fotosPerPagina'  : 9,
	'cursorbolletjes' : [0,18,39,59,80,99,119,140],  // coordinaten van het bolletje
    'kleurnummers'    : [0,43,90,140,180,205,255,'grijs'], // kleur nummers 43 is de orginele kleur
    'kleurnamen'      : ['rood', 'bruin', 'groen1', 'groen2', 'blauw1', 'blauw2', 'paars', 'grijs'],
    'showingIntro'    : true
};

rob.ButtonOn = function (selStr) {
    // $(selStr).css({'background-color':'transparent', 'opacity':'0.2'});
};

rob.ButtonOff = function (selStr) {
    // $(selStr).css({'opacity':'0'});
};

rob.leftButtonOff   = function () { rob.ButtonOff("#previousbutton"); }
rob.leftButtonOn    = function () { rob.ButtonOn ("#previousbutton"); }
rob.rightButtonOff  = function () { rob.ButtonOff("#nextbutton"); }
rob.rightButtonOn   = function () { rob.ButtonOn ("#nextbutton"); }

rob.addGalleryPreviousNext = function () {
    // we are going to assume rob.activephoto is the foto to use for previous/next buttons
    var imageNumber = rob.activephoto;
    // console.log('addGalleryPrevNext thinks we are at ' + imageNumber);
    $("#mainfoto").css('position','relative');
    $("#previousbutton").remove();
    $("#nextbutton").remove();
    $('<div id="previousbutton"></div>').appendTo("#mainfoto");
    $('<div id="nextbutton"></div>').appendTo("#mainfoto");
    
    
    
    
    var imageWidth     = $("#mainfoto > img").width();
    var imageHeight    = $("#mainfoto > img").height();
    
    var widthClickArea = Math.round(imageWidth/3);
    
    rob.previousNumber = (imageNumber - 1 >= 0) ? imageNumber - 1 : fotos.photos.length - 1;
    rob.nextNumber     = ((imageNumber + 1) < fotos.photos.length) ? imageNumber + 1 : 0;
    // console.log('next: ' + rob.nextNumber);
    var resizeobj = {
        'width'    : widthClickArea + 'px',
        'height'   : imageHeight + 'px',
        'display'  : 'block',
        'position' : 'absolute',
        'top'      : '0'
    }
    $("#previousbutton").css(resizeobj).css({'left':'0','cursor':'w-resize'}).unbind().mouseover(rob.leftButtonOn).mouseout(rob.leftButtonOff).click(function () { 
        rob.setMainPhoto(rob.previousNumber); 
    });
    $("#nextbutton").css(resizeobj).css({'left':(imageWidth - widthClickArea)+'px','cursor':'e-resize'}).unbind().mouseover(rob.rightButtonOn).mouseout(rob.rightButtonOff).click( function () { 
        rob.setMainPhoto(rob.nextNumber);
    });
}

rob.setMainPhoto = function (photonumber) {
    rob.activephoto = Number(photonumber);

        $("#mainfoto, #mainfoto div").unbind();
        $("#mainfoto").css({'marginTop':'0'});
        $("#mainfoto img").attr({'src':''});
        $("#mainfoto img").attr({
            'src'   : fotos.photos[rob.activephoto].fullsize,
            'photo' : rob.activephoto   
        });
        
        $("#mainfoto img").load(function(){
	    rob.addGalleryPreviousNext(rob.activephoto);
/*
            setTimeout(function(){
		var height = $("#mainfoto img").height();
		if (height < 575) {
		    var newheight = Math.floor((630 - height) / 2);
		    $("#mainfoto").css({'marginTop':newheight+'px'}, 70);
		}
                // $("#mainfoto img").show(1500);
	    }, 0);
            
*/
       });

    if (rob.calculatePage() != rob.pagina) {
        // rob.pagina = rob.calculatePage();
	rob.buildGallery();
    }

}; // setMainPhoto

rob.buildThumbnailMatrix = function () {
    var img;
    var pagenumber = rob.pagina;
    // console.log ( 'buildThumbnailMatrix with page: ' + pagenumber);
    var startImage   = rob.fotosPerPagina * pagenumber;
    if (startImage >= fotos.photos.length) { startImage=0; }
    var laatsteImage = startImage + rob.fotosPerPagina -1;
    if (laatsteImage >= fotos.photos.length) { laatsteImage = fotos.photos.length -1; }
    $("#thumbnails img").unbind();
    $("#thumbnails").html('');

    for (var i=startImage; i<=laatsteImage; i++) {
        // console.log (fotos.photos[i].filename);
        img = '<img src="' + fotos.photos[i].src + '" photo="' + i + '" id="thumb' + i + '" fullsize="'+fotos.photos[i].fullsize+'" width="62" height="62">';
        $("#thumbnails").append(img);
    }

    // add the sidebar img actions
    $("#thumbnails img").css({'cursor':'pointer'}).click(function() {
        if (rob.showingIntro) {
            rob.showingIntro = false;
            $("#mainfoto").html('<img scr="" alt="" />');
        }
        var photonumber = $(this).attr('photo');
        // console.log (fullsize);
        rob.setMainPhoto(photonumber);
    });

}; // buildThumbnailMatrix

rob.calculatePage = function () {
    return Math.floor(rob.activephoto / rob.fotosPerPagina);
}

rob.buildGallery = function () {

    // if (typeof(i)=='number') { rob.pagina=i; } else { rob.pagina=0; }
    rob.pagina = rob.calculatePage();
    // console.log ('buildGallery goes with ' + rob.pagina);
    // we will start with showing the intro text
    var showingIntro = true;

    $("#footer").css({'display':'none'}); 

    $("#portfoliotext").click(function() {
        showingIntro = false;
        $("#mainfoto").html('<img scr="" alt="" />');
        fullsize = fotos.photos[rob.activephoto].fullsize;
        $("#mainfoto img").attr('src', fullsize);
        rob.addGalleryPreviousNext();
    });

    rob.buildThumbnailMatrix(rob.pagina);

    $("#thumbnails").append('<div class="home"><a href="/">Home</a></div>');
    rob.showPagesMenu();
    
    return true;
};

rob.showPagesMenu = function () {
    // if (rob.showingPages===true) { return true; }
	var url;
	var numberOfPhotos = fotos.photos.length;
	// numberOfPhotos = 40;
    var pages = Math.ceil(numberOfPhotos / rob.fotosPerPagina );
    if (pages < 2) {
        $("#thumbnails").append('<div class="paginering"></div>');
        return true;
    }
    var tmenu  = '<div class="paginering">';
    var tclass = ''; 
    for (var i=0; i<pages; i++) {	    
        tclass = (i==rob.pagina) ? 'activeThumbnailPage' : 'normalThumbnailPage';
        tmenu = tmenu + '&nbsp;&nbsp;<span id="pagina'+ i +'" number="'+ i +'" class="'+tclass+'">' + (i+1) + '</span>';
    }
    tmenu = tmenu + '</div>';
    $("#thumbnails").append(tmenu);
    for (var i=0; i<pages; i++) {	    
        $('#pagina'+i).attr('pagenumber',i).click(function() {
            var pagnr = $(this).attr('pagenumber');
            // rob.activephoto = rob.pagina * rob.fotosPerPagina;
            // console.log('click sets to ' + rob.pagina);
            $(".paginering").removeClass().addClass('normalThumbnailPage');
            $(this).removeClass().addClass('activeThumbnailPage');
            // rob.buildGallery();
            rob.setMainPhoto( pagnr * rob.fotosPerPagina);
	    // alert('pagina ' + $(this).attr('number'));
        });
    }
    $(".normalThumbnailPage").css({'cursor':'pointer', 'background-color' : '#222222', 'color':'#dddddd'});
    $(".activeThumbnailPage").css({'cursor':'pointer', 'background-color' : '#dddddd', 'color':'#222222'});
    rob.showingPages = true;
};

rob.RGBtoHSL = function (rgb) {
        var r = rgb[0] /255,
            g = rgb[1] /255,
            b = rgb[2] /255,
            max = Math.max(r, g, b),
            min = Math.min(r, g, b),
            delta = max-min,
            h = 0,
            l = (max+min)/2,
            s = delta == 0? 0 : (l < .5? delta/(max+min) : delta/(2 -max-min));
        if (s != 0) {
            switch(max) {
                case r: h = (g-b)/delta; break;
                case g: h = 2 + (b-r)/delta; break;
                case b: h = 4 + (r-g)/delta; break;
            }
        }
        return [h*60,s*100,l*100];
    };

rob.HSLtoRGB = function (hsl){
        var h = hsl[0] /360,
            s = hsl[1] /100,
            l = hsl[2] /100,
            m2 = l <= .5? l * (s + 1) : l + s - l * s,
            m1 = l * 2 - m2;
        return [Math.round(rob.hueToRGB(m1, m2, h+1/3) * 255), Math.round(rob.hueToRGB(m1, m2, h) * 255), Math.round(rob.hueToRGB(m1, m2, h-1/3) * 255)];
    };

rob.hueToRGB = function (m1, m2, h){
        if (h < 0) h+=1;
        if (h > 1) h-=1;
        if (h * 6 <1) return m1 + (m2 - m1) * h * 6;
        if (h * 2 <1) return m2;
        if (h * 3 <2) return m1 + (m2 - m1) * (2/3 - h) * 6;
        return m1;
    };

rob.shiftHue = function (htmlcolor, shiftvalue) {
    var rgb, hsl;
    function d2h(d) {return d.toString(16);}
    function h2d(h) {return parseInt(h,16);}
    if (result = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(htmlcolor)) {
        rgb = [parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)];
    }
    hsl    = rob.RGBtoHSL(rgb);
    hsl[0] = (hsl[0] + shiftvalue) % 255;
    rgb    = rob.HSLtoRGB(hsl);
    return '#' + d2h(rgb[0]) + d2h(rgb[1]) + d2h(rgb[2]);
}

rob.setHue = function (htmlcolor, huevalue) {
    var rgb, hsl;
    function d2h(d) { 
        var str = d.toString(16); 
        if (str.length==1) { str='0'+str; }
        return str;
    }
    function h2d(h) { return parseInt(h,16); }
    if (result = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(htmlcolor)) {
        rgb = [parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)];
    }
    else { 
		// console.log('rb ' + htmlcolor + ' ' + huevalue); 
		return false;
	}
    hsl    = rob.RGBtoHSL(rgb);
    // console.log(hsl);
    hsl[0] = huevalue;
    if (huevalue == -1) { 
	    hsl[0] = 2;
	    hsl[1] = 2;
	    // hsl[2] = (60 + hsl[2]) / 2;
    }
    rgb = rob.HSLtoRGB(hsl);
    return '#' + d2h(rgb[0]) + d2h(rgb[1]) + d2h(rgb[2]);
}



rob.palet = {
    'styles': [
     
{selector: 'body', values: { 'background-color': '#2e2716', 'color': '#c0bcb3' } },
{selector: '#page', values: { 'background-color': '#4c4125' } },
{selector: '#header', values: { 'background-color': '#271d04' } },
{selector: '#menubar', values: { 'background-color': '#271d04', 'color': '#ffffff' } },
{selector: '#menu li.block1', values: { 'background-color': '#6f6750' } },
{selector: '#menu li.block2', values: { 'background-color': '#8c8475' } },
{selector: '#menu li.block3', values: { 'background-color': '#a59f93' } },
{selector: '#footerinner', values: { 'background-color': '#271d04' } },
{selector: '#content.portfolio', values: { 'background-color': '#271d04' } },
{selector: '#thumbnails img, #mainfoto img', values: { 'border-color': '#4c4125' } },
{selector: '#thumbnails a', values: { 'color': '#c0bcb3' } },
{selector: '.stripfoto', values: { 'border-color': '#271d04' } },
{selector: '#menu li.block1 a', values: { 'background-color': '#9a9584' }, hover: true },
{selector: '#menu li.block2 a', values: { 'background-color': '#a19c90' }, hover: true },
{selector: '#menu li.block3 a', values: { 'background-color': '#c0bcb3' }, hover: true },
{selector: '#contactinfo-inner', values: { 'background-color': '#6f6750' } },
{selector: '#content a', values: { 'color': '#c0bcb3' } },
{selector: '#contactinfo a', values: { 'color': '#c0bcb3' } },
{selector: '##mainfoto img', values: { 'border-color': '#aaaa88' } }
        ]
    };


rob.camelCase = function (a) {
	var mapping = {
		'background-color' : 'backgroundColor',
		'border-color'     : 'borderColor'
	};
	return mapping[a] || a;
};

rob.buildvisual = function (pagina, kleur) {
	bestand = '/img_visual/' + pagina + '_' + kleur + '.jpg';
	$("#fotostrip").html('').css({
		'background-image': 'url(' + bestand + ')',
		'background-position': 'top left'
	});
	return;
};

rob.buildstrip = function () {
	
	var newstrip = "";

	var fotopool = {
		'huwelijk' : ['bieb.jpg','wijnands1.jpg','stjoost.jpg','hartman.jpg'],
		'baby'     : ['newborn2.jpg', 'babyouder8.jpg', 'baby9.jpg', 'baby11.jpg'],
		'kinderen' : ['kuvers1.jpg', 'bril.jpg', 'broerenzus9.jpg', 'groepkids6.jpg'],
		'familie'  : ['groep1.jpg', 'groep2.jpg', 'groep8.jpg'],
		'portret'  : ['tamira.jpg', 'cyrille2.jpg', 'linne1.jpg', 'portret2.jpg']
	};

	var f=0;
	var fotopath = '';
	for (fotocat in fotopool) {
		f = Math.floor(Math.random() * fotopool[fotocat].length);
		fotopath = '/uploads/images/portfolio/' + fotocat + '/strip/' + fotopool[fotocat][f];
		newstrip = newstrip + '<img class="stripfoto" src="'+fotopath+'" categorie="'+fotocat+'" />';
	}
	newstrip = '<div id="fotostrip_inner">' + newstrip + newstrip + '</div>';
	
	$("#fotostrip").css({'position':'relative','overflow':'hidden', 'top': '0'}).html(newstrip);
	
	$(".fotostrip").css({'display': 'inline'});
	
	$("img.stripfoto").css('cursor','pointer').click(function() {
		$(location).attr('href','http://www.robvangeffen.nl/' + $(this).attr('categorie'));
	});
	
	function start_animation() {
		$("#fotostrip_inner").css({'left': '0', 'width': '1500px'}).animate({'left': '-700px'}, 50000, 'linear', start_animation);
	}

	$("#fotostrip_inner").css({'position':'absolute'});
	start_animation();

};

rob.buildHomepage = function () {
	$("#menubar").hide();
	$("#menu-inner").css({"marginLeft": "-1000px"});
	$("#fotostrip").css({"marginLeft": "+1000px"});
	$("#header").html('<img src="/img/logo_nieuwe_site.png" />').css('position','relative');
	$("#header").html('<img src="/img/logo_nieuwe_site_flash.png" id="flashimage" style="display:none" />');
	$("#content_inner").css('padding','0');
    rob.homepageContent = $("#content_inner").html();
    $("#content_inner").html('<img id="introfoto" src="/img/intro.jpg" /><div id="filler"></div>');
    $("#introfoto").click(rob.animateHomepage);
};

rob.animateHomepage = function () {
	$("#flashimage").fadeIn(50, function () {  
		$("#flashimage").fadeOut(180, function () {
        	$("#menubar").slideToggle(350, function(){
		        $("#menu-inner").animate({ "marginLeft": 0 }, 700, function(){
		            $("#fotostrip").animate({ "marginLeft": 0 }, 1400, function (){
                        $("#introfoto").fadeOut(180, function(){ 
                            // $("introfoto").remove(); 
                            $("#content_inner").html(rob.homepageContent).css({'padding':'20px', 'display': 'none'}).fadeIn(350);
                           
                            $.flamefooter('page','filler','footer', true);
                        });
                    });
			    });
		    });
		});
	});
};

rob.shiftColor = function( shiftValue, speedvalue ) {
	var i, j, k, style_item, newvalue, speedvalue;
	$("#slidervalue").html(shiftValue);
	if (shiftValue == 'grijs') {
	    for (i in rob.palet.styles) {
	        style_item = rob.palet.styles[i];
        	$(style_item.selector).stop();
	        for (j in style_item.values) {
	            newvalue = rob.setHue(style_item.values[j], -1);
	            
	            k = rob.camelCase(j);
	            // console.log(style_item.selector + ' ' + j + ' ' + newvalue);
	            if (style_item.hover) {
	                $(style_item.selector).hover(  function () { 
						$(this).css('backgroundColor', newvalue); 
				    });
	            }
	            else {
					if (k == 'backgroundColor') { $(style_item.selector).animate({backgroundColor : newvalue}, speedvalue); }
	                if (k == 'color')           { $(style_item.selector).animate({color : newvalue}, speedvalue); }
	                if (k == 'borderColor')     { $(style_item.selector).animate({borderColor : newvalue}, speedvalue); }
	            }
	        }
	    }
    }
    else {
	    // var direction = (rob.themecolor < shiftValue) ? 1 : -1;
	    // for (var colorrunner=rob.themecolor; colorrunner!=shiftValue; colorrunner+=direction) {
	    for (i in rob.palet.styles) {
	        style_item = rob.palet.styles[i];
	        $(style_item.selector).stop();
	        for (j in style_item.values) {
	            newvalue = rob.setHue(style_item.values[j], shiftValue);
	            
	            k = rob.camelCase(j);
	            if (!style_item.hover) {
	            	if (k == 'backgroundColor') { $(style_item.selector).animate({backgroundColor : newvalue}, speedvalue); }
	                if (k == 'color') {           $(style_item.selector).animate({color : newvalue}, speedvalue); }
	                if (k == 'borderColor') {     $(style_item.selector).animate({borderColor : newvalue}, speedvalue); }
                }
	            else {
		            // style_item.restore_value = $(style_item.selector).css(j);
	                // if (k != 'backgroundColor') { alert('Please expand the hover animation'); }
	                $(style_item.selector).unbind('hover').hover(  
		                function () {
	                        $(this).css(j, newvalue); 
	                    }, 
	                    function () { 
		                    $(this).css(j, 'transparent'); 		
		                }
		            );
	            }

		    }
        }
        // rob.themecolor = shiftValue;
	}
}


rob.contactData = '<div id="contactdata" class="contactdata">Rob van Geffen Fotografie<br />Groenstraat 21<br />6067&nbsp;AX&nbsp;&nbsp;Linne<br /></div><div id="contactdata2" class="contactdata"><span class="alabel">Telefoon: </span>0475-463492<br /><span class="alabel">Internet: </span><a href="http://www.robvangeffen.nl">http://www.robvangeffen.nl</a><br /><span class="alabel">E-mail: </span><a href="mailto:"info@robvangeffen.nl">info@robvangeffen.nl</a><br /></div>';

rob.contactSlider = false;
rob.contactInformation = function () {
	$('<div id="contactinfo"><div id="contactinfo-inner">'+rob.contactData+'</div></div>').appendTo("#menubar");
    // .css({display: "block", position:"absolute", height:"126px", width: "565px", left: "416px", marginLeft: "1000px", top: "155px"}).appendTo("#menubar");

	$("a[href$=/index.php?page=contact], a[href$=/contact]").click(function(){
	    if (rob.contactSlider) {
		    $("#contactinfo-inner").animate({marginLeft: "1000px"}, 1000);
		    rob.contactSlider = false;
	    }
	    else {
		    $("#contactinfo-inner").animate({marginLeft: "0"}, 1000);
		    rob.contactSlider = true;
		}
		return false;
	});
}

jQuery(function() {

    var kleur = $.cookie('kleur') || 1;
    // console.log(kleur);
    if (kleur >= 0) {
        rob.themenumber = kleur;
	    rob.shiftColor(rob.kleurnummers[kleur], 1);
    }
        


    if (pagina!='nieuws' && pagina!='blog' && pagina!='links' && pagina!='studio') { pagina = ''; }

    if (pagina=='') { 
        $(rob.buildstrip);
    }
    else {
	    rob.buildvisual(pagina, rob.kleurnamen[rob.themenumber]);
    }

   var ui_value = 0;

    $("#menubar").css("overflow", "hidden");

    if (typeof(fotos) !== 'undefined' && typeof(fotos)==="object") {
        rob.buildGallery();
    }
 
    if (typeof(thisIsHome)!=='undefined' && thisIsHome === true) {
        rob.buildHomepage();
    };

    var myColorpicker = 'Kleuren: <div id="bolletjes"></div>';
    $("#footer #colorpicker").append('<div id="colorpickerlabel">Kleuren: </div><div id="bolletjes"><img src="/img/colorpicker_selector.png" /></div>');
    $("#bolletjes").css({'float':'left','position':'relative','margin-top':'4px','width':'156px','height':'16px','background':'transparent url(/img/colorpicker.png) no-repeat'});
    $("#colorpickerlabel").css({'float':'left','width':'90px','padding':'4px 0 0 8px'});
    $("#bolletjes img").css({'position':'absolute','left':rob.cursorbolletjes[rob.themenumber]  + 'px', 'display':'block' });
    


    $("#bolletjes").click(function(e){
	    var x = e.pageX - this.offsetLeft;
	    // console.log(x);
	    var p = rob.cursorbolletjes;
	    var c = rob.kleurnummers;
	    var n = rob.kleurnamen;
	    var s = Math.floor(x / 20);
	    // console.log(s);
	    $("#bolletjes img").css({'left':p[s]+'px'});
	    
	    rob.shiftColor(c[s], 500);
            $.cookie('kleur', s, { path: '/', expires: 10 });
            if (pagina != '') {
                rob.buildvisual(pagina, n[s]);
            }
    });

    
    $.flamefooter('page','filler','footer');
    
    $("#header").click(function(){
        window.location='/';

    }).css('cursor', 'pointer');

    // rob.contactInformation();
});