Skip to content

Commit

Permalink
Conditional role link (#471)
Browse files Browse the repository at this point in the history
* Update links demo to include change of projection work

* Add demo by Ahmad / Peter to demo folder. Clean up by moving some demos to
the experiments repo, where they will be publicly usable.

* Clean up demo directory a bit

* Update continuous integration to only execute on pull requests, remove push

* Add role='application' to FeatureGroup <g> element

* Conditionally create role="link" on graphics that are wrapped with <map-a>

* Change role="application" to role="button" on featureGroup, 
which makes more sense when announced

* Add <svg role="none presentation"... so that each feature is not announced
as "Graphic".

* Remove obsolete comment
  • Loading branch information
prushforth authored May 20, 2021
1 parent 12399ba commit e1264b8
Show file tree
Hide file tree
Showing 2 changed files with 20 additions and 0 deletions.
2 changes: 2 additions & 0 deletions src/mapml/features/featureGroup.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,10 @@ export var FeatureGroup = L.FeatureGroup.extend({
if(layers.length === 1 && firstLayer.options.link) this.options.link = firstLayer.options.link;
if(this.options.link){
M.Feature.prototype.attachLinkHandler.call(this, this.options.group, this.options.link, this.options._leafletLayer);
this.options.group.setAttribute('role', 'link');
} else {
this.options.group.setAttribute("aria-expanded", "false");
this.options.group.setAttribute('role', 'button');
this.options.onEachFeature(this.options.properties, this);
this.off("click", this._openPopup);
}
Expand Down
18 changes: 18 additions & 0 deletions src/mapml/features/featureRenderer.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,25 @@
* @returns {*}
*/
export var FeatureRenderer = L.SVG.extend({


/**
* Override method of same name from L.SVG, use the this._container property
* to set up the role="none presentation" on featureGroupu container,
* per this recommendation:
* https://github.com/Maps4HTML/Web-Map-Custom-Element/pull/471#issuecomment-845192246
* @private overrides ancestor method so that we have a _container to work with
*/
_initContainer: function () {
// call the method we're overriding, per https://leafletjs.com/examples/extending/extending-1-classes.html#methods-of-the-parent-class
// note you have to pass 'this' as the first arg
L.SVG.prototype._initContainer.call(this);
// knowing that the previous method call creates the this._container, we
// access it and set the role="none presetation" which suppresses the
// announcement of "Graphic" on each feature focus.
this._container.setAttribute('role', 'none presentation');
},

/**
* Creates all the appropriate path elements for a M.Feature
* @param {M.Feature} layer - The M.Feature that needs paths generated
Expand Down

0 comments on commit e1264b8

Please sign in to comment.