////////////////////////////////////////////////////////////////////////////////
///                     DSImageViewer (DSImageViewer.js)                     ///
///                             Version: 1.0.4                               ///
///                               23.02.2011                                 ///
///                Copyright © 2007-2011 by Daniel Seichter                  ///                          
///                                                                          ///
///--------------------------------------------------------------------------///
///                                                                          ///
/// -> License/Lizenz <-                                                     ///
///                                                                          ///
/// You can modify and use this script in your own homepages/scripts for     ///
/// free, but if you use it or only parts of it, you have to add the name    ///
/// and the author of the following script in your homepages/scripts.        ///
///                                                                          ///
/// Sie dürfen dieses Script nach belieben modifizieren und benutzten,       ///
/// unter der Bedienung, dass eine Erwähnung des Scriptes inkl. Autor        ///
/// innerhalb des Programms erfolgt, wenn das Script in irgendeiner          ///
/// Art und Weise benutzt wird.                                              ///
///                                                                          ///
///--------------------------------------------------------------------------///
///                                                                          ///
/// -> ChangeLog <-                                                          ///
///                                                                          ///
///  02.02.2011: First Release (Version 1)                                   ///
///  03.02.2011: Add CloseButton                                             ///
///  04.02.2011: Add Support for grouped Images                              ///
///  05.02.2011: ADD "cangeImage"                                            ///
///  07.02.2011: new open effect                                             ///
///  23.02.2011: fix bug on close while loading                              ///
///                                                                          ///
////////////////////////////////////////////////////////////////////////////////

$(document).ready(function() {
    ImageViewer = new DSImageViewer();
});

/*******************************************************************************
* Configuration
*/
    var fileLoadingImage = "../inc/images/loading.gif";	
    var fileCloseImage = "../inc/images/close.png";	
    var fileNextImage = "../inc/images/next.png";
    var filePrevImage = "../inc/images/prev.png";
    var referencedObject = null;
    var referencedGroup = null;	
    var currentGroupIndex = 0;	
    var currentGroupCount = 0;
    
