changeset 1020:0eedb4a5b674

sliders for rot/brgt/cont, needs some refactoring
author hertzhaft
date Tue, 21 Feb 2012 00:08:04 +0100
parents 287e2d2d2ae8
children 9aa282ceec8a
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, 79 insertions(+), 34 deletions(-) [+]
line wrap: on
line diff
--- a/webapp/src/main/webapp/jquery/jquery.digilib.buttons.js	Mon Feb 20 22:23:07 2012 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.buttons.js	Tue Feb 21 00:08:04 2012 +0100
@@ -78,26 +78,23 @@
             icon : "mirror-vertical.png"
             },
         rot : {
-            //onclick : "sliderRotate",
-            onclick : ["slider", "rot"],
+            onclick : "sliderRotate",
             tooltip : "rotate image",
             icon : "rotate.png"
             },
         brgt : {
-            onclick : "brightness",
-            //onclick : ["slider", "brgt"],
+            onclick : "sliderBrightness",
             tooltip : "set brightness",
             icon : "brightness.png"
             },
         cont : {
-            onclick : "contrast",
-            //onclick : ["slider", "cont"],
+            onclick : "sliderContrast",
             tooltip : "set contrast",
             icon : "contrast.png"
             },
         rgb : {
             onclick : "setRGB",
-            //onclick : ["multislider", "rgb"],
+            // onclick : sliderRGB,
             tooltip : "set rgb values",
             icon : "rgb.png"
             },
@@ -162,8 +159,8 @@
             label : "Contrast",
             tooltip : "set numeric value to be multiplied",
             icon : "contrast.png",
-            'min' : -8,
-            'max' : 8,
+            'min' : -4,
+            'max' : 4,
             'start' : 0
         },
         red : {
@@ -265,19 +262,61 @@
                 // persist setting
                 fn.storeOptions(data);
             },
