https://www.umb.com/modules/custom/aprimo_media/js/aprimo-dimension-logger.js?v=1

1(function() {
2  'use strict';
3
4  // Log all Aprimo images with their dimensions
5  document.addEventListener('DOMContentLoaded', function() {
6    const aprimoImages = document.querySelectorAll('.aprimo-image');
7
8    if (aprimoImages.length > 0) {
9      // console.group('%c📐 Aprimo Image Dimensions Verification', 'color: #0071b8; font-weight: bold; font-size: 14px;');
10      // console.log('%cTotal Aprimo images found: ' + aprimoImages.length, 'color: #0071b8; font-weight: bold;');
11
12      aprimoImages.forEach((img, index) => {
13        const style = img.getAttribute('data-image-style') || 'none';
14        const width = img.getAttribute('data-image-width');
15        const height = img.getAttribute('data-image-height');
16        const alt = img.getAttribute('alt');
17        const src = img.getAttribute('src');
18
19        console.group(`%cImage ${index + 1}: ${alt || 'Unnamed'}`, 'color: #0071b8; font-weight: bold;');
20        // console.log('%cImage Style:', 'font-weight: bold;', style);
21        // console.log('%cDimensions:', 'font-weight: bold;', `${width}x${height}px`);
22        // console.log('%cSource:', 'font-weight: bold;', src);
23        // console.log('%cActual Size:', 'font-weight: bold;', `${img.naturalWidth}x${img.naturalHeight}px (loaded)`);
24        // console.log('%cElement:', 'font-weight: bold;', img);
25        console.groupEnd();
26      });
27
28      console.groupEnd();
29    }
30
31    // Log card component dimensions
32    // logCardComponentDimensions();
33  });
34
35  // Log specific card component dimensions
36  function logCardComponentDimensions() {
37    const cardComponents = {
38      'card_featured_content_promo_carousel': { expected: '416x465' },
39      'card_multi_photo': { expected: '328x204' },
40      'card_solutions': { expected: '632x301' },
41      'featured_article': { expected: '630x240' }
42    };
43
44    console.group('%c🎨 Card Component Dimensions', 'color: #28a745; font-weight: bold; font-size: 14px;');
45
46    Object.keys(cardComponents).forEach(componentClass => {
47      const elements = document.querySelectorAll('[class*="' + componentClass + '"]');
48      if (elements.length > 0) {
49        console.group(`%c${componentClass}`, 'color: #28a745; font-weight: bold;');
50        // console.log('%cExpected dimensions:', 'font-weight: bold;', cardComponents[componentClass].expected);
51        // console.log('%cElements found:', 'font-weight: bold;', elements.length);
52
53        elements.forEach((el, idx) => {
54          const images = el.querySelectorAll('img');
55          if (images.length > 0) {
56            images.forEach((img, imgIdx) => {
57              // console.log(`%cImage ${imgIdx + 1}:`, 'font-weight: bold;',
58              //   `${img.getAttribute('data-image-width')}x${img.getAttribute('data-image-height')}px`);
59            });
60          }
61        });
62
63        console.groupEnd();
64      }
65    });
66
67    console.groupEnd();
68  }
69
70  // Monitor for dynamically added images
71  // const observer = new MutationObserver(function(mutations) {
72  //   mutations.forEach(function(mutation) {
73  //     if (mutation.addedNodes.length) {
74  //       const newAprimoImages = document.querySelectorAll('.aprimo-image[data-image-width]');
75  //       if (newAprimoImages.length > 0) {
76  //         console.log('%c✅ New Aprimo images detected and logged', 'color: #0071b8; font-weight: bold;');
77  //         // logCardComponentDimensions();
78  //       }
79  //     }
80  //   });
81  // });
82
83  // Start observing the document for changes
84  // observer.observe(document.body, {
85  //   childList: true,
86  //   subtree: true
87  // });
88
89})();