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

var ToolbarView = function(resources){
    this.resources = resources;
    this.enabled = true;
};

ToolbarView.prototype.showUI = function() {
    $encpJquery(document.body).append('<div class="presentationToolbar"><div class="presentationExitButton"></div><div class="presentationLaserButton"></div><div class="presentationMonitorButton"></div><div class="presentationThemeButton"></div></div>');
    $encpJquery('.presentationToolbar').hide();
    $encpJquery(document).on('mousemove.presentationmode',_.bind(this.onMouseMove,this));
    $encpJquery('.presentationThemeButton').click(_.bind(this.onThemeButtonClicked,this));
    $encpJquery('.presentationMonitorButton').click(_.bind(this.onMonitorButtonClicked,this));
    $encpJquery('.presentationLaserButton').click(_.bind(this.onLaserButtonClicked,this));
    $encpJquery('.presentationExitButton').click(_.bind(this.onExitButtonClicked,this));
    this.isLaserToolbarShow = false;

    $encpJquery(document.body).append('<div class="presentationLaserToolbar"><div class="presentationBlueLaserButton"></div><div class="presentationYellowLaserButton"></div><div class="presentationRedLaserButton"></div><div class="presentationDefaultLaserButton"></div></div>');
    $encpJquery(".presentationLaserToolbar").hide();

    this.cursorChangeRequested = new Signal();
    this.exitRequested = new Signal();
    this.changeThemeRequested = new Signal();
    this.changeMonitorRequested = new Signal();
    this.showCursorRequested = new Signal();
    this.hideCursorRequested = new Signal();
    var _this = this;
    $encpJquery('.presentationBlueLaserButton').click(function(e){_this.onCursorChangeClick("blue",e);});
    $encpJquery('.presentationYellowLaserButton').click(function(e){_this.onCursorChangeClick("yellow",e);});
    $encpJquery('.presentationRedLaserButton').click(function(e){_this.onCursorChangeClick("red",e);});
    $encpJquery('.presentationDefaultLaserButton').click(_.bind(this.onCursorChangeClick,this,"default"));

    $encpJquery(document).on('keydown.presentation',function(e){
        if(!_this.enabled) return;
        if(e.keyCode == 27){
            _this.onExitButtonClicked(e);
        }
        else if(e.keyCode == 80 && e.ctrlKey){
            _this.forceVisible = true;
            window.setTimeout(function(){
                _this.forceVisible = false;
            },3000);
            _this.onLaserButtonClicked();
            _this.onMouseMove({cursorX:0,cursorY:0});
            e.preventDefault();
        }
        else if(e.keyCode == 78 && e.ctrlKey){
            _this.onThemeButtonClicked(e,true);
            e.preventDefault();
        }
        else if(e.keyCode == 83 && e.ctrlKey){
            _this.onMonitorButtonClicked(e);
            e.preventDefault();
        }
        else if(e.keyCode == 49 && e.ctrlKey){
            _this.onCursorChangeClick("blue");
            e.preventDefault();
        }
        else if(e.keyCode == 50 && e.ctrlKey){
            _this.onCursorChangeClick("yellow");
            e.preventDefault();
        }
        else if(e.keyCode == 51 && e.ctrlKey){
            _this.onCursorChangeClick("red");
            e.preventDefault();
        }
        else if(e.keyCode == 52 && e.ctrlKey){
            _this.onCursorChangeClick("default");
            e.preventDefault();
        }
    });

    this.nightModeTooltip = this.resources.PresentTooltipActivateNightMode;
    var _this = this;
    $encpJquery('.presentationExitButton').hover(_.bind(this.showToolTip,this,this.resources.PresentTooltipExitPresMode,this.resources.PresentTooltipExitPresModeCmd), _.bind(this.hideToolTip,this));
    $encpJquery('.presentationLaserButton').hover(_.bind(this.showToolTip,this,this.resources.PresentTooltipCursorTypes,this.resources.PresentTooltipCursorTypesCmd), _.bind(this.hideToolTip,this));
    $encpJquery('.presentationMonitorButton').hover(_.bind(this.showToolTip,this,this.resources.PresentTooltipChangeScreen,this.resources.PresentTooltipChangeScreenCmd), _.bind(this.hideToolTip,this));
    $encpJquery('.presentationThemeButton').hover(function(){
        _this.showToolTip(_this.nightModeTooltip,_this.resources.PresentTooltipActivateNightModeCmd);
        }, _.bind(this.hideToolTip,this)
    );
    $encpJquery('.presentationBlueLaserButton').hover(_.bind(this.showToolTip,this,this.resources.PresentTooltipBlueLaserPointer,this.resources.PresentTooltipBlueLaserPointerCmd), _.bind(this.hideToolTip,this));
    $encpJquery('.presentationYellowLaserButton').hover(_.bind(this.showToolTip,this,this.resources.PresentTooltipYellowLaserPointer,this.resources.PresentTooltipYellowLaserPointerCmd), _.bind(this.hideToolTip,this));
    $encpJquery('.presentationRedLaserButton').hover(_.bind(this.showToolTip,this,this.resources.PresentTooltipRedLaserPointer,this.resources.PresentTooltipRedLaserPointerCmd), _.bind(this.hideToolTip,this));
    $encpJquery('.presentationDefaultLaserButton').hover(_.bind(this.showToolTip,this,this.resources.PresentTooltipArrowPointer,this.resources.PresentTooltipArrowPointerCmd), _.bind(this.hideToolTip,this));

    $encpJquery(document.body).append('<div class="presentationToolbarTooltip"><span class="presentationToolbarTooltipKeyShortcut">Ctrl+1</span><span class="presentationToolbarTooltipDescription">Something cool</span></div>');
    this.hideToolTip();
    this.wasHidden = false;
};

