Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ID and Radio Button Fixes in the Layer Control #547

Closed
wants to merge 24 commits into from
Closed
Changes from all commits
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
d484e6c
refactored the layer HTML anatomy to not include nested interactive e…
Oct 8, 2021
df90e05
made span a child element of label to fix a few issues
Oct 12, 2021
7ecf8c5
changed the locators in tests to reflect changes in the layer layout
Oct 12, 2021
5e73382
deleted css that was no longer needed
Oct 13, 2021
9acd92c
deleted unused variables and changed the x to an html icon
Oct 14, 2021
7348e13
fixed the Style and Time details element
Oct 15, 2021
11cdd73
fixed the vertical alignment of labels under Style
Oct 15, 2021
25a87f7
replaced the x button with the html icon
Oct 15, 2021
83c2822
made the time label clickable
Oct 15, 2021
73152da
repositioned properties
Oct 18, 2021
dd7faeb
positioned the layer-item-properties class
Oct 18, 2021
394fb63
fixed some css
Oct 18, 2021
9433198
deleted the title attribute to fix an accessibility issue
Oct 18, 2021
3f6509f
made suggested changes to the css
Oct 19, 2021
4c0ac94
condensed some code
Oct 20, 2021
7825665
made whitespace clickable and fixed some alignment
Oct 21, 2021
92db3ef
reverted a change in drag.test
Oct 21, 2021
f744c26
fixed the alignment of the span element
Oct 21, 2021
098b779
Update src/mapml.css
Anshpreet8 Oct 21, 2021
218e097
Update src/mapml.css
Anshpreet8 Oct 25, 2021
1549242
allwed the layer to be dragged from the Remove Layer Control button t…
Oct 25, 2021
00c9821
changed document.createElement to L.DomUtil.create for better consist…
Oct 28, 2021
092f9da
Merge branch 'main' of https://github.com/Maps4HTML/Web-Map-Custom-El…
Oct 28, 2021
124a182
fixed radio buttons and removed whitespace from id
Oct 28, 2021
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions src/mapml/layers/MapLayer.js
Original file line number Diff line number Diff line change
Expand Up @@ -551,7 +551,7 @@ export var MapMLLayer = L.Layer.extend({
} else {
layerItemName.innerHTML = this._title;
}
layerItemName.id = this._title;
layerItemName.id = 'mapml-layer-item-name-{' + L.stamp(layerItemName) + '}';
opacityControlSummary.innerText = 'Opacity';
opacityControlSummary.id = 'mapml-layer-item-opacity-' + this._title;
opacityControl.appendChild(opacityControlSummary);
Expand All @@ -565,7 +565,7 @@ export var MapMLLayer = L.Layer.extend({
opacity.value = this._container.style.opacity || '1.0';

fieldset.setAttribute("aria-grabbed", "false");
fieldset.setAttribute('aria-labelledby', this._title);
fieldset.setAttribute('aria-labelledby', layerItemName.id);

fieldset.onmousedown = (downEvent) => {
if(downEvent.target.tagName.toLowerCase() === "input" || downEvent.target.tagName.toLowerCase() === "select") return;
Expand Down Expand Up @@ -942,12 +942,12 @@ export var MapMLLayer = L.Layer.extend({
var styleOption = document.createElement('span'),
styleOptionInput = styleOption.appendChild(document.createElement('input'));
styleOptionInput.setAttribute("type", "radio");
styleOptionInput.setAttribute("id", "rad"+j);
styleOptionInput.setAttribute("name", "styles");
styleOptionInput.setAttribute("id", "rad-"+L.stamp(styleOptionInput));
styleOptionInput.setAttribute("name", "styles-"+layer._title);
styleOptionInput.setAttribute("value", styleLinks[j].getAttribute('title'));
styleOptionInput.setAttribute("data-href", new URL(styleLinks[j].getAttribute('href'),base).href);
var styleOptionLabel = styleOption.appendChild(document.createElement('label'));
styleOptionLabel.setAttribute("for", "rad"+j);
styleOptionLabel.setAttribute("for", "rad-"+L.stamp(styleOptionInput));
styleOptionLabel.innerText = styleLinks[j].getAttribute('title');
if (styleLinks[j].getAttribute("rel") === "style self" || styleLinks[j].getAttribute("rel") === "self style") {
styleOptionInput.checked = true;
Expand Down