Mercurial > hg > digilib-old

changeset 1052:0d2491acfe70

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
simplify 'about' div
author hertzhaft
date Mon, 26 Mar 2012 22:22:08 +0200
parents ad769aaea759
children 86ba65b86d52
files webapp/src/main/webapp/jquery/jquery.digilib.buttons.js webapp/src/main/webapp/jquery/jquery.digilib.css webapp/src/main/webapp/jquery/jquery.digilib.js
diffstat 3 files changed, 38 insertions(+), 56 deletions(-) [+]
line wrap: on
line diff
--- a/webapp/src/main/webapp/jquery/jquery.digilib.buttons.js	Mon Mar 26 09:15:26 2012 +0200
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.buttons.js	Mon Mar 26 22:22:08 2012 +0200
@@ -57,8 +57,8 @@
             tooltip : "goto image number",
             icon : "page.png"
             },
-        help : {
-            onclick : "showAboutDiv",
+        about : {
+            onclick : "about",
             tooltip : "about Digilib",
             icon : "help.png"
             },
@@ -163,14 +163,14 @@
                 // path to button images (must end with a slash)
                 'imagePath' : 'img/fullscreen/',
                 'buttonSetWidth' : 36,
-                'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","pagewidth","back","fwd","page","help","reset","toggleoptions"],
+                'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","pagewidth","back","fwd","page","about","reset","toggleoptions"],
                 'specialSet' : ["mark","delmark","hmir","vmir","rot","brgt","cont","rgb","quality","size","calibrationx","scale","lessoptions"],
                 'buttonSets' : ['standardSet', 'specialSet']
                 },
             'embedded' : {
                 'imagePath' : 'img/embedded/16/',
                 'buttonSetWidth' : 18,
-                'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","help","reset","toggleoptions"],
+                'standardSet' : ["reference","zoomin","zoomout","zoomarea","zoomfull","about","reset","toggleoptions"],
                 'specialSet' : ["mark","delmark","hmir","vmir","rot","brgt","cont","rgb","quality","scale","lessoptions"],
                 'buttonSets' : ['standardSet', 'specialSet']
                 }
@@ -418,7 +418,6 @@
         highlight('brgt', settings.brgt);
         highlight('cont', settings.cont);
         highlight('bird', settings.isBirdDivVisible);
-        highlight('help', settings.isAboutDivVisible);
         highlight('hmir', flags.hmir);
         highlight('vmir', flags.vmir);
         highlight('quality', flags.q1 || flags.q2);
--- a/webapp/src/main/webapp/jquery/jquery.digilib.css	Mon Mar 26 09:15:26 2012 +0200
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.css	Mon Mar 26 22:22:08 2012 +0200
@@ -51,17 +51,13 @@
 
 div.dl-digilib div.dl-about {
 	position: absolute;
-	width: 200px;
-	top: 100px;
-	left: 350px;
-	height: 200px;
-	padding: 0px 2px;
+	padding: 10px;	
 	font-family: Verdana, Arial, Helvetica, sans-serif;
 	border: 2px solid lightcyan;
 	background-color: lightgrey;
 	text-align: center;
 	display: none;
-	z-index: 1000;
+	z-index: 100;
 }
 
 div.dl-digilib div.dl-region {
@@ -175,10 +171,10 @@
 
 div.dl-digilib div.dl-tinyslider {
     display: none;
-	border: 1px solid lightcyan;
+	border: 2px solid lightcyan;
 	background-color: lightgrey;
 	width: 300px;
-	padding:10px;	
+	padding: 10px;	
     }
 
 div.dl-digilib div.dl-slider {
--- a/webapp/src/main/webapp/jquery/jquery.digilib.js	Mon Mar 26 09:15:26 2012 +0200
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.js	Mon Mar 26 22:22:08 2012 +0200
@@ -81,8 +81,6 @@
         // fullscreen = take parameters from page URL, keep state in page URL
         // embedded = take parameters from Javascript options, keep state inside object 
         'interactionMode' : 'fullscreen',
-        // is the "about" window shown?
-        'isAboutDivVisible' : false,
         // default size of preview image for drag-scroll (preferrably same as Bird's Eye View image)
         'previewImgWidth' : 200,
         'previewImgHeight' : 200,
@@ -240,8 +238,6 @@
                 }
                 // create HTML structure for scaler
                 setupScalerDiv(data);
-                // about window creation - TODO: could be deferred? restrict to only one item?
-                setupAboutDiv(data);
                 // send setup event
                 $(data).trigger('setup');
             });
