Flexible Map - Version 1.5.0

Version Description

[2012-09-29] = * added: new shortcode attribute "id" which will be used for the container div, instead of the random unique div id * added: FlexibleMap object is accessible via global variable with name derived from container div id (e.g. if you need to access the Google Maps map object in your own scripts) * added: redraw() and redrawOnce() methods, for when the map needs to be redrawn correctly (e.g. when hidden then revealed) * added: KML maps support directions (sponsored by Roger Los -- thanks!)

Download this release

Release Info

Developer webaware
Plugin Icon 128x128 Flexible Map
Version 1.5.0
Comparing to
See all releases

Code changes from version 1.4.1 to 1.5.0

Files changed (6) hide show
  1. class.FlxMapAdmin.php +2 -3
  2. class.FlxMapPlugin.php +33 -7
  3. flexible-map.js +202 -37
  4. flexible-map.min.js +1 -1
  5. flexible-map.php +4 -2
  6. readme.txt +61 -9
class.FlxMapAdmin.php CHANGED
@@ -44,9 +44,8 @@ class FlxMapAdmin {
44
  if ($file == FLXMAP_PLUGIN_NAME) {
45
  $links[] = '<a href="admin.php?page=' . self::MENU_PAGE . '-instructions">' . __('Instructions') . '</a>';
46
  $links[] = '<a href="http://wordpress.org/support/plugin/wp-flexible-map">' . __('Support') . '</a>';
47
- $links[] = '<a href="http://wordpress.org/extend/plugins/wp-flexible-map/">' . __('Rate') . '</a>';
48
- $links[] = '<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=6ZCY9PST8E4GQ" title="Please consider making a donation to help support maintenance and further development of this plugin.">'
49
- . __('Donate') . '</a>';
50
  }
51
 
52
  return $links;
44
  if ($file == FLXMAP_PLUGIN_NAME) {
45
  $links[] = '<a href="admin.php?page=' . self::MENU_PAGE . '-instructions">' . __('Instructions') . '</a>';
46
  $links[] = '<a href="http://wordpress.org/support/plugin/wp-flexible-map">' . __('Support') . '</a>';
47
+ $links[] = '<a href="http://wordpress.org/extend/plugins/wp-flexible-map/">' . __('Rating') . '</a>';
48
+ $links[] = '<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&amp;hosted_button_id=6ZCY9PST8E4GQ">' . __('Donate') . '</a>';
 
49
  }
50
 
51
  return $links;
class.FlxMapPlugin.php CHANGED
@@ -47,7 +47,7 @@ class FlxMapPlugin {
47
  add_action('wp_enqueue_scripts', array($this, 'actionEnqueueStyles'));
48
 
49
  // custom actions and filters for this plugin
50
- add_filter('flexmap_getmap', array($this, 'shortcodeMap'), 10, 1);
51
  }
52
  }
53
 
@@ -58,8 +58,9 @@ class FlxMapPlugin {
58
  // start off required locales with this website's WP locale
59
  $this->locales = array();
60
  $this->locale = get_locale();
61
- if ($this->locale != '' && $this->locale != 'en_US')
62
  $this->locales[str_replace('_', '-', $this->locale)] = 1;
 
63
  }
64
 
65
  /**
@@ -67,7 +68,7 @@ class FlxMapPlugin {
67
  */
68
  public function actionEnqueueStyles() {
69
  // theme writers: you can remove this stylesheet by calling wp_dequeue_script('flxmap');
70
- wp_enqueue_style('flxmap', "{$this->urlBase}styles.css", FALSE, '2');
71
  }
72
 
73
  /**
@@ -77,7 +78,7 @@ class FlxMapPlugin {
77
  if ($this->loadScripts) {
78
  // load required scripts
79
  $url = parse_url($this->urlBase, PHP_URL_PATH);
80
- $version = 10;
81
 
82
  // allow others to override the Google Maps API URL
83
  $apiURL = apply_filters('flexmap_google_maps_api_url', '//maps.google.com/maps/api/js?v=3.9&amp;sensor=false');
@@ -111,6 +112,16 @@ class FlxMapPlugin {
111
  * @return string output to substitute for the shortcode
112
  */
113
  public function shortcodeMap($attrs) {
 
 
 
 
 
 
 
 
 
 
114
  $html = '';
115
 
116
  // allow others to change the shortcode attributes used
@@ -118,7 +129,15 @@ class FlxMapPlugin {
118
 
119
  if (!empty($attrs['src']) || !empty($attrs['center']) || !empty($attrs['address'])) {
120
  $this->loadScripts = TRUE;
121
- $divID = uniqid('flxmap-');
 
 
 
 
 
 
 
 
122
 
123
  // build the inline styles for the div
124
  $styles = array();
@@ -151,9 +170,10 @@ class FlxMapPlugin {
151
  }
152
 
153
  $html = <<<HTML
154
- <div id="$divID" class='flxmap-container' $inlinestyles></div>$divDirections
155
  <script>
156
  //<![CDATA[
 
157
  (function(w, fn) {
158
  if (w.addEventListener) w.addEventListener("DOMContentLoaded", fn, false);
159
  else if (w.attachEvent) w.attachEvent("onload", fn);
@@ -288,7 +308,13 @@ HTML;
288
  $html .= ");\n";
289
  }
290
 
291
- $html .= "});\n//]]>\n</script>\n";
 
 
 
 
 
 
292
  }
293
 
294
  // allow others to change the generated html
47
  add_action('wp_enqueue_scripts', array($this, 'actionEnqueueStyles'));
48
 
49
  // custom actions and filters for this plugin
50
+ add_filter('flexmap_getmap', array($this, 'getMap'), 10, 1);
51
  }
52
  }
53
 
58
  // start off required locales with this website's WP locale
59
  $this->locales = array();
60
  $this->locale = get_locale();
61
+ if ($this->locale != '' && $this->locale != 'en_US') {
62
  $this->locales[str_replace('_', '-', $this->locale)] = 1;
63
+ }
64
  }
65
 
66
  /**
68
  */
69
  public function actionEnqueueStyles() {
70
  // theme writers: you can remove this stylesheet by calling wp_dequeue_script('flxmap');
71
+ wp_enqueue_style('flxmap', "{$this->urlBase}styles.css", FALSE, FLXMAP_PLUGIN_VERSION);
72
  }
73
 
