[OpenLayers-Dev] Toolbar Status

Christopher Schmidt crschmidt at metacarta.com
Fri Mar 9 05:15:08 EST 2007


As part of the development efforts on the vector branch, we've developed
a toolbar functionality plan. I'm going to post some more on this, but
we're coming down on the tail end of a ~14 hour hack session, so I'm
just posting some of the results now.

So:

 http://dev.openlayers.org/sandbox/vector-2.4/lib/OpenLayers/Control/Panel.js

This panel implments a toolbar. A toolbar gathers a set of controls.
Controls which can be put on a toolbar include any tools which include
either:
 * activate/deactivate -- Modal and 'toggle' tools will use this
 * trigger -- 'buttons' (a la zoomToMaxExtent) will use this
 
We've already got modal tools working: The MouseToolbar code has been
rewritten with this: 

http://dev.openlayers.org/sandbox/vector-2.4/examples/mousetoolbar.html

You can see that the code is now only about a half dozen lines of real
code:

http://dev.openlayers.org/sandbox/vector-2.4/lib/OpenLayers/Control/MouseToolbar.js

If you look to the bottom of
http://dev.openlayers.org/sandbox/vector-2.4/theme/default/style.css
you'll see where all images are defined. This means that by just editing
CSS, you can change the position, size, and images of your toolbar.

You can see this in action on
http://dev.openlayers.org/sandbox/vector-2.4/examples/panel.html , which
overrides the CSS and displays images from different places, as well as
using a blank div for one control (in this case, the zoombox). 

This can be easily put into a seperate div: simply pass a {div:
$('mydiv")} option into the constructor.

I *think* this encapsulates much of the functionality that existing
button bars have demonstrated. Controls continue to have their own div
-- which can be placed inside the map or not -- and panels control the
display of the items -- via CSS, which allows you to do funky things
like 'hover', etc.

(Some of this doesnt work in IE yet. I know.)

So, the goal is to have 3 types of controls: 
  * Button: A click triggers an action (like zoom in)
  * Modal: Turns state on temporarily. Drawing tools  probably use
    this.
  * Toggles. Auto-pan might fall under this: when it's active, the map
    responds. when it's not, it doesn't. 

Do these fit all the needs address by buttons?    

Regards,
-- 
Christopher Schmidt
MetaCarta



More information about the Dev mailing list