← Back to branch summary

~mortenoh/+junk/dhis2-detailed-import-export

« back to all changes in this revision

Viewing changes to gis/dhis-gis-geostat/mfbase/openlayers/examples/popupMatrix.html

  • Committer: larshelge at gmail
  • Date: 2009-03-03 16:46:36 UTC
  • Revision ID: larshelge@gmail.com-20090303164636-2sjlrquo7ib1gf7r
Initial check-in

Show diffs side-by-side

added added

removed removed

Lines of Context:
gis/dhis-gis-geostat/mfbase/openlayers/examples/popupMatrix.html
 
1
<html xmlns="http://www.w3.org/1999/xhtml" debug="true">
 
2
  <head>
 
3
    <title>OpenLayers: Popup Mayhem</title>
 
4
    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
 
5
    <link rel="stylesheet" href="style.css" type="text/css" />
 
6
    <style type="text/css">
 
7
        #map {
 
8
            width: 900px;
 
9
            height: 500px;
 
10
            border: 1px solid black;
 
11
            background-color: blue;
 
12
        }
 
13
    </style>
 
14
 
 
15
    <link rel="stylesheet" href="../theme/default/framedCloud.css" type="text/css" />
 
16
 
 
17
    <script src="../lib/Firebug/firebug.js"></script>
 
18
    <script src="../lib/OpenLayers.js"></script>
 
19
    <script type="text/javascript">
 
20
        var map;
 
21
        var layer, markers;
 
22
        
 
23
        var currentPopup;
 
24
        
 
25
        var samplePopupContentsHTML = "Old man down, way down down, down by the docks of the city.<br>Blind and dirty, asked me for a dime, a dime for a cup of coffee.<br>I got no dime but I got some time to hear his story.<br>My name is August West, and I love my Pearly Baker best more than my wine.<br>More than my wine - more than my maker, though he's no friend of mine.<br><br>Everyone said, I'd come to no good, I knew I would Pearly, believe them.<br>Half of my life, I spent doin' time for some other fucker's crime,<br>The other half found me stumbling 'round drunk on Burgundy wine.<br><br>But I'll get back on my feet again someday,<br>The good Lord willin', if He says I may.<br>I know that the life i'm livin's no good,<br>I'll get a new start, live the life I should.<br>I'll get up and fly away, I'll get up and fly away, fly away.<br><br>Pearly's been true, true to me, true to my dyin' day he said,<br>I said to him, I said to him, I'm sure she's been.<br>I said to him, I'm sure she's been tru to you.<br><br>Got up and wandered, wandered downtown, nowhere to go but just hang around.<br>I've got a girl, named Bonnie Lee, I know that girl's been true to me.<br>I know she's been, I'm sure she's been true to me.<br><br>";
 
26
        var samplePopupContentsHTML_WideShort = "Old man down, way down down, down by the docks of the city.Blind and dirty, asked me for a dime, a dime for a cup of coffee.I got no dime but I got some time to hear his story.My name is August West, and I love my Pearly Baker best more than my wine.More than my wine - more than my maker, though he's no friend of mine.Everyone said, I'd come to no good, I knew I would Pearly, believe them.<br>Half of my life, I spent doin' time for some other fucker's crime,The other half found me stumbling 'round drunk on Burgundy wine.But I'll get back on my feet again someday,The good Lord willin', if He says I may.I know that the life i'm livin's no good,I'll get a new start, live the life I should.I'll get up and fly away, I'll get up and fly away, fly away.Pearly's been true, true to me, true to my dyin' day he said,I said to him, I said to him, I'm sure she's been.I said to him, I'm sure she's been tru to you.Got up and wandered, wandered downtown, nowhere to go but just hang around.I've got a girl, named Bonnie Lee, I know that girl's been true to me.I know she's been, I'm sure she's been true to me.";
 
27
        
 
28
// different popup types
 
29
 
 
30
    //anchored
 
31
        AutoSizeAnchored = OpenLayers.Class(OpenLayers.Popup.Anchored, {
 
32
            'autoSize': true
 
33
        });
 
34
 
 
35
        AutoSizeAnchoredMinSize = OpenLayers.Class(OpenLayers.Popup.Anchored, {
 
36
            'autoSize': true, 
 
37
            'minSize': new OpenLayers.Size(400,400)
 
38
        });
 
39
 
 
40
        AutoSizeAnchoredMaxSize = OpenLayers.Class(OpenLayers.Popup.Anchored, {
 
41
            'autoSize': true, 
 
42
            'maxSize': new OpenLayers.Size(100,100)
 
43
        });
 
44
 
 
45
        //anchoredbubble
 
46
    
 
47
        AutoSizeAnchoredBubble = OpenLayers.Class(OpenLayers.Popup.AnchoredBubble, {
 
48
            'autoSize': true
 
49
        });
 
50
 
 
51
        AutoSizeAnchoredBubbleMinSize = OpenLayers.Class(OpenLayers.Popup.AnchoredBubble, {
 
52
            'autoSize': true, 
 
53
            'minSize': new OpenLayers.Size(400,400)
 
54
        });
 
55
 
 
56
        AutoSizeAnchoredBubbleMaxSize = OpenLayers.Class(OpenLayers.Popup.AnchoredBubble, {
 
57
            'autoSize': true, 
 
58
            'maxSize': new OpenLayers.Size(100,100)
 
59
        });
 
60
 
 
61
        //framed
 
62
 
 
63
        //disable the autosize for the purpose of our matrix
 
64
        OpenLayers.Popup.FramedCloud.prototype.autoSize = false;
 
