//
//  ImageViewerView.js
//  CoverPage
//
//  Created by Richard Anaya on 1/9/2013.
//  Copyright (c) 2014 Evernote. All rights reserved.
//

var ImageViewerView = function(resources){
    this.resources = resources;
    this.currentZoom = 1;
};

ImageViewerView.prototype.showUI = function() {
    $encpJquery(document.body).append('<div class="documentViewerArea"></div>');
    $encpJquery(window).resize(_.bind(this.onWindowResize,this));
    $encpJquery(window).scroll(_.bind(this.onWindowResize,this));
    this.onWindowResize();
};

ImageViewerView.prototype.onWindowResize = function() {
    $encpJquery('.documentViewerArea').css('left',"0px");
    $encpJquery('.documentViewerArea').css('top',0+"px");
    $encpJquery('.documentViewerArea').css('width',window.innerWidth);
    $encpJquery('.documentViewerArea').css('height',window.innerHeight);
    if(this.currentImage){
        this.zoomToFillScreen(.9);
    }
};

ImageViewerView.prototype.zoomIn = function(){
    this.setZoom(this.currentZoom*1.5);
};

ImageViewerView.prototype.zoomOut = function(){
    this.setZoom(this.currentZoom/1.5);
};

ImageViewerView.prototype.zoomToActualSize = function(){
    this.setZoom(1);
};

ImageViewerView.prototype.zoomToFillScreen = function(z){
    if(!z) z = 1;

    if(this.currentImage.naturalWidth<this.currentImage.naturalHeight){
        var zoom = window.innerHeight/this.currentImage.naturalHeight*z;
        if(zoom*this.currentImage.naturalWidth>window.innerWidth){
            zoom = window.innerWidth/this.currentImage.naturalWidth*z;
        }
        this.setZoom(zoom);
    }
    else {
        var zoom = window.innerWidth/this.currentImage.naturalWidth*z;
        if(zoom*this.currentImage.naturalHeight>window.innerHeight){
            zoom = window.innerHeight/this.currentImage.naturalHeight*z;
        }
        this.setZoom(zoom);
    }
};

ImageViewerView.prototype.setZoom = function(zoom){
    zoom = Math.min(3,Math.max(.05,zoom));
    this.currentZoom = zoom;
    var newWidth = this.currentImage.naturalWidth*zoom;
    var newHeight =this.currentImage.naturalHeight*zoom;
    $encpJquery('.documentViewerAreaImage').width(newWidth);
    $encpJquery('.documentViewerAreaImage').height(newHeight);
    $encpJquery('.documentViewerAreaImage').css("left",(window.innerWidth-newWidth)/2);
    $encpJquery('.documentViewerAreaImage').css("top",0+(window.innerHeight-newHeight)/2);
};

ImageViewerView.prototype.setViewingImage = function(img) {
    $encpJquery('.documentViewerAreaImage').remove();
    this.currentImage = img;
    $encpJquery(document.body).append('<img class="documentViewerAreaImage crispImage" draggable="false" src="'+img.src+'"></img>');
    if(img.width*3 > window.innerWidth-20 || img.height*3 > window.innerHeight-20){
        this.zoomToFillScreen((window.innerHeight-20)/window.innerHeight);
    }
    else {
        this.setZoom(3);
    }
    /*if(img.naturalWidth>window.innerWidth||img.naturalHeight>window.innerHeight){
        this.zoomToFillScreen();
    }
    else {
        this.zoomToActualSize();
    }*/
};

ImageViewerView.prototype.removeUI = function() {
    $encpJquery('.documentViewerAreaImage').remove();
    $encpJquery('.documentViewerArea').remove();
};

ImageViewerView.prototype.destroy = function() {
    this.removeUI();
};