-            // rotate Slider Div
+
+            // slider to set a rotation angle
             sliderRotate : function (data) {
                 var $elem = data.$elem;
                 var $panel = fn.setupPanel(data);
                 if ($panel == null) {
                     return;
                     };
-                var $slider = fn.setupSlider(data, 'rot');
-                var callback = function(d) {
+                var opts = { 'start' : parseFloat(data.settings.rot) };
+                var $slider = fn.setupSlider(data, 'rot', opts);
+                var ok = function(d) {
                     var angle = $slider.slider('getval');
                     digilib.actions.rotate(d, angle);
                     };
-                $panel.data['callback'] = callback;
+                $panel.data['ok'] = ok;
+                $panel.fadeIn();
+                $panel.prepend($slider);
+                centerOnScreen(data, $panel);
+                $slider.slider('show');
+            },
+
+            // slider to set a brightness value
+            sliderBrightness : function (data) {
+                var $elem = data.$elem;
+                var $panel = fn.setupPanel(data);
+                if ($panel == null) {
+                    return;
+                    };
+                var opts = { 'start' : parseFloat(data.settings.brgt) };
+                var $slider = fn.setupSlider(data, 'brgt', opts);
+                var ok = function(d) {
+                    var brgt = $slider.slider('getval');
+                    digilib.actions.brightness(d, brgt);
+                    };
+                $panel.data['ok'] = ok;
+                $panel.fadeIn();
+                $panel.prepend($slider);
+                centerOnScreen(data, $panel);
+                $slider.slider('show');
+            },
+
+            // slider to set a contrast value
+            sliderContrast : function (data) {
+                var $elem = data.$elem;
+                var $panel = fn.setupPanel(data);
+                if ($panel == null) {
+                    return;
+                    };
+                var opts = { 'start' : parseFloat(data.settings.cont) };
+                var $slider = fn.setupSlider(data, 'cont', opts);
+                var ok = function(d) {
+                    var cont = $slider.slider('getval');
+                    digilib.actions.contrast(d, cont, true);
+                    };
+                $panel.data['ok'] = ok;
                 $panel.fadeIn();
                 $panel.prepend($slider);
                 centerOnScreen(data, $panel);
@@ -570,36 +609,39 @@
 
     /** creates the HTML structure for a panel div
      */
-    var setupPanel = function (data, callback) {
+    var setupPanel = function (data) {
         var $elem = data.$elem;
         var panelClass = data.settings.cssPrefix + 'panel';
         var $panel = $elem.find('.' + panelClass);
+        // remove panel if it exists already
         if ($panel.length > 0) {
             $panel.fadeOut(function() {
                 $panel.remove();
                 });
             return null;
             }
-        var $div = $('<div/>');
-        $div.addClass(panelClass);
-        var $okcancel = setupOkCancel(data, callback);
-        $div.append($okcancel);
-        $elem.append($div);
-        return $div;
+        $panel = $('<div/>');
+        $panel.addClass(panelClass);
+        var $okcancel = setupOkCancel(data);
+        $panel.append($okcancel);
+        $elem.append($panel);
+        return $panel;
     };
 
     /** creates the HTML structure for a slider div
      */
-    var setupSlider = function (data, paramname) {
+    var setupSlider = function (data, paramname, opts) {
         var id = paramname + "-slider";
         var $div = $('#' + id);
         if ($div.length == 0) {
             // slider not yet created
             $div = $('<div/>');
             var options = sliders[paramname];
+            if (opts != null) {
+                $.extend(options, opts);
+                }
             $div.attr('id', paramname + "-slider");
             $div.slider(options);
-            console.debug ('new slider #' + id, $div, options);
             }
         return $div;
     };
@@ -617,15 +659,17 @@
         var $div = $(html);
         var handler = function(event) {
             var $panel = $(this).parents('.'+cssPrefix+'panel');
-            var callback = $panel.data['callback'];
             if (event.keyCode == 27 || event.target.id == cssPrefix+'Cancel') {
-                // return false;
-                }
-            if (event.keyCode == 13 || event.target.id == cssPrefix+'Ok') {
+                var callback = $panel.data['cancel'];
                 if (callback) {
                     callback(data);
                     }
-                // return false;
+                }
+            if (event.keyCode == 13 || event.target.id == cssPrefix+'Ok') {
+                var callback = $panel.data['ok'];
+                if (callback) {
+                    callback(data);
+                    }
                 }
             $panel.fadeOut(function() {
                 $panel.remove();
--- a/webapp/src/main/webapp/jquery/jquery.digilib.css	Mon Feb 20 22:23:07 2012 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.css	Tue Feb 21 00:08:04 2012 +0100
@@ -152,16 +152,14 @@
 
 div.dl-digilib button.dl-button {
 	margin: 0px 10px 10px 10px;
-	border: 1px solid lightcyan;
+	border-width: 1px;
 	font-family: Verdana, Arial, Helvetica, sans-serif;
 	font-size: 12px;
-	font-weight: bold;
 	color: white;
-	background: url('img/blue.png');
+	background: transparent;
 	}
 
 div.dl-digilib div.dl-slider {
-	background: url('img/blue.png');
 	border: 1px solid lightcyan;
 	margin: 30px;
 	z-index: 9999;
@@ -187,11 +185,9 @@
 div.dl-digilib div.dl-sliderlabel,
 div.dl-digilib div.dl-slidernumber {
 	position: absolute;
-	background: url('img/blue.png');
 	padding: 2px;
 	font-family: Verdana, Arial, Helvetica, sans-serif;
 	font-size: 12px;
-	font-weight: bold;
 	color: white;
     }
 	
--- a/webapp/src/main/webapp/jquery/jquery.digilib.js	Mon Feb 20 22:23:07 2012 +0100
+++ b/webapp/src/main/webapp/jquery/jquery.digilib.js	Tue Feb 21 00:08:04 2012 +0100
@@ -399,13 +399,18 @@
          * 
          * @param data
          * @param factor
+         * @param brightness : if given, adjust brightness along with contrast
          */
-        contrast : function (data, factor) {
+        contrast : function (data, factor, brightness) {
             var cont = data.settings.cont;
             if (factor == null) {
                 factor = window.prompt("Contrast (-8, 8)", cont);
             }
             data.settings.cont = factor;
+            if (brightness) {
+                var brgt = 127 - (127 * Math.pow(2, factor));
+                data.settings.brgt = brgt;
+            }
             redisplay(data);
         },