@@ -261,15 +257,37 @@
             });
         },
 
-        /** show or hide the 'about' window
+        /** show the 'about' window
          * 
          * @param data
-         * @param show
          */
-        showAboutDiv : function(data, show) {
-            var on = showDiv(data.settings.isAboutDivVisible, data.$aboutDiv, show);
-            data.settings.isAboutDivVisible = on;
-            //FIXME: highlightButtons(data, 'help', on);
+        about : function(data) {
+            //FIXME: highlightButtons(data, 'about', on);
+            var $elem = data.$elem;
+            var settings = data.settings;
+            var cssPrefix = settings.cssPrefix;
+            var $about = $elem.find('#'+cssPrefix+'about');
+            if ($about.length > 0) return; // already onscreen
+            // make relative logoUrl absolute
+            var logoUrl = settings.logoUrl;
+            if (logoUrl.charAt(0) !== '/' && logoUrl.substring(0,3) !== 'http') {
+                logoUrl = settings.digilibBaseUrl + '/' + logoUrl;
+            }
+            var html = '\
+                <div id="'+cssPrefix+'about" class="'+cssPrefix+'about" style="display:none">\
+                    <p>Digilib Image Viewer</p>\
+                    <a href="'+settings.homeUrl+'">\
+                        <img class="'+settings.cssPrefix+'logo" title="Digilib" src="'+logoUrl+'"/>\
+                    </a>\
+                    <p>Version: '+settings.version+'</p>\
+                </div>';
+            $about = $(html);
+            $about.appendTo($elem);
+            $about.on('click.digilib', function () {
+                withdraw($about);
+                });
+            $about.fadeIn();
+            centerOnScreen(data, $about);
         },
 
         /** goto given page nr (+/-: relative)
@@ -436,7 +454,7 @@
             } else {
                 if (rgbm != null) data.settings.rgbm = rgbm;
                 if (rgba != null) data.settings.rgba = rgba;
-                redisplay(data);                
+                redisplay(data);
             }
         },
 
@@ -1037,38 +1055,7 @@
         $img.attr('src', scalerUrl);
     };
 
-    /** creates HTML structure for the about view in elem
-     * 
-     */
-    var setupAboutDiv = function (data) {
-        var $elem = data.$elem;
-        var settings = data.settings;
-        var $aboutDiv = $('<div class="'+settings.cssPrefix+'about" style="display:none"/>');
-        var $header = $('<p>Digilib Image Viewer</p>');
-        var $link = $('<a/>');
-        var $logo = $('<img class="'+settings.cssPrefix+'logo" title="digilib"/>');
-        var $content = $('<p/>');
-        $elem.append($aboutDiv);
-        $aboutDiv.append($header);
-        $aboutDiv.append($link);
-        $aboutDiv.append($content);
-        $link.append($logo);
-        logoUrl = settings.logoUrl;
-        // make relative logoUrl absolute
-        if (logoUrl.charAt(0) !== '/' && logoUrl.substring(0,3) !== 'http') {
-            logoUrl = settings.digilibBaseUrl + '/' + logoUrl;
-        }
-        $logo.attr('src', logoUrl);
-        $link.attr('href', settings.homeUrl);
-        $content.text('Version: ' + settings.version);
-        data.$aboutDiv = $aboutDiv;
-        // click hides
-        $aboutDiv.on('click.digilib', function () {
-            actions['showAboutDiv'](data, false);
-            });
-    };
-
-    /** shows some window e.g. 'about' (toggle visibility if show is null)
+    /** shows some div (toggle visibility if show is null)
      * 
      */
     var showDiv = function (isVisible, $div, show) {