1(function($) { 2 'use strict'; 3 function mk_animated_cols() { 4 function equalheight (container){ 5 var currentTallest = 0, 6 currentRowStart = 0, 7 rowDivs = new Array(), 8 $el, 9 topPosition = 0; 10 $(container).each(function() { 11 12 $el = $(this); 13 $($el).height('auto'); 14 topPosition = $el.position().top; 15 16 if (currentRowStart != topPosition) { 17 for (var currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) { 18 rowDivs[currentDiv].height(currentTallest); 19 } 20 rowDivs.length = 0; // empty the array 21 currentRowStart = topPosition; 22 currentTallest = $el.height(); 23 rowDivs.push($el); 24 } else { 25 rowDivs.push($el); 26 currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest); 27 } 28 for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) { 29 rowDivs[currentDiv].height(currentTallest); 30 } 31 32 }); 33 34 // console.log('recalc' + container + ' ' + currentTallest); 35 36 return currentTallest; 37 } 38 39 40 function prepareCols(el) { 41 var $this = el.parent().parent().find('.mk-animated-columns'); 42 43 var iconHeight = equalheight('.vc_row .animated-column-icon, .animated-column-holder .mk-svg-icon'), 44 titleHeight = equalheight('.vc_row .animated-column-title'), 45 descHeight = equalheight('.vc_row .animated-column-desc'), 46 btnHeight = $this.find('.animated-column-btn').innerHeight(); 47 48 if ($this.hasClass('full-style')) { 49 $this.find('.animated-column-item').each(function() { 50 var $this = $(this), 51 contentHeight = (iconHeight + 30) + (titleHeight + 10) + (descHeight + 70) + 34; 52 /* 53 * Fix AM-2418. 54 * 55 * Column height setting of VC Animated Column doesn't work when Animated Column 56 * content is higher than the setting. So, check column height setting first. 57 * - If the column height setting < Animated Column height, update the column 58 * height based on column height setting. 59 */ 60 var $columnHeight = contentHeight * 1.5 + 50; 61 var $minHeight = parseInt( $this.css( 'min-height' ), 10 ); 62 if ( ! isNaN( $minHeight ) ) { 63 if ( $minHeight < $columnHeight ) { 64 $columnHeight = $minHeight; 65 } 66 } 67 68 $this.height( $columnHeight ); 69 70 var $box_height = $this.outerHeight(true), 71 $icon_height = $this.find('.animated-column-icon, .animated-column-holder .mk-svg-icon').height(); 72 73 $this.find('.animated-column-holder').css({ 74 'paddingTop': $box_height / 2 - $icon_height 75 }); 76 77 78 $this.animate({opacity:1}, 300); 79 }); 80 } else { 81 $this.find('.animated-column-item').each(function() { 82 var $this = $(this), 83 halfHeight = $this.height() / 2, 84 halfIconHeight = $this.find('.animated-column-icon, .animated-column-holder .mk-svg-icon').height()/2, 85 halfTitleHeight = $this.find('.animated-column-simple-title').height()/2; 86 87 $this.find('.animated-column-holder').css({ 88 'paddingTop': halfHeight - halfIconHeight 89 }); 90 91 $this.find('.animated-column-title').css({ 92 'paddingTop': halfHeight - halfTitleHeight 93 }); 94 95 $this.animate({ 96 opacity:1 97 }, 300); 98 99 }); 100 } 101 } 102 103 $('.mk-animated-columns').each(function() { 104 var that = this; 105 MK.core.loadDependencies([ MK.core.path.plugins + 'tweenmax.js' ], function() { 106 var $this = $(that), 107 $parent = $this.parent().parent(), 108 $columns = $parent.find('.column_container'), 109 index = $columns.index($this.parent()); 110 // really bad that we cannot read it before bootstrap - needs full shortcode refactor 111 112 if($this.hasClass('full-style')) { 113 $this.find('.animated-column-item').hover( 114 function() { 115 TweenLite.to($(this).find(".animated-column-holder"), 0.5, { 116 top: '-15%', 117 ease: Back.easeOut 118 }); 119 TweenLite.to($(this).find(".animated-column-desc"), 0.5, { 120 top: '50%', 121 ease: Expo.easeOut 122 }, 0.4); 123 TweenLite.to($(this).find(".animated-column-btn"), 0.3, { 124 top: '50%', 125 ease: Expo.easeOut 126 }, 0.6); 127 }, 128 function() { 129 130 TweenLite.to($(this).find(".animated-column-holder"), 0.5, { 131 top: '0%', 132 ease: Back.easeOut, easeParams:[3] 133 }); 134 TweenLite.to($(this).find(".animated-column-desc"), 0.5, { 135 top: '100%', 136 ease: Back.easeOut 137 }, 0.4); 138 TweenLite.to($(this).find(".animated-column-btn"), 0.5, { 139 top: '100%', 140 ease: Back.easeOut 141 }, 0.2); 142 }); 143 } 144 145 if($this.hasClass('simple-style')) { 146 $this.find('.animated-column-item').hover( 147 function() { 148 TweenLite.to($(this).find(".animated-column-holder"), 0.7, { 149 top: '100%', 150 ease: Expo.easeOut 151 }); 152 TweenLite.to($(this).find(".animated-column-title"), 0.7, { 153 top: '0%', 154 ease: Back.easeOut 155 }, 0.2); 156 }, 157 function() { 158 TweenLite.to($(this).find(".animated-column-holder"), 0.7, { 159 top: '0%', 160 ease: Expo.easeOut 161 }); 162 TweenLite.to($(this).find(".animated-column-title"), 0.7, { 163 top: '-100%', 164 ease: Back.easeOut 165 }, 0.2); 166 }); 167 } 168 169 if($columns.length === index + 1) { 170 prepareCols($this); 171 $(window).on("resize", function() { 172 setTimeout(prepareCols($this), 1000); 173 }); 174 } 175 176 MK.utils.eventManager.subscribe('iconsInsert', function() { 177 prepareCols($this); 178 }); 179 }); 180 181 }); 182 } 183 184 $(window).on('load vc_reload', mk_animated_cols); 185 186}(jQuery)); 187 188(function($) { 189 'use strict'; 190 191 var core = MK.core, 192 path = MK.core.path; 193 194 MK.component.BannerBuilder = function( el ) { 195 var init = function(){ 196 var $this = $(el), 197 data = $this.data( 'bannerbuilder-config' ); 198 199 MK.core.loadDependencies([ MK.core.path.plugins + 'jquery.flexslider.js' ], function() { 200 $this.flexslider({ 201 selector: '.mk-banner-slides > .mk-banner-slide', 202 animation: data.animation, 203 smoothHeight: false, 204 direction:'horizontal', 205 slideshow: true, 206 slideshowSpeed: data.slideshowSpeed, 207 animationSpeed: data.animationSpeed, 208 pauseOnHover: true, 209 directionNav: data.directionNav, 210 controlNav: false, 211 initDelay: 2000,
212 prevText: '', 213 nextText: '', 214 pauseText: '', 215 playText: '' 216 }); 217 }); 218 }; 219 220 return { 221 init : init 222 }; 223 }; 224 225})(jQuery); 226 227 228 229 230 231 232 233 234(function($) { 235 'use strict'; 236 237 var _toBuild = []; 238 MK.api = window.MK.api || {}; 239 240 MK.component.AdvancedGMaps = function(el) { 241 var $this = $(el), 242 container = document.getElementById( 'mk-theme-container' ), 243 data = $this.data( 'advancedgmaps-config' ), 244 apikey = data.options.apikey ? ('key='+data.options.apikey+'&') : false, 245 map = null, 246 bounds = null, 247 infoWindow = null, 248 position = null; 249 250 var build = function() { 251 data.options.scrollwheel = false; 252 data.options.mapTypeId = google.maps.MapTypeId[data.options.mapTypeId]; 253 data.options.styles = data.style; 254 255 bounds = new google.maps.LatLngBounds(); 256 map = new google.maps.Map(el, data.options); 257 infoWindow = new google.maps.InfoWindow(); 258 259 map.setOptions({ 260 panControl : data.options.panControl, 261 draggable: data.options.draggable, 262 zoomControl: data.options.zoomControl, 263 mapTypeControl: data.options.scaleControl, 264 scaleControl: data.options.mapTypeControl, 265 }); 266 267 var marker, i; 268 269 map.setTilt(45); 270 271 for (i = 0; i < data.places.length; i++) { 272 if(data.places[i].latitude && data.places[i].longitude) { 273 position = new google.maps.LatLng(data.places[i].latitude, data.places[i].longitude); 274 275 bounds.extend(position); 276 277 marker = new google.maps.Marker({ 278 position: position, 279 map: map, 280 title: data.places[i].address, 281 icon: (data.places[i].marker) ? data.places[i].marker : data.icon 282 }); 283 284 285 google.maps.event.addListener(marker, 'click', (function(marker, i) { 286 return function() { 287 if(data.places[i].address && data.places[i].address.length > 1) { 288 infoWindow.setContent('<div class="info_content"><p>'+ data.places[i].address +'</p></div>'); 289 infoWindow.open(map, marker); 290 } else { 291 infoWindow.setContent(''); 292 infoWindow.close(); 293 } 294 }; 295 })(marker, i)); 296 297 /** 298 * If there is only one marker, map.fitBounds will zoom-in too much. 299 * Only run map.fitBounds if the markers are more than 1. Use setCenter 300 * instead if the the marker is only 1. 301 */ 302 if ( i > 0 ) { 303 map.fitBounds( bounds ); 304 } else { 305 // Set latitude and longtitude as float. 306 var latLang = { 307 lat: parseFloat( data.places[i].latitude ), 308 lng: parseFloat( data.places[i].longitude ) 309 }; 310 map.setCenter( latLang ); 311 // Need to setZoom here as we didn't trigger bounds_changed event. 312 map.setZoom( data.options.zoom ); 313 } 314 } 315 } 316 317 var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) { 318 this.setZoom(data.options.zoom); 319 google.maps.event.removeListener(boundsListener); 320 }); 321 322 323 var update = function() { 324 google.maps.event.trigger(map, "resize"); 325 map.setCenter(position); 326 }; 327 update(); 328 329 330 var bindEvents = function() { 331 $( window ).on( 'resize', update ); 332 window.addResizeListener( container, update ); 333 }; 334 bindEvents(); 335 }; 336 337 338 var initAll = function() { 339 for( var i = 0, l = _toBuild.length; i < l; i++ ) { 340 _toBuild[i](); 341 } 342 }; 343 344 MK.api.advancedgmaps = MK.api.advancedgmaps || function() { 345 initAll(); 346 }; 347 348 return { 349 init : function() { 350 _toBuild.push( build ); 351 MK.core.loadDependencies(['https://maps.googleapis.com/ma
351ps/api/js?'+apikey+'callback=MK.api.advancedgmaps']); 352 } 353 }; 354 355 }; 356 357})(jQuery); 358(function($) { 359 'use strict'; 360 361 var zIndex = 0; 362 363 $('.mk-newspaper-wrapper').on('click', '.blog-loop-comments', function (event) { 364 event.preventDefault(); 365 366 var $this = $(event.currentTarget); 367 var $parent = $this.parents('.mk-blog-newspaper-item'); 368 369 $parent.css('z-index', ++zIndex); 370 $this.parents('.newspaper-item-footer').find('.newspaper-social-share').slideUp(200).end().find('.newspaper-comments-list').slideDown(200); 371 setTimeout( function() { 372 MK.utils.eventManager.publish('item-expanded'); 373 }, 300); 374 }); 375 376 $('.mk-newspaper-wrapper').on('click', '.newspaper-item-share', function (event) { 377 event.preventDefault(); 378 379 var $this = $(event.currentTarget); 380 var $parent = $this.parents('.mk-blog-newspaper-item'); 381 382 $parent.css('z-index', ++zIndex); 383 $this.parents('.newspaper-item-footer').find('.newspaper-comments-list').slideUp(200).end().find('.newspaper-social-share').slideDown(200); 384 setTimeout( function() { 385 MK.utils.eventManager.publish('item-expanded'); 386 }, 300); 387 }); 388 389 var init = function init() { 390 391 // setTimeout Trick to make the VC Front Editor to load the images as well 392 setTimeout( function() { 393 394 // Get All Related Layers 395 var $blog = $('.mk-blog-container'); 396 var $imgs = $blog.find('img[data-mk-image-src-set]'); 397 398 if ( $blog.hasClass('mk-blog-container-lazyload') && $imgs.length ) { 399 400 // Load Images if the user scrolls to them 401 $(window).on('scroll.mk_blog_lazyload', MK.utils.throttle(500, function(){ 402 $imgs.each(function(index, elem) { 403 if ( MK.utils.isElementInViewport(elem) ) { 404 MK.component.ResponsiveImageSetter.init( $(elem) ); 405 $imgs = $imgs.not( $(elem) ); // Remove element from the list when loaded to reduce the amount of iteration in each() 406 } 407 }); 408 })); 409 410 $(window).trigger('scroll.mk_blog_lazyload'); 411 $(window).trigger('resize') 412 413 // Handle the resize 414 MK.component.ResponsiveImageSetter.onResize($imgs); 415 416 } else { 417 418 MK.component.ResponsiveImageSetter.init($imgs); 419 MK.component.ResponsiveImageSetter.onResize($imgs); 420 421 } 422 423 }, 50); 424 425 // If in VC Editor Page, Trigger Resize after 2 second (AM-2490) 426 // This is to fix the Pagination Overlapping issue on first initial blog insert as it takes VC about 1 second to change the Blog Layout on initial stage 427 if ( $('body').hasClass('vc_editor') ) { 428 setTimeout( function() { 429 $(window).trigger('resize'); 430 }, 2000) 431 } 432 433 $('.featured-image').on('click', function (event) { 434 var $this = $(event.currentTarget); 435 436 if ( 437 $this.parents('.mk-jupiter-blog').length === 0 || 438 $this.parents( '.mk-blog-spotlight-item' ).length !== 0 439 ) { 440 return; 441 } 442 443 window.location.href = $this.find('.post-type-badge').attr('href'); 444 }) 445 } 446 447 init(); 448 449 // VC Front-End Editor 450 $(window).on('vc_reload mk-image-loaded', init); 451 452}(jQuery)); 453 454(function($) { 455 'use strict'; 456 457 var core = MK.core, 458 path = MK.core.path; 459 460 // TODO: Repair after Rifat. He repeated The same code twice - other same code is in photoalbum (why by the way?!). 461 // Split it into two separate components when you see reusage 462 MK.component.Category = function( el ) { 463 var init = function(){ 464 core.loadDependencies([ path.plugins + 'pixastic.js' ], function() { 465 blurImage($('.blur-image-effect .mk-loop-item .item-holder ')); 466 }); 467 468 core.loadDependencies([ path.plugins + 'minigrid.js' ], masonry); 469 }; 470 471 var blurImage = function($item) { 472 return $item.each(function() { 473 var $_this = $(this); 474 475 var img = $_this.find('.item-thumbnail'); 476 477 img.clone().addClass("blur-effect item-blur-thumbnail").removeClass('item-thumbnail').prependTo(this); 478 479 var blur_this = $(".blur-effect", this); 480 blur_this.each(function(index, element){ 481 if (img[index].complete === true) { 482 Pixastic.process(blur_this[index], "blurfast", {amount:0.5}); 483 } 484 else { 485 blur_this.load(function () { 486 Pixastic.process(blur_this[index], "blurfast", {amount:0.5}); 487 }); 488 } 489 }); 490 }); 491 }; 492
493 // TODO: find other shortcodes like this design and make it as a component 494 var masonry = function() { 495 if(!$('.js-masonry').length) return; 496 497 function grid() { 498 minigrid({ 499 container: '.js-masonry', 500 item: '.js-masonry-item', 501 gutter: 0 502 }); 503 } 504 505 grid(); 506 $(window).on('resize', grid); 507 }; 508 509 return { 510 init : init 511 }; 512 }; 513 514})(jQuery); 515 516 517 518 519 520 521 522 523(function($) { 524 'use strict'; 525 526 var core = MK.core, 527 path = core.path; 528 529 MK.component.Chart = function(el) { 530 var init = function() { 531 MK.core.loadDependencies([MK.core.path.plugins + 'jquery.easyPieChart.js'], function() { 532 $('.mk-chart__chart').each(function() { 533 var $this = $(this), 534 $parent_width = $(this).parent().width(), 535 $chart_size = parseInt($this.attr('data-barSize')); 536 537 if ($parent_width < $chart_size) { 538 $chart_size = $parent_width !== 0 ? $parent_width : $chart_size; 539 $this.css('line-height', $chart_size); 540 $this.find('i').css({ 541 'line-height': $chart_size + 'px' 542 }); 543 $this.css({ 544 'line-height': $chart_size + 'px' 545 }); 546 } 547 548 var build = function() { 549 $this.easyPieChart({ 550 animate: 1300, 551 lineCap: 'butt', 552 lineWidth: $this.attr('data-lineWidth'), 553 size: $chart_size, 554 barColor: $this.attr('data-barColor'), 555 trackColor: $this.attr('data-trackColor'), 556 scaleColor: 'transparent', 557 onStep: function(value) { 558 this.$el.find('.chart-percent span').text(Math.ceil(value)); 559 } 560 }); 561 }; 562 563 // refactored only :in-viewport logic. rest is to-do 564 MK.utils.scrollSpy(this, { 565 position: 'bottom', 566 after: build 567 }); 568 }); 569 }); 570 }; 571 572 return { 573 init: init 574 }; 575 }; 576 577})(jQuery); 578 579(function($) { 580 "use strict"; 581 582 $('.mk-clients.column-style').each(function() { 583 var $group = $(this), 584 $listItems = $group.find('li'), 585 listItemsCount = $listItems.length, 586 listStyle = $group.find('ul').attr('style') || '', 587 fullRowColumnsCount = $group.find('ul:first-of-type li').length; 588 589 function recreateGrid() { 590 var i; 591 592 $listItems.unwrap(); 593 594 if (window.matchMedia('(max-width: 550px)').matches && fullRowColumnsCount >= 1) { 595 for (i = 0; i < listItemsCount; i += 1) { 596 $listItems.slice(i, i + 1) 597 .wrapAll('<ul class="mk-clients-fixed-list" style="' + listStyle + '"></ul>'); 598 } 599 } else if (window.matchMedia('(max-width: 767px)').matches && fullRowColumnsCount >= 2) { 600 for (i = 0; i < listItemsCount; i += 2) { 601 $listItems.slice(i, i + 2) 602 .wrapAll('<ul class="mk-clients-fixed-list" style="' + listStyle + '"></ul>'); 603 } 604 } else if (window.matchMedia('(max-width: 960px)').matches && fullRowColumnsCount >= 3) { 605 for (i = 0; i < listItemsCount; i += 3) { 606 $listItems.slice(i, i + 3) 607 .wrapAll('<ul class="mk-clients-fixed-list" style="' + listStyle + '"></ul>'); 608 } 609 } else { 610 for (i = 0; i < listItemsCount; i += fullRowColumnsCount) { 611 $listItems.slice(i, i + fullRowColumnsCount) 612 .wrapAll('<ul style="' + listStyle + '"></ul>'); 613 } 614 } 615 } 616 617 recreateGrid(); 618 $(window).on('resize', recreateGrid); 619 620 }); 621 622}(jQuery)); 623(function($) { 624 'use strict'; 625 // Update countdown style in VC FEE - AM-2684. 626 $(window).on('vc_reload', function() { 627 $('.mk-event-countdown-ul').each(function() { 628 if ($(this).width() < 750) { 629 $(this).addClass('mk-event-countdown-ul-block'); 630 } else { 631 $(this).removeClass('mk-event-countdown-ul-block'); 632 } 633 }); 634 }); 635})(jQuery); 636(function($) { 637 'use strict'; 638 639 $('.mk-edge-slider').find('video').each(function() { 640 this.pause(); 641 this.currentTime = 0; 642 }); 643
644 MK.component.EdgeSlider = function( el ) { 645 var self = this, 646 $this = $( el ), 647 $window = $(window), 648 $wrapper = $this.parent(), 649 config = $this.data( 'edgeslider-config' ), 650 $nav = $( config.nav ), 651 $prev = $nav.find( '.mk-edge-prev' ), 652 $prevTitle = $prev.find( '.nav-item-caption' ), 653 $prevBg = $prev.find('.edge-nav-bg'), 654 $next = $nav.find( '.mk-edge-next' ), 655 $nextTitle = $next.find( '.nav-item-caption' ), 656 $nextBg = $next.find('.edge-nav-bg'), 657 $navBtns = $nav.find( 'a' ), 658 $pagination = $( '.swiper-pagination' ), 659 $skipBtn = $( '.edge-skip-slider' ), 660 $opacityLayer = $this.find('.edge-slide-content'), 661 $videos = $this.find('video'), 662 currentSkin = null, 663 currentPoint = null, 664 winH = null, 665 opacity = null, 666 offset = null; 667 668 var callbacks = { 669 onInitialize : function( slides ) { 670 self.$slides = $( slides ); 671 672 self.slideContents = $.map( self.$slides, function( slide ) { 673 var $slide = $( slide ), 674 title = $slide.find('.edge-slide-content .edge-title').first().text(), 675 skin = $slide.attr("data-header-skin"), 676 image = $slide.find('.mk-section-image').attr('data-thumb') || 677 $slide.find('.mk-video-section-touch').attr('data-thumb'), 678 bgColor = $slide.find('.mk-section-image').css('background-color'); 679 680 681 return { 682 skin: skin, 683 title: title, 684 image: image, 685 bgColor: bgColor 686 }; 687 }); 688 689 // Set position fixed here rather than css to avoid flash of strangely styled slides befor plugin init 690 if(MK.utils.isSmoothScroll) $this.css('position', 'fixed'); 691 692 setNavigationContent( 1, self.$slides.length - 1 ); 693 setSkin( 0 ); 694 // stopVideos(); 695 playVideo(0); 696 697 setTimeout( function() { 698 $( '.edge-slider-loading' ).fadeOut( '100' ); 699 }, 1000 ); 700 }, 701 702 onBeforeSlide : function( id ) { 703 704 }, 705 706 onAfterSlide : function( id ) { 707 setNavigationContent( nextFrom(id), prevFrom(id) ); 708 setSkin( id ); 709 stopVideos(); // stop all others if needed 710 playVideo( id ); 711 } 712 }; 713 714 715 var nextFrom = function nextFrom(id) { 716 return ( id + 1 === self.$slides.length ) ? 0 : id + 1; 717 }; 718 719 720 var prevFrom = function prevFrom(id) { 721 return ( id - 1 === -1 ) ? self.$slides.length - 1 : id - 1; 722 }; 723 724 725 var setNavigationContent = function( nextId, prevId ) { 726 if(self.slideContents[ prevId ]) { 727 $prevTitle.text( self.slideContents[ prevId ].title ); 728 $prevBg.css( 'background', 729 self.slideContents[ prevId ].image !== 'none' ? 730 'url(' + self.slideContents[ prevId ].image + ')' : 731 self.slideContents[ prevId ].bgColor ); 732 } 733 734 if(self.slideContents[ nextId ]) { 735 $nextTitle.text( self.slideContents[ nextId ].title ); 736 $nextBg.css( 'background', 737 self.slideContents[ nextId ].image !== 'none' ? 738 'url(' + self.slideContents[ nextId ].image + ')' : 739 self.slideContents[ nextId ].bgColor ); 740 } 741 }; 742 743 744 var setSkin = function setSkin( id ) { 745 currentSkin = self.slideContents[ id ].skin; 746 747 $navBtns.attr('data-skin', currentSkin); 748 $pagination.attr('data-skin', currentSkin); 749 $skipBtn.attr('data-skin', currentSkin); 750 751 if( self.config.firstEl ) { 752 MK.utils.eventManager.publish( 'firstElSkinChange', currentSkin ); 753 } 754 }; 755 756 757 var stopVideos = function stopVideos() { 758 $videos.each(function() { 759 this.pause(); 760 this.currentTime = 0; 761 }); 762 }; 763 764 765 var playVideo = function playVideo(id) { 766 var video = self.$slides.eq(id).find('video').get(0); 767 if(video) { 768 video.play(); 769 console.log('play video in slide nr ' + id); 770 } 771 772 }; 773 774 775 var onResize = function onResize() { 776 var height = $wrapper.height(); 777 $this.height( height ); 778 779 var width = $wrapper.width(); 780 $this.width( width ); 781 782 winH = $window.height(); 783 offset = $this.offset().top; 784 785 if(!MK.utils.isSmoothScroll) return; 786 if(MK.utils.isResponsiveMenuState()) { 787 // Reset our parallax layers position and styles when we're in responsive mode 788 $this.css({
789 '-webkit-transform': 'translateZ(0)', 790 '-moz-transform': 'translateZ(0)', 791 '-ms-transform': 'translateZ(0)', 792 '-o-transform': 'translateZ(0)', 793 'transform': 'translateZ(0)', 794 'position': 'absolute' 795 }); 796 $opacityLayer.css({ 797 'opacity': 1 798 }); 799 } else { 800 // or proceed with scroll logic when we assume desktop screen 801 onScroll(); 802 } 803 }; 804 805 var onScroll = function onScroll() { 806 currentPoint = - MK.val.scroll(); 807 808 if( offset + currentPoint <= 0 ) { 809 opacity = 1 + ((offset + currentPoint) / winH) * 2; 810 opacity = Math.min(opacity, 1); 811 opacity = Math.max(opacity, 0); 812 813 $opacityLayer.css({ 814 opacity: opacity 815 }); 816 } 817 818 $this.css({ 819 '-webkit-transform': 'translateY(' + currentPoint + 'px) translateZ(0)', 820 '-moz-transform': 'translateY(' + currentPoint + 'px) translateZ(0)', 821 '-ms-transform': 'translateY(' + currentPoint + 'px) translateZ(0)', 822 '-o-transform': 'translateY(' + currentPoint + 'px) translateZ(0)', 823 'transform': 'translateY(' + currentPoint + 'px) translateZ(0)', 824 'position': 'fixed' 825 }); 826 }; 827 828 onResize(); 829 $window.on('load', onResize); 830 $window.on('resize', onResize); 831 window.addResizeListener( $wrapper.get(0), onResize ); 832 833 if(MK.utils.isSmoothScroll) { 834 onScroll(); 835 $window.on('scroll', function() { 836 if(MK.utils.isResponsiveMenuState()) return; 837 window.requestAnimationFrame(onScroll); 838 }); 839 } 840 841 this.el = el; 842 this.config = $.extend( config, callbacks ); 843 this.slideContents = null; // cache slide contents 844 845 // Let mk_slider know it's EdgeSlider 846 this.config.edgeSlider = true; 847 }; 848 849 MK.component.EdgeSlider.prototype = { 850 init : function() { 851 // Inherit from Slider. add prototypes if needed 852 var slider = new MK.ui.Slider( this.el, this.config ); 853 slider.init(); 854 } 855 }; 856 857})(jQuery); 858 859(function ($) { 860 'use strict'; 861 862var init = function init() { 863 $('.mk-faq-wrapper').each( function() { 864 var $this = $(this); 865 var $filter = $this.find('.filter-faq'); 866 var $filterItem = $filter.find('a'); 867 var $faq = $this.find('.mk-faq-container > div'); 868 var currentFilter = ''; 869 870 $filterItem.on('click', function(e) { 871 var $this = $(this); 872 873 currentFilter = $this.data('filter'); 874 $filterItem.removeClass('current'); 875 $this.addClass('current'); 876 877 filterItems( currentFilter ); 878 879 e.preventDefault(); 880 }); 881 882 function filterItems( cat ) { 883 if( cat === '' ) { 884 $faq.slideDown(200).removeClass('hidden'); 885 return; 886 } 887 $faq.not( '.' + cat ).slideUp(200).addClass('hidden'); 888 $faq.filter( '.' + cat ).slideDown(200).removeClass('hidden'); 889 } 890 }); 891} 892init(); 893$(window).on('vc_reload', init); 894 895}( jQuery )); 896/* Flickr Feeds */ 897/* -------------------------------------------------------------------- */ 898(function ($) { 899 'use strict'; 900function mk_flickr_feeds() { 901 902 $('.mk-flickr-feeds').each(function() { 903 var $this = $(this), 904 apiKey = $this.attr('data-key'), 905 userId = $this.attr('data-userid'), 906 perPage = $this.attr('data-count'), 907 column = $this.attr('data-column'); 908 909 if ( ! $( '.mk-flickr-feeds' ).is( ':empty' ) ) { 910 return; 911 } 912 913 jQuery.getJSON('https://api.flickr.com/services/rest/?format=json&method=' + 'flickr.photos.search&api_key=' + apiKey + '&user_id=' + userId + '&&per_page=' + perPage + '&jsoncallback=?', function(data) { 914 915 jQuery.each(data.photos.photo, function(i, rPhoto) { 916 var basePhotoURL = 'http://farm' + rPhoto.farm + '.static.flickr.com/' + rPhoto.server + '/' + rPhoto.id + '_' + rPhoto.secret; 917 918 var thumbPhotoURL = basePhotoURL + '_q.jpg'; 919 var mediumPhotoURL = basePhotoURL + '.jpg'; 920 921 var photoStringStart = '<a '; 922 var photoStringEnd = 'title="' + rPhoto.title + '" rel="flickr-feeds" class="mk-lightbox flickr-item jupiter-donut-colitem" href="' + mediumPhotoURL + '"><img src="' + thumbPhotoURL + '" alt="' + rPhoto.title + '"/></a>;'; 923 var photoString = (i < perPage) ? photoStringStart + photoStringEnd : photoStringStart + photoStringEnd; 924 925 jQuery(photoString).appendTo($this); 926 }); 927 }); 928 }); 929 930} 931 mk_flickr_feeds(); 932 $( window ).on( 'vc_reload', mk_flickr_feeds ); 933})(jQuery); 934 935jQuery(function($) { 936 937 'use strict'; 938 939 // Get All Related Layers
940 var init = function init() { 941 var $gallery = $('.mk-gallery'); 942 var $imgs = $gallery.find('img[data-mk-image-src-set]'); 943 944 if ( $gallery.hasClass('mk-gallery-lazyload') && $imgs.length ) { 945 946 // Load Images if the user scrolls to them 947 $(window).on('scroll.mk_gallery_lazyload', MK.utils.throttle(500, function(){ 948 $imgs.each(function(index, elem) { 949 if ( MK.utils.isElementInViewport(elem) ) { 950 MK.component.ResponsiveImageSetter.init( $(elem) ); 951 $imgs = $imgs.not( $(elem) ); // Remove element from the list when loaded to reduce the amount of iteration in each() 952 } 953 }); 954 })); 955 956 $(window).trigger('scroll.mk_gallery_lazyload'); 957 958 // Handle the resize 959 MK.component.ResponsiveImageSetter.onResize($imgs); 960 961 } else { 962 963 MK.component.ResponsiveImageSetter.init($imgs); 964 MK.component.ResponsiveImageSetter.onResize($imgs); 965 966 } 967 } 968 969 init(); 970 $(window).on('vc_reload mk-image-loaded', init); 971 972}); 973 974 975 976jQuery(function($) { 977 978 'use strict'; 979 980 // Get All Related Layers 981 var init = function init() { 982 var $image = $('.mk-image'); 983 var $imgs = $image.find('img[data-mk-image-src-set]'); 984 985 if ( $image.hasClass('mk-image-lazyload') && $imgs.length ) { 986 987 // Load Images if the user scrolls to them 988 $(window).on('scroll.mk_image_lazyload', MK.utils.throttle(500, function(){ 989 $imgs.each(function(index, elem) { 990 if ( MK.utils.isElementInViewport(elem) ) { 991 MK.component.ResponsiveImageSetter.init( $(elem) ); 992 $imgs = $imgs.not( $(elem) ); // Remove element from the list when loaded to reduce the amount of iteration in each() 993 } 994 }); 995 })); 996 997 $(window).trigger('scroll.mk_image_lazyload'); 998 999 // Handle the resize 1000 MK.component.ResponsiveImageSetter.onResize($imgs); 1001 1002 } else { 1003 1004 MK.component.ResponsiveImageSetter.init($imgs); 1005 MK.component.ResponsiveImageSetter.onResize($imgs); 1006 1007 } 1008 } 1009 1010 init(); 1011 $(window).on('vc_reload mk-image-loaded', init); 1012 1013}); 1014 1015 1016 1017(function($) { 1018 'use strict'; 1019 1020 /* Page Section Intro Effects */ 1021 /* -------------------------------------------------------------------- */ 1022 1023 function mk_section_intro_effects() { 1024 if (!MK.utils.isMobile()) { 1025 if (!$.exists('.mk-page-section.intro-true')) return; 1026 1027 $('.mk-page-section.intro-true').each(function() { 1028 var that = this; 1029 MK.core.loadDependencies([ MK.core.path.plugins + 'jquery.sectiontrans.js', MK.core.path.plugins + 'tweenmax.js' ], function() { 1030 var $this = $(that), 1031 $pageCnt = $this.parent().nextAll('div'), 1032 windowHeight = $(window).height(), 1033 effectName = $this.attr('data-intro-effect'), 1034 $header = $('.mk-header'); 1035 1036 var effect = { 1037 fade: new TimelineLite({paused: true}) 1038 .set($pageCnt, { opacity: 0, y: windowHeight * 0.3 }) 1039 .to($this, 1, { opacity: 0, ease:Power2.easeInOut }) 1040 .to($pageCnt, 1, { opacity: 1, y: 0, ease:Power2.easeInOut}, "-=.7") 1041 .set($this, { zIndex: '-1'}), 1042 1043 zoom_out: new TimelineLite({paused: true}) 1044 .set($pageCnt, { opacity: 0, y: windowHeight * 0.3}) 1045 .to($this, 1.5, { opacity: .8, scale: 0.8, y: -windowHeight - 100, ease:Strong.easeInOut }) 1046 .to($pageCnt, 1.5, { opacity: 1, y: 0, ease:Strong.easeInOut}, "-=1.3"), 1047 1048 shuffle: new TimelineLite({paused: true}) 1049 .to($this, 1.5, { y: -windowHeight/2, ease:Strong.easeInOut }) 1050 .to($pageCnt.first(), 1.5, { paddingTop: windowHeight/2, ease:Strong.easeInOut }, "-=1.3") 1051 }; 1052 1053 console.log($pageCnt); 1054 1055 1056 $this.sectiontrans({ 1057 effect: effectName 1058 }); 1059 1060 if($this.hasClass('shuffled')) { 1061 TweenLite.set($this, { y: -windowHeight/2 }); 1062 TweenLite.set($this.nextAll('div').first(), { paddingTop: windowHeight/2 }); 1063 } 1064 1065 $('body').on('page_intro', function() { 1066 MK.utils.scroll.disable(); 1067 $(this).data('intro', true); 1068 effect[effectName].play(); 1069 setTimeout(function() { 1070 $header.addClass('pre-sticky'); 1071 $header.addClass('a-sticky'); 1072 $('.mk-header-padding-wrapper').addClass('enable-padding'); 1073 $('body').data('intro', false); 1074 if(effectName === 'shuffle') $this.addClass('shuffled'); 1075 }, 1000); 1076
1077 setTimeout(MK.utils.scroll.enable, 1500); 1078 }); 1079 1080 $('body').on('page_outro', function() { 1081 MK.utils.scroll.disable(); 1082 $(this).data('intro', true); 1083 effect[effectName].reverse(); 1084 setTimeout(function() { 1085 $header.removeClass('pre-sticky'); 1086 $header.removeClass('a-sticky'); 1087 $('.mk-header-padding-wrapper').removeClass('enable-padding'); 1088 $('body').data('intro', false); 1089 if($this.hasClass('shuffled')) $this.removeClass('shuffled'); 1090 }, 1000); 1091 1092 setTimeout(MK.utils.scroll.enable, 1500); 1093 }); 1094 }); 1095 }); 1096 1097 } else { 1098 $('.mk-page-section.intro-true').each(function() { 1099 $(this).attr('data-intro-effect', ''); 1100 }); 1101 } 1102 } 1103 1104 mk_section_intro_effects(); 1105 1106 var debounceResize = null; 1107 $(window).on("resize", function() { 1108 if( debounceResize !== null ) { clearTimeout( debounceResize ); } 1109 debounceResize = setTimeout( mk_section_intro_effects, 300 ); 1110 }); 1111 1112 /* Page Section Adaptive Height */ 1113 /* -------------------------------------------------------------------- */ 1114 1115 function mk_section_adaptive_height() { 1116 $( ".mk-page-section.mk-adaptive-height" ).each( function() { 1117 var imageHeight = $( this ).find( ".mk-adaptive-image" ).height(); 1118 $( this ).css( "height", imageHeight ); 1119 }); 1120 } 1121 1122 $( window ).on( "load resize", mk_section_adaptive_height ); 1123 1124 1125 /* Page Section Image Loader */ 1126 /* -------------------------------------------------------------------- */ 1127 1128 // Get All Related Layers 1129 var init = function init() { 1130 var $allLayers = $('.mk-page-section .background-layer').filter(function(index) { 1131 var isLazyLoad = $(this).attr('data-mk-lazyload') === 'true'; 1132 if ( !isLazyLoad ) { 1133 MK.component.BackgroundImageSetter.init( $(this) ); 1134 } 1135 return isLazyLoad; 1136 });; 1137 1138 // Load BG Images if the user scroll to them 1139 if ( $allLayers.length ) { 1140 1141 $(window).on('scroll.mk_page_section_lazyload', MK.utils.throttle(500, function(){ 1142 $allLayers.each(function(index, elem) { 1143 if ( MK.utils.isElementInViewport(elem) ) { 1144 MK.component.BackgroundImageSetter.init( $(elem) ); 1145 $allLayers = $allLayers.not( $(elem) ); // Remove element from the list when loaded to reduce the amount of iteration in each() 1146 } 1147 }); 1148 })); 1149 1150 // First init 1151 $(window).trigger('scroll.mk_page_section_lazyload'); 1152 1153 // Handle the resize 1154 MK.component.BackgroundImageSetter.onResize($allLayers); 1155 1156 } 1157 } 1158 init(); 1159 1160 $(window).on('vc_reload', init); 1161 1162 /* Page Section Layout */ 1163 /* -------------------------------------------------------------------- */ 1164 1165 function mk_section_half_layout() { 1166 $(".mk-page-section.half_boxed").each(function() { 1167 var $section = $(this); 1168 if ($(window).width() > jupiterDonutVars.gridWidth) { 1169 var margin = ($(window).width() - jupiterDonutVars.gridWidth) / 2; 1170 var $section_inner = $section.find('.mk-half-layout-inner'); 1171 if($section.hasClass('half_left_layout')){ 1172 $section_inner.css({ 1173 marginRight: margin + 'px' 1174 }); 1175 } 1176 if($section.hasClass('half_right_layout')){ 1177 $section_inner.css({ 1178 marginLeft: margin + 'px' 1179 }); 1180 } 1181 } 1182 }); 1183 } 1184 1185 $(window).on("load resize", mk_section_half_layout); 1186 1187 /* Page Section - Fluid Width Equal Height Columns */ 1188 /* -------------------------------------------------------------------- */ 1189 function mk_reset_section_fluid_width_equal_height_columns() { 1190 var $colWrappers = '', maxWidth = 850; 1191 1192 $colWrappers = $('.page-section-content.fluid-width-equal-height-columns'); 1193 1194 $colWrappers.each(function() { 1195 var $colWrapper = '', colHeight = 0; 1196 $colWrapper = $(this); 1197 $colWrapper.find('.wpb_column.column_container').each(function() { 1198 var $col = $(this), size = $(this).children('div').length; 1199 if (size > 0) { 1200 $col.removeAttr("style"); 1201 $col.children('div').each(function() { 1202 var $this = $( this ); 1203 /** 1204 * Fix Advanced Google Maps (AGM) issue on page section. 1205 * 1206 * Problem: AGM set the height as inline CSS property (style attribute). 1207 * In this case, the style attribute will be removed before checking the 1208 * elements height in each of the column. That's why AGM container will 1209 * loose the height and the map can't be displayed properly (only 1px) 1210 * because it overlap other row in the page. We need to check if current 1211 * element is AGM or not before removing style attribute of the element. 1212 */ 1213 if ( ! $this.hasClass( 'mk-advanced-gmaps' ) ) { 1214 $this.removeAttr( 'style' ); 1215 } 1216 }); 1217 } 1218 }); 1219 }); 1220 } 1221 1222 function mk_section_fluid_width_equal_height_columns() { 1223 mk_reset_section_fluid_width_equal_height_columns(); 1224 1225 var $colWrappers = '', maxWidth = 850, $pageSection = $('.page-section-content'); 1226 1227 if ( ! $pageSection.hasClass('.fluid-width-equal-height-columns') ) { 1228 $pageSection.find('.wpb_column.column_container').removeAttr( 'style' ); 1229 $pageSection.find('.wpb_column.column_container .vc_element').removeAttr( 'style' ); 1230 } 1231 1232 $colWrappers = $('.page-section-content.fluid-width-equal-height-columns'); 1233 1234 $colWrappers.each(function() { 1235 var $colWrapper = '', colHeight = 0; 1236 $colWrapper = $(this); 1237 1238 if ($colWrapper.length > 0) { 1239 /* Get the minimum height of the wrapper */ 1240 colHeight = $colWrappers.outerHeight(true); 1241 $colWrapper.find('.wpb_column.column_container').each(function() { 1242 var $col = $(this); 1243 if ($col.length > 0) { 1244 colHeight = ($col.outerHeight(true) > colHeight) ? $col.outerHeight(true) : colHeight; 1245 } 1246 }); 1247 } 1248 1249 if (colHeight > 0) { 1250 $colWrapper.find('.wpb_column.column_container').each(function() { 1251 var $col = $(this), size = $(this).children('div').length; 1252 if (size > 0) { 1253 colHeight = ($(window).width() < maxWidth) ? 'initial' : colHe
1253ight; 1254 $col.css("height", colHeight); 1255 if ($colWrapper.hasClass('vertical-align-center')) { 1256 $col.children('div').each(function() { 1257 var elHeight = ($(window).width() < maxWidth) ? 'initial' : (colHeight/size); 1258 /** 1259 * Fix Advanced Google Maps (AGM) issue on page section. 1260 */ 1261 if ( ! $(this).hasClass( 'mk-advanced-gmaps' ) ) { 1262 $(this).css("height", elHeight); 1263 } 1264 }); 1265 } 1266 } 1267 }); 1268 } 1269 }); 1270 } 1271 $(window).on('load vc_reload', function() { 1272 setTimeout(function() { 1273 /* 1274 Somehow the values are not correctly updated for the screens 1275 and we need to put setTimeout to fix the issue. 1276 */ 1277 mk_section_fluid_width_equal_height_columns(); 1278 }, 500); 1279 }); 1280 1281 var debounceResize = null; 1282 $(window).on("resize", function() { 1283 if( debounceResize !== null ) { clearTimeout( debounceResize ); } 1284 debounceResize = setTimeout( mk_section_fluid_width_equal_height_columns(), 500 ); 1285 }); 1286 1287}(jQuery)); 1288 1289(function($) { 1290 'use strict'; 1291 1292 function mk_page_title_parallax() { 1293 if (!MK.utils.isMobile()) { 1294 1295 $('.mk-effect-wrapper').each(function() { 1296 var $this = $(this), 1297 progressVal, 1298 currentPoint, 1299 ticking = false, 1300 scrollY = MK.val.scroll(), 1301 $window = $(window), 1302 windowHeight = $(window).height(), 1303 parentHeight = $this.outerHeight(), 1304 startPoint = 0, 1305 endPoint = $this.offset().top + parentHeight, 1306 effectLayer = $this.find('.mk-effect-bg-layer'), 1307 gradientLayer = effectLayer.find('.mk-effect-gradient-layer'), 1308 cntLayer = $this.find('.mk-page-title-box-content'), 1309 animation = effectLayer.attr('data-effect'), 1310 top = $this.offset().top, 1311 height = $this.outerHeight(); 1312 1313 var parallaxSpeed = 0.7, 1314 zoomFactor = 1.3; 1315 1316 var parallaxTopGap = function() { 1317 var gap = top * parallaxSpeed; 1318 1319 effectLayer.css({ 1320 height : height + gap + 'px', 1321 top : (-gap) + 'px' 1322 }); 1323 }; 1324 1325 1326 if (animation == ("parallax" || "parallaxZoomOut") ) { 1327 parallaxTopGap(); 1328 } 1329 1330 var animationSet = function() { 1331 scrollY = MK.val.scroll(); 1332 1333 if (animation == "parallax") { 1334 currentPoint = (startPoint + scrollY) * parallaxSpeed; 1335 effectLayer.get(0).style.transform = 'translateY(' + currentPoint + 'px)'; 1336 } 1337 1338 if (animation == "parallaxZoomOut") { 1339 console.log(effectLayer); 1340 currentPoint = (startPoint + scrollY) * parallaxSpeed; 1341 progressVal = (1 / (endPoint - startPoint) * (scrollY - startPoint)); 1342 var zoomCalc = zoomFactor - ((zoomFactor - 1) * progressVal); 1343 1344 effectLayer.get(0).style.transform = 'translateY(' + currentPoint + 'px) scale(' + zoomCalc + ')'; 1345 } 1346 1347 if (animation == "gradient") { 1348 progressVal = (1 / (endPoint - startPoint) * (scrollY - startPoint)); 1349 gradientLayer.css({ 1350 opacity: progressVal * 2 1351 }); 1352 } 1353 1354 if (animation != "gradient") { 1355 progressVal = (1 / (endPoint - startPoint) * (scrollY - startPoint)); 1356 cntLayer.css({ 1357 opacity: 1 - (progressVal * 4) 1358 }); 1359 } 1360 1361 // Stop ticking 1362 ticking = false; 1363 }; 1364 animationSet(); 1365 1366 // This will limit the calculation of the background position to 1367 // 60fps as well as blocking it from running multiple times at once 1368 var requestTick = function() { 1369 if (!ticking) { 1370 window.requestAnimationFrame(animationSet); 1371 ticking = true; 1372 } 1373 }; 1374 1375 $window.off('scroll', requestTick); 1376 $window.on('scroll', requestTick); 1377 1378 }); 1379 } 1380 } 1381 1382 1383 var $window = $(window); 1384 var debounceResize = null; 1385 1386 $window.on('load', mk_page_title_parallax); 1387 $window.on("resize", function() { 1388 if( debounceResize !== null ) { clearTimeout( debounceResize ); } 1389 debounceResize = setTimeout( mk_page_title_parallax, 300 ); 1390 }); 1391 1392}(jQuery)); 1393 1394(function($) { 1395 'use strict'; 1396 var utils = MK.utils, 1397 core = MK.core, 1398 path = MK.core.path; 1399 MK.component.PhotoAlbum = function(el) { 1400 this.album = el; 1401 this.initialOpen = false;
1402 }; 1403 MK.component.PhotoAlbum.prototype = { 1404 dom: { 1405 gallery: '.slick-slider-wrapper', 1406 title: '.slick-title', 1407 galleryContainer: '.slick-slides', 1408 closeBtn: '.slick-close-icon', 1409 thumbList: '.slick-dots', 1410 thumbs: '.slick-dots li', 1411 imagesData: 'photoalbum-images', 1412 titleData: 'photoalbum-title', 1413 idData: 'photoalbum-id', 1414 urlData: 'photoalbum-url', 1415 activeClass: 'is-active' 1416 }, 1417 tpl: { 1418 gallery: '#tpl-photo-album', 1419 slide: '<div class="slick-slide"></div>' 1420 }, 1421 init: function() { 1422 this.cacheElements(); 1423 this.bindEvents(); 1424 this.openByLink(); 1425 }, 1426 cacheElements: function() { 1427 this.$album = $(this.album); 1428 this.imagesSrc = this.$album.data(this.dom.imagesData); 1429 this.albumLength = this.imagesSrc.length; 1430 this.title = this.$album.data(this.dom.titleData); 1431 this.id = this.$album.data(this.dom.idData); 1432 this.url = this.$album.data(this.dom.urlData); 1433 this.images = []; // stores dom objects to insert into gallery instance 1434 }, 1435 bindEvents: function() { 1436 this.$album.not('[data-photoalbum-images="[null]"]').on('click', this.albumClick.bind(this)); 1437 $(document).on('click', this.dom.closeBtn, this.closeClick.bind(this)); 1438 $(window).on('resize', this.thumbsVisibility.bind(this)); 1439 $(window).on('resize', this.makeArrows.bind(this)); 1440 }, 1441 albumClick: function(e) { 1442 e.preventDefault(); 1443 this.open(); 1444 MK.ui.loader.add(this.album); 1445 }, 1446 closeClick: function(e) { 1447 e.preventDefault(); 1448 // Because one close btn rules them all 1449 if (this.slider) { 1450 this.removeGallery(); 1451 this.slider.exitFullScreen(); 1452 } 1453 }, 1454 thumbsVisibility: function() { 1455 if (!this.thumbsWidth) return; 1456 if (window.matchMedia('(max-width:' + (this.thumbsWidth + 260) + 'px)').matches) this.hideThumbs(); // 260 is 2 * 120 - right corner buttons width + scrollbar 1457 else this.showThumbs(); 1458 }, 1459 hideThumbs: function() { 1460 if (!this.$thumbList) return; 1461 this.$thumbList.hide(); 1462 }, 1463 showThumbs: function() { 1464 if (!this.$thumbList) return; 1465 this.$thumbList.show(); 1466 }, 1467 open: function() { 1468 var self = this; 1469 core.loadDependencies([path.plugins + 'slick.js'], function() { 1470 self.createGallery(); 1471 self.loadImages(); 1472 }); 1473 }, 1474 createGallery: function() { 1475 // only one per page 1476 if (!$(this.dom.gallery).length) { 1477 var tpl = $(this.tpl.gallery).eq(0).html(); 1478 $('body').append(tpl); 1479 } 1480 // and cache obj 1481 this.$gallery = $(this.dom.gallery); 1482 this.$closeBtn = $(this.dom.closeBtn); 1483 }, 1484 createSlideshow: function() { 1485 var self = this; 1486 this.slider = new MK.ui.FullScreenGallery(this.dom.galleryContainer, { 1487 id: this.id, 1488 url: this.url 1489 }); 1490 this.slider.init(); 1491 $(window).trigger('resize'); 1492 this.makeArrows(); 1493 this.$thumbList = $(this.dom.thumbList); 1494 this.$thumbs = $(this.dom.thumbs); 1495 this.thumbsWidth = (this.$thumbs.length) * 95; 1496 this.thumbsVisibility(); 1497 setTimeout(function() { 1498 MK.ui.loader.remove(self.album); 1499 }, 100); 1500 MK.utils.eventManager.publish('photoAlbum-open'); 1501 }, 1502 makeArrows: function() { 1503 if (this.arrowsTimeout) clearTimeout(this.arrowsTimeout); 1504 this.arrowsTimeout = setTimeout(function() { 1505 var $prev = $('.slick-prev').find('svg'); 1506 var $next = $('.slick-next').find('svg'); 1507 $prev.wrap('<div class="slick-nav-holder"></div>'); 1508 $next.wrap('<div class="slick-nav-holder"></div>'); 1509 if (matchMedia("(max-width: 1024px)").matches) { 1510 $prev.attr({ 1511 width: 12, 1512 height: 22 1513 }).find('polyline').attr('points', '12,0 0,11 12,22'); 1514 $next.attr({ 1515 width: 12, 1516 height: 22 1517 }).find('polyline').attr('points', '0,0 12,11 0,22'); 1518 } else { 1519 $prev.attr({ 1520 width: 33, 1521 height: 65 1522 }).find('polyline').attr('points', '0.5,0.5 32.5,32.5 0.5,64.5'); 1523 $next.attr({ 1524 width: 33, 1525 height: 65 1526 }).find('polyline').attr('points', '0.5,0.5 32.5,32.5 0.5,64.5'); 1527 } 1528 }, 0); 1529 }, 1530 loadImages: function() { 1531 var self = this, 1532 n = 0; 1533 // cache images on first load. 1534 if (!this.images.length) {
1535 this.imagesSrc.forEach(function(src) { 1536 if (src === null) return; // protect from nulls 1537 var img = new Image(); 1538 img.onload = function() { 1539 self.onLoad(n += 1); 1540 }; 1541 img.src = src; 1542 self.images.push(img); 1543 }); 1544 } else { 1545 this.onLoad(this.albumLength); 1546 } 1547 }, 1548 onLoad: function(n) { 1549 if (n === this.albumLength) { 1550 this.insertImages(); 1551 this.showGallery(); 1552 this.createSlideshow(); 1553 } 1554 }, 1555 insertImages: function() { 1556 var $galleryContainer = this.$gallery.find(this.dom.galleryContainer), 1557 $title = $(this.dom.title), 1558 slide = this.tpl.slide; 1559 // clear first 1560 $galleryContainer.html(''); 1561 $title.html(this.title); 1562 this.images.forEach(function(img) { 1563 var $slide = $(slide); 1564 $slide.html(img); 1565 $galleryContainer.prepend($slide); 1566 }); 1567 }, 1568 showGallery: function() { 1569 var self = this; 1570 this.$gallery.addClass(this.dom.activeClass); 1571 utils.scroll.disable(); 1572 }, 1573 removeGallery: function() { 1574 var self = this; 1575 this.$gallery.removeClass(this.dom.activeClass); 1576 setTimeout(function() { 1577 self.$gallery.remove(); 1578 }, 300); 1579 utils.scroll.enable(); 1580 }, 1581 openByLink: function() { 1582 var loc = window.location, 1583 hash = loc.hash, 1584 id; 1585 if (hash.length && hash.substring(1).length) { 1586 id = hash.substring(1); 1587 id = id.replace('!loading', ''); 1588 if (id == this.id && !this.initialOpen) { 1589 this.initialOpen = true; 1590 this.open(); 1591 } 1592 } 1593 } 1594 }; 1595 // Barts note; Rifat duplication and coupling here. Remove it when have time 1596 MK.component.PhotoAlbumBlur = function(el) { 1597 var init = function() { 1598 core.loadDependencies([path.plugins + 'pixastic.js'], function() { 1599 blurImage($('.mk-album-item figure')); 1600 }); 1601 }; 1602 var blurImage = function($item) { 1603 return $item.each(function() { 1604 var $_this = $(this); 1605 var img = $_this.find('.album-cover-image'); 1606 img.clone().addClass("blur-effect item-blur-thumbnail").removeClass('album-cover-image').prependTo(this); 1607 var blur_this = $(".blur-effect", this); 1608 blur_this.each(function(index, element) { 1609 if (img[index].complete === true) { 1610 Pixastic.process(blur_this[index], "blurfast", { 1611 amount: 0.5 1612 }); 1613 } else { 1614 blur_this.load(function() { 1615 Pixastic.process(blur_this[index], "blurfast", { 1616 amount: 0.5 1617 }); 1618 }); 1619 } 1620 }); 1621 }); 1622 }; 1623 return { 1624 init: init 1625 }; 1626 }; 1627})(jQuery); 1628 1629jQuery(document).ready(function( $ ) { 1630 1631 // Continue only on Safari. 1632 if ( typeof window.safari === 'undefined' ) { 1633 return; 1634 } 1635 1636 // Fore redraw for Safari. This is a hack. 1637 function mkRedraw() { 1638 $('.mk-photo-roller').hide().show(0); 1639 } 1640 1641 mkRedraw(); 1642 1643 $( window ).resize( function() { 1644 mkRedraw() 1645 } ); 1646 1647}); 1648jQuery(function($) { 1649 1650 'use strict'; 1651 1652 // Get All Related Layers 1653 var init = function init() { 1654 var $portfolio = $('.portfolio-grid'); 1655 var $imgs = $portfolio.find('img[data-mk-image-src-set]'); 1656 1657 if ( $portfolio.hasClass('portfolio-grid-lazyload') && $imgs.length ) { 1658 1659 // Load Images if the user scrolls to them 1660 $(window).on('scroll.mk_portfolio_lazyload', MK.utils.throttle(500, function(){ 1661 $imgs.each(function(index, elem) { 1662 if ( MK.utils.isElementInViewport(elem) ) { 1663 MK.component.ResponsiveImageSetter.init( $(elem) ); 1664 $imgs = $imgs.not( $(elem) ); // Remove element from the list when loaded to reduce the amount of iteration in each() 1665 } 1666 }); 1667 })); 1668 1669 $(window).trigger('scroll.mk_portfolio_lazyload'); 1670 1671 // Handle the resize 1672 MK.component.ResponsiveImageSetter.onResize($imgs); 1673 1674 } else { 1675 1676 MK.component.ResponsiveImageSetter.init($imgs); 1677 MK.component.ResponsiveImageSetter.onResize($imgs); 1678 1679 } 1680 } 1681 1682 init(); 1683 $(window).on('vc_reload mk-image-loaded', function(){ 1684 init(); 1685 1686 $('.mk-portfolio-container').each(function(){ 1687 var id = $(this).attr('id'); 1688 var el = '#' + id + '.mk-portfolio-container.js-el'; 1689 1690 if($(this).data('mk-component') == 'Grid') { 1691 // Disable VC frontend component init for portfolio. 1692 $(el).data('init-Grid', true); 1693 1694 // Init Grid component on shortcode render. 1695 var component = new MK.component[ 'Grid' ]( el ); 1696 component.init(); 1697 } 1698 }); 1699 1700 }); 1701 1702}); 1703 1704 1705 1706jQuery(document).ready(function($) { 1707 'use strict'; 1708 /** 1709 * Get dynamic width of items for passing in `flexslider()`. 1710 * @param string style Style of the carousel, classic/modern 1711 * @param integer showItems Number of items to show 1712 * @param integer id ID of the carousel
1713 * @return interger The width for items 1714 */ 1715 function get_item_width(style, showItems, id) { 1716 var item_width; 1717 if (style == "classic") { 1718 item_width = 275; 1719 items_to_show = 4; 1720 } else { 1721 var screen_width = $('#portfolio-carousel-' + id).width(), 1722 items_to_show = showItems; 1723 if (screen_width >= 1100) { 1724 item_width = screen_width / items_to_show; 1725 } else if (screen_width <= 1200 && screen_width >= 800) { 1726 item_width = screen_width / 3; 1727 } else if (screen_width <= 800 && screen_width >= 540) { 1728 item_width = screen_width / 2; 1729 } else { 1730 item_width = screen_width; 1731 } 1732 } 1733 return item_width; 1734 } 1735 jQuery(window).on("load vc_reload", function() { 1736 MK.core.loadDependencies([MK.core.path.plugins + 'jquery.flexslider.js'], function() { 1737 1738 $('.portfolio-carousel .mk-flexslider').each(function() { 1739 var $this = $(this); 1740 var $pauseOnHover = $this.attr('data-pauseOnHover') == "true" ? true : false; 1741 var $slideshow = $this.attr('data-slideshow') == "true" ? true : false; 1742 1743 $this.flexslider({ 1744 selector: ".mk-flex-slides > li", 1745 animation: "slide", 1746 slideshowSpeed: parseInt($this.attr('data-slideshowSpeed')), 1747 animationSpeed: parseInt($this.attr('data-animationSpeed')), 1748 pauseOnHover: $pauseOnHover, 1749 controlNav: false, 1750 smoothHeight: false, 1751 useCSS: false, 1752 directionNav: $this.data('directionNav'), 1753 prevText: "", 1754 nextText: "", 1755 itemWidth: get_item_width($this.data('style'), $this.data('showItems'), $this.data('id')), 1756 itemMargin: 0, 1757 maxItems: ($this.data('style') === 'modern') ? $this.data('showItems') : 4, 1758 minItems: 1, 1759 move: 1, 1760 slideshow: $slideshow, 1761 }); 1762 }); // End each(). 1763 }); // End loadDependencies(). 1764 }); // End on(). 1765}); 1766 1767(function($) { 1768 if (window.addEventListener) { 1769 window.addEventListener('load', handleLoad, false); 1770 } 1771 else if (window.attachEvent) { 1772 window.attachEvent('onload', handleLoad); 1773 } 1774 1775 function handleLoad() { 1776 $('.mk-slideshow-box').each(run); 1777 } 1778 1779 function run() { 1780 var $slider = $(this); 1781 1782 var $slides = $slider.find('.mk-slideshow-box-item'); 1783 var $transition_time = $slider.data('transitionspeed'); 1784 var $time_between_slides = $slider.data('slideshowspeed'); 1785 1786 $slider.find('.mk-slideshow-box-content').children('p').filter(function() { 1787 if ( $.trim($(this).text()) == '' ) { 1788 return true; 1789 } 1790 }).remove(); 1791 1792 // set active classes 1793 $slides.first().addClass('active').fadeIn($transition_time, function(){ 1794 setTimeout(autoScroll, $time_between_slides); 1795 }); 1796 1797 // auto scroll 1798 function autoScroll(){ 1799 var $i = $slider.find('.active').index(); 1800 $slides.eq($i).removeClass('active').fadeOut($transition_time); 1801 if ($slides.length == $i + 1) $i = -1; // loop to start 1802 $slides.eq($i + 1).addClass('active').fadeIn($transition_time, function() { 1803 setTimeout(autoScroll, $time_between_slides); 1804 }); 1805 } 1806 1807 /** 1808 * Need to set the height manually as min-height property doesn't work with display 1809 * table and table-cell in Firefox and Safari. We use Javascript to set them only 1810 * for Firefox and Safari to avoid any problem with Chrome users. The problem is only 1811 * happen when the window screen size bigger than 850px. 1812 */ 1813 var browserName = MK.utils.browser.name; 1814 if ( browserName === 'Firefox' || browserName === 'Safari' ) { 1815 var currentWidth = parseInt( $( window ).width() ); 1816 if ( currentWidth >= 850 ) { 1817 var height = $slider.css( 'min-height' ); 1818 if ( typeof height !== 'undefined' ) { 1819 $slider.find( '.mk-slideshow-box-items' ).height( parseInt( height ) ); 1820 } 1821 } else { 1822 $slider.find( '.mk-slideshow-box-items' ).removeAttr( 'style' ); 1823 } 1824 } 1825 } 1826 $(window).on('vc_reload', function(){ 1827 handleLoad(); 1828 }); 1829 1830 // Handle resize event only for Safari and Firefox. 1831 window.addEventListener( 'resize', function(){ 1832 var browserName = MK.utils.browser.name; 1833 if ( browserName === 'Firefox' || browserName === 'Safari' ) { 1834 handleLoad(); 1835 } 1836 }, true); 1837}(jQuery)); 1838 1839(function($) { 1840 'use strict'; 1841 1842 $(".mk-subscribe").each(function() { 1843 var $this = $(this); 1844 1845 $this.find('.mk-subscribe--form').submit(function(e){ 1846 $this.addClass('form-in-progress'); 1847 e.preventDefault(); 1848 $.ajax({ 1849 url: MK.core.path.ajaxUrl, 1850 type: "POST", 1851 data: { 1852 action: "mk_ajax_subscribe", 1853 email: $this.find(".mk-subscribe--email").val(), 1854 list_id: $this.find(".mk-subscribe--list-id").val(), 1855 optin: $this.find(".mk-subscribe--optin").val() 1856 }, 1857 success: function (response) { 1858 console.log(response) 1859 $this.removeClass('form-in-progress'); 1860 var data = $.parseJSON(response), 1861 $messaage_box = $this.find(".mk-subscribe--message"); 1862 1863 $messaage_box.html(data.message); 1864 1865 if(data.action_status == true) { 1866 $messaage_box.addClass('success'); 1867 } else { 1868 $messaage_box.addClass('error'); 1869 } 1870 1871 $this.find(".mk-subscribe--email").val(''); 1872 1873 } 1874 }); 1875 }); 1876 }); 1877 1878}(jQuery)); 1879 1880(function( $ ) { 1881 'use strict'; 1882 1883 // If we want to get access to API of already initilised component we run a regular new conctructor. 1884 // When instance is discovered in cache object then we return exisiting instance. 1885 // 1886 // TODO move it to core functions and run logic on init
1887 // var init = function init() { 1888 var _instancesCollection = {}; 1889 1890 var MK = window.MK || {}; 1891 window.MK = MK; 1892 MK.component = window.MK.component || {}; 1893 1894 MK.component.SwipeSlideshow = function( el ) { 1895 var $this = $( el ); 1896 var id = $this.parent().attr('id'); 1897 1898 this.el = el; 1899 this.id = id; 1900 this.config = $this.data( 'swipeslideshow-config' ); 1901 if( this.config ) this.config.hasPagination = false; 1902 }; 1903 1904 MK.component.SwipeSlideshow.prototype = { 1905 init : function() { 1906 var slider = new MK.ui.Slider( this.el, this.config ); 1907 slider.init(); 1908 1909 _instancesCollection[ this.id ] = slider; 1910 } 1911 }; 1912 1913 1914 // Additional nav 1915 // Mostly for thumbs in woocommerce 1916 MK.component.SwipeSlideshowExtraNav = function( el ) { 1917 this.el = el; 1918 }; 1919 1920 MK.component.SwipeSlideshowExtraNav.prototype = { 1921 init : function init() { 1922 this.cacheElements(); 1923 this.bindEvents(); 1924 }, 1925 1926 cacheElements : function cacheElements() { 1927 var $this = $( this.el ); 1928 1929 this.sliderId = $this.data( 'gallery' ); 1930 this.slider = _instancesCollection[this.sliderId]; 1931 this.$thumbs = $( '#' + this.sliderId ).find( '.thumbnails a'); 1932 }, 1933 1934 bindEvents : function bindEvents() { 1935 this.$thumbs.on( 'click', this.clickThumb.bind( this ) ); 1936 }, 1937 1938 clickThumb : function clickThumb( e ) { 1939 e.preventDefault(); 1940 var $this = $( e.currentTarget ), 1941 id = $this.index(); 1942 1943 this.slider.goTo( id ); 1944 } 1945 }; 1946 1947 1948 // Mostly for switcher in woocommerce 1949 MK.utils.eventManager.subscribe('gallery-update', function(e, config) { 1950 if(typeof _instancesCollection[config.id] === 'undefined') return; 1951 _instancesCollection[config.id].reset(); 1952 }); 1953 1954 function init() { 1955 // Lazy load. 1956 // Get All Related Layers 1957 var $swiper = $('.mk-slider'); 1958 1959 if ( ! $swiper.hasClass('mk-slideshow') && ! $swiper.hasClass('mk-swipe-slideshow') ) { 1960 return; 1961 } 1962 1963 var $imgs = $swiper.find('img[data-mk-image-src-set]'); 1964 1965 if ( $swiper.hasClass('mk-swipe-slideshow-lazyload') && $imgs.length ) { 1966 1967 // Load Images if the user scrolls to them 1968 $(window).on('scroll.mk_swipe_slideshow_lazyload', MK.utils.throttle(500, function(){ 1969 $imgs.each(function(index, elem) { 1970 if ( MK.utils.isElementInViewport(elem) ) { 1971 MK.component.ResponsiveImageSetter.init( $(elem) ); 1972 $imgs = $imgs.not( $(elem) ); // Remove element from the list when loaded to reduce the amount of iteration in each() 1973 } 1974 }); 1975 })); 1976 1977 $(window).trigger('scroll.mk_swipe_slideshow_lazyload'); 1978 1979 // Handle the resize 1980 MK.component.ResponsiveImageSetter.onResize($imgs); 1981 1982 } else { 1983 1984 MK.component.ResponsiveImageSetter.init($imgs); 1985 MK.component.ResponsiveImageSetter.onResize($imgs); 1986 1987 } 1988 1989 /* Why we need to reinitialize it? it causes double sliding effect 1990 $( '.mk-swiper-container' ).each( function() { 1991 new MK.component.SwipeSlideshow( this ).init(); 1992 } ); 1993 */ 1994 1995 } 1996 1997 init(); 1998 $(window).on('vc_reload mk-image-loaded', init); 1999 2000})( jQuery ); 2001 2002(function($) { 2003 'use strict'; 2004 2005 var core = MK.core, 2006 path = core.path; 2007 2008 MK.component.Tooltip = function(el) { 2009 var init = function() { 2010 $('.mk-tooltip').each(function() { 2011 $(this).find('.mk-tooltip--link').hover(function() { 2012 $(this).siblings('.mk-tooltip--text').stop(true).animate({ 2013 'opacity': 1 2014 }, 400); 2015 2016 }, function() { 2017 $(this).siblings('.mk-tooltip--text').stop(true).animate({ 2018 'opacity': 0 2019 }, 400); 2020 }); 2021 }); 2022 }; 2023 2024 return { 2025 init: init 2026 }; 2027 }; 2028 2029})(jQuery); 2030 2031(function( $ ) { 2032 'use strict'; 2033 2034 /** 2035 * Fix issue with WC Recent Carousel classic style when SC is active. 2036 * At the first load of shortcode, the height is not correct, only cover the image 2037 * without product detail. This script only set the min-height. 2038 */ 2039 function mkWcCarouselSwiperHeight() { 2040 var mkWCRecentCarousel = $( '.mk-woocommerce-carousel.classic-style' ); 2041 mkWCRecentCarousel.each( function() { 2042 var maxHeight = 0; 2043 var height = $( this ).height(); 2044 var childs = $( this ).find( '.item' ); 2045 childs.each( function(){ 2046 if ( $( this ).height() > maxHeight ) { 2047 maxHeight = $( this ).height(); 2048 } 2049 } ); 2050 var swiperContainers = $( this ).find( '.mk-swiper-container' ); 2051 swiperContainers[0].style.setProperty( 'min-height', maxHeight + 'px', 'important' ); 2052 } ); 2053 } 2054 2055 mkWcCarouselSwiperHeight(); 2056 2057}
2057)( jQuery ); 2058(function ($) { 2059 'use strict'; 2060 2061 function dynamicHeight() { 2062 var $this = $( this ); 2063 2064 $this.height( 'auto' ); 2065 2066 if( window.matchMedia( '(max-width: 767px)' ).matches ) { 2067 return; 2068 } 2069 2070 $this.height( $this.height() ); 2071 } 2072 2073 var $window = $( window ); 2074 var container = document.getElementById( 'mk-theme-container' ); 2075 2076 function equalColumns() { 2077 $( '.equal-columns' ).each( function() { 2078 dynamicHeight.bind( this ); 2079 $window.on( 'load', dynamicHeight.bind( this ) ); 2080 $window.on( 'resize', dynamicHeight.bind( this ) ); 2081 $window.on( 'mk-image-loaded', dynamicHeight.bind( this ) ); 2082 window.addResizeListener( container, dynamicHeight.bind( this ) ); 2083 }); 2084 } 2085 2086 equalColumns(); 2087 2088 $window.on( 'vc_reload' , function() { 2089 equalColumns(); 2090 }); 2091 2092}( jQuery )); 2093 2094(function($) { 2095 'use strict'; 2096 2097 function mk_video_play() { 2098 2099 var lightboxMargin = 60; 2100 2101 // Play self hosted video 2102 function playSelfHosted($video, isLightbox) { 2103 if (isLightbox === undefined || typeof isLightbox === 'undefined') { 2104 isLightbox = false; 2105 } 2106 2107 if (isLightbox) { 2108 var content = $video.parent().html(); 2109 var src = $video.parent().find('source').attr('src'); 2110 2111 playLightbox({ 2112 content: '<div class="fancybox-video">' + $(content).attr('autoplay', 'autoplay').wrap('<div></div>').parent().html() + '</div>', 2113 src: src, 2114 }); 2115 2116 } else { 2117 playTagVideo($video); 2118 } 2119 } 2120 2121 // Play social hosted video 2122 function playSocialHosted($iframe, isLightbox) { 2123 2124 if (isLightbox === undefined || typeof isLightbox === 'undefined') { 2125 isLightbox = false; 2126 } 2127 2128 if (isLightbox) { 2129 playLightbox({ 2130 type: 'iframe', 2131 src: $iframe.attr('src'), 2132 }); 2133 2134 } else { 2135 2136 var videoData = getSocialVideoData($iframe.attr('src')); 2137 2138 switch (videoData.source) { 2139 case 'youtube': 2140 playTagIframeYoutube(videoData.videoId, $iframe); 2141 break; 2142 case 'vimeo': 2143 playTagIframeVimeo(videoData.videoId, $iframe); 2144 break; 2145 default: 2146 playTagIframe($iframe); 2147 break; 2148 } 2149 } 2150 } 2151 2152 // Play video in lightbox 2153 function playLightbox(args) { 2154 var options = { 2155 autoSize: 0, 2156 width: getVideoboxWidth(), 2157 height: getVideoHeight(), 2158 }; 2159 $.extend(options, args); 2160 $.fancybox.open(options); 2161 } 2162 2163 function playTagVideo($video) { 2164 $video.get(0).play(); 2165 $video.closest('.video-container').find('.video-thumbnail').fadeOut('slow'); 2166 } 2167 2168 function playTagIframe($iframe, videoId) { 2169 var video_loop = ''; 2170 if (videoId !== undefined && typeof videoId !== 'undefined') { 2171 video_loop = '&playlist=' + videoId; 2172 } 2173 2174 var src = $iframe.attr('src'); 2175 var separator = (src.indexOf('?') === -1) ? '?' : '&'; 2176 src += separator + 'autoplay=1'; 2177 separator = (src.indexOf('?') === -1) ? '?' : '&'; 2178 video_loop = separator + 'loop=1' + video_loop; 2179 video_loop = ( $iframe.closest('.video-container').data('loop') == '1' ) ? video_loop : ''; 2180 src += video_loop; 2181 $iframe.attr('src', src).closest('.video-container').find('.video-thumbnail').fadeOut(3000); 2182 } 2183 2184 function playTagIframeYoutube(videoId, $iframe) { 2185 2186 // Credit: https://goo.gl/ku3NgH 2187 if ( document.getElementById('mk_iframe_api') === null ) { 2188 var tag = document.createElement('script'); 2189 tag.src = "https://www.youtube.com/iframe_api"; 2190 tag.id = "mk_iframe_api"; 2191 var firstScriptTag = document.getElementsByTagName('script')[0]; 2192 firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 2193 } else { 2194 runPlayer(); 2195 } 2196 2197 window.onYouTubeIframeAPIReady = function () { 2198 runPlayer(); 2199 }; 2200 2201 function runPlayer(){ 2202 var player, 2203 isPlayed = false; 2204 2205 player = new YT.Player('video-player-' + $iframe.data('id'), { 2206 videoId: videoId, 2207 rel: false, 2208 events: { 2209 onReady: function(e) { 2210 e.target.playVideo(); 2211 }, 2212 onStateChange: function(e) { 2213 let $playerWrapper = $('#video-player-' + $iframe.data('id')) 2214 2215 if (e.data === 1 && !isPlayed) { 2216 $playerWrapper.closest('.video-container').find('.video-thumbnail').fadeOut('slow'); 2217 isPlayed = true; 2218 } 2219 2220 if ($playerWrapper.closest('.video-container').data('loop') && e.data === YT.PlayerState.ENDED) { 2221 e.target.playVideo(); 2222 } 2223 }, 2224 onError: function(e) { 2225 playTagIframe($iframe, videoId); 2226 } 2227 } 2228 }); 2229 } 2230 } 2231 2232 function playTagIframeVimeo(videoId, $iframe) { 2233 // Embed async the vimeo API script 2234 $.getScript('//player.vimeo.com/api/player.js', function(data, textStatus, jqxhr) { 2235 if (jqxhr.status === 200) { 2236 2237 var player, 2238 isPlayed = false;
2239 2240 player = new Vimeo.Player('video-player-' + $iframe.data('id'), { 2241 id: videoId 2242 }); 2243 2244 player.play().then(function() { 2245 if (!isPlayed) { 2246 $iframe.closest('.video-container').find('.video-thumbnail').fadeOut('slow'); 2247 isPlayed = true; 2248 } 2249 }).catch(function(error) { 2250 playTagIframe($iframe); 2251 }); 2252 2253 if ($iframe.closest('.video-container').data('loop')) { 2254 player.setLoop(true).then(function(loop) { 2255 // Enable loop 2256 }).catch(function(error) { 2257 playTagIframe($iframe); 2258 }); 2259 } 2260 2261 } else { 2262 playTagIframe($iframe); 2263 } 2264 }); 2265 } 2266 2267 // Get Social Provider Video Data 2268 function getSocialVideoData(url) { 2269 2270 // Get Youtube video data 2271 var youtubeRegex = /(youtube\.com|youtu\.be|youtube-nocookie\.com)\/(watch\?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*)).*/i; 2272 var youtubeMatch = url.match(youtubeRegex); 2273 if (youtubeMatch && youtubeMatch != null) { 2274 return { 2275 source: 'youtube', 2276 videoId: youtubeMatch[3] 2277 }; 2278 } 2279 2280 // Get Vimeo video data 2281 var vimeoRegex = /(?:vimeo(?:pro)?.com)\/(?:[^\d]+)?(\d+)(?:.*)/i; 2282 var vimeoMatch = url.match(vimeoRegex); 2283 if (vimeoMatch && vimeoMatch != null) { 2284 return { 2285 source: 'vimeo', 2286 videoId: vimeoMatch[1] 2287 }; 2288 } 2289 2290 return { 2291 source: false, 2292 videoId: false 2293 }; 2294 } 2295 2296 // Get lightbox width 2297 function getVideoboxWidth() { 2298 var $width, 2299 wWidth = $(window).width(), 2300 wHeight = $(window).height(); 2301 2302 if (wHeight >= wWidth) { 2303 2304 $width = wWidth - (lightboxMargin * 2); 2305 2306 } else { 2307 2308 var wHeightMax = (wHeight * 90) / 100; 2309 2310 if (wWidth > 1280) { 2311 var $width = (wHeightMax / 5768) * 10000; 2312 } else { 2313 var $width = (wHeightMax / 6120) * 10000; 2314 } 2315 2316 } 2317 2318 return Math.round($width) + 'px'; 2319 } 2320 2321 // Get lightbox height 2322 function getVideoHeight() { 2323 2324 var $height, 2325 wWidth = $(window).width(), 2326 wHeight = $(window).height(); 2327 2328 if (wHeight >= wWidth) { 2329 $height = ((wWidth - (lightboxMargin * 2)) * 5670) / 10000; 2330 } else { 2331 $height = ((wHeight * 90) / 100) + (lightboxMargin * 2); 2332 } 2333 return Math.round($height) + 'px'; 2334 } 2335 2336 $('.video-container').each(function() { 2337 2338 var $videoContainer = $(this); 2339 var playSource = $videoContainer.data('source'); 2340 var playTarget = $videoContainer.data('target'); 2341 var $iframe = $videoContainer.find('iframe'); 2342 var $video = $videoContainer.find('video'); 2343 2344 if ($videoContainer.data('autoplay')) { 2345 switch (playSource) { 2346 case 'social_hosted': 2347 playSocialHosted($iframe); 2348 break; 2349 case 'self_hosted': 2350 playSelfHosted($video); 2351 break; 2352 } 2353 } else { 2354 var $playIcon = $videoContainer.find('.mk-svg-icon'); 2355 $playIcon.bind('click', function(e) { 2356 e.preventDefault(); 2357 var isLightbox = (playTarget == 'lightbox') ? true : false; 2358 if (!isLightbox) { 2359 $playIcon.hide().next('.preloader-preview-area').show(); 2360 } 2361 switch (playSource) { 2362 case 'social_hosted': 2363 playSocialHosted($iframe, isLightbox); 2364 break; 2365 case 'self_hosted': 2366 playSelfHosted($video, isLightbox); 2367 break; 2368 } 2369 }); 2370 } 2371 }); 2372 } 2373 $(window).on('load vc_reload', mk_video_play); 2374 2375 // Resize icon size for responsive layout 2376 function mk_video_resize_play_icon() { 2377 $('.video-thumbnail-overlay').each(function() { 2378 var $thumbnailOverlay = $(this); 2379 var thumbnailWidth = $thumbnailOverlay.width(); 2380 var $svg = $thumbnailOverlay.find('svg'); 2381 if (typeof $svg.data('width') === 'undefined') { 2382 $svg.attr('data-width', $svg.width()); 2383 } 2384 if (typeof $svg.data('height') === 'undefined') { 2385 $svg.attr('data-height', $svg.height()); 2386 } 2387 if (($svg.data('width') * 4) > thumbnailWidth) { 2388 $svg.css({ 2389 width: Math.round((parseInt(thumbnailWidth) / 4)) + 'px', 2390 height: Math.round((parseInt(thumbnailWidth) / 4) * $svg.data('height') / $svg.data('width')) + 'px' 2391 }); 2392 } else { 2393 $svg.css({ 2394 width: $svg.data('width') + 'px', 2395 height: $svg.data('height') + 'px' 2396 }); 2397 } 2398 }); 2399 } 2400 $(window).on('load resize orientationChange vc_reload', mk_video_resize_play_icon); 2401}(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.