diff --git a/tarteaucitron.js b/tarteaucitron.js index f53eb0a4..6dc2b525 100644 --- a/tarteaucitron.js +++ b/tarteaucitron.js @@ -308,6 +308,7 @@ var tarteaucitron = { html = '', index, orientation = 'Top', + modalAttrs = '', cat = ['ads', 'analytic', 'api', 'comment', 'social', 'support', 'video', 'other'], i; @@ -419,8 +420,12 @@ var tarteaucitron = { orientation = 'Bottom'; } + if (tarteaucitron.parameters.orientation === 'middle' || tarteaucitron.parameters.orientation === 'popup') { + modalAttrs = ' role="dialog" aria-modal="true" aria-labelledby="tac_title"'; + } + if (tarteaucitron.parameters.highPrivacy && !tarteaucitron.parameters.AcceptAllCta) { - html += '
'; + html += '
'; //html += '
'; html += ' '; html += ' ' + tarteaucitron.lang.alertBigPrivacy; @@ -440,7 +445,7 @@ var tarteaucitron = { //html += '
'; html += '
'; } else { - html += '
'; + html += '
'; //html += '
'; html += ' '; @@ -985,6 +990,10 @@ var tarteaucitron = { if (property == "display" && value == "block" && id == "tarteaucitronBack") { document.getElementById(id).style["opacity"] = "0.7"; } + + if (property == "display" && value == "block" && id == "tarteaucitronAlertBig" && (tarteaucitron.parameters.orientation == "middle"|| tarteaucitron.parameters.orientation == "popup")) { + tarteaucitron.userInterface.focusTrap('tarteaucitronAlertBig'); + } } } }, @@ -1258,7 +1267,7 @@ var tarteaucitron = { if (document.getElementsByTagName('body')[0].classList !== undefined) { document.getElementsByTagName('body')[0].classList.add('tarteaucitron-modal-open'); } - tarteaucitron.userInterface.focusTrap(); + tarteaucitron.userInterface.focusTrap('tarteaucitron'); tarteaucitron.userInterface.jsSizing('main'); //ie compatibility @@ -1327,7 +1336,7 @@ var tarteaucitron = { if (typeof(window.dispatchEvent) === 'function') {window.dispatchEvent(tacClosePanelEvent);} }, - "focusTrap": function() { + "focusTrap": function(parentElement) { "use strict"; var focusableEls, @@ -1335,7 +1344,7 @@ var tarteaucitron = { lastFocusableEl, filtered; - focusableEls = document.getElementById('tarteaucitron').querySelectorAll('a[href], button'); + focusableEls = document.getElementById(parentElement).querySelectorAll('a[href], button'); filtered = []; // get only visible items @@ -1349,7 +1358,7 @@ var tarteaucitron = { lastFocusableEl = filtered[filtered.length - 1]; //loop focus inside tarteaucitron - document.getElementById('tarteaucitron').addEventListener("keydown", function (evt) { + document.getElementById(parentElement).addEventListener("keydown", function (evt) { if ( evt.key === 'Tab' || evt.keyCode === 9 ) {