Commit e6e6f984 authored by Pedro Eduardo Trujillo's avatar Pedro Eduardo Trujillo
Browse files

Remodela tooltip de módulos, corrige y mejora 

Actualiza estilos, implementa detección de mejor zona para mostrarse y
posiciona la flechita indicadora correctamente.

Limpia nodo de popup padre cuando el tooltip se oculta para evitar dejar
restos acumulables.

Corrige pisado indiscriminado de callbacks de eventos preexistentes, que
obligaba a Atlas a crear nodos extra. En su lugar, restaura el original
del nodo cuando desaparece el tooltip.
parent 6aa9b5ff

public/javascript/app/dataLoader/base/_GeographicBase.js

+0 −1
Original line number Diff line number Diff line
@@ -94,7 +94,6 @@ define([ 
			}, this.filterConfig || {}]);



			this.compositeConfig = this._merge([{

				indicatorLeft: true

			}, this.compositeConfig || {}]);

		},

public/javascript/app/dataLoader/citation/views/CitationView.js

+0 −1
Original line number Diff line number Diff line
@@ -97,7 +97,6 @@ define([ 
			}, this.filterConfig || {}]);



			this.compositeConfig = this._merge([{

				indicatorLeft: true

			}, this.compositeConfig || {}]);



			this.mapConfig = this._merge([{

public/javascript/redmic/modules/base/_ShowInTooltip.js

+135 −52
Original line number Diff line number Diff line 
define([

	"dijit/_WidgetBase"

	, "dijit/popup"

	, "dojo/_base/lang"

	, "dojo/Deferred"

	, "dojo/promise/all"

	, "put-selector/put"

	'dijit/_WidgetBase'

	, 'dijit/popup'

	, 'dojo/_base/lang'

	, 'dojo/Deferred'

	, 'dojo/promise/all'

	, 'put-selector/put'

], function(

	_WidgetBase

	, popup
@@ -13,6 +13,7 @@ define([ 
	, all

	, put

) {



	return {

		//	summary:

		//		Extensión de módulos para que se muestren en un tooltip.
@@ -26,31 +27,47 @@ define([ 


		postCreate: function() {



			if (this.timeClose === undefined) {

				this.timeClose = 600;

			}



			this.inherited(arguments);



			var classTooltip = "dijitMenu tooltipButton ";

			var tooltipClass = 'tooltipContainer',

				sourceIndicatorClass = 'tooltipSourceIndicator',

				defaultTooltipCloseTimeout = 1000;



			this._tooltipAboveClass = 'tooltipAboveSource';

			this._tooltipBelowClass = 'tooltipBelowSource';

			this._tooltipLeftClass = 'tooltipLeftSource';

			this._tooltipRightClass = 'tooltipRightSource';



			if (this.indicatorLeft) {

				classTooltip += "tooltipButtonLeft ";

			if (this.timeClose === undefined) {

				this.timeClose = defaultTooltipCloseTimeout;

			}



			if (this.classTooltip) {

				classTooltip += this.classTooltip;

				tooltipClass += ' ' + this.classTooltip;

			}



			this.tooltipNode = new _WidgetBase({

				'class': classTooltip

				'class': tooltipClass

			});



			if (!this.notIndicator) {

				var nodeIndicator = put(this.tooltipNode.domNode, "i.fa.fa-caret-up.indicatorParent");

			this._tooltipSourceIndicatorNode = put(this.tooltipNode.domNode, 'i.' + sourceIndicatorClass);



			this._globalClicksHandler = this._listenGlobalClicks(lang.hitch(this, this._evaluateToHideTooltip));

			this._globalClicksHandler.pause();

		},



		_evaluateToHideTooltip: function(evt) {



			if (!this.tooltipNode._popupWrapper) {

				return;

			}



			this.nodeModule = put(this.tooltipNode.domNode, "div.containerContent");

			var nodeBelongsToTooltipContainer = this._checkClickBelongsToNode(evt, this.tooltipNode._popupWrapper),

				nodeBelongsToSourceNode = this._checkClickBelongsToNode(evt, this._tooltipSourceNode);



			if (!nodeBelongsToTooltipContainer && !nodeBelongsToSourceNode) {

				this._hideTooltip();

			}

		},



		_beforeShow: function() {
@@ -86,14 +103,19 @@ define([ 
			return !this._ancestorTooltipNode;

		},



		_subAncestorGotProps: function(res) {



			this._ancestorTooltipNode = res.tooltipNode;

		},



		_showWrapper: function(req) {



			this.nodeSource = req.node;

			req.node = this.nodeModule;

			this._tooltipSourceNode = req.node;

			req.node = this.tooltipNode.domNode;



			this.inherited(arguments);



			this._openTooltip(req.additionalNode);

			this._openTooltip();

		},



		_afterShow: function(req) {
@@ -110,12 +132,66 @@ define([ 
			return all(dfdList);

		},



		_openTooltip: function(additionalNode) {

		_openTooltip: function() {



			this._calculateOrientation();



			this._setParentPopup();



			if (this.timeClose) {

				this._prepareTooltipClose();

			}



			this._globalClicksHandler.resume();

			this._dfdTooltip.resolve();

		},



		_calculateOrientation: function() {



			var middleWidth = window.innerWidth / 2,

				middleHeight = window.innerHeight / 2,



				sourceBounding = this._tooltipSourceNode.getBoundingClientRect(),

				sourceMiddleWidth = sourceBounding.left + sourceBounding.width / 2,

				sourceMiddleHeight = sourceBounding.top + sourceBounding.height / 2,



				leftAvailable = sourceMiddleWidth > middleWidth,

				topAvailable = sourceMiddleHeight > middleHeight,

				orientValue, xOrientClass, yOrientClass;



			if (leftAvailable && topAvailable) {

				orientValue = 'above-alt';

				xOrientClass = this._tooltipLeftClass;

				yOrientClass = this._tooltipAboveClass;

			} else if (!leftAvailable && topAvailable) {

				orientValue = 'above';

				xOrientClass = this._tooltipRightClass;

				yOrientClass = this._tooltipAboveClass;

			} else if (leftAvailable && !topAvailable) {

				orientValue = 'below-alt';

				xOrientClass = this._tooltipLeftClass;

				yOrientClass = this._tooltipBelowClass;

			} else {

				orientValue = 'below';

				xOrientClass = this._tooltipRightClass;

				yOrientClass = this._tooltipBelowClass;

			}



			this._tooltipOrientValue = orientValue;

			this._setOrientationClasses(xOrientClass, yOrientClass);

		},



		_setOrientationClasses: function(xOrientClass, yOrientClass) {



			put(this.tooltipNode.domNode, '.' + xOrientClass + '.' + yOrientClass);

		},



		_setParentPopup: function() {



			var obj = {

				popup: this.tooltipNode,

				around: this.nodeSource,

				orient: this.orient

				around: this._tooltipSourceNode,

				orient: [this._tooltipOrientValue],

			};



			if (this._ancestorTooltipNode) {
@@ -123,61 +199,68 @@ define([ 
			}



			popup.open(obj);

		},



			if (this.timeClose) {

				this.tooltipNode._popupWrapper.onmouseleave = lang.hitch(this, this._startTimeout);

				this.tooltipNode._popupWrapper.onmouseover = lang.hitch(this, this._stopTimeout);

		_prepareTooltipClose: function() {



				this.nodeSource.onmouseleave = lang.hitch(this, this._startTimeout);

				this.nodeSource.onmouseover = lang.hitch(this, this._stopTimeout);

			var popupNode = this.tooltipNode._popupWrapper,

				startCallback = lang.hitch(this, this._startCloseTimeout),

				stopCallback = lang.hitch(this, this._stopCloseTimeout);



				if (additionalNode) {

					additionalNode.onmouseleave = lang.hitch(this, this._startTimeout);

				}

			}

			popupNode.onmouseleave = startCallback;

			popupNode.onmouseover = stopCallback;



			this._dfdTooltip.resolve();

			this._tooltipSourceNodeOldMouseLeaveCallback = this._tooltipSourceNode.onmouseleave;

			this._tooltipSourceNodeOldMouseOverCallback = this._tooltipSourceNode.onmouseover;

			this._tooltipSourceNode.onmouseleave = startCallback;

			this._tooltipSourceNode.onmouseover = stopCallback;

		},



		_startTimeout: function() {

		_startCloseTimeout: function() {



			this.timeout = setTimeout(lang.hitch(this, this._publish, this.getChannel("HIDE")), this.timeClose);

			this._closeTimeoutHandler = setTimeout(lang.hitch(this, this._hideTooltip), this.timeClose);

		},



		_stopTimeout: function() {

		_stopCloseTimeout: function() {



			clearTimeout(this.timeout);

			clearTimeout(this._closeTimeoutHandler);

		},



		_onModuleAncestorHide: function() {



			this._publish(this.getChannel("HIDE"));

			this._hideTooltip();

		},



		_hideTooltip: function() {



			this._publish(this.getChannel('HIDE'));

		},



		_onModuleHide: function() {



			this._stopTimeout();

			this._closeTooltip();

			this._stopCloseTimeout();

			this._removeTooltip();



			this.inherited(arguments);

		},



		_closeTooltip: function(evt) {

		_removeTooltip: function(evt) {



			popup.close(this.tooltipNode);



			if (this.timeClose) {

				this.tooltipNode._popupWrapper.onmouseover = function(){};

				this.tooltipNode._popupWrapper.onmouseleave = function(){};

			put('!', this.tooltipNode._popupWrapper);



				this.nodeSource.onmouseleave = function(){};

				this.nodeSource.onmouseover = function(){};

			}

		},

			var classesToRemove = '!' + this._tooltipAboveClass + '!' + this._tooltipBelowClass +

				'!' + this._tooltipLeftClass + '!' + this._tooltipRightClass;



		_subAncestorGotProps: function(res, c) {

			put(this.tooltipNode.domNode, classesToRemove);



			this._ancestorTooltipNode = res.tooltipNode;

			this._globalClicksHandler.pause();



			if (this.timeClose) {

				this._tooltipSourceNode.onmouseleave = this._tooltipSourceNodeOldMouseLeaveCallback;

				this._tooltipSourceNode.onmouseover = this._tooltipSourceNodeOldMouseOverCallback;

			}

		}

	};

});

public/javascript/redmic/modules/browser/_Table.js

+0 −1
Original line number Diff line number Diff line
@@ -63,7 +63,6 @@ define([ 
				},

				multipleSelected: true,

				hideOnClickItem: false,

				indicatorLeft: true,

				classTooltip: "tooltipButtonMenu"

			}, this.headerOptionConfig || {}]);

public/javascript/redmic/modules/chart/SmartLegend/SmartLegend.js

+0 −1
Original line number Diff line number Diff line
@@ -117,7 +117,6 @@ define([ 
			this.listMenu = new declare(ListMenu).extend(_ShowInTooltip)({

				classTooltip: "tooltipButtonMenu tooltipButtonAggrement",

				parentChannel: this.getChannel(),

				notIndicator: true,

				select: {

					"default": 0

				},