Google Maps Plugin for FCKeditor

Change your language

Introduction

This is a dialog-based plugin to handle insertion and modification of Google Maps in FCKeditor

Author:

Alfonso Martínez de Lizarrondo

Version history:

1.0: 25/08/2007. First version.
1.1: 28/08/2007. Ups, didn't test 2.4.3
1.2: 31/08/2007. New icon by Dynamical.biz. Use IMG instead of DIV as placeholder for the moment.
1.3: 02/09/2007. Complete documentation in HTML for installation and users.
1.4: 21/09/2007. Use the onload event to generate the maps (to avoid IE issues), and include the call to GUnload call. Automatically remove the toolbar icon if there is no proper Google Key
1.5: 30/09/2007. Support for drawing polylines in the map.
1.6: 24/10/2007. Support for multiple markers.
1.7: 03/02/2008. Support for the new dialogs in FCKeditor 2.6.
1.8: 02/05/2008. Support for Terrain view and remembering the selected map type. The preview in the editor now uses the static maps.
1.9: 19/05/2008. It respects the values set for width and height (only assumes that they are pixel if they are numbers without any modifier)
Optional configuration parameters: GoogleMaps_WrapperClass and GoogleMaps_PublicKey (this code proposed by Makerweb.it) .
1.95: 12/09/2008. The preview reflects the real type of the map. It shows also the markers.
Dutch translation added
1.96: 14/09/2008. Preserve any previous onload handler.
French translation added
1.97: 20/09/2008. Simplified the onload handler according to the advice by Hector Virgen.
1.98: 15/02/2009. Fixed some issues with the GoogleMaps_PublicKey setting
Chinese translation added
Norwegian translatioin added

Get the latest version and/or updated info

Known bugs:

The 'Preview' command in FCKeditor won't work properly if there's a GoogleMap in the content. This seems related to the way the Google Maps API script loads and inserts its content.

These threads in the API group point to the same problem:
http://groups.google.com/group/Google-Maps-API/browse_thread/thread/7849dfd612181b6c/1c3e5f7fb5fa3301
http://groups.google.com/group/Google-Maps-API/browse_thread/thread/89ea5fa4e0a0ccb9/05c364940447891d

A workaround for the problem could be to use the Server preview plugin

Installation

1. Copying the files

Extract the contents of the zip in you plugins directory, so it ends up like this
Screenshot of installation

editor\
	...
	js\
	lang\
	plugins\
		...
		googlemaps\
			fckplugin.js
			readme.html
			dialog\
			docs\
			images\
			lang\
		...
	skins\

2. Adding it to FCKeditor

Now add in your fckconfig.js or custom js configuration file the following line: FCKConfig.Plugins.Add( 'googlemaps', 'de,en,es,fr,it,nl,no,zh') ;

3. Adding it to the toolbarset

Add the button 'googlemaps' (lowercase) to your toolbarset: FCKConfig.ToolbarSets["Basic"] = [ ['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink', '-','googlemaps','-','About'] ] ;

4. Configure the plugin

The most important part is your GoogleMaps key. It must be set properly for the plugin to work, or Google will refuse to serve the maps data.
You must get one for each server where you want to use the plugin, just get the key for free here after agreeing to the Terms of Use of the GoogleMaps API: http://www.google.com/apis/maps/signup.html
(Please don't ask questions about where you can use GoogleMaps or how to get key, those items aren't related to this plugin.)
For example the key for "localhost" is
ABQIAAAAlXu5Pw6DFAUgqM2wQn01gxT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSy5hTGQdsosYD3dz6faZHVrO-02A

Once you get the key, you must set it in the configuration file: FCKConfig.GoogleMaps_Key = 'ABQIAAAAlXu5Pw6DFAUgqM2wQn01gxT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSy5hTGQdsosYD3dz6faZHVrO-02A' ;

(remember to replace the key in green with your own one)

Note: if you leave an empty string then the toolbar icon won't be shown (so you can easily use the same toolbar configuration as the current setup in FCKeditor doesn't allow to add/remove plugins/ToolbarIcons in a really easy way)

There are several options that you can set to change the default values for a new map:

FCKConfig.GoogleMaps_Width : The width of the map area
FCKConfig.GoogleMaps_Height : The height of the map area
FCKConfig.GoogleMaps_CenterLat : The latitude of the center
FCKConfig.GoogleMaps_CenterLon :The longitude of the center
FCKConfig.GoogleMaps_Zoom : The zoom level
FCKConfig.GoogleMaps_MarkerText : The text for the marker
FCKConfig.GoogleMaps_WrapperClass : The Google Maps automatically fills the width and height of the generated div, so if you want to add a little spacing and a border, you need to use a div around it. If this entry contains a non-empty value then such a div will be generated with this class.
Important: in the preview inside the editor, the class will be applied to an image, not a div!
FCKConfig.GoogleMaps_PublicKey : If you are using the editor in a different domain than the final location of the web, the maps won't work correctly by default. In this situation you must use this setting. First, set the GoogleMaps_Key to the key of the domain where FCKeditor will be run, and then you have two options:
- Set an emtpy value for GoogleMaps_PublicKey (FCKConfig.GoogleMaps_PublicKey = '';) this means that when the user wants to create a map he must supply the key for the final domain. This is useful if you don't know beforehand all the domains where that installation will be used. Of course, you must explain to your users how to get an API Key
- Set the value of the final domain in GoogleMaps_PublicKey. For the user this means no troubles at all, everything works automatically.

All these values can be set in the fckconfig.js file, a custom js configuration file, or at the moment of the creation of the FCKeditor instance using any language.

5. Use it

Now empty the cache of your browser and reload the editor, the new button should be ready to use.

Final notes

If you find this plugin useful, consider making a donation so it can be further improved, any amount can help to keep the development running.

If you need some special feature for this plugin, or if you need any other kind of plugin for FCKeditor then contact me and we can discuss it

Disclaimers

Google, Google Maps and the Google Maps API are all properties of Google.