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