301 | Creation and application: T&W
302 | Production: T&W, F&B 303 |
8 | * An InfoBox behaves like a google.maps.InfoWindow, but it supports several 9 | * additional properties for advanced styling. An InfoBox can also be used as a map label. 10 | *
11 | * An InfoBox also fires the same events as a google.maps.InfoWindow.
12 | */
13 |
14 | /*!
15 | *
16 | * Licensed under the Apache License, Version 2.0 (the "License");
17 | * you may not use this file except in compliance with the License.
18 | * You may obtain a copy of the License at
19 | *
20 | * http://www.apache.org/licenses/LICENSE-2.0
21 | *
22 | * Unless required by applicable law or agreed to in writing, software
23 | * distributed under the License is distributed on an "AS IS" BASIS,
24 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
25 | * See the License for the specific language governing permissions and
26 | * limitations under the License.
27 | */
28 |
29 | /*jslint browser:true */
30 | /*global google */
31 |
32 | /**
33 | * @name InfoBoxOptions
34 | * @class This class represents the optional parameter passed to the {@link InfoBox} constructor.
35 | * @property {string|Node} content The content of the InfoBox (plain text or an HTML DOM node).
36 | * @property {boolean} [disableAutoPan=false] Disable auto-pan on open.
37 | * @property {number} maxWidth The maximum width (in pixels) of the InfoBox. Set to 0 if no maximum.
38 | * @property {Size} pixelOffset The offset (in pixels) from the top left corner of the InfoBox
39 | * (or the bottom left corner if the Google Sheets API QuickstartalignBottom property is true)
40 | * to the map pixel corresponding to position.
41 | * @property {LatLng} position The geographic location at which to display the InfoBox.
42 | * @property {number} zIndex The CSS z-index style value for the InfoBox.
43 | * Note: This value overrides a zIndex setting specified in the boxStyle property.
44 | * @property {string} [boxClass="infoBox"] The name of the CSS class defining the styles for the InfoBox container.
45 | * @property {Object} [boxStyle] An object literal whose properties define specific CSS
46 | * style values to be applied to the InfoBox. Style values defined here override those that may
47 | * be defined in the boxClass style sheet. If this property is changed after the
48 | * InfoBox has been created, all previously set styles (except those defined in the style sheet)
49 | * are removed from the InfoBox before the new style values are applied.
50 | * @property {string} closeBoxMargin The CSS margin style value for the close box.
51 | * The default is "2px" (a 2-pixel margin on all sides).
52 | * @property {string} closeBoxURL The URL of the image representing the close box.
53 | * Note: The default is the URL for Google's standard close box.
54 | * Set this property to "" if no close box is required.
55 | * @property {Size} infoBoxClearance Minimum offset (in pixels) from the InfoBox to the
56 | * map edge after an auto-pan.
57 | * @property {boolean} [isHidden=false] Hide the InfoBox on open.
58 | * [Deprecated in favor of the visible property.]
59 | * @property {boolean} [visible=true] Show the InfoBox on open.
60 | * @property {boolean} alignBottom Align the bottom left corner of the InfoBox to the position
61 | * location (default is false which means that the top left corner of the InfoBox is aligned).
62 | * @property {string} pane The pane where the InfoBox is to appear (default is "floatPane").
63 | * Set the pane to "mapPane" if the InfoBox is being used as a map label.
64 | * Valid pane names are the property names for the google.maps.MapPanes object.
65 | * @property {boolean} enableEventPropagation Propagate mousedown, mousemove, mouseover, mouseout,
66 | * mouseup, click, dblclick, touchstart, touchend, touchmove, and contextmenu events in the InfoBox
67 | * (default is false to mimic the behavior of a google.maps.InfoWindow). Set
68 | * this property to true if the InfoBox is being used as a map label.
69 | */
70 |
71 | /**
72 | * Creates an InfoBox with the options specified in {@link InfoBoxOptions}.
73 | * Call InfoBox.open to add the box to the map.
74 | * @constructor
75 | * @param {InfoBoxOptions} [opt_opts]
76 | */
77 | function InfoBox(opt_opts) {
78 |
79 | opt_opts = opt_opts || {};
80 |
81 | google.maps.OverlayView.apply(this, arguments);
82 |
83 | // Standard options (in common with google.maps.InfoWindow):
84 | //
85 | this.content_ = opt_opts.content || "";
86 | this.disableAutoPan_ = opt_opts.disableAutoPan || false;
87 | this.maxWidth_ = opt_opts.maxWidth || 0;
88 | this.pixelOffset_ = opt_opts.pixelOffset || new google.maps.Size(0, 0);
89 | this.position_ = opt_opts.position || new google.maps.LatLng(0, 0);
90 | this.zIndex_ = opt_opts.zIndex || null;
91 |
92 | // Additional options (unique to InfoBox):
93 | //
94 | this.boxClass_ = opt_opts.boxClass || "infoBox";
95 | this.boxStyle_ = opt_opts.boxStyle || {};
96 | this.closeBoxMargin_ = opt_opts.closeBoxMargin || "2px";
97 | this.closeBoxURL_ = opt_opts.closeBoxURL || "http://www.google.com/intl/en_us/mapfiles/close.gif";
98 | if (opt_opts.closeBoxURL === "") {
99 | this.closeBoxURL_ = "";
100 | }
101 | this.infoBoxClearance_ = opt_opts.infoBoxClearance || new google.maps.Size(1, 1);
102 |
103 | if (typeof opt_opts.visible === "undefined") {
104 | if (typeof opt_opts.isHidden === "undefined") {
105 | opt_opts.visible = true;
106 | } else {
107 | opt_opts.visible = !opt_opts.isHidden;
108 | }
109 | }
110 | this.isHidden_ = !opt_opts.visible;
111 |
112 | this.alignBottom_ = opt_opts.alignBottom || false;
113 | this.pane_ = opt_opts.pane || "floatPane";
114 | this.enableEventPropagation_ = opt_opts.enableEventPropagation || false;
115 |
116 | this.div_ = null;
117 | this.closeListener_ = null;
118 | this.moveListener_ = null;
119 | this.contextListener_ = null;
120 | this.eventListeners_ = null;
121 | this.fixedWidthSet_ = null;
122 | }
123 |
124 | /* InfoBox extends OverlayView in the Google Maps API v3.
125 | */
126 | InfoBox.prototype = new google.maps.OverlayView();
127 |
128 | /**
129 | * Creates the DIV representing the InfoBox.
130 | * @private
131 | */
132 | InfoBox.prototype.createInfoBoxDiv_ = function () {
133 |
134 | var i;
135 | var events;
136 | var bw;
137 | var me = this;
138 |
139 | // This handler prevents an event in the InfoBox from being passed on to the map.
140 | //
141 | var cancelHandler = function (e) {
142 | e.cancelBubble = true;
143 | if (e.stopPropagation) {
144 | e.stopPropagation();
145 | }
146 | };
147 |
148 | // This handler ignores the current event in the InfoBox and conditionally prevents
149 | // the event from being passed on to the map. It is used for the contextmenu event.
150 | //
151 | var ignoreHandler = function (e) {
152 |
153 | e.returnValue = false;
154 |
155 | if (e.preventDefault) {
156 |
157 | e.preventDefault();
158 | }
159 |
160 | if (!me.enableEventPropagation_) {
161 |
162 | cancelHandler(e);
163 | }
164 | };
165 |
166 | if (!this.div_) {
167 |
168 | this.div_ = document.createElement("div");
169 |
170 | this.setBoxStyle_();
171 |
172 | if (typeof this.content_.nodeType === "undefined") {
173 | this.div_.innerHTML = this.getCloseBoxImg_() + this.content_;
174 | } else {
175 | this.div_.innerHTML = this.getCloseBoxImg_();
176 | this.div_.appendChild(this.content_);
177 | }
178 |
179 | // Add the InfoBox DIV to the DOM
180 | this.getPanes()[this.pane_].appendChild(this.div_);
181 |
182 | this.addClickHandler_();
183 |
184 | if (this.div_.style.width) {
185 |
186 | this.fixedWidthSet_ = true;
187 |
188 | } else {
189 |
190 | if (this.maxWidth_ !== 0 && this.div_.offsetWidth > this.maxWidth_) {
191 |
192 | this.div_.style.width = this.maxWidth_;
193 | this.div_.style.overflow = "auto";
194 | this.fixedWidthSet_ = true;
195 |
196 | } else { // The following code is needed to overcome problems with MSIE
197 |
198 | bw = this.getBoxWidths_();
199 |
200 | this.div_.style.width = (this.div_.offsetWidth - bw.left - bw.right) + "px";
201 | this.fixedWidthSet_ = false;
202 | }
203 | }
204 |
205 | this.panBox_(this.disableAutoPan_);
206 |
207 | if (!this.enableEventPropagation_) {
208 |
209 | this.eventListeners_ = [];
210 |
211 | // Cancel event propagation.
212 | //
213 | // Note: mousemove not included (to resolve Issue 152)
214 | events = ["mousedown", "mouseover", "mouseout", "mouseup",
215 | "click", "dblclick", "touchstart", "touchend", "touchmove"];
216 |
217 | for (i = 0; i < events.length; i++) {
218 |
219 | this.eventListeners_.push(google.maps.event.addDomListener(this.div_, events[i], cancelHandler));
220 | }
221 |
222 | // Workaround for Google bug that causes the cursor to change to a pointer
223 | // when the mouse moves over a marker underneath InfoBox.
224 | this.eventListeners_.push(google.maps.event.addDomListener(this.div_, "mouseover", function (e) {
225 | this.style.cursor = "default";
226 | }));
227 | }
228 |
229 | this.contextListener_ = google.maps.event.addDomListener(this.div_, "contextmenu", ignoreHandler);
230 |
231 | /**
232 | * This event is fired when the DIV containing the InfoBox's content is attached to the DOM.
233 | * @name InfoBox#domready
234 | * @event
235 | */
236 | google.maps.event.trigger(this, "domready");
237 | }
238 | };
239 |
240 | /**
241 | * Returns the HTML tag for the close box.
242 | * @private
243 | */
244 | InfoBox.prototype.getCloseBoxImg_ = function () {
245 |
246 | var img = "";
247 |
248 | if (this.closeBoxURL_ !== "") {
249 |
250 | img = "
14 | * This is a v3 implementation of the
15 | * v2 MarkerClusterer.
17 | */
18 |
19 | /**
20 | * @license
21 | * Copyright 2010 Google Inc. All Rights Reserved.
22 | *
23 | * Licensed under the Apache License, Version 2.0 (the "License");
24 | * you may not use this file except in compliance with the License.
25 | * You may obtain a copy of the License at
26 | *
27 | * http://www.apache.org/licenses/LICENSE-2.0
28 | *
29 | * Unless required by applicable law or agreed to in writing, software
30 | * distributed under the License is distributed on an "AS IS" BASIS,
31 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
32 | * See the License for the specific language governing permissions and
33 | * limitations under the License.
34 | */
35 |
36 |
37 | /**
38 | * A Marker Clusterer that clusters markers.
39 | *
40 | * @param {google.maps.Map} map The Google map to attach to.
41 | * @param {Array.
37 | > Givaudan's Virtual Tours
38 | 
41 |
45 |
46 |
86 |