74
  /**
78
  if ($this->loadScripts) {
79
  // load required scripts
80
  $url = parse_url($this->urlBase, PHP_URL_PATH);
81
+ $version = FLXMAP_PLUGIN_VERSION;
82
 
83
  // allow others to override the Google Maps API URL
84
  $apiURL = apply_filters('flexmap_google_maps_api_url', '//maps.google.com/maps/api/js?v=3.9&amp;sensor=false');
112
  * @return string output to substitute for the shortcode
113
  */
114
  public function shortcodeMap($attrs) {
115
+ return $this->getMap($attrs);
116
+ }
117
+
118
+ /**
119
+ * get HTML and script for map
120
+ *
121
+ * @param array shortcode attributes as supplied by the WP shortcode API
122
+ * @return string HTML and script for the map
123
+ */
124
+ public function getMap($attrs) {
125
  $html = '';
126
 
127
  // allow others to change the shortcode attributes used
129
 
130
  if (!empty($attrs['src']) || !empty($attrs['center']) || !empty($attrs['address'])) {
131
  $this->loadScripts = TRUE;
132
+ if (empty($attrs['id'])) {
133
+ $ID = uniqid();
134
+ $divID = 'flxmap-' . $ID;
135
+ }
136
+ else {
137
+ $ID = $attrs['id'];
138
+ $divID = esc_attr($ID);
139
+ }
140
+ $varID = 'flxmap_' . preg_replace('/[^a-z0-9_$]/i', '_', $ID);
141
 
142
  // build the inline styles for the div
143
  $styles = array();
170
  }
171
 
172
  $html = <<<HTML
173
+ <div id="$divID" class='flxmap-container' data-flxmap='$varID' $inlinestyles></div>$divDirections
174
  <script>
175
  //<![CDATA[
176
+ var $varID = false;
177
  (function(w, fn) {
178
  if (w.addEventListener) w.addEventListener("DOMContentLoaded", fn, false);
179
  else if (w.attachEvent) w.attachEvent("onload", fn);
308
  $html .= ");\n";
309
  }
310
 
311
+ $html .= <<<HTML
312
+ $varID = f;
313
+ });
314
+ //]]>
315
+ </script>
316
+
317
+ HTML;
318
  }
319
 
320
  // allow others to change the generated html
flexible-map.js CHANGED
@@ -4,6 +4,70 @@ copyright (c) 2011-2012 WebAware Pty Ltd, released under LGPL v2.1
4
  */
5
 
