Mercurial > hg > digilib-old
comparison client/digitallibrary/jquery/jquery.digilib.js @ 623:7ba95f12d172 jquery
first attempt at switching images by page number
author | hertzhaft |
---|---|
date | Mon, 17 Jan 2011 16:25:58 +0100 |
parents | cc3d81f02d4e |
children | 7d13b7e5140e |
comparison
equal
deleted
inserted
replaced
622:cc3d81f02d4e | 623:7ba95f12d172 |
---|---|
34 onclick : "javascript:zoomFullpage('width')", | 34 onclick : "javascript:zoomFullpage('width')", |
35 tooltip : "page width", | 35 tooltip : "page width", |
36 img : "pagewidth.png" | 36 img : "pagewidth.png" |
37 }, | 37 }, |
38 back : { | 38 back : { |
39 onclick : "javascript:gotoPage('-1')", | 39 onclick : ["gotoPage", "-1"], |
40 tooltip : "goto previous image", | 40 tooltip : "goto previous image", |
41 img : "back.png" | 41 img : "back.png" |
42 }, | 42 }, |
43 fwd : { | 43 fwd : { |
44 onclick : "javascript:gotoPage('+1')", | 44 onclick : ["gotoPage", "+1"], |
45 tooltip : "goto next image", | 45 tooltip : "goto next image", |
46 img : "fwd.png" | 46 img : "fwd.png" |
47 }, | 47 }, |
48 page : { | 48 page : { |
49 onclick : "javascript:gotoPageWin()", | 49 onclick : "javascript:gotoPageWin()", |
54 onclick : "toggleBirdDiv", | 54 onclick : "toggleBirdDiv", |
55 tooltip : "show bird's eye view", | 55 tooltip : "show bird's eye view", |
56 img : "birds-eye.png" | 56 img : "birds-eye.png" |
57 }, | 57 }, |
58 help : { | 58 help : { |
59 onclick : ["toggleAboutDiv", 0.2], | 59 onclick : "toggleAboutDiv", |
60 tooltip : "about Digilib", | 60 tooltip : "about Digilib", |
61 img : "help.png" | 61 img : "help.png" |
62 }, | 62 }, |
63 reset : { | 63 reset : { |
64 onclick : "javascript:resetImage()", | 64 onclick : "javascript:resetImage()", |
243 return false; | 243 return false; |
244 }, | 244 }, |
245 | 245 |
246 // event handler: toggles the visibility of the bird's eye window | 246 // event handler: toggles the visibility of the bird's eye window |
247 toggleBirdDiv : function () { | 247 toggleBirdDiv : function () { |
248 // xxx: red frame functionality still to be done! | 248 // TODO: red frame functionality |
249 var $elem = $(this); // the clicked button | 249 var $elem = $(this); // the clicked button |
250 var settings = $elem.data('digilib').settings; | 250 var settings = $elem.data('digilib').settings; |
251 var $root = settings.digilibRoot; | 251 var $root = settings.digilibRoot; |
252 var $bird = $root.find('div.birdview'); | 252 var $bird = $root.find('div.birdview'); |
253 settings.isBirdDivVisible = !settings.isBirdDivVisible; | 253 settings.isBirdDivVisible = !settings.isBirdDivVisible; |
255 $bird.fadeIn(); | 255 $bird.fadeIn(); |
256 } else { | 256 } else { |
257 $bird.fadeOut(); | 257 $bird.fadeOut(); |
258 }; | 258 }; |
259 return false; | 259 return false; |
260 }, | |
261 | |
262 // goto given page nr (+/-: relative) | |
263 gotoPage : function(pageNr, keepMarks) { | |
264 var $elem = $(this); // the clicked button | |
265 var settings = $elem.data('digilib').settings; | |
266 var oldpn = settings.pn; | |
267 // set with relative=true uses the sign | |
268 setNumValue(settings, "pn", pageNr); | |
269 // now check the outcome | |
270 var pn = settings.pn; | |
271 if (pn < 1) { | |
272 alert("no such page (page number too low)"); | |
273 settings.pn = oldpn; | |
274 return false; | |
275 }; | |
276 if (settings.pt) { | |
277 if (pn > settings.pt) { | |
278 alert("no such page (page number too high)"); | |
279 settings.pn = oldpn; | |
280 return false; | |
281 } | |
282 }; | |
283 // TODO: keepMarks | |
284 var $root = settings.digilibRoot; | |
285 var $img = $root.find('img.pic'); | |
286 display($img, settings); | |
260 } | 287 } |
261 }; | 288 }; |
262 | 289 |
290 // sets a key to a value (relative values with +/- if relative=true) | |
291 var setNumValue = function(settings, key, value) { | |
292 // TODO: type and error checking | |
293 if (settings[key] == null) return null; | |
294 var sign = value.substring(0,1); | |
295 if (sign === '+' || sign === '-') { | |
296 settings[key] = parseFloat(settings[key]) + parseFloat(value); | |
297 } else { | |
298 settings[key] = value; | |
299 } | |
300 return settings[key]; | |
301 }; | |
302 | |
263 // returns parameters from page url | 303 // returns parameters from page url |
264 var parseQueryParams = function() { | 304 var parseQueryParams = function() { |
265 return parseQueryString(location.search.slice(1)); | 305 return parseQueryString(location.search.slice(1)); |
266 }; | 306 }; |
267 | 307 |
326 return geom.size(winW, winH); | 366 return geom.size(winW, winH); |
327 }; | 367 }; |
328 | 368 |
329 // (re)load the img from a new scaler URL | 369 // (re)load the img from a new scaler URL |
330 var display = function ($img, settings) { | 370 var display = function ($img, settings) { |
371 // TODO: update location.href (browser URL) in fullscreen mode | |
331 var scalerUrl = getScalerString(settings); | 372 var scalerUrl = getScalerString(settings); |
332 $img.attr('src', scalerUrl); | 373 $img.attr('src', scalerUrl); |
333 $img.load(scalerImgLoadedFn(settings)); | 374 // TODO: update bird view? |
334 }; | 375 }; |
335 | 376 |
336 // creates HTML structure for digilib in elem | 377 // creates HTML structure for digilib in elem |
337 var setupScalerDiv = function ($elem, settings) { | 378 var setupScalerDiv = function ($elem, settings) { |
338 var rewrite; | 379 var $img; |
339 if (settings.interactionMode === 'fullscreen') { | 380 if (settings.interactionMode === 'fullscreen') { |
340 // fullscreen | 381 // fullscreen |
341 var imgSize = getFullscreenImgSize($elem); | 382 var imgSize = getFullscreenImgSize($elem); |
342 settings.dw = imgSize.width; | 383 settings.dw = imgSize.width; |
343 settings.dh = imgSize.height; | 384 settings.dh = imgSize.height; |
344 $img = $('<img/>'); | 385 $img = $('<img/>'); |
345 display($img, settings); | 386 display($img, settings); |
346 } else { | 387 } else { |
347 // embedded mode -- try to keep img tag | 388 // embedded mode -- try to keep img tag |
348 var $img = $elem.find('img'); | 389 $img = $elem.find('img'); |
349 if ($img.length > 0) { | 390 if ($img.length > 0) { |
350 console.debug("img detach:",$img); | 391 console.debug("img detach:",$img); |
351 $img.detach(); | 392 $img.detach(); |
352 } else { | 393 } else { |
353 $img = $('<img/>'); | 394 $img = $('<img/>'); |
358 $elem.empty(); // TODO: should we keep stuff for customization? | 399 $elem.empty(); // TODO: should we keep stuff for customization? |
359 var $scaler = $('<div class="scaler"/>'); | 400 var $scaler = $('<div class="scaler"/>'); |
360 $elem.append($scaler); | 401 $elem.append($scaler); |
361 $scaler.append($img); | 402 $scaler.append($img); |
362 $img.addClass('pic'); | 403 $img.addClass('pic'); |
404 $img.load(scalerImgLoadedFn(settings)); | |
363 }; | 405 }; |
364 | 406 |
365 // creates HTML structure for buttons in elem | 407 // creates HTML structure for buttons in elem |
366 var setupButtons = function ($elem, settings, actionGroup) { | 408 var setupButtons = function ($elem, settings, actionGroup) { |
367 if (settings.interactionMode === 'fullscreen') { | 409 if (settings.interactionMode === 'fullscreen') { |