$(document).ready(
function()
{
 //showdetailimage();
 // showdetail_zoom('image/test_active_with_objects.GIF');
}
);
$("#fullcontent").css("height", document.body.clientHeight > document.documentElement.clientHeight ? document.body.clientHeight : document.documentElement.clientHeight);
var imageheight = $("#zoom_detail_image").height() + 20;;
var imagewidth = 581;
document.write("<style>* html{background-image: url(image.jpg);}#zoom_detail_image,.zoom_detail_image{position:fixed;_position:absolute;top:" + (document.documentElement.clientHeight - imageheight) / 2 + "px;_top:expression(" + (document.documentElement.clientHeight - imageheight) / 2 + "+((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px');_top:expression(" + (document.documentElement.clientHeight - imageheight) / 2 + "+((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px');left:" + (document.documentElement.clientWidth - imagewidth) / 2 + "px; _left:expression(" + (document.documentElement.clientWidth - imagewidth) / 2 + "+((e=document.documentElement.scrollLeft)?e:document.body.scrollLeft)+'px');_left:expression(" + (document.documentElement.clientWidth - imagewidth) / 2 + "+((e=document.documentElement.scrollLeft)?e:document.body.scrollLeft)+'px');}</style>");
function showdetailimage()
{
  $("#fullcontent").show();
  $("#zoom_detail_image").show();
}
function closedetailimage()
{
   $("#fullcontent").hide();
   $("#zoom_detail_image").hide();
}
function showdetail_zoom(srcs)
{
 showdetailimage();
 $("#viewer1").find("img").remove();
 $("#viewer1").iviewer({
                    src: srcs,
                    onClick: function(coords) {
                        var object = whereIam(coords.x, coords.y);                        
                        if (object) 
                            alert('Clicked at ('+coords.x+', '+coords.y+'). This is '+object.title);
                    },

                    onMouseMove: function(coords) {
                        var object = whereIam(coords.x, coords.y);                        
                        if (object) {
                            $('#status').html('You are in ('+coords.x.toFixed(1)+', '+coords.y.toFixed(1)+'). This is '+object.title);
                            this.container.css('cursor', 'crosshair');
                        } else {
                            $('#status').html('You are in ('+coords.x.toFixed(1)+', '+coords.y.toFixed(1)+'). This is empty space');
                            this.container.css('cursor', null);
                        }                            
                    },
                    
                    onBeforeDrag: function(coords) {
                        // remove pointer if image is getting moving
                        // because it's not actual anymore
                        $('#pointer').css('display', 'none');
                        // forbid dragging when cursor is whithin the object
                        return whereIam(coords.x, coords.y) ? false : true;     
                    },
                    
                    onZoom: function() {
                        // remove pointer if image is resizing
                        // because it's not actual anymore
                        $('#pointer').css('display', 'none');
                    },
                    
                    initCallback: function() {
                        this.container.context.iviewer = this;
                    }
                });
}