65
 
 
66
        AutoSizeFramedCloud = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {
 
67
            'autoSize': true
 
68
        });
 
69
 
 
70
        AutoSizeFramedCloudMinSize = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {
 
71
            'autoSize': true, 
 
72
            'minSize': new OpenLayers.Size(400,400)
 
73
        });
 
74
 
 
75
        AutoSizeFramedCloudMaxSize = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {
 
76
            'autoSize': true, 
 
77
            'maxSize': new OpenLayers.Size(100,100)
 
78
        });
 
79
 
 
80
        
 
81
        function init(){
 
82
            map = new OpenLayers.Map('map');
 
83
 
 
84
            layer = new OpenLayers.Layer.Image(
 
85
                "popupMatrix", 
 
86
                "popupMatrix.jpg", 
 
87
                new OpenLayers.Bounds(-82.5,-71.5,97.5,67.5),
 
88
                new OpenLayers.Size(1024,768)
 
89
            );
 
90
            map.addLayer(layer);
 
91
 
 
92
            markers = new OpenLayers.Layer.Markers("zibo");
 
93
            map.addLayer(markers);
 
94
 
 
95
            map.addControl(new OpenLayers.Control.LayerSwitcher());
 
96
            map.zoomToMaxExtent();
 
97
 
 
98
            addMarkers();
 
99
        }
 
