skip to navigation
skip to content

collective.geo.mapcontent 0.1

Map content type for collective.geo (use c.g/MapWidget and c.g.openlayers) by Makina Corpus

Downloads ↓

Introduction

This is a very small and lightweight integration of OpenLayers and collective.geo.mapwidget. Idea is to have a map content type to create full customizable maps with the collective.geo flexibility. And the final goal is to store some javascript boilerplate on a content type to initiliaze the map.

As it requires writing some javascript with OpenLayers and jquery, it is not an 'end user' solution but a convenient and flexible way to integrate OpenLayers in plone.

Installation

Just a simple easy_install collective.geo.geopoint is enough. Alternatively, buildout users can install collective.geo.geopoint as part of a specific project's buildout, by having a buildout configuration such as:

[buildout]
...
eggs =
    collective.geo.mapcontent
...
[instance]
...
zcml =
    collective.geo.mapcontent

How to use

In the plone interface, just add a map. Your mapid is : mapcontent. Then, fill some javascript inside the content type 'javascript' text area to display the map using mapwidget:

- set the box width and height
- set the long/lat/zoom settings
- set the layers

EG:

jq('#mapcontent').css('height', '1024px');
jq('#mapcontent').css('width', '1024px');
var coords = {lon: 0.000000, lat: 0.000000, zoom: 10};
cgmap.state = {'default': coords, 'mapcontent': coords};
cgmap.extendconfig(
  {layers: [function() {
  return new OpenLayers.Layer.WMS("OpenLayers WMS",
                                  "http://vmap0.tiles.osgeo.org/wms/vmap0",
                                  {layers: 'basic'});}
           ]
  }, 'mapcontent');

Mapwidget will initialize the map with those settings for you. And, remember, you are working with mapwidget. This one wraps OpenLayers and here are some usefull tips:

  • cgmap.config['mapcontent'].map:
     the current OpenLayers map instance
  • cgmap.config['mapcontent'].layers:
     the list of function callbacks returning a layer
  • cgmap.state['mapcontent']:
     the current long/lat/zoom settings (js mapping).

If you need to control the map afterwards, just register something when document is ready. EG:

// add this in the /edit js textarea
jq(document).ready(function() {
    cgmap['config']['mapcontent'].map.DOSOMETHING();
});

Tests

Being a doctest, we can tell a story here.

First, we must perform some setup. We use the testbrowser that is shipped with Five, as this provides proper Zope 2 integration. Most of the documentation, though, is in the underlying zope.testbrower package.

>>> from Products.Five.testbrowser import Browser
>>> browser = Browser()
>>> portal_url = self.portal.absolute_url()

The following is useful when writing and debugging testbrowser tests. It lets us see all error messages in the error_log.

>>> self.portal.error_log._ignored_exceptions = ()

With that in place, we can go to the portal front page and log in. We will do this using the default user from PloneTestCase:

>>> from Products.PloneTestCase.setup import portal_owner, default_password

Because add-on themes or products may remove or hide the login portlet, this test will use the login form that comes with plone.

>>> browser.open(portal_url + '/login_form')
>>> browser.getControl(name='__ac_name').value = portal_owner
>>> browser.getControl(name='__ac_password').value = default_password
>>> browser.getControl(name='submit').click()

Here, we set the value of the fields on the login form and then simulate a submit click. We then ensure that we get the friendly logged-in message:

>>> "You are now logged in" in browser.contents
True

Finally, let's return to the front page of our site before continuing

>>> browser.open(portal_url)

The Map Content content type

In this section we are tesing the Map Content content type by performing basic operations like adding, updadating and deleting Map Content content items.

Adding a new Map Content content item

We use the 'Add new' menu to add a new content item.

>>> browser.getLink('Add new').click()
>>> browser.getControl('Map Content').click()
>>> browser.getControl(name='form.button.Add').click()
>>> browser.getControl(name='title').value = 'Map Content Sample'
>>> js = """
... jq('#mapcontent').css('height', '1024px');
... jq('#mapcontent').css('width', '1024px');
... var coords = {lon: 0.000000, lat: 0.000000, zoom: 10};
... cgmap.state = {'default': coords, 'mapcontent': coords};
... cgmap.extendconfig(
...   {layers: [function() {
...                  return new OpenLayers.Layer.WMS("OpenLayers WMS", "http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'});}
...            ]
...   },
...   'mapcontent');
... """
>>> browser.getControl(name='_js').value = js
>>> browser.getControl('Save').click()
>>> 'Changes saved' in browser.contents
True

Rendering

And we are done! We added a new 'Map Content' content item to the portal and in view mode, it will render using the mapwidget macros

>>> '<script type="text/javascript">'+js in browser.contents
True

Changelog

0.1 (2010-11-10)

  • Initial release [kiorky]
 
File Type Py Version Uploaded on Size # downloads
collective.geo.mapcontent-0.1.tar.gz (md5) Source 2010-11-10 17KB 419