1/* ------------------------------------------------------------------------ 2 Class: prettyPhoto 3 Use: Lightbox clone for jQuery 4 Author: Stephane Caron (http://www.no-margin-for-errors.com) 5 Version: 3.1.2 6------------------------------------------------------------------------- */ 7(function($) { 8 $.prettyPhoto = {version: '3.1.2'}; 9 10 $.fn.prettyPhoto = function(pp_settings) { 11 pp_settings = jQuery.extend({ 12 animation_speed: 'fast', /* fast/slow/normal */ 13 slideshow: 5000, /* false OR interval time in ms */ 14 autoplay_slideshow: false, /* true/false */ 15 opacity: 0.80, /* Value between 0 and 1 */ 16 show_title: true, /* true/false */ 17 allow_resize: true, /* Resize the photos bigger than viewport. true/false */ 18 default_width: 500, 19 default_height: 344, 20 counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */ 21 theme: 'pp_default', /* light_rounded / dark_rounded / light_square / dark_square / facebook */ 22 horizontal_padding: 20, /* The padding on each side of the picture */ 23 hideflash: false, /* Hides all the flash object on a page, set to TRUE if flash appears over prettyPhoto */ 24 wmode: 'opaque', /* Set the flash wmode attribute */ 25 autoplay: true, /* Automatically start videos: True/False */ 26 modal: false, /* If set to true, only the close button will close the window */ 27 deeplinking: true, /* Allow prettyPhoto to update the url to enable deeplinking. */ 28 overlay_gallery: true, /* If set to true, a gallery will overlay the fullscreen image on mouse over */ 29 keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */ 30 changepicturecallback: function(){}, /* Called everytime an item is shown/changed */ 31 callback: function(){}, /* Called when prettyPhoto is closed */ 32 ie6_fallback: true, 33 markup: '<div class="pp_pic_holder"> \ 34 <div class="ppt"> </div> \ 35 <div class="pp_top"> \ 36 <div class="pp_left"></div> \ 37 <div class="pp_middle"></div> \ 38 <div class="pp_right"></div> \ 39 </div> \ 40 <div class="pp_content_container"> \ 41 <div class="pp_left"> \ 42 <div class="pp_right"> \ 43 <div class="pp_content"> \ 44 <div class="pp_loaderIcon"></div> \ 45 <div class="pp_fade"> \ 46 <a href="#" class="pp_expand" title="Expand the image">Expand</a> \ 47 <div class="pp_hoverContainer"> \ 48 <a class="pp_next" href="#">next</a> \ 49 <a class="pp_previous" href="#">previous</a> \ 50 </div> \ 51 <div id="pp_full_res"></div> \ 52 <div class="pp_details"> \ 53 <div class="pp_nav"> \ 54 <a href="#" class="pp_arrow_previous">Previous</a> \ 55 <p class="currentTextHolder">0/0</p> \ 56 <a href="#" class="pp_arrow_next">Next</a> \ 57 </div> \ 58 <p class="pp_description"></p> \ 59 {pp_social} \ 60 <a class="pp_close" href="#">Close</a> \ 61 </div> \ 62 </div> \ 63 </div> \ 64 </div> \ 65 </div> \ 66 </div> \ 67 <div class="pp_bottom"> \ 68 <div class="pp_left"></div> \ 69 <div class="pp_middle"></div> \ 70 <div class="pp_right"></div> \ 71 </div> \ 72 </div> \ 73 <div class="pp_overlay"></div>', 74 gallery_markup: '<div class="pp_gallery"> \ 75 <a href="#" class="pp_arrow_previous">Previous</a> \ 76 <div> \ 77 <ul> \ 78 {gallery} \ 79 </ul> \ 80 </div> \ 81 <a href="#" class="pp_arrow_next">Next</a> \ 82 </div>', 83 image_markup: '<img id="fullResImage" src="{path}" />', 84 flash_markup: '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="{width}" height="{height}"><param name="wmode" value="{wmode}" /><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="{path}" /><embed src="{path}" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="{width}" height="{height}" wmode="{wmode}"></embed></object>', 85 quicktime_markup: '<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="{height}" width="{width}"><param name="src" value="{path}"><param name="autoplay" value="{autoplay}"><param name="type" value="video/quicktime"><embed src="{path}" height="{height}" width="{width}" autoplay="{autoplay}" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"></embed></object>', 86 iframe_markup: '<iframe src ="{path}" width="{width}" height="{height}" frameborder="no"></iframe>', 87 inline_markup: '<div class="pp_inline">{content}</div>', 88 custom_markup: '', 89 social_tools: '<div class="pp_social"><div class="twitter"><a href="http://twitter.com/share" class="twitter-share-button" data-count="none">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div><div class="facebook"><iframe src="http://www.facebook.com/plugins/like.php?locale=en_US&href='+location.href+'&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:500px; height:23px;" allowTransparency="true"></iframe></div></div>' /* html or false to disable */ 90 }, pp_settings); 91 92 // Global variables accessible only by prettyPhoto 93 var matchedObjects = this, percentBased = false, pp_dimensions, pp_open, 94 95 // prettyPhoto container specific 96 pp_contentHeight, pp_contentWidth, pp_containerHeight, pp_containerWidth, 97 98 // Window size 99 windowHeight = $(window).height(), windowWidth = $(window).width(), 100 101 // Global elements 102 pp_slideshow; 103 104 doresize = true, scroll_pos = _get_scroll(); 105 106 // Window/Keyboard events 107 $(window).unbind('resize.prettyphoto').bind('resize.prettyphoto',function(){ _center_overlay(); _resize_overlay(); }); 108 109 if(pp_settings.keyboard_shortcuts) { 110 $(document).unbind('keydown.prettyphoto').bind('keydown.prettyphoto',function(e){ 111 if(typeof $pp_pic_holder != 'undefined'){ 112 if($pp_pic_holder.is(':visible')){ 113 switch(e.keyCode){ 114 case 37: 115 $.prettyPhoto.changePage('previous'); 116 e.preventDefault(); 117 break; 118 case 39: 119 $.prettyPhoto.changePage('next'); 120 e.preventDefault(); 121 break; 122 case 27: 123 if(!settings.modal) 124 $.prettyPhoto.close(); 125 e.preventDefault(); 126 break; 127 }; 128 // return false;
129 }; 130 }; 131 }); 132 }; 133 134 /** 135 * Initialize prettyPhoto. 136 */ 137 $.prettyPhoto.initialize = function() { 138 139 settings = pp_settings; 140 141 if(settings.theme == 'pp_default') settings.horizontal_padding = 16; 142 if(settings.ie6_fallback && $.browser.msie && parseInt($.browser.version) == 6) settings.theme = "light_square"; // Fallback to a supported theme for IE6 143 144 // Find out if the picture is part of a set 145 theRel = $(this).attr('rel'); 146 galleryRegExp = /\[(?:.*)\]/; 147 isSet = (galleryRegExp.exec(theRel)) ? true : false; 148 149 // Put the SRCs, TITLEs, ALTs into an array. 150 pp_images = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr('rel').indexOf(theRel) != -1) return $(n).attr('href'); }) : $.makeArray($(this).attr('href')); 151 pp_titles = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr('rel').indexOf(theRel) != -1) return ($(n).find('img').attr('alt')) ? $(n).find('img').attr('alt') : ""; }) : $.makeArray($(this).find('img').attr('alt')); 152 pp_descriptions = (isSet) ? jQuery.map(matchedObjects, function(n, i){ if($(n).attr('rel').indexOf(theRel) != -1) return ($(n).attr('title')) ? $(n).attr('title') : ""; }) : $.makeArray($(this).attr('title')); 153 154 set_position = jQuery.inArray($(this).attr('href'), pp_images); // Define where in the array the clicked item is positionned 155 rel_index = (isSet) ? set_position : $("a[rel^='"+theRel+"']").index($(this)); 156 157 _build_overlay(this); // Build the overlay {this} being the caller 158 159 if(settings.allow_resize) 160 $(window).bind('scroll.prettyphoto',function(){ _center_overlay(); }); 161 162 163 $.prettyPhoto.open(); 164 165 return false; 166 } 167 168 169 /** 170 * Opens the prettyPhoto modal box. 171 * @param image {String,Array} Full path to the image to be open, can also be an array containing full images paths. 172 * @param title {String,Array} The title to be displayed with the picture, can also be an array containing all the titles. 173 * @param description {String,Array} The description to be displayed with the picture, can also be an array containing all the descriptions. 174 */ 175 $.prettyPhoto.open = function(event) { 176 if(typeof settings == "undefined"){ // Means it's an API call, need to manually get the settings and set the variables 177 settings = pp_settings; 178 if($.browser.msie && $.browser.version == 6) settings.theme = "light_square"; // Fallback to a supported theme for IE6 179 pp_images = $.makeArray(arguments[0]); 180 pp_titles = (arguments[1]) ? $.makeArray(arguments[1]) : $.makeArray(""); 181 pp_descriptions = (arguments[2]) ? $.makeArray(arguments[2]) : $.makeArray(""); 182 isSet = (pp_images.length > 1) ? true : false; 183 set_position = 0; 184 _build_overlay(event.target); // Build the overlay {this} being the caller 185 } 186 187 if($.browser.msie && $.browser.version == 6) $('select').css('visibility','hidden'); // To fix the bug with IE select boxes 188 189 if(settings.hideflash) $('object,embed,iframe[src*=youtube],iframe[src*=vimeo]').css('visibility','hidden'); // Hide the flash 190 191 _checkPosition($(pp_images).size()); // Hide the next/previous links if on first or last images. 192 193 $('.pp_loaderIcon').show(); 194 195 // Fade the content in 196 if($ppt.is(':hidden')) $ppt.css('opacity',0).show(); 197 $pp_overlay.show().fadeTo(settings.animation_speed,settings.opacity); 198 199 // Display the current position 200 $pp_pic_holder.find('.currentTextHolder').text((set_position+1) + settings.counter_separator_label + $(pp_images).size()); 201 202 // Set the description 203 if(pp_descriptions[set_position] != ""){ 204 $pp_pic_holder.find('.pp_description').show().html(unescape(pp_descriptions[set_position])); 205 }else{ 206 $pp_pic_holder.find('.pp_description').hide(); 207 } 208 209 // Get the dimensions 210 movie_width = ( parseFloat(getParam('width',pp_images[set_position])) ) ? getParam('width',pp_images[set_position]) : settings.default_width.toString(); 211 movie_height = ( parseFloat(getParam('height',pp_images[set_position])) ) ? getParam('height',pp_images[set_position]) : settings.default_height.toString(); 212 213 // If the size is % based, calculate according to window dimensions 214 percentBased=false; 215 if(movie_height.indexOf('%') != -1) { movie_height = parseFloat(($(window).height() * parseFloat(movie_height) / 100) - 150); percentBased = true; } 216 if(movie_width.indexOf('%') != -1) { movie_width = parseFloat(($(window).width() * parseFloat(movie_width) / 100) - 150); percentBased = true; } 217 218 // Fade the holder 219 $pp_pic_holder.fadeIn(function(){ 220 // Set the title
221 (settings.show_title && pp_titles[set_position] != "" && typeof pp_titles[set_position] != "undefined") ? $ppt.html(unescape(pp_titles[set_position])) : $ppt.html(' '); 222 223 imgPreloader = ""; 224 skipInjection = false; 225 226 // Inject the proper content 227 switch(_getFileType(pp_images[set_position])){ 228 case 'image': 229 imgPreloader = new Image(); 230 231 // Preload the neighbour images 232 nextImage = new Image(); 233 if(isSet && set_position < $(pp_images).size() -1) nextImage.src = pp_images[set_position + 1]; 234 prevImage = new Image(); 235 if(isSet && pp_images[set_position - 1]) prevImage.src = pp_images[set_position - 1]; 236 237 $pp_pic_holder.find('#pp_full_res')[0].innerHTML = settings.image_markup.replace(/{path}/g,pp_images[set_position]); 238 239 imgPreloader.onload = function(){ 240 // Fit item to viewport 241 pp_dimensions = _fitToViewport(imgPreloader.width,imgPreloader.height); 242 243 _showContent(); 244 }; 245 246 imgPreloader.onerror = function(){ 247 alert('Image cannot be loaded. Make sure the path is correct and image exist.'); 248 $.prettyPhoto.close(); 249 }; 250 251 imgPreloader.src = pp_images[set_position]; 252 break; 253 254 case 'youtube': 255 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 256 257 movie = 'http://www.youtube.com/embed/'+getParam('v',pp_images[set_position]); 258 (getParam('rel',pp_images[set_position])) ? movie+="?rel="+getParam('rel',pp_images[set_position]) : movie+="?rel=1"; 259 260 if(settings.autoplay) movie += "&autoplay=1"; 261 262 toInject = settings.iframe_markup.replace(/{width}/g,pp_dimensions['width']).replace(/{height}/g,pp_dimensions['height']).replace(/{wmode}/g,settings.wmode).replace(/{path}/g,movie); 263 break; 264 265 case 'vimeo': 266 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 267 268 movie_id = pp_images[set_position]; 269 var regExp = /http:\/\/(www\.)?vimeo.com\/(\d+)/; 270 var match = movie_id.match(regExp); 271 272 movie = 'http://player.vimeo.com/video/'+ match[2] +'?title=0&byline=0&portrait=0'; 273 if(settings.autoplay) movie += "&autoplay=1;"; 274 275 vimeo_width = pp_dimensions['width'] + '/embed/?moog_width='+ pp_dimensions['width']; 276 277 toInject = settings.iframe_markup.replace(/{width}/g,vimeo_width).replace(/{height}/g,pp_dimensions['height']).replace(/{path}/g,movie); 278 break; 279 280 case 'quicktime': 281 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 282 pp_dimensions['height']+=15; pp_dimensions['contentHeight']+=15; pp_dimensions['containerHeight']+=15; // Add space for the control bar 283 284 toInject = settings.quicktime_markup.replace(/{width}/g,pp_dimensions['width']).replace(/{height}/g,pp_dimensions['height']).replace(/{wmode}/g,settings.wmode).replace(/{path}/g,pp_images[set_position]).replace(/{autoplay}/g,settings.autoplay); 285 break; 286 287 case 'flash': 288 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 289 290 flash_vars = pp_images[set_position]; 291 flash_vars = flash_vars.substring(pp_images[set_position].indexOf('flashvars') + 10,pp_images[set_position].length); 292 293 filename = pp_images[set_position]; 294 filename = filename.substring(0,filename.indexOf('?')); 295 296 toInject = settings.flash_markup.replace(/{width}/g,pp_dimensions['width']).replace(/{height}/g,pp_dimensions['height']).replace(/{wmode}/g,settings.wmode).replace(/{path}/g,filename+'?'+flash_vars); 297 break; 298 299 case 'iframe': 300 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 301 302 frame_url = pp_images[set_position]; 303 frame_url = frame_url.substr(0,frame_url.indexOf('iframe')-1); 304 305 toInject = settings.iframe_markup.replace(/{width}/g,pp_dimensions['width']).replace(/{height}/g,pp_dimensions['height']).replace(/{path}/g,frame_url); 306 break; 307 308 case 'ajax': 309 doresize = false; // Make sure the dimensions are not resized. 310 pp_dimensions = _fitToViewport(movie_width,movie_height); 311 doresize = true; // Reset the dimensions 312 313 skipInjection = true; 314 $.get(pp_images[set_position],function(responseHTML){ 315 toInject = settings.inline_markup.replace(/{content}/g,responseHTML); 316 $pp_pic_holder.find('#pp_full_res')[0].innerHTML = toInject; 317 _showContent(); 318 }); 319 320 break; 321 322 case 'custom': 323 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 324 325 toInject = settings.custom_markup; 326 break; 327 328 case 'inline': 329 // to get the item height clone it, apply default width, wrap it in the prettyPhoto containers , then delete 330 myClone = $(pp_images[set_position]).clone().append('<br clear="all" />').css({'width':settings.default_width}).wrapInner('<div id="pp_full_res"><div class="pp_inline"></div></div>').appendTo($('body')).show(); 331 doresize = false; // Make sure the dimensions are not resized. 332 pp_dimensions = _fitToViewport($(myClone).width(),$(myClone).height()); 333 doresize = true; // Reset the dimensions 334 $(myClone).remove(); 335 toInject = settings.inline_markup.replace(/{content}/g,$(pp_images[set_position]).html()); 336 break; 337 }; 338 339 if(!imgPreloader && !skipInjection){ 340 $pp_pic_holder.find('#pp_full_res')[0].innerHTML = toInject; 341 342 // Show content 343 _showContent(); 344 }; 345 }); 346 347 return false;
348 }; 349 350 351 /** 352 * Change page in the prettyPhoto modal box 353 * @param direction {String} Direction of the paging, previous or next. 354 */ 355 $.prettyPhoto.changePage = function(direction){ 356 currentGalleryPage = 0; 357 358 if(direction == 'previous') { 359 set_position--; 360 if (set_position < 0) set_position = $(pp_images).size()-1; 361 }else if(direction == 'next'){ 362 set_position++; 363 if(set_position > $(pp_images).size()-1) set_position = 0; 364 }else{ 365 set_position=direction; 366 }; 367 368 rel_index = set_position; 369 370 if(!doresize) doresize = true; // Allow the resizing of the images 371 $('.pp_contract').removeClass('pp_contract').addClass('pp_expand'); 372 373 _hideContent(function(){ $.prettyPhoto.open(); }); 374 }; 375 376 377 /** 378 * Change gallery page in the prettyPhoto modal box 379 * @param direction {String} Direction of the paging, previous or next. 380 */ 381 $.prettyPhoto.changeGalleryPage = function(direction){ 382 if(direction=='next'){ 383 currentGalleryPage ++; 384 385 if(currentGalleryPage > totalPage) currentGalleryPage = 0; 386 }else if(direction=='previous'){ 387 currentGalleryPage --; 388 389 if(currentGalleryPage < 0) currentGalleryPage = totalPage; 390 }else{ 391 currentGalleryPage = direction; 392 }; 393 394 slide_speed = (direction == 'next' || direction == 'previous') ? settings.animation_speed : 0; 395 396 slide_to = currentGalleryPage * (itemsPerPage * itemWidth); 397 398 $pp_gallery.find('ul').animate({left:-slide_to},slide_speed); 399 }; 400 401 402 /** 403 * Start the slideshow... 404 */ 405 $.prettyPhoto.startSlideshow = function(){ 406 if(typeof pp_slideshow == 'undefined'){ 407 $pp_pic_holder.find('.pp_play').unbind('click').removeClass('pp_play').addClass('pp_pause').click(function(){ 408 $.prettyPhoto.stopSlideshow(); 409 return false; 410 }); 411 pp_slideshow = setInterval($.prettyPhoto.startSlideshow,settings.slideshow); 412 }else{ 413 $.prettyPhoto.changePage('next'); 414 }; 415 } 416 417 418 /** 419 * Stop the slideshow... 420 */ 421 $.prettyPhoto.stopSlideshow = function(){ 422 $pp_pic_holder.find('.pp_pause').unbind('click').removeClass('pp_pause').addClass('pp_play').click(function(){ 423 $.prettyPhoto.startSlideshow(); 424 return false; 425 }); 426 clearInterval(pp_slideshow); 427 pp_slideshow=undefined; 428 } 429 430 431 /** 432 * Closes prettyPhoto. 433 */ 434 $.prettyPhoto.close = function(){ 435 if($pp_overlay.is(":animated")) return; 436 437 $.prettyPhoto.stopSlideshow(); 438 439 $pp_pic_holder.stop().find('object,embed').css('visibility','hidden'); 440 441 $('div.pp_pic_holder,div.ppt,.pp_fade').fadeOut(settings.animation_speed,function(){ $(this).remove(); }); 442 443 $pp_overlay.fadeOut(settings.animation_speed, function(){ 444 if($.browser.msie && $.browser.version == 6) $('select').css('visibility','visible'); // To fix the bug with IE select boxes 445 446 if(settings.hideflash) $('object,embed,iframe[src*=youtube],iframe[src*=vimeo]').css('visibility','visible'); // Show the flash 447 448 $(this).remove(); // No more need for the prettyPhoto markup 449 450 $(window).unbind('scroll.prettyphoto'); 451 452 settings.callback(); 453 454 doresize = true; 455 456 pp_open = false; 457 458 delete settings; 459 }); 460 }; 461 462 /** 463 * Set the proper sizes on the containers and animate the content in. 464 */ 465 function _showContent(){ 466 $('.pp_loaderIcon').hide(); 467 468 // Calculate the opened top position of the pic holder 469 projectedTop = scroll_pos['scrollTop'] + ((windowHeight/2) - (pp_dimensions['containerHeight']/2)); 470 if(projectedTop < 0) projectedTop = 0; 471 472 $ppt.fadeTo(settings.animation_speed,1); 473 474 // Resize the content holder 475 $pp_pic_holder.find('.pp_content') 476 .animate({ 477 height:pp_dimensions['contentHeight'], 478 width:pp_dimensions['contentWidth'] 479 },settings.animation_speed); 480 481 // Resize picture the holder 482 $pp_pic_holder.animate({ 483 'top': projectedTop, 484 'left': (windowWidth/2) - (pp_dimensions['containerWidth']/2), 485 width:pp_dimensions['containerWidth'] 486 },settings.animation_speed,function(){ 487 $pp_pic_holder.find('.pp_hoverContainer,#fullResImage').height(pp_dimensions['height']).width(pp_dimensions['width']); 488 489 $pp_pic_holder.find('.pp_fade').fadeIn(settings.animation_speed); // Fade the new content 490 491 // Show the nav 492 if(isSet && _getFileType(pp_images[set_position])=="image") { $pp_pic_holder.find('.pp_hoverContainer').show(); }else{ $pp_pic_holder.find('.pp_hoverContainer').hide(); } 493 494 if(pp_dimensions['resized']){ // Fade the resizing link if the image is resized 495 $('a.pp_expand,a.pp_contract').show(); 496 }else{ 497 $('a.pp_expand').hide(); 498 } 499 500 if(settings.autoplay_slideshow && !pp_slideshow && !pp_open) $.prettyPhoto.startSlideshow(); 501 502 if(settings.deeplinking) 503 setHashtag(); 504 505 settings.changepicturecallback(); // Callback! 506 507 pp_open = true; 508 }); 509 510 _insert_gallery(); 511 }; 512
513 /** 514 * Hide the content...DUH! 515 */ 516 function _hideContent(callback){ 517 // Fade out the current picture 518 $pp_pic_holder.find('#pp_full_res object,#pp_full_res embed').css('visibility','hidden'); 519 $pp_pic_holder.find('.pp_fade').fadeOut(settings.animation_speed,function(){ 520 $('.pp_loaderIcon').show(); 521 522 callback(); 523 }); 524 }; 525 526 /** 527 * Check the item position in the gallery array, hide or show the navigation links 528 * @param setCount {integer} The total number of items in the set 529 */ 530 function _checkPosition(setCount){ 531 (setCount > 1) ? $('.pp_nav').show() : $('.pp_nav').hide(); // Hide the bottom nav if it's not a set. 532 }; 533 534 /** 535 * Resize the item dimensions if it's bigger than the viewport 536 * @param width {integer} Width of the item to be opened 537 * @param height {integer} Height of the item to be opened 538 * @return An array containin the "fitted" dimensions 539 */ 540 function _fitToViewport(width,height){ 541 resized = false; 542 543 _getDimensions(width,height); 544 545 // Define them in case there's no resize needed 546 imageWidth = width, imageHeight = height; 547 548 if( ((pp_containerWidth > windowWidth) || (pp_containerHeight > windowHeight)) && doresize && settings.allow_resize && !percentBased) { 549 resized = true, fitting = false; 550 551 while (!fitting){ 552 if((pp_containerWidth > windowWidth)){ 553 imageWidth = (windowWidth - 200); 554 imageHeight = (height/width) * imageWidth; 555 }else if((pp_containerHeight > windowHeight)){ 556 imageHeight = (windowHeight - 200); 557 imageWidth = (width/height) * imageHeight; 558 }else{ 559 fitting = true; 560 }; 561 562 pp_containerHeight = imageHeight, pp_containerWidth = imageWidth; 563 }; 564 565 _getDimensions(imageWidth,imageHeight); 566 567 if((pp_containerWidth > windowWidth) || (pp_containerHeight > windowHeight)){ 568 _fitToViewport(pp_containerWidth,pp_containerHeight) 569 }; 570 }; 571 572 return { 573 width:Math.floor(imageWidth), 574 height:Math.floor(imageHeight), 575 containerHeight:Math.floor(pp_containerHeight), 576 containerWidth:Math.floor(pp_containerWidth) + (settings.horizontal_padding * 2), 577 contentHeight:Math.floor(pp_contentHeight), 578 contentWidth:Math.floor(pp_contentWidth), 579 resized:resized 580 }; 581 }; 582 583 /** 584 * Get the containers dimensions according to the item size 585 * @param width {integer} Width of the item to be opened 586 * @param height {integer} Height of the item to be opened 587 */ 588 function _getDimensions(width,height){ 589 width = parseFloat(width); 590 height = parseFloat(height); 591 592 // Get the details height, to do so, I need to clone it since it's invisible 593 $pp_details = $pp_pic_holder.find('.pp_details'); 594 $pp_details.width(width); 595 detailsHeight = parseFloat($pp_details.css('marginTop')) + parseFloat($pp_details.css('marginBottom')); 596 597 $pp_details = $pp_details.clone().addClass(settings.theme).width(width).appendTo($('body')).css({ 598 'position':'absolute', 599 'top':-10000 600 }); 601 detailsHeight += $pp_details.height(); 602 detailsHeight = (detailsHeight <= 34) ? 36 : detailsHeight; // Min-height for the details 603 if($.browser.msie && $.browser.version==7) detailsHeight+=8; 604 $pp_details.remove(); 605 606 // Get the titles height, to do so, I need to clone it since it's invisible 607 $pp_title = $pp_pic_holder.find('.ppt'); 608 $pp_title.width(width); 609 titleHeight = parseFloat($pp_title.css('marginTop')) + parseFloat($pp_title.css('marginBottom')); 610 $pp_title = $pp_title.clone().appendTo($('body')).css({ 611 'position':'absolute', 612 'top':-10000 613 }); 614 titleHeight += $pp_title.height(); 615 $pp_title.remove(); 616 617 // Get the container size, to resize the holder to the right dimensions 618 pp_contentHeight = height + detailsHeight; 619 pp_contentWidth = width; 620 pp_containerHeight = pp_contentHeight + titleHeight + $pp_pic_holder.find('.pp_top').height() + $pp_pic_holder.find('.pp_bottom').height(); 621 pp_containerWidth = width; 622 } 623 624 function _getFileType(itemSrc){ 625 if (itemSrc.match(/youtube\.com\/watch/i)) { 626 return 'youtube'; 627 }else if (itemSrc.match(/vimeo\.com/i)) { 628 return 'vimeo'; 629 }else if(itemSrc.match(/\b.mov\b/i)){ 630 return 'quicktime'; 631 }else if(itemSrc.match(/\b.swf\b/i)){ 632 return 'flash'; 633 }else if(itemSrc.match(/\biframe=true\b/i)){ 634 return 'iframe'; 635 }else if(itemSrc.match(/\bajax=true\b/i)){ 636 return 'ajax'; 637 }else if(itemSrc.match(/\bcustom=true\b/i)){ 638 return 'custom'; 639 }else if(itemSrc.substr(0,1) == '#'){ 640 return 'inline'; 641 }else{ 642 return 'image'; 643 }; 644 }; 645 646 function _center_overlay(){ 647 if(doresize && typeof $pp_pic_holder != 'undefined') { 648 scroll_pos = _get_scroll(); 649 contentHeight = $pp_pic_holder.height(), contentwidth = $pp_pic_holder.width(); 650 651 projectedTop = (windowHeight/2) + scroll_pos['scrollTop'] - (contentHeight/2); 652 if(projectedTop < 0) projectedTop = 0; 653 654 if(contentHeight > windowHeight) 655 return; 656 657 $pp_pic_holder.css({ 658 'top': projectedTop, 659 'left': (windowWidth/2) + scroll_pos['scrollLeft'] - (contentwidth/2) 660 }); 661 }; 662 }; 663 664 function _get_scroll(){ 665 if (self.pageYOffset) { 666 return {scrollTop:self.pageYOffset,scrollLeft:self.pageXOffset}; 667 } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict 668 return {scrollTop:document.documentElement.scrollTop,scrollLeft:document.documentElement.scrollLeft}; 669 } else if (document.body) {// all other Explorers 670 return {scrollTop:document.body.scrollTop,scrollLeft:document.body.scrollLeft}; 671 }; 672 }; 673 674 function _resize_overlay() { 675 windowHeight = $(window).height(), windowWidth = $(window).width(); 676 677 if(typeof $pp_overlay != "undefined") $pp_overlay.height($(document).height()).width(windowWidth); 678 }; 679 680 function _insert_gallery(){ 681 if(isSet && settings.overlay_gallery && _getFileType(pp_images[set_position])=="image" && (sett
681ings.ie6_fallback && !($.browser.msie && parseInt($.browser.version) == 6))) { 682 itemWidth = 52+5; // 52 beign the thumb width, 5 being the right margin. 683 navWidth = (settings.theme == "facebook" || settings.theme == "pp_default") ? 50 : 30; // Define the arrow width depending on the theme 684 685 itemsPerPage = Math.floor((pp_dimensions['containerWidth'] - 100 - navWidth) / itemWidth); 686 itemsPerPage = (itemsPerPage < pp_images.length) ? itemsPerPage : pp_images.length; 687 totalPage = Math.ceil(pp_images.length / itemsPerPage) - 1; 688 689 // Hide the nav in the case there's no need for links 690 if(totalPage == 0){ 691 navWidth = 0; // No nav means no width! 692 $pp_gallery.find('.pp_arrow_next,.pp_arrow_previous').hide(); 693 }else{ 694 $pp_gallery.find('.pp_arrow_next,.pp_arrow_previous').show(); 695 }; 696 697 galleryWidth = itemsPerPage * itemWidth; 698 fullGalleryWidth = pp_images.length * itemWidth; 699 700 // Set the proper width to the gallery items 701 $pp_gallery 702 .css('margin-left',-((galleryWidth/2) + (navWidth/2))) 703 .find('div:first').width(galleryWidth+5) 704 .find('ul').width(fullGalleryWidth) 705 .find('li.selected').removeClass('selected'); 706 707 goToPage = (Math.floor(set_position/itemsPerPage) < totalPage) ? Math.floor(set_position/itemsPerPage) : totalPage; 708 709 $.prettyPhoto.changeGalleryPage(goToPage); 710 711 $pp_gallery_li.filter(':eq('+set_position+')').addClass('selected'); 712 }else{ 713 $pp_pic_holder.find('.pp_content').unbind('mouseenter mouseleave'); 714 // $pp_gallery.hide(); 715 } 716 } 717 718 function _build_overlay(caller){ 719 720 settings.markup=settings.markup.replace('{pp_social}',(settings.social_tools)?settings.social_tools:''); 721 722 $('body').append(settings.markup); // Inject the markup 723 724 $pp_pic_holder = $('.pp_pic_holder') , $ppt = $('.ppt'), $pp_overlay
724= $('div.pp_overlay'); // Set my global selectors 725 726 // Inject the inline gallery! 727 if(isSet && settings.overlay_gallery) { 728 currentGalleryPage = 0; 729 toInject = ""; 730 for (var i=0; i < pp_images.length; i++) { 731 if(!pp_images[i].match(/\b(jpg|jpeg|png|gif)\b/gi)){ 732 classname = 'default'; 733 img_src = ''; 734 }else{ 735 classname = ''; 736 img_src = pp_images[i]; 737 } 738 toInject += "<li class='"+classname+"'><a href='#'><img src='" + img_src + "' width='50' alt='' /></a></li>"; 739 }; 740 741 toInject = settings.gallery_markup.replace(/{gallery}/g,toInject); 742 743 $pp_pic_holder.find('#pp_full_res').after(toInject); 744 745 $pp_gallery = $('.pp_pic_holder .pp_gallery'), $pp_gallery_li = $pp_gallery.find('li'); // Set the gallery selectors 746 747 $pp_gallery.find('.pp_arrow_next').click(function(){ 748 $.prettyPhoto.changeGalleryPage('next'); 749 $.prettyPhoto.stopSlideshow(); 750 return false; 751 }); 752 753 $pp_gallery.find('.pp_arrow_previous').click(function(){ 754 $.prettyPhoto.changeGalleryPage('previous'); 755 $.prettyPhoto.stopSlideshow(); 756 return false; 757 }); 758 759 $pp_pic_holder.find('.pp_content').hover( 760 function(){ 761 $pp_pic_holder.find('.pp_gallery:not(.disabled)').fadeIn(); 762 }, 763 function(){ 764 $pp_pic_holder.find('.pp_gallery:not(.disabled)').fadeOut(); 765 }); 766 767 itemWidth = 52+5; // 52 beign the thumb width, 5 being the right margin. 768 $pp_gallery_li.each(function(i){ 769 $(this) 770 .find('a') 771 .click(function(){ 772 $.prettyPhoto.changePage(i); 773 $.prettyPhoto.stopSlideshow(); 774 return false; 775 }); 776 }); 777 }; 778 779 780 // Inject the play/pause if it's a slideshow 781 if(settings.slideshow){ 782 $pp_pic_holder.find('.pp_nav').prepend('<a href="#" class="pp_play">Play</a>') 783 $pp_pic_holder.find('.pp_nav .pp_play').click(function(){ 784 $.prettyPhoto.startSlideshow(); 785 return false; 786 }); 787 } 788 789 $pp_pic_holder.attr('class','pp_pic_holder ' + settings.theme); // Set the proper theme 790 791 $pp_overlay 792 .css({ 793 'opacity':0, 794 'height':$(document).height(), 795 'width':$(window).width() 796 }) 797 .bind('click',function(){ 798 if(!settings.modal) $.prettyPhoto.close(); 799 }); 800 801 $('a.pp_close').bind('click',function(){ $.prettyPhoto.close(); return false; }); 802 803 $('a.pp_expand').bind('click',function(e){ 804 // Expand the image 805 if($(this).hasClass('pp_expand')){ 806 $(this).removeClass('pp_expand').addClass('pp_contract'); 807 doresize = false; 808 }else{ 809 $(this).removeClass('pp_contract').addClass('pp_expand'); 810 doresize = true; 811 }; 812 813 _hideContent(function(){ $.prettyPhoto.open(); }); 814 815 return false; 816 }); 817 818 $pp_pic_holder.find('.pp_previous, .pp_nav .pp_arrow_previous').bind('click',function(){ 819 $.prettyPhoto.changePage('previous'); 820 $.prettyPhoto.stopSlideshow(); 821 return false; 822 }); 823 824 $pp_pic_holder.find('.pp_next, .pp_nav .pp_arrow_next').bind('click',function(){ 825 $.prettyPhoto.changePage('next'); 826 $.prettyPhoto.stopSlideshow(); 827 return false; 828 }); 829 830 _center_overlay(); // Center it 831 }; 832 833 if(!pp_alreadyInitialized && getHashtag()){ 834 pp_alreadyInitialized = true; 835 836 // Grab the rel index to trigger the click on the correct element 837 hashIndex = getHashtag(); 838 hashRel = hashIndex; 839 hashIndex = hashIndex.substring(hashIndex.indexOf('/')+1,hashIndex.length-1); 840 hashRel = hashRel.substring(0,hashRel.indexOf('/')); 841 842 // Little timeout to make sure all the prettyPhoto initialize scripts has been run. 843 // Useful in the event the page contain several init scripts. 844 setTimeout(function(){ $("a[rel^='"+hashRel+"']:eq("+hashIndex+")").trigger('click'); },50); 845 } 846 847 return this.unbind('click.prettyphoto').bind('click.prettyphoto',$.prettyPhoto.initialize); // Return the jQuery object for chaining. The unbind method is used to avoid click conflict when the plugin is called more than once 848 }; 849 850 function getHashtag(){ 851 url = location.href; 852 hashtag = (url.indexOf('#!') != -1) ? decodeURI(url.substring(url.indexOf('#!')+2,url.length)) : false;
853 return hashtag; 854 }; 855 856 function setHashtag(){ 857 if(typeof theRel == 'undefined') return; // theRel is set on normal calls, it's impossible to deeplink using the API 858 location.hash = '!' + theRel + '/'+rel_index+'/'; 859 }; 860 861 function getParam(name,url){ 862 name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); 863 var regexS = "[\\?&]"+name+"=([^&#]*)"; 864 var regex = new RegExp( regexS ); 865 var results = regex.exec( url ); 866 return ( results == null ) ? "" : results[1]; 867 } 868 869})(jQuery); 870 871var pp_alreadyInitialized = false; // Used for the deep linking to make sure not to call the same function several times.
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.