Google Summer of Code Proposal: Repeater Pagination, Google Maps and Ajax Support
Since version 2.1.9 Cocoon offers some Ajax features in the CForms block, partly using the dojo toolkit. The support for the repeater widget is largely implemented but lacks the chance of pagination. This feature includes setting a maximal number of repeater rows displayed per page and providing a user interface to browse the datapages forwards and backwards. My proposal consists of three independent parts being part of ajax integration:
- The implementation of the mentioned repeater pagination including binding.
- Replacement of existing cform implementations with dojo-implementations and ideas for new features
- Integration of Google Maps
Repeaters are commonly used to display and edit data-sets. CForms provides ajax features to add/delete rows and sorting repeater-rows. For usabilty reasons it would be good to have the possibility to make repeaters pageable, mainly in use-cases where large amounts of repeater rows occur. The goal is to modify the current repeater implementation as well as the repeater binding implementation to make pagination, filtering and sorting work with and without ajax activated.
Replace existing implementations with dojo-implementations and ideas for new features
The dojo toolkit provides a repository of ready-to-use html widgets with ajax support and some parts of cforms already use the toolkit. I would like to transfer some other parts of cforms to dojo, namely tabbed groups, the date/time picker widget and the htmlarea. Additionally I have some ideas about new features.
dynamic data lookup:
Clicking on an icon next to an input field opens a window and you get a table with values to search from. Using dojo the window is an internal frame and offers enhanced searching and filtering. This feature is similar to the cocoon suggest field (http://localhost:8888/samples/blocks/forms/do-suggest.flow) but extends the search possibilities including eg. wildcard matching.
resizeable input fields:
Make textareas resizeable to fit the user's need of space.
Google Maps integration
As with version 2 of the api google maps became really powerful and now contain map-data of the European Union, I would like to implement a simple way to include a map in form. Features provided should be creation of a map, centering, zooming and adding markers and events to the map. The map widget type should store and bind values for longitude and latitude using a Point - Object, so the get/setValue can be used to access the users' input.
A sample form definition part may look like this:
<fd:map id="mymap" type="google">
<fd:initial-point lon="42.54643" lat="10.34221"/>
<fd:point lon="42.54643" lat="10.34221"/> <fd:text>This is the center of the map</fd:text>
<fd:point lon="41.54643" lat="10.3423"/> <fd:text>My Home</fd:text>
- alert("You clicked on the map");
code that extends Cocoon
- forms-advanced-field-styling.xsl including dojo enhancements
- repeater and repeater binding
- map widget
- a tutorial explaining the new repeater features like pagination
- a tutorial explaining the map widget type
- enhance existing documentation by the new rendering and ajax options
exploring current cocoon and dojo code
documentation and tutorials
Matthias Epheser: matthias.epheser.at.gmx.at
I am attending the master studies of business informatics at the Technological University of Vienna and I'm working as a programmer on JAVA desktop- and web-development (using Cocoon) for 3 years. In my latest projects I gained experience using the DOJO toolkit as well as Google Maps alongside Apache Cocoon.