Triggering Events
The accessibility widget enables specific events to be triggered programmatically (e.g. changes to language, profile, contrast, etc.), allowing integration with external systems, automation of actions, and customisation of the widget to individual user needs.
Examples of applications:
- Automatic activation of high contrast mode when the user enters the website.
- Change the widget language depending on the language of the page content.
- Setting the preferred accessibility profile (e.g. for people with dyslexia or visual impairment) based on saved user settings.
The following is a list of available events
Name | Description |
---|---|
AccessibilityContrastToggle | change page contrast |
AccessibilityContrastSet | applying contrast to the page (true/false) |
AccessibilityInvertColorToggle | toggle page color inversion |
AccessibilityInvertColorSet | apply page color inversion (true/false) |
AccessibilityUnderlineToggle | toggle link underlining |
AccessibilityUnderlineSet | applying link underlining (true/false) |
AccessibilityFontSizeSet | text size setting (1 – 5) |
AccessibilityFontSizeIncrease | increase text |
AccessibilityFontSizeDecrease | decrease text |
AccessibilityLetterSpacingLevelUp | change letter spacing |
AccessibilityLetterSpacingSet | setting the letter spacing (1 – 5) |
AccessibilityLineHeightLevelUp | line height adjustment |
AccessibilityLineHeightSet | set line height (1–5) |
AccessibilitySaturationLevelUp | color saturation adjustment |
AccessibilitySaturationSet | set color saturation (1–3) |
AccessibilityTextToSpeechToggle | toggle text-to-speech |
AccessibilityTextToSpeechSet | apply text-to-speech (true/false) |
AccessibilityEnlargeCursorToggle | toggle enlarged cursor |
AccessibilityEnlargeCursorSet | apply enlarged cursor (true/false) |
AccessibilityHideMediaToggle | toggle hiding media |
AccessibilityHideMediaSet | apply hiding media (true/false) |
AccessibilityDisableAnimationsToggle | toggle page animations |
AccessibilityDisableAnimationsSet | apply animation disabling (true/false) |
AccessibilityShowLineToggle | toggle reading guide |
AccessibilityShowLineSet | apply reading guide (true/false) |
AccessibilityDyslexicToggle | toggle dyslexic-friendly font |
AccessibilityDyslexicSet | apply dyslexic-friendly font (true/false) |
AccessibilityProfileMotorImpairedToggle | toggle motor impairment profile |
AccessibilityProfileMotorImpairedSet | apply motor impairment profile (true/false) |
AccessibilityProfileLowVisionToggle | toggle low vision profile |
AccessibilityProfileLowVisionSet | apply low vision profile (true/false) |
AccessibilityProfileColorBlindToggle | toggle color blindness profile |
AccessibilityProfileColorBlindSet | apply color blindness profile (true/false) |
AccessibilityProfileDyslexiaToggle | toggle dyslexia profile |
AccessibilityProfileDyslexiaSet | apply dyslexia profile (true/false) |
AccessibilityProfileBlindToggle | toggle blind user profile |
AccessibilityProfileBlindSet | apply blind user profile (true/false) |
AccessibilityProfileEpilepticToggle | toggle epilepsy-safe profile |
AccessibilityProfileEpilepticSet | apply epilepsy-safe profile (true/false) |
AccessibilityProfileAdhdToggle | toggle ADHD profile |
AccessibilityProfileAdhdSet | apply ADHD profile (true/false) |
AccessibilityProfileCognitiveAndLearningToggle | toggle cognitive & learning profile |
AccessibilityProfileCognitiveAndLearningSet | apply cognitive & learning profile (true/false) |
AccessibilityLanguageSet | set widget language |
AccessibilityMenuOpen | open accessibility menu |
AccessibilityMenuClose | close accessibility menu |
AccessibilityReset | reset all settings to default |
You can use these events in your application by calling events in the following way:
accessibility.emit('AccessibilityContrastToggle') accessibility.emit('AccessibilityContrastSet', true) accessibility.emit('AccessibilityFontSizeSet', 3) accessibility.emit('AccessibilityLanguageSet', 'pl') accessibility.emit('AccessibilityMenuOpen')