/**
  Copyright (c) 2009 Catalyst of Design :: tALSit de CoD
  talsit@talsit.org
 */
$(document).ready(function()
{   
    //-------------------------------------------------------------------------
    function dbg( d )
    {
        $("#dbg").show();
        $("#dbg_container").text( $("#dbg_container").text() + d + "\n" );
    }

    //-------------------------------------------------------------------------
	$("#dbg_hider").click(function(event)
	{
        $("#dbg").hide();
	});

    //-------------------------------------------------------------------------
	$("#dbg_clear").click(function(event)
	{
        $("#dbg_container").text( "" );
	});

    //-------------------------------------------------------------------------
    function getHashURL( url )
    {
        var idx = url.indexOf( "#" );
        if ( idx == -1 )
            return url;
        return url.substring( idx );
    }

    //-------------------------------------------------------------------------
    function mkPageLink( a_href, a_name, a_id, a_load_page )
    {
        $("<a>"+a_name+"</a>")
            .attr( { href:a_href, id:a_id, load_page:a_load_page } )
            .addClass("page")
            .hover( function(event) 
                    {
                        $(this).addClass("bgHover");
                    }, 
                    function(event) 
                    {
                        $(this).removeClass("bgHover");
                    } )
            .appendTo( $("<li>").addClass("page")
                                .appendTo( "#pages" ) );
    }

    //-------------------------------------------------------------------------
    function loadPages( cb )
    {
        $.getJSON( ROOT+"data.php?w=pages", function( data )
        {
            $.each( data.pages, function( i, page )
            {
                if ( page.ext != null )
                    mkPageLink( page.ext, page.name, page.name, "#" );
                else
                    mkPageLink( "#"+page.name, page.name, page.name, page.path );
            });
            if ( cb != null )
                cb();
        });
    }
    
    //-------------------------------------------------------------------------
    function loadBlog( cb )
    {
        $("#loader").addClass("loading");
        $.getJSON("http://blog.talsit.org/api/read/json?callback=?&num=6", function( data ) 
        {
            var thing = $( "<div> </div" );
            $("#content").append( $(thing) );
            $("#blog").addClass( "bgSelected" );
            $(thing).addClass( "centered" );
            $(thing).append( "<hr>" );
            $(thing).append( "blog:<br>" );
            $.each(data.posts, function(i,posts)
            { 
                var url = this["url-with-slug"]; 
                var photo = this["photo-url-75"]; 
                var caption = this["photo-caption"];
                
                var blogThumb = new Image();
                $(blogThumb).load( function()
                {
                    $(this).fadeIn( "slow" );
                });

                $(blogThumb).attr( {src:photo,width:75,height:75} )
                    .addClass( "blogPhoto" );
            
                $(thing)
                    .append( $("<li>")
                    .addClass( "blogPhoto" )
                    .append( $("<a> </a>")
                        .attr( { href:url } )
                        .append( $(blogThumb) )
				) );
            }); 
            $("#loader").removeClass("loading");
            $(thing).append( $("<div> </div>").addClass( "break" ) );
            $(thing).append( "<hr>" );

            $("#loader").addClass("loading");
            $.getJSON("http://daily.talsit.org/api/read/json?callback=?&num=12", function( data ) 
            {
                var thing = $( "<div> </div" );
                $("#content").append( $(thing) );
                $("#blog").addClass( "bgSelected" );
                $(thing).addClass( "centered" );
                $(thing).append( "dailyPortrait:<br>" );
                $.each(data.posts, function(i,posts)
                { 
                    var url = this["url-with-slug"]; 
                    var photo = this["photo-url-75"]; 
                    var caption = this["photo-caption"];
                    
                    var blogThumb = new Image();
                    $(blogThumb).load( function()
                    {
                        $(this).fadeIn( "slow" );
                    });

                    $(blogThumb).attr( {src:photo,width:75,height:75} )
                        .addClass( "blogPhoto" );
                
                    $(thing)
                        .append( $("<li>")
                        .addClass( "blogPhoto" )
                        .append( $("<a> </a>")
                            .attr( { href:url } )
                            .append( $(blogThumb) )
                    ) );
                }); 
                $("#loader").removeClass("loading");
                $(thing).append( $("<div> </div>").addClass( "break" ) );
                $(thing).append( "<hr>" );

                if ( cb != null )
                    cb();
            });
        });
    }
    
    

    //-------------------------------------------------------------------------
    function loadTags()
    {
        $.getJSON( ROOT+"data.php?w=tags", function( data )
        {
            $.each( data.tags, function( i, tag )
            {
                $("<a>").attr( { href:"#"+tag, id:"tag" } ).text( tag ).appendTo( "#tags" );
                $("<br>").appendTo( "#tags" );
            });

        });
    }

    //-------------------------------------------------------------------------
    function loadContent( page, which, sub, callback )
    {
        if ( currentPage == page )
            return;
        currentPage = page;
        if ( !sub )
            currentAlbum = "";

        $(which).text( "" );
        var showHidden = HIDDEN ? "&hidden=1" : "";
        $.get( ROOT+"data.php?w=content&page="+page+showHidden, function( data, status )
        {
            $(which).text( "" );
            $(which).append( data );
            if ( callback != null )
                callback();
        });
    }

    //-------------------------------------------------------------------------
    function clickThumbAddImage( photo, img, cb )
    {
        $("#albumcontent_display_img img").remove();
        $("#albumcontent_display_img a").remove();
        $("#bkWhite").fadeTo( "fast", 1 );
        $("#bkGrey").fadeTo( "fast", 1 );
        $("#bkBlack").fadeTo( "fast", 1 );
        $("#imgClose").fadeTo( "fast", 0.7 );
        $("#imgClose").attr( { href:photo.hashurl, gid:photo.gid } );
        $("#bkWhite").attr( { href:photo.hashurl, gid:photo.gid } );
        $("#bkGrey").attr( { href:photo.hashurl, gid:photo.gid } );
        $("#bkBlack").attr( { href:photo.hashurl, gid:photo.gid } );
        if ( photo.idx == 0 )
        {
            $("#imgPrev").fadeTo( "fast", 0.2 ).addClass("unClickable");
        }
        else
        {
            var prevImg = albumData.photos.photo[photo.idx-1];
            $("#imgPrev").attr( { href:prevImg.hashurl, gid:prevImg.gid } );
            $("#imgPrev").fadeTo( "fast", 0.7 ).removeClass("unClickable");
            if (!prevImg.imageData)
            {
                var prevImgData = new Image();
                $(prevImgData).attr( "src", prevImg.photoURL );
                $(prevImgData).load(function()
                {
                    prevImgData = prevImgData;
                });
            }
        }
        
        if ( photo.idx == albumData.photos.photo.length-1 )
        {
            $("#imgNext").fadeTo( "fast", 0.2 ).addClass("unClickable");
        }
        else
        {
            var nextImg = albumData.photos.photo[photo.idx+1];
            $("#imgNext").attr( { href:nextImg.hashurl, gid:nextImg.gid } );
            $("#imgNext").fadeTo( "fast", 0.7 ).removeClass("unClickable");
            var nextImgData = new Image();
            $(nextImgData).attr( "src", nextImg.photoURL );
            if (!nextImg.imageData)
            {
                var nextImgData = new Image();
                $(nextImgData).attr( "src", nextImg.photoURL );
                $(nextImgData).load(function()
                {
                    nextImgData = nextImgData;
                });
            }
        }
        
        if ( photo.flickrUrl )
        {
            $("#albumcontent_display_img")
                .append( $("<a> </a>")
                    .attr( { href:photo.flickrUrl, target:"_blank", id:"flickr_img_link" } )
                    .append( img ) );
            $(img).fadeIn( "fast", cb );
        }
        else
        {
            $("#albumcontent_display_img").append( img );
            $(img).fadeIn( "fast", cb );
        }
    }
    
    //-------------------------------------------------------------------------
    function positionIt( img )
    {
        var wwidth = $(window).width();
        var wheight = $(window).height();
        var wheight_calc = wheight-30;
        var width = $(img).attr( "width" );
        var height = $(img).attr( "height" );
        if (width > wwidth)
        {
            var ratio = ( 1.0 - ( width - wwidth ) / width ) * 0.8;
            width = width * ratio;
            height = height * ratio;
            $(img).width(width);
            $(img).height(height);
        }
        if (height > wheight_calc)
        {
            var ratio = ( 1.0 - ( height - wheight_calc ) / height ) * 0.8;
            width = width * ratio;
            height = height * ratio;
            $(img).width(width);
            $(img).height(height);
        }
        var left = ( wwidth - width ) / 2;
        var top = ( wheight_calc - height ) / 2;
        $("#albumcontent_display").css( {left:left,top:top,width:width+4} );
        $("#albumcontent_display_nav").css( {width:width+6} );
        $("#albumcontent_display_overlay").width(wwidth);
        $("#albumcontent_display_overlay").height(wheight);
    }

    //-------------------------------------------------------------------------
    function clickThumb( event )
    {
        var photo = event.data;
        // photo may no longer be there...
        if ( !photo )
            return;
        var photoPath = photo.photoURL;
        if ( currentPhoto == photoPath )
        	return;
        currentPhoto = photoPath;

        $("#albumcontent_thumbs .thumbHighlight").removeClass("thumbHighlight");
        $(photo.thumb).addClass( "thumbHighlight" );

        $("#albumcontent_display_img img").fadeTo( "slow", 0.6 );
        $("#loader").addClass("loading");
        var largeImage = photo.imageData?photo.imageData:new Image();

        photo.photoPath = photoPath;
        $(largeImage).load(function()
        {
            $(this).hide();
            $("#loader").removeClass( "loading" );

            positionIt( $(this) );

            if ( !$("#albumcontent_display_overlay").hasClass( "shown" ) )
                $("#albumcontent_display_overlay").fadeTo( "fast", 0.7 ).addClass( "shown" );
            clickThumbAddImage( photo, this, function() 
            {
                $("#albumcontent_display").fadeIn( "fast" );
            } );
        });
        
        $(largeImage)
            .attr( "src", photoPath )
            .addClass( "border" );
    }

    //-------------------------------------------------------------------------
    function loadThumb( photo, ul, clickOnIt )
    {
        var thumb = new Image();
        photo.thumb = thumb;
        $(thumb).load( function()
        {
            $(this).fadeIn( "slow" );
        });

        photoData[ photo.gid ] = photo;

        $(thumb).attr( "src", photo.thumbURL )
            .addClass( "thumb" );
            
        // TODO: msie hack
        if ( !jQuery.browser.msie )
            $(thumb).hide();        

        photo.hashurl = "#"+photo.gid.replace( /:/g,"/" );
        $(ul)
            .append( $("<li>")
                .append( $("<a> </a>")
                    .attr( { href:photo.hashurl, id:photo.gid } )
                    .addClass( "clickable_thumb" )
                        .append( $(thumb) ) ) );
                        
        if ( clickOnIt )
        {
            var evt = {};
            evt.data = photo;
            clickThumb( evt );
        }
    }

    //-------------------------------------------------------------------------
    function processAlbum( data, partHeading )
    {
        if ( data.stat == "fail" )
        	return data;

        if ( data.stat == "local" )
        {
        	return data;
        }
        else
        {
            var idx = 0;
            $.each(data.photos.photo, function(i,photo)
            {
                photo.thumbURL = photo.url_sq;
                photo.originalURL = photo.url_o;
                photo.photoURL = photo.url_m;
                if ( photo.url_l != null )
                    photo.photoURL = photo.url_l;
                photo.flickrUrl = "http://flickr.com/photos/"+photo.owner+"/"+photo.id;
                photo.gid = (partHeading+'/'+photo.id).replace( /[\. -]/g,"_" ).replace( /\//g, ":" );
                photo.idx = idx++;
            });
        	return data;
        }
    }

    //-------------------------------------------------------------------------
    function loadAlbum( url, partHeading, loadFirst, cb )
    {
    	if ( currentAlbum == url )
        {
    		return;
        }
        currentAlbum = url;

        $("#loader").addClass("loading");

        $("#albumcontent_text").fadeOut( "fast", function()
        {
            $.each( $("#albumcontent_text_content").children(), function(i)
            {
                $(this).remove();
            });
        });
        
        $("#albumcontent_thumbs").fadeOut( "fast", function()
        {
            $.each( $(this).children(), function(i)
            {
                $(this).remove();
            });
            $(this).fadeIn( "fast", function()
            {
                $.getJSON( url, function( data )
                {
                    $("#loader").removeClass("loading");
                	albumData = processAlbum( data, partHeading );
                    if ( albumData.photos.stat == "fail" )
                    {
                        currentAlbum = "";
                        output ( "Error getting data, sorry!\n" + url );
                        return;
                    }
                    
                    loadContent( partHeading+"/index.php", "#albumcontent_text_content", true, function( data )
                    {
                        $("#albumcontent_text").fadeIn( "fast" );
                    } );

                    var div = $( "<div>" );
                    $(div)
                    	.addClass( "albumcontent_thumbs" )
                    	.addClass( "border" )
                    	.appendTo( "#albumcontent_thumbs" );
                    var ul = $( "<ul>" );
                    $(ul)
                        .addClass( "albumcontent_thumbs" )
                        .appendTo( div );

                    for ( idx = 0 ; idx < albumData.photos.photo.length ; ++idx )
                    {
                        albumData.photos.photo[ idx ].dname = partHeading;
                        loadThumb( albumData.photos.photo[ idx ], ul, loadFirst?idx==0:false );
                    }

                    if ( cb != null )
                        cb();
                });
            });
        });
    }

    //-------------------------------------------------------------------------
    function getAlbumURL( item )
    {
    	var uid = item.attr( "flickr_user" );
    	if ( uid == null )
    	{
    		var url = getHashURL( item.attr( "href" ) ).substr( 1 )+"/.config.js"
        	return ROOT+"data.php?w=album&page="+url;
    	}
    	else
    	{
        	var tag = item.attr( "flickr_tag" );
    		return ROOT+"data.php?w=flickr&uid="+uid+"&tag="+tag;
    	}
    }

    //-------------------------------------------------------------------------
    function Id( id )
    {
        return id.replace( /\:/g, "\\:" );
    }

    //-------------------------------------------------------------------------
    function rId( id )
    {
        return id.replace( /\//g, ":" );
    }

    //-------------------------------------------------------------------------
    function preLoad( loc )
    {
        if ( loc == "" )
        {
	    loadBlog();
            return;
        }
        loc = loc.substr( 1 );
        var parts = loc.split( "/" );
        if ( parts.length == 0 )
        {
            loadBlog();
            return;
        }

        var pageName = parts[ 0 ];
        loadContent( $( "#"+pageName ).attr( "load_page" ), "#content", false, function()
        {
            if ( parts.length == 1 )
            {
                return;
            }

            var partName = pageName+":"+parts[ 1 ];
            loadAlbum( getAlbumURL( $( "#"+Id( partName ) ) ), 
                       getHashURL( $( "#"+Id( partName ) ).attr( "href" ) ).substr( 1 ), 
                       false,
                       function()
            {
                if ( parts.length == 2 )
                {
                    return;
                }

                var imgName = parts[ 2 ];
                var part = (partName+":"+imgName).replace( /[\. -]/g,"_" ).replace( /\\/g,":" );
                var photo = photoData[ $( "#"+Id( part ) ).attr( "id" ) ];
                var evt = {};
                evt.data = photo;
                clickThumb( evt );
            });
        });
    }

    //-------------------------------------------------------------------------
    function justRemoveIt(who)
    {
        $.each( who.children(), function(i)
        {
            justRemoveIt($(this));
        });
        who.removeClass( "bgSelected" );
    }

    //-------------------------------------------------------------------------
    $(".clickable_album").livequery( 'click', function( event )
    {
        justRemoveIt($("#albums"));
        $(this).addClass( "bgSelected" );
        loadAlbum( getAlbumURL( $(this) ), getHashURL( $(this).attr( "href" ) ).substr( 1 ), false );
    });

    //-------------------------------------------------------------------------
    $(".clickable_album").livequery( 'mouseenter', function( event )
    {
        $(this).addClass("bgHover");
    });

    //-------------------------------------------------------------------------
    $(".clickable_album").livequery( 'mouseleave', function( event )
    {
        $(this).removeClass("bgHover");
    });

    //-------------------------------------------------------------------------
    $(".clickable_flickr").livequery( 'click', function( event )
    {
        justRemoveIt($("#albums"));
        $(this).addClass( "bgSelected" );
        loadAlbum( getAlbumURL( $(this) ), getHashURL( $(this).attr( "href" ) ).substr( 1 ), false );
    });

    //-------------------------------------------------------------------------
    $(".clickable_flickr").livequery( 'mouseenter', function( event )
    {
        $(this).addClass("bgHover");
    });

    //-------------------------------------------------------------------------
    $(".clickable_flickr").livequery( 'mouseleave', function( event )
    {
        $(this).removeClass("bgHover");
    });

    //-------------------------------------------------------------------------
    $(".clickable_thumb").livequery( 'click', function( event )
    {
        var photo = photoData[ $(this).attr( "id" ) ];
        var evt = {};
        evt.data = photo;
        clickThumb( evt );
    });

    //-------------------------------------------------------------------------
    $("#imgPrev").livequery( 'click', function( event )
    {
        if ( $(this).hasClass( "unClickable" ) )
            return;
        var photo = photoData[ $(this).attr( "gid" ) ];
        var evt = {};
        evt.data = photo;
        clickThumb( evt );
        location.hash = $(this).attr( "href" );
    });

    //-------------------------------------------------------------------------
    $("#imgNext").livequery( 'click', function( event )
    {
        if ( $(this).hasClass( "unClickable" ) )
            return;
        var photo = photoData[ $(this).attr( "gid" ) ];
        var evt = {};
        evt.data = photo;
        clickThumb( evt );
        location.hash = $(this).attr( "href" );
    });

    //-------------------------------------------------------------------------
    $("#imgClose").livequery( 'click', function( event )
    {
        $("#albumcontent_display_overlay").fadeOut( "fast", function() 
        {
            $("#albumcontent_display_overlay").width(0);
            $("#albumcontent_display_overlay").height(0);
            $("#albumcontent_display_overlay").removeClass( "shown" );
        } );
        $("#albumcontent_display").fadeOut( "fast", function() 
        {
            $("#albumcontent_display_img img").remove();
            $("#albumcontent_display_img a").remove();
        } );
        $("#albumcontent_thumbs .thumbHighlight").removeClass("thumbHighlight");
        location.hash = location.hash.substr( 0, location.hash.lastIndexOf( "/" ) );
    });

    //-------------------------------------------------------------------------
    $("#bkWhite").livequery( 'click', function( event )
    {
        $("#albumcontent_display_overlay").animate( {opacity: 0}, "fast", "swing", function()
        {
            $("#albumcontent_display_overlay").css( "background-color", "#ffffff" )
                .animate( {opacity: 0.98}, "fast", "swing" );
        } );
    } );

    //-------------------------------------------------------------------------
    $("#bkGrey").livequery( 'click', function( event )
    {
        $("#albumcontent_display_overlay").animate( {opacity: 0}, "fast", "swing", function()
        {
            $("#albumcontent_display_overlay").css( "background-color", "#333333" )
                .animate( {opacity: 0.7}, "fast", "swing" );
        } );
    } );

    //-------------------------------------------------------------------------
    $("#bkBlack").livequery( 'click', function( event )
    {
        $("#albumcontent_display_overlay").animate( {opacity: 0}, "fast", "swing", function()
        {
            $("#albumcontent_display_overlay").css( "background-color", "#000000" )
                .animate( {opacity: 0.97}, "fast", "swing" );
        } );
    } );

    //-------------------------------------------------------------------------
    $("#pages a").livequery( 'click', function( event )
    {
        var url = $(this).attr( "load_page" );
        justRemoveIt($("#pages"));
        $(this).addClass( "bgSelected" );
        loadContent( url, "#content", false );
    });

    //-------------------------------------------------------------------------
    $("#albumcontent_display_overlay").livequery( 'click', function( event )
    {
        $("#imgClose").click();
    });
    
    //-------------------------------------------------------------------------
    $(window).resize(function() 
    {
        if ( !$("#albumcontent_display_overlay").hasClass( "shown" ) )
            return;
        positionIt($("#albumcontent_display_img img"));
    });

    
    //-------------------------------------------------------------------------
    function checkKey(e)
    {
        switch( e.keyCode )
        {
        case 37: // left
            $("#imgPrev").click();
            break;
        case 39: // right
            $("#imgNext").click();
            break;
        case 27: // esc
            $("#imgClose").click();
            break;
        }
    }

    if ($.browser.mozilla) 
    {
        $(document).keypress(checkKey);
    } 
    else 
    {
        $(document).keydown(checkKey);
    }


    //-------------------------------------------------------------------------
    var photoData = new Object;
    var albumData = new Object;
    var currentPage = "";
    var currentAlbum = "";
    var currentPhoto = "";
    loadPages( function(){ preLoad( location.hash ); } );
});