UserWay API

To start working with the UserWay JS API, first add the UserWay script to your site: https://userway.org/get

What do these documents describe?

These documents describe the workings of the special functionality of the UserWay widget to use its functions from the browser console or from an external script on the site.

Our API provides the ability to open or close the widget menu and control select features and capabilities of the accessibility widget.

This may be necessary if you want to automate the call of any functions of the UserWay widget on your site.

To use the UserWay API, you need to have our widget installed on the site.

The following are the methods that you can use to work with our UserWay API:

Common

Common methods are not directly related to the operation of the UserWay widget.

getVersion

UserWay.getVersion()

Get UserWay API version.

iconVisibilityOn

UserWay.iconVisibilityOn()

Show UserWay accessibility menu icon.

iconVisibilityOff

UserWay.iconVisibilityOff()

Hide UserWay accessibility menu icon.

iconVisibilityToggle

UserWay.iconVisibilityToggle()

Toggle UserWay accessibility icon's visibility.

Widget methods

Methods with which you can close or open the widget menu on the site, as well as a method by which you can reset the use of all functions of the widget.

widgetToggle

UserWay.widgetToggle()

Open or close widget menu.

widgetOpen

UserWay.widgetOpen()

Open widget menu.

widgetClose

UserWay.widgetClose()

Close widget menu.

resetAll

UserWay.resetAll()

Reset all widget features.

Keyboard navigation

Methods with which you can control the keyboard navigation function in the UserWay widget.

keyboardNavToggle

UserWay.keyboardNavToggle()

Enable or disable keyboard navigation.

keyboardNavEnable

UserWay.keyboardNavEnable()

Enable keyboard navigation.

keyboardNavDisable

UserWay.keyboardNavDisable()

Disable keyboard navigation.

Big Cursor

The methods by which you can control of a big cursor in the UserWay widget.

bigCursorToggle

UserWay.bigCursorToggle()

Enable or disable big cursor.

bigCursorEnable

UserWay.bigCursorEnable()

Enable big cursor.

bigCursorDisable

UserWay.bigCursorDisable()

Disable big cursor.

Reading Guide

The methods by which you can control of a reading guide in the UserWay widget.

readingGuideToggle

UserWay.readingGuideToggle()

Enable or disable reading guide.

readingGuideEnable

UserWay.readingGuideEnable()

Enable reading guide.

readingGuideDisable

UserWay.readingGuideDisable()

Disable reading guide.

Contrast feature

The methods by which you can control the contrast in the UserWay widget.

contrastToggle

UserWay.contrastToggle()

Enable or disable contrast feature.

contrastEnable

UserWay.contrastEnable(stage)

• Enable contrast feature.
• Can take an integer value from 1 to 4, which indicates the stage of the feature you want to use.
• If you do not pass an integer value, it will work as a toggle.

contrastDisable

UserWay.contrastDisable()

Disable contrast feature.

Big text

Methods with which you can control the functionality of large text in the UserWay widget.

bigTextToggle

UserWay.bigTextToggle()

Enable or disable big text feature.

bigTextEnable

UserWay.bigTextEnable(stage)

• Enable big text feature.
• Can take an integer value from 1 to 4, which indicates the stage of the feature you want to use.
• If you do not pass an integer value, it will work as Toggle.

bigTextDisable

UserWay.bigTextDisable()

Disable big text feature.

Highlight feature

The methods by which you can control the function of highlighting links in the UserWay widget.

highlightToggle

UserWay.highlightToggle()

Enable or disable highlight feature.

highlightEnable

UserWay.highlightEnable()

Enable highlight feature.

highlightDisable

UserWay.highlightDisable()

Disable highlight feature.

Legible fonts

The methods by which you can control the font enhancement feature in the UserWay widget.

legibleFontsToggle

UserWay.legibleFontsToggle()

Enable or disable legible fonts feature.

legibleFontsEnable

UserWay.legibleFontsEnable()

