https://www.impiana.com.my/wp-content/themes/impiana-group/js/infobox.js?

1/**
2 * @name InfoBox
3 * @version 1.1.12 [December 11, 2012]
4 * @author Gary Little (inspired by proof-of-concept code from Pamela Fox of Google)
5 * @copyright Copyright 2010 Gary Little [gary at luxcentral.com]
6 * @fileoverview InfoBox extends the Google Maps JavaScript API V3 <tt>OverlayView</tt> class.
7 *  <p>
8 *  An InfoBox behaves like a <tt>google.maps.InfoWindow</tt>, but it supports several
9 *  additional properties for advanced styling. An InfoBox can also be used as a map label.
10 *  <p>
11 *  An InfoBox also fires the same events as a <tt>google.maps.InfoWindow</tt>.
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 <tt>open</tt>.
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 <code>alignBottom</code> property is <code>true</code>)
40 *  to the map pixel corresponding to <tt>position</tt>.
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 <tt>boxStyle</tt> 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 <code>boxClass</code> 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 <tt>open</tt>.
58 *  [Deprecated in favor of the <tt>visible</tt> property.]
59 * @property {boolean} [visible=true] Show the InfoBox on <tt>open</tt>.
60 * @property {boolean} alignBottom Align the bottom left corner of the InfoBox to the <code>position</code>
61 *  location (default is <tt>false</tt> 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 <tt>google.maps.MapPanes</tt> 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 <tt>false</tt> to mimic the behavior of a <tt>google.maps.InfoWindow</tt>). Set
68 *  this property to <tt>true</tt> 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 <tt>InfoBox.open</tt> to add the box to the map.
74 * @constructor
75 * @param {InfoBoxOptions} [opt_opts]
76 */
77function 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 */
126InfoBox.prototype = new google.maps.OverlayView();
127
128/**
129 * Creates the DIV representing the InfoBox.
130 * @private
131 */
132InfoBox.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 <IMG> tag for the close box.
242 * @private
243 */
244InfoBox.prototype.getCloseBoxImg_ = function () {
245
246  var img = "";
247
248  if (this.closeBoxURL_ !== "") {
249
250    img  = "<img";
251    img += " src='" + this.closeBoxURL_ + "'";
252    img += " align=right"; // Do this because Opera chokes on style='float: right;'
253    img += " style='";
254    img += " position: relative;"; // Required by MSIE
255    img += " cursor: pointer;";
256    img += " margin: " + this.closeBoxMargin_ + ";";
257    img += "'>";
258  }
259
260  return img;
261};
262
263/**
264 * Adds the click handler to the InfoBox close box.
265 * @private
266 */
267InfoBox.prototype.addClickHandler_ = function () {
268
269  var closeBox;
270
271  if (this.closeBoxURL_ !== "") {
272
273    closeBox = this.div_.firstChild;
274    this.closeListener_ = google.maps.event.addDomListener(closeBox, "click", this.getCloseClickHandler_());
275
276  } else {
277
278    this.closeListener_ = null;
279  }
280};
281
282/**
283 * Returns the function to call when the user clicks the close box of an InfoBox.
284 * @private
285 */
286InfoBox.prototype.getCloseClickHandler_ = function () {
287
288  var me = this;
289
290  return function (e) {
291
292    // 1.0.3 fix: Always prevent propagation of a close box click to the map:
293    e.cancelBubble = true;
294
295    if (e.stopPropagation) {
296
297      e.stopPropagation();
298    }
299
300    /**
301     * This event is fired when the InfoBox's close box is clicked.
302     * @name InfoBox#closeclick
303     * @event
304     */
305    google.maps.event.trigger(me, "closeclick");
306
307    me.close();
308  };
309};
310
311/**
312 * Pans the map so that the InfoBox appears entirely within the map's visible area.
313 * @private
314 */
315InfoBox.prototype.panBox_ = function (disablePan) {
316
317  var map;
318  var bounds;
319  var xOffset = 0, yOffset = 0;
320
321  if (!disablePan) {
322
323    map = this.getMap();
324
325    if (map instanceof google.maps.Map) { // Only pan if attached to map, not panorama
326
327      if (!map.getBounds().contains(this.position_)) {
328      // Marker not in visible area of map, so set center
329      // of map to the marker position first.
330        map.setCenter(this.position_);
331      }
332
333      bounds = map.getBounds();
334
335      var mapDiv = map.getDiv();
336      var mapWidth = mapDiv.offsetWidth;
337      var mapHeight = mapDiv.offsetHeight;
338      var iwOffsetX = this.pixelOffset_.width;
339      var iwOffsetY = this.pixelOffset_.height;
340      var iwWidth = this.div_.offsetWidth;
341      var iwHeight = this.div_.offsetHeight;
342      var padX = this.infoBoxClearance_.width;
343      var padY = this.infoBoxClearance_.height;
344      var pixPosition = this.getProjection().fromLatLngToContainerPixel(this.position_);
345
346      if (pixPosition.x < (-iwOffsetX + padX)) {
347        xOffset = pixPosition.x + iwOffsetX - padX;
348      } else if ((pixPosition.x + iwWidth + iwOffsetX + padX) > mapWidth) {
349        xOffset = pixPosition.x + iwWidth + iwOffsetX + padX - mapWidth;
350      }
351      if (this.alignBottom_) {
352        if (pixPosition.y < (-iwOffsetY + padY + iwHeight)) {
353          yOffset = pixPosition.y + iwOffsetY - padY - iwHeight;
354        } else if ((pixPosition.y + iwOffsetY + padY) > mapHeight) {
355          yOffset = pixPosition.y + iwOffsetY + padY - mapHeight;
356        }
357      } else {
358        if (pixPosition.y < (-iwOffsetY + padY)) {
359          yOffset = pixPosition.y + iwOffsetY - padY;
360        } else if ((pixPosition.y + iwHeight + iwOffsetY + padY) > mapHeight) {
361          yOffset = pixPosition.y + iwHeight + iwOffsetY + padY - mapHeight;
362        }
363      }
364
365      if (!(xOffset === 0 && yOffset === 0)) {
366
367        // Move the map to the shifted center.
368        //
369        var c = map.getCenter();
370        map.panBy(xOffset, yOffset);
371      }
372    }
373  }
374};
375
376/**
377 * Sets the style of the InfoBox by setting the style sheet and applying
378 * other specific styles requested.
379 * @private
380 */
381InfoBox.prototype.setBoxStyle_ = function () {
382
383  var i, boxStyle;
384
385  if (this.div_) {
386
387    // Apply style values from the style sheet defined in the boxClass parameter:
388    this.div_.className = this.boxClass_;
389
390    // Clear existing inline style values:
391    this.div_.style.cssText = "";
392
393    // Apply style values defined in the boxStyle parameter:
394    boxStyle = this.boxStyle_;
395    for (i in boxStyle) {
396
397      if (boxStyle.hasOwnProperty(i)) {
398
399        this.div_.style[i] = boxStyle[i];
400      }
401    }
402
403    // Fix up opacity style for benefit of MSIE:
404    //
405    if (typeof this.div_.style.opacity !== "undefined" && this.div_.style.opacity !== "") {
406
407      this.div_.style.filter = "alpha(opacity=" + (this.div_.style.opacity * 100) + ")";
408    }
409
410    // Apply required styles:
411    //
412    this.div_.style.position = "absolute";
413    this.div_.style.visibility = 'hidden';
414    if (this.zIndex_ !== null) {
415
416      this.div_.style.zIndex = this.zIndex_;
417    }
418  }
419};
420
421/**
422 * Get the widths of the borders of the InfoBox.
423 * @private
424 * @return {Object} widths object (top, bottom left, right)
425 */
426InfoBox.prototype.getBoxWidths_ = function () {
427
428  var computedStyle;
429  var bw = {top: 0, bottom: 0, left: 0, right: 0};
430  var box = this.div_;
431
432  if (document.defaultView && document.defaultView.getComputedStyle) {
433
434    computedStyle = box.ownerDocument.defaultView.getComputedStyle(box, "");
435
436    if (computedStyle) {
437
438      // The computed styles are always in pixel units (good!)
439      bw.top = parseInt(computedStyle.borderTopWidth, 10) || 0;
440      bw.bottom = parseInt(computedStyle.borderBottomWidth, 10) || 0;
441      bw.left = parseInt(computedStyle.borderLeftWidth, 10) || 0;
442      bw.right = parseInt(computedStyle.borderRightWidth, 10) || 0;
443    }
444
445  } else if (document.documentElement.currentStyle) { // MSIE
446
447    if (box.currentStyle) {
448
449      // The current styles may not be in pixel units, but assume they are (bad!)
450      bw.top = parseInt(box.currentStyle.borderTopWidth, 10) || 0;
451      bw.bottom = parseInt(box.currentStyle.borderBottomWidth, 10) || 0;
452      bw.left = parseInt(box.currentStyle.borderLeftWidth, 10) || 0;
453      bw.right = parseInt(box.currentStyle.borderRightWidth, 10) || 0;
454    }
455  }
456
457  return bw;
458};
459
460/**
461 * Invoked when <tt>close</tt> is called. Do not call it directly.
462 */
463InfoBox.prototype.onRemove = function () {
464
465  if (this.div_) {
466
467    this.div_.parentNode.removeChild(this.div_);
468    this.div_ = null;
469  }
470};
471
472/**
473 * Draws the InfoBox based on the current map projection and zoom level.
474 */
475InfoBox.prototype.draw = function () {
476
477  this.createInfoBoxDiv_();
478
479  var pixPosition = this.getProjection().fromLatLngToDivPixel(this.position_);
480
481  this.div_.style.left = (pixPosition.x + this.pixelOffset_.width) + "px";
482  
483  if (this.alignBottom_) {
484    this.div_.style.bottom = -(pixPosition.y + this.pixelOffset_.height) + "px";
485  } else {
486    this.div_.style.top = (pixPosition.y + this.pixelOffset_.height) + "px";
487  }
488
489  if (this.isHidden_) {
490
491    this.div_.style.visibility = 'hidden';
492
493  } else {
494
495    this.div_.style.visibility = "visible";
496  }
497};
498
499/**
500 * Sets the options for the InfoBox. Note that changes to the <tt>maxWidth</tt>,
501 *  <tt>closeBoxMargin</tt>, <tt>closeBoxURL</tt>, and <tt>enableEventPropagation</tt>
502 *  properties have no affect until the current InfoBox is <tt>close</tt>d and a new one
503 *  is <tt>open</tt>ed.
504 * @param {InfoBoxOptions} opt_opts
505 */
506InfoBox.prototype.setOptions = function (opt_opts) {
507  if (typeof opt_opts.boxClass !== "undefined") { // Must be first
508
509    this.boxClass_ = opt_opts.boxClass;
510    this.setBoxStyle_();
511  }
512  if (typeof opt_opts.boxStyle !== "undefined") { // Must be second
513
514    this.boxStyle_ = opt_opts.boxStyle;
515    this.setBoxStyle_();
516  }
517  if (typeof opt_opts.content !== "undefined") {
518
519    this.setContent(opt_opts.content);
520  }
521  if (typeof opt_opts.disableAutoPan !== "undefined") {
522
523    this.disableAutoPan_ = opt_opts.disableAutoPan;
524  }
525  if (typeof opt_opts.maxWidth !== "undefined") {
526
527    this.maxWidth_ = opt_opts.maxWidth;
528  }
529  if (typeof opt_opts.pixelOffset !== "undefined") {
530
531    this.pixelOffset_ = opt_opts.pixelOffset;
532  }
533  if (typeof opt_opts.alignBottom !== "undefined") {
534
535    this.alignBottom_ = opt_opts.alignBottom;
536  }
537  if (typeof opt_opts.position !== "undefined") {
538
539    this.setPosition(opt_opts.position);
540  }
541  if (typeof opt_opts.zIndex !== "undefined") {
542
543    this.setZIndex(opt_opts.zIndex);
544  }
545  if (typeof opt_opts.closeBoxMargin !== "undefined") {
546
547    this.closeBoxMargin_ = opt_opts.closeBoxMargin;
548  }
549  if (typeof opt_opts.closeBoxURL !== "undefined") {
550
551    this.closeBoxURL_ = opt_opts.closeBoxURL;
552  }
553  if (typeof opt_opts.infoBoxClearance !== "undefined") {
554
555    this.infoBoxClearance_ = opt_opts.infoBoxClearance;
556  }
557  if (typeof opt_opts.isHidden !== "undefined") {
558
559    this.isHidden_ = opt_opts.isHidden;
560  }
561  if (typeof opt_opts.visible !== "undefined") {
562
563    this.isHidden_ = !opt_opts.visible;
564  }
565  if (typeof opt_opts.enableEventPropagation !== "undefined") {
566
567    this.enableEventPropagation_ = opt_opts.enableEventPropagation;
568  }
569
570  if (this.div_) {
571
572    this.draw();
573  }
574};
575
576/**
577 * Sets the content of the InfoBox.
578 *  The content can be plain text or an HTML DOM node.
579 * @param {string|Node} content
580 */
581InfoBox.prototype.setContent = function (content) {
582  this.content_ = content;
583
584  if (this.div_) {
585
586    if (this.closeListener_) {
587
588      google.maps.event.removeListener(this.closeListener_);
589      this.closeListener_ = null;
590    }
591
592    // Odd code required to make things work with MSIE.
593    //
594    if (!this.fixedWidthSet_) {
595
596      this.div_.style.width = "";
597    }
598
599    if (typeof content.nodeType === "undefined") {
600      this.div_.innerHTML = this.getCloseBoxImg_() + content;
601    } else {
602      this.div_.innerHTML = this.getCloseBoxImg_();
603      this.div_.appendChild(content);
604    }
605
606    // Perverse code required to make things work with MSIE.
607    // (Ensures the close box does, in fact, float to the right.)
608    //
609    if (!this.fixedWidthSet_) {
610      this.div_.style.width = this.div_.offsetWidth + "px";
611      if (typeof content.nodeType === "undefined") {
612        this.div_.innerHTML = this.getCloseBoxImg_() + content;
613      } else {
614        this.div_.innerHTML = this.getCloseBoxImg_();
615        this.div_.appendChild(content);
616      }
617    }
618
619    this.addClickHandler_();
620  }
621
622  /**
623   * This event is fired when the content of the InfoBox changes.
624   * @name InfoBox#content_changed
625   * @event
626   */
627  google.maps.event.trigger(this, "content_changed");
628};
629
630/**
631 * Sets the geographic location of the InfoBox.
632 * @param {LatLng} latlng
633 */
634InfoBox.prototype.setPosition = function (latlng) {
635
636  this.position_ = latlng;
637
638  if (this.div_) {
639
640    this.draw();
641  }
642
643  /**
644   * This event is fired when the position of the InfoBox changes.
645   * @name InfoBox#position_changed
646   * @event
647   */
648  google.maps.event.trigger(this, "position_changed");
649};
650
651/**
652 * Sets the zIndex style for the InfoBox.
653 * @param {number} index
654 */
655InfoBox.prototype.setZIndex = function (index) {
656
657  this.zIndex_ = index;
658
659  if (this.div_) {
660
661    this.div_.style.zIndex = index;
662  }
663
664  /**
665   * This event is fired when the zIndex of the InfoBox changes.
666   * @name InfoBox#zindex_changed
667   * @event
668   */
669  google.maps.event.trigger(this, "zindex_changed");
670};
671
672/**
673 * Sets the visibility of the InfoBox.
674 * @param {boolean} isVisible
675 */
676InfoBox.prototype.setVisible = function (isVisible) {
677
678  this.isHidden_ = !isVisible;
679  if (this.div_) {
680    this.div_.style.visibility = (this.isHidden_ ? "hidden" : "visible");
681  }
682};
683
684/**
685 * Returns the content of the InfoBox.
686 * @returns {string}
687 */
688InfoBox.prototype.getContent = function () {
689
690  return this.content_;
691};
692
693/**
694 * Returns the geographic location of the InfoBox.
695 * @returns {LatLng}
696 */
697InfoBox.prototype.getPosition = function () {
698
699  return this.position_;
700};
701
702/**
703 * Returns the zIndex for the InfoBox.
704 * @returns {number}
705 */
706InfoBox.prototype.getZIndex = function () {
707
708  return this.zIndex_;
709};
710
711/**
712 * Returns a flag indicating whether the InfoBox is visible.
713 * @returns {boolean}
714 */
715InfoBox.prototype.getVisible = function () {
716
717  var isVisible;
718
719  if ((typeof this.getMap() === "undefined") || (this.getMap() === null)) {
720    isVisible = false;
721  } else {
722    isVisible = !this.isHidden_;
723  }
724  return isVisible;
725};
726
727/**
728 * Shows the InfoBox. [Deprecated; use <tt>setVisible</tt> instead.]
729 */
730InfoBox.prototype.show = function () {
731
732  this.isHidden_ = false;
733  if (this.div_) {
734    this.div_.style.visibility = "visible";
735  }
736};
737
738/**
739 * Hides the InfoBox. [Deprecated; use <tt>setVisible</tt> instead.]
740 */
741InfoBox.prototype.hide = function () {
742
743  this.isHidden_ = true;
744  if (this.div_) {
745    this.div_.style.visibility = "hidden";
746  }
747};
748
749/**
750 * Adds the InfoBox to the specified map or Street View panorama. If <tt>anchor</tt>
751 *  (usually a <tt>google.maps.Marker</tt>) is specified, the position
752 *  of the InfoBox is set to the position of the <tt>anchor</tt>. If the
753 *  anchor is dragged to a new location, the InfoBox moves as well.
754 * @param {Map|StreetViewPanorama} map
755 * @param {MVCObject} [anchor]
756 */
757InfoBox.prototype.open = function (map, anchor) {
758
759  var me = this;
760
761  if (anchor) {
762
763    this.position_ = anchor.getPosition();
764    this.moveListener_ = google.maps.event.addListener(anchor, "position_changed", function () {
765      me.setPosition(this.getPosition());
766    });
767  }
768
769  this.setMap(map);
770
771  if (this.div_) {
772
773    this.panBox_();
774  }
775};
776
777/**
778 * Removes the InfoBox from the map.
779 */
780InfoBox.prototype.close = function () {
781
782  var i;
783
784  if (this.closeListener_) {
785
786    google.maps.event.removeListener(this.closeListener_);
787    this.closeListener_ = null;
788  }
789
790  if (this.eventListeners_) {
791    
792    for (i = 0; i < this.eventListeners_.length; i++) {
793
794      google.maps.event.removeListener(this.eventListeners_[i]);
795    }
796    this.eventListeners_ = null;
797  }
798
799  if (this.moveListener_) {
800
801    google.maps.event.removeListener(this.moveListener_);
802    this.moveListener_ = null;
803  }
804
805  if (this.contextListener_) {
806
807    google.maps.event.removeListener(this.contextListener_);
808    this.contextListener_ = null;
809  }
810
811  this.setMap(null);
812};