1var scr = document.getElementsByTagName('script'); 2var zoombox_path = scr[scr.length - 1].getAttribute("src").replace('zoombox.js', ''); 3 4(function ($) { 5 6 var options = { 7 theme: 'zoombox', //available themes : zoombox,lightbox, prettyphoto, darkprettyphoto, simple 8 opacity: 0.8, // Black overlay opacity 9 duration: 800, // Animation duration 10 animation: true, // Do we have to animate the box ? 11 width: 600, // Default width 12 height: 400, // Default height 13 gallery: true, // Allow gallery thumb view 14 autoplay: false, // Autoplay for video 15 overflow: false // Allow images bigger than screen ? 16 } 17 var images; // Gallery Array [gallery name][link] 18 var elem; // HTML element currently used to display box 19 var isOpen = false; // Zoombox already opened ? 20 var link; // Shortcut for the link 21 var width; 22 var height; 23 var timer; // Timing for img loading 24 var i = 0; // iteration variable 25 var content; // The content of the box 26 var type = 'multimedia'; // Content type 27 var position = false; 28 var imageset = false; 29 var state = 'closed'; 30 31 /** 32 * You can edit the html code generated by zoombox for specific reasons. 33 * */ 34 var html = '<div id="zoombox"> \ 35 <div class="zoombox_mask"></div>\ 36 <div class="zoombox_container">\ 37 <div class="zoombox_content"></div>\ 38 <div class="zoombox_title"></div>\ 39 <div class="zoombox_next"></div>\ 40 <div class="zoombox_prev"></div>\ 41 <div class="zoombox_close"></div>\ 42 </div>\ 43 <div class="zoombox_gallery"></div>\ 44 </div>'; 45// Regular expressions needed for the content 46 var filtreImg = /(\.jpg)|(\.jpeg)|(\.bmp)|(\.gif)|(\.png)/i; 47 var filtreMP3 = /(\.mp3)/i; 48 var filtreFLV = /(\.flv)/i; 49 var filtreSWF = /(\.swf)/i; 50 var filtreQuicktime = /(\.mov)|(\.mp4)/i; 51 var filtreWMV = /(\.wmv)|(\.avi)/i; 52 var filtreDailymotion = /(http:\/\/www.dailymotion)|(http:\/\/dailymotion)/i; 53 var filtreVimeo = /(http:\/\/www.vimeo)|(http:\/\/vimeo)/i; 54 var filtreYoutube = /(youtube\.)/i; 55 var filtreKoreus = /(http:\/\/www\.koreus)|(http:\/\/koreus)/i; 56 var galleryLoaded = 0; 57 58 $.zoombox = function (el, options) { 59 60 } 61 $.zoombox.options = options; 62 $.zoombox.close = function () { 63 close(); 64 } 65 $.zoombox.open = function (tmplink, opts) { 66 elem = null; 67 link = tmplink; 68 options = $.extend({}, $.zoombox.options, opts); 69 load(); 70 } 71 $.zoombox.html = function (cont, opts) { 72 content = cont; 73 options = $.extend({}, $.zoombox.options, opts); 74 width = options.width; 75 height = options.height; 76 elem = null; 77 open(); 78 } 79 $.fn.zoombox = function (opts) { 80 81 images = new Array(); // allow multiple call on one page, for content loaded from ajax 82 83 /** 84 * Bind the behaviour on every Elements 85 */ 86 return this.each(function () { 87 // No zoombox for IE6 88 if ($.browser && $.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest) { 89 return false; 90 } 91 var obj = this; 92 var galleryRegExp = /zgallery([0-9]+)/; 93 var skipRegExp = /zskip/; 94 var gallery = galleryRegExp.exec($(this).attr("class")); 95 var skip = skipRegExp.exec($(this).attr("class")); 96 var tmpimageset = false; 97 if (gallery != null) { 98 if (!images[gallery[1]]) { 99 images[gallery[1]] = new Array(); 100 } 101 if (skip == null) { 102 images[gallery[1]].push($(this)); 103 } 104 var pos = images[gallery[1]].length - 1; 105 tmpimageset = images[gallery[1]]; 106 } 107 $(this).unbind('click').click(function () { 108 options = $.extend({}, $.zoombox.options, opts); 109 if (state != 'closed') 110 return false; 111 if (skip != null) { 112 if (pos < images[gallery[1]].length - 1) { 113 elem = images[gallery[1]][pos + 1]; 114 } 115 } else { 116 elem = $(obj); 117 } 118 imageset = tmpimageset; 119 link = elem.attr('href'); 120 position = pos; 121 load(); 122 return false; 123 }); 124 }); 125 } 126 127 /** 128 * Load the content (with or without loader) and call open() 129 * */ 130 function load() { 131 if (state == 'closed') 132 isOpen = false; 133 state = 'load'; 134 setDim(); 135 if (filtreImg.test(link)) { 136 img = new Image(); 137 img.src = link; 138 $("body").append('<div id="zoombox_loader"></div>'); 139 $("#zoombox_loader").css("marginTop", scrollY()); 140 timer = window.setInterval(function () { 141 loadImg(img); 142 }, 100); 143 } else { 144 setContent(); 145 open(); 146 } 147 } 148 149 /** 150 * Build the HTML Structure of the box 151 * */ 152 function build() { 153 // We add the HTML Code on our page 154 $('body').append(html); 155 $(window).keydown(function (event) { 156 shortcut(event.which); 157 }); 158 $(window).resize(function () { 159 resize(); 160 }); 161 $('#zoombox .zoombox_mask').hide(); 162 // We add a specific class to define the box theme 163 $('#zoombox').addClass(options.theme); 164 // We bind the close behaviour (click on the mask / click on the close button) 165 $('#zoombox .zoombox_mask,.zoombox_close').click(function () { 166 close(); 167 return false; 168 }); 169 // Next/Prev button 170 if (imageset == false) { 171 $('#zoombox .zoombox_next,#zoombox .zoombox_prev').remove(); 172 } else { 173 $('#zoombox .zoombox_next').click(function () { 174 next(); 175 }); 176 $('#zoombox .zoombox_prev').click(function () { 177 prev(); 178 }); 179 } 180 } 181 182 /**
183 * Gallery System (with slider if too much images) 184 */ 185 function gallery() { 186 var loaded = 0; 187 var width = 0; 188 var contentWidth = 0; 189 if (options.gallery) { 190 if (imageset === false) { 191 $('#zoombox .zoombox_gallery').remove(); 192 return false; 193 } 194 for (var i in imageset) { 195 var imgSrc = zoombox_path + 'img/video.png'; 196 var img = $('<img src="' + imgSrc + '" class="video gallery' + (i * 1) + '"/>'); 197 if (filtreImg.test(imageset[i].attr('href'))) { 198 imgSrc = imageset[i].attr('href') 199 img = $('<img src="' + imgSrc + '" class="gallery' + (i * 1) + '"/>'); 200 } 201 img.data('id', i).appendTo('#zoombox .zoombox_gallery') 202 img.click(function () { 203 gotoSlide($(this).data('id')); 204 $('#zoombox .zoombox_gallery img').removeClass('current'); 205 $(this).addClass('current'); 206 }); 207 if (i == position) { 208 img.addClass('current'); 209 } 210 211 // Listen the loading of Images 212 $("<img/>").data('img', img).attr("src", imgSrc).load(function () { 213 loaded++; 214 var img = $(this).data('img'); 215 img.width(Math.round(img.height() * this.width / this.height)); 216 if (loaded == $('#zoombox .zoombox_gallery img').length) { 217 var width = 0; 218 $('#zoombox .zoombox_gallery img').each(function () { 219 width += $(this).outerWidth(); 220 $(this).data('left', width); 221 }); 222 var div = $('<div>').css({ 223 position: 'absolute', 224 top: 0, 225 left: 0, 226 width: width 227 }); 228 $('#zoombox .zoombox_gallery').wrapInner(div); 229 contentWidth = $('#zoombox .zoombox_gallery').width(); 230 $('#zoombox').trigger('change'); 231 } 232 }); 233 } 234 $('#zoombox .zoombox_gallery').show().animate({bottom: 0}, options.duration); 235 } 236 237 $('#zoombox').bind('change', function (e, css) { 238 if ($('#zoombox .zoombox_gallery div').width() < $('#zoombox .zoombox_gallery').width) { 239 return true; 240 } 241 var d = 0; 242 var center = 0; 243 if (css != null) { 244 d = options.duration; 245 center = css.width / 2; 246 } else { 247 center = $('#zoombox .zoombox_gallery').width() / 2; 248 } 249 var decal = -$('#zoombox .zoombox_gallery img.current').data('left') + $('#zoombox .zoombox_gallery img.current').width() / 2; 250 var left = decal + center; 251 if (left < center * 2 - $('#zoombox .zoombox_gallery div').width()) { 252 left = center * 2 - $('#zoombox .zoombox_gallery div').width(); 253 } 254 if (left > 0) { 255 left = 0; 256 } 257 $('#zoombox .zoombox_gallery div').animate({left: left}, d); 258 }); 259 260 } 261 262 263 /** 264 * Open the box 265 **/ 266 function open() { 267 if (isOpen == false) 268 build(); 269 else 270 $('#zoombox .zoombox_title').empty(); 271 $('#zoombox .close').hide(); 272 $('#zoombox .zoombox_container').removeClass('multimedia').removeClass('img').addClass(type); 273 274 // We add a title if we find one on the link 275 if (elem != null && elem.attr('title')) { 276 $('#zoombox .zoombox_title').append(elem.attr('title')); 277 } 278 279 280 281 // And after... Animation or not depending of preferences 282 // We empty the content 283 $('#zoombox .zoombox_content').empty(); 284 // If it's an image we load the content now (to get a good animation) 285 if (type == 'img' && isOpen == false && options.animation == true) { 286 $('#zoombox .zoombox_content').append(content); 287 } 288 // Default position/size of the box to make the "zoom effect" 289 if (elem != null && elem.find('img').length != 0 && isOpen == false) { 290 var min = elem.find('img'); 291 $('#zoombox .zoombox_container').css({ 292 width: min.width(), 293 height: min.height(), 294 top: min.offset().top, 295 left: min.offset().left, 296 opacity: 0, 297 marginTop: min.css('marginTop') 298 }); 299 } else if (elem != null && isOpen == false) { 300 $('#zoombox .zoombox_container').css({ 301 width: elem.width(), 302 height: elem.height(), 303 top: elem.offset().top, 304 left: elem.offset().left 305 }); 306 } else if (isOpen == false) { 307 $('#zoombox .zoombox_container').css({ 308 width: 100, 309 height: 100, 310 top: windowH() / 2 - 50, 311 left: windowW() / 2 - 50 312 }) 313 } 314 // Final position/size of the box after the animation 315 var css = { 316 width: width, 317 height: height, 318 left: (windowW() - width) / 2, 319 top: (windowH() - height) / 2, 320 marginTop: scrollY(), 321 opacity: 1 322 }; 323 324 // Trigger the change event 325 $('#zoombox').trigger('change', css); 326 327 // Do we animate or not ? 328 if (options.animation == true) { 329 $('#zoombox .zoombox_title').hide(); 330 $('#zoombox .zoombox_close').hide(); 331 $('#zoombox .zoombox_container').animate(css, options.duration, function () { 332 if (type == 'multimedia' || isOpen == true) { 333 $('#zoombox .zoombox_content').append(content); 334 } 335 if (type == 'image' || isOpen == true) { 336 $('#zoombox .zoombox_content img').css('opacity', 0).fadeTo(300, 1); 337 } 338 $('#zoombox .zoombox_title').fadeIn(300); 339 $('#zoombox .zoombox_close').fadeIn(300); 340 state = 'opened'; 341 if (!isOpen) { 342 gallery(); 343 } 344 isOpen = true; 345 }); 346 $('#zoombox .zoombox_mask').fadeTo(200, options.opacity); 347 } else { 348 $('#zoombox .zoombox_content').append(content); 349 $('#zoombox .zoombox_close').show(); 350 $('#zoombox .zoombox_gallery').show(); 351 $('#zoombox .zoombox_container').css(css); 352 $('#zoombox .zoombox_mask').show(); 353 $('#zoombox .zoombox_mask').css('opacity', options.opacity); 354 if (!isOpen) { 355 gallery(); 356 } 357 isOpen = true; 358 state = 'opened'; 359 } 360 } 361 /** 362 * Close the box 363 * **/ 364 function close() { 365 state = 'closing'; 366 window.clearInterval(timer); 367 $(window).unbind('keydown'); 368 $(window).unbind('resize'); 369 if (type == 'multimedia') { 370 $('#zoombox .zoombox_container').empty(); 371 } 372 var css = {}; 373 if (elem != null && elem.find('img').length > 0) { 374 var min = elem.find('img'); 375 css = { 376 width: min.width(), 377 height: min.height(), 378 top: min.offset().top, 379 left: min.offset().left, 380 opacity: 0, 381 marginTop: min.css('marginTop') 382 }; 383 } else if (elem != null) { 384 css = { 385 width: elem.width(), 386 height: elem.height(), 387 top: elem.offset().top, 388 left: elem.offset().left, 389 marginTop: 0, 390 opacity: 0 391 }; 392 } else { 393 css = { 394 width: 100, 395 height: 100, 396 top: windowH() / 2 - 50, 397 left: windowW() / 2 - 50, 398 opacity: 0 399 }; 400 } 401 if (options.animation == true) { 402 $('#zoombox .zoombox_mask').fadeOut(200); 403 $('#zoombox .zoombox_gallery').animate({bottom: -$('#zoombox .zoombox_gallery').innerHeight()}, options.duration); 404 $('#zoombox .zoombox_container').animate(css, options.duration, function () { 405 $('#zoombox').remove(); 406 state = 'closed'; 407 isOpen = false; 408 }); 409 } else { 410 $('#zoombox').remove(); 411 state = 'closed'; 412 isOpen = false; 413 } 414 } 415 416 /** 417 * Set the HTML Content of the box 418 * */ 419 function setContent() { 420 // Overtflow 421 if (options.overflow == false) { 422 if (width * 1 + 50 > windowW()) { 423 height = (windowW() - 50) * height / width; 424 width = windowW() - 50; 425 } 426 if (height * 1 + 50 > windowH()) { 427 width = (windowH() - 50) * width / height; 428 height = windowH() - 50; 429 } 430 } 431 var url = link; 432 type = 'multimedia'; 433 if (filtreImg.test(url)) { 434 type = 'img'; 435 content = '<img src="' + link + '" width="100%" height="100%"/>'; 436 } else if (filtreMP3.test(url)) { 437 width = 300; 438 height = 40; 439 content = '<object type="application/x-shockwave-flash" data="' + MP3Player + '?son=' + url + '" width="' + width + '" height="' + height + '">'; 440 content += '<param name="movie" value="' + MP3Player + '?son=' + url + '" /></object>'; 441 } else if (filtreFLV.test(url)) { 442 var autostart = 0; 443 if (options.autoplay == true) { 444 autostart = 1; 445 } 446 content = '<object type="application/x-shockwave-flash" data="' + zoombox_path + 'FLVplayer.swf" width="' + width + '" height="' + height + '">\ 447<param name="allowFullScreen" value="true">\ 448<param name="scale" value="noscale">\ 449<param name="wmode" value="transparent">\ 450<param name="flashvars" value="flv=' + url + '&autoplay=' + autostart + '">\ 451<embed src="' + zoombox_path + 'FLVplayer.swf" width="' + width + '" height="' + height + '" allowscriptaccess="always" allowfullscreen="true" flashvars="flv=' + url + '" wmode="transparent" />\ 452</object>'; 453 } else if (filtreSWF.test(url)) { 454 content = '<object width="' + width + '" height="' + height + '"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="' + url + '" /><embed src="' + url + '" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="' + width + '" height="' + height + '" wmode="transparent"></embed></object>'; 455 } else if (filtreQuicktime.test(url)) { 456 content = '<embed src="' + url + '" width="' + width + '" height="' + height + '" controller="true" cache="true" autoplay="true"/>'; 457 // HTML5 Code 458 //content='<video controls src="'+url+'" width="'+width+'" height="'+height+'">Your browser does not support this format</video>' 459 } else if (filtreWMV.test(url)) { 460 content = '<embed src="' + url + '" width="' + width + '" height="' + height + '" controller="true" cache="true" autoplay="true" wmode="transparent" />'; 461 } else if (filtreDailymotion.test(url)) { 462 var id = url.split('_'); 463 id = id[0].split('/'); 464 id = id[id.length - 1] + '?'; 465 if (options.autoplay == true) { 466 id = id + 'autoPlay=1&'; 467 } 468 content = '<iframe frameborder="0" width="' + width + '" height="' + height + '" src="http://www.dailymotion.com/embed/video/' + id + '?wmode=transparent"></iframe>'; 469 } else if (filtreVimeo.test(url)) { 470 var id = url.split('/'); 471 id = id[3] + '?'; 472 if (options.autoplay == true) {
473 id = id + 'autoplay=1&'; 474 } 475 content = '<iframe src="http://player.vimeo.com/video/' + id + 'title=0&byline=0&portrait=0&wmode=transparent" width="' + width + '" height="' + height + '" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>' 476 } else if (filtreYoutube.test(url)) { 477 var id = url.split('watch?v='); 478 id = id[1].split('&'); 479 id = id[0] + '?'; 480 if (options.autoplay == true) { 481 id = id + 'autoplay=1&'; 482 } 483 content = '<iframe width="' + width + '" height="' + height + '" src="http://www.youtube.com/embed/' + id + 'wmode=Opaque" frameborder="0" allowfullscreen></iframe>'; 484 } else if (filtreKoreus.test(url)) { 485 url = url.split('.html'); 486 url = url[0]; 487 content = '<object type="application/x-shockwave-flash" data="' + url + '" width="' + width + '" height="' + height + '"><param name="movie" value="' + url + '"><embed src="' + url + '" type="application/x-shockwave-flash" width="' + width + '" height="' + height + '" wmode="transparent"></embed></object>'; 488 } else { 489 content = '<iframe src="' + url + '" width="' + width + '" height="' + height + '" border="0"></iframe>'; 490 } 491 return content; 492 } 493 /** 494 * Handle Image loading 495 **/ 496 function loadImg(img) { 497 if (img.complete) { 498 i = 0; 499 window.clearInterval(timer); 500 width = img.width; 501 height = img.height; 502 $('#zoombox_loader').remove(); 503 setContent(); 504 open(); 505 } 506 // On anim le loader 507 $('#zoombox_loader').css({'background-position': "0px " + i + "px"}); 508 i = i - 40; 509 if (i < (-440)) { 510 i = 0; 511 } 512 } 513
514 function gotoSlide(i) { 515 if (state != 'opened') { 516 return false; 517 } 518 if (imageset) { 519 position = i; 520 elem = imageset[position]; 521 link = elem.attr('href'); 522 if ($('#zoombox .zoombox_gallery img').length > 0) { 523 $('#zoombox .zoombox_gallery img').removeClass('current'); 524 $('#zoombox .zoombox_gallery img:eq(' + i + ')').addClass('current'); 525 } 526 load(); 527 } 528 return false; 529 } 530 531 function next() { 532 i = position + 1; 533 if (i > imageset.length - 1) { 534 i = 0; 535 } 536 gotoSlide(i); 537 } 538 539 function prev() { 540 i = position - 1; 541 if (i < 0) { 542 i = imageset.length - 1; 543 } 544 gotoSlide(i); 545 } 546 547 /** 548 * GENERAL FUNCTIONS 549 * */ 550 /** 551 * Resize 552 **/ 553 function resize() { 554 $('#zoombox .zoombox_container').css({ 555 top: (windowH() - $('#zoombox .zoombox_container').outerHeight(true)) / 2, 556 left: (windowW() - $('#zoombox .zoombox_container').outerWidth(true)) / 2 557 }); 558 } 559 /** 560 * Keyboard Shortcut 561 **/ 562 function shortcut(key) { 563 if (key == 37) { 564 prev(); 565 } 566 if (key == 39) { 567 next(); 568 } 569 if (key == 27) { 570 close(); 571 } 572 573 } 574 /** 575 * Parse Width/Height of a link and insert it in the width and height variables 576 * */ 577 function setDim() { 578 width = options.width; 579 height = options.height; 580 if (elem != null) { 581 var widthReg = /w([0-9]+)/; 582 var w = widthReg.exec(elem.attr("class")); 583 if (w != null) { 584 if (w[1]) { 585 width = w[1]; 586 } 587 } 588 var heightReg = /h([0-9]+)/; 589 var h = heightReg.exec(elem.attr("class")); 590 if (h != null) { 591 if (h[1]) { 592 height = h[1]; 593 } 594 } 595 } 596 return false; 597 } 598 /** 599 * Return the window height 600 * */ 601 function windowH() { 602 if (window.innerHeight) 603 return window.innerHeight; 604 else { 605 return $(window).height(); 606 } 607 } 608 609 /** 610 * Return the window width 611 * */ 612 function windowW() { 613 if (window.innerWidth) 614 return window.innerWidth; 615 else { 616 return $(window).width(); 617 } 618 } 619 620 /** 621 * Return the position of the top 622 * */ 623 function scrollY() { 624 scrOfY = 0; 625 if (typeof (window.pageYOffset) == 'number') { 626 //Netscape compliant 627 scrOfY = window.pageYOffset; 628 } else if (document.body && (document.body.scrollTop)) { 629 //DOM compliant 630 scrOfY = document.body.scrollTop; 631 } else if (document.documentElement && (document.documentElement.scrollTop)) { 632 //IE6 standards compliant mode 633 scrOfY = document.documentElement.scrollTop; 634 } 635 return scrOfY; 636 } 637 638 /** 639 * Return the position of the left scroll 640 * */ 641 function scrollX() { 642 scrOfX = 0; 643 if (typeof (window.pageXOffset) == 'number') { 644 //Netscape compliant 645 scrOfX = window.pageXOffset; 646 } else if (document.body && (document.body.scrollLeft)) { 647 //DOM compliant 648 scrOfX = document.body.scrollLeft; 649 } else if (document.documentElement && (document.documentElement.scrollLeft)) { 650 //IE6 standards compliant mode 651 scrOfX = document.documentElement.scrollLeft; 652 } 653 return scrOfX; 654 } 655 656})(jQuery);
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.