Mercurial > hg > digilib-old

changeset 853:4a3bb0888c93 stream

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Merge with a29f53d8b7dd6bc0956092df253d0290bcdd894d
author robcast
date Mon, 07 Mar 2011 10:35:57 +0100
parents 7718c6e832b0 (current diff) a29f53d8b7dd (diff)
children 1e2e9599d84c
files
diffstat 4 files changed, 70 insertions(+), 54 deletions(-) [+]
line wrap: on
line diff
--- a/client/digitallibrary/jquery/digilib.html	Fri Mar 04 10:19:46 2011 +0100
+++ b/client/digitallibrary/jquery/digilib.html	Mon Mar 07 10:35:57 2011 +0100
@@ -23,7 +23,8 @@
         <script type="text/javascript">
             $(document).ready(function(){
                 var opts = {
-                    interactionMode : 'fullscreen'
+                    interactionMode : 'fullscreen',
+                    showRegionNumbers : true
                     };
                 var $div = $('div.digilib');
                 $div.digilib(opts);
--- a/client/digitallibrary/jquery/jquery-test-full.html	Fri Mar 04 10:19:46 2011 +0100
+++ b/client/digitallibrary/jquery/jquery-test-full.html	Mon Mar 07 10:35:57 2011 +0100
@@ -70,7 +70,7 @@
                 var opts = {
                     interactionMode : 'fullscreen',
                     scalerBaseUrl : 'http://digilib.biblhertz.it/digilib04/servlet/Scaler',
-                    showRegionNumbers : false,
+                    showRegionNumbers : true,
                     autoRegionLinks : false,
                     includeRegionContent : true 
                     };
@@ -85,11 +85,10 @@
 
         <div id="digilib-1" class="digilib">
             <img src="http://digilib.biblhertz.it/digilib04/servlet/Scaler?dw=200&amp;dh=200&amp;fn=/digisprint/jquery/FransHals-WillemVanHeythuysen" />
-            <div class="keep regioncontent" title="0.1/0.1/0.4/0.1">
-                <a href="http://www.mpiwg-berlin.mpg.de">MPI fuer Wissenschaftsgeschichte</a>
-            </div>
-            <div class="keep regioncontent" title="0.5/0.8/0.4/0.1">
-                <a href="http://www.biblhertz.it">Bibliotheca Hertziana</a>
+            <div class="keep regioncontent">
+                <a href="http://www.mpiwg-berlin.mpg.de" rel="area:0.1/0.1/0.4/0.1">MPI fuer Wissenschaftsgeschichte</a>
+                <a href="http://www.biblhertz.it" rel="area:0.5/0.8/0.4/0.1">Bibliotheca Hertziana</a>
+                <a rel="area:0.3/0.5/0.15/0.1" />
             </div>
         </div>
         <div id="debug">DEBUG</div>
--- a/client/digitallibrary/jquery/jquery.digilib.css	Fri Mar 04 10:19:46 2011 +0100
+++ b/client/digitallibrary/jquery/jquery.digilib.css	Mon Mar 07 10:35:57 2011 +0100
@@ -66,7 +66,7 @@
 	opacity: 0.5;
 }
 
-div.regionnumber a {
+div.region a {
     color: white;
     text-decoration: none;
     font-size: 11px;
@@ -78,22 +78,28 @@
 
 div.regioncontent {
     display: none;
-    padding: 3px;
 }
 
-div.regioncontent a {
+div.regionHTML {
+    display: none;
+    position: absolute;
+	top: 100px;
+	left: 250px;
+	padding: 10px;
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 12px;
+	border: 2px solid lightcyan;
+	background-color: lightgrey;
+	z-index: 1000;
+}
+
+div.regionHTML a {
     color: white;
     text-decoration: none;
     font-size: 11px;
 	font-weight: bold;
 }
 
-div.regioninfo {
-    display: none;
-    color: white;
-    background-color: black;
-}
-
 /* special definitions for fullscreen */
 div.digilib.dl_fullscreen div.buttons {
 	position: fixed;
--- a/client/digitallibrary/jquery/jquery.digilib.regions.js	Fri Mar 04 10:19:46 2011 +0100
+++ b/client/digitallibrary/jquery/jquery.digilib.regions.js	Mon Mar 07 10:35:57 2011 +0100
@@ -40,8 +40,8 @@
             tooltip : "show or hide regions",
             icon : "regions.png"
             },
-        regioninfo : {
-            onclick : "toggleRegionInfo",
+        regionhtml : {
+            onclick : "showRegionHTML",
             tooltip : "show information about regions",
             icon : "regioninfo.png"
             }
@@ -52,8 +52,8 @@
         'isRegionVisible' : true,
         // are region numbers shown?
         'showRegionNumbers' : false,
-        // is region info shown?
-        'showRegionInfo' : false,
+        // is window with region HTML shown?
+        'showRegionHTML' : false,
         // should digilib look for region content in the page?
         'includeRegionContent' : false,
         // turn any region into a clickable link to its detail view
@@ -61,7 +61,7 @@
         // class name for content divs (must additionally be marked with class "keep")
         'regionContentSelector' : 'div.regioncontent',
         // buttonset of this plugin
-        'regionSet' : ['regions', 'addregion', 'delregion', 'regioninfo', 'lessoptions'],
+        'regionSet' : ['regions', 'addregion', 'delregion', 'regionhtml', 'lessoptions'],
         // url param for regions
         'rg' : null,
         };
@@ -155,22 +155,32 @@
             showRegionDivs(data, 1);
         },
 
-        // show/hide region info 
-        "toggleRegionInfo" : function (data) {
-            var show = !data.settings.showRegionInfo;
-            data.settings.showRegionInfo = show;
-            fn.highlightButtons(data, 'regioninfo', show);
-            var $info = $('.regioninfo');
-            if (show) {
-                $info.fadeIn();
-            } else {
-                $info.fadeOut();
+        // show/hide region HTML code 
+        "showRegionHTML" : function (data) {
+            var show = !data.settings.showRegionHTML;
+            data.settings.showRegionHTML = show;
+            fn.highlightButtons(data, 'regionhtml', show);
+            var $html = data.$htmlDiv;
+            if (!show) {
+                $html.fadeOut(function () { 
+                    $html.contents().remove();
+                    });
+                return;
             }
+            // empty the div for HTML display
+            $html.append($('<div/>').text('<div class="keep regioncontent">'));
+            $.each(data.regions, function(index, region) {
+                    var area = "area:"
+                    + region.x + "/" + region.y + "/"
+                    + region.width + "/" + region.height;
+                $html.append($('<div/>').text('<a href="" rel="' + area + '">'));
+                $html.append($('<div/>').text('</a>'));
+                });
+            $html.append($('<div/>').text('</div>'));
+            $html.fadeIn();
         }
     };
 
-    var addRegion = actions.addRegion;
-
     // store a region div
     var storeRegion = function (data, $regionDiv) {
         var regions = data.regions;
@@ -205,14 +215,6 @@
         return $regionDiv;
     };
 
-    // add region info
-    var addRegionInfo = function (region) {
-        var $regionDiv = region.$div;
-        var $regionInfoDiv = $('<div class="regioninfo" />');
-        $regionInfoDiv.text(region.toString());
-        $regionDiv.append($regionInfoDiv);
-    }
-
     // add region content
     var addRegionContent = function (region, $elem) {
         var $regionDiv = region.$div;
@@ -224,33 +226,34 @@
         var region = regions[index];
         var $regionDiv = addRegionDiv(data, index);
         region.$div = $regionDiv;
-        addRegionInfo(region);
         return $regionDiv;
     };
 
     // create regions 
     var createRegionDivs = function (data) {
         var regions = data.regions;
-        for (var i = 0; i < regions.length ; i++) {
+        $.each(regions, function(i) {
             createRegionDiv(regions, i);
-        }
+            });
     };
 
     // create regions from HTML
     var createRegionsFromHTML = function (data) {
         var regions = data.regions;
         var selector = data.settings.regionContentSelector;
-        var $content = data.$elem.find(selector);
+        var $content = data.$elem.contents(selector).contents('a');
         console.debug("createRegionsFromHTML", $content);
-        $content.each(function(index, elem) {
-            var $div = $(elem); 
-            var r = $div.attr('title');
-            var pos = r.split("/", 4);
+        $content.each(function(index, a) {
+            var $a = $(a); 
+            var href = $a.attr('href');
+            var rel = $a.attr('rel');
+            var area = rel.replace(/^area:/i, '');
+            var pos = area.split("/", 4);
             var rect = geom.rectangle(pos[0], pos[1], pos[2], pos[3]);
             regions.push(rect);
             var $regionDiv = createRegionDiv(regions, index);
-            $regionDiv.append($div);
-            $div.show();
+            $regionDiv.append($a.clone());
+            // $a.show();
         });
     };
 
@@ -367,6 +370,7 @@
         } else {
             unpackRegions(data);
             createRegionDivs(data);
+            fn.highlightButtons(data, 'regionhtml', data.settings.showRegionHTML);
         }
     };
 
@@ -374,7 +378,7 @@
     var handleUpdate = function (evt) {
         data = this;
         fn.highlightButtons(data, 'regions' , data.settings.isRegionVisible);
-        fn.highlightButtons(data, 'regioninfo' , data.settings.showRegionInfo);
+        fn.highlightButtons(data, 'regionhtml' , data.settings.showRegionHTML);
         showRegionDivs(data);
         console.debug("regions: handleUpdate", data.settings.rg);
     };
@@ -409,11 +413,16 @@
     // plugin initialization
     var init = function (data) {
         console.debug('initialising regions plugin. data:', data);
-        var $data = $(data);
+        var $elem = data.$elem;
         // regions array
         data.regions = [];
+        // regions div
+        var $html = $('<div class="keep regionHTML"/>');
+        $elem.append($html);
+        data.$htmlDiv = $html;
         // no URL-defined regions, no buttons when regions are predefined in HTML
-        if (!data.settings.includeRegionContent) {
+        var hasRegionContent = data.settings.includeRegionContent;
+        if (!hasRegionContent) {
             // add "rg" to digilibParamNames
             data.settings.digilibParamNames.push('rg');
             // additional buttons
@@ -427,6 +436,7 @@
             }
         }
         // install event handler
+        var $data = $(data);
         $data.bind('setup', handleSetup);
         $data.bind('update', handleUpdate);
         $data.bind('redisplay', handleRedisplay);