ToolbarView.prototype.onCursorChangeClick = function(color,e){
    if (color === 'blue') Analytics.reportEvent('presentation_mode', 'tools', 'pointer_blue');
    else if (color === 'red') Analytics.reportEvent('presentation_mode', 'tools', 'pointer_pink');
    else if (color === 'yellow') Analytics.reportEvent('presentation_mode', 'tools', 'pointer_green');
    else if (color === 'default') Analytics.reportEvent('presentation_mode', 'tools', 'pointer_mouse');
    
    this.setCursorIcon(color);
    this.hideLaserPointers();
    this.cursorChangeRequested.dispatch(color,e)
};

ToolbarView.prototype.setCursorIcon = function(icon){
    $encpJquery('.presentationLaserButton').css('background-image','url(images/cursor_'+icon+'_icon.svg), url(images/cursor_disclosure_arrow_icon.svg)');
}

ToolbarView.prototype.showToolTip = function(description, shortcut,preventShow){
    $encpJquery('.presentationToolbarTooltipDescription').html(description);
    $encpJquery('.presentationToolbarTooltipKeyShortcut').html(shortcut);
    if(preventShow === true || this.preventToolTipShowing){
        return;
    }
    $encpJquery('.presentationToolbarTooltip').css("display","block")
    $encpJquery('.presentationToolbarTooltip').show();
}

ToolbarView.prototype.hideToolTip = function(){
    $encpJquery('.presentationToolbarTooltip').hide();
};

ToolbarView.prototype.showLaserPointers = function(){
    $encpJquery(".presentationLaserToolbar").fadeIn(1000/6.0);
    this.isLaserToolbarShow = true;
};

ToolbarView.prototype.hideLaserPointers = function(){
    $encpJquery(".presentationLaserToolbar").fadeOut(1000/6.0);
    this.isLaserToolbarShow = false;
};

ToolbarView.prototype.onThemeButtonClicked = function(event,preventTooltip){
	this.preventToolTipShowing = preventTooltip;
    this.changeThemeRequested.dispatch(event);
    this.showToolTip();
    this.preventToolTipShowing = false;	
};

