# HG changeset patch # User robcast # Date 1331074402 -3600 # Node ID c75858ee44523a2ae0c546a51a3e16a610794476 # Parent 4ee43243a6a0861e9d2442cd91c4a04b57b3c2c1 more fiddling with regions. use map and area tags (can be changed by regionContentSelector). new autoZoomRegionLinks and fullRegionLinks. diff -r 4ee43243a6a0 -r c75858ee4452 webapp/src/main/webapp/jquery/jquery.digilib.css --- a/webapp/src/main/webapp/jquery/jquery.digilib.css Tue Mar 06 21:32:20 2012 +0100 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.css Tue Mar 06 23:53:22 2012 +0100 @@ -67,6 +67,11 @@ filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30); } +div.dl-digilib div.dl-region a:link, +div.dl-digilib div.dl-region a:visited { + color: white; +} + div.dl-digilib div.dl-region:hover { background-color: transparent; border: 2px solid red; @@ -87,7 +92,7 @@ display: inline-block; } -div.dl-digilib div.dl-regioncontent { +div.dl-digilib map.dl-regioncontent { display: none; } diff -r 4ee43243a6a0 -r c75858ee4452 webapp/src/main/webapp/jquery/jquery.digilib.regions.js --- a/webapp/src/main/webapp/jquery/jquery.digilib.regions.js Tue Mar 06 21:32:20 2012 +0100 +++ b/webapp/src/main/webapp/jquery/jquery.digilib.regions.js Tue Mar 06 23:53:22 2012 +0100 @@ -5,11 +5,11 @@ If hasRegionInfo=true reads regions from page HTML. Element with regions has to be in digilib element, e.g. -
+ */ @@ -54,9 +54,11 @@ // is there region content in the page? 'hasRegionContent' : false, // turn any region into a clickable link to its detail view - 'autoRegionLinks' : false, - // class name for content divs (must additionally be marked with class "keep") - 'regionContentSelector' : 'div.dl-regioncontent', + 'autoZoomRegionLinks' : false, + // use full region as klickable link (instead of only number and text) + 'fullRegionLinks' : false, + // css selector for area elements (should additionally be marked with class "keep") + 'regionContentSelector' : 'map.dl-regioncontent area', // buttonset of this plugin 'regionSet' : ['regions', 'addregion', 'delregion', 'regionhtml', 'lessoptions'], // url param for regions @@ -266,30 +268,39 @@ // add a region to data.$elem var addRegionDiv = function (data, index, attributes) { - var cssPrefix = data.settings.cssPrefix; + var settings = data.settings; + var cssPrefix = settings.cssPrefix; var nr = index + 1; // we count regions from 1 var $regionDiv = $(''); data.$elem.append($regionDiv); - if (data.settings.showRegionNumbers) { + if (settings.showRegionNumbers) { var $regionLink = $(''+nr+''); if (attributes) $regionLink.attr(attributes); $regionDiv.append($regionLink); } - if (data.settings.autoRegionLinks) { - var url = null; - if (attributes) { - if (attributes.href != null) { - url = attributes.href; + var url = null; + if (attributes) { + $regionDiv.attr(attributes); + // UGLY: if we added href, remove it + if (attributes.href) { + url = attributes.href; + $regionDiv.removeAttr('href'); + } + } + if (settings.autoZoomRegionLinks || settings.fullRegionLinks) { + var region = data.regions[index]; + $regionDiv.on('click.dlRegion', function(evt) { + if (settings.fullRegionLinks && url) { + //TODO: how about target? + window.location = url; + } + if (evt.target !== $regionDiv.get(0)) { + // this was not our event + return; } - delete attributes.href; - $regionDiv.attr(attributes); - } - var region = data.regions[index]; - $regionDiv.on('click.dlRegion', function() { - if (url != null) { - window.location = url; - } else { - digilib.actions['zoomArea'](data, region); + if (settings.autoZoomRegionLinks) { + // zoom to region + digilib.actions.zoomArea(data, region); } }); } @@ -316,9 +327,8 @@ // create regions from HTML var createRegionsFromHTML = function (data) { var regions = data.regions; - var selector = data.settings.regionContentSelector; - // regions are defined in "a" tags - var $content = data.$elem.contents(selector).contents('a'); + // regions are defined in "area" tags + var $content = data.$elem.find(data.settings.regionContentSelector); console.debug("createRegionsFromHTML. elems: ", $content); $content.each(function(index, a) { var $a = $(a); @@ -335,7 +345,17 @@ // create the div var $regionDiv = createRegionDiv(data, regions, index, attributes); var $contents = $a.contents().clone(); - $regionDiv.append($contents); + if (attributes.href != null) { + // wrap contents in a-tag + var $ca = $(''); + $ca.append($contents); + $ca.append($a.attr('alt')); + $regionDiv.append($ca); + } else { + $regionDiv.append($contents); + // alt attribute is also content (BTW: area-tag has no content()) + $regionDiv.append($a.attr('alt')); + } }); };