https://www.newmexicojuniorwrestling.com/media/mod_bw_social_share…rrssb_mod_bw_social_share_vanilla.js?6fad17

1(function () {
2  "use strict";
3
4  var MIN_TEXT_WIDTH = 160; // Mindestbreite für Buttons mit Text (px)
5  var MIN_CONTAINER_WIDTH = 420;
6  var MAX_CONTAINER_WIDTH = 1320;
7  var MIN_FONT_SIZE = 13;
8  var MAX_FONT_SIZE = 17;
9  var MIN_BUTTON_HEIGHT = 44;
10  var MAX_BUTTON_HEIGHT = 52;
11  var MIN_ICON_ONLY_SIZE = 40;
12  var SMALL_ICON_FACTOR = 0.82;
13  var TEXT_ICON_FACTOR = 0.74;
14  var SERVICE_ICON_FACTORS = {
15    whatsapp: 0.88,
16  };
17
18  function clamp(value, min, max) {
19    return Math.min(Math.max(value, min), max);
20  }
21
22  function lerp(min, max, t) {
23    return min + (max - min) * t;
24  }
25
26  function getServiceFromLi(li) {
27    if (!li) return null;
28    var classes = Array.prototype.slice.call(li.classList || []);
29    for (var i = 0; i < classes.length; i++) {
30      var cls = classes[i];
31      if (cls.indexOf("rrssb-") === 0) {
32        return cls.replace("rrssb-", "");
33      }
34    }
35    return null;
36  }
37
38  function visibleItems(ul) {
39    var items = Array.prototype.slice.call(ul.querySelectorAll("li"));
40    return items.filter(function (li) {
41      if (!li.offsetParent) return false;
42      var style = window.getComputedStyle(li);
43      return style.display !== "none" && style.visibility !== "hidden";
44    });
45  }
46
47  function resetItem(li) {
48    li.classList.remove("is-icon-only", "is-text");
49    li.style.removeProperty("--bw-icon-scale");
50  }
51
52  function getGap(ul) {
53    var styles = window.getComputedStyle(ul);
54    var gap = styles.gap || styles.columnGap || styles.gridColumnGap;
55    var value = parseFloat(gap || "0");
56    return isNaN(value) ? 0 : value;
57  }
58
59  function getMinTextWidth(ul) {
60    var styles = window.getComputedStyle(ul);
61    var raw = styles.getPropertyValue("--bw-min-text-width");
62    var value = parseFloat(raw);
63    return isNaN(value) ? MIN_TEXT_WIDTH : value;
64  }
65
66  function computeIconSize(buttonHeight, factor) {
67    var base = clamp(factor, 0.5, 1.1);
68    var size = Math.round(buttonHeight * base);
69    var maxSize = Math.max(buttonHeight - 6, MIN_ICON_ONLY_SIZE);
70    return clamp(size, Math.round(buttonHeight * 0.5), maxSize);
71  }
72
73  function calculateMetrics(containerWidth) {
74    var t;
75    if (MAX_CONTAINER_WIDTH === MIN_CONTAINER_WIDTH) {
76      t = 0;
77    } else {
78      t =
79        (containerWidth - MIN_CONTAINER_WIDTH) /
80        (MAX_CONTAINER_WIDTH - MIN_CONTAINER_WIDTH);
81    }
82    t = clamp(t, 0, 1);
83
84    var buttonHeight = Math.round(
85      lerp(MIN_BUTTON_HEIGHT, MAX_BUTTON_HEIGHT, t)
86    );
87    var fontSize = Math.round(lerp(MIN_FONT_SIZE, MAX_FONT_SIZE, t));
88
89    return {
90      fontSize: fontSize,
91      buttonHeight: buttonHeight,
92      iconText: computeIconSize(buttonHeight, TEXT_ICON_FACTOR),
93      smallSize: buttonHeight,
94    };
95  }
96
97  function applyMetrics(ul, metrics) {
98    var iconSmall = computeIconSize(metrics.smallSize, SMALL_ICON_FACTOR);
99    ul.style.setProperty("--bw-button-height", metrics.buttonHeight + "px");
100    ul.style.setProperty("--bw-font-size", metrics.fontSize + "px");
101    ul.style.setProperty("--bw-icon-size-text", metrics.iconText + "px");
102    ul.style.setProperty("--bw-small-size", metrics.smallSize + "px");
103    ul.style.setProperty("--bw-icon-size-small", iconSmall + "px");
104  }
105
106  function applyServiceFactor(li) {
107    var service = getServiceFromLi(li);
108    if (service && SERVICE_ICON_FACTORS[service]) {
109      li.style.setProperty("--bw-icon-scale", SERVICE_ICON_FACTORS[service]);
110    }
111  }
112
113  function abbreviateLabels(ul, containerWidth) {
114    var texts = ul.querySelectorAll("li.is-text .rrssb-text");
115    var textCount = texts.length;
116    var maxChars = null;
117
118    if (containerWidth < 560) {
119      maxChars = 6;
120    } else if (containerWidth < 640) {
121      maxChars = 7;
122    } else if (containerWidth < 760) {
123      maxChars = 8;
124    } else if (containerWidth < 900) {
125      maxChars = 9;
126    }
127
128    if (textCount <= 1 && containerWidth >= 490 && containerWidth <= 575) {
129      var extendedLimit = 12;
130      maxChars = extendedLimit;
131    }
132
133    texts.forEach(function (node) {
134      var full = node.getAttribute("data-fulltext");
135      if (!full) {
136        full = node.textContent.trim();
137        node.setAttribute("data-fulltext", full);
138      }
139
140      if (maxChars && full.length > maxChars) {
141        node.textContent = full.slice(0, maxChars - 1) + "…";
142      } else if (!maxChars) {
143        node.textContent = full;
144      } else {
145        node.textContent = full;
146      }
147    });
148  }
149
150  function layoutOne(ul) {
151    var items = visibleItems(ul);
152    if (items.length === 0) {
153      return;
154    }
155
156    var containerWidth = ul.clientWidth || ul.getBoundingClientRect().width;
157    var gap = getGap(ul);
158    var metrics = calculateMetrics(containerWidth);
159

160    items.forEach(resetItem);
161
162    var forceSmall = ul.classList.contains("bw-social-share-buttons-small");
163    var forceLarge = ul.classList.contains("bw-social-share-buttons-large");
164    var minTextWidth = getMinTextWidth(ul);
165
166    var maxText = Math.min(
167      items.length,
168      Math.floor(containerWidth / minTextWidth)
169    );
170    if (forceSmall) {
171      maxText = 0;
172    } else if (forceLarge) {
173      maxText = items.length;
174    }
175
176    var allIcon = false;
177
178    while (maxText > 0 && !forceLarge) {
179      var iconCount = items.length - maxText;
180      var iconWidth = iconCount * metrics.buttonHeight;
181      var needed = maxText * minTextWidth + iconWidth;
182      var total = needed + gap * (items.length - 1);
183
184      if (total <= containerWidth) {
185        break;
186      }
187
188      maxText -= 1;
189    }
190
191    if (maxText <= 0) {
192      maxText = 0;
193      allIcon = true;
194    }
195
196    var iconCountFinal = items.length - maxText;
197
198    if (allIcon) {
199      var totalGap = gap * (items.length - 1);
200      var available = Math.max(containerWidth - totalGap, 0);
201      var iconSize = available > 0 ? Math.floor(available / items.length) : 0;
202      var minIcon = Math.max(32, Math.floor(MIN_ICON_ONLY_SIZE * 0.9));
203
204      if (iconSize <= 0) {
205        iconSize = minIcon;
206      }
207
208      iconSize = clamp(iconSize, minIcon, MAX_BUTTON_HEIGHT);
209      metrics.buttonHeight = iconSize;
210      metrics.smallSize = iconSize;
211      metrics.iconText = computeIconSize(iconSize, TEXT_ICON_FACTOR);
212    }
213
214    applyMetrics(ul, metrics);
215
216    items.forEach(function (li, index) {
217      if (index < maxText) {
218        li.classList.add("is-text");
219      } else {
220        li.classList.add("is-icon-only");
221      }
222      applyServiceFactor(li);
223    });
224
225    ul.classList.toggle("is-all-icons", allIcon);
226    ul.classList.toggle("is-all-text", maxText === items.length);
227    ul.classList.toggle("is-mixed", !allIcon && iconCountFinal > 0);
228    ul.classList.toggle("is-small-only", allIcon);
229
230    abbreviateLabels(ul, containerWidth);
231  }
232
233  function layoutAll() {
234    var lists = document.querySelectorAll(
235      ".rrssb-buttons.bw-social-share-buttons"
236    );
237    lists.forEach(function (ul) {
238      layoutOne(ul);
239    });
240  }
241
242  var resizeTimer;
243  function onResize() {
244    if (resizeTimer) window.cancelAnimationFrame(resizeTimer);
245    resizeTimer = window.requestAnimationFrame(layoutAll);
246  }
247
248  document.addEventListener("DOMContentLoaded", layoutAll);
249  window.addEventListener("resize", onResize, { passive: true });
250})();