toolbar
Generic and extensible toolbar implementation
Description
The toolbar bundle provides a common interface for other bundles to add and manipulate tool buttons to a common toolbar. Bundles can add, remove, disable and enable buttons in the toolbar. The toolbar is rendered to a HTML element with id "toolbar". The bundle doesn't create it but assumes it exists on the page.
TODO
- Currently toolbar has a set of default buttons. These should be added by other bundles instead of configuration for preventing buttons.
- Handling missing for disabling an active tool (selected tool is disabled through request)
Screenshot
Bundle configuration
Toolgroups and tools can be excluded from being added by default.
In the example below, all tools are excluded from the toolbar.
"conf": {
"history": {
"reset": false,
"history_back": false,
"history_forward": false
},
"basictools": {
"zoombox": false,
"select": false,
"measureline": false,
"measurearea": false
},
"viewtools": {
"link": false,
"print": false
}
}
The following example also excludes all the tools from the toolbar, by setting all groups to false.
"conf": {
"history": false,
"basictools": false,
"viewtools": false
}
A toolbar can also contain color configs:
"conf": {
"colours": {
"hover": "#ff0000",
"background": "#00ff00"
}
}
Hover color is used when hovering icon and Toolbar.ToolbarRequest add operation data not contains color configuration.
Background color is now only used to calculate light/dark icon classes. Configuration is used when Toolbar.ToolbarREquest add operation data not contains color configuration.
Bundle state
state : {
selected : {
id : '<id for the selected button>',
group: '<group for the selected button>'
}
}
Requests the bundle sends out
Currently default buttons send out requests but these should be defined in bundles that use toolbar.
Request | Why/when |
---|---|
ToolSelectionRequest | tbd |
StateHandler.SetStateRequest | tbd |
ClearHistoryRequest | tbd |
Dependencies
Depends on an element with id "toolbar" to be present on DOM. Print and link buttons require mapfull bundle, Oskari.userinterface.component.Popup and Oskari.userinterface.component.Button from divmanazer bundle.
Dependency | Linked from | Purpose |
---|---|---|
jQuery | Version 1.7.1 assumed to be linked (on page locally in portal) | Used to create tool buttons/HTML |