﻿var CNT_MAX_FACTOR = 3.0;
var CNT_LONG_STEP = 0.50;
var CNT_SHORT_STEP = 0.10;




function showZoom(owner, src, text)
{
    loadZoom(owner.id, src, 0, text);
    return false;
}



function loadZoom(ownerId, src, t, text)
{
    var img = dynapi.ximages[src];
    
    if(!img)
    {
        img  = dynapi.functions.getImage(src);
        createZoomDialog(img, text);
    }
    else if(img.complete)
    {   
        img.zoom.imageCompleted();
        return;        
    }
    
    if(t < 600)
    {
        setTimeout('loadZoom("'+ownerId+'","'+src+'",'+(t+1)+',"'+text+'")', 100);
    }
}

function createZoomDialog(img, text)
{
        
    var docw = dynapi.document.getWidth();
    var doch = 900;
    
    
    var lh = parseInt(CNT_DEF * 0.5);
    var lw = parseInt(CNT_DEF * 0.5);    
    
    
    var dlgw = lw + 2 * CNT_PADDING;
    var dlgh = lh + CNT_PADDING + CNT_PADDING;
    
    var l =  parseInt((docw-dlgw)/2);
    
    var owner = dynapi.functions.getElementById(owner);
    
    //var t = (owner && owner.offsetTop)?owner.offsetTop: ((doch-dlgh)/2);
    var t = parseInt((doch-dlgh)/2);
    
    var dlg = new DynLayer(null, l, t, dlgw, dlgh, CNT_BACKGROUND );
    
    img.zoom = dlg;
    
    dynapi.document.addChild(dlg);        
    
    dlg.setZIndex({topmost:true});        
    dlg.newFactor = 1.0;
    dlg.thisFactor = 1.0;
    dlg.newDir = null;
    dlg.image = img;
    
    
    var caption = dlg.addChild(new DynLayer(null,0,0,dlgw,CNT_PADDING), 'caption');
    caption.setAutoSize(true, true);
    caption.setAnchor({left:0,top:0,right:0});
    
    var textLyr = caption.addChild(new DynLayer('<span class="zoom_caption">'+text+'</span>'),'text');
    textLyr.setAnchor({top:0,left:0});
    
    var closeImg = dynapi.functions.getImage(zoomCloseIcon,null,null,{onclick:function(){DynObject.all[dlg.id].setVisible(false);}});
    var closeBtn = caption.addChild(new DynLayer(closeImg.getHTML(),0,0,16,16),'closeBtn');
    closeBtn.setAnchor({top:0,right:0});   
    
    var imgLayerContainer = dlg.addChild(new DynLayer(null,0,0,0,0,'#000000'),'imageLayer');
    imgLayerContainer.setAnchor({top:CNT_CAPTION_HEIGHT,right:CNT_PADDING,bottom:CNT_PADDING,left:CNT_PADDING});
    
    var loadingIcon = dynapi.functions.getImage(zoomLoaderIcon);
    var loadingHTML = '<div class="zoom_loading"><div>'+loadingIcon.getHTML()+'</div><div>'+zoomLoadingText+'</div></div>';
    var loading = imgLayerContainer.addChild(new DynLayer(loadingHTML),'loading');
    loading.setX(parseInt((imgLayerContainer.w - loading.w)/2));  
    loading.setY(parseInt((imgLayerContainer.h - loading.h)/2));
    
    DragEvent.enableDragEvents(dlg);
    
    dlg.addEventListener({
        ondragstart:function(e) {
            var dlg = e.getSource();
            var h = dlg.caption.h;
            if(e.getY() > h) 
                e.cancelDrag();
            else
                dlg.setCursor('move');          
        },       
        ondragend:function(e){
            e.getSource().setCursor('default');          
        }
    });
    
    dlg.imageCompleted = _imageCompleted;
    
    
    //Initialize
    new FloatLayer(dlg.id,l,t,7,function(){
        dlg.x = parseInt(dlg.elm.offsetLeft);
        dlg.y = parseInt(dlg.elm.offsetTop);
        
    }); 
    
    alignFloatLayers();
}

