$(window).ready(function () {
    //From ThumbImage to OriginalImage (ex.  ././slika.jpg => ././full_slika.jpg
    function ToFullImage(thumb_path) {
        var x = thumb_path.lastIndexOf("/");
        return (thumb_path.substring(0, x + 1) + "full_" + thumb_path.substring(x + 1));
    }


    //IMAGE ROLLOVER PREVIEW
    $("img.image_preview").mouseenter(function (event) {
        var divImgHolder = document.getElementById("divImgHolder");
        var imgFloat = document.getElementById("imgFloat");
        var thisObj = this;
        var img_path = ToFullImage($(thisObj).attr("src"));

        if (divImgHolder == null && imgFloat == null) {
            //Kreiraj img holder kako DIV tag
            divImgHolder = document.createElement("div");
            divImgHolder.setAttribute("id", "divImgHolder"); divImgHolder.setAttribute("name", "divImgHolder");
            divImgHolder.className = "img_previewClass"; divImgHolder.style.cursor = "move"; divImgHolder.style.minWidth = "400px"; divImgHolder.style.minHeight = "200px";
            divImgHolder.style.maxWidth = "400px"; divImgHolder.style.maxHeight = "400px"; divImgHolder.style.display = "none";

            //Kreiraj ja slikata
            imgFloat = document.createElement("img");
            imgFloat.setAttribute("id", "imgFloat"); imgFloat.setAttribute("name", "imgFloat");
            imgFloat.style.maxWidth = "400px"; imgFloat.style.maxHeight = "400px";

            //Dodadi gi na dokumentot
            divImgHolder.appendChild(imgFloat);
            document.body.appendChild(divImgHolder);
        }
        $("#divImgHolder").css({ position: "absolute", top: event.pageY + 30, left: event.pageX - 200 });

        //show HOLDER
        $("#imgFloat").hide();
        $("#divImgHolder").fadeIn(300);

        $("#imgFloat").hide() //Hide it
        .one('load', function () { //Set something to run when it finishes loading
            $(this).fadeIn(); //Fade it in when loaded
        })
        .attr("src", img_path) //Set the source so it begins fetching
        .each(function () {
            //Cache fix for browsers that don't trigger .load()
            if (this.complete) $(this).trigger('load');
        });
    });

    $("img.image_preview").mouseout(function (event) {
        $("#divImgHolder").stop(true, true).fadeIn();    //.stop( [ clearQueue ], [ jumpToEnd ] )
        $("#imgFloat").stop(true, true).fadeIn();

        $("#divImgHolder").hide();
        $("#imgFloat").hide();
    });


    $("img.image_preview").mousemove(function (event) {
        $("#divImgHolder").css({ top: event.pageY + 30, left: event.pageX - 200 });
    });
});