VuFind

Add grid-view/gallery-view option for result page

Details

  • Type: New Feature New Feature
  • Status: Resolved Resolved
  • Priority: Minor Minor
  • Resolution: Fixed
  • Affects Version/s: None
  • Fix Version/s: 1.2
  • Component/s: Search
  • Labels:
    None
  • Environment:
    All

Description

Allow users to toggle the result display between list/grid/gallery. See examples:
 - Blacklight@Stanford: http://searchworks.stanford.edu/?q=joyce&search_field=search&view=gallery
 - Library of Congress Prints & Photos Catalogue: http://www.loc.gov/pictures/search/?q=ireland&st=grid
 - Europeana: http://www.europeana.eu/portal/brief-doc.html?query=ireland&start=1&view=table
 - Villanova Digital Library: http://digital.library.villanova.edu/Catholica%20Collection/?view=grid&page=1

Most of these examples are more or less exclusively for digital/visual collections, but Blacklight handles this well by creating dummy covers for books without covers. A simpler alternative would be to only present the grid/gallery option when certain format facets are applied. This feature would make VuFind more attractive for people seeking to integrate ILS bibliographic records with their digital repository/IR.

Attachments

  1. Text File
    gridview2.patch
    22/Sep/10 8:45 PM
    28 kB
    Eoghan Ó Carragáin
  2. Text File
    gridview4.patch
    14/Mar/11 9:05 PM
    49 kB
    Eoghan Ó Carragáin
  3. Text File
    gridview5.patch
    04/Apr/11 3:53 PM
    51 kB
    Demian Katz
  4. Text File
    gridview5b.patch
    04/Apr/11 8:54 PM
    14 kB
    Eoghan Ó Carragáin
  5. Text File
    gridview5c_fixformobiletheme.patch
    18/Apr/11 5:19 AM
    2 kB
    Eoghan Ó Carragáin
  1. grid.png
    0.2 kB
    09/Oct/10 8:03 PM
  2. gridview_screenshot.jpg
    117 kB
    01/Sep/10 9:17 PM
  3. gridview_screenshot2.jpg
    109 kB
    01/Sep/10 9:17 PM
  4. list.png
    3 kB
    09/Oct/10 8:03 PM
  5. noCover2.gif
    0.4 kB
    16/Mar/11 3:03 PM

Activity

Ascending order - Click to sort in descending order
Hide
Permalink
Eoghan Ó Carragáin added a comment -
Initial patch attached for feedback. I focused on getting the layout & toggle working.

Possible areas for further work/discusssion:
- make this a configurable option (this should be straight-forward enough)
- refactor *.tpls - this patch relies on smarty {if}s in Search/list-list.tpl and RecordDrivesr/Index/result.tpl to decide which layout to load. An alternative might be to load different tpls depending on the view, i.e. list-gird.tpl and result-grid.tpl. This would probably make it easier to add other views, but would result in some duplication of code between the tpls.
- Dummy bookcovers (like Blacklight) for items that have an ISBN but don't return a cover. There are options here - javascript onload event; use php imagecreate() in bookcover.php (adding a dependency) - but I can't think of any easy way to do this without reworking how bookcover.php is used currently.