function _imageCompleted()
{
    if(this.completed)
    {
        if(!this.getVisible()) 
        {   
            this.setVisible(true);
        }
        
        this.setZIndex({topmost:true});
    
        alignFloatLayers();
        
        return;
    }

    var img = this.image;
    
    var lh = img.height;
    var lw = img.width;
    
    if(img.width > img.height)
    {
        if(img.width > CNT_DEF)
        {
            lh = parseInt((img.height * CNT_DEF) / img.width);
            lw = CNT_DEF;
        }            
    }
    else
    {
        if(img.height > CNT_DEF)
        {
            lw = parseInt((img.width * CNT_DEF) / img.height);
            lh = CNT_DEF;
        }
    }
    
    var dlgw = lw + 2 * CNT_PADDING;
    var dlgh = lh + CNT_CAPTION_HEIGHT + CNT_PADDING;
    
    this.setSize(dlgw, dlgh); 
    var floatLayer = FloatLayersByName[this.id];
    floatLayer.ifloatX = parseInt((dynapi.document.getWidth()-dlgw)/2);
    floatLayer.ifloatY = parseInt((screen.availHeight-dlgh)/2);
    
    
    this.imageLayer._destroyAllChildren();
    
    //alert('IMG.W:'+img.width+',IMG.H:'+img.height+',lw:'+lw+',lh:'+lh+',CNT_DEF:'+CNT_DEF+',imageLayer.w:'+this.imageLayer.width+',imageLayer.h'+this.imageLayer.height);
    
    this.imageLayer.addChild(new DynLayer('<img src="'+this.image.src+'" width="100%" height="100%" border="0"/>',0,0,lw,lh),'image');
    
    
    DragEvent.enableDragEvents(this.imageLayer.image);
    DragEvent.setDragBoundary(this.imageLayer.image, 0, lw, lh, 0);  
    this.imageLayer.image.addEventListener({
        onmouseover:function(e) {
            e.getSource().setCursor('move');          
        },       
        onmouseout:function(e){
            e.getSource().setCursor('default');          
        }
    });
      
    var comboBox =  '<div style="padding-top:'+CNT_PADDING+'px;padding-right:'+CNT_PADDING+'px">'+
                    '<select onchange="DynObject.all[\''+this.id+'\'].zoomFactor(true,this.options[this.selectedIndex].value)">'+
                    '<option value="1" selected>100%</option>'+
                    '<option value="1.5">150%</option>'+
                    '<option value="2">200%</option>'+
                    '<option value="2.9">300%</option>'+
                    '</select></div>';
                    
    var zoomLayer = this.addChild(new DynLayer(comboBox,0,0,0,0,CNT_BACKGROUND),'zoomLayer');    
    zoomLayer.setAutoSize(true,true);
    zoomLayer.setAnchor({bottom:CNT_PADDING,left:CNT_PADDING});
       
    this.zoom = _zoom;
    
    this.update = _update;
    
    this.quickZoom = _quickZoom;
    
    this.zoomIn = _zoomIn;
    
    this.zoomOut = _zoomOut;
    
    this.zoomDef = _zoomDef;
    
    this.zoomFactor = _zoomFactor;
    
    this.completed = true;
    
    alignFloatLayers();
}


