public/lib/OpenLayers/Popup/AnchoredBubble.js

   1 /* Copyright (c) 2006 MetaCarta, Inc., published under the BSD license.
   2  * See http://svn.openlayers.org/trunk/openlayers/license.txt for the full
   3  * text of the license. */
   4 // @require: OpenLayers/Popup/Anchored.js\r
   5 \r
   6 /**\r
   7 * @class\r
   8 */\r
   9 OpenLayers.Popup.AnchoredBubble = Class.create();\r
  10 \r
  11 //Border space for the rico corners\r
  12 OpenLayers.Popup.AnchoredBubble.CORNER_SIZE = 5;\r
  13 \r
  14 OpenLayers.Popup.AnchoredBubble.prototype =\r
  15    Object.extend( new OpenLayers.Popup.Anchored(), {\r
  16 \r
  17     /** @type DOMElement */\r
  18     contentDiv:null,\r
  19 \r
  20     \r
  21     /** \r
  22     * @constructor\r
  23     * \r
  24     * @param {String} id\r
  25     * @param {OpenLayers.LonLat} lonlat\r
  26     * @param {OpenLayers.Size} size\r
  27     * @param {String} contentHTML\r
  28     * @param {Object} anchor  Object which must expose a \r
  29     *                         - 'size' (OpenLayers.Size) and \r
  30     *                         - 'offset' (OpenLayers.Pixel) \r
  31     *                         (this is generally an OpenLayers.Icon)\r
  32     */\r
  33     initialize:function(id, lonlat, size, contentHTML, anchor) {\r
  34         OpenLayers.Popup.Anchored.prototype.initialize.apply(this, arguments);\r
  35     },\r
  36 \r
  37     /** \r
  38     * @param {OpenLayers.Pixel} px\r
  39     * \r
  40     * @returns Reference to a div that contains the drawn popup\r
  41     * @type DOMElement\r
  42     */\r
  43     draw: function(px) {\r
  44         \r
  45         OpenLayers.Popup.Anchored.prototype.draw.apply(this, arguments);\r
  46 \r
  47         // make the content Div\r
  48         var contentSize = this.size.copyOf();\r
  49         contentSize.h -= (2 * OpenLayers.Popup.AnchoredBubble.CORNER_SIZE);\r
  50 \r
  51         var id = this.div.id + "-contentDiv";\r
  52         this.contentDiv = OpenLayers.Util.createDiv(id, null, contentSize, \r
  53                                                     null, "relative", null,\r
  54                                                     "hidden");\r
  55         this.div.appendChild(this.contentDiv);\r
  56         this.setContentHTML();\r
  57         \r
  58         this.setRicoCorners(true);\r
  59         \r
  60         //set the popup color and opacity           \r
  61         this.setBackgroundColor(); \r
  62         this.setOpacity();\r
  63 \r
  64         return this.div;\r
  65     },\r
  66 \r
  67     /**\r
  68     * @param {OpenLayers.Size} size\r
  69     */\r
  70     setSize:function(size) { \r
  71         OpenLayers.Popup.Anchored.prototype.setSize.apply(this, arguments);\r
  72         \r
  73         if (this.contentDiv != null) {\r
  74 \r
  75             var contentSize = this.size.copyOf();\r
  76             contentSize.h -= (2 * OpenLayers.Popup.AnchoredBubble.CORNER_SIZE);\r
  77     \r
  78             this.contentDiv.style.height = contentSize.h + "px";\r
  79             \r
  80             //size has changed - must redo corners        \r
  81             this.setRicoCorners(false);\r
  82         }\r
  83     },  \r
  84 \r
  85     /**\r
  86      * @param {String} color\r
  87      */\r
  88     setBackgroundColor:function(color) { \r
  89         if (color != undefined) {\r
  90             this.backgroundColor = color; \r
  91         }\r
  92         \r
  93         if (this.div != null) {\r
  94             if (this.contentDiv != null) {\r
  95                 this.div.style.background = "transparent";\r
  96                 Rico.Corner.changeColor(this.contentDiv, this.backgroundColor);\r
  97             }\r
  98         }\r
  99     },  \r
 100     \r
 101     /**\r
 102      * @param {float} opacity\r
 103      */\r
 104     setOpacity:function(opacity) { \r
 105         if (opacity != undefined) {\r
 106             this.opacity = opacity; \r
 107         }\r
 108         \r
 109         if (this.div != null) {\r
 110             if (this.contentDiv != null) {\r
 111             Rico.Corner.changeOpacity(this.contentDiv, this.opacity);\r
 112             }\r
 113         }\r
 114     },  \r
 115  \r
 116     /** Bubble Popups can not have a border\r
 117      * \r
 118      * @param {int} border\r
 119      */\r
 120     setBorder:function(border) { \r
 121         this.border = 0;\r
 122     },      \r
 123  \r
 124     /**\r
 125      * @param {String} contentHTML\r
 126      */\r
 127     setContentHTML:function(contentHTML) {\r
 128         if (contentHTML != null) {\r
 129             this.contentHTML = contentHTML;\r
 130         }\r
 131         \r
 132         if (this.contentDiv != null) {\r
 133             this.contentDiv.innerHTML = this.contentHTML;\r
 134         }    \r
 135     },\r
 136     \r
 137     /** \r
 138      * @private\r
 139      * \r
 140      * @param {Boolean} firstTime Is this the first time the corners are being\r
 141      *                             rounded?\r
 142      * \r
 143      * update the rico corners according to the popup's\r
 144      * current relative postion \r
 145      */\r
 146     setRicoCorners:function(firstTime) {\r
 147     \r
 148         var corners = this.getCornersToRound(this.relativePosition);\r
 149         var options = {corners: corners,\r
 150                          color: this.backgroundColor,\r
 151                        bgColor: "transparent",\r
 152                          blend: false};\r
 153 \r
 154         if (firstTime) {\r
 155             Rico.Corner.round(this.div, options);\r
 156         } else {\r
 157             Rico.Corner.reRound(this.contentDiv, options);\r
 158             //set the popup color and opacity\r
 159             this.setBackgroundColor(); \r
 160             this.setOpacity();\r
 161         }\r
 162     },\r
 163 \r
 164     /** \r
 165      * @private\r
 166      * \r
 167      * @returns The proper corners string ("tr tl bl br") for rico\r
 168      *           to round\r
 169      * @type String\r
 170      */\r
 171     getCornersToRound:function() {\r
 172 \r
 173         var corners = ['tl', 'tr', 'bl', 'br'];\r
 174 \r
 175         //we want to round all the corners _except_ the opposite one. \r
 176         var corner = OpenLayers.Bounds.oppositeQuadrant(this.relativePosition);\r
 177         corners.remove(corner);\r
 178 \r
 179         return corners.join(" ");\r
 180     },\r
 181 \r
 182     CLASS_NAME: "OpenLayers.Popup.AnchoredBubble"\r
 183 });\r