https://www.jointbaselewismcchordhousing.com/media/com_posthousing/js/leaflettooltip.js

1L.Tooltip = L.Class.extend({
2	
3	options: {
4		width: 'auto',
5		minWidth: '',
6		maxWidth: '',
7		padding: '2px 4px',
8		showDelay: 500,
9		hideDelay: 500,
10		mouseOffset: L.point(0, 24),
11		fadeAnimation: true,
12		trackMouse: false		
13	},
14
15	initialize: function (options) {
16		L.setOptions(this, options);
17
18		this._createTip();
19	},
20
21	_createTip: function () {
22		this._map = this.options.map;
23
24		if (!this._map) {
25			throw new Error('No map configured for tooltip');
26		}
27
28		this._container = L.DomUtil.create('div', 'leaflet-tooltip');
29		this._container.style.position = 'absolute';
30		this._container.style.width = this._isNumeric(this.options.width) ? this.options.width + 'px' : this.options.width;
31		this._container.style.minWidth = this._isNumeric(this.options.minWidth) ? this.options.minWidth + 'px' : this.options.minWidth;
32		this._container.style.maxWidth = this._isNumeric(this.options.maxWidth) ? this.options.maxWidth + 'px' : this.options.maxWidth;
33
34		this._container.style.padding = this._isNumeric(this.options.padding) ? this.options.padding + 'px' : this.options.padding;
35
36		if (this.options.html) {
37			this.setHtml(this.options.html);
38		}
39
40 		if (this.options.target) {
41			this.setTarget(this.options.target);
42		}
43
44		this._map._tooltipContainer.appendChild(this._container);
45	},
46	
47	isVisible: function () {
48		return this._showing;
49	},
50
51	setTarget: function (target) {
52		if (target._icon) {
53			target = target._icon;
54		} else if (target._container) {
55			target = target._container;
56		}
57
58		if (target === this._target) {
59			return;
60		}
61
62		if (this._target) {
63			this._unbindTarget(this._target);
64		}
65
66		this._bindTarget(target);
67
68		this._target = target;
69	},
70
71	_bindTarget: function (target) {
72		L.DomEvent
73			.on(target, 'mouseover', this._onTargetMouseover, this)
74		    .on(target, 'mouseout', this._onTargetMouseout, this)
75		    .on(target, 'mousemove', this._onTargetMousemove, this);
76	},
77
78	_unbindTarget: function (target) {
79		L.DomEvent
80			.off(target, 'mouseover', this._onTargetMouseover, this)
81		    .off(target, 'mouseout', this._onTargetMouseout, this)
82		    .off(target, 'mousemove', this._onTargetMousemove, this);
83	},
84
85	setHtml: function (html) {
86		if (typeof html === 'string') {
87			this._container.innerHTML = html;	
88		} else {
89			while (this._container.hasChildNodes()) {
90				this._container.removeChild(this._container.firstChild);
91			}
92			this._container.appendChild(this._content);			
93		}
94		
95		this._sizeChanged = true;
96	},
97
98	setPosition: function (point) {
99		var mapSize = this._map.getSize(),
100		    container = this._container,
101		    containerSize = this._getElementSize(this._container);
102
103		point = point.add(this.options.mouseOffset);
104		
105		if (point.x + containerSize.x > mapSize.x) {
106			container.style.left = 'auto';
107			container.style.right = (mapSize.x - point.x + 2*(this.options.mouseOffset.x)) + 'px';
108		} else {
109			container.style.left = point.x + 'px';
110			container.style.right = 'auto';
111		}
112		
113		if (point.y + containerSize.y > mapSize.y) {
114			container.style.top = 'auto';
115            container.style.bottom = (mapSize.y - point.y + 2*(this.options.mouseOffset.y)) + 'px';
116		} else {
117			container.style.top = point.y + 'px';
118			container.style.bottom = 'auto';
119		}
120	},
121
122	remove: function () {
123		this._container.parentNode.removeChild(this._container);
124		delete this._container;
125
126		if (this._target) {
127			this._unbindTarget(this._target);
128		}
129	},
130
131	show: function (point, html) {
132		if (L.Tooltip.activeTip && L.Tooltip.activeTip != this) {
133			L.Tooltip.activeTip._hide();
134		}
135		L.Tooltip.activeTip = this;		
136		
137		if (html) {
138			this.setHtml(html);
139		}
140
141		this.setPosition(point);
142
143		if (this.options.showDelay) {
144			this._delay(this._show, this, this.options.showDelay);
145		} else {
146			this._show();
147		}
148	},
149
150	_show: function () {
151		this._container.style.display = 'inline-block';		
152
153		// Necessary to force re-calculation of the opacity value so transition will run correctly
154		if (window.getComputedStyle) {
155			window.getComputedStyle(this._container).opacity;
156		}
157
158		L.DomUtil.addClass(this._container, 'leaflet-tooltip-fade');
159
160		this._showing = true;			
161	},
162
163	hide: function () {
164		if (this.options.hideDelay) {
165			this._delay(this._hide, this, this.options.hideDelay);
166		} else {
167			this._hide();
168		}		
169	},
170
171	_hide: function () {	
172		if (this._timeout) {
173			clearTimeout(this._timeout);
174		}
175		
176		L.DomUtil.removeClass(this._container, 'leaflet-tooltip-fade');
177		this._container.style.display = 'none';
178		
179		this._showing = false;
180
181		if (L.Tooltip.activeTip === this) {
182			delete L.Tooltip.activeTip;
183		}
184	},
185
186	_delay: function (func, scope, delay) {
187		var me = this;
188
189		if (this._timeout) {
190			clearTimeout(this._timeout);
191		}
192		this._timeout = setTimeout(function () {
193			func.call(scope);
194			delete me._timeout;
195		}, delay);
196	},
197
198	_isNumeric: function (val) {
199		return !isNaN(parseFloat(val)) && isFinite(val);
200	},
201
202	_getElementSize: function (el) {		
203		var size = this._size;
204
205		if (!size || this._sizeChanged) {
206			size = {};
207
208			el.style.left = '-999999px';
209			el.style.right = 'auto';
210			el.style.display = 'inline-block';
211			
212			size.x = el.offsetWidth;
213			size.y = el.offsetHeight;
214			
215			el.style.left = 'auto';
216			el.style.display = 'none';
217			
218			this._sizeChanged = false;
219		}
220		return size;
221	},
222
223	_onTargetMouseover: function (e) {
224		var point = this._map.mouseEventToContainerPoint(e);
225
226		this.show(point);
227	},
228
229	_onTargetMousemove: function (e) {
230		L.DomEvent.stopPropagation(e);
231
232		if (this.options.trackMouse) {
233			var point = this._map.mouseEventToContainerPoint(e);		
234			this.setPosition(point);
235		}
236	},
237
238	_onTargetMouseout: function (e) {
239		this.hide();
240	}
241});
242
243L.Map.addInitHook(function () {
244	this._tooltipContainer = L.DomUtil.create('div', 'leaflet-tooltip-container', this._container);
245});
246
247L.tooltip = function (options) {
248	return new L.Tooltip(options);
249};
250
251(function () {
252	var originalOnAdd = L.Marker.prototype.onAdd,
253	    originalOnRemove = L.Marker.prototype.onRemove,
254	    originalSetIcon = L.Marker.prototype.setIcon;
255
256	L.Marker.include({
257
258		getTooltip: function () {
259			return this._tooltip;
260		},
261		
262		onAdd: function (map) {
263			originalOnAdd.call(this, map);
264
265			if (this.options.tooltip) {
266				this._tooltip = L.tooltip(L.extend(this.options.tooltip, {target: this, map: map}));
267			}
268		},
269
270		onRemove: function (map) {
271			if (this._tooltip) {
272				this._tooltip.remove();
273			}
274			originalOnRemove.call(this, map);
275		},
276
277		setIcon: function (icon) {			
278			originalSetIcon.call(this, icon);
279			
280			if (this._tooltip) {
281				this._tooltip.setTarget(this._icon);
282			}
283		}
284	});	
285})();