1(function ($) { 2 /**************************************************************** 3 PET HEALTH ARTICLES - Resize images based on width attribute 4 **************************************************************** */ 5 $(function () { 6 // Get pet health images 7 var petHealthContainer = $('#pethealth-wrap'); 8 var petHealthImages = petHealthContainer.find('img[width]'); 9 10 // Resize images to appropriate width 11 petHealthImages.each(function () { 12 var image = $(this); 13 var imageWidth = image.attr('width'); 14 if (imageWidth > 0) { 15 image.width(imageWidth); 16 } 17 }); 18 }); 19 20 /**************************************************************** 21 PET ARTICLE SEARCH - UI actions 22 **************************************************************** */ 23 $(function () { 24 function clearButtonState() { 25 let active = false; 26 $('.top-search-bar .hwrapper select').each(function() { 27 if($(this).val()!=="0") { 28 $("#btn-clear-article-search-filters").addClass("active"); 29 active = true; 30 } 31 }); 32 if(!active) $("#btn-clear-article-search-filters").removeClass("active"); 33 } 34 clearButtonState(); 35 // Drop down actions 36 $('.top-search-bar .hwrapper select').change(function() { 37 let link = $(this).attr('data-mainlink') + $(this).val(); 38 window.location = link; 39 clearButtonState(); 40 }); 41 // Clear filter button 42 $("#btn-clear-article-search-filters").click(function() { 43 $(this).removeClass('active'); 44 //just clear UX 45 $('.top-search-bar .hwrapper select').each(function() { 46 //rewrite the mainlink data for each select without filter values 47 $(this).attr('data-mainlink',$(this).data('mainlink').substring(0,$(this).data('mainlink').indexOf('?')+1)); 48 }); 49 if($('#btn-dog-breeds').length) { 50 $('#btn-dog-breeds').attr('data-mainlink', $("#btn-dog-breeds").data('mainlink').substring(0, $("#btn-dog-breeds").data('mainlink').indexOf('&') + 1)); 51 } 52 //revert selector indexes and reset classes 53 $('#btn-dog-breeds').removeClass('active'); 54 $('.top-search-bar .hwrapper select').prop('selectedIndex',0).removeClass('selected'); 55 $('.top-search-bar .hwrapper select').find('.option').removeClass('selected'); 56 //set input values to 0 57 $('input[name="ps"],input[name="pb"],input[name="pt"],input[name="pl"],input[name="ul"]').val("0"); 58 //...or reload page 59 //let link = $(this).data('link'); 60 //window.location = link; 61 }); 62 //dog breeds button 63 $("#btn-dog-breeds").click(function() { 64 let link = $(this).attr("data-mainlink"); 65 let keyword = encodeURIComponent($('input[name="pk"]').val()); 66 if(keyword!=="") link+="&pk="+keyword; 67 console.debug("DB link: " + link); 68 window.location = link; 69 }) 70 }); 71 /**************************************************************** 72 ASYMMETRIC ELEMENT 73 **************************************************************** */ 74 $(function () { 75 var asymmetricElements = $('.lifelearn-asymmetric-element'); 76 77 $(window).on('load', function () { 78 initializeElements(500); 79 }); 80 81 $(window).on('resize', function () { 82 initializeElements(0); 83 }); 84 85 function initializeElements(animationSpeed) { 86 $.each(asymmetricElements, function () { 87 var element = $(this); 88 var imageOnTop = element.hasClass('image-top-left') || element.hasClass('image-top-right'); 89 var image = element.find('.lifelearn-asymmetric-image'); 90 var content = element.find('.lifelearn-asymmetric-content'); 91 92 // Calculate content offset 93 var contentTopOffset = 0; 94 if (content.outerHeight() < (image.height() / 3) + 16) { 95 contentTopOffset = (image.height() / 3 * 2) + ((image.height() / 3) - content.outerHeight() + 16); 96 } else { 97 contentTopOffset = image.height() / 3 * 2; 98 } 99 100 // Calculate element height with content offset 101 var elementHeight = image.height() + (content.outerHeight() - (image.height() - contentTopOffset)); 102 103 // Animate element changes 104 content.animate({ 105 width: image.width(), 106 opacity: 1 107 }, animationSpeed); 108 109 if (imageOnTop) { 110 element.animate({ 111 paddingBottom: elementHeight - image.height() 112 }, animationSpeed); 113 content.animate({ 114 top: contentTopOffset 115 }, animationSpeed); 116 } else { 117 element.animate({ 118 paddingTop: elementHeight - image.height() 119 }, animationSpeed); 120 content.animate({ 121 bottom: contentTopOffset 122 }, animationSpeed); 123 } 124 }) 125 } 126 }); 127 128 /**************************************************************** 129 POPOVER LINK 130 **************************************************************** */ 131 $(function () { 132 // Initialize popover links 133 var links = $('[data-toggle="lifelearn-link-popover"]'); 134 links.popover({ 135 container: '#ajax-content-wrap', 136 content: function () { 137 return $($(this).data('content-target')).html(); 138 }, 139 delay: { 140 show: 400, 141 hide: 600 142 }, 143 html: true, 144 placement: function (node, link) { 145 var header = $('#header-outer'); 146 var domRect = $(link)[0].getBoundingClientRect(); 147 return domRect.top > 256 + header.outerHeight() ? 'top' : 'bottom'; 148 }, 149 template: '<div class="popover" role="tooltip"><div class="popover-content"></div></div>', 150 trigger: 'hover' 151 }); 152 153 // Disable popover from appearing on click 154 links.on('click', function () { 155 var link = $(this); 156 link.popover('hide'); 157 }) 158 }); 159 160 /**************************************************************** 161 VC SINGLE IMAGE 162 **************************************************************** */ 163 $(function () { 164 var singleImageWraps = $( 165 '.img-with-aniamtion-wrap[data-lifelearn-hover-style="3"], ' + 166 '.img-with-aniamtion-wrap[data-lifelearn-hover-style="5"]' 167 ); 168 $.each(singleImageWraps, function () { 169 var singleImageWrap = $(this); 170 171 var singleImageContainer = singleImageWrap.closest('.vc_column-inner'); 172 173 // Trigger hover effects when column link present 174 var columnLink = singleImageContainer.siblings('a.column-link'); 175 columnLink.on('mouseenter', function () { 176 var link = $(this); 177 var imageWrap = link.siblings('.vc_column-inner').find('.img-with-aniamtion-wrap'); 178 imageWrap.addClass('lifelearn-hover-active'); 179 }); 180 columnLink.on('mouseleave', function () { 181 var link = $(this); 182 var imageWrap = link.siblings('.vc_column-inner').find('.img-with-aniamtion-wrap'); 183 imageWrap.removeClass('lifelearn-hover-active'); 184 }); 185 186 // Move 'overflow: hidden' style from element to containing row 187 // when image max width is greater than 100% 188 var imageMaxWidth = parseInt(singleImageWrap.data('max-width')); 189 if (imageMaxWidth > 100) { 190 var imageOverlay = singleImageWrap.find('.lifelearn-image-hover-overlay'); 191 imageOverlay.closest('.inner').css('position', 'relative'); 192 imageOverlay.next('.img-with-animation').css('paddingRight', '0'); 193 singleImageWrap.css('overflow', 'visible'); 194 singleImageWrap.closest('.col.span_12').css('overflow', 'hidden'); 195 } 196 }); 197 }); 198 199 /**************************************************************** 200 VC COLUMN - Adjust image size if necessary 201 **************************************************************** */ 202 $(function () { 203 var columns = $('.wpb_column[data-lifelearn-hover-style]'); 204 $.each(columns, function () { 205 var column = $(this); 206 var columnImage = column.find('.lifelearn-column-image'); 207 if (columnImage.length > 0) { 208 updateColumnImageClass(column, columnImage); 209 210 $(window).on('resize', function () { 211 updateColumnImageClass(column, columnImage); 212 }) 213 } 214 }); 215 216 /** 217 * Update column image class depending on column aspect ratio 218 * 219 * @param column 220 * @param columnImage 221 */ 222 function updateColumnImageClass(column, columnImage) { 223 if (calculateAspectRatio(column) > calculateAspectRatio(columnImage)) { 224 updateColumnImageClassToTall(columnImage); 225 } else { 226 updateColumnImageClassToWide(columnImage); 227 } 228 } 229 230 /** 231 * Update column image class so that it fills its containing column's width 232 * 233 * @param columnImage 234 */ 235 function updateColumnImageClassToTall(columnImage) { 236 columnImage.addClass('lifelearn-column-image-tall'); 237 columnImage.removeClass('lifelearn-column-image-wide'); 238 } 239 240 /** 241 * Update column image class so that it fills its containing column's height 242 * 243 * @param columnImage 244 */ 245 function updateColumnImageClassToWide(columnImage) { 246 columnImage.addClass('lifelearn-column-image-wide'); 247 columnImage.removeClass('lifelearn-column-image-tall'); 248 } 249 250 /** 251 * Returns the aspect ratio of the specified element 252 * 253 * @param element 254 * @returns {number} 255 */ 256 function calculateAspectRatio(element) { 257 return element.outerWidth() / element.outerHeight(); 258 } 259 }); 260 261 /**************************************************************** 262 LAYOUT COMPONENTS 263 **************************************************************** */ 264 $(function () { 265 var ajaxContentWrap = $('#ajax-content-wrap'); 266 267 var headerComponent = $('#lifelearn-layout-header-container'); 268 if (headerComponent.length > 0) { 269 // Remove negative top margin from header component 270 removeTopMarginFromFirstSection(headerComponent); 271 272 // Move header component below page header or first slider 273 var pageHeader = $('#page-header-wrap'); 274 var firstSlider = $( 275 '.wpb_row.full-width-content .nectar-slider-wrap, ' + 276 '.wpb_row.full-width-section .nectar-slider-wrap, ' + 277 '.wpb_row.full-width-content .col.span_12 .wpb_revslider_element, ' + 278 '.wpb_row.full-width-section .col.span_12 .wpb_revslider_element' 279 ).first(); 280 if (pageHeader.length > 0) { 281 headerComponent.insertAfter(pageHeader); 282 } else if (firstSlider.length > 0) { 283 var sliderRow = firstSlider.closest('.wpb_row'); 284 headerComponent.insertAfter(sliderRow); 285 } 286 287 var nextContainerWrap = headerComponent.next('.container-wrap, .page-header-no-bg'); 288 ajaxContentWrap.css('background-color', nextContainerWrap.css('background-color')); 289 290 // Remove negative top margin from following content container or page header (w/o bg) 291 var cwMarginTop = parseInt(nextContainerWrap.css('margin-top')); 292 if (cwMarginTop < 0) { 293 nextContainerWrap.css('margin-top', '0'); 294 } 295 296 // Add top padding to content container 297 var cwPaddingTop = parseInt(nextContainerWrap.css('padding-top')); 298 if (cwPaddingTop === 0 && !firstContainerRowIsFullWidth(nextContainerWrap)) { 299 nextContainerWrap.css('padding-top', ''); 300 } 301 } 302 303 var footerComponent = $('#lifelearn-layout-footer-container'); 304 if (footerComponent.length > 0) { 305 // Remove negative top margin from footer component 306 removeTopMarginFromFirstSection(footerComponent); 307 308 var prevContainerWrap = footerComponent.prev('.container-wrap'); 309 ajaxContentWrap.css('background-color', prevContainerWrap.css('background-color')); 310 311 // Add bottom padding to content container 312 var cwPaddingBottom = parseInt(prevContainerWrap.css('padding-bottom')); 313 if (cwPaddingBottom === 0 && !lastContainerRowIsFullWidth(prevContainerWrap)) { 314 prevContainerWrap.css('padding-bottom', ''); 315 } 316 } 317 318 /** 319 * Check if first section in first row is full width 320 * 321 * @param container 322 */ 323 function firstContainerRowIsFullWidth(container) { 324 var firstSection = container.find('.container.main-content > .row:first-child > .wpb_row:first-child'); 325 return firstSection.is('.full-width-content') || firstSection.is('.full-width-section'); 326 } 327 328 /** 329 * Check if last section in last row is full width 330 * 331 * @param container 332 */ 333 function lastContainerRowIsFullWidth(container) { 334 var lastSection = container.find('.container.main-content > .row:last-child > .wpb_row:last-child'); 335 return lastSection.is('.full-width-content') || lastSection.is('.full-width-section'); 336 } 337 338 /** 339 * Remove the negative top margin in the first section in a header or 340 * footer layout component 341 * 342 * @param component 343 */ 344 function removeTopMarginFromFirstSection(component) { 345 var firstSection = component.find('.row >
345 .first-section'); 346 var marginTop = parseInt(firstSection.css('margin-top')); 347 if (marginTop < 0) { 348 firstSection.css('margin-top', ''); 349 } 350 } 351 }); 352 353 /* **************************************************************** 354 * VC COLUMN - Sticky column feature 355 * **************************************************************** */ 356 $(function () { 357 // Loop through columns with sticky option enabled 358 var stickyColumns = $('[data-lifelearn-sticky="true"]'); 359 stickyColumns.each(function (index) { 360 var stickyColumn = $(this); 361 362 // Reposition sticky column on page load if page has scrolled and if on desktop 363 if ($(window).scrollTop() > 0 && $(window).width() >= 1000) { 364 repositionStickyColumn(stickyColumn); 365 } 366 367 // Reposition sticky column on page scroll/resize, or remove sticky if on mobile 368 $(window).on('scroll resize', function () { 369 if ($(window).width() >= 1000) { 370 repositionStickyColumn(stickyColumn); 371 } else { 372 removeStickyFromColumn(stickyColumn); 373 } 374 }); 375 }); 376 377 /** 378 * Reposition sticky column (or remove sticky from column) depending on several calculated factors 379 * 380 * @param stickyColumn 381 */ 382 function repositionStickyColumn(stickyColumn) { 383 // Get sticky column height 384 var stickyColumnHeight = stickyColumn.outerHeight(); 385 386 // Determine positions where column should be sticky 387 var stickyColumnContainer = stickyColumn.parent('.col.span_12'); 388 var stickyColumnStartPosition = stickyColumnContainer.offset().top; 389 var stickyColumnEndPosition = stickyColumnStartPosition + stickyColumnContainer.outerHeight(); 390 391 // Calculate site header height 392 var headerHeight = $('#header-secondary-outer').outerHeight() 393 + $('#header-outer').outerHeight() 394 + $('.sticky-wrapper > .page-submenu').outerHeight(); 395 396 // Calculate how much page has scrolled down 397 var wpAdminBar = $('#wpadminbar'); 398 var wpAdminBarHeight = wpAdminBar.outerHeight(); 399 var scrollOffset = $(window).scrollTop() + wpAdminBarHeight; 400 401 // Position column or remove sticky feature based on calculated factors above 402 if (headerHeight + scrollOffset + stickyColumnHeight > stickyColumnEndPosition) { 403 // Stick to bottom 404 addStickyToColumn(stickyColumn, { 405 position: 'absolute', 406 top: '', 407 bottom: '0' 408 }); 409 } else if (headerHeight + scrollOffset >= stickyColumnStartPosition) { 410 // Stick to top 411 addStickyToColumn(stickyColumn, { 412 position: 'fixed', 413 top: headerHeight + wpAdminBarHeight, 414 bottom: '' 415 }); 416 } else { 417 // Remove sticky 418 removeStickyFromColumn(stickyColumn); 419 } 420 } 421 422 /** 423 * Add sticky feature to specified column. 424 * 425 * @param stickyColumn 426 * @param css 427 */ 428 function addStickyToColumn(stickyColumn, css) { 429 // Add sticky column placeholder 430 var stickyColumnPlaceholder = stickyColumn.prev('.lifelearn-sticky-column-placeholder'); 431 if (stickyColumnPlaceholder.length === 0) { 432 stickyColumnPlaceholder = addStickyColumnPlaceholder(stickyColumn); 433 } 434 435 // Calculate column left position 436 css.left = css.position === 'fixed' ? 437 stickyColumnPlaceholder.offset().left - parseFloat(stickyColumnPlaceholder.css('margin-left')) : 438 stickyColumnPlaceholder.position().left; 439 440 // Add sticky CSS to column 441 stickyColumn.css('width', stickyColumnPlaceholder[0].getBoundingClientRect().width); 442 stickyColumn.css('position', css.position); 443 stickyColumn.css('top', css.top); 444 stickyColumn.css('bottom', css.bottom); 445 stickyColumn.css('left', css.left); 446 setColumnMargin(stickyColumn, getColumnMargin(stickyColumnPlaceholder)); 447 setColumnPadding(stickyColumn, getColumnPadding(stickyColumnPlaceholder)); 448 449 // Fix CSS on sticky column container 450 stickyColumn.parent('.flip-in-vertical-wrap').css('perspective', 'none'); 451 stickyColumn.parent('.flip-in-vertical-wrap').css('-webkit-perspective', 'none'); 452 } 453 454 /** 455 * Removes sticky feature from specified column. 456 * 457 * @param stickyColumn 458 */ 459 function removeStickyFromColumn(stickyColumn) { 460 // Remove sticky column placeholder 461 var stickyColumnPlaceholder = stickyColumn.prev('.lifelearn-sticky-column-placeholder'); 462 if (stickyColumnPlaceholder.length > 0) { 463 stickyColumnPlaceholder.remove(); 464 } 465 466 // Remove sticky CSS from column 467 stickyColumn.css('width', ''); 468 stickyColumn.css('position', ''); 469 stickyColumn.css('top', ''); 470 stickyColumn.css('bottom', ''); 471 stickyColumn.css('left', ''); 472 stickyColumn.css('margin', ''); 473 stickyColumn.css('padding', ''); 474 475 // Add CSS to sticky column container 476 stickyColumn.parent('.flip-in-vertical-wrap').css('perspective', ''); 477 stickyColumn.parent('.flip-in-vertical-wrap').css('-webkit-perspective', ''); 478 } 479 480 /** 481 * Add placeholder column to take original position of sticky column. This is 482 * to prevent the layout from breaking when the sticky column position changes. 483 * 484 * @param stickyColumn 485 */ 486 function addStickyColumnPlaceholder(stickyColumn) { 487 // Add placeholder column immediately before sticky column 488 stickyColumn.before('<div class="lifelearn-sticky-column-placeholder"></div>'); 489 490 // Add the same classes from the sticky column to the placeholder column 491 var stickyColumnPlaceholder = stickyColumn.prev('.lifelearn-sticky-column-placeholder'); 492 stickyColumnPlaceholder.addClass(stickyColumn[0].className); 493 494 return stickyColumnPlaceholder; 495 } 496 497 /** 498 * Get margin from specified column 499 * 500 * @param column 501 * @returns {{top, left, right, bottom}} 502 */ 503 function getColumnMargin(column) { 504 return { 505 top: column.css('margin-top'), 506 left: column.css('margin-left'), 507 right: column.css('margin-right'), 508 bottom: column.css('margin-bottom') 509 } 510 } 511 512 /** 513 * Set margin on specified column 514 * 515 * @param columnsetColumnMargin 516 * @param margin 517 */ 518 function setColumnMargin(column, margin) { 519 column.css('margin-top', margin.top); 520 column.css('margin-left', margin.left); 521 column.css('margin-right', margin.right); 522 column.css('margin-bottom', margin.bottom); 523 } 524 525 /** 526 * Get padding from specified column 527 * 528 * @param column 529 * @returns {{top, left, right, bottom}} 530 */ 531 function getColumnPadding(column) { 532 return { 533 top: column.css('padding-top'), 534 left: column.css('padding-left'), 535 right: column.css('padding-right'), 536 bottom: column.css('padding-bottom') 537 } 538 } 539 540 /** 541 * Set padding on specified column 542 * 543 * @param column 544 * @param padding 545 */ 546 function setColumnPadding(column, padding) { 547 column.css('padding-top', padding.top); 548 column.css('padding-left', padding.left); 549 column.css('padding-right', padding.right); 550 column.css('padding-bottom', padding.bottom); 551 } 552 }); 553 554 /* **************************************************************** 555 * VC PAGE SUBMENU 556 * **************************************************************** */ 557 $(function () { 558 // Fix top position CSS if necessary 559 var wpAdminBar = $('#wpadminbar'); 560 var secondaryHeader = $('#header-secondary-outer'); 561 var primaryHeader = $('#header-outer'); 562 563 var pageSubmenu = $('.page-submenu').first(); 564 565 if (pageSubmenu.length > 0) { 566 $(window).on('load scroll', function () { 567 // Calculate header height 568 var headerHeight = wpAdminBar.outerHeight() + 569 secondaryHeader.outerHeight() + 570 primaryHeader.outerHeight(); 571 572 // Get Page Submenu top position 573 var pageSubmenuOffset = pageSubmenu.position().top; 574 575 // Adjust top CSS rule if necessary 576 if (pageSubmenuOffset > headerHeight) { 577 pageSubmenu.css('top', headerHeight + 'px'); 578 } 579 }); 580 581 582 // Link hover CSS must be applied using JS to overwrite !important rule 583 var hoverColor = pageSubmenu.data('link-hover-color'); 584 if (hoverColor && hoverColor !== 'inherit') { 585 var links = pageSubmenu.find('ul li a'); 586 587 // Change link color on hover 588 links.on('mouseenter', function () { 589 $(this).attr('style', 'color: ' + hoverColor + ' !important;'); 590 }); 591 links.on('mouseleave', function () { 592 $(this).css('color', ''); 593 }); 594 } 595 596 597 // Set link separator color from data attribute 598 var separatorColor = pageSubmenu.data('separator-color'); 599 pageSubmenu.find('li').css('border-color', separatorColor); 600 } 601 }); 602 603 /* WOS-734: Added some javascript to control where the logo goes when on centered logo theme */ 604 function centerLogoBetweenMenu(){ 605 //Get the breakpoint for mobile 606 var breakpoint = $('body').attr('data-header-breakpoint'); 607 608 //Calc where to put the logo by getting the number of menu items divi
608ding by two, rounding down and subtracting 1. 609 var menuItem = Math.floor($('header nav .sf-menu > .menu-item').length/2) - 1; 610 611 //Get the middle menu item, this is where the theme puts the logo space 612 var element = $('#header-outer[data-format="centered-logo-between-menu"] nav >ul.sf-menu > li:eq('+menuItem+')'); 613 614 //Get the position of the middle menu item from the left side 615 var position = element.position().left; 616 617 //Get the value of the right margin of the middle menu item as an int 618 var margin = parseInt(element.css('margin-right')); 619 620 //Get the width of the logo image 621 var widthImage = $('a#logo img').width(); 622 623 //Calculate the offset by subtracting the image width from the margin and dividing by two 624 var offset = (margin - widthImage)/2; 625 626 //Get the width of the middle menu item 627 var widthMenu = element.width(); 628 629 //Check to see if the window is smaller than the mobile breakpoint 630 if ($(window).width() > breakpoint){ 631 //If it isn't and the menu is in desktop mode add the position to the width and a 7.5px 632 //gutter so the logo is between the middle and next menu item 633 $('#header-outer[data-format="centered-logo-between-menu"] a#logo').parent().css('left', position + widthMenu + offset); 634 } else { 635 //If it isn't and the menu is in mobile mode, place the logo at the left side 636 $('#header-outer[data-format="centered-logo-between-menu"] a#logo').parent().css('left', 0); 637 } 638 } 639 640 /*Salient 10.5 comes with responsive feature to handle the logo itself. this method call is commented by Prince in orded to fix WDVM-385 copy current issue url WEB7- Logo is not in center*/ 641 /*$(window).on('load resize', function () { 642 if($('#header-outer').attr('data-format') === 'centered-logo-between-menu'){ 643 centerLogoBetweenMenu(); 644 } 645 });*/ 646 647 648})(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.