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