https://www.gbeu.ch/typo3conf/ext/lpc_googlemap/Resources/Public/JS/infobox.ol.js

1
2LpcOpenLayersInfoBox.prototype = Object.create(ol.Overlay.prototype);
3
4LpcOpenLayersInfoBox.openedInfoBoxes = [];
5
6function LpcOpenLayersInfoBox(options) {
7	this.content = options.content;
8	this.anchor = {
9		position: options.hasOwnProperty('anchorPosition') ? options.anchorPosition : 'bottomCenter',
10		offset: options.hasOwnProperty('anchorOffset') ? options.anchorOffset : {x:0,y:-57}
11	}
12	this.classes = (options.hasOwnProperty('classes') ? options.classes+' ' : '')+'lpcGooglemapPopup';
13	this.attributes = options.hasOwnProperty('attributes') ? options.attributes : null;
14	if(typeof this.anchor.position === 'string' || this.anchor.position instanceof String) {
15		var p = this.anchor.position.split(/(?=[A-Z])/);
16		this.anchor.position = {
17			x:{Left:0,Center:0.5,Right:1}[p[1]],
18			y:{top:0,center:0.5,bottom:1}[p[0]]
19		};
20	}
21	this.calcOffset = function() {
22		var div = $(this.getElement());
23		return [
24			this.anchor.offset.x-div.outerWidth()*this.anchor.position.x,
25			this.anchor.offset.y-div.outerHeight()*this.anchor.position.y
26		];
27	}
28	ol.Overlay.call(this,options);
29}
30
31LpcOpenLayersInfoBox.prototype.open = function(map,marker) {
32	while(LpcOpenLayersInfoBox.openedInfoBoxes.length) {
33		LpcOpenLayersInfoBox.openedInfoBoxes.pop().close();
34	}
35	this.map = map;
36	this.marker = marker;

37	var closer = $('<div>').addClass('lpcGooglemapPopupCloser');
38	var popup = this;
39	$(closer).click(function() {
40		popup.close();
41	});
42	var div = $('<div>').addClass(this.classes).css({display:'inline-block'}).append(this.content).append(closer);
43	if(this.attributes) {
44		for(name in this.attributes) {
45			if(this.attributes.hasOwnProperty(name)) {
46				div.attr(name,this.attributes[name]);
47			}
48		}
49	}
50	this.setElement(div[0]);
51	var saveAutoPan = this.autoPan;
52	this.autoPan = false;
53	this.setPosition(marker.getGeometry().getCoordinates()); // adds the popup element to the dom so width and height can be calculated
54	this.autoPan = saveAutoPan;
55	this.setOffset(this.calcOffset()); // calculates the offset in respect of the width and height of the popup element
56	this.setPosition(marker.getGeometry().getCoordinates()); // reset the popup position respecting the calculated offset
57	LpcOpenLayersInfoBox.openedInfoBoxes.push(this);
58}
59
60LpcOpenLayersInfoBox.prototype.close = function() {
61	this.setPosition(undefined);
62	this.setElement(undefined);
63}