////
// Plugin - hideNavpane
// adds a toggeling functionality to the navigation panel
// @author OstrickiDa
//
(function(){
  // Constructor
  (HideNavpaneHandler = function(element, options) {
    this.navpaneLayoutDiv = jQuery(element);
    // Merge options with default values
    this.settings = jQuery.extend({}, this.defaultValues, options || {});
    this.init();
  }).prototype = {
	state: 'hide', // show,hide
	leaveTimer : null,

	navpaneLayoutDiv : null,
    buttonDiv  : null,
    activityTileDiv : null,
    invisibleTouchExtensionDiv : null,

    defaultValues : {
      //div elements
      'hideNavpane'  : false,
      'initialState' : 'show',

      //toggle button div
      'buttonDivSelector'   : null,
	  'buttonXPositionNoNav'   : 6,
	  'buttonImageClass':null,

      // navpane div
      'navpaneStyle_visible' : null
    },

    /* ****************************************************************
     * 						initialization
     * ***************************************************************/

    init : function() {
      this.initializeEnvironment();
      this.initializeHandlers();

      this.updateActivityMarkerDimensions();
      jQuery(document).ready(jQuery.proxy(this.updateButtonPosition,this));
      jQuery(window).on("scroll", jQuery.proxy(this.updateButtonPosition,this));
    },

    initializeEnvironment : function () {
      var settings = this.settings;

      if(this.settings['buttonDivSelector']){
        this.buttonDiv = jQuery(this.settings['buttonDivSelector']);
      }
      if(this.settings['activeTileSelector']){
		this.activityTileDiv = jQuery(this.settings['activeTileSelector']);
		this.activityTileDiv.addClass('Active');
      }
      if(this.settings['invisibleTouchExtensionSelector']){
          this.invisibleTouchExtensionDiv = jQuery(this.settings['invisibleTouchExtensionSelector']);
      }

      switch(this.settings['initialState']) {
        case "show" : this.show(); break;
        case "hide" : this.hide(); break;
        default: this.show();
      }
    },

    initializeHandlers : function () {

      if(this.navpaneLayoutDiv) {
	      jQuery(this.navpaneLayoutDiv).on('click', jQuery.proxy(this.navpaneClickedEvent, this));

	      if(this.isNavpaneHideable()) {
	    	  var me = this;
	    	  jQuery(document).on('click touchstart onmsgesturestart', jQuery.proxy(this.documentClickedEvent, this));
	    	  jQuery(this.navpaneLayoutDiv).touchwipe({
	    		    wipeLeft: function() { me.hide(); },
	    		    wipeRight: function() { me.show(); }
	    	  });
	      }
	      jQuery(this.navpaneLayoutDiv).on('touchstart onmsgesturestart', jQuery.proxy(this.navpaneWipeStarted, this));
      }
    },

    updateActivityMarkerDimensions : function () {
    	if(this.settings['activeTileMarkerSelector']){
    		var div =  jQuery(this.settings['activeTileMarkerSelector']);
    		var template = jQuery(this.settings['activeTileSelector']);
    		if(template && template[0]){

    			var height = jQuery(template[0]).outerHeight();
	    		div.css({'height':height+'px'});

	    		var y = jQuery(template[0]).position().top;
	    		div.css({'margin-top':y+'px'});
    		}
    	}
    },

    updateButtonPosition : function () {
    	if(this.buttonDiv){

    		if(this.settings['buttonImageClass']){
    			var clazz = this.settings['buttonImageClass'];
    			this.buttonDiv.addClass(clazz);
    		}

    		if(this.activityTileDiv && typeof this.activityTileDiv.position() !== 'undefined'){
    			var y = this.activityTileDiv.position().top;
	    		this.buttonDiv.css({'top':y+'px'});
    		}
    	}
    },

    navpaneClickedEvent : function (event) {
    	if(this.isNavpaneHideable()) {
	    	if(!this.isShowing()){
	    		this.show();
	    	}
    	}
    	//cancel bubbeling
    	event.stopPropagation();
    },

    navpaneWipeStarted: function (event) {
    	//cancel bubbeling
    	event.stopPropagation();
    },

    documentClickedEvent : function () {
    	if(!this.isHidden()){
    		this.hide();
    	}
    	//continue bubbeling
    },

    /* ****************************************************************
     * 						general behaviour
     * ***************************************************************/

    show : function () {
      this.state = 'show';

      if(this.buttonDiv) {
    	  this.buttonDiv.hide();
      }
      this.invisibleTouchExtensionDiv.hide();

      this.navpaneLayoutDiv.animate({
    	  left: '0'
    	  },
    	  200,
    	  jQuery.proxy(function(){}, this)
       );
    },

    hide : function () {
      this.state = 'hide';

      jQuery(document).trigger('navpane:hide');

      this.navpaneLayoutDiv.animate({
    	  left: '-132'
    	  },
    	  200,
    	  jQuery.proxy(function(){
    		  if(this.buttonDiv) {
    			  this.buttonDiv.css('left',this.settings['buttonXPositionNoNav']);
    			  this.buttonDiv.show( 'drop', {}, 600, null);
    		  }
    		  this.invisibleTouchExtensionDiv.show();
    	  }, this)
       );
    },

    /* ****************************************************************
     * 						  help functions
     * ***************************************************************/

    isNavpaneHideable : function () {
        return !!(this.settings['hideNavpane']);
    },

    isHidden : function () {
        return this.state == 'hide';
    },
    isShowing : function () {
        return this.state == 'show';
    }

  };

  jQuery.fn.hideNavpane = function(options) {
    return this.each(function() {
      var element = jQuery(this);
      // Return early if this element already has a plugin instance
      if (element.data('hideNavpaneHandler')) {
        return;
      }
      // Store plugin object in this element's data
      element.data('hideNavpaneHandler', new HideNavpaneHandler(this, jQuery.extend({}, options)));
    });
  };
})();
//
////
