Skip to content. | Skip to navigation

Four Digits | Jansbinnensingel 26, 6811 AL Arnhem, The Netherlands | info@fourdigits.nl
 
Rob Gietema is one of the CEOs of Four Digits and a Zope developer for eight years. Rob was responsible for creating the front-end including the WYSIWYG editor for Coherence 2 (a CMS based on Zope). At the moment Rob is a Plone developer and maintainer of the TinyMCE Editor Plone product and the Round About Plone product. He is also currently working on the new UI for Plone (Deco).
 

Collections, Contentlistings and Search

by Rob Gietema Aug 19, 2009

A sprint at Jarn (Norway) to complete the remaining PLIP's related to collections, contentlistings and search.

Sorrento

At the European Plone Symposium in Sorrento (Italy) we organized a Birds of a Feather session about how to improve collections, contentlistings and search. Among the participants were Geir Baekholt, Carsten Senger and our complete team. Laurens organized the BOF session using his Plone UI research document as input.

PLIP's

The outcome of the BOF sessions lead to five PLIP's:

  • PLIP 9295 Improved UI for collections
  • PLIP 9283 A more lightweight backend for collections
  • PLIP 9352 Combination of search results PLIPs (merge of 9271 and 9282)
  • PLIP 9327 Unified interface for lists of content
  • PLIP 9321 Reimplement the search form with an eye on usability

Carsten took up PLIP 9321 which left us four plips to complete.

Sprint

Since the four PLIPs had a lot of overlap we decided to team up with Jarn and complete them all at once. On thursday morning we had a brainstorm session to determine what we already had and which direction to go. Geir already had a working package for plone.app.contentlisting for PLIP 9327 and we had done some work on the search results PLIP. After the brainstorm session we came up with a design using three packages:

  • plone.app.contentlisting to create the unified interface of the content listings
  • plone.app.search to contain all the search related functionality
  • plone.app.collection to contain the Collection content type

Backend

Ralph, Roel and Geir worked on the backend. They used the :records mechanism of Zope to parse the query string. One query line consists of an index (query.i:records), an operator (query.o:records) and a value (query.v:records or query.v:records:list if it was a multiple input field). This query string was converted to a catalog query to get the actual search results.

Ralph & Roel

Roel, Ralph and Geir working on the backend

User interface

Laurens, Denys and I worked on the user interface. We used the design from the PLIP and created a static HTML prototype to see if the design we came up with actually worked. Once we agreed this was the right way to go, we continued to build the query builder using the code from the backend team.

Laurens, Denys and Rob

Laurens, Denys and me working on the UI

Collection type

Once we got the query parser and the query builder done, it was time to glue everything together and store the query on the collection type. We worked throughout the weekend to get everything done just before the plip deadline. Ralph and Roel created the Collection type and Laurens and I finished the query builder and put the query builder into the criterion edit form of the new Collection type.

View

Finishing the collection type while enjoying the nice view.

Final result

Below is a screenshot of the javascript version of the query builder. The first column shows all the available indexes, the second the operator and the third the value. To keep every rule one line we used pulldown menu's for multi selects. The fourth column has a remove criteria button and finally the fifth column shows the remaining matching items after this rule was applied. This provides instant feedback of the number of results per rule, so when there are no results you can see right away wich rule caused this. Below the criteria you can select the sorting order and below that you can see a live search of the matching elements of your query.

Non javascript fallback

The interface also has a non-javascript fallback which looks almost the same. See image below:

Non-javascript fallback interface

Folder summary

After saving the query you can select view methods for the collection. These methods use the plone.app.contentlisting package build by Geir.

Summary view of the collection

Thanks go out to Jarn for providing the sprint location and we hope the framework team is as excited about the end-result as we are!

 
Alexander Limi

Nice work!

Posted by Alexander Limi at Aug 19, 2009 05:27 PM
Can't wait to test this. Also, love the pictures from the pair programming room. Didn't know it was built for trio programming. :)
 
toutpt@gmail.com

search criteria

Posted by toutpt@gmail.com at Aug 20, 2009 09:00 AM
It reminds me the form I have done based on thunderbird's contact manager advanced search form.

Have you thought about grouping criteria with and / or between each other ?
 
Ingeborg van den Heuvel

Collections

Posted by Ingeborg van den Heuvel at Aug 25, 2009 02:36 PM
Hey, it looks great. This sure will be an improvement. I'm looking forward to Plone 4.
 
Made by Four Digits based on Plone.
Made by Four Digits based on Plone.