100
        
 
101
        function addMarkers() {
 
102
 
 
103
            var ll, popupClass, popupContentHTML;
 
104
 
 
105
        //
 
106
        //Anchored NO OVERFLOW
 
107
        //
 
108
 
 
109
            //anchored popup small contents no autosize
 
110
            ll = new OpenLayers.LonLat(-55,20);
 
111
            popupClass = OpenLayers.Popup.Anchored;
 
112
            popupContentHTML = '<img src="small.jpg"></img>';
 
113
            addMarker(ll, popupClass, popupContentHTML);
 
114
 
 
115
            //anchored popup small contents no autosize closebox
 
116
            var ll = new OpenLayers.LonLat(-50,20);
 
117
            popupClass = OpenLayers.Popup.Anchored;
 
118
            popupContentHTML = '<img src="small.jpg"></img>';
 
119
            addMarker(ll, popupClass, popupContentHTML, true);
 
120
 
 
121
 
 
122
            //anchored popup small contents autosize
 
123
            ll = new OpenLayers.LonLat(-40,20);
 
124
            popupClass = AutoSizeAnchored;
 
125
            popupContentHTML = '<img src="small.jpg"></img>';
 
126
            addMarker(ll, popupClass, popupContentHTML);
 
127
 
 
128
            //anchored popup small contents autosize closebox
 
129
            ll = new OpenLayers.LonLat(-35,20);
 
130
            popupClass = AutoSizeAnchored;
 
131
            popupContentHTML = '<img src="small.jpg"></img>';
 
132
            addMarker(ll, popupClass, popupContentHTML, true);
 
133
 
 
134
 
 
135
            //anchored popup small contents autosize minsize
 
136
            ll = new OpenLayers.LonLat(-25,20);
 
137
            popupClass = AutoSizeAnchoredMinSize;
 
138
            popupContentHTML = '<img src="small.jpg"></img>';
 
139
            addMarker(ll, popupClass, popupContentHTML);
 
140
 
 
141
            //anchored popup small contents autosize minsize closebox
 
142
            ll = new OpenLayers.LonLat(-20,20);
 
143
            popupClass = AutoSizeAnchoredMinSize;
 
144
            popupContentHTML = '<img src="small.jpg"></img>';
 
145
            addMarker(ll, popupClass, popupContentHTML, true);
 
146
 
 
147
 
 
148
            //anchored popup small contents autosize maxsize
 
149
            ll = new OpenLayers.LonLat(-10,20);
 
150
            popupClass = AutoSizeAnchoredMaxSize;
 
151
            popupContentHTML = '<img src="small.jpg"></img>';
 
152
            addMarker(ll, popupClass, popupContentHTML);
 
153
 
 
154
            //anchored popup small contents autosize maxsize closebox
 
155
            ll = new OpenLayers.LonLat(-5,20);
 
156
            popupClass = AutoSizeAnchoredMaxSize;
 
157
            popupContentHTML = '<img src="small.jpg"></img>';
 
158
            addMarker(ll, popupClass, popupContentHTML, true);
 
159
 
 
160
 
 
161
            //anchored popup bigger contents autosize
 
162
            ll = new OpenLayers.LonLat(5,20);
 
163
            popupClass = AutoSizeAnchored;
 
164
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>' + samplePopupContentsHTML + '</div>' 
 
165
            addMarker(ll, popupClass, popupContentHTML);
 
166
 
 
167
            //anchored popup bigger contents autosize closebox
 
168
            ll = new OpenLayers.LonLat(10,20);
 
169
            popupClass = AutoSizeAnchored;
 
170
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
 
171
            addMarker(ll, popupClass, popupContentHTML, true);
 
172
 
 
173
            //anchored popup wide short text contents autosize
 
174
            ll = new OpenLayers.LonLat(20,20);
 
175
            popupClass = AutoSizeAnchored;
 
176
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize - wide short text<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
177
            addMarker(ll, popupClass, popupContentHTML);
 
178
 
 
179
            //anchored popup wide short text contents autosize closebox
 
180
            ll = new OpenLayers.LonLat(25,20);
 
181
            popupClass = AutoSizeAnchored;
 
182
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize - wide short text<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
183
            addMarker(ll, popupClass, popupContentHTML, true);
 
184
 
 
185
 
 
186
            //anchored popup wide short fixed contents autosize
 
187
            ll = new OpenLayers.LonLat(35,20);
 
188
            popupClass = AutoSizeAnchored;
 
189
            popupContentHTML = '<img src="wideshort.jpg"></img>';
 
190
            addMarker(ll, popupClass, popupContentHTML);
 
191
 
 
192
            //anchored popup wide short fixed contents autosize closebox
 
193
            ll = new OpenLayers.LonLat(40,20);
 
194
            popupClass = AutoSizeAnchored;
 
195
            popupContentHTML = '<img src="wideshort.jpg"></img>';
 
196
            addMarker(ll, popupClass, popupContentHTML, true);
 
197
 
 
198
 
 
199
            //anchored popup thin long fixed contents autosize
 
200
            ll = new OpenLayers.LonLat(50,20);
 
201
            popupClass = AutoSizeAnchored;
 
202
            popupContentHTML = '<img src="thinlong.jpg"></img>';
 
203
            addMarker(ll, popupClass, popupContentHTML);
 
204
 
 
205
            //anchored popup thin long fixed contents autosize closebox
 
206
            ll = new OpenLayers.LonLat(55,20);
 
207
            popupClass = AutoSizeAnchored;
 
208
            popupContentHTML = '<img src="thinlong.jpg"></img>';
 
209
            addMarker(ll, popupClass, popupContentHTML, true);
 
210
 
 
211
 
 
212
            //anchored popup wide long fixed contents autosize
 
213
            ll = new OpenLayers.LonLat(65,20);
 
214
            popupClass = AutoSizeAnchored;
 
215
            popupContentHTML = '<img  src="widelong.jpg"></img>' 
 
216
            addMarker(ll, popupClass, popupContentHTML);
 
217
 
 
218
            //anchored popup wide long fixed contents autosize closebox
 
219
            ll = new OpenLayers.LonLat(70,20);
 
220
            popupClass = AutoSizeAnchored;
 
221
            popupContentHTML = '<img  src="widelong.jpg"></img>' 
 
222
            addMarker(ll, popupClass, popupContentHTML, true);
 
223
 
 
224
        //
 
225
        //Anchored WITH OVERFLOW
 
226
        //
 
227
 
 
228
            //anchored popup small contents no autosize overflow
 
229
            var ll = new OpenLayers.LonLat(-55,15);
 
230
            popupClass = OpenLayers.Popup.Anchored;
 
231
            popupContentHTML = '<img src="small.jpg"></img>';
 
232
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
233
 
 
234
            //anchored popup small contents no autosize closebox overflow
 
235
            var ll = new OpenLayers.LonLat(-50,15);
 
236
            popupClass = OpenLayers.Popup.Anchored;
 
237
            popupContentHTML = '<img src="small.jpg"></img>';
 
238
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
239
 
 
240
 
 
241
            //anchored popup small contents autosize overflow
 
242
            ll = new OpenLayers.LonLat(-40,15);
 
243
            popupClass = AutoSizeAnchored;
 
244
            popupContentHTML = '<img src="small.jpg"></img>';
 
245
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
246
 
 
247
            //anchored popup small contents autosize closebox overflow
 
248
            ll = new OpenLayers.LonLat(-35,15);
 
249
            popupClass = AutoSizeAnchored;
 
250
            popupContentHTML = '<img src="small.jpg"></img>';
 
251
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
252
 
 
253
 
 
254
            //anchored popup small contents autosize minsize overflow
 
255
            ll = new OpenLayers.LonLat(-25,15);
 
256
            popupClass = AutoSizeAnchoredMinSize;
 
257
            popupContentHTML = '<img src="small.jpg"></img>';
 
258
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
259
 
 
260
            //anchored popup small contents autosize minsize closebox overflow
 
261
            ll = new OpenLayers.LonLat(-20,15);
 
262
            popupClass = AutoSizeAnchoredMinSize;
 
263
            popupContentHTML = '<img src="small.jpg"></img>';
 
264
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
265
 
 
266
 
 
267
            //anchored popup small contents autosize maxsize overflow
 
268
            ll = new OpenLayers.LonLat(-10,15);
 
269
            popupClass = AutoSizeAnchoredMaxSize;
 
270
            popupContentHTML = '<img src="small.jpg"></img>';
 
271
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
272
 
 
273
            //anchored popup small contents autosize maxsize closebox overflow
 
274
            ll = new OpenLayers.LonLat(-5,15);
 
275
            popupClass = AutoSizeAnchoredMaxSize;
 
276
            popupContentHTML = '<img src="small.jpg"></img>';
 
277
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
278
 
 
279
 
 
280
            //anchored popup bigger contents autosize overflow
 
281
            ll = new OpenLayers.LonLat(5,15);
 
282
            popupClass = AutoSizeAnchored;
 
283
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
 
284
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
285
 
 
286
            //anchored popup bigger contents autosize closebox overflow
 
287
            ll = new OpenLayers.LonLat(10,15);
 
288
            popupClass = AutoSizeAnchored;
 
289
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
 
290
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
291
 
 
292
 
 
293
            //anchored popup wide short text contents autosize overflow
 
294
            ll = new OpenLayers.LonLat(20,15);
 
295
            popupClass = AutoSizeAnchored;
 
296
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
297
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
298
 
 
299
            //anchored popup wide short text contents autosize closebox overflow
 
300
            ll = new OpenLayers.LonLat(25,15);
 
301
            popupClass = AutoSizeAnchored;
 
302
            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
303
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
304
 
 
305
            //anchored popup wide short fixed contents autosize overflow
 
306
            ll = new OpenLayers.LonLat(35,15);
 
307
            popupClass = AutoSizeAnchored;
 
308
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
309
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
310
 
 
311
            //anchored popup wide short fixed contents autosize closebox overflow
 
312
            ll = new OpenLayers.LonLat(40,15);
 
313
            popupClass = AutoSizeAnchored;
 
314
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
315
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
316
 
 
317
 
 
318
            //anchored popup thin long fixed contents autosize overflow
 
319
            ll = new OpenLayers.LonLat(50,15);
 
320
            popupClass = AutoSizeAnchored;
 
321
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
322
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
323
 
 
324
            //anchored popup thin long fixed contents autosize closebox overflow
 
325
            ll = new OpenLayers.LonLat(55,15);
 
326
            popupClass = AutoSizeAnchored;
 
327
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
328
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
329
 
 
330
 
 
331
            //anchored popup wide long fixed contents autosize overflow
 
332
            ll = new OpenLayers.LonLat(65,15);
 
333
            popupClass = AutoSizeAnchored;
 
334
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
335
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
336
 
 
337
            //anchored popup wide long fixed contents autosize closebox overflow
 
338
            ll = new OpenLayers.LonLat(70,15);
 
339
            popupClass = AutoSizeAnchored;
 
340
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
341
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
342
 
 
343
 
 
344
        //
 
345
        //Bubble NO OVERFLOW
 
346
        //
 
347
 
 
348
            //anchored bubble popup small contents no autosize
 
349
            var ll = new OpenLayers.LonLat(-55,5);
 
350
            popupClass = OpenLayers.Popup.AnchoredBubble;
 
351
            popupContentHTML = '<img src="small.jpg"></img>';
 
352
            addMarker(ll, popupClass, popupContentHTML, false);
 
353
 
 
354
            //anchored bubble popup small contents no autosize closebox
 
355
            var ll = new OpenLayers.LonLat(-50,5);
 
356
            popupClass = OpenLayers.Popup.AnchoredBubble;
 
357
            popupContentHTML = '<img src="small.jpg"></img>';
 
358
            addMarker(ll, popupClass, popupContentHTML, true);
 
359
 
 
360
 
 
361
            //anchored bubble popup small contents autosize
 
362
            ll = new OpenLayers.LonLat(-40,5);
 
363
            popupClass = AutoSizeAnchoredBubble;
 
364
            popupContentHTML = '<img src="small.jpg"></img>';
 
365
            addMarker(ll, popupClass, popupContentHTML, false);
 
366
 
 
367
            //anchored bubble popup small contents autosize closebox
 
368
            ll = new OpenLayers.LonLat(-35,5);
 
369
            popupClass = AutoSizeAnchoredBubble;
 
370
            popupContentHTML = '<img src="small.jpg"></img>';
 
371
            addMarker(ll, popupClass, popupContentHTML, true);
 
372
 
 
373
 
 
374
            //anchored bubble popup small contents autosize minsize
 
375
            ll = new OpenLayers.LonLat(-25,5);
 
376
            popupClass = AutoSizeAnchoredBubbleMinSize;
 
377
            popupContentHTML = '<img src="small.jpg"></img>';
 
378
            addMarker(ll, popupClass, popupContentHTML, false);
 
379
 
 
380
            //anchored bubble popup small contents autosize minsize closebox
 
381
            ll = new OpenLayers.LonLat(-20,5);
 
382
            popupClass = AutoSizeAnchoredBubbleMinSize;
 
383
            popupContentHTML = '<img src="small.jpg"></img>';
 
384
            addMarker(ll, popupClass, popupContentHTML, true);
 
385
 
 
386
 
 
387
            //anchored bubble popup small contents autosize maxsize
 
388
            ll = new OpenLayers.LonLat(-10,5);
 
389
            popupClass = AutoSizeAnchoredBubbleMaxSize;
 
390
            popupContentHTML = '<img src="small.jpg"></img>';
 
391
            addMarker(ll, popupClass, popupContentHTML, false);
 
392
 
 
393
            //anchored bubble popup small contents autosize maxsize closebox
 
394
            ll = new OpenLayers.LonLat(-5,5);
 
395
            popupClass = AutoSizeAnchoredBubbleMaxSize;
 
396
            popupContentHTML = '<img src="small.jpg"></img>';
 
397
            addMarker(ll, popupClass, popupContentHTML, true);
 
398
 
 
399
 
 
400
            //anchored bubble popup bigger contents autosize closebox
 
401
            ll = new OpenLayers.LonLat(5,5);
 
402
            popupClass = AutoSizeAnchoredBubble;
 
403
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>' + samplePopupContentsHTML + '</div>' 
 
404
            addMarker(ll, popupClass, popupContentHTML, false);
 
405
 
 
406
            //anchored bubble popup bigger contents autosize closebox
 
407
            ll = new OpenLayers.LonLat(10,5);
 
408
            popupClass = AutoSizeAnchoredBubble;
 
409
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
 
410
            addMarker(ll, popupClass, popupContentHTML, true);
 
411
 
 
412
 
 
413
            //anchored bubble popup wide short text contents autosize
 
414
            ll = new OpenLayers.LonLat(20,5);
 
415
            popupClass = AutoSizeAnchoredBubble;
 
416
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize - wide short text<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
417
            addMarker(ll, popupClass, popupContentHTML);
 
418
 
 
419
            //anchored bubble popup wide short text contents autosize closebox
 
420
            ll = new OpenLayers.LonLat(25,5);
 
421
            popupClass = AutoSizeAnchoredBubble;
 
422
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize - wide short text<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
423
            addMarker(ll, popupClass, popupContentHTML, true);
 
424
 
 
425
 
 
426
            //anchored bubble popup wide short fixed contents autosize
 
427
            ll = new OpenLayers.LonLat(35,5);
 
428
            popupClass = AutoSizeAnchoredBubble;
 
429
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
430
            addMarker(ll, popupClass, popupContentHTML);
 
431
 
 
432
            //anchored bubble popup wide short fixed contents autosize closebox
 
433
            ll = new OpenLayers.LonLat(40,5);
 
434
            popupClass = AutoSizeAnchoredBubble;
 
435
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
436
            addMarker(ll, popupClass, popupContentHTML, true);
 
437
 
 
438
 
 
439
            //anchored bubble popup thin long fixed contents autosize
 
440
            ll = new OpenLayers.LonLat(50,5);
 
441
            popupClass = AutoSizeAnchoredBubble;
 
442
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
443
            addMarker(ll, popupClass, popupContentHTML);
 
444
 
 
445
            //anchored bubble popup thin long fixed contents autosize closebox
 
446
            ll = new OpenLayers.LonLat(55,5);
 
447
            popupClass = AutoSizeAnchoredBubble;
 
448
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
449
            addMarker(ll, popupClass, popupContentHTML, true);
 
450
 
 
451
 
 
452
            //anchored bubble popup wide long fixed contents autosize
 
453
            ll = new OpenLayers.LonLat(65,5);
 
454
            popupClass = AutoSizeAnchoredBubble;
 
455
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
456
            addMarker(ll, popupClass, popupContentHTML);
 
457
 
 
458
            //anchored bubble popup wide long fixed contents autosize closebox
 
459
            ll = new OpenLayers.LonLat(70,5);
 
460
            popupClass = AutoSizeAnchoredBubble;
 
461
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
462
            addMarker(ll, popupClass, popupContentHTML, true);
 
463
 
 
464
          //
 
465
          //Bubble OVERFLOW
 
466
          //
 
467
 
 
468
              //anchored bubble popup small contents no autosize
 
469
            var ll = new OpenLayers.LonLat(-55,0);
 
470
            popupClass = OpenLayers.Popup.AnchoredBubble;
 
471
            popupContentHTML = '<img src="small.jpg"></img>';
 
472
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
473
 
 
474
              //anchored bubble popup small contents no autosize closebox
 
475
            var ll = new OpenLayers.LonLat(-50,0);
 
476
            popupClass = OpenLayers.Popup.AnchoredBubble;
 
477
            popupContentHTML = '<img src="small.jpg"></img>';
 
478
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
479
 
 
480
 
 
481
            //anchored bubble popup small contents autosize
 
482
            ll = new OpenLayers.LonLat(-40,0);
 
483
            popupClass = AutoSizeAnchoredBubble;
 
484
            popupContentHTML = '<img src="small.jpg"></img>';
 
485
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
486
 
 
487
            //anchored bubble popup small contents autosize closebox
 
488
            ll = new OpenLayers.LonLat(-35,0);
 
489
            popupClass = AutoSizeAnchoredBubble;
 
490
            popupContentHTML = '<img src="small.jpg"></img>';
 
491
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
492
 
 
493
 
 
494
            //anchored bubble popup small contents autosize minsize
 
495
            ll = new OpenLayers.LonLat(-25,0);
 
496
            popupClass = AutoSizeAnchoredBubbleMinSize;
 
497
            popupContentHTML = '<img src="small.jpg"></img>';
 
498
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
499
 
 
500
            //anchored bubble popup small contents autosize minsize closebox
 
501
            ll = new OpenLayers.LonLat(-20,0);
 
502
            popupClass = AutoSizeAnchoredBubbleMinSize;
 
503
            popupContentHTML = '<img src="small.jpg"></img>';
 
504
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
505
 
 
506
 
 
507
            //anchored bubble popup small contents autosize maxsize
 
508
            ll = new OpenLayers.LonLat(-10,0);
 
509
            popupClass = AutoSizeAnchoredBubbleMaxSize;
 
510
            popupContentHTML = '<img src="small.jpg"></img>';
 
511
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
512
 
 
513
            //anchored bubble popup small contents autosize maxsize closebox
 
514
            ll = new OpenLayers.LonLat(-5,0);
 
515
            popupClass = AutoSizeAnchoredBubbleMaxSize;
 
516
            popupContentHTML = '<img src="small.jpg"></img>';
 
517
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
518
 
 
519
 
 
520
            //anchored bubble popup bigger contents autosize closebox
 
521
            ll = new OpenLayers.LonLat(5,0);
 
522
            popupClass = AutoSizeAnchoredBubble;
 
523
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
 
524
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
525
 
 
526
            //anchored bubble popup bigger contents autosize closebox
 
527
            ll = new OpenLayers.LonLat(10,0);
 
528
            popupClass = AutoSizeAnchoredBubble;
 
529
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>closebox<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
 
530
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
531
 
 
532
 
 
533
            //anchored bubble popup wide short contents autosize overflow
 
534
            ll = new OpenLayers.LonLat(20,0);
 
535
            popupClass = AutoSizeAnchoredBubble;
 
536
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>overflow<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
537
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
538
 
 
539
            //anchored bubble popup wide short contents autosize closebox overflow
 
540
            ll = new OpenLayers.LonLat(25,0);
 
541
            popupClass = AutoSizeAnchoredBubble;
 
542
            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
543
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
544
 
 
545
 
 
546
            //anchored bubble popup wide short fixed contents autosize overflow
 
547
            ll = new OpenLayers.LonLat(35,0);
 
548
            popupClass = AutoSizeAnchoredBubble;
 
549
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
550
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
551
 
 
552
            //anchored bubble popup wide short fixed contents autosize closebox overflow
 
553
            ll = new OpenLayers.LonLat(40,0);
 
554
            popupClass = AutoSizeAnchoredBubble;
 
555
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
556
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
557
 
 
558
 
 
559
            //anchored bubble popup thin long fixed contents autosize overflow
 
560
            ll = new OpenLayers.LonLat(50,0);
 
561
            popupClass = AutoSizeAnchoredBubble;
 
562
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
563
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
564
 
 
565
            //anchored bubble popup thin long fixed contents autosize closebox overflow
 
566
            ll = new OpenLayers.LonLat(55,0);
 
567
            popupClass = AutoSizeAnchoredBubble;
 
568
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
569
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
570
 
 
571
 
 
572
            //anchored bubble popup wide long fixed contents autosize overflow
 
573
            ll = new OpenLayers.LonLat(65,0);
 
574
            popupClass = AutoSizeAnchoredBubble;
 
575
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
576
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
577
 
 
578
            //anchored bubble popup wide long fixed contents autosize closebox overflow
 
579
            ll = new OpenLayers.LonLat(70,0);
 
580
            popupClass = AutoSizeAnchoredBubble;
 
581
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
582
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
583
 
 
584
   //FRAMED
 
585
 
 
586
          //
 
587
          //FRAMED NO OVERFLOW
 
588
          //
 
589
 
 
590
              //anchored bubble popup small contents no autosize
 
591
            var ll = new OpenLayers.LonLat(-55,-15);
 
592
            popupClass = OpenLayers.Popup.FramedCloud;
 
593
            popupContentHTML = '<img src="small.jpg"></img>';
 
594
            addMarker(ll, popupClass, popupContentHTML, false);
 
595
 
 
596
              //anchored bubble popup small contents no autosize closebox
 
597
            var ll = new OpenLayers.LonLat(-50,-15);
 
598
            popupClass = OpenLayers.Popup.FramedCloud;
 
599
            popupContentHTML = '<img src="small.jpg"></img>';
 
600
            addMarker(ll, popupClass, popupContentHTML, true);
 
601
 
 
602
 
 
603
            //anchored bubble popup small contents autosize
 
604
            ll = new OpenLayers.LonLat(-40,-15);
 
605
            popupClass = AutoSizeFramedCloud;
 
606
            popupContentHTML = '<img src="small.jpg"></img>';
 
607
            addMarker(ll, popupClass, popupContentHTML, false);
 
608
 
 
609
            //anchored bubble popup small contents autosize closebox
 
610
            ll = new OpenLayers.LonLat(-35,-15);
 
611
            popupClass = AutoSizeFramedCloud;
 
612
            popupContentHTML = '<img src="small.jpg"></img>';
 
613
            addMarker(ll, popupClass, popupContentHTML, true);
 
614
 
 
615
 
 
616
            //anchored bubble popup small contents autosize minsize
 
617
            ll = new OpenLayers.LonLat(-25,-15);
 
618
            popupClass = AutoSizeFramedCloudMinSize;
 
619
            popupContentHTML = '<img src="small.jpg"></img>';
 
620
            addMarker(ll, popupClass, popupContentHTML, false);
 
621
 
 
622
            //anchored bubble popup small contents autosize minsize closebox
 
623
            ll = new OpenLayers.LonLat(-20,-15);
 
624
            popupClass = AutoSizeFramedCloudMinSize;
 
625
            popupContentHTML = '<img src="small.jpg"></img>';
 
626
            addMarker(ll, popupClass, popupContentHTML, true);
 
627
 
 
628
 
 
629
            //anchored bubble popup small contents autosize maxsize
 
630
            ll = new OpenLayers.LonLat(-10,-15);
 
631
            popupClass = AutoSizeFramedCloudMaxSize;
 
632
            popupContentHTML = '<img src="small.jpg"></img>';
 
633
            addMarker(ll, popupClass, popupContentHTML, false);
 
634
 
 
635
            //anchored bubble popup small contents autosize maxsize closebox
 
636
            ll = new OpenLayers.LonLat(-5,-15);
 
637
            popupClass = AutoSizeFramedCloudMaxSize;
 
638
            popupContentHTML = '<img src="small.jpg"></img>';
 
639
            addMarker(ll, popupClass, popupContentHTML, true);
 
640
 
 
641
 
 
642
            //anchored bubble popup bigger contents autosize closebox
 
643
            ll = new OpenLayers.LonLat(5,-15);
 
644
            popupClass = AutoSizeFramedCloud;
 
645
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>' + samplePopupContentsHTML + '</div>' 
 
646
            addMarker(ll, popupClass, popupContentHTML, false);
 
647
 
 
648
            //anchored bubble popup bigger contents autosize closebox
 
649
            ll = new OpenLayers.LonLat(10,-15);
 
650
            popupClass = AutoSizeFramedCloud;
 
651
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
 
652
            addMarker(ll, popupClass, popupContentHTML, true);
 
653
 
 
654
 
 
655
            //anchored bubble popup wide short text contents autosize
 
656
            ll = new OpenLayers.LonLat(20,-15);
 
657
            popupClass = AutoSizeFramedCloud;
 
658
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize - wide short text<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
659
            addMarker(ll, popupClass, popupContentHTML);
 
660
 
 
661
            //anchored bubble popup wide short text contents autosize closebox
 
662
            ll = new OpenLayers.LonLat(25,-15);
 
663
            popupClass = AutoSizeFramedCloud;
 
664
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize - wide short text<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
665
            addMarker(ll, popupClass, popupContentHTML, true);
 
666
 
 
667
 
 
668
            //anchored bubble popup wide short fixed contents autosize
 
669
            ll = new OpenLayers.LonLat(35,-15);
 
670
            popupClass = AutoSizeFramedCloud;
 
671
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
672
            addMarker(ll, popupClass, popupContentHTML);
 
673
 
 
674
            //anchored bubble popup wide short fixed contents autosize closebox
 
675
            ll = new OpenLayers.LonLat(40,-15);
 
676
            popupClass = AutoSizeFramedCloud;
 
677
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
678
            addMarker(ll, popupClass, popupContentHTML, true);
 
679
 
 
680
 
 
681
            //anchored bubble popup thin long fixed contents autosize
 
682
            ll = new OpenLayers.LonLat(50,-15);
 
683
            popupClass = AutoSizeFramedCloud;
 
684
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
685
            addMarker(ll, popupClass, popupContentHTML);
 
686
 
 
687
            //anchored bubble popup thin long fixed contents autosize closebox
 
688
            ll = new OpenLayers.LonLat(55,-15);
 
689
            popupClass = AutoSizeFramedCloud;
 
690
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
691
            addMarker(ll, popupClass, popupContentHTML, true);
 
692
 
 
693
 
 
694
            //anchored bubble popup wide long fixed contents autosize
 
695
            ll = new OpenLayers.LonLat(65,-15);
 
696
            popupClass = AutoSizeFramedCloud;
 
697
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
698
            addMarker(ll, popupClass, popupContentHTML);
 
699
 
 
700
            //anchored bubble popup wide long fixed contents autosize closebox
 
701
            ll = new OpenLayers.LonLat(70,-15);
 
702
            popupClass = AutoSizeFramedCloud;
 
703
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
704
            addMarker(ll, popupClass, popupContentHTML, true);
 
705
 
 
706
          //
 
707
          //FRAMED OVERFLOW
 
708
          //
 
709
 
 
710
              //anchored bubble popup small contents no autosize
 
711
            var ll = new OpenLayers.LonLat(-55,-20);
 
712
            popupClass = OpenLayers.Popup.FramedCloud;
 
713
            popupContentHTML = '<img src="small.jpg"></img>';
 
714
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
715
 
 
716
              //anchored bubble popup small contents no autosize closebox
 
717
            var ll = new OpenLayers.LonLat(-50,-20);
 
718
            popupClass = OpenLayers.Popup.FramedCloud;
 
719
            popupContentHTML = '<img src="small.jpg"></img>';
 
720
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
721
 
 
722
 
 
723
            //anchored bubble popup small contents autosize
 
724
            ll = new OpenLayers.LonLat(-40,-20);
 
725
            popupClass = AutoSizeFramedCloud;
 
726
            popupContentHTML = '<img src="small.jpg"></img>';
 
727
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
728
 
 
729
            //anchored bubble popup small contents autosize closebox
 
730
            ll = new OpenLayers.LonLat(-35,-20);
 
731
            popupClass = AutoSizeFramedCloud;
 
732
            popupContentHTML = '<img src="small.jpg"></img>';
 
733
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
734
 
 
735
 
 
736
            //anchored bubble popup small contents autosize minsize
 
737
            ll = new OpenLayers.LonLat(-25,-20);
 
738
            popupClass = AutoSizeFramedCloudMinSize;
 
739
            popupContentHTML = '<img src="small.jpg"></img>';
 
740
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
741
 
 
742
            //anchored bubble popup small contents autosize minsize closebox
 
743
            ll = new OpenLayers.LonLat(-20,-20);
 
744
            popupClass = AutoSizeFramedCloudMinSize;
 
745
            popupContentHTML = '<img src="small.jpg"></img>';
 
746
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
747
 
 
748
 
 
749
            //anchored bubble popup small contents autosize maxsize
 
750
            ll = new OpenLayers.LonLat(-10,-20);
 
751
            popupClass = AutoSizeFramedCloudMaxSize;
 
752
            popupContentHTML = '<img src="small.jpg"></img>';
 
753
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
754
 
 
755
            //anchored bubble popup small contents autosize maxsize closebox
 
756
            ll = new OpenLayers.LonLat(-5,-20);
 
757
            popupClass = AutoSizeFramedCloudMaxSize;
 
758
            popupContentHTML = '<img src="small.jpg"></img>';
 
759
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
760
 
 
761
 
 
762
            //anchored bubble popup bigger contents autosize closebox
 
763
            ll = new OpenLayers.LonLat(5,-20);
 
764
            popupClass = AutoSizeFramedCloud;
 
765
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
 
766
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
767
 
 
768
            //anchored bubble popup bigger contents autosize closebox
 
769
            ll = new OpenLayers.LonLat(10,-20);
 
770
            popupClass = AutoSizeFramedCloud;
 
771
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>closebox<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
 
772
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
773
 
 
774
 
 
775
            //anchored bubble popup wide short contents autosize overflow
 
776
            ll = new OpenLayers.LonLat(20,-20);
 
777
            popupClass = AutoSizeFramedCloud;
 
778
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>overflow<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
779
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
780
 
 
781
            //anchored bubble popup wide short contents autosize closebox overflow
 
782
            ll = new OpenLayers.LonLat(25,-20);
 
783
            popupClass = AutoSizeFramedCloud;
 
784
            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
 
785
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
786
 
 
787
 
 
788
            //anchored bubble popup wide short fixed contents autosize overflow
 
789
            ll = new OpenLayers.LonLat(35,-20);
 
790
            popupClass = AutoSizeFramedCloud;
 
791
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
792
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
793
 
 
794
            //anchored bubble popup wide short fixed contents autosize closebox overflow
 
795
            ll = new OpenLayers.LonLat(40,-20);
 
796
            popupClass = AutoSizeFramedCloud;
 
797
            popupContentHTML = '<img src="wideshort.jpg"></img>' 
 
798
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
799
 
 
800
 
 
801
            //anchored bubble popup thin long fixed contents autosize overflow
 
802
            ll = new OpenLayers.LonLat(50,-20);
 
803
            popupClass = AutoSizeFramedCloud;
 
804
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
805
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
806
 
 
807
            //anchored bubble popup thin long fixed contents autosize closebox overflow
 
808
            ll = new OpenLayers.LonLat(55,-20);
 
809
            popupClass = AutoSizeFramedCloud;
 
810
            popupContentHTML = '<img src="thinlong.jpg"></img>' 
 
811
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
812
 
 
813
 
 
814
            //anchored bubble popup wide long fixed contents autosize overflow
 
815
            ll = new OpenLayers.LonLat(65,-20);
 
816
            popupClass = AutoSizeFramedCloud;
 
817
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
818
            addMarker(ll, popupClass, popupContentHTML, false, true);
 
819
 
 
820
            //anchored bubble popup wide long fixed contents autosize closebox overflow
 
821
            ll = new OpenLayers.LonLat(70,-20);
 
822
            popupClass = AutoSizeFramedCloud;
 
823
            popupContentHTML = '<img src="widelong.jpg"></img>' 
 
824
            addMarker(ll, popupClass, popupContentHTML, true, true);
 
825
 
 
826
 
 
827
        }
 
