Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

a11y-announcer

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

a11y-announcer - npm Package Compare versions

Comparing version 0.3.0 to 1.0.0

addon/initializers/add-announcer-to-router.js

2

addon/services/announcer.js
import Ember from 'ember';
export default Ember.Service.extend({
message: "has loaded",
announceMessage: null,
announceTone: 'polite',
announce: function(message, tone) {

@@ -7,0 +9,0 @@ this.setProperties({

6

package.json
{
"name": "a11y-announcer",
"version": "0.3.0",
"version": "1.0.0",
"description": "An accessible ember route change announcer",

@@ -24,3 +24,2 @@ "directories": {

"ember-cli-app-version": "0.5.0",
"ember-cli-content-security-policy": "0.4.0",
"ember-cli-dependency-checker": "^1.0.1",

@@ -34,3 +33,2 @@ "ember-cli-document-title": "0.2.0",

"ember-cli-release": "0.2.3",
"ember-cli-sri": "^1.0.3",
"ember-cli-uglify": "^1.2.0",

@@ -56,2 +54,2 @@ "ember-disable-prototype-extensions": "^1.0.0",

}
}
}

@@ -1,8 +0,8 @@

# A11y-announcer
[![Build Status](https://travis-ci.org/Robdel12/a11y-announcer.svg?branch=master)](https://travis-ci.org/Robdel12/a11y-announcer)
# A11y-announcer
[![Build Status](https://travis-ci.org/Robdel12/a11y-announcer.svg?branch=master)](https://travis-ci.org/Robdel12/a11y-announcer)
[![npm version](https://badge.fury.io/js/a11y-announcer.svg)](http://badge.fury.io/js/a11y-announcer)
This addon is to allow for accessible route changes inside of your ember application.
Currently when you change a route, nothing alerts a screen reader that the route
has changed. This is very bad, screen reader users just hear silence.
Currently when you change a route in ember nothing alerts a screen reader that the route
has changed. This is very bad and screen reader users hear nothing but silence.

@@ -13,5 +13,7 @@ The goal for this addon is to fill the gaps in embers router. Thank you to

## How does it work?
The basic idea of this addon is to announce the new page title on every route change. This means the page title _needs_ to change on every route. If it's routable, it's different enough to warrent a title change.
The basic idea of this addon is to announce the new page title on every route
change. This means the page title _needs_ to change on every route. If it's
routable, it's different enough to warrant a title change.
I use [ember-cli-document-title](https://github.com/kimroen/ember-cli-document-title) to help me with manging the title of each route.
I use [ember-cli-document-title](https://github.com/kimroen/ember-cli-document-title) to help me with manging the title of each route.

@@ -21,8 +23,2 @@ ### Getting Started

- `ember install a11y-announcer`
- In your `router.js`file import the mixin:
```js
import A11yAnnouncer from 'a11y-announcer/mixins/announcer';
var Router = Ember.Router.extend(A11yAnnouncer, {...});
```
- Add `{{route-announcer}}` to your `application.hbs` file.

@@ -36,3 +32,3 @@

```js
export default Ember.Controller.exten({
export default Ember.Controller.extend({
announcer: Ember.inject.service('announcer')

@@ -51,2 +47,21 @@ })

#### Changing the route change message
To change the route has changes message from `${pageTitle} has loaded` to
something custom (for example `${pageTitle} has finished loading`) you will
need to edit your `Router` in `router.js`:
```js
var Router = Ember.Router.extend({
location: config.locationType
announcer: Ember.inject.service('announcer'),
init() {
this.super(...arguments);
this.set('announcer.message', 'has finished loading');
}
});
```
## Installation

@@ -53,0 +68,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc