/*  $Id$
 *  
 *  This file is part of the Jamiedia Toolkit.
 *  Copyright 2007/2009, Jamiedia Ltd., http://www.jamiedia.co.uk
 *  
 *  This file may not be used or (re)distributed for any other
 *  purposes than a commercial deployment by Jamiedia of a system
 *  based on the Jamiedia Toolkit. No modifications may be made to
 *  this file by anyone, except for individuals working for Jamiedia Ltd.
 *
 *  File description:
 */

(function($) {
    var overlay;
    var overlayContent;
    var closeHandler;
    
    // Add overlay
    $(document).ready(function() {
        // Create overlay
        overlay = $(
            '<div id="photo-overlay" style="display: none;">'
          + '  <a href="#" class="link-close-popup" title="Close window"><span>Close</span></a>'
          + '  <table class="borders">'
          + '    <tr class="top">'
          + '      <td class="left"></td>'
          + '      <td class="middle"></td>'
          + '      <td class="right"></td>'
          + '    </tr>'
          + '    <tr class="middle">'
          + '      <td class="left"></td>'
          + '      <td class="content">'
          + '      </td>'
          + '      <td class="right"></td>'
          + '    </tr>'
          + '    <tr class="bottom">'
          + '      <td class="left"></td>'
          + '      <td class="middle"></td>'
          + '      <td class="right"></td>'
          + '    </tr>'
          + '  </table>'
          + '</div>');
        
        overlayContent = $('tr.middle td.content', overlay);
        
        closeHandler = function() {
            overlay.fadeOut('fast');
            return false;
        }
		
        $('body').append(overlay);
        $('a.link-close-popup', overlay).click(closeHandler);
    });
    
    $.fn.photoGallery = function(url, galleryID, options) {
        var opts = $.extend({}, $.fn.photoGallery.defaults, options);
		var currentImageID;
		var imageList = [];
        
        // Bind all options 
        var handleOptionsPopup = function(imageID) {
            overlayContent.empty().addClass('loading');
            overlay.show();
            
            var request = url+'/getoptionspopup/'+imageID;
            
            $.get(request, {}, function(data) {
                overlayContent.removeClass('loading').html(data);
                
                // Bind add to basket button again
                $('#button-add-to-basket', overlayContent).click(function() {
                    var options = $('input:checkbox:checked', overlayContent);
                    var optionIDs = [];
                    
                    if (options.size() == 0) {
                        alert('Please select at least one option before continuing.')
                        return false;
                    } else {
                        options.each(function() {
                            optionIDs.push($(this).val());
                        });
                        
                        var request = url+'/addtobasketpopup/'+imageID;
                        
                        overlayContent.empty().addClass('loading');
                        $.post(request, {
                            imageID: imageID,
                            'products[]': optionIDs
                        }, function(data) {
                            overlayContent.removeClass('loading').html(data);
                            
                            $('a.link-close-overlay').click(function() {
                                closeHandler();
                            });                            
                        });
                        
                        return false;
                    }
                });
            });
        }
        
		var nextImageHandler = function(imageID) {
			var nextImageID = null;
			for(var i = 0, l = imageList.length; i < l; i++) {
				if (imageList[i].id == imageID) {
					if (i < l - 1) {
						nextImageID = imageList[i + 1].id;
						break;
					}
				}
			}
			if (nextImageID != null) {
				loadImage(nextImageID);
			}
		};
		
		var previousImageHandler = function(imageID) {
			var prevImageID = null;
			for(var i = 0, l = imageList.length; i < l; i++) {
				if (imageList[i].id == imageID) {
					if (i > 0) {
						prevImageID = imageList[i - 1].id;
						break;
					}
				}
			}
			if (prevImageID != null) {
				loadImage(prevImageID);
			}
		};
		
        // Bind image events. Called after every ajax navigational reload
        var bindImagesEvents = function(el) {
            $('div.image a, a.link-viewimage', el).click(function() {
                var imageID = $(this).parents('li.image:first').attr('id').substring(6);
				loadImage(imageID);
				return false;
            });
            
            $('a.link-addtobasket').click(function() {
                var imageID = $(this).parents('li.image:first').attr('id').substring(6);
                handleOptionsPopup(imageID);
            });
        };

        var loadImage = function(imageID) {
                overlayContent.empty().addClass('loading');
                overlay.show();
                
                var request = url+'/getimagepopup/'+imageID;
                
                $.get(request, {}, function(data) {
                    overlayContent.removeClass('loading').html(data);
                    
                    // Bind add to basket button
                    $('#button-add-to-basket').click(function() {
                        handleOptionsPopup(imageID);
                    });
					
					$('#nextImage', overlay).click(function(e) {
						e.preventDefault();
						nextImageHandler(imageID);
					});
					$('#previousImage', overlay).click(function(e) {
						previousImageHandler(imageID);
					});
                    
                    // Fix transparent PNGs
                    $('tr.top td.left, a.link-close-popup', overlay).ifixpng(); 
                    $('tr.bottom td.left').ifixpng();
                });
                

                //overlayContent.html('ImageID: '+imageID);
                return false;
		};
		
		var loadImageList = function(galleryID) {
			$.getJSON(url + '/getImageListAjax/' + galleryID, {}, function(data) {
				imageList = eval(data);
			});
		};
		
        // Process all selected elements
        return this.each(function() {
            var $this = $(this);
            
            var loader = $(opts.loader);
            var currentPage = 1;
            var pagers = $(opts.pager);
            
            pagers.find('a.page-1').parent().addClass('active');
            
            // Bind pagers
            pagers.each(function() {
                $el = $(this);
                var maxPage = $el.find('a').size() - 2;
                
                // Bind all page buttons
                $('a', $el).click(function() {
                    var page = $(this).attr('class').substring(5);
                    var val = parseInt(page);
                    
                    if (page == 'next') {
                        val = currentPage + 1;
                        if (val > maxPage)
                            val = maxPage;
                    } else if (page == 'previous') {
                        val = currentPage - 1;
                        if (val < 1)
                            val = 1;
                    }
                    
                    // Update display if page has actually changed
                    if (currentPage != val) {
                        currentPage = val;
                        
                        var request = url+'/getimages/'+galleryID+'/'+currentPage;
                        
                        loader.addClass('gallery-ajax-loader-loading');
                        $.get(request, {}, function(data) {
                            $this.html(data);
                            
                            pagers.find('li').removeClass('active');
                            $('a.page-'+currentPage, pagers).parent().addClass('active');
                            
                            if (this.blur)
                                this.blur();
                                
                            loader.removeClass('gallery-ajax-loader-loading');
                            
                            bindImagesEvents($this);
                        });
                    }
                    
                    if (this.blur)
                        this.blur();
                    
                    return false;
                })
            });
            
            bindImagesEvents($this);
			loadImageList(galleryID);
        });
    }
    
    $.fn.photoGallery.defaults= {
        pager: '.pager',
        loader: '.gallery-ajax-loader'
    };
})(jQuery);