828
 
 
829
        /**
 
830
         * Function: addMarker
 
831
         * Add a new marker to the markers layer given the following lonlat, 
 
832
         *     popupClass, and popup contents HTML. Also allow specifying 
 
833
         *     whether or not to give the popup a close box.
 
834
         * 
 
835
         * Parameters:
 
836
         * ll - {<OpenLayers.LonLat>} Where to place the marker
 
837
         * popupClass - {<OpenLayers.Class>} Which class of popup to bring up 
 
838
         *     when the marker is clicked.
 
839
         * popupContentHTML - {String} What to put in the popup
 
840
         * closeBox - {Boolean} Should popup have a close box?
 
841
         * overflow - {Boolean} Let the popup overflow scrollbars?
 
842
         */
 
843
        function addMarker(ll, popupClass, popupContentHTML, closeBox, overflow) {
 
844
 
 
845
            var feature = new OpenLayers.Feature(markers, ll); 
 
846
            feature.closeBox = closeBox;
 
847
            feature.popupClass = popupClass;
 
848
            feature.data.popupContentHTML = popupContentHTML;
 
849
            feature.data.overflow = (overflow) ? "auto" : "hidden";
 
850
                    
 
851
            var marker = feature.createMarker();
 
852
 
 
853
            var markerClick = function (evt) {
 
854
                if (this.popup == null) {
 
855
                    this.popup = this.createPopup(this.closeBox);
 
856
                    map.addPopup(this.popup);
 
857
                    this.popup.show();
 
858
                } else {
 
859
                    this.popup.toggle();
 
860
                }
 
861
                currentPopup = this.popup;
 
862
                OpenLayers.Event.stop(evt);
 
863
            };
 
864
            marker.events.register("mousedown", feature, markerClick);
 
865
 
 
866
            markers.addMarker(marker);
 
867
        }
 
