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