/*******************************************************************************
* class DSImageViewer
* @access public
*/
    function DSImageViewer() {  
        this._group = null;                        
        $('a[rel~="DSImageViewer"]').click(function () {       
            if ($(this).attr("rel") == "DSImageViewer") { 
                ImageViewer.open($(this));
            } else {
                ImageViewer.open($(this),String($(this).attr("rel")).split(" ")[1]);
            }    
            return false;
        });               
    }
    /***************************************************************************
    * Open 
    * @access public 
    */
        DSImageViewer.prototype.open = function(reference,group) {
            referencedObject = reference;
            //alert("referencedObject: " + referencedObject.offset().left + " " + referencedObject.offset().top);
            referencedGroup = group;
            if (referencedGroup) {
                currentGroupCount = $('a[rel="DSImageViewer '+ referencedGroup +'"]').length;
                $('a[rel="DSImageViewer '+ referencedGroup +'"]').each(function (index) {
                    if ($(this).get(0) == referencedObject.get(0))
                        currentGroupIndex = index;
                });
            }    
            $("<div>", {id: "DSIM_OverlayWindow"}).appendTo("body");
            $("#DSIM_OverlayWindow").click(function () {
                ImageViewer.close();
            });
            $("<div>", {id: "DSIM_Pixel"}).appendTo("body"); 
            //alert("pixel: " + $("#DSIM_Pixel").offset().left + " " + $("#DSIM_Pixel").offset().top);
            $("<div>", {id: "DSIM_Window"}).appendTo("#DSIM_Pixel"); 
            $("<div>", {id: "DSIM_Pixel2"}).appendTo("body");
            $("<div>", {id: "DSIM_NavControls"}).appendTo("body"); 
            $("<img>", {
                src: fileLoadingImage,
                id: "DSIM_LoadingImage"
            }).appendTo("#DSIM_Pixel2"); 
            
            var offsetPixel = $("#DSIM_Pixel").offset();
            var offsetReferencedObject = referencedObject.children(":first-child").offset();
           
            $("#DSIM_Window").css({
                left: offsetReferencedObject.left-offsetPixel.left+"px",
                top: offsetReferencedObject.top-offsetPixel.top+"px",
                height: referencedObject.children(":first-child").css("height"),
                width: referencedObject.children(":first-child").css("width"),
                opacity: 0,
                display: "block"
            });
            $("#DSIM_OverlayWindow").fadeTo("slow",0.7, function () {
            $("#DSIM_Window").animate({
                    opacity: 1,
                    top: "-75px",
                    left: "-100px",
                    width: "200px",
                    height: "150px"                                     
                }, "slow", function (){
                    $("#DSIM_LoadingImage").fadeIn("fast");
                    var preloadedImage = new Image();
                    preloadedImage.onload = function() {    
                        ImageViewer.show(this.width,this.height);
                    };  
                    preloadedImage.src = referencedObject.attr("href");   
                    $("<img>", {
                        id: "DSIM_Image",
                        src: referencedObject.attr("href")
                    }).appendTo("#DSIM_Window");
                });    
            });
        }   
        DSImageViewer.prototype.show = function(imageWidth, imageHeight) {           
            $("#DSIM_LoadingImage").animate({"top": "-35px"}, { duration: 1500, queue: false });
            $("#DSIM_Window").animate({
                width: (imageWidth+60)+"px",
                left: (imageWidth+60)/-2+"px",
                height: (imageHeight+120)+"px",
                top: (imageHeight+120)/-2+"px"
            }, 1500, function (){
                $("<div>", {
                    id: "DSIM_Text",
                    style: "width: "+imageWidth+"px"
                }).appendTo("#DSIM_Window");
                $("#DSIM_Text").html("<h1>"+referencedObject.attr("name")+"</h1><p>"+referencedObject.attr("title")+"</p>");
                $("#DSIM_LoadingImage").fadeOut("fast", function () {
                    $("#DSIM_Image").fadeIn("fast", function () {
                        $("#DSIM_Text").fadeIn("fast");
                        $("<img>", {
                            id: "DSIM_CloseImage",
                            src: fileCloseImage,
                            style: "left: "+((imageWidth+60)/2-14)+"px; top: -"+((imageHeight+120)/2+10)+"px;"                        
                        }).appendTo("#DSIM_NavControls");
                        $("#DSIM_CloseImage").click(function (){
                            ImageViewer.close();
                        }); 
                        if (referencedGroup) {
                            $("<img>", {
                                id: "DSIM_NextImage",
                                src: fileNextImage,
                                style: "left: "+((imageWidth+60)/2-18)+"px; top: -35px;"
                            }).appendTo("#DSIM_NavControls");
                            $("#DSIM_NextImage").click(function () {
                                currentGroupIndex = ((currentGroupIndex+1) < currentGroupCount) ? currentGroupIndex+1 : 0;
                                referencedObject = $('a[rel="DSImageViewer '+ referencedGroup +'"]').filter(":eq("+currentGroupIndex+")");
                                ImageViewer.changeImage();
                            });                             
                            $("<img>", {
                                id: "DSIM_PrevImage",
                                src: filePrevImage,
                                style: "left: "+((imageWidth+60)/-2+9)+"px; top: -35px;"
                            }).appendTo("#DSIM_NavControls");
                            $("#DSIM_PrevImage").click(function (){
                                currentGroupIndex = ((currentGroupIndex-1) < 0) ? currentGroupCount-1 : currentGroupIndex-1;
                                referencedObject = $('a[rel="DSImageViewer '+ referencedGroup +'"]').filter(":eq("+currentGroupIndex+")");
                                ImageViewer.changeImage();
                            });                                                                                
                        }
                        $("#DSIM_NavControls").fadeIn("fast"); 
                    });
                });
            } );  
        }           
        DSImageViewer.prototype.changeImage = function() { 
            $("#DSIM_Image").fadeOut("slow");
            $("#DSIM_Text").fadeOut("slow");
            $("#DSIM_NavControls").fadeOut("slow", function () {
                $("#DSIM_LoadingImage").fadeIn("fast", function () {
                    $("#DSIM_Image").remove();
                    $("#DSIM_Text").remove();
                    $("#DSIM_NavControls").remove();
                    $("<div>", {id: "DSIM_NavControls"}).appendTo("body");
                    var preloadedImage = new Image();
                    preloadedImage.onload = function() {    
                        ImageViewer.show(this.width,this.height);
                    };  
                    preloadedImage.src = referencedObject.attr("href");   
                    $("<img>", {
                        id: "DSIM_Image",
                        src: referencedObject.attr("href")
                    }).appendTo("#DSIM_Window");                      
                });                
            });         
        }      
        DSImageViewer.prototype.close = function() {
            $("#DSIM_NavControls").fadeOut("fast");
            $("#DSIM_Pixel2").fadeOut("fast");
            $("#DSIM_Pixel").fadeOut("slow", function () {
                $("#DSIM_OverlayWindow").fadeOut("slow", function (){
                    $("#DSIM_OverlayWindow").remove();
                    $("#DSIM_Pixel").remove();
                    $("#DSIM_Pixel2").remove();
                    $("#DSIM_NavControls").remove();
                });
            });
        }        
////////////////////////////////////////////////////////////////////////////////
///                     DSImageViewer (DSImageViewer.js)                     ///
///                Copyright © 2007-2011 by Daniel Seichter                  ///                        
////////////////////////////////////////////////////////////////////////////////