$(document).ready(function() {
    // hijack pages links
    $('#previewPane a').each(function() {
        this.href = this.href.substring(this.href.lastIndexOf("?")).replace("?", "#");
    });
    if ($('#photoDescription h2 a').attr('href')) {
        $('#photoDescription h2 a').show(); // magnification image
    }

    var fadeInLargePhoto = function() {
        $('#contentContainer .container').hide();
         // extra callback for IE 6
        $('#popup').fadeIn('normal', function() {
			notLoading();
            $('#popup img').each(function() {
                var self = $(this);
                if (self.width() > 740) {
                    self.width(740);
                }
            });
        });
        $('#popup img').unbind();
    };
    $('#photoDescription h2 a').live('click', function(evt) {
		evt.preventDefault();
        loading();
        $('#popupDescription').html($('#photoDescription').html());
        $('#popup img').load(fadeInLargePhoto).attr('src', this.href);
    });
    $('#popup a').click(function(event) {
        event.preventDefault();
        notLoading();
        $('#popup').hide();
        $('#contentContainer .container').fadeIn();
    });

    (function() {
        var _previewCache = {};
        var _photoCache = {};
        // on first page load check query string parameters
        var params = window.parseQuery(location.search);

        //        var _hash = "";
        var _page = params['page'] | 1;
        var _uid = params['uid'];

        var replacePreview = function(data) {
            notLoading();
            $('.pager a.active').removeAttr('disabled').removeClass('active');
            $('.pager a:contains(' + data.page + ')').attr('disabled', 'disabled').addClass('active');

            $('#previewPane .container').empty();
            var content = "";
            $.each(data.photos, function(i, photo) {
                content += window.parseTemplate("<a href='#uid=<#= uid #>&page=<#= page #>'><img src='<#= thumbnail #>' alt='<#= title #>' title='<#= title #>' /></a>", photo);
            });
            $('#previewPane .container').html(content);
        };

        var replacePhoto = function(photo, showLoading) {
            if (showLoading) loading();
            var template = "<h2><#= title #> <# if (large && (large.length > 1)) { #> <a class='magnify' href='<#= large #>'>[view large photo]</a> <# } #></h2>"
                + "<# if (sentBy) { #><p class='sentBy'>Sent by <#= sentBy #></p><# } #>"
                + "<# if (comment) { #><p class='comment'><#= comment #></p><# } #>"
                + "<# if (relatedProducts && (relatedProducts.length > 0)) { #>"
                + "<h3>Related Products</h3><div>"
                + "<a href='<#= relatedProducts[0].url #>'><#= relatedProducts[0].name #></a>"
                + "<# for (var i = 1; i < relatedProducts.length; i++) { #>"
                + " | <a href='<#= relatedProducts[i].url #>'><#= relatedProducts[i].name #></a>"
                + "<# } #></div><# } #>";
            $('#photoDescription').empty();
            $('#photoDescription').html(window.parseTemplate(template, photo));
            var buff = new Image();
            $(buff).load(function() { notLoading(); $('#selectedPhoto img').hide(); $('#selectedPhoto img').attr('src', this.src); $('#selectedPhoto img').fadeIn(); }).attr('src', photo.medium);
        }

        var loadPageRPC = function(p, onSuccess, hideLoadingUI) {
            if (!(hideLoadingUI === true)) loading();
            var callback = onSuccess;
            $.jmsajax({
                type: "POST",
                url: "CustomerPhotos.aspx",
                method: "GetPage",
                data: { page: p },
                success: callback
            });
        };

        var cacheData = function(data) {
            _previewCache[data.page] = data;
            $.each(data.photos, function(i, photo) {
                _photoCache[photo.uid] = photo;
            });
        };

        var checkHash = function() {
            //if (_hash == location.hash) return;

            var params = window.parseQuery(location.hash);
            if ((_page == params['page']) && (_uid == params['uid'])) return;
            //_hash = location.hash;
            //_params = window.parseQuery(_hash);

            if ((params['page']) && (_page != params['page'])) {
                _page = params['page'];
                if (_previewCache[_page]) {
                    replacePreview(_previewCache[_page]);
                } else {
                    loadPageRPC(_page, function(data) {
                        cacheData(data);
                        replacePreview(data);
                    });
                }
            }
            if (params['uid'] && (_uid != params['uid'])) {
                _uid = params['uid'];
                var photo = _photoCache[params['uid']];
                if (photo) {
                    replacePhoto(photo, true);
                } else {
                    loading();
                    $.jmsajax({
                        type: "POST",
                        url: "CustomerPhotos.aspx",
                        method: "GetPhoto",
                        data: { page: _page, uid: _uid },
                        success: function(photo) {
                            _photoCache[photo.uid] = photo;
                            replacePhoto(photo);
                        }
                    });
                }
            }
        };
        checkHash();
        setInterval(checkHash, 250);
        loadPageRPC(_page, cacheData, true); // cache current page
    })();

});