digilib-old: client/digitallibrary/jquery/jquery.digilib.js comparison

comparison client/digitallibrary/jquery/jquery.digilib.js @ 635:7293a42f44f5 jquery

changed button onclick binding to use closure toggleAboutDiv action is now showAboutDiv(), dito for BirdDiv showXXDiv function is now showDiv

author	robcast
date	Tue, 18 Jan 2011 19:27:20 +0100
parents	34ee220a664b
children	7049579a0097

comparison

equal deleted inserted replaced

-:34ee220a664b
+:7293a42f44f5
 onclick : "javascript:gotoPageWin()",
 tooltip : "specify image",
 img : "page.png"
 },
 bird : {
-onclick : "toggleBirdDiv",
+onclick : "showBirdDiv",
 tooltip : "show bird's eye view",
 img : "birds-eye.png"
 },
 help : {
-onclick : "toggleAboutDiv",
+onclick : "showAboutDiv",
 tooltip : "about Digilib",
 img : "help.png"
 },
 reset : {
 onclick : "javascript:resetImage()",
 var defaults = {
 // the root digilib element, for easy retrieval
 'digilibRoot' : null,
 // version of this script
-'version' : 'jquery.digilib.js 1.0',
+'version' : 'jquery.digilib.js 0.9',
 // logo url
 'logoUrl' : '../img/digilib-logo-text1.png',
-// repository url
+// homepage url (behind logo)
-'reposUrl' : 'http://digilib.berlios.de',
+'homeUrl' : 'http://digilib.berlios.de',
 // base URL to Scaler servlet
 'scalerBaseUrl' : 'http://digilib.mpiwg-berlin.mpg.de/digitallibrary/servlet/Scaler',
 // list of Scaler parameters
 'scalerParamNames' : ['fn','pn','dw','dh','ww','wh','wx','wy','ws','mo',
 'rot','cont','brgt','rgbm','rgba','ddpi','ddpix','ddpiy'],
 data.digilib.remove();
 $this.removeData('digilib');
 });
 },
-// event handler: toggles the visibility of the 'about' window
+// show or hide the 'about' window
-toggleAboutDiv : function() {
+showAboutDiv : function(show) {
 var $this = $(this);
 var data = $this.data('digilib');
-showAboutDivFn(data)();
+data.settings.isAboutDivVisible = showDiv(data.settings.isAboutDivVisible, data.$aboutDiv, show);
 },
 // event handler: toggles the visibility of the bird's eye window
-toggleBirdDiv : function () {
+showBirdDiv : function (show) {
-// TODO: red frame functionality
+var $this = $(this);
-var $elem = $(this); // the clicked button
+var data = $this.data('digilib');
-var settings = $elem.data('digilib').settings;
+data.settings.isBirdDivVisible = showDiv(data.settings.isBirdDivVisible, data.$birdDiv, show);
-var $root = settings.digilibRoot;
-var $bird = $root.find('div.birdview');
-settings.isBirdDivVisible = !settings.isBirdDivVisible;
-if (settings.isBirdDivVisible) {
-$bird.fadeIn();
-} else {
-$bird.fadeOut();
-};
-return false;
 },
 // goto given page nr (+/-: relative)
 gotoPage : function(pageNr, keepMarks) {
 var $elem = $(this); // the clicked button
 $button.append($a);
 $a.append($img);
 // add attributes and bindings
 $button.attr('title', actionSettings.tooltip);
 $button.addClass('button-' + actionName);
-// let the clicked <a> element know about the digilib context
+// create handler for the buttons
-$a.data('digilib', { 'action' : actionName, 'settings' : settings } );
+$a.bind('click', (function () {
-$a.bind('click', function() {
+// we create a new closure to capture the value of method
-var $elem = $(this);
+var method = actionSettings.onclick;
-// get the context data
-var data = $elem.data('digilib');
-// find the action for the clicked element
-var method = data.settings.actions[data.action].onclick;
 if ($.isArray(method)) {
-$elem.digilib.apply(this, method);
+// the handler function calls digilib with method and parameters
+return function () {
+console.debug('click method=', method);
+$elem.digilib.apply($elem, method);
+};
 } else {
-$elem.digilib(method);
+// the handler function calls digilib with method
+return function () {
+console.debug('click method=', method);
+$elem.digilib(method);
 };
-console.log(method);
+}
-});
+})());
-// binding mit closure
-//(function(){ var action = actionSettings.onclick;
-//    $a.bind('click', function(){ console.log( action )} );
-//})();
 $img.attr('src', settings.buttonsImagePath + actionSettings.img);
 };
 }
 return $buttonsDiv;
 };
 var $birdImg = $('<img class="birdimg"/>');
 $elem.append($birdviewDiv);
 $birdviewDiv.append($birdzoomDiv);
 $birdviewDiv.append($birdImg);
 $birdImg.attr('src', birdUrl);
+data.$birdDiv = $birdviewDiv;
 };
 // creates HTML structure for the about view in elem
 var setupAboutDiv = function (data) {
 var $elem = data.target;
 $aboutDiv.append($header);
 $aboutDiv.append($link);
 $aboutDiv.append($content);
 $link.append($logo);
 $logo.attr('src', settings.logoUrl);
-$link.attr('href', settings.reposUrl);
+$link.attr('href', settings.homeUrl);
 $content.text('Version: ' + settings.version);
-// let the element know about the digilib context
+// click hides
-$aboutDiv.data('digilib', { 'settings' : settings } );
+$aboutDiv.bind('click', function () { showDiv(settings.isAboutDivVisible, $aboutDiv, 0); });
-$aboutDiv.bind('click', showAboutDivFn(data, 0));
+data.$aboutDiv = $aboutDiv;
 };
-// returns handler for showing the 'about' window (toggle visibility if show is null)
+// shows some window e.g. 'about' (toggle visibility if show is null)
-var showAboutDivFn = function (data, show) {
+var showDiv = function (isVisible, $div, show) {
-var $elem = data.target;
+if (typeof(show) !== 'number') {
-var settings = data.settings;
+// toggle visibility
-// event handler: toggles the visibility of the 'about' window
+isVisible = !isVisible;
-return function () {
+} else {
-var $about = $elem.find('div.about');
+// set visibility
-if (typeof(show) !== 'number') {
+isVisible = show;
-// toggle visibility
+}
-settings.isAboutDivVisible = !settings.isAboutDivVisible;
+if (isVisible) {
-} else {
+$div.fadeIn();
-// set visibility
+} else {
-settings.isAboutDivVisible = show;
+$div.fadeOut();
 }
-if (settings.isAboutDivVisible) {
+return isVisible;
-$about.fadeIn();
-} else {
-$about.fadeOut();
-}
-};
 };
 // returns function for load event of scaler img
 var scalerImgLoadedFn = function (data) {
 var settings = data.settings;
 trafo.concat(trafo.getScale(picrect));
 trafo.concat(trafo.getTranslation(picrect));
 data.imgTrafo = trafo;
 // display marks
 renderMarks(data);
-//digilib.showBirdDiv(isBirdDivVisible);
+// show birds eye view
+//showDiv(settings.isBirdDivVisible);
 //digilib.showArrows(); // show arrow overlays for zoom navigation
 // done -- hide about div
-showAboutDivFn(data, 0)();
+settings.isAboutDivVisible = showDiv(null, data.$aboutDiv, 0);
 };
 };
 // place marks on the image
 var renderMarks = function (data) {