public/lib/OpenLayers/Popup.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 /**\r
   5 * @class\r
   6 */\r
   7 OpenLayers.Popup = Class.create();\r
   8 \r
   9 OpenLayers.Popup.count = 0;\r
  10 OpenLayers.Popup.WIDTH = 200;\r
  11 OpenLayers.Popup.HEIGHT = 200;\r
  12 OpenLayers.Popup.COLOR = "white";\r
  13 OpenLayers.Popup.OPACITY = 1;\r
  14 OpenLayers.Popup.BORDER = "0px";\r
  15 \r
  16 OpenLayers.Popup.prototype = {\r
  17 \r
  18     /** @type OpenLayers.Events*/\r
  19     events: null,\r
  20     \r
  21     /** @type String */\r
  22     id: "",\r
  23 \r
  24     /** @type OpenLayers.LonLat */\r
  25     lonlat: null,\r
  26 \r
  27     /** @type DOMElement */\r
  28     div: null,\r
  29 \r
  30     /** @type OpenLayers.Size*/\r
  31     size: null,    \r
  32 \r
  33     /** @type String */\r
  34     contentHTML: "",\r
  35     \r
  36     /** @type String */\r
  37     backgroundColor: "",\r
  38     \r
  39     /** @type float */\r
  40     opacity: "",\r
  41 \r
  42     /** @type String */\r
  43     border: "",\r
  44 \r
  45     /** this gets set in Map.js when the popup is added to the map\r
  46      * @type OpenLayers.Map */\r
  47     map: null,\r
  48 \r
  49     /** \r
  50     * @constructor\r
  51     * \r
  52     * @param {String} id\r
  53     * @param {OpenLayers.LonLat} lonlat\r
  54     * @param {OpenLayers.Size} size\r
  55     * @param {String} contentHTML\r
  56     */\r
  57     initialize:function(id, lonlat, size, contentHTML) {\r
  58         OpenLayers.Popup.count += 1;\r
  59         this.id = (id != null) ? id : "Popup" + OpenLayers.Popup.count;\r
  60         this.lonlat = lonlat;\r
  61         this.size = (size != null) ? size \r
  62                                   : new OpenLayers.Size(\r
  63                                                    OpenLayers.Popup.WIDTH,\r
  64                                                    OpenLayers.Popup.HEIGHT);\r
  65         if (contentHTML != null) { \r
  66              this.contentHTML = contentHTML;\r
  67         }\r
  68         this.backgroundColor = OpenLayers.Popup.COLOR;\r
  69         this.opacity = OpenLayers.Popup.OPACITY;\r
  70         this.border = OpenLayers.Popup.BORDER;\r
  71 \r
  72         this.div = OpenLayers.Util.createDiv(this.id + "_div", null, null, \r
  73                                              null, null, null, "hidden");\r
  74 \r
  75         this.events = new OpenLayers.Events(this, this.div, null);\r
  76     },\r
  77 \r
  78     /** \r
  79     */\r
  80     destroy: function() {\r
  81         if (this.map != null) {\r
  82             this.map.removePopup(this);\r
  83         }\r
  84         this.div = null;\r
  85         this.map = null;\r
  86     },\r
  87 \r
  88     /** \r
  89     * @param {OpenLayers.Pixel} px\r
  90     * \r
  91     * @returns Reference to a div that contains the drawn popup\r
  92     * @type DOMElement\r
  93     */\r
  94     draw: function(px) {\r
  95         if (px == null) {\r
  96             if ((this.lonlat != null) && (this.map != null)) {\r
  97                 px = this.map.getLayerPxFromLonLat(this.lonlat);\r
  98             }\r
  99         }\r
 100         \r
 101         this.setSize();\r
 102         this.setBackgroundColor();\r
 103         this.setOpacity();\r
 104         this.setBorder();\r
 105         this.setContentHTML();\r
 106         this.moveTo(px);\r
 107 \r
 108         return this.div;\r
 109     },\r
 110 \r
 111     /** \r
 112      * if the popup has a lonlat and its map members set, \r
 113      *  then have it move itself to its proper position\r
 114      */\r
 115     updatePosition: function() {\r
 116         if ((this.lonlat) && (this.map)) {\r
 117                 var px = this.map.getLayerPxFromLonLat(this.lonlat);\r
 118                 this.moveTo(px);            \r
 119         }\r
 120     },\r
 121 \r
 122     /**\r
 123     * @param {OpenLayers.Pixel} px\r
 124     */\r
 125     moveTo: function(px) {\r
 126         if ((px != null) && (this.div != null)) {\r
 127             this.div.style.left = px.x + "px";\r
 128             this.div.style.top = px.y + "px";\r
 129         }\r
 130     },\r
 131 \r
 132     /**\r
 133      * @returns Boolean indicating whether or not the popup is visible\r
 134      * @type Boolean\r
 135      */\r
 136     visible: function() {\r
 137         return Element.visible(this.div);\r
 138     },\r
 139 \r
 140     /**\r
 141      * \r
 142      */\r
 143     toggle: function() {\r
 144         Element.toggle(this.div);\r
 145     },\r
 146 \r
 147     /**\r
 148      *\r
 149      */\r
 150     show: function() {\r
 151         Element.show(this.div);\r
 152     },\r
 153 \r
 154     /**\r
 155      *\r
 156      */\r
 157     hide: function() {\r
 158         Element.hide(this.div);\r
 159     },\r
 160 \r
 161     /**\r
 162     * @param {OpenLayers.Size} size\r
 163     */\r
 164     setSize:function(size) { \r
 165         if (size != undefined) {\r
 166             this.size = size; \r
 167         }\r
 168         \r
 169         if (this.div != null) {\r
 170             this.div.style.width = this.size.w;\r
 171             this.div.style.height = this.size.h;\r
 172         }\r
 173     },  \r
 174 \r
 175     /**\r
 176     * @param {String} color\r
 177     */\r
 178     setBackgroundColor:function(color) { \r
 179         if (color != undefined) {\r
 180             this.backgroundColor = color; \r
 181         }\r
 182         \r
 183         if (this.div != null) {\r
 184             this.div.style.backgroundColor = this.backgroundColor;\r
 185         }\r
 186     },  \r
 187     \r
 188     /**\r
 189     * @param {float} opacity\r
 190     */\r
 191     setOpacity:function(opacity) { \r
 192         if (opacity != undefined) {\r
 193             this.opacity = opacity; \r
 194         }\r
 195         \r
 196         if (this.div != null) {\r
 197             // for Mozilla and Safari\r
 198             this.div.style.opacity = this.opacity;\r
 199 \r
 200             // for IE\r
 201             this.div.style.filter = 'alpha(opacity=' + this.opacity*100 + ')';\r
 202         }\r
 203     },  \r
 204     \r
 205     /**\r
 206     * @param {int} border\r
 207     */\r
 208     setBorder:function(border) { \r
 209         if (border != undefined) {\r
 210             this.border = border;\r
 211         }\r
 212         \r
 213         if (this.div != null) {\r
 214             this.div.style.border = this.border;\r
 215         }\r
 216     },      \r
 217     \r
 218     /**\r
 219     * @param {String} contentHTML\r
 220     */\r
 221     setContentHTML:function(contentHTML) {\r
 222         if (contentHTML != null) {\r
 223             this.contentHTML = contentHTML;\r
 224         }\r
 225         \r
 226         if (this.div != null) {\r
 227             this.div.innerHTML = this.contentHTML;\r
 228         }    \r
 229     },\r
 230 \r
 231     CLASS_NAME: "OpenLayers.Popup"\r
 232 };\r