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

var BackButtonView = function(resources){
    this.resources = resources;
    this.clicked = new Signal();
    this.isVisible = false;
};

BackButtonView.prototype.showUI = function(){
    $encpJquery(document.body).append('<div class="presentationBackButton"></div>');
    $encpJquery(document.body).append('<div class="presentationBackTooltip" style="display: none;"><span class="presentationBackTooltipDescription"></span><span class="presentationBackTooltipKeyShortcut">'+this.resources.PresentBackCmd+'</span></div>');
    $encpJquery('.presentationBackButton').hide();
    $encpJquery('.presentationBackTooltip').hide();
    $encpJquery('.presentationBackTooltipDescription').html("Prev note title");
    $encpJquery('.presentationBackTooltip').get(0).onselectstart = function () { return false; }
    $encpJquery('.presentationBackButton').click(_.bind(this.onBackButtonClicked,this));
    this.previousTitleVisible = false;
    $encpJquery(document).on('mousemove.presentationmode',_.bind(this.onMouseMove,this));
    this.clicked = new Signal();
    this.showCursorRequested = new Signal();
    this.hideCursorRequested = new Signal();
    this.wasHidden = false;

    var _this = this;
    $encpJquery('.presentationBackButton').hover(function(){
        _this.hideCursorRequested.dispatch();
    }, function(){
        _this.showCursorRequested.dispatch();
    })

    $encpJquery(document).on('keydown.presentationmode',function(e){
        if(!_this.isEnabled) return;
        if(e.keyCode == 219 && e.ctrlKey){
            _this.onPreviousNoteButtonClicked();
        }
    });
};

BackButtonView.prototype.setTitle = function(title){
    $encpJquery('.presentationBackTooltip').html('<span class="presentationBackTooltipKeyShortcut">Ctrl+[</span>'+title);
};

BackButtonView.prototype.onPreviousNoteButtonClicked = function(){
    this.clicked.dispatch();
};
BackButtonView.prototype.onMouseMove = function(event){
    if(this.lastX == event.clientX && this.lastY == event.clientY){ return; }
    this.lastX = event.clientX;
    this.lastY = event.clientY;
    if(!this.isEnabled) { return; }
    var x = event.clientX;
    var y = event.clientY;
    var windowWidth = window.innerWidth;
    var windowHeight = window.innerHeight;
    var windowTop = 0;

    var buttonWidth = 40;
    var buttonHeight = 100;
    var textHeight = 42;

    var innerHitBoxWidth = 350;
    var innerHitBoxHeight = 120;


    var fadeTime = 1000/6.0;
    var textFadeTime = 1/3;
    var textMoveTime = 1/2;

   	var isInOuter = x<innerHitBoxWidth && y < innerHitBoxHeight;
   	var isInInner = x>=20&&x<60&&y>=20&&y<60;

    if(this.overrideWithin || isInOuter){
        $encpJquery('.presentationBackButton').fadeIn(fadeTime);
        if(isInInner){
            if(this.previousTitleVisible == false){
                $encpJquery('.presehntationBackTooltip').opacity(0);
                $encpJquery('.presentationBackTooltip').show();
                $encpJquery('.presentationBackTooltip').tween({
                    alpha:{
                        start: 0,
                        stop: 100,
                        time: 0,
                        duration: textFadeTime,
                        units: 'px',
                        effect: 'easeOut'
                    }
                }).play();
            }
            this.previousTitleVisible = true;
        }
        else {
            if(this.previousTitleVisible){
                $encpJquery('.presentationBackTooltip').tween({
                    alpha:{
                        start: 100,
                        stop: 0,
                        time: 0,
                        duration: textFadeTime,
                        units: 'px',
                        effect: 'easeOut'
                    }
                }).play();
            }
            this.previousTitleVisible = false;
        }

        $encpJquery('.presentationBackButton').addClass('hover')
    }
    else {
        this.fadeOut();
    }
};

BackButtonView.prototype.fadeOut = function(){
    var fadeTime = 1000/6.0;
    var textFadeTime = 1/3;
    $encpJquery('.presentationBackButton').fadeOut(fadeTime);
    $encpJquery('.presentationBackButton').removeClass('hover');
    if(this.previousTitleVisible)              {
        $encpJquery('.presentationBackTooltip').tween({
            alpha:{
                start: 100,
                stop: 0,
                time: 0,
                duration: textFadeTime,
                units: 'px',
                effect: 'easeOut'
            }
        }).play();
        this.previousTitleVisible = false;
    }
}

BackButtonView.prototype.onBackButtonClicked = function(){
    Analytics.reportEvent('presentation_mode', 'navigation', 'back_button');
    this.clicked.dispatch();
};

BackButtonView.prototype.show = function(){
    this.isVisible = true
};

BackButtonView.prototype.hide = function(immediate){
	if(immediate){
	    $encpJquery('.presentationBackButton').fadeOut(0);
	    $encpJquery('.presentationBackButton').removeClass('hover');
	    $encpJquery('.presentationBackTooltip').fadeOut(0);
	}
    if(!this.isVisible){
        return;
    }
    var textFadeTime = 1/3;
    this.isVisible = false

    var fadeTime = 1000/6.0;
    $encpJquery('.presentationBackButton').fadeOut(fadeTime);
    $encpJquery('.presentationBackButton').removeClass('hover');
    $encpJquery('.presentationBackTooltip').tween({
            alpha:{
                start: 100,
                stop: 0,
                time: 0,
                duration: textFadeTime,
                units: 'px',
                effect: 'easeOut'
            }
        }).play();
    this.previousTitleVisible = false;
};

BackButtonView.prototype.destroy = function(){
    $encpJquery(document).off('mousemove.presentationmode');
    $encpJquery(document).off('keydown.presentationmode');
    $encpJquery('.presentationBackButton').remove();
    $encpJquery('.presentationBackTooltip').remove();
    this.isEnabled = false;
};

BackButtonView.prototype.showABit = function(time){
	if(!time){time = 4000;}
	this.overrideWithin = true;
	var _this = this;
    this.onMouseMove({clientX:window.innerWidth/2,clientY:window.innerHeight/2});	
	window.setTimeout(function(){
		_this.overrideWithin = false;
		_this.hide();
	},time);
};