This page is Obsolete
Advanced Control
Work in progress: http://trac.openlayers.org/browser/sandbox/camptocamp/advancedcontrol
Actual Limitations
- Mouse tools are not exclusive
When more than one Mouse Control (like MouseDefault) are added to the map, it generate a problem because all the mouse event functions are performed. So Mouse Control should be exclusive and managed on the map with the State pattern proposed by Cameron Shorter.
- Style and content separation
Some projects integration need to use their own styles for the UI. Some current Control classes are using Rico to create round borders and it's very difficult to change the style of a widget. A more Generic could be to just create the divs in the Control and to manage their style with the theme concept to all the UI.
Google Maps and MapGuide open source are using png transparency in ie . The progid:DXImageTransform.Microsoft.AlphaImageLoader ie function is used to do that and works.
- Generalize the controls and the creation of control with a basic api
A general base to create controls could be very useful. Some basic and simple controls could be create, like button, checkbox, radio, container, tool, toolbar, etc. For example, the LayerSwitcher could be a container control which aggregates checkboxes and radios control to manage the different Layers.
- Outside Control
For now, all the controls are happened to the map viewport, so they appear inside the map. It would be nice if the user had the possibility to set a DOM element as a container for the control.
Architecture
First architecture proposition
- Control
- Image
- Button
- Label
- Checkbox
- Choice
- SlideBar
- Container
- ActionListener (All the controls can performed multiple actions with the addActionListener method)
- MouseListener (this class contains all the mouse actions method and can be set to the map)
All the advanced control are compositions of primitive controls
- Control
- PanUp (inherit from Image and set a default action)
- PanDown (idem)
- ...
- Layer (inherit from Container and aggregate Label, Radio and Checkbox Objects)
- LayerSwitcher (inherit from Container and aggregate Layer Objects)
- PanZoom (inherit from Container and aggregate Pan and Zoom Objects)
The Theme folder is usualy used to store the images and the css files. So it's possible to define different layouts. The HTML elements are always hard-coded in the javascript source but not the style.
Suggestions and propositions
add your comments