Feedback appreciated.
Show
Eoghan Ó Carragáin added a comment - Initial patch attached for feedback. I focused on getting the layout & toggle working. Possible areas for further work/discusssion: - make this a configurable option (this should be straight-forward enough) - refactor *.tpls - this patch relies on smarty {if}s in Search/list-list.tpl and RecordDrivesr/Index/result.tpl to decide which layout to load. An alternative might be to load different tpls depending on the view, i.e. list-gird.tpl and result-grid.tpl. This would probably make it easier to add other views, but would result in some duplication of code between the tpls. - Dummy bookcovers (like Blacklight) for items that have an ISBN but don't return a cover. There are options here - javascript onload event; use php imagecreate() in bookcover.php (adding a dependency) - but I can't think of any easy way to do this without reworking how bookcover.php is used currently. Feedback appreciated.
Hide
Permalink
Eoghan Ó Carragáin added a comment -
Attaching two icons (borrowed from Stanford's Searchworks interface) for use with the patch. These should be placed in /web/images
Show
Eoghan Ó Carragáin added a comment - Attaching two icons (borrowed from Stanford's Searchworks interface) for use with the patch. These should be placed in /web/images
Hide
Permalink
Eoghan Ó Carragáin added a comment - - edited
Improved patch (gridview2.patch) attached. Most of the code is now part of the Search Object (Demian's suggestion), and is more or less based on how sorting works. In this version view-specific templates are loaded (e.g. result-grid.tpl/result-list.tpl and list-grid.tpl/list-list.tpl), which should make it easier to add other views. Also:
- it is now configurable through searches.ini - default view, view options etc. (as with sort)
- the last used view is stored as a session variable, so performing a new search or browse keeps the view preference

NOTE: the patch only covers the classic theme
Show
Eoghan Ó Carragáin added a comment - - edited Improved patch (gridview2.patch) attached. Most of the code is now part of the Search Object (Demian's suggestion), and is more or less based on how sorting works. In this version view-specific templates are loaded (e.g. result-grid.tpl/result-list.tpl and list-grid.tpl/list-list.tpl), which should make it easier to add other views. Also: - it is now configurable through searches.ini - default view, view options etc. (as with sort) - the last used view is stored as a session variable, so performing a new search or browse keeps the view preference NOTE: the patch only covers the classic theme
Hide
Permalink
Eoghan Ó Carragáin added a comment -
Updated patch (gridview4) against r3745. Improvements:
-- support for default and blueprint themes
-- validation of view type before attempting to load tpl
-- styling tweaks
Show
Eoghan Ó Carragáin added a comment - Updated patch (gridview4) against r3745. Improvements: -- support for default and blueprint themes -- validation of view type before attempting to load tpl -- styling tweaks
Hide
Permalink
Demian Katz added a comment -
The attached noCover2.gif is padded so that its aspect ratio is more book-like; this helps minimize distortion and stretching in the grid view.
Show
Demian Katz added a comment - The attached noCover2.gif is padded so that its aspect ratio is more book-like; this helps minimize distortion and stretching in the grid view.
Hide
Permalink
Demian Katz added a comment -
The attached patch (gridview5.patch, built against r3806) fixes some minor problems with the previous patch -- mostly cross-browser compatibility issues. It also adds some strings to the English language file.

There is at least one major unresolved issue, though: the view modes work perfectly in standard search results, but they can cause strange behavior on other search screens (new items, course reserves, author home, etc.). We need to figure out a way to handle this more consistently -- it may just be a matter of embedding view controls in more places.
Show
Demian Katz added a comment - The attached patch (gridview5.patch, built against r3806) fixes some minor problems with the previous patch -- mostly cross-browser compatibility issues. It also adds some strings to the English language file. There is at least one major unresolved issue, though: the view modes work perfectly in standard search results, but they can cause strange behavior on other search screens (new items, course reserves, author home, etc.). We need to figure out a way to handle this more consistently -- it may just be a matter of embedding view controls in more places.
Hide
Permalink
Eoghan Ó Carragáin added a comment -
Applying gridview5b.patch (also built against r3806) after gridview5.patch *should* resolve the issue with other search screens. I could only test the Author Home example but the fix should work for new items and course reserves too. Please test.
Show
Eoghan Ó Carragáin added a comment - Applying gridview5b.patch (also built against r3806) after gridview5.patch *should* resolve the issue with other search screens. I could only test the Author Home example but the fix should work for new items and course reserves too. Please test.
Hide
Permalink
Demian Katz added a comment -
Resolved in r3829; note that some work still needs to be done to improve the appearance of the "cover unavailable" graphic in grid mode -- the expanded-margin version of nocover2.gif attached to this ticket may be helpful, but we need a better permanent solution for the trunk.
Show
Demian Katz added a comment - Resolved in r3829; note that some work still needs to be done to improve the appearance of the "cover unavailable" graphic in grid mode -- the expanded-margin version of nocover2.gif attached to this ticket may be helpful, but we need a better permanent solution for the trunk.
Hide
Permalink
Eoghan Ó Carragáin added a comment -
Grid view is not currently supported in the mobile theme. However, if someone on a mobile device follows a link which includes &view=grid in the URL, they are presented with a smarty error saying the necessary template could not be found. The gridview5c_fixformobiletheme.patch adds dummy tpl files to the mobile and jquerymobile themes which simply subtemplate/include their list view equivalents.
Show
Eoghan Ó Carragáin added a comment - Grid view is not currently supported in the mobile theme. However, if someone on a mobile device follows a link which includes &view=grid in the URL, they are presented with a smarty error saying the necessary template could not be found. The gridview5c_fixformobiletheme.patch adds dummy tpl files to the mobile and jquerymobile themes which simply subtemplate/include their list view equivalents.
Hide
Permalink
Demian Katz added a comment -
This latest patch has been committed as r3857.
Show
Demian Katz added a comment - This latest patch has been committed as r3857.
Hide
Permalink
Eoghan Ó Carragáin added a comment - - edited
Live examples of this patch since it was committed to the trunk:

http://bit.ly/iF49D1

http://bit.ly/ivpzZK
Show
Eoghan Ó Carragáin added a comment - - edited Live examples of this patch since it was committed to the trunk: http://bit.ly/iF49D1 http://bit.ly/ivpzZK

People

Vote (0)
Watch (1)

Dates

  • Created:
    Updated:
    Resolved:
Atlassian JIRA (v4.4.1#660-r161644) | Report a problem
Powered by a free Atlassian JIRA open source license for Villanova University. Try JIRA - bug tracking software for your team.