Show custom image links and thumbnails

This allows cataloging of custom electronic resources in the 956 with the
following layout:

  $c => Optional caption string
  $t => Optional thumbnail image URL
  $u => Target URL

If a thumbnail image URL is not supplied, and the target URL is determined
to be an image, based on the filename extension, then the target URL will
be used for the thumbnail image source.  CSS classes stored in style_custom.css
is be used to control the size of the images when displayed on-page.

Signed-off-by: Mike Rylander <mrylander@gmail.com>

diff --git a/Open-ILS/src/templates/opac/parts/record/summary.tt2 b/Open-ILS/src/templates/opac/parts/record/summary.tt2
index b750df6..d0cfd73 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/record/summary.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/summary.tt2
@@ -90,9 +90,57 @@
     </div>    
 [%- END %]
 [%- merged_uris = args.uris.merge(args.online_res);
+
+file_ext_re = '\.(?i:jpe?g|png|bmp|gif|tif|psd|thm|yuv)$';
+
+thumbnails = [];
+
+FOR uri_field IN attrs.marc_xml.findnodes('//*[@tag="956"]');
+    tn = {};
+
+    x = uri_field.findnodes('./*[@code="t"]/text()');
+    FOR i IN x;
+        tn.thumb = i.textContent;
+    END;
+
+    x = uri_field.findnodes('./*[@code="u"]/text()');
+    FOR i IN x;
+        tn.target = i.textContent;
+    END;
+
+    x = uri_field.findnodes('./*[@code="c"]/text()');
+    FOR i IN x;
+        tn.caption = i.textContent;
+    END;
+
+    IF tn.target.length > 0;
+        IF !tn.caption;
+            tn.caption = '';
+        END;
+        IF !tn.thumb AND tn.target.match(file_ext_re);
+            tn.thumb = tn.target;
+        END;
+        thumbnails.push(tn);
+    END;
+END;
+
+-%]
+
+<div class="custom_thumbnail_container">
+    [%- FOR tn IN thumbnails %]
+        <a class="custom_thumbnail"
+           href="[% tn.target %]">
+                <img class="custom_thumbnail" src="[% tn.thumb %]" alt="[% tn.caption | html %]"/>
+                <div class="custom_thumbnail_caption">[% tn.caption %]</div>
+        </a>
+    [%- END %]
+</div>
+
+[%-
 num_uris = merged_uris.size;
 IF num_uris > 0;
 -%]
+
 <h2 class="rdetail_uris">[% l("Electronic resources") %]</h2>
 <div class="rdetail_uris">
     [%- IF num_uris > 1 %]<ul>[% END %]

diff --git a/Open-ILS/web/css/skin/default/opac/style_custom.css b/Open-ILS/web/css/skin/default/opac/style_custom.css
new file mode 100644 (file)
index 0000000..820ae6e
--- /dev/null
+++ b/Open-ILS/web/css/skin/default/opac/style_custom.css
@@ -0,0 +1,28 @@
+.custom_thumbnail_container {
+    margin: 20px auto;
+    text-align: center;
+    width: 90%;
+    min-height: 200px;
+    overflow: auto;
+    display: inline-block;
+}
+
+a.custom_thumbnail {
+    margin: 0px 20px;
+    text-align: center;
+    display: inline-block;
+    text-decoration: none;
+    color: black;
+}
+
+img.custom_thumbnail {
+    max-height: 150px;
+    max-width: 150px;
+}
+
+.custom_thumbnail_caption {
+    text-align: center;
+    color: black;
+    font-weight: bold;
+}
+