XQuery/Image Library

Motivation edit

You want a script that will display a small thumbnail of all the images in an image collection. The images may have many file suffixes (jpg, png, gif etc).

Method edit

We will write an XQuery that finds all the child resources in the collection that have the correct file types.

Source Code edit

xquery version "1.0";
declare option exist:serialize "method=xhtml media-type=text/html";

(: look for the collection parameter in the incoming URL.  If not assume a default collection like /db/images. :)
let $collection := request:get-parameter('collection', '/db/images')

(: you can also change the number of images per row :)
let $images-per-row := xs:integer(request:get-parameter('images-per-row', 10))

(: first get all the files in the collection :)
let $all-files := xmldb:get-child-resources($collection)

(: now just get the files with known image file type extensions :)
let $image-files :=
   for $file in $all-files[
      ends-with(.,'.png') or 
      ends-with(.,'.jpg') or 
      ends-with(.,'.tiff') or 
      ends-with(.,'.gif')]
   return $file
   
   let $image-count := count($image-files)
   let $rows-count := xs:integer(ceiling($image-count div $images-per-row))
return
<html>
   <head>
      <title>Images for collection {$collection}</title>
   </head>
   <body>
      Images in collection: {$collection}
      <table>{
            for $row  in (1 to $rows-count)
            return
              <tr>{
                for $col in (1 to $images-per-row)
                let $n := ($row - 1 ) * $images-per-row + $col               
                return 
                  if ($n <= $image-count)
                  then  
                     let $image := $image-files[position() = $n ]
                     let $path := concat('/exist/rest', $collection, '/', $image)
                     return
                      <td>
                         <a href="{$path}"><img src="{$path}" height="100px" width="100px"/></a>
                      </td>
                   else <td/>  (: blank cells at the end of the last row :)
              }</tr>           
        }</table>
   </body>
</html>