40 lines
1.3 KiB
JavaScript
40 lines
1.3 KiB
JavaScript
|
|
/* Vereinswappen-Fallback: lädt ein <img class="crest"> nicht (404, kaputtes Bild),
|
||
|
|
wird es durch den Initialen-Kreis ersetzt — kein kaputtes Bild-Icon. Progressive
|
||
|
|
Enhancement; ohne JS bleibt höchstens das (alt="") leere Bild. */
|
||
|
|
(function () {
|
||
|
|
'use strict';
|
||
|
|
|
||
|
|
function initials(name) {
|
||
|
|
var parts = (name || '').split(/[\s.\-]+/);
|
||
|
|
var out = '';
|
||
|
|
for (var i = 0; i < parts.length && out.length < 2; i++) {
|
||
|
|
if (parts[i]) {
|
||
|
|
out += parts[i].charAt(0);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return (out || '?').toUpperCase();
|
||
|
|
}
|
||
|
|
|
||
|
|
function replace(img) {
|
||
|
|
var span = document.createElement('span');
|
||
|
|
span.className = 'crest crest--initials';
|
||
|
|
span.setAttribute('aria-hidden', 'true');
|
||
|
|
span.textContent = initials(img.getAttribute('data-club'));
|
||
|
|
if (img.parentNode) {
|
||
|
|
img.parentNode.replaceChild(span, img);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
var imgs = document.querySelectorAll('img.crest');
|
||
|
|
Array.prototype.forEach.call(imgs, function (img) {
|
||
|
|
// Bereits fehlgeschlagen, bevor JS lief?
|
||
|
|
if (img.complete && img.naturalWidth === 0) {
|
||
|
|
replace(img);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
img.addEventListener('error', function () {
|
||
|
|
replace(img);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
})();
|