1/** 2 * File: md-slider.js 3 * Author: MegaDrupal 4 * Version: 2.0 5 * 6 * Control slide show with text, video, hotspot, image items 7 */ 8(function ($) { 9 var transitionEffects = [ 10 "slit-horizontal-left-top", 11 "slit-horizontal-top-right", 12 "slit-horizontal-bottom-up", 13 "slit-vertical-down", 14 "slit-vertical-up", 15 "strip-up-right", 16 "strip-up-left", 17 "strip-down-right", 18 "strip-down-left", 19 "strip-left-up", 20 "strip-left-down", 21 "strip-right-up", 22 "strip-right-down", 23 "strip-right-left-up", 24 "strip-right-left-down", 25 "strip-up-down-right", 26 "strip-up-down-left", 27 "left-curtain", 28 "right-curtain", 29 "top-curtain", 30 "bottom-curtain", 31 "slide-in-right", 32 "slide-in-left", 33 "slide-in-up", 34 "slide-in-down", 35 "fade" 36 ], 37 effectsIn = [ 38 "bounceIn", 39 "bounceInDown", 40 "bounceInUp", 41 "bounceInLeft", 42 "bounceInRight", 43 "fadeIn", 44 "fadeInUp", 45 "fadeInDown", 46 "fadeInLeft", 47 "fadeInRight", 48 "fadeInUpBig", 49 "fadeInDownBig", 50 "fadeInLeftBig", 51 "fadeInRightBig", 52 "flipInX", 53 "flipInY", 54 "foolishIn", 55 "lightSpeedIn", 56 "puffIn", 57 "rollIn", 58 "rotateIn", 59 "rotateInDownLeft", 60 "rotateInDownRight", 61 "rotateInUpLeft", 62 "rotateInUpRight", 63 "twisterInDown", 64 "twisterInUp", 65 "swap", 66 "swashIn", 67 "tinRightIn", 68 "tinLeftIn", 69 "tinUpIn", 70 "tinDownIn", 71 "vanishIn" 72 ], 73 effectsOut = [ 74 "bombRightOut", 75 "bombLeftOut", 76 "bounceOut", 77 "bounceOutDown", 78 "bounceOutUp", 79 "bounceOutLeft", 80 "bounceOutRight", 81 "fadeOut", 82 "fadeOutUp", 83 "fadeOutDown", 84 "fadeOutLeft", 85 "fadeOutRight", 86 "fadeOutUpBig", 87 "fadeOutDownBig", 88 "fadeOutLeftBig", 89 "fadeOutRightBig", 90 "flipOutX", 91 "flipOutY", 92 "foolishOut", 93 "hinge", 94 "holeOut", 95 "lightSpeedOut", 96 "puffOut", 97 "rollOut", 98 "rotateOut", 99 "rotateOutDownLeft", 100 "rotateOutDownRight", 101 "rotateOutUpLeft", 102 "rotateOutUpRight", 103 "rotateDown", 104 "rotateUp", 105 "rotateLeft", 106 "rotateRight", 107 "swashOut", 108 "tinRightOut", 109 "tinLeftOut", 110 "tinUpOut", 111 "tinDownOut", 112 "vanishOut" 113 ]; 114 var MDSlider = function ($element, options) { 115 var default_options = { 116 autoPlay: true, 117 loop: true, 118 width: 960, 119 height: 420, 120 responsive: true, 121 fullWidth: true, 122 pauseOnHover: true, 123 enableLoadingBar: true, 124 loadingBarPosition: 1, 125 enableNextPrevButton: true, 126 hoverNextPrevButton: true, 127 enableKeyNavigation: true, 128 enableBullet: false, 129 bulletPosition: 2, 130 hoverBullet: 0, 131 enableThumbnail: true, 132 thumbnailPosition: 3, 133 thumbnailWidth: 80, 134 thumbnailHeight: 50, 135 enableBorderStyle: false, 136 borderStyle: 1, // from 1-9 137 enableDropShadow: false, 138 dropShadowStyle: 1, // from 1 - 5 139 enableDrag: true, // Allow mouse drag to change slide 140 defaultTransitions: "fade", // Default transition effect when slide transition effect not choose 141 defaultTransitionSpeed: 1000, // Default time to play transition slide effect. Calculate by milliseconds 142 defaultSlideTime: 6000, // Default time for slides (millisecond)
143 stripCols: 20, 144 stripRows: 10, 145 touchSensitive: 50, 146 onInit: function () { 147 }, // this callback is invoked when init slide show 148 onEndTransition: function () { 149 }, // this callback is invoked when the transition effect ends 150 onStartTransition: function () { 151 }, // this callback is invoked when the transition effect starts 152 lightBoxVideoWidth: 640, 153 lightBoxVideoHeight: 350, 154 lightBoxOverlay: 0.8, 155 onVideoClick: function () { 156 } 157 } 158 159 this.slider = $element; 160 this.options = $.extend(default_options, options); 161 this.slideTime = this.options.defaultSlideTime; 162 this.slides = []; 163 this.playTime = 0; 164 this.timeUnit = 40; 165 this.itemsTimer = []; 166 this.active = -1; 167 this.prev = -1; 168 this.numberSlides = 0; 169 this.hasTouch = ("ontouchstart" in window || "createTouch" in document); 170 this.width = 0; 171 this.height = 0; 172 this.lock = false; 173 this.pause = false; 174 this.supportCss3 = (window.Modernizr.csstransitions && window.Modernizr.csstransforms3d); 175 this.tooltipDistance = 50; 176 177 this.init(); 178 } 179 MDSlider.prototype = { 180 constructor: MDSlider, 181 init: function () { 182 var self = this, 183 inActiveTime = false; 184 185 // Add class loading-image to start initialize for slide show 186 this.slider.addClass("loading-image"); 187 188 // Create wrap element for slide show 189 this.slider.wrap('<div class="md-slider-wrap"><div class="md-slide-wrap"></div></div>'); 190 this.wrap = this.slider.parent().parent(); 191 this.wrap.addClass(this.slider.attr("id") + "-wrap"); 192 193 // Init slide show classes configure 194 if (this.options.responsive) 195 this.wrap.addClass("md-slider-responsive"); 196 if (this.options.fullWidth) 197 this.wrap.addClass("md-slider-full-width"); 198 199 if (this.options.responsive && !this.options.fullWidth) 200 this.wrap.css("max-width", this.options.width + "px"); 201 202 if (this.options.enableBullet && this.options.bulletPosition) 203 this.wrap.addClass("md-slider-bullet-" + this.options.bulletPosition); 204 if (!this.options.enableBullet && this.options.enableThumbnail && this.options.thumbnailPosition); 205 this.wrap.addClass("md-slider-thumb-" + this.options.thumbnailPosition); 206 207 // Initialize width and height of slide 208 this.width = (this.options.responsive) ? this.slider.width() : this.options.width; 209 this.height = this.options.height; 210 211 // Initialize slides 212 this.numberSlides = $(".md-slide-item", this.slider).length; 213 $(".md-slide-item", this.slider).each(function (index) { 214 self.slides[index] = $(this); 215 216 // Initialize for items in slide 217 $(".md-object", $(this)).each(function () { 218 var top = $(this).data("y") ? $(this).data("y") : 0, 219 left = $(this).data("x") ? $(this).data("x") : 0, 220 width = $(this).data("width") ? $(this).data("width") : 0, 221 height = $(this).data("height") ? $(this).data("height") : 0; 222 width = 100 * width/self.options.width; 223 height = 100 * height / self.options.height; 224 225 top = 100 * top/self.options.height; 226 left = 100 * left / self.options.width; 227 228 if (width > 0) 229 $(this).width(width + "%"); 230 if (height > 0) 231 $(this).height(height + "%"); 232 233 $(this).css({top: top + "%", left: left + "%"}); 234 $(this).hide(); 235 }); 236 if (index > 0) 237 $(this).hide(); 238 }); 239 240 // Load slide show elements 241 this.initControl(); 242 this.initDrag(); 243 this.initVideo(); 244 this.initHotSpot(); 245 246 // Load images to play slide 247 this.loadImages(); 248 this.removeLoader(); 249 // 250 251 // Invoke custom init callback 252 this.options.onInit.call(self.slider); 253 254 // process when un-active tab 255 $(window).blur(function () { 256 inActiveTime = (new Date()).getTime(); 257 }); 258 $(window).focus(function () { 259 if (inActiveTime) { 260 var duration = (new Date()).getTime() - inActiveTime; 261 262 if (duration > self.slideTime - self.playTime) 263 self.playTime = self.slideTime - 200; 264 else 265 self.playTime += duration; 266 inActiveTime = false;
267 } 268 }); 269 this.eventClickLink(); 270 $(window).resize(function () { 271 self.resize(); 272 }).trigger("resize"); 273 }, 274 eventClickLink: function(){ 275 $('.md-objects', this.slider).off('click').on('click', function(){ 276 if($(this).attr('data-url')) 277 window.open($(this).attr('data-url')); 278 }); 279 $('.md-object > a[href]', this.slider).click(function(e){ 280 e.stopPropagation(); 281 }); 282 }, 283 initControl: function () { 284 var self = this; 285 286 // Initialize loading bar 287 if (this.options.enableLoadingBar) { 288 var loadingContainer = $('<div class="loading-bar-hoz loading-bar-' + this.options.loadingBarPosition + '"><div class="br-timer-glow" style="left: -100px;"></div><div class="br-timer-bar" style="width:0px"></div></div>'); 289 this.wrap.append(loadingContainer); 290 } 291 292 // Initialize pause on hover 293 if (this.options.pauseOnHover) { 294 $(".md-slide-wrap", this.wrap).mouseenter(function () { 295 self.pauseSlide(); 296 }); 297 $(".md-slide-wrap", this.wrap).mouseleave(function () { 298 self.unPauseSlide(); 299 }); 300 } 301 302 // Initialize border 303 if (this.options.enableBorderStyle && this.options.borderStyle) { 304 var borderDivs = '<div class="border-top border-style-' + this.options.borderStyle + '"></div><div class="border-bottom border-style-' + this.options.borderStyle + '"></div>'; 305 306 if (!this.options.fullWidth) { 307 borderDivs += '<div class="border-left border-style-' + this.options.borderStyle + '"><div class="edge-top"></div><div class="edge-bottom"></div></div>'; 308 borderDivs += '<div class="border-right border-style-' + this.options.borderStyle + '"><div class="edge-top"></div><div class="edge-bottom"></div></div>'; 309 } 310 this.wrap.append(borderDivs); 311 } 312 313 // Initialize for shadow 314 if (this.options.enableDropShadow && this.options.dropShadowStyle) { 315 var shadowDiv = '<div class="md-shadow md-shadow-style-' + this.options.dropShadowStyle + '"></div>'; 316 this.wrap.append(shadowDiv); 317 } 318 319 // Initialize bullets 320 if (this.options.enableBullet && this.options.bulletPosition) { 321 var $bullets = $('<div class="md-bullets"></div>'); 322 $(".md-slide-wrap", this.wrap).append($bullets); 323 324 for (var i = 0; i < this.numberSlides; i++) { 325 $bullets.append('<div class="md-bullet" rel="' + i + '"><a></a></div>'); 326 } 327 328 if (this.options.hoverBullet) { 329 $bullets.css("opacity", 0); 330 $(".md-slide-wrap", this.wrap).hover( 331 function () { 332 $bullets.stop().animate({opacity: 1.0}, "fast"); 333 }, 334 function () { 335 $bullets.stop().animate({opacity: 0}, "fast"); 336 } 337 ); 338 } 339 340 // Show thumbnail is set => Hover bullet would be show thumbnail 341 if (this.options.enableThumbnail) { 342 var thumbW = parseInt(this.slider.data("thumb-width")), 343 thumbH = parseInt(this.slider.data("thumb-height")); 344 345 for (var i = 0; i < this.numberSlides; i++) { 346 var thumbSrc = this.slides[i].data("thumb"), 347 thumbType = this.slides[i].data("thumb-type"), 348 thumbAlt = this.slides[i].data("thumb-alt"); 349 if (thumbSrc) { 350 var thumb; 351 if (thumbType == "image") 352 thumb = $('<img />').attr("src", thumbSrc).attr("alt", this.slides[i].data("thumb-alt")).css({ 353 top: -(9 + thumbH) + "px", 354 left: -(thumbW / 2 - 2) + "px", 355 opacity: 0 356 }) 357 else 358 thumb = $("<span></span>").attr("style", thumbSrc).css({ 359 top: -(9 + thumbH) + "px", 360 left: -(thumbW / 2 - 2) + "px", 361 opacity: 0 362 }); 363 $("div.md-bullet:eq(" + i + ")", $bullets).append(thumb).append('<div class="md-thumb-arrow" style="opacity: 0"></div>'); 364 } 365 } 366 $("div.md-bullet", $bullets).hover( 367 function () { 368 $(this).addClass("md-hover"); 369 $("img, span", this).show().animate({'opacity': 1}, 200); 370 $('.md-thumb-arrow', this).show().animate({'opacity': 1}, 200); 371 }, 372 function () { 373 $(this).removeClass('md_hover'); 374 $('img, span', this).animate({'opacity': 0}, 200, function () { 375 $(this).hide(); 376 }); 377 $('.md-thumb-arrow', this).animate({'opacity': 0}, 200, function () { 378 $(this).hide(); 379 }); 380 } 381 ); 382 } 383 $("div.md-bullet", this.wrap).click(function () { 384 if ($(this).hasClass("md-current")) 385 return false;
386 387 self.slide($(this).attr("rel")); 388 }); 389 } 390 else if (this.options.enableThumbnail && this.options.thumbnailPosition) { 391 var $thumbnailContainer = $('<div class="md-thumb"><div class="md-thumb-container"><div class="md-thumb-items"></div></div></div>'), 392 $thumbnails = $(".md-thumb-items", $thumbnailContainer); 393 394 for (var i = 0; i < this.numberSlides; i++) { 395 var thumbSrc = this.slides[i].data("thumb"); 396 if (thumbSrc) { 397 var link = $('<a class="md-thumb-item" />').attr("rel", i).append($('<img />').attr("src", thumbSrc)); 398 $thumbnails.append(link); 399 } 400 } 401 this.wrap.append($thumbnailContainer); 402 403 $("a", $thumbnails).click(function () { 404 if ($(this).hasClass("md-current")) 405 return false; 406 407 self.slide($(this).attr("rel")); 408 }); 409 } 410 411 // initialize next previous button 412 if (this.options.enableNextPrevButton) { 413 $(".md-slide-wrap", self.wrap).append('<div class="md-arrow"><div class="md-arrow-left"><span></span></div><div class="md-arrow-right"><span></span></div></div>'); 414 $(".md-arrow-right", self.wrap).bind("click", function () { 415 self.nextSlide(); 416 }); 417 $(".md-arrow-left", self.wrap).bind("click", function () { 418 self.prevSlide(); 419 }); 420 421 if (this.options.hoverNextPrevButton) { 422 $(".md-arrow", self.wrap).css("opacity", 0); 423 $(".md-slide-wrap", self.wrap).hover( 424 function () { 425 $(".md-arrow", self.wrap).stop().animate({opacity: 1}, "fast"); 426 }, 427 function () { 428 $(".md-arrow", self.wrap).stop().animate({opacity: 0}, "fast"); 429 } 430 ); 431 } 432 } 433 434 // Next, Prev slides with key navigation 435 if (this.options.enableKeyNavigation) { 436 $(window).keydown(function (event) { 437 var key = event.keyCode || event.which; 438 439 if (key == 37 || key == 38) 440 self.nextSlide(); 441 else if (key == 39 || key == 40) 442 self.prevSlide(); 443 }); 444 } 445 }, 446 initDrag: function () { 447 var self = this, 448 touchStart = false, 449 isScrolling = false, 450 mouseLeft = 0; 451 452 if (this.hasTouch) { 453 this.slider.bind("touchstart", function (event) { 454 if (touchStart) return false; 455 event = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0]; 456 touchStart = true; 457 isScrolling = undefined; 458 self.slider.mouseY = event.pageY; 459 self.slider.mouseX = event.pageX; 460 }); 461 this.slider.bind("touchmove", function (event) { 462 event = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0]; 463 if (touchStart) { 464 var pageX = (event.pageX || event.clientX), 465 pageY = (event.pageY || event.clientY); 466 467 if (typeof isScrolling == 'undefined') 468 isScrolling = !!( isScrolling || Math.abs(pageY - self.slider.mouseY) > Math.abs(pageX - self.slider.mouseX)); 469 470 if (isScrolling) 471 touchStart = false;
472 else 473 mouseLeft = pageX - self.slider.mouseX; 474 } 475 return; 476 }); 477 this.slider.bind("touchend", function (event) { 478 if (touchStart) { 479 touchStart = false; 480 481 if (mouseLeft > self.options.touchSensitive) { 482 self.nextSlide(); 483 mouseLeft = 0; 484 } 485 else if (mouseLeft < -self.options.touchSensitive) { 486 self.nextSlide(); 487 mouseLeft = 0; 488 return false; 489 } 490 } 491 }); 492 } 493 else { 494 $(".md-slide-wrap", this.wrap).hover( 495 function () { 496 if ($(".md-arrow", self.wrap)) 497 $(".md-arrow", self.wrap).stop(true, true).animate({opacity: 1}, 200); 498 }, 499 function () { 500 if ($(".md-arrow", self.wrap)) 501 $(".md-arrow", self.wrap).stop(true, true).animate({opacity: 0}, 200); 502 } 503 ).trigger("hover"); 504 } 505 506 if (this.options.enableDrag) { 507 this.slider.mousedown(function (event) { 508 if (!touchStart) { 509 touchStart = true; 510 isScrolling = undefined; 511 self.slider.mouseY = event.pageY; 512 self.slider.mouseX = event.pageX; 513 } 514 ; 515 return false; 516 }); 517 518 this.slider.mousemove(function (event) { 519 if (touchStart) { 520 var pageX = (event.pageX || event.clientX); 521 var pageY = (event.pageY || event.clientY); 522 523 if (typeof isScrolling == 'undefined') 524 isScrolling = !!( isScrolling || Math.abs(pageY - self.slider.mouseY) > Math.abs(pageX - self.slider.mouseX)) 525 526 if (isScrolling) 527 touchStart = false;
528 else 529 mouseLeft = pageX - self.slider.mouseX; 530 } 531 }); 532 533 this.slider.mouseup(function (event) { 534 if (touchStart) { 535 touchStart = false; 536 537 if (mouseLeft > self.options.touchSensitive) 538 self.prevSlide(); 539 else if (mouseLeft < -self.options.touchSensitive) 540 self.nextSlide(); 541 542 mouseLeft = 0; 543 return false; 544 } 545 }); 546 this.slider.mouseleave(function (event) { 547 self.slider.mouseup(); 548 }); 549 } 550 ; 551 }, 552 initVideo: function () { 553 var self = this; 554 555 $(".md-video", this.slider).each(function () { 556 var $video = $(this), 557 display = $(this).parent().data("display"), 558 videoSrc = $video.attr("href")+'?autoplay=1'; 559 560 switch (display) { 561 case "lightbox": 562 var videoBoxOptions = { 563 videoWidth: self.options.lightBoxVideoWidth, 564 videoHeight: self.options.lightBoxVideoHeight, 565 overlay: self.options.lightBoxOverlay, 566 onClick: self.options.onVideoClick 567 } 568 $(this).mdVideoBox(self, videoBoxOptions); 569 break; 570 571 case "full":
572 var $videoContainer = $('<div class="md-video-control md-loading" style="display: none"></div>'); 573 574 // Add video container 575 self.wrap.append($videoContainer); 576 $videoContainer.hover( 577 function () { 578 self.pauseSlide(); 579 }, 580 function () { 581 } 582 ); 583 584 // Process when click to video 585 $video.click(function () { 586 var $closeBtn = $('<a href="#" class="md-close-video" title="close"></a>'), 587 $videoFrame = $('<iframe frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>'); 588 589 // Process for close video button click 590 $closeBtn.click(function () { 591 $videoContainer.html("").hide(); 592 self.unPauseSlide(); 593 return false; 594 }); 595 596 // Load video content 597 $videoFrame.attr("src", videoSrc).css({ 598 width: "100%", 599 height: "100%" 600 }); 601 $videoContainer.append($videoFrame).append($closeBtn).show(); 602 603 return false; 604 }); 605 break; 606 607 default : 608 $video.click(function () { 609 var $videoContainer = $video.parent(), 610 $videoFrame = $('<iframe frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>'); 611 612 $videoContainer.addClass("md-loading"); 613 $video.hide(); 614 $videoFrame.attr("src", videoSrc); 615 $videoFrame.css({ 616 width: $videoContainer.width(), 617 height: $videoContainer.height() 618 }); 619 620 $videoContainer.append($videoFrame); 621 return false; 622 }); 623 break; 624 } 625 }); 626 }, 627 initHotSpot: function () { 628 var self = this; 629 630 $(".md-object .md-hotspot", this.slider).hover( 631 function () { 632 633 var $tooltip = $(".md-hotspot-tooltip", $(this).parent()).clone(), 634 position; 635 636 self.wrap.append($tooltip); 637 position = self.getTooltipPosition($(this), $tooltip); 638 if (position != false) { 639 self.wrap.append($tooltip); 640 $tooltip.addClass("active"); 641 $tooltip.addClass(position.class); 642 $tooltip.offset({ 643 left: position.left, 644 top: position.top 645 }).animate({opacity: 1}, "fast"); 646 } 647 }, 648 function () { 649 $(".md-hotspot-tooltip.active", self.wrap).remove(); 650 } 651 ).click(function () { 652 return false; 653 } 654 ); 655 656 $(".md-object .transBg-diamond", this.slider).hover( 657 function () { 658 $(this).addClass("animation"); 659 $(".darkBg-diamond", $(this)).addClass("animation"); 660 $(".hoverBg-diamond", $(this)).addClass("animation"); 661 $(".content-diamond", $(this)).addClass("animation"); 662 $(".transBg-diamond .diamon-title", $(this)).addClass("animation"); 663 $(".border", $(this).parent()).addClass("animation"); 664 }, 665 function () { 666 $(this).removeClass("animation"); 667 $(".darkBg-diamond", $(this)).removeClass("animation"); 668 $(".hoverBg-diamond", $(this)).removeClass("animation"); 669 $(".transBg-diamond .diamon-title", $(this)).removeClass("animation"); 670 $(".content-diamond", $(this)).removeClass("animation"); 671 $(".border", $(this).parent()).removeClass("animation"); 672 } 673 ); 674 }, 675 getTooltipPosition: function ($hotSpot, $tooltip) { 676 var $itemObj = $hotSpot.parent(), 677 direction = $itemObj.data("tooltip-direction") ? $itemObj.data("tooltip-direction") : "left", 678 responsive = $itemObj.data("tooltip-responsive") ? $itemObj.data("tooltip-responsive") : 0, 679 position = $hotSpot.offset(), 680 pointWidth = $hotSpot.width(), 681 pointHeight = $hotSpot.height(), 682 width = $tooltip.width(), 683 height = $tooltip.height(), 684 top = 0, 685 left = 0, 686 directionClass = "md-hotspot-tooltip-" + direction; 687 688 if (width > $(window).width()) 689 return false;
690 691 if (direction == "auto") 692 return this.autoTooltipPosition($hotSpot, $tooltip); 693 else { 694 switch (direction) { 695 case "left": 696 top = position.top - (height - pointHeight) / 2; 697 left = position.left - width - 10; 698 $tooltip.offset({ 699 left: left - this.tooltipDistance, 700 top: top 701 }); 702 break; 703 704 case "top": 705 top = position.top - height - 10; 706 left = position.left - (width - pointWidth) / 2; 707 $tooltip.offset({ 708 left: left, 709 top: top - this.tooltipDistance 710 }); 711 break; 712 713 case "right": 714 top = position.top - (height - pointHeight) / 2; 715 left = position.left + pointWidth + 10; 716 $tooltip.offset({ 717 left: left + this.tooltipDistance, 718 top: top 719 }); 720 break; 721 722 case "bottom": 723 top = position.top + pointHeight + 10; 724 left = position.left - (width - pointWidth) / 2; 725 $tooltip.offset({ 726 left: left, 727 top: top + this.tooltipDistance 728 }); 729 break; 730 } 731 732 if ((left < 0 || top < 0 || left + width > $(window).width() || top + height > $(window).height()) && responsive) 733 return this.autoTooltipPosition($hotSpot, $tooltip); 734 735 return {left: left, top: top, class: directionClass}; 736 } 737 }, 738 autoTooltipPosition: function ($hotSpot, $tooltip) { 739 var $itemObj = $hotSpot.parent(), 740 direction = $itemObj.data("tooltip-direction") ? $itemObj.data("tooltip-direction") : "left", 741 responsive = $itemObj.data("tooltip-responsive") ? $itemObj.data("tooltip-responsive") : 0, 742 position = $hotSpot.offset(), 743 pointWidth = $hotSpot.width(), 744 pointHeight = $hotSpot.height(), 745 width = $tooltip.width(), 746 height = $tooltip.height(), 747 top = position.top - (height - pointHeight) / 2, 748 left = position.left - width - 10, 749 directionClass = "md-hotspot-tooltip-left"; 750 751 if (top < 0) { 752 top = position.top + pointHeight + 10; 753 if (top + height > $(window).height()) 754 return false; 755 756 left = position.left - (width - pointWidth) / 2; 757 if (left < 0) { 758 left = 0; 759 $(".md-hotspot-tooltip-arrow", $tooltip).css({ 760 top: "-10px", 761 bottom: "auto", 762 left: position.left + pointWidth / 2, 763 right: "auto" 764 }); 765 } 766 else if (left + width > $(window).width()) { 767 left += ($(window).width() - (left + width)); 768 $(".md-hotspot-tooltip-arrow", $tooltip).css({ 769 top: "-10px", 770 bottom: "auto", 771 left: position.left + pointWidth / 2 - left, 772 right: "auto" 773 }); 774 } 775 directionClass = "md-hotspot-tooltip-bottom"; 776 $tooltip.offset({top: top + this.tooltipDistance, left: left}); 777 } 778 else { 779 if (left < 0) { 780 directionClass = "md-hotspot-tooltip-top"; 781 left = position.left - (width - pointWidth) / 2; 782 top = position.top - height - 10; 783 784 if (top < 0) { 785 directionClass = "md-hotspot-tooltip-right"; 786 top = position.top - (height - pointHeight) / 2; 787 left = position.left + pointWidth + 10; 788 789 if (left + width > $(window).width()) { 790 directionClass = "md-hotspot-tooltip-bottom"; 791 top = position.top + pointHeight + 10; 792 left = position.left + (width - pointWidth) / 2; 793 794 if (top + height > $(window).height()) 795 return false;
796 797 if (left < 0) { 798 left = 0; 799 $(".md-hotspot-tooltip-arrow", $tooltip).css({ 800 top: "-10px", 801 bottom: "auto", 802 left: position.left + pointWidth / 2 803 }); 804 } 805 else if (left + width > $(window).width()) { 806 left += ($(window).width() - (left + width)); 807 $(".md-hotspot-tooltip-arrow", $tooltip).css({ 808 top: "-10px", 809 bottom: "auto", 810 left: position.left + pointWidth / 2 - left, 811 right: "auto" 812 }); 813 } 814 $tooltip.offset({ 815 top: top + this.tooltipDistance, 816 left: left 817 }); 818 } 819 else 820 $tooltip.offset({ 821 top: top, 822 left: left + this.tooltipDistance 823 }); 824 } 825 else { 826 if (left < 0) { 827 left = 0; 828 $(".md-hotspot-tooltip-arrow", $tooltip).css({ 829 top: "auto", 830 bottom: "-10px", 831 left: position.left + pointWidth / 2 832 }); 833 } 834 else if (left + width > $(window).width()) { 835 left += ($(window).width() - (left + width)); 836 $(".md-hotspot-tooltip-arrow", $tooltip).css({ 837 top: "auto", 838 bottom: "-10px", 839 left: position.left + pointWidth / 2 - left 840 }); 841 } 842 843 $tooltip.offset({ 844 top: top - this.tooltipDistance, 845 left: left 846 }); 847 } 848 } 849 else 850 $tooltip.offset({ 851 top: top, 852 left: left - this.tooltipDistance 853 }); 854 } 855 856 return {left: left, top: top, class: directionClass} 857 }, 858 timer: function () { 859 if (this.lock) 860 return; 861 862 if (!this.pause) { 863 this.playTime += this.timeUnit; 864 if (this.playTime > this.slideTime) { 865 if (this.options.autoPlay) 866 this.nextSlide(); 867 } 868 else { 869 if (this.options.enableLoadingBar) { 870 var width = this.playTime * this.width / this.slideTime; 871 $(".br-timer-bar", this.wrap).width(width); 872 $(".br-timer-glow", this.wrap).css({left: width - 100 + "px"}); 873 } 874 } 875 } 876 }, 877 play: function () { 878 var self = this; 879 880 this.slider.removeClass("loading-image") 881 this.slide(0); 882 setInterval(function () { 883 self.timer(); 884 }, this.timeUnit); 885 }, 886 slide: function (index) { 887 index = parseInt(index); 888 if (this.lock) 889 return; 890 891 this.lock = true; 892 this.playTime = 0; 893 this.slideTime = this.slides[index].data("timeout") ? this.slides[index].data("timeout") : this.options.defaultSlideTime; 894 if (this.options.enableLoadingBar) { 895 $(".br-timer-bar", this.wrap).width(0); 896 $(".br-timer-glow", this.wrap).css({left: "-100px"}); 897 } 898 this.prev = this.active; 899 this.active = index; 900 // Clear effect classes in slide items 901 $(".md-object", this.slides[this.active]).each(function () { 902 $(this).removeClass(effectsIn.join(" ")); 903 $(this).removeClass(effectsOut.join(" ")); 904 $(this).hide(); 905 }); 906 907 // Invoke custom onTransitionBegin 908 this.options.onStartTransition.call(this.slider); 909 910 if (this.slides[this.prev]) { 911 $("div.md-bullet:eq(" + this.prev + ")", this.wrap).removeClass("md-current"); 912 $("a:eq(" + this.prev + ")", this.wrap).removeClass("md-current"); 913 914 // Clear items timer 915 this.clearItemsTimer(); 916 917 // Reset video item with inline display style 918 $(".md-video", this.slides[this.prev]).each(function () { 919 var $itemObject = $(this).parent(); 920 if (!$itemObject.data("display") || $itemObject.data("display") == "inline") 921 $("iframe", $itemObject).remove(); 922 923 $(this).show(); 924 }); 925 926 // Get slide transition effect 927 var fx = this.slides[this.active].data("transition") ? this.slides[this.active].data("transition") : this.options.defaultTransitions; 928 fx = fx.trim(); 929 930 if (fx.toLowerCase() == "random") { 931 fx = transitionEffects[Math.floor(Math.random() * transitionEffects.length)]; 932 if (fx == undefined) 933 fx = "fade"; 934 fx = $.trim(fx.toLowerCase()); 935 } 936 else if (fx.indexOf(",") != -1) { 937 var transitions = fx.split(","); 938 fx = transitions[Math.floor(Math.random() * transitions.length)]; 939 if (fx == undefined) 940 fx = "fade"; 941 fx = $.trim(fx.toLowerCase()); 942 } 943 944 if (!this.supportCss3 && fx.indexOf("slit-") != -1) 945 fx = "fade"; 946 947 // Play transition effect 948 this.playTransition(fx); 949 this.setCurrent(); 950 } 951 else { 952 this.slides[this.active].css({top: 0, left: 0}).show(); 953 this.playSlideItems(); 954 this.setCurrent(); 955 } 956 }, 957 nextSlide: function () { 958 if (this.lock) 959 return; 960 961 var index = this.active + 1; 962 if (index < this.numberSlides) 963 this.slide(index) 964 else if (this.options.loop) 965 this.slide(0); 966 }, 967 prevSlide: function () { 968 if (this.lock) 969 return; 970 971 if (this.active - 1 >= 0) 972 this.slide(this.active - 1); 973 else if (this.options.loop) 974 this.slide(this.numberSlides - 1); 975 }, 976 pauseSlide: function () { 977 this.pause = true; 978 if (!this.lock) 979 this.clearItemsTimer(); 980 }, 981 unPauseSlide: function () { 982 this.pause = false;
983 if (!this.lock) 984 this.playSlideItems(); 985 }, 986 clearItemsTimer: function () { 987 $.each(this.itemsTimer, function (index, timer) { 988 clearTimeout(timer); 989 }); 990 991 this.itemsTimer = []; 992 }, 993 playSlideItems: function () { 994 var self = this, 995 activeSlide = this.slides[this.active]; 996 $(".md-object", activeSlide).each(function () { 997 var $caption = $(this), 998 inFx = $caption.data("easein") ? $caption.data("easein") : "", 999 outFx = $caption.data("easeout") ? $caption.data("easeout") : "", 1000 start = $caption.data("start") ? $caption.data("start") : 0, 1001 stop = $caption.data("stop") ? $caption.data("stop") : 0; 1002 1003 // Get effect in and out 1004 if (inFx.toLowerCase() == "random") 1005 inFx = effectsIn[Math.floor(Math.random() * effectsIn.length)]; 1006 if (outFx.toLowerCase() == "random") 1007 outFx = effectsOut[Math.floor(Math.random() * effectsOut.length)]; 1008 1009 // Process start for slide item 1010 if (stop - self.playTime >= 0) { 1011 if (start - self.playTime >= 0) { 1012 // Remove class effect out and hide caption 1013 $caption.removeClass(effectsOut.join(" ")); 1014 $caption.removeClass(effectsIn.join(" ")); 1015 $caption.hide(); 1016 1017 var timer = setTimeout( 1018 function () { 1019 if (inFx == "" || !self.supportCss3 || (inFx == "shuffleLetter" && !jQuery().shuffleLetters)) 1020 $caption.show(); 1021 else { 1022 if (inFx !== "shuffleLetter") { 1023 var fxDuration = $caption.data("duration-in"); 1024 if (fxDuration != undefined && fxDuration > 0) { 1025 $caption.css({ 1026 "animation-duration": fxDuration + "ms", 1027 "-webkit-animation-duration": fxDuration + "ms", 1028 "-moz-animation-duration": fxDuration + "ms", 1029 "-ms-animation-duration": fxDuration + "ms" 1030 }); 1031 } 1032 $caption.show().addClass(inFx); 1033 } 1034 else { 1035 var shuffleLetterOpt = {fps: 25}; 1036 if (fxDuration && fxDuration > 0) { 1037 shuffleLetterOpt.fps = 25/(fxDuration/1000) 1038 } 1039 $caption.show().shuffleLetters(shuffleLetterOpt); 1040 } 1041 } 1042 }, 1043 start - self.playTime 1044 ); 1045 1046 self.itemsTimer.push(timer); 1047 } 1048 else 1049 $caption.show(); 1050 1051 // Process for stop slide item 1052 if (stop - self.playTime >= 0) { 1053 var timer = setTimeout( 1054 function () { 1055 if (outFx == "" || !self.supportCss3) 1056 $caption.fadeOut(); 1057 else { 1058 var fxDuration = $caption.data("duration-out"); 1059 if (fxDuration != undefined && fxDuration > 0) { 1060 $caption.css({ 1061 "animation-duration": fxDuration + "ms", 1062 "-webkit-animation-duration": fxDuration + "ms", 1063 "-moz-animation-duration": fxDuration + "ms", 1064 "-ms-animation-duration": fxDuration + "ms"
1065 }); 1066 } 1067 $caption.addClass(outFx); 1068 } 1069 1070 $caption.removeClass(inFx); 1071 }, 1072 stop - self.playTime 1073 ); 1074 1075 self.itemsTimer.push(timer); 1076 } 1077 } 1078 else 1079 $caption.hide(); 1080 }); 1081 this.lock = false; 1082 1083 if (this.options.pauseOnHover && this.pause) 1084 $(".md-slide-wrap", this.wrap).trigger("mouseenter"); 1085 }, 1086 loadImages: function () { 1087 var self = this, 1088 count = $(".md-slide-item .md-main-img img", this.slider).length; 1089 if(count){ 1090 $(".md-slide-item .md-main-img img", this.slider).each(function () { 1091 $(this).on('load', function () { 1092 var $image = $(this); 1093 if (!$image.data("defW")) { 1094 var imgSize = self.getImageSize($image.attr("src")); 1095 1096 self.changeBackgroundPosition($image, imgSize.width, imgSize.height); 1097 $image.data({ 1098 defW: imgSize.width, 1099 defH: imgSize.height 1100 }); 1101 } 1102 1103 count--; 1104 if (count == 0) 1105 self.play(); 1106 }); 1107 1108 if (this.complete) 1109 $(this).trigger('load'); 1110 }); 1111 }else{ 1112 self.play(); 1113 } 1114 }, 1115 changeBackgroundPosition: function ($background, width, height) { 1116 var panelWidth = $(".md-slide-item:visible", this.slider).width(), 1117 panelHeight = $(".md-slide-item:visible", this.slider).height(); 1118 1119 if (height > 0 && panelHeight > 0) { 1120 if (((width / height) > (panelWidth / panelHeight))) { 1121 var left = panelWidth - (panelHeight / height) * width; 1122 $background.css({ 1123 width: "auto", 1124 height: panelHeight + "px" 1125 }); 1126 if (left < 0) 1127 $background.css({left: (left / 2) + "px", top: 0}); 1128 else 1129 $background.css({left: 0, top: 0}); 1130 } 1131 else { 1132 var top = panelHeight - (panelWidth / width) * height; 1133 $background.css({width: panelWidth + "px", height: "auto"}); 1134 if (top < 0) 1135 $background.css({top: (top / 2) + "px", left: 0}); 1136 else 1137 $background.css({left: 0, top: 0}); 1138 } 1139 } 1140 }, 1141 getImageSize: function (src) { 1142 var image = new Image(); 1143 1144 image.src = src; 1145 return {width: image.width, height: image.height} 1146 }, 1147 resize: function () { 1148 this.width = this.options.responsive ? this.wrap.width() : this.options.width; 1149 if (this.options.responsive && (this.width < this.options.width)) { 1150 this.height = Math.round(this.options.height * this.width / this.options.width); 1151 } 1152 else 1153 this.height = this.options.height; 1154 1155 this.wrap.height(this.height); 1156 $(".md-slide-item", this.slider).height(this.height); 1157 1158 if (this.options.fullWidth) { 1159 var bulletSpace = 20; 1160 1161 if ((this.wrap.width() - this.options.width) / 2 > 20) 1162 bulletSpace = (this.wrap.width() - this.options.width) / 2; 1163 1164 $(".md-bullets", this.wrap).css({ 1165 left: bulletSpace, 1166 right: bulletSpace 1167 }); 1168 $(".md-thumb", this.wrap).css({ 1169 left: bulletSpace, 1170 right: bulletSpace 1171 }); 1172 $(".md-objects", this.slider).width(this.options.width); 1173 } 1174 1175 if (this.options.responsive && this.wrap.width() < this.options.width) 1176 $(".md-objects", this.slider).width(this.width); 1177
1178 this.resizeBackgroundImages(); 1179 this.resizeThumbnail(); 1180 this.resizeFont(); 1181 this.resizePadding(); 1182 this.setThumbnailPosition(); 1183 }, 1184 resizeBackgroundImages: function () { 1185 var self = this; 1186 1187 $(".md-slide-item", this.slider).each(function () { 1188 var $background = $(".md-main-img img", this); 1189 if($background.length){ 1190 if ($background.data("defW") && $background.data("defH")) { 1191 self.changeBackgroundPosition($background, $background.data("defW"), $background.data("defH")); 1192 } 1193 }else{ 1194 $(".md-main-img", $(this)).width($(".md-slide-item:visible", self.slider).width()).height($(".md-slide-item:visible", self.slider).height()) 1195 } 1196 }); 1197 }, 1198 resizeThumbnail: function () { 1199 var self = this; 1200 1201 if (this.options.enableThumbnail && !this.options.enableBullet) { 1202 var $thumbnailItems = $(".md-thumb-items", this.wrap), 1203 thumbnailsWidth = $("a", $thumbnailItems).width() * this.numberSlides, 1204 $thumbnailContainer = $(".md-thumb", this.wrap); 1205 1206 $thumbnailItems.unbind("touchstart").unbind("touchmove").unbind("touchend").css("left", 0); 1207 $(".md-thumb-next", $thumbnailContainer).remove(); 1208 $(".md-thumb-prev", $thumbnailContainer).remove(); 1209 1210 if (thumbnailsWidth > $(".md-thumb-container", $thumbnailContainer).width()) { 1211 var thumbWidthInvisible = $(".md-thumb-container", this.wrap).width() - thumbnailsWidth; 1212 1213 $thumbnailItems.width(thumbnailsWidth); 1214 1215 // Add scroll thumbnail button 1216 $thumbnailContainer.append('<div class="md-thumb-prev"></div><div class="md-thumb-next"></div>'); 1217 $(".md-thumb-prev", $thumbnailContainer).click(function () { 1218 self.scrollThumbnail("right"); 1219 }); 1220 $(".md-thumb-next", $thumbnailContainer).click(function () { 1221 self.scrollThumbnail("left"); 1222 }); 1223 this.enableThumbnailArrow(thumbWidthInvisible); 1224 1225 if (this.hasTouch) { 1226 var thumbTouch = false, 1227 thumbLeft = 0; 1228 1229 $(".md-thumb-items", this.wrap).bind("touchstart", function (event) { 1230 event = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0]; 1231 thumbTouch = true; 1232 this.mouseX = event.pageX; 1233 thumbLeft = $thumbnailItems.position().left; 1234 return false; 1235 }); 1236 $thumbnailItems.bind("touchmove", function (event) { 1237 event.preventDefault(); 1238 event = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0]; 1239 if (thumbTouch) 1240 $thumbnailItems.css("left", thumbLeft + event.pageX - this.mouseX); 1241 1242 return false; 1243 }); 1244 $thumbnailItems.bind("touchend", function (event) { 1245 event.preventDefault(); 1246 event = event.originalEvent.touches[0] || event.originalEvent.changedTouches[0]; 1247 thumbTouch = false; 1248 if (Math.abs(event.pageX - this.mouseX) < self.options.touchSensitive) { 1249 var item = $(event.target).closest("a.md-thumb-item"); 1250 1251 if (item.length) 1252 self.slide(item.attr("rel")); 1253 1254 $thumbnailItems.stop(true, true).animate({left: thumbLeft}, 400); 1255 return false;
1256 } 1257 1258 if ($thumbnailItems.position().left < thumbWidthInvisible) 1259 $thumbnailItems.stop(true, true).animate({left: thumbWidthInvisible}, 400, function () { 1260 self.enableThumbnailArrow(thumbWidthInvisible); 1261 }); 1262 else if ($thumbnailItems.position().left > 0) 1263 $thumbnailItems.stop(true, true).animate({left: 0}, 400, function () { 1264 self.enableThumbnailArrow(thumbWidthInvisible); 1265 }); 1266 1267 thumbLeft = 0; 1268 return false; 1269 }); 1270 } 1271 } 1272 } 1273 }, 1274 scrollThumbnail: function (direction) { 1275 var self = this, 1276 $thumbnailItems = $(".md-thumb-items", this.wrap), 1277 thumbnailsWidth = $("a", $thumbnailItems).width() * this.numberSlides; 1278 1279 if (this.options.enableThumbnail && !this.options.enableBullet) { 1280 var thumbWidthInvisible = $(".md-thumb-container", this.wrap).width() - thumbnailsWidth; 1281 1282 switch (direction) { 1283 case "left": 1284 var thumbLeft = $thumbnailItems.position().left; 1285 1286 if (thumbLeft > thumbWidthInvisible) { 1287 var containerWidth = $(".md-thumb-container", self.wrap).width(); 1288 if ((thumbLeft - containerWidth) > thumbWidthInvisible) 1289 $thumbnailItems.stop(true, true).animate({left: thumbLeft - containerWidth}, 400, function () { 1290 self.enableThumbnailArrow(thumbWidthInvisible); 1291 }); 1292 else 1293 $thumbnailItems.stop(true, true).animate({left: thumbWidthInvisible}, 400, function () { 1294 self.enableThumbnailArrow(thumbWidthInvisible) 1295 }); 1296 } 1297 break; 1298 1299 case "right": 1300 var thumbLeft = $thumbnailItems.position().left; 1301 if (thumbLeft < 0) { 1302 var containerWidth = $(".md-thumb-container", self.wrap).width(); 1303 if (thumbLeft + containerWidth < 0) 1304 $thumbnailItems.stop(true, true).animate({left: thumbLeft + containerWidth}, 400, function () { 1305 self.enableThumbnailArrow(thumbWidthInvisible); 1306 }); 1307 else 1308 $thumbnailItems.stop(true, true).animate({left: 0}, 400, function () { 1309 self.enableThumbnailArrow(thumbWidthInvisible); 1310 }); 1311 } 1312 break; 1313 1314 default : 1315 var thumbCurrent = $("a", $thumbnailItems).index($("a.md-current", $thumbnailItems)); 1316 if (thumbCurrent >= 0) { 1317 var thumbLeft = $thumbnailItems.position().left; 1318 var currentLeft = thumbCurrent * $("a", $thumbnailItems).width(); 1319 if (currentLeft + thumbLeft < 0) 1320 $thumbnailItems.stop(true, true).animate({left: -currentLeft}, 400, function () { 1321 self.enableThumbnailArrow(thumbWidthInvisible); 1322 }); 1323 else { 1324 var currentRight = currentLeft + $("a", $thumbnailItems).width(), 1325 containerWidth = $(".md-thumb-container", self.wrap).width(); 1326 1327 if (currentRight + thumbLeft > containerWidth) 1328 $thumbnailItems.stop(true, true).animate({left: containerWidth - currentRight}, 400, function () { 1329 self.enableThumbnailArrow(thumbWidthInvisible); 1330 }); 1331 } 1332 } 1333 break; 1334 } 1335 } 1336 }, 1337 enableThumbnailArrow: function (minThumbsLeft) { 1338 var thumbLeft = $(".md-thumb-items", this.wrap).position().left; 1339 1340 if (thumbLeft > minThumbsLeft) 1341 $(".md-thumb-next", this.wrap).show(); 1342 else 1343 $(".md-thumb-next", this.wrap).hide(); 1344 1345 if (thumbLeft < 0) 1346 $(".md-thumb-prev", this.wrap).show(); 1347 else 1348 $(".md-thumb-prev", this.wrap).hide(); 1349 }, 1350 setThumbnailPosition: function () { 1351 if (this.options.enableThumbnail && !this.options.enableBullet) {
1352 var thumbHeight = this.slider.data("thumb-height"); 1353 1354 if (this.options.thumbnailPosition == 1) { 1355 var thumbBottom = thumbHeight / 2; 1356 $(".md-thumb", this.wrap).css({ 1357 height: thumbHeight + 20, 1358 bottom: -thumbBottom - 10 1359 }); 1360 this.wrap.css({"margin-bottom": thumbBottom + 10}) 1361 } 1362 else { 1363 $(".md-thumb", this.wrap).css({ 1364 height: thumbHeight + 20, 1365 bottom: -(thumbHeight + 20) 1366 }); 1367 this.wrap.css({"margin-bottom": thumbHeight + 50}) 1368 } 1369 } 1370 }, 1371 resizeFont: function () { 1372 var fontDiff = 1; 1373 1374 if (parseInt($.browser.version, 10) < 9) 1375 fontDiff = 6; 1376 if (this.wrap.width() < this.options.width) 1377 $(".md-objects", this.slider).css({"font-size": 100 * this.wrap.width() / this.options.width - fontDiff + "%"}); 1378 else 1379 $(".md-objects", this.slider).css({"font-size": 100 - fontDiff + "%"}); 1380 }, 1381 resizePadding: function () { 1382 var self = this; 1383 1384 if (this.wrap.width() < this.options.width && this.options.responsive) { 1385 $(".md-objects > div", this.slider).each(function () { 1386 var objectRatio = self.wrap.width() / self.options.width, 1387 $_object = $(this), 1388 objectPadding = {}; 1389 1390 if ($_object.data("paddingtop")) objectPadding["padding-top"] = $_object.data("paddingtop") * objectRatio; 1391 if ($_object.data("paddingright")) objectPadding["padding-right"] = $_object.data("paddingright") * objectRatio; 1392 if ($_object.data("paddingbottom")) objectPadding["padding-bottom"] = $_object.data("paddingbottom") * objectRatio; 1393 if ($_object.data("paddingleft")) objectPadding["padding-left"] = $_object.data("paddingleft") * objectRatio; 1394 if ($_object.find("a").length) 1395 $_object.find("a").css(objectPadding); 1396 else 1397 $_object.css(objectPadding); 1398 }); 1399 } 1400 else { 1401 $(".md-objects > div", this.slider).each(function () { 1402 var $_object = $(this), 1403 objectPadding = {}; 1404 1405 if ($_object.data("paddingtop")) objectPadding["padding-top"] = $_object.data("paddingtop"); 1406 if ($_object.data("paddingright")) objectPadding["padding-right"] = $_object.data("paddingright"); 1407 if ($_object.data("paddingbottom")) objectPadding["padding-bottom"] = $_object.data("paddingbottom"); 1408 if ($_object.data("paddingleft")) objectPadding["padding-left"] = $_object.data("paddingleft"); 1409 if ($_object.find("a").length) 1410 $_object.find("a").css(objectPadding); 1411 else 1412 $_object.css(objectPadding); 1413 }); 1414 } 1415 }, 1416 playTransition: function (fx) { 1417 var self = this, 1418 transitionSpeed = this.options.transitionsSpeed ? this.options.transitionsSpeed : this.options.defaultTransitionSpeed; 1419 switch (fx) { 1420 case "slit-horizontal-left-top": 1421 case "slit-horizontal-top-right": 1422 case "slit-horizontal-bottom-up": 1423 case "slit-vertical-down": 1424 case "slit-vertical-up": 1425 this.addSlit(fx); 1426 $(".md-object", this.slides[this.active]).hide(); 1427 this.slides[this.prev].hide(); 1428 this.slides[this.active].show(); 1429 var slice1 = $(".md-slider-slit", this.slider).first(), 1430 slice2 = $(".md-slider-slit", this.slider).last(), 1431 transitionProp = { 1432 "transition": "all " + transitionSpeed + "ms ease-in-out", 1433 "-webkit-transition": "all " + transitionSpeed + "ms ease-in-out", 1434 "-moz-transition": "all " + transitionSpeed + "ms ease-in-out", 1435 "-ms-transition": "all " + transitionSpeed + "ms ease-in-out" 1436 }; 1437
1438 $(".md-slider-slit", this.slider).css(transitionProp); 1439 setTimeout(function () { 1440 slice1.addClass("md-transition-elements-1"); 1441 slice2.addClass("md-transition-elements-2"); 1442 }, 50); 1443 setTimeout(function () { 1444 self.transitionEnd(); 1445 }, transitionSpeed); 1446 break; 1447 case "strip-up-right": 1448 case "strip-up-left": 1449 this.addTiles(this.options.stripCols, 1, this.active); 1450 var strips = $(".md-slider-title", this.slider), 1451 timeStep = transitionSpeed / this.options.stripCols / 2, 1452 speed = transitionSpeed / 2; 1453 if (fx == "strip-up-right") 1454 strips = $(".md-slider-title", this.slider).reverse(); 1455 strips.css({height: "1px", bottom: 0, top: "auto"}); 1456 strips.each(function (i) { 1457 var strip = $(this); 1458 1459 setTimeout( 1460 function () { 1461 strip.animate({ 1462 height: "100%", 1463 opacity: "1.0" 1464 }, speed, "easeInOutQuart", function () { 1465 if (i == self.options.stripCols - 1) 1466 self.transitionEnd(); 1467 }); 1468 }, 1469 i * timeStep 1470 ); 1471 }); 1472 break; 1473 case "strip-down-right": 1474 case "strip-down-left": 1475 this.addTiles(this.options.stripCols, 1, this.active); 1476 var $strips = $(".md-slider-title", this.slider), 1477 timeStep = transitionSpeed / this.options.stripCols / 2, 1478 speed = transitionSpeed / 2; 1479 1480 if (fx == "strip-down-right") 1481 $strips = $(".md-slider-title", this.slider).reverse(); 1482 $strips.css({height: "1px", top: 0, bottom: "auto"}); 1483 $strips.each(function (i) { 1484 var $strip = $(this); 1485 setTimeout( 1486 function () { 1487 $strip.animate({ 1488 height: "100%", 1489 opacity: "1.0" 1490 }, speed, "easeInOutQuart", function () { 1491 if (i == self.options.stripCols - 1) 1492 self.transitionEnd(); 1493 }); 1494 }, 1495 i * timeStep 1496 ); 1497 }); 1498 break; 1499 case "strip-left-up": 1500 case "strip-left-down": 1501 this.addTiles(1, this.options.stripRows, this.active); 1502 var $strips = $(".md-slider-title", this.slider), 1503 timeStep = transitionSpeed / this.options.stripRows / 2, 1504 speed = transitionSpeed / 2; 1505 1506 if (fx == "strip-left-up") 1507 $strips = $(".md-slider-title", this.slider).reverse(); 1508 $strips.css({width: "1px", left: 0, right: "auto"}); 1509 $strips.each(function (i) { 1510 var $strip = $(this); 1511 setTimeout( 1512 function () { 1513 $strip.animate({ 1514 width: "100%", 1515 opacity: "1.0" 1516 }, speed, "easeInOutQuart", function () { 1517 if (i == self.options.stripRows - 1) 1518 self.transitionEnd(); 1519 }); 1520 }, 1521 i * timeStep 1522 ); 1523 }); 1524 break; 1525 case "strip-right-up": 1526 case "strip-right-down": 1527 this.addTiles(1, this.options.stripRows, this.active);
1528 var $strips = $(".md-slider-title", this.slider), 1529 timeStep = transitionSpeed / this.options.stripRows / 2, 1530 speed = transitionSpeed / 2; 1531 if (fx == "strip-left-right-up") 1532 $strips = $(".md-slider-title", self).reverse(); 1533 $strips.css({width: "1px", left: "auto", right: "1px"}); 1534 $strips.each(function (i) { 1535 var $strip = $(this); 1536 setTimeout( 1537 function () { 1538 $strip.animate({ 1539 width: "100%", 1540 opacity: "1.0" 1541 }, speed, "easeInOutQuart", function () { 1542 if (i == self.options.stripRows - 1) 1543 self.transitionEnd(); 1544 }); 1545 }, 1546 i * timeStep 1547 ); 1548 }); 1549 break; 1550 case "strip-right-left-up": 1551 case "strip-right-left-down": 1552 this.addTiles(1, this.options.stripRows, this.prev); 1553 this.slides[this.prev].hide(); 1554 this.slides[this.active].show(); 1555 1556 var $strips = $(".md-slider-title", this.slider), 1557 timeStep = transitionSpeed / this.options.stripRows, 1558 speed = transitionSpeed / 2; 1559 1560 if (fx == "strip-right-left-up") 1561 $strips = $(".md-slider-title", this.slider).reverse(); 1562 $strips.filter(":odd").css({ 1563 width: "100%", 1564 right: 0, 1565 left: "auto", 1566 opacity: 1 1567 }).end().filter(":even").css({ 1568 width: "100%", 1569 right: "auto", 1570 left: "0px", 1571 opacity: 1 1572 }); 1573 $strips.each(function (i) { 1574 var $strip = $(this), 1575 css = (i % 2 == 0) ? { 1576 left: "-50%", 1577 opacity: 0 1578 } : {right: "-50%", opacity: 0}; 1579 1580 setTimeout( 1581 function () { 1582 $strip.animate(css, speed, "easeOutQuint", function () { 1583 if (i == self.options.stripRows - 1) { 1584 self.transitionEnd(); 1585 } 1586 }); 1587 }, 1588 i * timeStep 1589 ); 1590 }); 1591 break; 1592 case "strip-up-down-right": 1593 case "strip-up-down-left": 1594 this.addTiles(this.options.stripCols, 1, this.prev); 1595 this.slides[this.prev].hide(); 1596 this.slides[this.active].show(); 1597 1598 var $strips = $(".md-slider-title", this.slider), 1599 timeStep = transitionSpeed / this.options.stripCols / 2, 1600 speed = transitionSpeed / 2; 1601 1602 if (fx == "strip-up-down-right") 1603 $strips = $(".md-slider-title", this.slider).reverse(); 1604 1605 $strips.filter(":odd").css({ 1606 height: "100%", 1607 bottom: 0, 1608 top: "auto", 1609 opacity: 1 1610 }).end().filter(":even").css({ 1611 height: "100%", 1612 bottom: "auto", 1613 top: 0, 1614 opacity: 1 1615 }); 1616 $strips.each(function (i) { 1617 var $strip = $(this), 1618 css = (i % 2 == 0) ? { 1619 top: "-50%", 1620 opacity: 0 1621 }
1621 : {bottom: "-50%", opacity: 0}; 1622 1623 setTimeout( 1624 function () { 1625 $strip.animate(css, speed, "easeOutQuint", function () { 1626 if (i == self.options.stripCols - 1) 1627 self.transitionEnd(); 1628 }); 1629 }, 1630 i * timeStep 1631 ); 1632 }); 1633 break; 1634 case "left-curtain": 1635 this.addTiles(this.options.stripCols, 1, this.active); 1636 var $strips = $(".md-slider-title", this.slider), 1637 stripItemWidth = this.getWidthStripItem(), 1638 _self = this, 1639 timeStep = transitionSpeed / this.options.stripCols / 2; 1640 1641 $strips.each(function (i) { 1642 var $strip = $(this); 1643 var width = (i == _self.options.stripCols - 1) ? stripItemWidth.last : stripItemWidth.normal, 1644 left = (i == _self.options.stripCols - 1) ? (_self.width - stripItemWidth.last) : (width * i); 1645 $strip.css({left: left, width: 0, opacity: 0}); 1646 setTimeout( 1647 function () { 1648 $strip.animate({ 1649 width: width, 1650 opacity: 1 1651 }, transitionSpeed / 2, function () { 1652 if (i == self.options.stripCols - 1) 1653 self.transitionEnd(); 1654 }); 1655 }, 1656 timeStep * i 1657 ); 1658 }); 1659 break; 1660 case "right-curtain": 1661 this.addTiles(this.options.stripCols, 1, this.active); 1662 1663 var $strips = $(".md-slider-title", this.slider).reverse(), 1664 stripItemWidth = this.getWidthStripItem(), 1665 _self = this, 1666 timeStep = transitionSpeed / this.options.stripCols / 2;
1667 //right-curtain neu de item cuoi cung co width la last thi js transition se chuyen cai last nay thanh first va gay loi 1668 //vay nen ta lam nguoc lai, cho item first chua width last 1669 $strips.each(function (i) { 1670 var $strip = $(this); 1671 var width = (i == 0) ? stripItemWidth.last : stripItemWidth.normal, 1672 right = i ? ((width * (i -1)) + stripItemWidth.last) : 0; 1673 $strip.css({ 1674 right: right, 1675 left: "auto", 1676 width: 0, 1677 opacity: 0 1678 }); 1679 setTimeout( 1680 function () { 1681 $strip.animate({ 1682 width: width, 1683 opacity: 1 1684 }, transitionSpeed / 2, function () { 1685 if (i == self.options.stripCols - 1) 1686 self.transitionEnd(); 1687 }); 1688 }, 1689 timeStep * i 1690 ); 1691 }); 1692 break; 1693 case "top-curtain": 1694 this.addTiles(1, this.options.stripRows, this.active); 1695 1696 var $strips = $(".md-slider-title", this.slider), 1697 stripItemHeight = this.getHeightStripItem(), 1698 _self = this, 1699 timeStep = transitionSpeed / this.options.stripRows / 2; 1700 1701 $strips.each(function (i) { 1702 var $strip = $(this); 1703 var height = (i == _self.options.stripRows - 1) ? stripItemHeight.last : stripItemHeight.normal, 1704 top = (i == _self.options.stripRows - 1) ? (_self.height - stripItemHeight.last) : (height * i); 1705 $strip.css({top: top, height: 0, opacity: 0}); 1706 setTimeout( 1707 function () { 1708 $strip.animate({ 1709 height: height, 1710 opacity: 1 1711 }, transitionSpeed / 2, function () { 1712 if (i == self.options.stripRows - 1) 1713 self.transitionEnd(); 1714 }); 1715 }, 1716 timeStep * i 1717 ); 1718 }); 1719 break; 1720 case "bottom-curtain": 1721 this.addTiles(1, this.options.stripRows, this.active); 1722 var $strips = $(".md-slider-title", this.slider).reverse(), 1723 stripItemHeight = this.getHeightStripItem(), 1724 _self = this, 1725 timeStep = transitionSpeed / this.options.stripRows / 2;
1726 //bottom-curtain neu de item cuoi cung co height la last thi js transition se chuyen cai last nay thanh first va gay loi 1727 //vay nen ta lam nguoc lai, cho item first chua height last 1728 $strips.each(function (i) { 1729 var $strip = $(this); 1730 var height = (i == 0) ? stripItemHeight.last : stripItemHeight.normal, 1731 bottom = i ? ((height * (i -1)) + stripItemHeight.last) : 0; 1732 $strip.css({bottom: bottom, height: 0, opacity: 0}); 1733 setTimeout( 1734 function () { 1735 $strip.animate({ 1736 height: height, 1737 opacity: 1 1738 }, transitionSpeed / 2, function () { 1739 if (i == self.options.stripRows - 1) 1740 self.transitionEnd(); 1741 }); 1742 }, 1743 timeStep * i 1744 ); 1745 }); 1746 break; 1747 case "slide-in-right": 1748 this.addStrips2(); 1749 1750 var $strips = $(".md-slider-strip", this.slider); 1751 1752 $strips.each(function (i) { 1753 var left = i * self.width, 1754 $strip = $(this); 1755 1756 $strip.css({left: left}).animate({left: left - self.width}, transitionSpeed, function () { 1757 self.transitionEnd(); 1758 }); 1759 }); 1760 break; 1761 case "slide-in-left": 1762 this.addStrips2(); 1763 var $strips = $(".md-slider-strip", this.slider); 1764 1765 $strips.each(function (i) { 1766 var left = -i * self.width, 1767 $strip = $(this); 1768 1769 $strip.css({left: left}).animate({left: self.width + left}, transitionSpeed * 2, function () { 1770 self.transitionEnd(); 1771 }); 1772 }); 1773 break; 1774 case "slide-in-up": 1775 this.addStrips2(); 1776 var $strips = $(".md-slider-strip", this.slider); 1777 1778 $strips.each(function (i) { 1779 var top = i * self.height, 1780 $strip = $(this); 1781 1782 $strip.css({top: top}).animate({top: top - self.height}, transitionSpeed, function () { 1783 self.transitionEnd(); 1784 }); 1785 }); 1786 break; 1787 case "slide-in-down": 1788 this.addStrips2(); 1789 var $strips = $(".md-slider-strip", this.slider); 1790 1791 $strips.each(function (i) { 1792 var top = -i * self.height, 1793 $strip = $(this); 1794 1795 $strip.css({top: top}).animate({top: self.height + top}, transitionSpeed, function () { 1796 self.transitionEnd(); 1797 }); 1798 }); 1799 break; 1800 case "fade": 1801 default: 1802 this.addStrips(false, {strips: 1}); 1803 1804 var $strip = $(".md-slider-strip:first", this.slider); 1805 1806 $strip.css({height: "100%", width: self.width}); 1807 if (fx == "slide-in-right") 1808 $strip.css({ 1809 height: "100%", 1810 width: self.width + "px", 1811 left: self.width + "px", 1812 right: "auto" 1813 }); 1814 else if (fx == "slide-in-left") 1815 $strip.css({ 1816 left: "-" + self.width + "px" 1817 }); 1818 1819 $strip.animate({ 1820 left: 0, 1821 opacity: 1 1822 }, transitionSpeed, function () { 1823 self.transitionEnd(); 1824 }); 1825 break; 1826 } 1827 }, 1828 getWidthStripItem: function(){ 1829 var width = this.width / this.options.stripCols, 1830 result = {}; 1831 result.normal = Math.round(width); 1832 result.last = this.width - (result.normal * (this.options.stripCols - 1)); 1833 return result; 1834 }, 1835 getHeightStripItem: function(){ 1836 var height = this.height / this.options.stripRows, 1837 result = {}; 1838 result.normal = Math.round(height); 1839 result.last = this.height - (result.normal * (this.options.stripRows - 1)); 1840 return result; 1841 }, 1842 addSlit: function (fx) {
1843 var $slitContainer = $('<div class="md-strips-container ' + fx + '"></div>'), 1844 $image = $(".md-main-img img", this.slides[this.prev]).length ? $(".md-main-img img", this.slides[this.prev]) : $(".md-main-img ", this.slides[this.prev]), 1845 $div1 = $('<div class="md-slider-slit"/>').append($image.clone()), 1846 position = $image.position(), 1847 $div2 = $('<div class="md-slider-slit"/>').append($image.clone().css("top", position.top - (this.height / 2) + "px")); 1848 if (fx == "slit-vertical-down" || fx == "slit-vertical-up") 1849 $div2 = $('<div class="md-slider-slit"/>').append($image.clone().css("left", position.left - (this.width / 2) + "px")); 1850 1851 $slitContainer.append($div1).append($div2); 1852 this.slider.append($slitContainer); 1853 }, 1854 addStrips: function (vertical, opts) { 1855 var $strip, 1856 opts = (opts) ? opts : this.options, 1857 stripsContainer = $('<div class="md-strips-container"></div>'), 1858 stripWidth = Math.round(this.width / opts.strips), 1859 stripHeight = Math.round(this.height / opts.strips), 1860 $image = $(".md-main-img img", this.slides[this.active]); 1861 1862 for (var i = 0; i < opts.strips; i++) { 1863 var top = ((vertical) ? (stripHeight * i) + "px" : 0), 1864 left = ((vertical) ? 0 : (stripWidth * i) + "px"), 1865 width, 1866 height; 1867 1868 if (i == opts.strips - 1) { 1869 width = ((vertical) ? 0 : (this.width - (stripWidth * i)) + "px"); 1870 height = ((vertical) ? (this.height - (stripHeight * i)) + "px" : 0); 1871 } 1872 else { 1873 width = ((vertical) ? 0 : stripWidth + "px"); 1874 height = ((vertical) ? stripHeight + "px" : 0); 1875 } 1876 1877 $strip = $('<div class="md-slider-strip"></div>').css({ 1878 width: width, 1879 height: height, 1880 top: top, 1881 left: left, 1882 opacity: 0 1883 }); 1884 $strip.append($image.clone().css({ 1885 marginLeft: vertical ? 0 : -(i * stripWidth) + "px", 1886 marginTop: vertical ? -(i * stripHeight) + "px" : 0 1887 })); 1888 stripsContainer.append($strip); 1889 } 1890 this.slider.append(stripsContainer); 1891 }, 1892 addStrips2: function () { 1893 var $strip, 1894 images = [this.slides[this.prev].children(), $(".md-main-img img", this.slides[this.active])];
1895 var stripsContainer = $('<div class="md-strips-container"></div>'); 1896 for (var i = 0; i < 2; i++) { 1897 var cloneHtml = images[i].clone(); 1898 if(i == 0){ 1899 $('.md-object', cloneHtml).removeClass(effectsIn.join(" ")); 1900 } 1901 $strip = $('<div class="md-slider-strip"></div>').css({ 1902 width: this.width, 1903 height: this.height 1904 }).append(cloneHtml); 1905 stripsContainer.append($strip); 1906 } 1907 this.slider.append(stripsContainer); 1908 }, 1909 addTiles: function (x, y, index) { 1910 var $title, 1911 $stripsContainer = $('<div class="md-strips-container"></div>'), 1912 titleWidth = this.width / x, 1913 titleHeight = this.height / y, 1914 $image = $(".md-main-img img", this.slides[index]), 1915 specialHeight = 0, 1916 specialWidth = 0; 1917 1918 if ($image.length == 0) 1919 $image = $(".md-main-img", this.slides[index]); 1920 1921 // fix make round width height 1922 if(x > 1){ 1923 var titleWidthRound = Math.round(titleWidth); 1924 specialWidth = titleWidthRound - titleWidth; 1925 titleWidth = titleWidthRound; 1926 }else if(y > 1){ 1927 var titleHeightRound = Math.round(titleHeight); 1928 specialHeight = titleHeightRound - titleHeight; 1929 titleHeight = titleHeightRound; 1930 } 1931 1932 for (var i = 0; i < y; i++) { 1933 for (var j = 0; j < x; j++) { 1934 var top = (titleHeight * i) + 'px', 1935 left = (titleWidth * j) + 'px'; 1936 1937 // fix increase / decrease with/height in last col / last row 1938 if(x > 1 && specialWidth && j === (x-1)){ 1939 var titleWidthNew = titleWidth - x * specialWidth; 1940 left = (x-1)*titleWidth + 'px'; 1941 titleWidth = titleWidthNew; 1942 } 1943 else if(y > 1 && specialHeight && i == (y-1)){ 1944 var titleHeightNew = titleHeight - y * specialHeight; 1945 top = (y-1)*titleHeight + 'px'; 1946 titleHeight = titleHeightNew; 1947 } 1948 1949 $title = $('<div class="md-slider-title"/>').css({ 1950 width: titleWidth, 1951 height: titleHeight, 1952 top: top, 1953 left: left 1954 }); 1955 $title.append($image.clone().css({ 1956 marginLeft: "-" + left, 1957 marginTop: "-" + top 1958 })); 1959 1960 $stripsContainer.append($title); 1961 } 1962 } 1963 this.slider.append($stripsContainer); 1964 }, 1965 transitionEnd: function () { 1966 this.options.onEndTransition.call(this.slider); 1967 $(".md-strips-container", this.slider).remove(); 1968 if (this.numberSlides != 1) 1969 this.slides[this.prev].hide(); 1970 this.slides[this.active].show(); 1971 this.playSlideItems(); 1972 }, 1973 setCurrent: function () { 1974 if (this.options.enableBullet) 1975 $("div.md-bullet:eq(" + this.active + ")", this.wrap).addClass("md-current"); 1976 if (this.enableThumbnail && !this.options.enableBullet) 1977 $("a:eq(" + this.active + ")", this.wrap).addClass("md-current"); 1978 this.scrollThumbnail(""); 1979 }, 1980 removeLoader: function() { 1981 $('.wrap-loader-slider').addClass('fadeOut'); 1982 $('.md-slide-items').css('min-height',''); 1983 } 1984 } 1985 $.fn.mdSlider = function (options) { 1986 return new MDSlider($(this), options); 1987 } 1988 $.fn.reverse = [].reverse; 1989})(jQuery); 1990 1991(function($) { 1992 var MDVideoBox = function($element, slider, options) { 1993 var default_options = { 1994 videoWidth: 640, 1995 videoHeight: 350, 1996 overlay: 0.8, 1997 onClick: function(){} 1998 }; 1999 2000 this.video = $element; 2001 this.slider = slider; 2002 this.options = $.extend(default_options, options); 2003 this.height = this.options.videoHeight; 2004 this.width = this.options.videoWidth; 2005 2006 this.init(); 2007 } 2008 2009 MDVideoBox.prototype = { 2010 constructor: MDVideoBox, 2011 init: function() { 2012 var self = this; 2013 2014 if($("#md-overlay").length == 0) { 2015 $("body").append('<div id="md-overlay" class="md-overlay" style="display: none"></div>'); 2016 $("body").append('<div id="md-video-container" class="md-video-container" style="display: none"><div id="md-video-embed"></div><div class="md-description clearfix"><div class="md-caption"></div><a id="md-close-btn" class="md-close-btn" href="#"></a></div></div>'); 2017 } 2018 2019 this.video.click(function() { 2020 self.open(); 2021 return false;
2022 }); 2023 2024 $("#md-overlay").click(function() { 2025 self.close(); 2026 }); 2027 2028 $("#md-video-container #md-close-btn").click(function() { 2029 self.close(); 2030 }); 2031 2032 $(window).resize(function() { 2033 self.resize(); 2034 }); 2035 $(window).keydown(function(event) { 2036 var key = event.keyCode || event.which; 2037 2038 if (key == 27) 2039 self.close(); 2040 }); 2041 }, 2042 open: function() { 2043 var self = this, 2044 $videoContainer = $("#md-video-container"); 2045 2046 // Pause slide 2047 $videoContainer.hover( 2048 function() { 2049 self.slider.pauseSlide(); 2050 }, 2051 function() {} 2052 ); 2053 $("#md-video-embed", $videoContainer).hover( 2054 function() { 2055 self.slider.pauseSlide(); 2056 }, 2057 function() {} 2058 ); 2059 2060 // Invoke custom on click video element callback 2061 this.options.onClick.call(this.video); 2062 2063 // Implements set size for video box elements 2064 var docWidth = $(window).width(), 2065 docHeight = $(window).height(); 2066 2067 if (docWidth < this.options.videoWidth) { 2068 this.width = docWidth; 2069 this.height = this.options.videoHeight * docWidth / this.options.videoWidth; 2070 2071 if (docHeight < this.height) { 2072 this.width = docHeight*this.options.videoWidth/this.options.videoHeight; 2073 this.height = docHeight; 2074 } 2075 } 2076 $("#md-video-embed", $videoContainer).css({width: this.width + "px", height: this.height + "px"}).addClass("md-loading"); 2077 $(window).trigger("resize"); 2078 2079 $videoContainer.show(); 2080 $(".md-caption", $videoContainer).html(this.video.attr("title")); 2081 $("#md-overlay").show().fadeTo("fast", this.options.opacity); 2082 $("#md-video-embed", $videoContainer).fadeIn("slow", function() { 2083 var $videoFrame = $('<iframe frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>'), 2084 videoSrc = self.video.attr("href") + '?autoplay=1'; 2085 2086 $videoFrame.attr("src", videoSrc); 2087 $videoFrame.css({width: self.width, height: self.height}); 2088 $("#md-video-embed", $videoContainer).append($videoFrame); 2089 }); 2090 }, 2091 close: function() { 2092 $("#md-overlay").fadeOut("fast"); 2093 $("#md-video-embed").html(""); 2094 $("#md-video-container").hide(); 2095 return false; 2096 }, 2097 resize: function() { 2098 var docWidth = $(window).width(), 2099 docHeight = $(window).height(); 2100 2101 $("#md-video-container").css({left: (docWidth - this.width)/2 + "px", top: (docHeight - this.height)/2 + "px"}); 2102 $("#md-overlay").css({width: docWidth, height: docHeight}); 2103 } 2104 } 2105 $.fn.mdVideoBox = function(slider, options) { 2106 return new MDVideoBox($(this), slider, options); 2107 } 2108})(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.