Enable legible fonts feature.

legibleFontsDisable

UserWay.legibleFontsDisable()

Disable legible fonts feature.

Text spacing

The methods by which you can control the text spacing feature in the UserWay widget.

textSpacingToggle

UserWay.textSpacingToggle()

Enable or disable text spacing feature.

textSpacingEnable

UserWay.textSpacingEnable(stage)

• Enable text spacing feature.
• Can take an integer value from 1 to 3, which indicates the stage of the feature you want to use.
• If you do not pass an integer value, it will work as Toggle.

textSpacingDisable

UserWay.textSpacingDisable()

Disable text spacing feature.

ReadPage

The methods by which you can control the text reading function in the UserWay widget.

readPageToggle

UserWay.readPageToggle()

Enable, disable or change reading speed of the 'Read Page' feature.

readPageEnable

UserWay.readPageEnable()

Enable read page feature.

readPageDisable

UserWay.readPageDisable()

Disable read page feature.

PageStructure

The methods by which you can control the page structure function in the UserWay widget.

pageStructureHeaders

UserWay.pageStructureHeaders()

Enable page structure view with predefined "headers" tab.

pageStructureLandmarks

UserWay.pageStructureLandmarks()

Enable page structure view with predefined "landmarks" tab.

pageStructureLinks

UserWay.pageStructureLinks()

Enable page structure view with predefined "links" tab.

pageStructureDisable

UserWay.pageStructureDisable()

Disable page structure function.

Tooltips

The methods by which you can control the tooltips feature in the UserWay widget.

tooltipsToggle

UserWay.tooltipsToggle()

Enable or disable tooltips feature.

tooltipsEnable

UserWay.tooltipsEnable()

Enable tooltips feature.

tooltipsDisable

UserWay.tooltipsDisable()

Stop Animations

The methods by which you can control the stop animations feature in the UserWay widget.

stopAnimationToggle

UserWay.stopAnimationToggle()

Enable or disable stop animations feature.

stopAnimationEnable

UserWay.stopAnimationEnable()

Enable stop animations feature.

stopAnimationDisable

UserWay.stopAnimationDisable()

Disable stop animations feature.

Quick Accessibility Menu

openQuickAccessibilityMenu

UserWay.openQuickAccessibilityMenu()

Opens quick accessibility menu

Widget Settings

changeWidgetLanguage

UserWay.changeWidgetLanguage(languageCode)
/* Supported languages include: ar, bg, bn, cs, de, el, en, en-US, es, et, fa, fi, fo, fr, he, hi, hr, hu, it, ja, ko, lt, nl, no, pa, pl, pt, pt-BR, ro, ru, sl, sv, tr, uk, zh, zh-Hant */

Updates widget language dynamically. No page refresh required.

Events

UserWay events are fired at specific points of components' life progress. Each event includes UserWay instance in payload.

userway:init_completed

/* Hide UserWay accessibility icon on init */
document.addEventListener('userway:init_completed', function (event) {
  var instance = event.detail.userWayInstance
  instance.iconVisibilityOff()
})

/* Open UserWay accessibility menu on init */
/* https://codepen.io/userway/pen/QYRGqx */
document.addEventListener('userway:init_completed', function (event) {
  var instance = event.detail.userWayInstance
  instance.widgetOpen()
})

/* Change widget language on init */
document.addEventListener('userway:init_completed', function (event) {
  var instance = event.detail.userWayInstance
  instance.changeWidgetLanguage('fr')
})

Event is fired at the moment all UserWay components have been initialized.

userway:render_completed

/* Edit UserWay accessibility icon's element */
/* https://codepen.io/userway/pen/YBmPZO */
document.addEventListener('userway:render_completed', function (event) {
  var userway = document.querySelector('div.userway')
  if (userway) {
    userway.setAttribute('title', 'The text you prefer to have as a tip')
  }
})

Event is fired at the moment all UserWay DOM components have been rendered.