diff --git a/js/extlink.js b/js/extlink.js index d1a90223036c012ff6c5bf7c35bcc72f598fd70e..e451d3d7b2057e3b90541a66a10e1670a2dc48d7 100644 --- a/js/extlink.js +++ b/js/extlink.js @@ -420,18 +420,25 @@ iconElement = document.createElement('span'); iconElement.setAttribute('class', `fa-${className} extlink`); if (className === drupalSettings.data.extlink.mailtoClass) { - iconElement.innerHTML = `<span class="${drupalSettings.data.extlink.extFaMailtoClasses}" data-extlink-placement="${iconPlacement}" aria-label="${drupalSettings.data.extlink.mailtoLabel}"></span>`; + if (drupalSettings.data.extlink.mailtoLabel) { + link.ariaLabel = drupalSettings.data.extlink.mailtoLabel; + } + iconElement.innerHTML = `<span class="${drupalSettings.data.extlink.extFaMailtoClasses}" data-extlink-placement="${iconPlacement}"></span>`; } else if (className === drupalSettings.data.extlink.extClass) { - iconElement.innerHTML = `<span class="${drupalSettings.data.extlink.extFaLinkClasses}" data-extlink-placement="${iconPlacement}" aria-label="${drupalSettings.data.extlink.extLabel}"></span>`; + if (drupalSettings.data.extlink.extLabel) { + link.ariaLabel = drupalSettings.data.extlink.extLabel; + } + iconElement.innerHTML = `<span class="${drupalSettings.data.extlink.extFaLinkClasses}" data-extlink-placement="${iconPlacement}"></span>`; } else if (className === drupalSettings.data.extlink.telClass) { - iconElement.innerHTML = `<span class="${drupalSettings.data.extlink.extFaTelClasses}" data-extlink-placement="${iconPlacement}" aria-label="${drupalSettings.data.extlink.telLabel}"></span>`; + if (drupalSettings.data.extlink.telLabel) { + link.ariaLabel = drupalSettings.data.extlink.telLabel; + } + iconElement.innerHTML = `<span class="${drupalSettings.data.extlink.extFaTelClasses}" data-extlink-placement="${iconPlacement}""></span>`; } } else { iconElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg'); iconElement.setAttribute('focusable', 'false'); iconElement.classList.add(className); - iconElement.setAttribute('role', 'img'); - iconElement.setAttribute('aria-hidden', drupalSettings.data.extlink.extHideIcons); iconElement.setAttribute('data-extlink-placement', iconPlacement); if (className === drupalSettings.data.extlink.mailtoClass) { iconElement.setAttribute('aria-label', drupalSettings.data.extlink.mailtoLabel); @@ -447,6 +454,8 @@ iconElement.innerHTML = `<metadata><sfw xmlns="http://ns.adobe.com/SaveForWeb/1.0/"><sliceSourceBounds y="-8160" x="-8165" width="16389" height="16384" bottomLeftOrigin="true"/><optimizationSettings><targetSettings targetSettingsID="0" fileFormat="PNG24Format"><PNG24Format transparency="true" filtered="false" interlaced="false" noMatteColor="false" matteColor="#FFFFFF"/></targetSettings></optimizationSettings></sfw></metadata><title>${drupalSettings.data.extlink.telLabel}</title><path xmlns="http://www.w3.org/2000/svg" d="M169.393,167.37l-14.919,9.848c-9.604,6.614-50.531,14.049-106.211-53.404 C-5.415,58.873,9.934,22.86,17.134,14.555L29.523,1.678c2.921-2.491,7.328-2.198,9.839,0.811l32.583,38.543l0.02,0.02 c2.384,2.824,2.306,7.22-0.83,9.868v0.029l-14.44,10.415c-5.716,5.667-0.733,14.587,5.11,23.204l27.786,32.808 c12.926,12.477,20.009,18.241,26.194,14.118l12.008-13.395c2.941-2.472,7.328-2.169,9.839,0.821l32.603,38.543v0.02 C172.607,160.316,172.519,164.703,169.393,167.37z"/>`; } } + iconElement.setAttribute('role', 'img'); + iconElement.setAttribute('aria-hidden', drupalSettings.data.extlink.extHideIcons); link[iconPlacement](iconElement); } }