Skip to main content

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

Project description

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]

Project details


Release history Release notifications

This version
History Node

0.1

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Filename, size & hash SHA256 hash help File type Python version Upload date
collective.geo.mapcontent-0.1.tar.gz (17.8 kB) Copy SHA256 hash SHA256 Source None

Supported by

Elastic Elastic Search Pingdom Pingdom Monitoring Google Google BigQuery Sentry Sentry Error logging AWS AWS Cloud computing DataDog DataDog Monitoring Fastly Fastly CDN SignalFx SignalFx Supporter DigiCert DigiCert EV certificate StatusPage StatusPage Status page