ToolbarView.prototype.setNightModeTooltip = function(t,preventShow){
    this.nightModeTooltip = t;
    this.showToolTip(t,this.resources.PresentTooltipActivateNightModeCmd,preventShow);
};

ToolbarView.prototype.onMonitorButtonClicked = function(event){
    this.changeMonitorRequested.dispatch();
};

ToolbarView.prototype.onLaserButtonClicked = function(event){
    if(!this.isLaserToolbarShow){
        this.showLaserPointers();
    }
    else {
        this.hideLaserPointers();
    }
};

ToolbarView.prototype.onExitButtonClicked = function(event){
    this.exitRequested.dispatch();
};

ToolbarView.prototype.isMouseInHitArea = function(x,y){
    if(this.forceVisible){
        return true;
    }
    var windowWidth = window.innerWidth;
    var windowHeight = window.innerHeight;

    var toolBarX = windowWidth-70-40;
    var toolBarY = 65;
    var toolBarWidth = 40;
    var toolBarHeight = 160;
    var padding = 20;

    if(this.isLaserToolbarShow){
        if(x>toolBarX-padding && x < toolBarX+toolBarWidth+padding && y > toolBarY-padding && y < toolBarY+toolBarHeight+padding){
            return true;
        }
    }

    var outerHitBoxWidth = 350;
    var outerHitBoxHeight = 120;
    return (y<outerHitBoxHeight && x > (windowWidth-outerHitBoxWidth));
}


ToolbarView.prototype.isInRect = function(x,y,rx,ry,w,h){
    return (x>=rx && x<rx+w && y>=ry && y<ry+h);
};

ToolbarView.prototype.onMouseMove = function(event){
    if(this.lastX == event.clientX && this.lastY == event.clientY){ return; }
    this.lastX = event.clientX;
    this.lastY = event.clientY;
    var x = event.clientX;
    var y = event.clientY;
    if(!this.enabled){ return; }
    var fadeTime = 1000/6.0;

    if(this.overrideWithin || this.isMouseInHitArea(x,y)){
        $encpJquery('.presentationToolbar').css('top',0+"px");
        $encpJquery('.presentationLaserToolbar').css('top',(0+65)+"px");
        $encpJquery('.presentationToolbarTooltip').css('top',(0+20)+"px");

        $encpJquery('.presentationToolbar').css('right',"0px");
        $encpJquery('.presentationToolbar').fadeIn(fadeTime);

        if(this.isInRect(x,y,window.innerWidth-190,19,174,38)|| (this.isLaserToolbarShow && this.isInRect(x,y,window.innerWidth-116,67,42,163))){
            this.hideCursorRequested.dispatch();
            this.wasHidden = true;
        }
        else {
            if(this.wasHidden){
                this.showCursorRequested.dispatch();
                this.wasHidden = false;
            }
        }
    }
    else {
        this.fadeOut();
    }
};

ToolbarView.prototype.fadeOut = function(){
    var fadeTime = 1000/6.0;
    if(this.wasHidden){
        this.showCursorRequested.dispatch();
        this.wasHidden = false;
    }
    if(this.isLaserToolbarShow){
        this.hideLaserPointers();
    }
    $encpJquery('.presentationToolbar').fadeOut(fadeTime);
    $encpJquery('.presentationToolbarTooltip').fadeOut(fadeTime);
};

ToolbarView.prototype.enable = function() {
    this.enabled = true;
};

ToolbarView.prototype.disable = function() {
    this.enabled = false;
    this.fadeOut();
};

ToolbarView.prototype.destroy = function(){
    $encpJquery(document).off('mousemove.presentationmode');
    $encpJquery(document).off('keydown.presentation');
    $encpJquery('.presentationToolbar').remove();
    $encpJquery('.presentationToolbarTooltip').remove();
    $encpJquery('.presentationLaserToolbar').remove();
};

ToolbarView.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.fadeOut();
	},time);
};