function _zoom(){
    if (this.newDir == 'zoom_in' && this.thisFactor< this.newFactor) {
        this.thisFactor += CNT_SHORT_STEP;
        oldw = this.imageLayer.image.w;
        oldh = this.imageLayer.image.h;
        nw = this.imageLayer.w * this.thisFactor;
        nh = this.imageLayer.h * this.thisFactor;
        nx = this.imageLayer.image.x - ((nw-oldw)/2);
        ny = this.imageLayer.image.y - ((nh-oldh)/2);
        this.update(nx, ny, nw, nh);
        setTimeout('DynObject.all["'+this.id+'"].zoom()', 2);    
       
    }
    else if (this.newDir == 'zoom_out' && this.thisFactor>this.newFactor) {        
        this.thisFactor -= CNT_SHORT_STEP;
        if (this.thisFactor<1) this.thisFactor = 1;
        oldw = this.imageLayer.image.w;
        oldh = this.imageLayer.image.h;
        nw = this.imageLayer.w * this.thisFactor;
        nh = this.imageLayer.h * this.thisFactor;
        nx = this.imageLayer.image.x + ((oldw-nw)/2);
        ny = this.imageLayer.image.y + ((oldh-nh)/2);
        this.update(nx, ny,nw, nh);	    
        setTimeout('DynObject.all["'+this.id+'"].zoom()', 2); 
       	    
    }
    
}

function _update(nX, nY, nW, nH){
    
    r = nW;
    b = nH;
    l = this.imageLayer.w - nW;
    t = this.imageLayer.h - nH;
    DragEvent.setDragBoundary(this.imageLayer.image,Math.round(t),Math.round(r),Math.round(b),Math.round(l));      
    var w=this.imageLayer.image.w;
    var h=this.imageLayer.image.h;
    var x = nX;
    var y = nY;
    if (x<l) x=l;
    else if (x+w>r) x=r-w;
    if (y<t) y=t;
    else if (y+h>b) y=b-h;	    
    this.imageLayer.image.setLocation(x,y);
    this.imageLayer.image.setSize(nW,nH);
}

function _quickZoom(){
    
    if (this.newDir == 'zoom_in' && this.thisFactor<this.newFactor) {
        this.thisFactor = this.newFactor;
        oldw = this.imageLayer.image.w;
        oldh = this.imageLayer.image.h;
        nw = this.imageLayer.w * this.thisFactor;
        nh = this.imageLayer.h * this.thisFactor;
        nx = this.imageLayer.image.x - ((nw-oldw)/2);
        ny = this.imageLayer.image.y - ((nh-oldh)/2);
        this.update(nx,ny,nw, nh);
    }
    else if (this.newDir == 'zoom_out' && this.thisFactor>this.newFactor) {
        this.thisFactor = this.newFactor;
        if (this.thisFactor<1) this.thisFactor = 1;
        oldw = this.imageLayer.image.w;
        oldh = this.imageLayer.image.h;
        nw = this.imageLayer.w * this.thisFactor;
        nh = this.imageLayer.h * this.thisFactor;
        nx = this.imageLayer.image.x + ((oldw-nw)/2);
        ny = this.imageLayer.image.y + ((oldh-nh)/2);
        this.update(nx,ny,nw, nh);
    }
}

function _zoomIn(anim, factor) {    
    if(factor){
        this.newFactor = factor;
    }else{
        this.newFactor += CNT_LONG_STEP;
    }        
    if (this.newFactor < CNT_MAX_FACTOR) {
        this.newDir = 'zoom_in';
        if (anim) this.zoom();
        else this.quickZoom();
    }
}

function _zoomOut(anim, factor) {    
    if(factor){
        this.newFactor = factor;
    }else{
        this.newFactor -= CNT_LONG_STEP;
    }        
    if (this.newFactor>1) {        	    
        this.newDir = 'zoom_out';
        
        if (anim)	this.zoom();
        else this.quickZoom();
    }
}

function _zoomDef(anim) {
    if (this.newFactor!=1) {
        this.newFactor = 1;
        this.newDir = 'zoom_out';
        if (anim)	this.zoom();
        else this.quickZoom();
        this.imageLayer.image.setLocation(0,0);
    }
}

function _zoomFactor(anim, factor){
    if(factor == 1.0){
        this.zoomDef(false);
    }else if(factor > this.newFactor){
        this.zoomIn(anim, factor);
    }else if(factor < this.newFactor){
        this.zoomOut(anim, factor);
    }
}

dynapi.onLoad(function()
{
    dynapi.functions.getImage(zoomLoaderIcon);
    dynapi.functions.getImage(zoomCloseIcon);
});
