comparison client/digitallibrary/jquery/jquery.digilib.js @ 606:d08d095430c3 jquery

keeping img tag for embedded mode seems to work now
author robcast
date Sun, 16 Jan 2011 00:56:59 +0100
parents 959bf7c3d684
children dc6b2e7f3621 3d654db7d7d6
comparison
equal deleted inserted replaced
605:959bf7c3d684 606:d08d095430c3
212 return parseQueryString(location.search.slice(1)); 212 return parseQueryString(location.search.slice(1));
213 }; 213 };
214 214
215 // returns parameters taken from embedded img-element 215 // returns parameters taken from embedded img-element
216 var parseImgParams = function($elem) { 216 var parseImgParams = function($elem) {
217 var src = $elem.children('img').attr('src'); 217 var src = $elem.find('img').first().attr('src');
218 if (!src) {
219 return null;
220 }
218 var pos = src.indexOf('?'); 221 var pos = src.indexOf('?');
219 var query = (pos < 0) ? '' : src.substring(pos + 1); 222 var query = (pos < 0) ? '' : src.substring(pos + 1);
220 var scalerUrl = src.substring(0, pos); 223 var scalerUrl = src.substring(0, pos);
221 var hash = parseQueryString(query); 224 var hash = parseQueryString(query);
222 hash.scalerBaseUrl = scalerUrl; 225 hash.scalerBaseUrl = scalerUrl;
263 return geom.size(winW, winH); 266 return geom.size(winW, winH);
264 }; 267 };
265 268
266 // creates HTML structure for digilib in elem 269 // creates HTML structure for digilib in elem
267 var setupScalerDiv = function ($elem, settings) { 270 var setupScalerDiv = function ($elem, settings) {
271 var rewrite;
268 if (settings.interactionMode === 'fullscreen') { 272 if (settings.interactionMode === 'fullscreen') {
269 // fullscreen 273 // fullscreen
270 var imgSize = getFullscreenImgSize($elem); 274 var imgSize = getFullscreenImgSize($elem);
271 settings.dw = imgSize.width; 275 settings.dw = imgSize.width;
272 settings.dh = imgSize.height; 276 settings.dh = imgSize.height;
273 // create new html 277 $img = $('<img/>');
274 $elem.empty(); // TODO: should we keep stuff for customization?
275 var scalerUrl = getScalerString(settings); 278 var scalerUrl = getScalerString(settings);
276 var scalerHTML = '<div class="scaler"><img class="pic"/></div>';
277 $elem.append(scalerHTML);
278 var $img = $elem.find("img.pic");
279 $img.attr('src', scalerUrl); 279 $img.attr('src', scalerUrl);
280 //$img.load(scalerImgLoaded); 280 $img.addClass('pic');
281 } else { 281 } else {
282 // embedded mode -- keep inner img 282 // embedded mode -- try to keep img tag
283 var $img = $elem.detach('img'); 283 var $img = $elem.find('img');
284 $elem.empty(); // TODO: should we keep stuff for customization? 284 if ($img.length > 0) {
285 $img.addClass('pic'); 285 console.debug("img detach:",$img);
286 var $scaler = $('<div class="scaler"/>'); 286 $img.detach();
287 $scaler.append($img); 287 $img.addClass('picsi');
288 $elem.append($scaler); 288 } else {
289 //$img.load(scalerImgLoaded); 289 $img = $('<img/>');
290 } 290 var scalerUrl = getScalerString(settings);
291 $img.attr('src', scalerUrl);
292 $img.addClass('pic');
293 }
294 }
295 // create new html
296 $elem.empty(); // TODO: should we keep stuff for customization?
297 var $scaler = $('<div class="scaler"/>');
298 $elem.append($scaler);
299 $scaler.append($img);
300 $img.load(scalerImgLoadedFn(settings));
291 }; 301 };
292 302
293 // creates HTML structure for buttons in elem 303 // creates HTML structure for buttons in elem
294 var setupButtons = function ($elem, settings, buttonGroup) { 304 var setupButtons = function ($elem, settings, buttonGroup) {
295 if (settings.interactionMode === 'fullscreen') { 305 if (settings.interactionMode === 'fullscreen') {
310 // add attributes and bindings 320 // add attributes and bindings
311 $button.attr('title', buttonSettings.tooltip); 321 $button.attr('title', buttonSettings.tooltip);
312 $button.addClass('button-' + buttonName); 322 $button.addClass('button-' + buttonName);
313 // let the clicked <a> element know about the digilib context 323 // let the clicked <a> element know about the digilib context
314 $a.data('digilib', { 'name' : buttonName, 'settings' : settings } ); 324 $a.data('digilib', { 'name' : buttonName, 'settings' : settings } );
315 $a.bind('click', function(){ 325 $a.bind('click', function() {
316 // get the context settings 326 // get the context settings
317 var data = $(this).data('digilib'); 327 var data = $(this).data('digilib');
318 // find the action for the clicked element 328 // find the action for the clicked element
319 console.log(data.settings.buttons[data.name].onclick); 329 console.log(data.settings.buttons[data.name].onclick);
320 }); 330 });
326 }; 336 };
327 } 337 }
328 return $buttonsDiv; 338 return $buttonsDiv;
329 }; 339 };
330 340
341 // returns function for load event of scaler img
342 var scalerImgLoadedFn = function(settings) {
343 return function() {
344 console.debug("img loaded! settings=", settings);
345 };
346 };
331 // hook plugin into jquery 347 // hook plugin into jquery
332 $.fn.digilib = function(method) { 348 $.fn.digilib = function(method) {
333 if (methods[method]) { 349 if (methods[method]) {
334 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 350 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
335 } else if (typeof(method) === 'object' || !method) { 351 } else if (typeof(method) === 'object' || !method) {