accessibility_widget-1.0.0/js/accessibility-widget.min.js

js/accessibility-widget.min.js
(function(){"use strict";if(window.accessibilityWidgetLoaded)return;window.accessibilityWidgetLoaded=!0;const C=document.createElement("style");C.textContent=`/* Demo Content Styling */
.demo-content {
    padding: 40px;
    max-width: 800px;
    margin: 0 auto;
    font-family: Arial, sans-serif;
}

/* Accessibility Toggle Button */
.accessibility-toggle {
    position: fixed;
    bottom: 20px;
    left: 20px; /* Changed from right to left */
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #0066FF;
    color: white;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    z-index: 9999;
}

.accessibility-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
}

.accessibility-toggle svg {
    width: 30px;
    height: 30px;
}

/* Accessibility Sidebar */
.accessibility-sidebar {
    position: fixed;
    top: 0;
    left: -400px; /* Changed from right to left */
    width: 400px;
    height: 100vh;
    background: #f5f5f5;
    box-shadow: 4px 0 20px rgba(0, 0, 0, 0.2); /* Changed shadow direction */
    transition: left 0.3s ease; /* Changed from right to left */
    z-index: 10000;
    overflow-y: auto;
    font-family: Arial, sans-serif;
}

.accessibility-sidebar.active {
    left: 0; /* Changed from right to left */
}

/* Sidebar Header */
.sidebar-header {
    background: #0066FF;
    color: white;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sidebar-header h2 {
    margin: 0;
    font-size: 18px;
    flex: 1;
}

.reset-btn,
.close-btn {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    font-size: 24px;
    padding: 5px 10px;
    transition: opacity 0.2s;
}

.reset-btn {
    margin-right: 10px;
}

.reset-btn:hover,
.close-btn:hover {
    opacity: 0.8;
}

/* Setting Groups */
.setting-group {
    background: white;
    margin: 10px;
    border-radius: 8px;
    overflow: visible; /* Changed from hidden to visible */
    position: relative;
}

.dropdown-toggle {
    width: 100%;
    padding: 15px;
    background: white;
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s;
}

.dropdown-toggle:hover {
    background: #f0f0f0;
}

.dropdown-toggle .icon {
    font-size: 20px;
    margin-right: 10px;
}

.dropdown-toggle .arrow {
    color: #666;
}

/* Dropdown Content */
.dropdown-content {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #ddd;
    border-top: none;
    border-radius: 0 0 8px 8px;
    z-index: 10001; /* Increased z-index */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    margin-top: -1px; /* To connect with parent */
}

.language-option {
    width: 100%;
    padding: 12px 15px;
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s;
}

.language-option:hover {
    background: #f0f0f0;
}

.language-option:last-child {
    border-radius: 0 0 8px 8px;
}

/* Setting Sections */
.setting-section {
    padding: 20px;
}

.setting-section h3 {
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 15px 0;
    color: #333;
}

/* Font Size Control */
.font-size-control {
    background: white;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 20px;
}

.font-size-control .label {
    display: block;
    font-size: 14px;
    margin-bottom: 10px;
}

.control-group {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}

.control-btn {
    width: 40px;
    height: 40px;
    border: 2px solid #ddd;
    background: white;
    border-radius: 8px;
    cursor: pointer;
    font-size: 20px;
    transition: all 0.2s;
}

.control-btn:hover {
    border-color: #0066FF;
    color: #0066FF;
}

.value {
    font-size: 16px;
    font-weight: 600;
    min-width: 60px;
    text-align: center;
}

/* Option Grid */
.option-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.option-btn {
    background: white;
    border: 2px solid #ddd;
    border-radius: 8px;
    padding: 15px 10px;
    cursor: pointer;
    text-align: center;
    transition: all 0.2s;
    position: relative;
}

.option-btn:hover {
    border-color: #0066FF;
}

.option-btn.active {
    border-color: #0066FF;
    background: #e6f0ff;
}

.option-icon {
    display: block;
    font-size: 24px;
    margin-bottom: 8px;
}

.option-btn span:last-child {
    font-size: 12px;
    display: block;
}

/* Contrast Icons */
.contrast-dark {
    color: #000;
}

.contrast-light {
    color: #ccc;
}

.contrast-high {
    background: linear-gradient(90deg, #000 50%, #fff 50%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Color Picker Grid */
.color-picker-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 15px;
}

.color-picker-group {
    background: white;
    border-radius: 8px;
    padding: 10px;
}

.color-picker-group label {
    display: block;
    font-size: 11px;
    margin-bottom: 8px;
    text-align: center;
}

.color-options {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
}

.color-btn {
    width: 100%;
    height: 30px;
    border: 2px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}

.color-btn:hover {
    transform: scale(1.1);
    border-color: #333;
}

.cancel-btn {
    grid-column: span 2;
    background: white;
    border: 1px solid #ddd;
    padding: 5px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 11px;
}

.cancel-btn:hover {
    background: #f0f0f0;
}

/* Footer */
.sidebar-footer {
    padding: 20px;
    text-align: center;
    border-top: 1px solid #ddd;
}

.footer-link {
    display: block;
    color: #0066FF;
    text-decoration: none;
    font-size: 14px;
    margin: 10px 0;
}

.footer-link:hover {
    text-decoration: underline;
}

.powered-by {
    margin-top: 20px;
}

.powered-by a {
    display: inline-block;
    transition: transform 0.2s ease;
}

.powered-by a:hover {
    transform: scale(1.05);
}

/* Accessibility Features Applied */
body.font-size-125 {
    font-size: 125%;
}

body.font-size-150 {
    font-size: 150%;
}

body.font-size-175 {
    font-size: 175%;
}

body.font-size-200 {
    font-size: 200%;
}

body.highlight-titles h1,
body.highlight-titles h2,
body.highlight-titles h3,
body.highlight-titles h4,
body.highlight-titles h5,
body.highlight-titles h6 {
    background: #ffeb3b;
    padding: 2px 5px;
    border-radius: 3px;
}

body.highlight-links a {
    background: #e3f2fd;
    padding: 2px 5px;
    border-radius: 3px;
    text-decoration: underline;
}

body.dyslexia-font {
    font-family: OpenDyslexic, Arial, sans-serif;
}

body.letter-spacing {
    letter-spacing: 0.12em;
}

body.line-height {
    line-height: 1.8;
}

body.font-weight {
    font-weight: 600;
}

body.dark-contrast {
    background: #000;
    color: #fff;
}

body.dark-contrast a {
    color: #4dabf7;
}

body.light-contrast {
    background: #fff;
    color: #000;
}

body.high-contrast {
    background: #000;
    color: #ff0;
}

body.high-contrast a {
    color: #0ff;
}

body.high-saturation {
    filter: saturate(2);
}

body.low-saturation {
    filter: saturate(0.5);
}

body.monochrome {
    filter: grayscale(100%);
}

body.dark-mode {
    background: #1a1a1a;
    color: #e0e0e0;
}

body.stop-animations * {
    animation: none !important;
    transition: none !important;
}

body.big-cursor * {
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><circle cx="24" cy="24" r="20" fill="black" opacity="0.5"/><circle cx="24" cy="24" r="16" fill="yellow"/></svg>') 24 24, auto !important;
}

/* Reading Guide */
.reading-guide {
    position: fixed;
    left: 0;
    right: 0;
    height: 20px;
    background: rgba(255, 255, 0, 0.3);
    pointer-events: none;
    z-index: 9998;
    display: none;
}

body.reading-guide-active .reading-guide {
    display: block;
}

/* Responsive Design */
@media (max-width: 480px) {
    .accessibility-sidebar {
        width: 100%;
        right: -100%;
    }
    
    .option-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .color-picker-grid {
        grid-template-columns: 1fr;
    }
}`,document.head.appendChild(C);const E=function(){const b=document.createElement("button");b.id="accessibility-toggle",b.className="accessibility-toggle",b.setAttribute("aria-label","Barrierefreiheit-Einstellungen \xF6ffnen"),b.innerHTML='<span style="font-size: 30px;">\u267F</span>';const y=document.createElement("div");y.id="accessibility-sidebar",y.className="accessibility-sidebar",y.innerHTML=`<div class="sidebar-header">
<h2 data-translate="menu-title">Barrierefreiheit Men\xFC</h2>
<button class="reset-btn" id="reset-btn" aria-label="Einstellungen zur\xFCcksetzen">\u21BA</button>
<button class="close-btn" id="close-sidebar" aria-label="Men\xFC schlie\xDFen">\xD7</button>
</div>
<div class="setting-group">
<button class="dropdown-toggle" id="language-toggle" aria-expanded="false">
<span class="icon">\u{1F310}</span>
<span id="language-display">Deutsch (German)</span>
<span class="arrow">\u25BC</span>
</button>
<div class="dropdown-content" style="display: none;">
<button class="language-option" data-lang="de">Deutsch (German)</button>
<button class="language-option" data-lang="en">English (English)</button>
</div>
</div>
<div class="setting-section">
<h3 data-translate="content-adjustments">Inhaltsanpassungen</h3>
<div class="font-size-control">
<span class="label" data-translate="font-size-label">Schriftgr\xF6\xDFe anpassen</span>
<div class="control-group">
<button class="control-btn" id="font-decrease" aria-label="Schriftgr\xF6\xDFe verkleinern">-</button>
<span class="value" id="font-size-value">100%</span>
<button class="control-btn" id="font-increase" aria-label="Schriftgr\xF6\xDFe vergr\xF6\xDFern">+</button>
</div>
</div>
<div class="option-grid">
<button class="option-btn" data-action="highlight-title">
<span class="option-icon">T</span>
<span data-translate="highlight-title">Titel hervorheben</span>
</button>
<button class="option-btn" data-action="highlight-links">
<span class="option-icon">\u{1F517}</span>
<span data-translate="highlight-links">Links hervorheben</span>
</button>
<button class="option-btn" data-action="dyslexia-font">
<span class="option-icon">\u{1F4D6}</span>
<span data-translate="dyslexia-font">Legasthenie Schrift</span>
</button>
<button class="option-btn" data-action="letter-spacing">
<span class="option-icon">\u2194\uFE0F</span>
<span data-translate="letter-spacing">Buchstabenabstand</span>
</button>
<button class="option-btn" data-action="line-height">
<span class="option-icon">\u2630</span>
<span data-translate="line-height">Zeilenh\xF6he</span>
</button>
<button class="option-btn" data-action="font-weight">
<span class="option-icon">\u{1D401}</span>
<span data-translate="font-weight">Schriftst\xE4rke</span>
</button>
</div>
</div>
<div class="setting-section">
<h3 data-translate="color-adjustments">Farbanpassungen</h3>
<div class="option-grid">
<button class="option-btn" data-action="dark-contrast">
<span class="option-icon contrast-dark">\u25CF</span>
<span data-translate="dark-contrast">Dunkler Kontrast</span>
</button>
<button class="option-btn" data-action="light-contrast">
<span class="option-icon contrast-light">\u25CB</span>
<span data-translate="light-contrast">Heller Kontrast</span>
</button>
<button class="option-btn" data-action="high-contrast">
<span class="option-icon contrast-high">\u25D0</span>
<span data-translate="high-contrast">Hoher Kontrast</span>
</button>
<button class="option-btn" data-action="high-saturation">
<span class="option-icon">\u{1F3A8}</span>
<span data-translate="high-saturation">Hohe S\xE4ttigung</span>
</button>
<button class="option-btn" data-action="low-saturation">
<span class="option-icon">\u{1F58C}\uFE0F</span>
<span data-translate="low-saturation">Niedrige S\xE4ttigung</span>
</button>
<button class="option-btn" data-action="monochrome">
<span class="option-icon">\u26AB</span>
<span data-translate="monochrome">Monochrom</span>
</button>
</div>
<div class="color-picker-grid">
<div class="color-picker-group">
<label data-translate="adjust-text-colors">Textfarben anpassen</label>
<div class="color-options">
<button class="color-btn" style="background-color: #000000;"></button>
<button class="color-btn" style="background-color: #FFFFFF;"></button>
<button class="color-btn" style="background-color: #FF0000;"></button>
<button class="color-btn" style="background-color: #0000FF;"></button>
<button class="cancel-btn" data-translate="cancel">Abbrechen</button>
</div>
</div>
<div class="color-picker-group">
<label data-translate="adjust-title-colors">Titelfarben anpassen</label>
<div class="color-options">
<button class="color-btn" style="background-color: #FF0000;"></button>
<button class="color-btn" style="background-color: #00FF00;"></button>
<button class="color-btn" style="background-color: #0000FF;"></button>
<button class="color-btn" style="background-color: #FFFF00;"></button>
<button class="cancel-btn" data-translate="cancel">Abbrechen</button>
</div>
</div>
<div class="color-picker-group">
<label data-translate="adjust-bg-colors">Hintergrundfarben anpassen</label>
<div class="color-options">
<button class="color-btn" style="background-color: #FFFFFF;"></button>
<button class="color-btn" style="background-color: #000000;"></button>
<button class="color-btn" style="background-color: #F0F0F0;"></button>
<button class="color-btn" style="background-color: #0066FF;"></button>
<button class="cancel-btn" data-translate="cancel">Abbrechen</button>
</div>
</div>
</div>
</div>
<div class="setting-section">
<h3 data-translate="tools">Werkzeuge</h3>
<div class="option-grid">
<button class="option-btn" data-action="dark-mode">
<span class="option-icon">\u{1F319}</span>
<span data-translate="dark-mode">Dunkler Modus</span>
</button>
<button class="option-btn" data-action="screen-reader">
<span class="option-icon">\u{1F50A}</span>
<span data-translate="screen-reader">Bildschirmleser</span>
</button>
<button class="option-btn" data-action="reading-guide">
<span class="option-icon">\u{1F4CF}</span>
<span data-translate="reading-guide">Lesehilfe</span>
</button>
<button class="option-btn" data-action="stop-animations">
<span class="option-icon">\u23F8\uFE0F</span>
<span data-translate="stop-animations">Animationen stoppen</span>
</button>
<button class="option-btn" data-action="big-cursor">
<span class="option-icon">\u{1F5B1}\uFE0F</span>
<span data-translate="big-cursor">Gro\xDFer Mauszeiger</span>
</button>
<button class="option-btn" data-action="voice-navigation">
<span class="option-icon">\u{1F3A4}</span>
<span data-translate="voice-navigation">Sprachsteuerung</span>
</button>
</div>
</div>
<div class="sidebar-footer">
<div class="powered-by">
</div>
</div>`,document.body.appendChild(b),document.body.appendChild(y),function(){"use strict";const p=document.getElementById("accessibility-toggle"),u=document.getElementById("accessibility-sidebar"),z=document.getElementById("close-sidebar"),A=document.getElementById("reset-btn"),F=document.getElementById("font-decrease"),B=document.getElementById("font-increase"),G=document.getElementById("font-size-value"),T=document.querySelectorAll(".option-btn"),V=document.querySelectorAll(".color-btn");let l=100;const h=new Set;let g=null,d="de",s={text:"",background:"",title:""};const j={de:{"menu-title":"Barrierefreiheit Men\xFC","content-adjustments":"Inhaltsanpassungen","font-size-label":"Schriftgr\xF6\xDFe anpassen","highlight-title":"Titel hervorheben","highlight-links":"Links hervorheben","dyslexia-font":"Legasthenie Schrift","letter-spacing":"Buchstabenabstand","line-height":"Zeilenh\xF6he","font-weight":"Schriftst\xE4rke","color-adjustments":"Farbanpassungen","dark-contrast":"Dunkler Kontrast","light-contrast":"Heller Kontrast","high-contrast":"Hoher Kontrast","high-saturation":"Hohe S\xE4ttigung","low-saturation":"Niedrige S\xE4ttigung",monochrome:"Monochrom","adjust-text-colors":"Textfarben anpassen","adjust-title-colors":"Titelfarben anpassen","adjust-bg-colors":"Hintergrundfarben anpassen",cancel:"Abbrechen",tools:"Werkzeuge","dark-mode":"Dunkler Modus","screen-reader":"Bildschirmleser","reading-guide":"Lesehilfe","stop-animations":"Animationen stoppen","big-cursor":"Gro\xDFer Mauszeiger","voice-navigation":"Sprachsteuerung","accessibility-statement":"Barrierefreiheitserkl\xE4rung","report-problem":"Problem melden","screen-reader-activated":"Bildschirmleser aktiviert. Bewegen Sie die Maus \xFCber Elemente, um sie vorlesen zu lassen.","screen-reader-deactivated":"Bildschirmleser deaktiviert",image:"Bild",button:"Schaltfl\xE4che",link:"Link","input-field":"Eingabefeld","heading-level":"\xDCberschrift Ebene","voice-nav-activated":"Sprachnavigation aktiviert. Sagen Sie Befehle wie: Klick Link, Klick Button, Scroll runter, Scroll hoch, oder Klick gefolgt vom Text des Elements.","voice-nav-deactivated":"Sprachnavigation deaktiviert","voice-nav-not-supported":"Spracherkennung wird von Ihrem Browser nicht unterst\xFCtzt. Bitte verwenden Sie Chrome, Edge oder Safari.","voice-nav-error":"Spracherkennungsfehler. Bitte versuchen Sie es erneut.","scrolled-down":"Nach unten gescrollt","scrolled-up":"Nach oben gescrollt","scrolled-to-top":"Zum Anfang gescrollt","scrolled-to-bottom":"Zum Ende gescrollt","navigated-back":"Zur\xFCck navigiert","navigated-forward":"Vorw\xE4rts navigiert","page-reloading":"Seite wird neu geladen","element-clicked":"angeklickt","element-not-found":"Element nicht gefunden","focus-on":"Fokus auf","voice-commands":"Verf\xFCgbare Befehle: Klick gefolgt vom Text, Scroll runter, Scroll hoch, Zur\xFCck, Vorw\xE4rts, N\xE4chstes, Vorheriges, Hilfe","voice-indicator":"Sprachsteuerung aktiv","reset-settings":"Einstellungen zur\xFCcksetzen","close-menu":"Men\xFC schlie\xDFen","decrease-font":"Schriftgr\xF6\xDFe verkleinern","increase-font":"Schriftgr\xF6\xDFe vergr\xF6\xDFern","open-accessibility":"Barrierefreiheit-Einstellungen \xF6ffnen"},en:{"menu-title":"Accessibility Menu","content-adjustments":"Content Adjustments","font-size-label":"Adjust Font Size","highlight-title":"Highlight Title","highlight-links":"Highlight Links","dyslexia-font":"Dyslexia Font","letter-spacing":"Letter Spacing","line-height":"Line Height","font-weight":"Font Weight","color-adjustments":"Color Adjustments","dark-contrast":"Dark Contrast","light-contrast":"Light Contrast","high-contrast":"High Contrast","high-saturation":"High Saturation","low-saturation":"Low Saturation",monochrome:"Monochrome","adjust-text-colors":"Adjust Text Colors","adjust-title-colors":"Adjust Title Colors","adjust-bg-colors":"Adjust Background Colors",cancel:"Cancel",tools:"Tools","dark-mode":"Dark Mode","screen-reader":"Screen Reader","reading-guide":"Reading Guide","stop-animations":"Stop Animations","big-cursor":"Big Cursor","voice-navigation":"Voice Navigation","accessibility-statement":"Accessibility Statement","report-problem":"Report a Problem","screen-reader-activated":"Screen reader activated. Move your mouse over elements to hear them.","screen-reader-deactivated":"Screen reader deactivated",image:"Image",button:"Button",link:"Link","input-field":"Input field","heading-level":"Heading level","voice-nav-activated":"Voice navigation activated. Say commands like: Click link, Click button, Scroll down, Scroll up, or Click followed by element text.","voice-nav-deactivated":"Voice navigation deactivated","voice-nav-not-supported":"Speech recognition is not supported by your browser. Please use Chrome, Edge, or Safari.","voice-nav-error":"Speech recognition error. Please try again.","scrolled-down":"Scrolled down","scrolled-up":"Scrolled up","scrolled-to-top":"Scrolled to top","scrolled-to-bottom":"Scrolled to bottom","navigated-back":"Navigated back","navigated-forward":"Navigated forward","page-reloading":"Page reloading","element-clicked":"clicked","element-not-found":"Element not found","focus-on":"Focus on","voice-commands":"Available commands: Click followed by text, Scroll down, Scroll up, Back, Forward, Next, Previous, Help","voice-indicator":"Voice control active","reset-settings":"Reset settings","close-menu":"Close menu","decrease-font":"Decrease font size","increase-font":"Increase font size","open-accessibility":"Open accessibility settings"}};function n(t){return j[d][t]||j.de[t]||t}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",I):setTimeout(I,100);function I(){lt(),D(),d!=="de"&&N(d),p.addEventListener("click",O),z.addEventListener("click",S),A.addEventListener("click",ct),F.addEventListener("click",W),B.addEventListener("click",U),T.forEach(o=>{o.addEventListener("click",P)}),V.forEach(o=>{o.addEventListener("click",it)}),document.querySelectorAll(".cancel-btn").forEach(o=>{o.addEventListener("click",st)});const t=document.getElementById("language-toggle"),e=document.querySelectorAll(".language-option");t&&t.addEventListener("click",o=>{o.stopPropagation();const a=o.currentTarget.nextElementSibling,c=a.style.display==="block";a.style.display=c?"none":"block",o.currentTarget.setAttribute("aria-expanded",!c)}),e.length>0&&e.forEach(o=>{o.addEventListener("click",a=>{a.stopPropagation();const c=a.currentTarget.dataset.lang;N(c),a.currentTarget.parentElement.style.display="none",t.setAttribute("aria-expanded","false")})}),document.querySelectorAll(".dropdown-toggle:not(#language-toggle)").forEach(o=>{o.addEventListener("click",rt)}),document.addEventListener("click",o=>{!u.contains(o.target)&&!p.contains(o.target)&&u.classList.contains("active")&&S();const a=document.querySelector(".dropdown-content");a&&a.style.display==="block"&&!o.target.closest(".setting-group")&&(a.style.display="none",document.getElementById("language-toggle").setAttribute("aria-expanded","false"))}),document.addEventListener("keydown",o=>{o.key==="Escape"&&u.classList.contains("active")&&S()})}function N(t){d=t;const e=document.getElementById("language-display");e.textContent=t==="de"?"Deutsch (German)":"English (English)",document.querySelectorAll("[data-translate]").forEach(o=>{const a=o.getAttribute("data-translate");o.textContent=n(a)}),D(),m()}function D(){p.setAttribute("aria-label",n("open-accessibility")),A.setAttribute("aria-label",n("reset-settings")),z.setAttribute("aria-label",n("close-menu")),F.setAttribute("aria-label",n("decrease-font")),B.setAttribute("aria-label",n("increase-font"))}function ut(){}function O(){u.classList.toggle("active"),p.setAttribute("aria-expanded",u.classList.contains("active"))}function S(){u.classList.remove("active"),p.setAttribute("aria-expanded","false")}function P(t){const e=t.currentTarget,o=e.dataset.action;e.classList.toggle("active"),e.classList.contains("active")?(h.add(o),H(o)):(h.delete(o),K(o)),m()}function H(t){switch(t){case"highlight-title":document.body.classList.add("highlight-titles");break;case"highlight-links":document.body.classList.add("highlight-links");break;case"dyslexia-font":document.body.classList.add("dyslexia-font");break;case"letter-spacing":document.body.classList.add("letter-spacing");break;case"line-height":document.body.classList.add("line-height");break;case"font-weight":document.body.classList.add("font-weight");break;case"dark-contrast":v(),document.body.classList.add("dark-contrast");break;case"light-contrast":v(),document.body.classList.add("light-contrast");break;case"high-contrast":v(),document.body.classList.add("high-contrast");break;case"high-saturation":document.body.classList.add("high-saturation");break;case"low-saturation":document.body.classList.add("low-saturation");break;case"monochrome":document.body.classList.add("monochrome");break;case"dark-mode":document.body.classList.add("dark-mode");break;case"stop-animations":document.body.classList.add("stop-animations");break;case"big-cursor":document.body.classList.add("big-cursor");break;case"reading-guide":Z();break;case"screen-reader":J();break;case"voice-navigation":_();break}}function K(t){switch(t){case"highlight-title":document.body.classList.remove("highlight-titles");break;case"highlight-links":document.body.classList.remove("highlight-links");break;case"dyslexia-font":document.body.classList.remove("dyslexia-font");break;case"letter-spacing":document.body.classList.remove("letter-spacing");break;case"line-height":document.body.classList.remove("line-height");break;case"font-weight":document.body.classList.remove("font-weight");break;case"dark-contrast":case"light-contrast":case"high-contrast":v();break;case"high-saturation":document.body.classList.remove("high-saturation");break;case"low-saturation":document.body.classList.remove("low-saturation");break;case"monochrome":document.body.classList.remove("monochrome");break;case"dark-mode":document.body.classList.remove("dark-mode");break;case"stop-animations":document.body.classList.remove("stop-animations");break;case"big-cursor":document.body.classList.remove("big-cursor");break;case"reading-guide":q();break;case"screen-reader":Y();break;case"voice-navigation":Q();break}}function v(){document.body.classList.remove("dark-contrast","light-contrast","high-contrast")}function W(){l>100&&(l-=25,k())}function U(){l<200&&(l+=25,k())}function k(){G.textContent=l+"%",document.body.classList.remove("font-size-125","font-size-150","font-size-175","font-size-200"),l>100&&document.body.classList.add("font-size-"+l),m()}function Z(){g||(g=document.createElement("div"),g.className="reading-guide",document.body.appendChild(g)),document.body.classList.add("reading-guide-active"),document.addEventListener("mousemove",R)}function q(){document.body.classList.remove("reading-guide-active"),document.removeEventListener("mousemove",R)}function R(t){g&&(g.style.top=t.clientY-10+"px")}let x=!1,f=window.speechSynthesis;function J(){x=!0,i(n("screen-reader-activated")),document.addEventListener("mouseover",M),document.addEventListener("focus",$,!0);const t=document.createElement("div");t.id="screen-reader-live",t.setAttribute("aria-live","polite"),t.setAttribute("aria-atomic","true"),t.style.position="absolute",t.style.left="-10000px",t.style.width="1px",t.style.height="1px",t.style.overflow="hidden",document.body.appendChild(t)}function Y(){x=!1,f.cancel(),document.removeEventListener("mouseover",M),document.removeEventListener("focus",$,!0);const t=document.getElementById("screen-reader-live");t&&t.remove(),i(n("screen-reader-deactivated"))}function M(t){if(!x)return;const e=t.target,o=w(e);o&&o.trim()&&(f.cancel(),i(o))}function $(t){if(!x)return;const e=t.target,o=w(e);o&&o.trim()&&(f.cancel(),i(o))}function w(t){if(t.getAttribute("aria-label"))return t.getAttribute("aria-label");if(t.tagName==="IMG"&&t.alt)return n("image")+": "+t.alt;if(t.tagName==="BUTTON"||t.tagName==="A"){const e=t.textContent.trim(),o=t.tagName==="BUTTON"?n("button"):n("link");return e?`${e}, ${o}`:o}if(t.tagName==="INPUT"){const e=document.querySelector(`label[for="${t.id}"]`),o=t.type;return`${e?e.textContent:""} ${n("input-field")}, ${o}`}if(t.tagName.match(/^H[1-6]$/)){const e=t.tagName.charAt(1);return`${t.textContent}, ${n("heading-level")} ${e}`}return t.textContent}function i(t){if(!f)return;const e=new SpeechSynthesisUtterance(t);e.lang=d==="de"?"de-DE":"en-US",e.rate=1,e.pitch=1,e.volume=1,f.speak(e)}let L=!1,r=null;function _(){if(!("webkitSpeechRecognition"in window)&&!("SpeechRecognition"in window)){alert(n("voice-nav-not-supported"));return}L=!0;const t=window.SpeechRecognition||window.webkitSpeechRecognition;r=new t,r.lang=d==="de"?"de-DE":"en-US",r.continuous=!0,r.interimResults=!1,r.onstart=function(){i(n("voice-nav-activated")),nt()},r.onresult=function(e){const o=e.results.length-1,a=e.results[o][0].transcript.toLowerCase();X(a)},r.onerror=function(e){console.error("Spracherkennungsfehler:",e.error),i(n("voice-nav-error"))},r.onend=function(){L&&r.start()},r.start()}function Q(){L=!1,r&&(r.stop(),r=null),at(),i(n("voice-nav-deactivated"))}function X(t){console.log("Voice command:",t);const e=d==="de";if(e&&(t.includes("scroll runter")||t.includes("runter"))||!e&&(t.includes("scroll down")||t.includes("down")))window.scrollBy(0,300),i(n("scrolled-down"));else if(e&&(t.includes("scroll hoch")||t.includes("hoch"))||!e&&(t.includes("scroll up")||t.includes("up")))window.scrollBy(0,-300),i(n("scrolled-up"));else if(e&&t.includes("ganz nach oben")||!e&&t.includes("to the top"))window.scrollTo(0,0),i(n("scrolled-to-top"));else if(e&&t.includes("ganz nach unten")||!e&&t.includes("to the bottom"))window.scrollTo(0,document.body.scrollHeight),i(n("scrolled-to-bottom"));else if(t.includes("klick")||t.includes("click")){const o=t.replace(/klick |click /g,"").trim();tt(o)}else e&&t.includes("zur\xFCck")||!e&&t.includes("back")?(window.history.back(),i(n("navigated-back"))):e&&t.includes("vorw\xE4rts")||!e&&t.includes("forward")?(window.history.forward(),i(n("navigated-forward"))):e&&(t.includes("aktualisieren")||t.includes("neu laden"))||!e&&(t.includes("refresh")||t.includes("reload"))?(window.location.reload(),i(n("page-reloading"))):e&&t.includes("n\xE4chstes")||!e&&t.includes("next")?et():e&&t.includes("vorheriges")||!e&&t.includes("previous")?ot():(e&&t.includes("hilfe")||!e&&t.includes("help"))&&i(n("voice-commands"))}function tt(t){const e=document.querySelectorAll('a, button, input[type="submit"], input[type="button"], [role="button"]');for(let o of e){const a=o.textContent.toLowerCase().trim(),c=(o.getAttribute("aria-label")||"").toLowerCase();if(a.includes(t)||c.includes(t)){o.click(),i(`${o.textContent||c} ${n("element-clicked")}`);return}}i(`${n("element-not-found")}: "${t}"`)}function et(){const t=document.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])'),e=document.activeElement,o=Array.from(t).indexOf(e);o<t.length-1&&(t[o+1].focus(),i(`${n("focus-on")} ${w(t[o+1])}`))}function ot(){const t=document.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])'),e=document.activeElement,o=Array.from(t).indexOf(e);o>0&&(t[o-1].focus(),i(`${n("focus-on")} ${w(t[o-1])}`))}function nt(){const t=document.createElement("div");t.id="voice-indicator",t.style.cssText=`
            position: fixed;
            top: 20px;
            right: 20px;
            background: #4CAF50;
            color: white;
            padding: 10px 20px;
            border-radius: 25px;
            display: flex;
            align-items: center;
            gap: 10px;
            z-index: 10001;
            animation: pulse 2s infinite;
        `,t.innerHTML=`
            <div style="width: 10px; height: 10px; background: white; border-radius: 50%; animation: pulse 1s infinite;"></div>
            <span>${n("voice-indicator")}</span>
        `;const e=document.createElement("style");e.textContent=`
            @keyframes pulse {
                0% { opacity: 1; }
                50% { opacity: 0.6; }
                100% { opacity: 1; }
            }
        `,document.head.appendChild(e),document.body.appendChild(t)}function at(){const t=document.getElementById("voice-indicator");t&&t.remove()}function it(t){const e=t.target.style.backgroundColor,a=t.target.closest(".color-picker-group").querySelector("label").getAttribute("data-translate");if(a==="adjust-text-colors")s.text||(s.text=document.body.style.color||window.getComputedStyle(document.body).color),document.body.style.color=e;else if(a==="adjust-title-colors"){const c=document.querySelector("h1, h2, h3, h4, h5, h6");!s.title&&c&&(s.title=c.style.color||window.getComputedStyle(c).color),document.querySelectorAll("h1, h2, h3, h4, h5, h6").forEach(dt=>dt.style.color=e)}else a==="adjust-bg-colors"&&(s.background||(s.background=document.body.style.backgroundColor||window.getComputedStyle(document.body).backgroundColor),document.body.style.backgroundColor=e);m()}function st(t){const o=t.target.closest(".color-picker-group").querySelector("label").getAttribute("data-translate");o==="adjust-text-colors"&&s.text?document.body.style.color=s.text:o==="adjust-title-colors"&&s.title?document.querySelectorAll("h1, h2, h3, h4, h5, h6").forEach(c=>c.style.color=s.title):o==="adjust-bg-colors"&&s.background&&(document.body.style.backgroundColor=s.background),m()}function rt(t){const e=t.currentTarget,o=e.getAttribute("aria-expanded")==="true";e.setAttribute("aria-expanded",!o),console.log("Dropdown toggled:",e.querySelector("span:nth-child(2)").textContent)}function ct(){l=100,k(),h.clear(),T.forEach(t=>t.classList.remove("active")),document.body.className="",document.body.style.color="",document.body.style.backgroundColor="",document.querySelectorAll("h1, h2, h3, h4, h5, h6").forEach(t=>{t.style.color=""}),s={text:"",background:"",title:""},localStorage.removeItem("accessibilitySettings"),q()}function m(){const t={fontSize:l,activeFeatures:Array.from(h),textColor:document.body.style.color,backgroundColor:document.body.style.backgroundColor,titleColor:document.querySelector("h1")?document.querySelector("h1").style.color:"",language:d};localStorage.setItem("accessibilitySettings",JSON.stringify(t))}function lt(){const t=localStorage.getItem("accessibilitySettings");if(t){const e=JSON.parse(t);e.language&&(d=e.language),l=e.fontSize||100,k(),e.activeFeatures.forEach(o=>{h.add(o),H(o);const a=document.querySelector(`[data-action="${o}"]`);a&&a.classList.add("active")}),e.textColor&&(document.body.style.color=e.textColor),e.backgroundColor&&(document.body.style.backgroundColor=e.backgroundColor),e.titleColor&&document.querySelectorAll("h1, h2, h3, h4, h5, h6").forEach(o=>{o.style.color=e.titleColor})}}}()};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",E):E()})();

Главная | Обратная связь

drupal hosting | друпал хостинг | it patrol .inc