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: 'fast', /* 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: 500, 22 default_height: 344, 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}" frameborder="no"></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).length); // Hide the next/previous links if on first or last images. 194 195 $('.pp_loaderIcon').show(); 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.show().fadeTo(settings.animation_speed,settings.opacity); 209 210 // Display the current position 211 $pp_pic_holder.find('.currentTextHolder').text((set_position+1) + settings.counter_separator_label + $(pp_images).length); 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().text(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.text(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).length -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 = 'https://www.youtube.com/embed/'+movie_id; 283 (getParam('nocookie',pp_images[set_position])) ? movie='https://www.youtube-nocookie.com/embed/'+movie_id : movie+=""; 284 285 (getParam('rel',pp_images[set_position])) ? movie+="?rel="+getParam('rel',pp_images[set_position]) : movie+="?rel=1"; 286 287 if(settings.autoplay) movie += "&autoplay=1"; 288 289 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); 290 break; 291 292 case 'vimeo': 293 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 294 295 movie_id = pp_images[set_position]; 296 var regExp = /http(s?):\/\/(www\.)?vimeo.com\/(\d+)/; 297 var match = movie_id.match(regExp); 298 299 movie = 'https://player.vimeo.com/video/'+ match[3]; 300 (getParam('p_hash',pp_images[set_position])) ? movie+="?h="+getParam('p_hash',pp_images[set_position]) : movie+=""; 301 (getParam('p_hash',pp_images[set_position])) ? movie+="&title=0" : movie+="?title=0"; 302 movie += "&byline=0&portrait=0"; 303 if(settings.autoplay) movie += "&autoplay=1"; 304 305 vimeo_width = pp_dimensions['width']; 306 307 toInject = settings.iframe_markup.replace(/{width}/g,vimeo_width).replace(/{height}/g,pp_dimensions['height']).replace(/{path}/g,movie); 308 break; 309 310 case 'quicktime': 311 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 312 pp_dimensions['height']+=15; pp_dimensions['contentHeight']+=15; pp_dimensions['containerHeight']+=15; // Add space for the control bar 313 314 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); 315 break; 316 317 case 'flash': 318 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 319 320 flash_vars = pp_images[set_position]; 321 flash_vars = flash_vars.substring(pp_images[set_position].indexOf('flashvars') + 10,pp_images[set_position].length); 322 323 filename = pp_images[set_position]; 324 filename = filename.substring(0,filename.indexOf('?')); 325 326 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); 327 break; 328 329 case 'iframe': 330 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 331 332 frame_url = pp_images[set_position]; 333 frame_url = frame_url.substr(0,frame_url.indexOf('iframe')-1); 334 335 toInject = settings.iframe_markup.replace(/{width}/g,pp_dimensions['width']).replace(/{height}/g,pp_dimensions['height']).replace(/{path}/g,frame_url); 336 break; 337 338 case 'ajax': 339 doresize = false; // Make sure the dimensions are not resized. 340 pp_dimensions = _fitToViewport(movie_width,movie_height); 341 doresize = true; // Reset the dimensions 342 343 skipInjection = true; 344 $.get(pp_images[set_position],function(responseHTML){ 345 toInject = settings.inline_markup.replace(/{content}/g,responseHTML); 346 $pp_pic_holder.find('#pp_full_res')[0].innerHTML = toInject; 347 _showContent(); 348 }); 349 350 break; 351 352 case 'custom': 353 pp_dimensions = _fitToViewport(movie_width,movie_height); // Fit item to viewport 354 355 toInject = settings.custom_markup; 356 break; 357 358 case 'inline': 359 // to get the item height clone it, apply default width, wrap it in the prettyPhoto containers , then delete 360 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(); 361 doresize = false; // Make sure the dimensions are not resized. 362 pp_dimensions = _fitToViewport($(myClone).width(),$(myClone).height()); 363 doresize = true; // Reset the dimensions 364 $(myClone).remove(); 365 toInject = settings.inline_markup.replace(/{content}/g,$(pp_images[set_position]).html()); 366 break; 367 }; 368 369 if(!imgPreloader && !skipInjection){ 370 $pp_pic_holder.find('#pp_full_res')[0].innerHTML = toInject; 371 372 // Show content 373 _showContent(); 374 }; 375 }); 376 377 return false;
378 }; 379 380 381 /** 382 * Change page in the prettyPhoto modal box 383 * @param direction {String} Direction of the paging, previous or next. 384 */ 385 $.prettyPhoto.changePage = function(direction){ 386 currentGalleryPage = 0; 387 388 if(direction == 'previous') { 389 set_position--; 390 if (set_position < 0) set_position = $(pp_images).length-1; 391 }else if(direction == 'next'){ 392 set_position++; 393 if(set_position > $(pp_images).length-1) set_position = 0; 394 }else{ 395 set_position=direction; 396 }; 397 398 rel_index = set_position; 399 400 if(!doresize) doresize = true; // Allow the resizing of the images 401 if(settings.allow_expand) { 402 $('.pp_contract').removeClass('pp_contract').addClass('pp_expand'); 403 } 404 405 _hideContent(function(){ $.prettyPhoto.open(); }); 406 }; 407 408 409 /** 410 * Change gallery page in the prettyPhoto modal box 411 * @param direction {String} Direction of the paging, previous or next. 412 */ 413 $.prettyPhoto.changeGalleryPage = function(direction){ 414 if(direction=='next'){ 415 currentGalleryPage ++; 416 417 if(currentGalleryPage > totalPage) currentGalleryPage = 0; 418 }else if(direction=='previous'){ 419 currentGalleryPage --; 420 421 if(currentGalleryPage < 0) currentGalleryPage = totalPage; 422 }else{ 423 currentGalleryPage = direction; 424 }; 425 426 slide_speed = (direction == 'next' || direction == 'previous') ? settings.animation_speed : 0; 427 428 slide_to = currentGalleryPage * (itemsPerPage * itemWidth); 429 430 $pp_gallery.find('ul').animate({left:-slide_to},slide_speed); 431 }; 432 433 434 /** 435 * Start the slideshow... 436 */ 437 $.prettyPhoto.startSlideshow = function(){ 438 if(typeof pp_slideshow == 'undefined'){ 439 $pp_pic_holder.find('.pp_play').unbind('click').removeClass('pp_play').addClass('pp_pause').click(function(){ 440 $.prettyPhoto.stopSlideshow(); 441 return false; 442 }); 443 pp_slideshow = setInterval($.prettyPhoto.startSlideshow,settings.slideshow); 444 }else{ 445 $.prettyPhoto.changePage('next'); 446 }; 447 } 448 449 450 /** 451 * Stop the slideshow... 452 */ 453 $.prettyPhoto.stopSlideshow = function(){ 454 $pp_pic_holder.find('.pp_pause').unbind('click').removeClass('pp_pause').addClass('pp_play').click(function(){ 455 $.prettyPhoto.startSlideshow(); 456 return false; 457 }); 458 clearInterval(pp_slideshow); 459 pp_slideshow=undefined; 460 } 461 462 463 /** 464 * Closes prettyPhoto. 465 */ 466 $.prettyPhoto.close = function(){ 467 if($pp_overlay.is(":animated")) return; 468 469 $.prettyPhoto.stopSlideshow(); 470 471 $pp_pic_holder.stop().find('object,embed').css('visibility','hidden'); 472 473 $('div.pp_pic_holder,div.ppt,.pp_fade').fadeOut(settings.animation_speed,function(){ $(this).remove(); }); 474 475 $pp_overlay.fadeOut(settings.animation_speed, function(){ 476 477 if(settings.hideflash) $('object,embed,iframe[src*=youtube],iframe[src*=vimeo]').css('visibility','visible'); // Show the flash 478 479 $(this).remove(); // No more need for the prettyPhoto markup 480 481 $(window).unbind('scroll.prettyphoto'); 482 483 clearHashtag(); 484 485 settings.callback(); 486 487 doresize = true; 488 489 pp_open = false; 490 491 delete settings; 492 }); 493 }; 494 495 /** 496 * Set the proper sizes on the containers and animate the content in. 497 */ 498 function _showContent(){ 499 $('.pp_loaderIcon').hide(); 500 501 // Calculate the opened top position of the pic holder 502 projectedTop = scroll_pos['scrollTop'] + ((windowHeight/2) - (pp_dimensions['containerHeight']/2)); 503 if(projectedTop < 0) projectedTop = 0; 504 505 $ppt.fadeTo(settings.animation_speed,1); 506 507 // Resize the content holder 508 $pp_pic_holder.find('.pp_content') 509 .animate({ 510 height:pp_dimensions['contentHeight'], 511 width:pp_dimensions['contentWidth'] 512 },settings.animation_speed); 513 514 // Resize picture the holder 515 $pp_pic_holder.animate({ 516 'top': projectedTop, 517 'left': ((windowWidth/2) - (pp_dimensions['containerWidth']/2) < 0) ? 0 : (windowWidth/2) - (pp_dimensions['containerWidth']/2), 518 width:pp_dimensions['containerWidth'] 519 },settings.animation_speed,function(){ 520 $pp_pic_holder.find('.pp_hoverContainer,#fullResImage').height(pp_dimensions['height']).width(pp_dimensions['width']); 521 522 $pp_pic_holder.find('.pp_fade').fadeIn(settings.animation_speed); // Fade the new content 523 524 // Show the nav 525 if(isSet && _getFileType(pp_images[set_position])=="image") { $pp_pic_holder.find('.pp_hoverContainer').show(); }else{ $pp_pic_holder.find('.pp_hoverContainer').hide(); } 526 527 if(settings.allow_expand) { 528 if(pp_dimensions['resized']){ // Fade the resizing link if the image is resized 529 $('a.pp_expand,a.pp_contract').show(); 530 }else{ 531 $('a.pp_expand').hide(); 532 } 533 } 534 535 if(settings.autoplay_slideshow && !pp_slideshow && !pp_open) $.prettyPhoto.startSlideshow(); 536 537 settings.changepicturecallback(); // Callback! 538 539 pp_open = true; 540 }); 541 542 _insert_gallery(); 543 pp_settings.ajaxcallback(); 544 }; 545
546 /** 547 * Hide the content...DUH! 548 */ 549 function _hideContent(callback){ 550 // Fade out the current picture 551 $pp_pic_holder.find('#pp_full_res object,#pp_full_res embed').css('visibility','hidden'); 552 $pp_pic_holder.find('.pp_fade').fadeOut(settings.animation_speed,function(){ 553 $('.pp_loaderIcon').show(); 554 555 callback(); 556 }); 557 }; 558 559 /** 560 * Check the item position in the gallery array, hide or show the navigation links 561 * @param setCount {integer} The total number of items in the set 562 */ 563 function _checkPosition(setCount){ 564 (setCount > 1) ? $('.pp_nav').show() : $('.pp_nav').hide(); // Hide the bottom nav if it's not a set. 565 }; 566 567 /** 568 * Resize the item dimensions if it's bigger than the viewport 569 * @param width {integer} Width of the item to be opened 570 * @param height {integer} Height of the item to be opened 571 * @return An array containin the "fitted" dimensions 572 */ 573 function _fitToViewport(width,height){ 574 resized = false; 575 576 _getDimensions(width,height); 577 578 // Define them in case there's no resize needed 579 imageWidth = width, imageHeight = height; 580 581 if( ((pp_containerWidth > windowWidth) || (pp_containerHeight > windowHeight)) && doresize && settings.allow_resize && !percentBased) { 582 resized = true, fitting = false; 583 584 while (!fitting){ 585 if((pp_containerWidth > windowWidth)){ 586 imageWidth = (windowWidth - 200); 587 imageHeight = (height/width) * imageWidth; 588 }else if((pp_containerHeight > windowHeight)){ 589 imageHeight = (windowHeight - 200); 590 imageWidth = (width/height) * imageHeight; 591 }else{ 592 fitting = true; 593 }; 594 595 pp_containerHeight = imageHeight, pp_containerWidth = imageWidth; 596 }; 597 598 599 600 if((pp_containerWidth > windowWidth) || (pp_containerHeight > windowHeight)){ 601 _fitToViewport(pp_containerWidth,pp_containerHeight) 602 }; 603 604 _getDimensions(imageWidth,imageHeight); 605 }; 606 607 return { 608 width:Math.floor(imageWidth), 609 height:Math.floor(imageHeight), 610 containerHeight:Math.floor(pp_containerHeight), 611 containerWidth:Math.floor(pp_containerWidth) + (settings.horizontal_padding * 2), 612 contentHeight:Math.floor(pp_contentHeight), 613 contentWidth:Math.floor(pp_contentWidth), 614 resized:resized 615 }; 616 }; 617 618 /** 619 * Get the containers dimensions according to the item size 620 * @param width {integer} Width of the item to be opened 621 * @param height {integer} Height of the item to be opened 622 */ 623 function _getDimensions(width,height){ 624 width = parseFloat(width); 625 height = parseFloat(height); 626 627 // Get the details height, to do so, I need to clone it since it's invisible 628 $pp_details = $pp_pic_holder.find('.pp_details'); 629 $pp_details.width(width); 630 detailsHeight = parseFloat($pp_details.css('marginTop')) + parseFloat($pp_details.css('marginBottom')); 631 632 $pp_details = $pp_details.clone().addClass(settings.theme).width(width).appendTo($('body')).css({ 633 'position':'absolute', 634 'top':-10000 635 }); 636 detailsHeight += $pp_details.height(); 637 detailsHeight = (detailsHeight <= 34) ? 36 : detailsHeight; // Min-height for the details 638 $pp_details.remove(); 639 640 // Get the titles height, to do so, I need to clone it since it's invisible 641 $pp_title = $pp_pic_holder.find('.ppt'); 642 $pp_title.width(width); 643 titleHeight = parseFloat($pp_title.css('marginTop')) + parseFloat($pp_title.css('marginBottom')); 644 $pp_title = $pp_title.clone().appendTo($('body')).css({ 645 'position':'absolute', 646 'top':-10000 647 }); 648 titleHeight += $pp_title.height(); 649 $pp_title.remove(); 650 651 // Get the container size, to resize the holder to the right dimensions 652 pp_contentHeight = height + detailsHeight; 653 pp_contentWidth = width; 654 pp_containerHeight = pp_contentHeight + titleHeight + $pp_pic_holder.find('.pp_top').height() + $pp_pic_holder.find('.pp_bottom').height(); 655 pp_containerWidth = width; 656 } 657 658 function _getFileType(itemSrc){ 659 if (itemSrc.match(/youtube\.com\/watch/i) || itemSrc.match(/youtu\.be/i)) { 660 return 'youtube'; 661 }else if (itemSrc.match(/vimeo\.com/i)) { 662 return 'vimeo'; 663 }else if(itemSrc.match(/\b.mov\b/i)){ 664 return 'quicktime'; 665 }else if(itemSrc.match(/\b.swf\b/i)){ 666 return 'flash'; 667 }else if(itemSrc.match(/\biframe=true\b/i)){ 668 return 'iframe'; 669 }else if(itemSrc.match(/\bajax=true\b/i)){ 670 return 'ajax'; 671 }else if(itemSrc.match(/\bcustom=true\b/i)){ 672 return 'custom'; 673 }else if(itemSrc.substr(0,1) == '#'){ 674 return 'inline'; 675 }else{ 676 return 'image'; 677 }; 678 }; 679 680 function _center_overlay(){ 681 if(doresize && typeof $pp_pic_holder != 'undefined') { 682 scroll_pos = _get_scroll(); 683 contentHeight = $pp_pic_holder.height(), contentwidth = $pp_pic_holder.width(); 684 685 projectedTop = (windowHeight/2) + scroll_pos['scrollTop'] - (contentHeight/2); 686 if(projectedTop < 0) projectedTop = 0; 687 688 if(contentHeight > windowHeight) 689 return; 690 691 $pp_pic_holder.css({ 692 'top': projectedTop, 693 'left': (windowWidth/2) + scroll_pos['scrollLeft'] - (contentwidth/2) 694 }); 695 }; 696 }; 697 698 function _get_scroll(){ 699 if (self.pageYOffset) { 700 return {scrollTop:self.pageYOffset,scrollLeft:self.pageXOffset}; 701 } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict 702 return {scrollTop:document.documentElement.scrollTop,scrollLeft:document.documentElement.scrollLeft}; 703 } else if (document.body) {// all other Explorers 704 return {scrollTop:document.body.scrollTop,scrollLeft:document.body.scrollLeft}; 705 }; 706 }; 707 708 function _resize_overlay() { 709 windowHeight = $(window).height(), windowWidth = $(window).width(); 710 711 if(typeof $pp_overlay != "undefined") $pp_overlay.height($(document).height()).width(windowWidth); 712 }; 713 714 function _insert_gallery(){ 715 if(isSet && settings.overlay_gallery && _getFileType(pp_images[set_position])=="image") { 716 itemWidth = 52+5; // 52 beign the thumb width, 5 being the right margin. 717 navWidth = (settings.theme == "facebook" || settings.theme == "pp_default") ? 50 : 30; // Define the arrow width depending on the theme 718 719 itemsPerPage = Math.floor((pp_dimensions['containerWidth'] - 100 - navWidth) / itemWidth); 720 itemsPerPage = (itemsPerPage < pp_images.length) ? itemsPerPage : pp_images.length;
721 totalPage = Math.ceil(pp_images.length / itemsPerPage) - 1; 722 723 // Hide the nav in the case there's no need for links 724 if(totalPage == 0){ 725 navWidth = 0; // No nav means no width! 726 $pp_gallery.find('.pp_arrow_next,.pp_arrow_previous').hide(); 727 }else{ 728 $pp_gallery.find('.pp_arrow_next,.pp_arrow_previous').show(); 729 }; 730 731 galleryWidth = itemsPerPage * itemWidth; 732 fullGalleryWidth = pp_images.length * itemWidth; 733 734 // Set the proper width to the gallery items 735 $pp_gallery 736 .css('margin-left',-((galleryWidth/2) + (navWidth/2))) 737 .find('div:first').width(galleryWidth+5) 738 .find('ul').width(fullGalleryWidth) 739 .find('li.selected').removeClass('selected'); 740 741 goToPage = (Math.floor(set_position/itemsPerPage) < totalPage) ? Math.floor(set_position/itemsPerPage) : totalPage; 742 743 $.prettyPhoto.changeGalleryPage(goToPage); 744 745 $pp_gallery_li.filter(':eq('+set_position+')').addClass('selected'); 746 }else{ 747 $pp_pic_holder.find('.pp_content').unbind('mouseenter mouseleave'); 748 // $pp_gallery.hide(); 749 } 750 } 751 752 function _build_overlay(caller){ 753 // Inject Social Tool markup into General markup 754 if(settings.social_tools) 755 facebook_like_link = settings.social_tools.replace('{location_href}', encodeURIComponent(location.href)); 756 757 settings.markup = settings.markup.replace('{pp_social}',''); 758 759 $('body').append(settings.markup); // Inject the markup 760 761 $pp_pic_holder = $('.pp_pic_holder') , $ppt = $('.ppt'), $pp_overlay
761= $('div.pp_overlay'); // Set my global selectors 762 763 // Inject the inline gallery! 764 if(isSet && settings.overlay_gallery) { 765 currentGalleryPage = 0; 766 toInject = ""; 767 for (var i=0; i < pp_images.length; i++) { 768 if(!pp_images[i].match(/\b(jpg|jpeg|png|gif)\b/gi)){ 769 classname = 'default'; 770 img_src = ''; 771 }else{ 772 classname = ''; 773 img_src = pp_images[i]; 774 } 775 toInject += "<li class='"+classname+"'><a href='#'><img src='" + img_src + "' width='50' alt='' /></a></li>"; 776 }; 777 778 toInject = settings.gallery_markup.replace(/{gallery}/g,toInject); 779 780 $pp_pic_holder.find('#pp_full_res').after(toInject); 781 782 $pp_gallery = $('.pp_pic_holder .pp_gallery'), $pp_gallery_li = $pp_gallery.find('li'); // Set the gallery selectors 783 784 $pp_gallery.find('.pp_arrow_next').click(function(){ 785 $.prettyPhoto.changeGalleryPage('next'); 786 $.prettyPhoto.stopSlideshow(); 787 return false; 788 }); 789 790 $pp_gallery.find('.pp_arrow_previous').click(function(){ 791 $.prettyPhoto.changeGalleryPage('previous'); 792 $.prettyPhoto.stopSlideshow(); 793 return false; 794 }); 795 796 $pp_pic_holder.find('.pp_content').hover( 797 function(){ 798 $pp_pic_holder.find('.pp_gallery:not(.disabled)').fadeIn(); 799 }, 800 function(){ 801 $pp_pic_holder.find('.pp_gallery:not(.disabled)').fadeOut(); 802 }); 803 804 itemWidth = 52+5; // 52 beign the thumb width, 5 being the right margin. 805 $pp_gallery_li.each(function(i){ 806 $(this) 807 .find('a') 808 .click(function(){ 809 $.prettyPhoto.changePage(i); 810 $.prettyPhoto.stopSlideshow(); 811 return false; 812 }); 813 }); 814 }; 815 816 817 // Inject the play/pause if it's a slideshow 818 if(settings.slideshow){ 819 $pp_pic_holder.find('.pp_nav').prepend('<a href="#" class="pp_play">Play</a>') 820 $pp_pic_holder.find('.pp_nav .pp_play').click(function(){ 821 $.prettyPhoto.startSlideshow(); 822 return false; 823 }); 824 } 825 826 $pp_pic_holder.attr('class','pp_pic_holder ' + settings.theme); // Set the proper theme 827 828 $pp_overlay 829 .css({ 830 'opacity':0, 831 'height':$(document).height(), 832 'width':$(window).width() 833 }) 834 .bind('click',function(){ 835 if(!settings.modal) $.prettyPhoto.close(); 836 }); 837 838 $('a.pp_close').bind('click',function(){ $.prettyPhoto.close(); return false; }); 839 840 841 if(settings.allow_expand) { 842 $('a.pp_expand').bind('click',function(e){ 843 // Expand the image 844 if($(this).hasClass('pp_expand')){ 845 $(this).removeClass('pp_expand').addClass('pp_contract'); 846 doresize = false; 847 }else{ 848 $(this).removeClass('pp_contract').addClass('pp_expand'); 849 doresize = true; 850 }; 851 852 _hideContent(function(){ $.prettyPhoto.open(); }); 853 854 return false; 855 }); 856 } 857 858 $pp_pic_holder.find('.pp_previous, .pp_nav .pp_arrow_previous').bind('click',function(){ 859 $.prettyPhoto.changePage('previous'); 860 $.prettyPhoto.stopSlideshow(); 861 return false; 862 }); 863 864 $pp_pic_holder.find('.pp_next, .pp_nav .pp_arrow_next').bind('click',function(){ 865 $.prettyPhoto.changePage('next'); 866 $.prettyPhoto.stopSlideshow(); 867 return false; 868 }); 869 870 _center_overlay(); // Center it 871 }; 872 873 if(!pp_alreadyInitialized && getHashtag()){ 874 pp_alreadyInitialized = true; 875 876 // Grab the rel index to trigger the click on the correct element 877 hashIndex = getHashtag(); 878 hashRel = hashIndex; 879 hashIndex = hashIndex.substring(hashIndex.indexOf('/')+1,hashIndex.length-1); 880 hashRel = hashRel.substring(0,hashRel.indexOf('/')); 881 882 // Little timeout to make sure all the prettyPhoto initialize scripts has been run. 883 // Useful in the event the page contain several init scripts. 884 setTimeout(function(){ $("a["+pp_settings.hook+"^='"+hashRel+"']:eq("+hashIndex+")").trigger('click'); },50); 885 } 886 887 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 888 }; 889 890 function getHashtag(){ 891 var url = location.href; 892 hashtag = (url.indexOf('#prettyPhoto') !== -1) ? decodeURI(url.substring(url.indexOf('#prettyPhoto')+1,url.length)) : false;
893 if(hashtag){ hashtag = hashtag.replace(/<|>/g,''); } 894 return hashtag; 895 }; 896 897 function setHashtag(){ 898 if(typeof theRel == 'undefined') return; // theRel is set on normal calls, it's impossible to deeplink using the API 899 location.hash = theRel + '/'+rel_index+'/'; 900 }; 901 902 function clearHashtag(){ 903 if ( location.href.indexOf('#prettyPhoto') !== -1 ) location.hash = "prettyPhoto"; 904 } 905 906 function getParam(name,url){ 907 name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]"); 908 var regexS = "[\\?&]"+name+"=([^&#]*)"; 909 var regex = new RegExp( regexS ); 910 var results = regex.exec( url ); 911 return ( results == null ) ? "" : results[1]; 912 } 913 914})(jQuery); 915 916var 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.