6
  function FlexibleMap() {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7
  // set map defaults
8
  this.mapTypeId = google.maps.MapTypeId.ROADMAP;
9
  this.mapTypeControl = true; // no control for changing map type
@@ -43,7 +107,8 @@ FlexibleMap.prototype = (function() {
43
  };
44
 
45
  stopEvent = function(event) {
46
- event.stopPropagation(); event.preventDefault();
 
47
  };
48
 
49
  fireEvent = function(element, eventName) {
@@ -71,6 +136,28 @@ FlexibleMap.prototype = (function() {
71
  };
72
  }
73
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
74
  return {
75
  constructor: FlexibleMap,
76
 
@@ -134,29 +221,73 @@ FlexibleMap.prototype = (function() {
134
  * @param {Number} zoom [optional] zoom level
135
  */
136
  showKML: function(divID, kmlFile, zoom) {
137
- var map = this.showMap(divID, [0, 0]),
 
 
 
138
  kmlLayer = new google.maps.KmlLayer(kmlFile);
139
 
 
140
  kmlLayer.setMap(map);
141
 
142
- if (typeof zoom != "undefined") {
143
- // listen for KML loaded, and reset zoom
144
- google.maps.event.addListenerOnce(map, 'tilesloaded', function() {
 
 
 
 
145
  map.setZoom(zoom);
146
- });
 
 
 
 
 
 
 
 
 
147
  }
148
 
149
- // stop links opening in a new window (thanks, Stack Overflow!)
150
- // NB: since Google Maps API v3.9 the info window HTML is precomposed, so just changing the description won't fix link
151
- if (this.targetFix) {
152
- google.maps.event.addListener(kmlLayer, 'click', function(kmlEvent) {
153
- var featureData = kmlEvent.featureData,
154
- reTargetFix = / target="_blank"/ig;
 
 
 
 
 
 
 
 
 
 
 
155
 
156
- featureData.description = featureData.description.replace(reTargetFix, "");
157
- featureData.infoWindowHtml = featureData.infoWindowHtml.replace(reTargetFix, "");
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
158
  });
159
  }
 
160
  },
161
 
162
  /**
@@ -234,15 +365,7 @@ FlexibleMap.prototype = (function() {
234
 
235
  // add a directions service if needed
236
  if (this.markerDirections || this.markerDirectionsShow) {
237
- // make sure we have a directions service
238
- if (!this.dirService)
239
- this.dirService = new google.maps.DirectionsService();
240
- if (!this.dirPanel) {
241
- this.dirPanel = new google.maps.DirectionsRenderer({
242
- map: map,
243
- panel: document.getElementById(this.markerDirections)
244
- });
245
- }
246
 
247
  // show directions immediately if required
248
  if (this.markerDirectionsShow) {
@@ -293,20 +416,62 @@ FlexibleMap.prototype = (function() {
293
  * @return {google.maps.Map} the Google Maps map created
294
  */
295
  showMap: function(divID, centre) {
296
- return new google.maps.Map(document.getElementById(divID), {
297
- mapTypeId: this.mapTypeId,
298
- mapTypeControl: this.mapTypeControl,
299
- scaleControl: this.scaleControl,
300
- panControl: this.panControl,
301
- zoomControl: this.zoomControl,
302
- draggable: this.draggable,
303
- disableDoubleClickZoom: !this.dblclickZoom,
304
- scrollwheel: this.scrollwheel,
305
- streetViewControl: this.streetViewControl,
306
- navigationControlOptions: this.navigationControlOptions,
307
- center: new google.maps.LatLng(centre[0], centre[1]),
308
- zoom: this.zoom
309
- });
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
310
  },
311
 
312
  /**
4
  */
5
 
6
  function FlexibleMap() {
7
+ // instance-private members with accessors
8
+ var map, // google.maps.Map object
9
+ centre, // google.maps.LatLng object for map centre
10
+ kmlLayer, // if map has a KML layer, this is the layer object
11
+ hasRedrawn = false; // boolean, whether map has been asked to redrawOnce() already
12
+
13
+ /**
14
+ * get the Google Maps API Map object
15
+ * @return {google.maps.Map}
16
+ */
17
+ this.getMap = function() {
18
+ return map;
19
+ };
20
+
21
+ /**
22
+ * set the Google Maps API Map object
23
+ * @param {google.maps.Map} map
24
+ */
25
+ this.setMap = function(newMap) {
26
+ map = newMap;
27
+ };
28
+
29
+ /**
30
+ * get the centrepoint of the map at time of creation
31
+ * @return {google.maps.LatLng}
32
+ */
33
+ this.getCenter = function() {
34
+ return centre;
35
+ };
36
+
37
+ /**
38
+ * set the centrepoint of the map at time of creation
39
+ * @param {google.maps.LatLng} latLng
40
+ */
41
+ this.setCenter = function(latLng) {
42
+ centre = latLng;
43
+ };
44
+
45
+ /**
46
+ * get the map's KML layer if set
47
+ * @return {google.maps.KmlLayer}
48
+ */
49
+ this.getKmlLayer = function() {
50
+ return kmlLayer;
51
+ };
52
+
53
+ /**
54
+ * record the map's KML layer
55
+ * @param {google.maps.KmlLayer} layer
56
+ */
57
+ this.setKmlLayer = function(layer) {
58
+ kmlLayer = layer;
59
+ };
60
+
61
+ /**
62
+ * if map starts life hidden and needs to be redrawn when revealed, this function will perform that redraw *once*
63
+ */
64
+ this.redrawOnce = function() {
65
+ if (!hasRedrawn) {
66
+ hasRedrawn = true;
67
+ this.redraw();
68
+ }
69
+ };
70
+
71
  // set map defaults
72
  this.mapTypeId = google.maps.MapTypeId.ROADMAP;
73
  this.mapTypeControl = true; // no control for changing map type
107
  };
108
 
109
  stopEvent = function(event) {
110
+ event.stopPropagation();
111
+ event.preventDefault();
112
  };
113
 
114
  fireEvent = function(element, eventName) {
136
  };
137
  }
138
 
139
+ /**
140
+ * escape some text for inserting into HTML as an attribute value delimited by quotes (")
141
+ * @param {String} text
142
+ * @return {String}
143
+ */
144
+ function escAttr(text) {
145
+ // add text to a P element and extract HTML
146
+ var element = document.createElement("p");
147
+ element.appendChild(document.createTextNode(text));
148
+
149
+ // convert non-JS safe characters to Unicode hex
150
+ return element.innerHTML.replace(/[\\\/"'\x00-\x1f\x7f-\xa0\u2000-\u200f\u2028-\u202f]/g, toUnicodeHex);
151
+ }
152
+
153
+ /**
154
+ * encode character as Unicode hex
155
+ */
156
+ function toUnicodeHex(ch) {
157
+ var c = ch.charCodeAt(0);
158
+ return "\\u" + ("0000" + c.toString(16)).slice(-4);
159
+ }
160
+
161
  return {
162
  constructor: FlexibleMap,
163
 
221
  * @param {Number} zoom [optional] zoom level
222
  */
223
  showKML: function(divID, kmlFile, zoom) {
224
+ var self = this,
225
+ mapDiv = document.getElementById(divID),
226
+ varName,
227
+ map = this.showMap(divID, [0, 0]),
228
  kmlLayer = new google.maps.KmlLayer(kmlFile);
229
 
230
+ this.setKmlLayer(kmlLayer);
231
  kmlLayer.setMap(map);
232
 
233
+ // listen for KML loaded
234
+ google.maps.event.addListenerOnce(map, "tilesloaded", function() {
235
+ // grab true centre of map
236
+ self.setCenter(map.getCenter());
237
+
238
+ // set zoom if specified
239
+ if (typeof zoom != "undefined") {
240
  map.setZoom(zoom);
241
+ self.zoom = zoom;
242
+ }
243
+ });
244
+
245
+ // add a directions service if needed
246
+ if (this.markerDirections || this.markerDirectionsShow) {
247
+ this.startDirService(map);
248
+
249
+ // grab name of variable holding this object instance, need it for directions links
250
+ varName = mapDiv.getAttribute("data-flxmap");
251
  }
252
 
253
+ // customise the infowindow as required; can do this on click event on KML layer (thanks, Stack Overflow!)
254
+ google.maps.event.addListener(kmlLayer, 'click', function(kmlEvent) {
255
+ var featureData = kmlEvent.featureData;
256
+
257
+ // NB: since Google Maps API v3.9 the info window HTML is precomposed before this event occurs,
258
+ // so just changing the description won't change infowindow
259
+
260
+ if (!featureData._flxmapOnce) {
261
+ // add a flag to stop doing this on every click; once is enough
262
+ featureData._flxmapOnce = true;
263
+
264
+ // stop links opening in a new window
265
+ if (self.targetFix) {
266
+ var reTargetFix = / target="_blank"/ig;
267
+ featureData.description = featureData.description.replace(reTargetFix, "");
268
+ featureData.infoWindowHtml = featureData.infoWindowHtml.replace(reTargetFix, "");
269
+ }
270
 
271
+ // if we're showing directions, add directions link to marker description
272
+ if (self.markerDirections) {
273
+ var latLng = kmlEvent.latLng,
274
+ params = latLng.lat() + ',' + latLng.lng() + ",'" + escAttr(featureData.name) + "'",
275
+ a = '<br /><a href="#" data-flxmap-isdir="1" onclick="' + varName + '.showDirections(' + params + '); return false;">' + self.gettext("Directions") + '</a>';
276
+
277
+ featureData.infoWindowHtml = featureData.infoWindowHtml.replace(/<\/div><\/div>$/i, a + "</div></div>");
278
+ }
279
+ }
280
+ });
281
+
282
+ // hack for directions links on Opera, which fails to ignore events when onclick returns false
283
+ if (window.opera && this.markerDirections) {
284
+ addEventListener(mapDiv, "click", function(event) {
285
+ if (event.target.getAttribute("data-flxmap-isdir")) {
286
+ stopEvent(event);
287
+ }
288
  });
289
  }
290
+
291
  },
292
 
293
  /**
365
 
366
  // add a directions service if needed
367
  if (this.markerDirections || this.markerDirectionsShow) {
368
+ this.startDirService(map);
 
 
 
 
 
 
 
 
369
 
370
  // show directions immediately if required
371
  if (this.markerDirectionsShow) {
416
  * @return {google.maps.Map} the Google Maps map created
417
  */
418
  showMap: function(divID, centre) {
419
+ var latLng = new google.maps.LatLng(centre[0], centre[1]),
420
+ map = new google.maps.Map(document.getElementById(divID), {
421
+ mapTypeId: this.mapTypeId,
422
+ mapTypeControl: this.mapTypeControl,
423
+ scaleControl: this.scaleControl,
424
+ panControl: this.panControl,
425
+ zoomControl: this.zoomControl,
426
+ draggable: this.draggable,
427
+ disableDoubleClickZoom: !this.dblclickZoom,
428
+ scrollwheel: this.scrollwheel,
429
+ streetViewControl: this.streetViewControl,
430
+ navigationControlOptions: this.navigationControlOptions,
431
+ center: latLng,
432
+ zoom: this.zoom
433
+ });
434
+
435
+ // record map and centre in instance, so we can refer to them later
436
+ this.setMap(map);
437
+ this.setCenter(latLng);
438
+
439
+ return map;
440
+ },
441
+
442
+ /**
443
+ * tell Google Maps to redraw the map, and centre it back where it started with default zoom
444
+ */
445
+ redraw: function() {
446
+ var map = this.getMap(),
447
+ centre = this.getCenter(),
448
+ kmlLayer = this.getKmlLayer();
449
+
450
+ google.maps.event.trigger(map, "resize");
451
+ map.setCenter(centre);
452
+
453
+ // if map is KML, must refit to computed bounds, else use zoom setting
454
+ if (kmlLayer) {
455
+ map.fitBounds(kmlLayer.getDefaultViewport());
456
+ }
457
+ else {
458
+ map.setZoom(this.zoom);
459
+ }
460
+ },
461
+
462
+ /**
463
+ * create directions service
464
+ */
465
+ startDirService: function(map) {
466
+ // make sure we have a directions service
467
+ if (!this.dirService)
468
+ this.dirService = new google.maps.DirectionsService();
469
+ if (!this.dirPanel) {
470
+ this.dirPanel = new google.maps.DirectionsRenderer({
471
+ map: map,
472
+ panel: document.getElementById(this.markerDirections)
473
+ });
474
+ }
475
  },
476
 
477
  /**
flexible-map.min.js CHANGED
@@ -2,4 +2,4 @@
2
  JavaScript for the WordPress plugin wp-flexible-map
3
  copyright (c) 2011-2012 WebAware Pty Ltd, released under LGPL v2.1
4
  */
5
- function FlexibleMap(){this.mapTypeId=google.maps.MapTypeId.ROADMAP;this.mapTypeControl=true;this.scaleControl=false;this.panControl=false;this.zoomControl=true;this.streetViewControl=false;this.scrollwheel=false;this.draggable=true;this.dblclickZoom=true;this.zoom=16;this.markerTitle="";this.markerDescription="";this.markerLink="";this.markerShowInfo=true;this.markerDirections=false;this.markerDirectionsShow=false;this.markerDirectionsDefault="";this.markerAddress="";this.targetFix=true;this.navigationControlOptions={style:google.maps.NavigationControlStyle.SMALL};this.dirService=false;this.dirPanel=false;this.region="";this.locale="en";this.localeActive="en"}FlexibleMap.prototype=(function(){var c,b,a;if(document.addEventListener){c=function(e,d,f){e.addEventListener(d,f,false)};b=function(d){d.stopPropagation();d.preventDefault()};a=function(e,d){var f=document.createEvent("HTMLEvents");f.initEvent(d,true,true);e.dispatchEvent(f)}}else{if(document.attachEvent){c=function(d,e,f){d.attachEvent("on"+e,function(){f.call(d,window.event)})};b=function(d){d.cancelBubble=true;d.returnValue=0};a=function(e,d){var f=document.createEventObject();f.eventType=d;e.fireEvent("on"+d,f)}}}return{constructor:FlexibleMap,i18n:{en:{"Click for details":"Click for details",Directions:"Directions",From:"From","Get directions":"Get directions"}},setlocale:function(d){this.locale=d;if(d in this.i18n){this.localeActive=d}else{d=d.substr(0,2);if(d in this.i18n){this.localeActive=d}else{this.localeActive="en"}}return this.localeActive},gettext:function(e){var d=this.i18n[this.localeActive];if(e in d){return d[e]}return""},showKML:function(d,h,e){var g=this.showMap(d,[0,0]),f=new google.maps.KmlLayer(h);f.setMap(g);if(typeof e!="undefined"){google.maps.event.addListenerOnce(g,"tilesloaded",function(){g.setZoom(e)})}if(this.targetFix){google.maps.event.addListener(f,"click",function(k){var j=k.featureData,i=/ target="_blank"/ig;j.description=j.description.replace(i,"");j.infoWindowHtml=j.infoWindowHtml.replace(i,"")})}},showMarker:function(g,f,l){var e=this.showMap(g,f),o=new google.maps.Marker({map:e,position:new google.maps.LatLng(l[0],l[1])});if(!this.markerTitle){this.markerTitle=this.markerAddress}if(this.markerTitle){var k,m,q,h,j,n,p=this,d=document.createElement("DIV");d.className="flxmap-infowin";o.setTitle(this.markerTitle);j=document.createElement("DIV");j.className="flxmap-marker-title";j.appendChild(document.createTextNode(this.markerTitle));d.appendChild(j);if(this.markerDescription||this.markerLink){j=document.createElement("DIV");j.className="flxmap-marker-link";if(this.markerDescription){q=this.markerDescription.split("\n");for(k=0,m=q.length;k<m;k++){if(k>0){j.appendChild(document.createElement("BR"))}j.appendChild(document.createTextNode(q[k]))}if(this.markerLink){j.appendChild(document.createElement("BR"))}}if(this.markerLink){n=document.createElement("A");n.href=this.markerLink;n.appendChild(document.createTextNode(this.gettext("Click for details")));j.appendChild(n)}d.appendChild(j)}if(this.markerDirections){j=document.createElement("DIV");j.className="flxmap-directions-link";n=document.createElement("A");n.href="#";n.dataLatitude=l[0];n.dataLongitude=l[1];n.dataTitle=this.markerTitle;c(n,"click",function(i){b(i);p.showDirections(this.dataLatitude,this.dataLongitude,this.dataTitle)});n.appendChild(document.createTextNode(this.gettext("Directions")));j.appendChild(n);d.appendChild(j)}if(this.markerDirections||this.markerDirectionsShow){if(!this.dirService){this.dirService=new google.maps.DirectionsService()}if(!this.dirPanel){this.dirPanel=new google.maps.DirectionsRenderer({map:e,panel:document.getElementById(this.markerDirections)})}if(this.markerDirectionsShow){this.showDirections(l[0],l[1],this.markerTitle)}}h=new google.maps.InfoWindow({content:d});if(this.markerShowInfo){h.open(e,o)}google.maps.event.addListener(o,"click",function(){h.open(e,o)})}},showAddress:function(d,e){var f=this,g=new google.maps.Geocoder();this.markerAddress=e;if(this.markerTitle===""){this.markerTitle=e}g.geocode({address:e,region:this.region},function(j,i){if(i==google.maps.GeocoderStatus.OK){var h=j[0].geometry.location,k=[h.lat(),h.lng()];f.showMarker(d,k,k)}else{alert("Map address returns error: "+i)}})},showMap:function(d,e){return new google.maps.Map(document.getElementById(d),{mapTypeId:this.mapTypeId,mapTypeControl:this.mapTypeControl,scaleControl:this.scaleControl,panControl:this.panControl,zoomControl:this.zoomControl,draggable:this.draggable,disableDoubleClickZoom:!this.dblclickZoom,scrollwheel:this.scrollwheel,streetViewControl:this.streetViewControl,navigationControlOptions:this.navigationControlOptions,center:new google.maps.LatLng(e[0],e[1]),zoom:this.zoom})},showDirections:function(h,d,j){var e=document.getElementById(this.markerDirections),g=document.createElement("form"),m=this,i=this.region||"",k,f,l;while(!!(f=e.lastChild)){e.removeChild(f)}f=document.createElement("p");f.appendChild(document.createTextNode(this.gettext("From")+": "));l=document.createElement("input");l.type="text";l.name="from";l.value=this.markerDirectionsDefault;f.appendChild(l);k=document.createElement("input");k.type="submit";k.value=this.gettext("Get directions");f.appendChild(k);g.appendChild(f);e.appendChild(g);l.focus();if(typeof g.elements.from=="undefined"){g.elements.from=l}c(g,"submit",function(p){b(p);var q=this.elements.from.value;if(/\S/.test(q)){var n=(m.markerAddress==="")?new google.maps.LatLng(h,d):m.markerAddress,o={origin:q,region:i,destination:n,travelMode:google.maps.DirectionsTravelMode.DRIVING};m.dirService.route(o,function(t,r){var s=google.maps.DirectionsStatus;switch(r){case s.OK:m.dirPanel.setDirections(t);break;case s.ZERO_RESULTS:alert("No route could be found between the origin and destination.");break;case s.OVER_QUERY_LIMIT:alert("The webpage has gone over the requests limit in too short a period of time.");break;case s.REQUEST_DENIED:alert("The webpage is not allowed to use the directions service.");break;case s.INVALID_REQUEST:alert("Invalid directions request.");break;case s.NOT_FOUND:alert("Origin or destination was not found.");break;default:alert("A directions request could not be processed due to a server error. The request may succeed if you try again.");break}})}});if(l.value){a(g,"submit")}}}})();
2
  JavaScript for the WordPress plugin wp-flexible-map
3
  copyright (c) 2011-2012 WebAware Pty Ltd, released under LGPL v2.1
4
  */
5
+ function FlexibleMap(){var d,b,c,a=false;this.getMap=function(){return d};this.setMap=function(e){d=e};this.getCenter=function(){return b};this.setCenter=function(e){b=e};this.getKmlLayer=function(){return c};this.setKmlLayer=function(e){c=e};this.redrawOnce=function(){if(!a){a=true;this.redraw()}};this.mapTypeId=google.maps.MapTypeId.ROADMAP;this.mapTypeControl=true;this.scaleControl=false;this.panControl=false;this.zoomControl=true;this.streetViewControl=false;this.scrollwheel=false;this.draggable=true;this.dblclickZoom=true;this.zoom=16;this.markerTitle="";this.markerDescription="";this.markerLink="";this.markerShowInfo=true;this.markerDirections=false;this.markerDirectionsShow=false;this.markerDirectionsDefault="";this.markerAddress="";this.targetFix=true;this.navigationControlOptions={style:google.maps.NavigationControlStyle.SMALL};this.dirService=false;this.dirPanel=false;this.region="";this.locale="en";this.localeActive="en"}FlexibleMap.prototype=(function(){var e,c,a;if(document.addEventListener){e=function(g,f,h){g.addEventListener(f,h,false)};c=function(f){f.stopPropagation();f.preventDefault()};a=function(g,f){var h=document.createEvent("HTMLEvents");h.initEvent(f,true,true);g.dispatchEvent(h)}}else{if(document.attachEvent){e=function(f,g,h){f.attachEvent("on"+g,function(){h.call(f,window.event)})};c=function(f){f.cancelBubble=true;f.returnValue=0};a=function(g,f){var h=document.createEventObject();h.eventType=f;g.fireEvent("on"+f,h)}}}function b(g){var f=document.createElement("p");f.appendChild(document.createTextNode(g));return f.innerHTML.replace(/[\\\/"'\x00-\x1f\x7f-\xa0\u2000-\u200f\u2028-\u202f]/g,d)}function d(f){var g=f.charCodeAt(0);return"\\u"+("0000"+g.toString(16)).slice(-4)}return{constructor:FlexibleMap,i18n:{en:{"Click for details":"Click for details",Directions:"Directions",From:"From","Get directions":"Get directions"}},setlocale:function(f){this.locale=f;if(f in this.i18n){this.localeActive=f}else{f=f.substr(0,2);if(f in this.i18n){this.localeActive=f}else{this.localeActive="en"}}return this.localeActive},gettext:function(g){var f=this.i18n[this.localeActive];if(g in f){return f[g]}return""},showKML:function(f,l,i){var h=this,g=document.getElementById(f),m,k=this.showMap(f,[0,0]),j=new google.maps.KmlLayer(l);this.setKmlLayer(j);j.setMap(k);google.maps.event.addListenerOnce(k,"tilesloaded",function(){h.setCenter(k.getCenter());if(typeof i!="undefined"){k.setZoom(i);h.zoom=i}});if(this.markerDirections||this.markerDirectionsShow){this.startDirService(k);m=g.getAttribute("data-flxmap")}google.maps.event.addListener(j,"click",function(s){var q=s.featureData;if(!q._flxmapOnce){q._flxmapOnce=true;if(h.targetFix){var p=/ target="_blank"/ig;q.description=q.description.replace(p,"");q.infoWindowHtml=q.infoWindowHtml.replace(p,"")}if(h.markerDirections){var o=s.latLng,r=o.lat()+","+o.lng()+",'"+b(q.name)+"'",n='<br /><a href="#" data-flxmap-isdir="1" onclick="'+m+".showDirections("+r+'); return false;">'+h.gettext("Directions")+"</a>";q.infoWindowHtml=q.infoWindowHtml.replace(/<\/div><\/div>$/i,n+"</div></div>")}}});if(window.opera&&this.markerDirections){e(g,"click",function(n){if(n.target.getAttribute("data-flxmap-isdir")){c(n)}})}},showMarker:function(j,h,n){var g=this.showMap(j,h),q=new google.maps.Marker({map:g,position:new google.maps.LatLng(n[0],n[1])});if(!this.markerTitle){this.markerTitle=this.markerAddress}if(this.markerTitle){var m,o,s,k,l,p,r=this,f=document.createElement("DIV");f.className="flxmap-infowin";q.setTitle(this.markerTitle);l=document.createElement("DIV");l.className="flxmap-marker-title";l.appendChild(document.createTextNode(this.markerTitle));f.appendChild(l);if(this.markerDescription||this.markerLink){l=document.createElement("DIV");l.className="flxmap-marker-link";if(this.markerDescription){s=this.markerDescription.split("\n");for(m=0,o=s.length;m<o;m++){if(m>0){l.appendChild(document.createElement("BR"))}l.appendChild(document.createTextNode(s[m]))}if(this.markerLink){l.appendChild(document.createElement("BR"))}}if(this.markerLink){p=document.createElement("A");p.href=this.markerLink;p.appendChild(document.createTextNode(this.gettext("Click for details")));l.appendChild(p)}f.appendChild(l)}if(this.markerDirections){l=document.createElement("DIV");l.className="flxmap-directions-link";p=document.createElement("A");p.href="#";p.dataLatitude=n[0];p.dataLongitude=n[1];p.dataTitle=this.markerTitle;e(p,"click",function(i){c(i);r.showDirections(this.dataLatitude,this.dataLongitude,this.dataTitle)});p.appendChild(document.createTextNode(this.gettext("Directions")));l.appendChild(p);f.appendChild(l)}if(this.markerDirections||this.markerDirectionsShow){this.startDirService(g);if(this.markerDirectionsShow){this.showDirections(n[0],n[1],this.markerTitle)}}k=new google.maps.InfoWindow({content:f});if(this.markerShowInfo){k.open(g,q)}google.maps.event.addListener(q,"click",function(){k.open(g,q)})}},showAddress:function(f,g){var h=this,i=new google.maps.Geocoder();this.markerAddress=g;if(this.markerTitle===""){this.markerTitle=g}i.geocode({address:g,region:this.region},function(l,k){if(k==google.maps.GeocoderStatus.OK){var j=l[0].geometry.location,m=[j.lat(),j.lng()];h.showMarker(f,m,m)}else{alert("Map address returns error: "+k)}})},showMap:function(f,h){var g=new google.maps.LatLng(h[0],h[1]),i=new google.maps.Map(document.getElementById(f),{mapTypeId:this.mapTypeId,mapTypeControl:this.mapTypeControl,scaleControl:this.scaleControl,panControl:this.panControl,zoomControl:this.zoomControl,draggable:this.draggable,disableDoubleClickZoom:!this.dblclickZoom,scrollwheel:this.scrollwheel,streetViewControl:this.streetViewControl,navigationControlOptions:this.navigationControlOptions,center:g,zoom:this.zoom});this.setMap(i);this.setCenter(g);return i},redraw:function(){var h=this.getMap(),f=this.getCenter(),g=this.getKmlLayer();google.maps.event.trigger(h,"resize");h.setCenter(f);if(g){h.fitBounds(g.getDefaultViewport())}else{h.setZoom(this.zoom)}},startDirService:function(f){if(!this.dirService){this.dirService=new google.maps.DirectionsService()}if(!this.dirPanel){this.dirPanel=new google.maps.DirectionsRenderer({map:f,panel:document.getElementById(this.markerDirections)})}},showDirections:function(j,f,l){var g=document.getElementById(this.markerDirections),i=document.createElement("form"),o=this,k=this.region||"",m,h,n;while(!!(h=g.lastChild)){g.removeChild(h)}h=document.createElement("p");h.appendChild(document.createTextNode(this.gettext("From")+": "));n=document.createElement("input");n.type="text";n.name="from";n.value=this.markerDirectionsDefault;h.appendChild(n);m=document.createElement("input");m.type="submit";m.value=this.gettext("Get directions");h.appendChild(m);i.appendChild(h);g.appendChild(i);n.focus();if(typeof i.elements.from=="undefined"){i.elements.from=n}e(i,"submit",function(r){c(r);var s=this.elements.from.value;if(/\S/.test(s)){var p=(o.markerAddress==="")?new google.maps.LatLng(j,f):o.markerAddress,q={origin:s,region:k,destination:p,travelMode:google.maps.DirectionsTravelMode.DRIVING};o.dirService.route(q,function(v,t){var u=google.maps.DirectionsStatus;switch(t){case u.OK:o.dirPanel.setDirections(v);break;case u.ZERO_RESULTS:alert("No route could be found between the origin and destination.");break;case u.OVER_QUERY_LIMIT:alert("The webpage has gone over the requests limit in too short a period of time.");break;case u.REQUEST_DENIED:alert("The webpage is not allowed to use the directions service.");break;case u.INVALID_REQUEST:alert("Invalid directions request.");break;case u.NOT_FOUND:alert("Origin or destination was not found.");break;default:alert("A directions request could not be processed due to a server error. The request may succeed if you try again.");break}})}});if(n.value){a(i,"submit")}}}})();
flexible-map.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: Flexible Map
4
  Plugin URI: http://snippets.webaware.com.au/wordpress-plugins/wp-flexible-map/
5
  Description: Embed Google Maps in pages and posts, either by centre coodinates or street address, or by URL to a Google Earth KML file.
6
- Version: 1.4.1
7
  Author: WebAware
8
  Author URI: http://www.webaware.com.au/
9
  */
@@ -28,6 +28,7 @@ Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
28
  if (!defined('FLXMAP_PLUGIN_ROOT')) {
29
  define('FLXMAP_PLUGIN_ROOT', dirname(__FILE__) . '/');
30
  define('FLXMAP_PLUGIN_NAME', basename(dirname(__FILE__)) . '/' . basename(__FILE__));
 
31
 
32
  // shortcode tags
33
  define('FLXMAP_PLUGIN_TAG_MAP', 'flexiblemap');
@@ -60,5 +61,6 @@ $FlxMapPlugin = FlxMapPlugin::getInstance();
60
  * @param array $attrs
61
  */
62
  function flexmap_show_map($attrs) {
63
- echo apply_filters('flexmap_getmap', $attrs);
 
64
  }
3
  Plugin Name: Flexible Map
4
  Plugin URI: http://snippets.webaware.com.au/wordpress-plugins/wp-flexible-map/
5
  Description: Embed Google Maps in pages and posts, either by centre coodinates or street address, or by URL to a Google Earth KML file.
6
+ Version: 1.5.0
7
  Author: WebAware
8
  Author URI: http://www.webaware.com.au/
9
  */
28
  if (!defined('FLXMAP_PLUGIN_ROOT')) {
29
  define('FLXMAP_PLUGIN_ROOT', dirname(__FILE__) . '/');
30
  define('FLXMAP_PLUGIN_NAME', basename(dirname(__FILE__)) . '/' . basename(__FILE__));
31
+ define('FLXMAP_PLUGIN_VERSION', '1.5.0');
32
 
33
  // shortcode tags
34
  define('FLXMAP_PLUGIN_TAG_MAP', 'flexiblemap');
61
  * @param array $attrs
62
  */
63
  function flexmap_show_map($attrs) {
64
+ $plugin = FlxMapPlugin::getInstance();
65
+ echo $plugin->getMap($attrs);
66
  }
readme.txt CHANGED
@@ -7,7 +7,7 @@ Donate link: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_i
7
  Tags: google, maps, google maps, shortcode, kml
8
  Requires at least: 3.0.1
9
  Tested up to: 3.4.2
10
- Stable tag: 1.4.1
11
  License: GPLv2 or later
12
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
13
 
@@ -34,6 +34,12 @@ Flexible Map allows you to add Google Maps to your WordPress website.
34
 
35
  Click to see [WP Flexible Map in action](http://snippets.webaware.com.au/wordpress-plugins/wp-flexible-map/).
36
 
 
 
 
 
 
 
37
  == Installation ==
38
 
39
  1. Upload this plugin to your /wp-content/plugins/ directory.
@@ -51,6 +57,7 @@ To add a Flexible Map to a post or a page, add a shortcode [flexiblemap] and giv
51
 
52
  * **width**: width in pixels or valid CSS units, e.g. *width="500"*
53
  * **height**: height in pixels or valid CSS units, e.g. *height="400"*
 
54
  * **zoom**: zoom level as an integer, larger is closer, e.g. *zoom="16"*
55
  * **maptype**: type of map to show, from [roadmap, satellite], e.g. *maptype="roadmap"*; default=roadmap
56
  * **hidemaptype**: hide the map type controls, from [true, false], e.g. *hidemaptype="true"*; default=false
@@ -61,6 +68,9 @@ To add a Flexible Map to a post or a page, add a shortcode [flexiblemap] and giv
61
  * **scrollwheel**: enable zoom with mouse scroll wheel, from [true, false], e.g. *scrollwheel="true"*; default=false
62
  * **draggable**: enable dragging to pan, from [true, false], e.g. *draggable="true"*; default=true
63
  * **dblclickzoom**: enable double-clicking to zoom, from [true, false], e.g. *dblclickzoom="true"*; default=true
 
 
 
64
 
65
  = Additional parameters for centre coordinates or street address map =
66
 
@@ -72,18 +82,15 @@ Either the center or the address paramater is required. If you provide both, the
72
  * **title**: title of the marker, displayed in a text bubble, e.g. *title="Adelaide Hills"*
73
  * **link**: URL to link from the marker title, e.g. *link="http://example.com/"*
74
  * **description**: a description of the marker location (can have HTML links), e.g. *description="Lorem ipsum dolor sit amet"*
75
- * **directions**: show directions link in text bubble; by default, directions will be displayed underneath map, but you can specify the element ID for directions here.
76
  * **showdirections**: show directions when the map loads
77
  * **directionsfrom**: initial from: location for directions
78
- * **showinfo**: show the marker's info window when the map loads, from [true, false], e.g. *showinfo="true"*; default=true
79
- * **locale**: use a specific locale (language) for messages like the text of the Directions link, e.g. *locale="nl-BE"*
80
- * **region**: specify region to help localise address searches for street address map and directions, taken from the list of [ccTLD](http://en.wikipedia.org/wiki/List_of_Internet_top-level_domains#Country_code_top-level_domains) (without the .), e.g. *region="au"*
81
 
82
  *Samples*:
83
  `[flexiblemap center="-34.916721,138.828878" width="500" height="400" zoom="9" title="Adelaide Hills" description="The Adelaide Hills are repleat with wineries."]
84
- [flexiblemap address="116 Beaumont Street Hamilton NSW Australia" width="500" height="400" directions="true"]
85
- [flexiblemap center="-34.916721,138.828878" width="500" height="400" title="Adelaide Hills" directions="true"]
86
- [flexiblemap center="-34.916721,138.828878" width="500" height="400" title="Adelaide Hills" directions="my-dir-div"]`
87
 
88
  = Additional parameters for KML map =
89
 
@@ -128,7 +135,7 @@ Using a KML file, you can have as many markers on a map as you like, with as muc
128
 
129
  = Why won't my KML map update when I edit the KML file? =
130
 
131
- Google Maps API caches the KML file, so it often won't get your new changes. To force a change, append a URL query parameter with a number and increment the number each time you change the KML file. A nice simple and commonly used parameter name is v (for version), like this: .../my-map.kml?v=2
132
 
133
  = Why won't the map show my place when I use the address parameter? =
134
 
@@ -146,8 +153,53 @@ Since version 1.1.0, this plugin now uses localised messages for things like the
146
 
147
  The initial translations were made using Google Translate, so it's likely that some will be truly awful! Please help by editing the .js file for your language in the i18n folder, and tell me about it in the support forum.
148
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
149
  == Changelog ==
150
 
 
 
 
 
 
 
151
  = 1.4.1 [2012-09-11] =
152
  * fixed: targetfix was not stopping KML marker links opening in new window/tab since Google Maps API 3.9
153
 
7
  Tags: google, maps, google maps, shortcode, kml
8
  Requires at least: 3.0.1
9
  Tested up to: 3.4.2
10
+ Stable tag: 1.5.0
11
  License: GPLv2 or later
12
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
13
 
34
 
35
  Click to see [WP Flexible Map in action](http://snippets.webaware.com.au/wordpress-plugins/wp-flexible-map/).
36
 
37
+ = Sponsorships =
38
+
39
+ * directions on KML maps generously sponsored by [Roger Los](http://www.rogerlos.com/)
40
+
41
+ Thanks for sponsoring new features on WP Flexible Maps!
42
+
43
  == Installation ==
44
 
45
  1. Upload this plugin to your /wp-content/plugins/ directory.
57
 
58
  * **width**: width in pixels or valid CSS units, e.g. *width="500"*
59
  * **height**: height in pixels or valid CSS units, e.g. *height="400"*
60
+ * **id**: the CSS id of the container div (instead of a random generated unique ID), e.g. *id="my_map"*
61
  * **zoom**: zoom level as an integer, larger is closer, e.g. *zoom="16"*
62
  * **maptype**: type of map to show, from [roadmap, satellite], e.g. *maptype="roadmap"*; default=roadmap
63
  * **hidemaptype**: hide the map type controls, from [true, false], e.g. *hidemaptype="true"*; default=false
68
  * **scrollwheel**: enable zoom with mouse scroll wheel, from [true, false], e.g. *scrollwheel="true"*; default=false
69
  * **draggable**: enable dragging to pan, from [true, false], e.g. *draggable="true"*; default=true
70
  * **dblclickzoom**: enable double-clicking to zoom, from [true, false], e.g. *dblclickzoom="true"*; default=true
71
+ * **directions**: show directions link in text bubble; by default, directions will be displayed underneath map, but you can specify the element ID for directions here
72
+ * **region**: specify region to help localise address searches for street address map and directions, taken from the list of [ccTLD](http://en.wikipedia.org/wiki/List_of_Internet_top-level_domains#Country_code_top-level_domains) (without the .), e.g. *region="au"*
73
+ * **locale**: use a specific locale (language) for messages like the text of the Directions link, e.g. *locale="nl-BE"*
74
 
75
  = Additional parameters for centre coordinates or street address map =
76
 
82
  * **title**: title of the marker, displayed in a text bubble, e.g. *title="Adelaide Hills"*
83
  * **link**: URL to link from the marker title, e.g. *link="http://example.com/"*
84
  * **description**: a description of the marker location (can have HTML links), e.g. *description="Lorem ipsum dolor sit amet"*
85
+ * **showinfo**: show the marker's info window when the map loads, from [true, false], e.g. *showinfo="true"*; default=true
86
  * **showdirections**: show directions when the map loads
87
  * **directionsfrom**: initial from: location for directions
 
 
 
88
 
89
  *Samples*:
90
  `[flexiblemap center="-34.916721,138.828878" width="500" height="400" zoom="9" title="Adelaide Hills" description="The Adelaide Hills are repleat with wineries."]
91
+ [flexiblemap address="116 Beaumont Street Hamilton NSW Australia" region="au" directions="true"]
92
+ [flexiblemap center="-32.891058,151.538042" title="Mount Sugarloaf" directions="true"]
93
+ [flexiblemap center="-32.918827,151.806164" title="Nobby's Head" directions="my-dir-div"]`
94
 
95
  = Additional parameters for KML map =
96
 
135
 
136
  = Why won't my KML map update when I edit the KML file? =
137
 
138
+ Google Maps API caches the KML file, so it often won't get your new changes. To force a change, append a URL query parameter with a number and increment the number each time you change the KML file (known as a cache buster). A nice simple and commonly used parameter name is v (for version), like this: http://example.com/my-map.kml?v=2
139
 
140
  = Why won't the map show my place when I use the address parameter? =
141
 
153
 
154
  The initial translations were made using Google Translate, so it's likely that some will be truly awful! Please help by editing the .js file for your language in the i18n folder, and tell me about it in the support forum.
155
 
156
+ = The map is broken in jQuery UI tabs =
157
+
158
+ When you hide the map in a tab, and then click on the tab to reveal its contents, the map doesn't know how big to draw until it is revealed. You need to give Google Maps a nudge so that it will pick up the correct size and position when you reveal it. Here's some sample jQuery code to do this, which you should add somewhere on the page (e.g. in your theme's footer):
159
+
160
+ `<script>
161
+ jQuery(function($) {
162
+
163
+ $('div.ui-tabs').bind('tabsshow', function(event, ui) {
164
+ $("#" + ui.panel.id + " div.flxmap-container").each(function() {
165
+ var flxmap = window[this.getAttribute("data-flxmap")],
166
+ flxmap.redrawOnce();
167
+ });
168
+ });
169
+
170
+ });
171
+ </script>`
172
+
173
+ = How can I get access to the map object? =
174
+
175
+ If you want to add your own scripting for the map, you can get the map object by identifying the FlexibleMap global variable for your map, and asking it to getMap(). By default, each FlexibleMap is given a randomly generated ID and the global variable name is derived from that. The map's containing div has a data property with this global variable name. Here's some sample jQuery code that gets the map object for the (first) map:
176
+
177
+ `$(window).load(function() {
178
+ var flxmapName = $("div.flxmap-container").attr("data-flxmap");
179
+ var flxmap = window[flxmapName];
180
+ var map = flxmap.getMap();
181
+ // ... use map ...
182
+ });`
183
+
184
+ Alternatively, you can specify the ID used for a given map, and it will then derive the global variable name from that. Here's a sample shortcode:
185
+
186
+ `[flexiblemap center="-32.891058,151.538042" id="sugarloaf"]`
187
+
188
+ And here's some sample jQuery code:
189
+
190
+ `$(window).load(function() {
191
+ var map = flxmap_sugarloaf.getMap();
192
+ // ... use map ...
193
+ });`
194
+
195
  == Changelog ==
196
 
197
+ = 1.5.0 [2012-09-29] =
198
+ * added: new shortcode attribute "id" which will be used for the container div, instead of the random unique div id
199
+ * added: FlexibleMap object is accessible via global variable with name derived from container div id (e.g. if you need to access the Google Maps map object in your own scripts)
200
+ * added: redraw() and redrawOnce() methods, for when the map needs to be redrawn correctly (e.g. when hidden then revealed)
201
+ * added: KML maps support directions (sponsored by [Roger Los](http://www.rogerlos.com/) -- thanks!)
202
+
203
  = 1.4.1 [2012-09-11] =
204
  * fixed: targetfix was not stopping KML marker links opening in new window/tab since Google Maps API 3.9
205