868
 
 
869
    </script>
 
870
  </head>
 
871
  <body onload="init()">
 
872
  <h1 id="title">Popup Matrix</h1>
 
873
 
 
874
  <div id="tags">
 
875
  </div>
 
876
      <p id="shortdesc">
 
877
          All kinds of different popup configurations.
 
878
      </p>
 
879
 
 
880
      <div id="map" class="smallmap"></div>
 
881
 
 
882
        <!-- preloading these images so the autosize will work correctly -->
 
883
        <img src="wideshort.jpg" style="position:absolute; top:-5000px; left: -5000px"></img>
 
884
        <img src="widelong.jpg" style="position:absolute; top:-5000px; left: -5000px"></img>
 
885
        <img src="thinlong.jpg" style="position:absolute; top:-5000px; left: -5000px"></img>
 
886
 
 
887
       <p> All of the images in this file a pre-cached, meaning they are 
 
888
           loaded immediately when you load the page (they are just placed 
 
889
           far offscreen, that's why you don't see them). 
 
890
       </p>
 
891
       <br>    
 
892
       <p> The only image that is *not* preloaded is small.jpg, the brazilian
 
893
           flag. We do this in order to test out to make sure that our auto-sizing
 
894
             code does in fact activate itself as the images load. To verify 
 
895
             this, clear your cache and reload this example page. Click on 
 
896
             any of the markers in the 'AutoSize' row. If the popup autosizes
 
897
             to correctly contain the entire flag: golden. If the popup is 
 
898
             tiny and you can only see a corner of it, then this code is broken.
 
899
        </p>
 
900
 
 
901
      <br/>      
 
902
 
 
903
      
 
904
   </div>
 
905
  </body>
 
906
</html>