thank you for the plugin!
how can i show traffic?
Hello,
I have had problem with your plugin not displaying popup on button ( tinymce button ) clicking.
And as there’s new version of TinyMce in WP core you’ll need to add some extra code.
here’s it is ( for me it works ):
( function() {
tinymce.PluginManager.add( 'royalgmap', function( editor, url ) {
// Add a button that opens a window
editor.addButton( 'royalgmap_button', {
title : 'Royal Google Maps Shortcode Generator', // title of the button
text : '',
image: url + '/gmap.png',
onclick: function() {
// triggers the thickbox
var width = jQuery(window).width(), H = jQuery(window).height(), W = ( 720 < width ) ? 720 : width;
W = W - 80;
H = H - 115;
tb_show( 'Google Maps Shortcode', '#TB_inline?width=' + W + '&height=' + H + '&inlineId=royalgmap-form' );
}
} );
} );
// executes this when the DOM is ready
jQuery(function(){
// creates a form to be displayed everytime the button is clicked
// you should achieve this using AJAX instead of direct html code like this
var form = jQuery('<div id="royalgmap-form"><table id="royalgmap-table" class="form-table">\
<tr>\
<th><label for="royalgmap-id">Map ID</label></th>\
<td><input type="text" name="id" id="royalgmap-id" value="map1" /><small>Give an Unique ID for Every Map</small>\
</tr>\
<tr>\
<th><label for="royalgmap-w">Map Width</label></th>\
<td><input type="text" name="w" id="royalgmap-w" value="100%" /><small>Width in pixels or percentages</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-h">Map Height</label></th>\
<td><input type="text" name="h" id="royalgmap-h" value="400" /><small>Height in pixels</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-lat">Latitude</label></th>\
<td><input type="text" id="royalgmap-lat" name="lat" value="23" /><small>Just give Latitude value</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-lon">Longitude</label></th>\
<td><input type="text" id="royalgmap-lon" name="lon" value="90" /><small>Just give Longitude value</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-zoom">Zoom</label></th>\
<td><select name="zoom" id="royalgmap-zoom">\
<option value="1">1</option>\
<option value="2">2</option>\
<option value="3">3</option>\
<option value="4">4</option>\
<option value="5">5</option>\
<option value="6">6</option>\
<option value="7">7</option>\
<option value="8">8</option>\
<option value="9">9</option>\
<option value="10" selected>10</option>\
<option value="11">11</option>\
<option value="12">12</option>\
<option value="13">13</option>\
<option value="14">14</option>\
<option value="15">15</option>\
<option value="16">16</option>\
<option value="17">17</option>\
<option value="18">18</option>\
<option value="19">19</option>\
<option value="20">20</option>\
</select><small>Google Map Zoom</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-zc">Zoom Control</label></th>\
<td><select name="zc" id="royalgmap-zc">\
<option value="true" selected>True</option>\
<option value="false">False</option>\
</select><small>Zoom Control</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-zco">Zoom Size</label></th>\
<td><select name="zco" id="royalgmap-zco">\
<option value="SMALL" selected>SMALL</option>\
<option value="LARGE">LARGE</option>\
</select><small>Zoom Size</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-maptype">Map Type</label></th>\
<td><select name="maptype" id="royalgmap-maptype">\
<option value="ROADMAP" selected>ROADMAP</option>\
<option value="SATELLITE">SATELLITE</option>\
<option value="HYBRID">HYBRID</option>\
<option value="TERRAIN">TERRAIN</option>\
</select><small>Map Type</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-marker">Marker</label></th>\
<td><select name="marker" id="royalgmap-marker">\
<option value="yes" selected>Yes</option>\
<option value="no">No</option>\
</select><small>Marker</small></td>\
</tr>\
<tr>\
<th><label for="royalgmap-markerimage">Marker Image</label></th>\
<td><input type="text" id="royalgmap-markerimage" name="markerimage" value="" /><small>Full image URL</small>\
</td>\
</tr>\
<tr>\
<th><label for="royalgmap-infowindow">Info Window</label></th>\
<td><input type="text" id="royalgmap-infowindow" name="infowindow" value="Mehdi Akram" /><small>Info descriptions</small>\
</td>\
</tr>\
<tr>\
<th><label for="royalgmap-infowindowdefault">Info Window Default</label></th>\
<td><select name="infowindowdefault" id="royalgmap-infowindowdefault">\
<option value="no" selected>No</option>\
<option value="yes">Yes</option>\
</td>\
</tr>\
</table>\
<p class="submit">\
<input type="button" id="royalgmap-submit" class="button-primary" value="Insert Goole Map" name="submit" />\
</p>\
</div>');
var table = form.find('table');
form.appendTo('body').hide();
// handles the click event of the submit button
form.find('#royalgmap-submit').on('click', function(){
// defines the options and their default values
// again, this is not the most elegant way to do this
// but well, this gets the job done nonetheless
var options = {
'lat' : '23',
'lon' : '90',
'id' : 'map1',
'w' : '100%',
'h' : '400',
'zoom' : '10',
'zc' : 'true',
'zco' : 'SMALL',
'maptype' : 'TERRAIN',
'marker' : 'yes',
'markerimage' : '',
'infowindow' : '',
'infowindowdefault' : 'no'
};
var shortcode = '[royalmap';
for( var index in options) {
var value = table.find('#royalgmap-' + index).val();
// attaches the attribute to the shortcode only if it's different from the default value
if ( value !== options[index] )
shortcode += ' ' + index + '="' + value + '"';
}
shortcode += ']';
// inserts the shortcode into the active editor
tinyMCE.activeEditor.execCommand('mceInsertContent', 0, shortcode);
// closes Thickbox
tb_remove();
});
});
} )();Everyone else can copy these code ( until plugin is updated ) and paste it to js file in plugins folder.
Hope that helps someone )
I’m working on a food truck blog. I’m looking for a Google map plugin that will allow me to setup timed location pins for each food truck.
Example: Food Truck A is going to be at Location 1 from 10am-2pm and then they will be at Location 2 from 4pm-8pm.
Is there any way to set up timed location pins so that I can insert all of the locations for each food truck on a weekly basis and have the pins appear at the correct locations throughout the week?
Thanks for your help in advance!
]]>