# HG changeset patch
# User robcast
# Date 1328866070 -3600
# Node ID 76cffbaf008369c652bda546d63d68de2fba399e
# Parent  8be56a27db582e731cdf396a21ab188a53565a2b
starting introduction of cssPrefix.

diff -r 8be56a27db58 -r 76cffbaf0083 webapp/src/main/webapp/jquery/jquery.digilib.css
--- a/webapp/src/main/webapp/jquery/jquery.digilib.css	Thu Feb 09 17:54:59 2012 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.css	Fri Feb 10 10:27:50 2012 +0100
@@ -3,31 +3,31 @@
  *
  * Martin Raspe, Robert Casties, 11.1.2011
  */
-div.digilib div.scaler {
+div.dl-digilib div.dl-scaler {
 	background-color: grey;
 	z-index: 0;
 	width: 0px;
 	height: 0px;
 }
 
-div.digilib div.birdview {
+div.dl-digilib div.dl-birdview {
 	border: 1px solid white;
 	z-index: 10;
 }
 
-div.digilib div.zoomrect {
+div.dl-digilib div.dl-zoomrect {
 	position: absolute;
 	border: 2px solid #ff0000;
 	z-index: 100;
 }
 
-div.digilib div.birdzoom {
+div.dl-digilib div.dl-birdzoom {
     position: absolute;
     border: 2px solid #ff0000;
     z-index: 100;
 }
 
-div.digilib div.mark {
+div.dl-digilib div.dl-mark {
 	position: absolute;
 	color: white;
 	background: url('../greyskin/mark-bg-16.png');
@@ -41,7 +41,7 @@
 	z-index: 10;
 }
 
-div.digilib div.about {
+div.dl-digilib div.dl-about {
 	position: absolute;
 	width: 200px;
 	top: 100px;
@@ -56,25 +56,25 @@
 	z-index: 1000;
 }
 
-div.digilib div.region {
+div.dl-digilib div.dl-region {
 	position: absolute;
 	background-color: red;
     opacity: 0.3;
 	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30); 
 }
 
-div.digilib div.region:hover {
+div.dl-digilib div.dl-region:hover {
 	opacity: 0.5;
 	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); 
 }
 
-div.digilib div.region {
+div.dl-digilib div.dl-region {
     color: white;
 	font-family: Verdana, Arial, Helvetica, sans-serif;
     font-size: 11px;
 }
 
-div.digilib div.region a.regionnumber {
+div.dl-digilib div.dl-region a.dl-regionnumber {
     color: white;
     text-decoration: none;
 	font-weight: bold;
@@ -86,11 +86,11 @@
     display: inline-block;
 }
 
-div.digilib div.regioncontent {
+div.dl-digilib div.dl-regioncontent {
     display: none;
 }
 
-div.digilib div.regionHTML {
+div.dl-digilib div.dl-regionHTML {
     display: none;
     position: absolute;
 	top: 100px;
@@ -103,14 +103,14 @@
 	z-index: 1000;
 }
 
-div.digilib div.regionHTML a {
+div.dl-digilib div.dl-regionHTML a {
     color: white;
     text-decoration: none;
     font-size: 11px;
 	font-weight: bold;
 }
 
-div.digilib div.calibration {
+div.dl-digilib div.dl-calibration {
 	background: url('img/blue.png');
 	position: absolute;
 	border: 1px solid lightcyan;
@@ -119,7 +119,7 @@
 	z-index: 9999;
 	}
 
-div.digilib div.ruler {
+div.dl-digilib div.dl-ruler {
 	width: 100%;
 	height: 100%;
 	padding-bottom: 10px;
@@ -131,17 +131,17 @@
 	background: url('img/ruler-top.gif') 0px -1px repeat-x;
 	}
 
-div.digilib div.cm {
+div.dl-digilib div.dl-cm {
 	padding: 5px;
 	}
 
-div.digilib div.calibration-error {
+div.dl-digilib div.dl-calibration-error {
 	color: red;
 	padding: 10px;
 	display: none;
 	}
 
-div.digilib button.calibration-button {
+div.dl-digilib button.dl-calibration-button {
 	margin: 0px 10px;
 	border: 1px solid lightcyan;
 	font-family: Verdana, Arial, Helvetica, sans-serif;
@@ -151,16 +151,16 @@
 	background-color: transparent;
 	}
 
-div.digilib input.calibration-input {
+div.dl-digilib input.dl-calibration-input {
 	margin: 0px 10px;
 	}
 
-div.digilib input.error {
+div.dl-digilib input.dl-error {
 	color: red;
 	background-color: khaki;
 	}
 
-div.digilib div.slider {
+div.dl-digilib div.dl-slider {
 	background: url('img/blue.png');
 	display: none;
 	border: 1px solid lightcyan;
@@ -170,14 +170,14 @@
 	height: 16px;
 	}
 
-div.digilib div.sliderbutton {
+div.dl-digilib div.dl-sliderbutton {
 	border: 3px solid lightcyan;
 	background-color: cyan;
 	position: absolute;
 	z-index: 10000;
 	}
 
-div.infobutton {
+div.dl-infobutton {
     background-color: white;
     color: grey;
     padding: 0px 4px;
@@ -185,37 +185,37 @@
     float: left;
 }
 
-div.info {
+div.dl-info {
     clear: both;
     display: none;
     margin: 10px;
 }
 
-div.infoheader {
+div.dl-infoheader {
     width: 300px;
     margin-bottom: 20px;
 }
 
 /* scroll arrows */
-div.digilib table.scalertable {
+div.dl-digilib table.dl-scalertable {
 	border: 0;
 	padding: 0;
 }
-div.digilib table.scalertable td {
+div.dl-digilib table.dl-scalertable td {
     padding: 0;
 }
-div.digilib table.scalertable td.arrow {
+div.dl-digilib table.dl-scalertable td.dl-arrow {
 }
-div.digilib table.scalertable td.arrow:hover {
+div.dl-digilib table.dl-scalertable td.dl-arrow:hover {
     background-color: black;
 	opacity: 0.3;
 }
-div.digilib table.scalertable img.button {
+div.dl-digilib table.dl-scalertable img.button {
     opacity: 1;
 }
 
 /* special definitions for fullscreen */
-div.digilib.dl_fullscreen div.buttons {
+div.dl-digilib.dl_fullscreen div.dl-buttons {
 	position: fixed;
 	right: 0px;
 	top: 0px;
@@ -224,28 +224,28 @@
 	z-index: 200;
 }
 
-div.digilib.dl_fullscreen div.buttons div.button:hover {
+div.dl-digilib.dl_fullscreen div.dl-buttons div.dl-button:hover {
 	background-image: url('img/fullscreen/corona.png');
 	background-repeat: no-repeat;
 }
 
-div.digilib.dl_fullscreen div.button-on {
+div.dl-digilib.dl_fullscreen div.dl-button-on {
 	background-image: url('img/fullscreen/whitedisc.png');
 	background-repeat: no-repeat;
 }
 
-div.digilib.dl_fullscreen div.birdview {
+div.dl-digilib.dl_fullscreen div.dl-birdview {
 	position: fixed;
 	bottom: 8px;
 	right: 48px;
 }
 
 /* special definitions for embedded */
-div.digilib.dl_embedded {
+div.dl-digilib.dl_embedded {
 	position: relative;
 }
 
-div.digilib.dl_embedded div.buttons {
+div.dl-digilib.dl_embedded div.dl-buttons {
 	position: absolute;
 	right: 0px;
 	top: 0px;
@@ -255,15 +255,15 @@
 	z-index: 100;
 }
 
-div.digilib.dl_embedded div.buttons div.button:hover {
+div.dl-digilib.dl_embedded div.dl-buttons div.dl-button:hover {
 	background-color: black;
 }
 
-div.digilib.dl_embedded div.button-on {
+div.dl-digilib.dl_embedded div.dl-button-on {
 	background-color: darkgreen;
 }
 
-div.digilib.dl_embedded div.birdview {
+div.dl-digilib.dl_embedded div.dl-birdview {
 	position: absolute;
 	bottom: 0px;
 	right: 0px;
diff -r 8be56a27db58 -r 76cffbaf0083 webapp/src/main/webapp/jquery/jquery.digilib.js
--- a/webapp/src/main/webapp/jquery/jquery.digilib.js	Thu Feb 09 17:54:59 2012 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.js	Fri Feb 10 10:27:50 2012 +0100
@@ -38,7 +38,7 @@
 
     var defaults = {
         // version of this script
-        'version' : 'jquery.digilib.js 2.1.3b1',
+        'version' : 'jquery.digilib.js 2.1.4a1',
         // logo url
         'logoUrl' : 'img/digilib-logo-text1.png',
         // homepage url (behind logo)
@@ -47,6 +47,8 @@
         'digilibBaseUrl' : null,
         // base URL to Scaler servlet (usually digilibBaseUrl+'/servlet/Scaler')
         'scalerBaseUrl' : null,
+        // prefix of digilib classes in CSS styles
+        'cssPrefix' : 'dl-',
         // list of Scaler parameters
         'scalerParamNames' : ['fn','pn','dw','dh','ww','wh','wx','wy','ws','mo',
                               'rot','cont','brgt','rgbm','rgba','ddpi','ddpix','ddpiy'],
@@ -900,7 +902,7 @@
         var scalerUrl;
         if (settings.interactionMode === 'fullscreen') {
             // fullscreen
-            $elem.addClass('dl_fullscreen');
+            $elem.addClass(cssPrefix+'fullscreen');
             var imgSize = getFullscreenImgSize(data);
             data.fullscreenImgSize = imgSize;
             // fitwidth/height omits destination height/width
@@ -914,7 +916,7 @@
             $img = $('<img/>');
         } else {
             // embedded mode -- try to keep img tag
-            $elem.addClass('dl_embedded');
+            $elem.addClass(cssPrefix+'embedded');
             scalerUrl = getScalerUrl(data);
             $img = $elem.find('img');
             if ($img.length > 0) {
@@ -936,11 +938,11 @@
         }
         // create new inner html, keeping buttons and content marked with "keep" class
         $elem.contents(":not(.keep)").remove();
-        var $scaler = $('<div class="scaler"/>');
+        var $scaler = $('<div class="'+cssPrefix+'scaler"/>');
         // scaler should be the first child element?
         $elem.prepend($scaler);
         $scaler.append($img);
-        $img.addClass('pic');
+        $img.addClass(cssPrefix+'pic');
         data.$scaler = $scaler;
         data.$img = $img;
         // set busy cursor
@@ -958,10 +960,10 @@
     var setupAboutDiv = function (data) {
         var $elem = data.$elem;
         var settings = data.settings;
-        var $aboutDiv = $('<div class="about" style="display:none"/>');
+        var $aboutDiv = $('<div class="'+cssPrefix+'about" style="display:none"/>');
         var $header = $('<p>Digilib Image Viewer</p>');
         var $link = $('<a/>');
-        var $logo = $('<img class="logo" title="digilib"/>');
+        var $logo = $('<img class="'+cssPrefix+'logo" title="digilib"/>');
         var $content = $('<p/>');
         $elem.append($aboutDiv);
         $aboutDiv.append($header);
@@ -1117,7 +1119,8 @@
     var handleChangeZoomArea = function (evt, newZa) {
     	console.debug("handleChangeZoomArea:", newZa);
     	var data = this;
-        data.$elem.find(".overlay").hide(); // hide all overlays (marks/regions)
+    	// hide all overlays (marks/regions)
+        data.$elem.find('.'+cssPrefix+'overlay').hide();
     	setPreviewBg(data, newZa);
     };
     
@@ -1149,7 +1152,7 @@
         $elem = data.$elem;
         $scaler = data.$scaler;
         var pt1, pt2;
-        var $zoomDiv = $('<div class="zoomrect" style="display:none"/>');
+        var $zoomDiv = $('<div class="'+cssPrefix+'zoomrect" style="display:none"/>');
         $elem.append($zoomDiv);
         // $zoomDiv.css(data.settings.zoomrectStyle);
         var picRect = geom.rectangle($scaler);