Robin-van-der-Linde/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Accessibility: small improvements to make keyboard navigation easier. See #1181

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-11-30 00:38:37 +01:00
parent 8f7b731d29
commit eb444ab849
3 changed files with 16 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/UI/Popup/TagRendering/Questionbox.svelte
View file

@ -8,7 +8,6 @@
import type { Feature } from "geojson";
import type { SpecialVisualizationState } from "../../SpecialVisualization";
import LayerConfig from "../../../Models/ThemeConfig/LayerConfig";
import If from "../../Base/If.svelte";
import TagRenderingQuestion from "./TagRenderingQuestion.svelte";
import Tr from "../../Base/Tr.svelte";
import Translations from "../../i18n/Translations.js";

4
src/UI/Popup/TagRendering/TagRenderingEditable.svelte
View file

@ -11,7 +11,7 @@
import Translations from "../../i18n/Translations.js"
import LayerConfig from "../../../Models/ThemeConfig/LayerConfig"
import { Utils } from "../../../Utils"
import { twMerge } from "tailwind-merge"
export let config: TagRenderingConfig
export let tags: UIEventSource<Record<string, string>>
export let selectedElement: Feature | undefined
@ -71,7 +71,7 @@
}
</script>
<div bind:this={htmlElem} class={clss}>
<div bind:this={htmlElem} class={twMerge(clss, "tr-"+config.id)}>
{#if config.question && (!editingEnabled || $editingEnabled)}
{#if editMode}
<TagRenderingQuestion {config} {tags} {selectedElement} {state} {layer}>

18
src/UI/Popup/TagRendering/TagRenderingQuestion.svelte
View file

@ -88,6 +88,9 @@
// TODO this has _to much_ values
freeformInput.setData(unseenFreeformValues.join(";"))
checkedMappings.push(unseenFreeformValues.length > 0)
freeformInput.addCallbackAndRun(freeformValue => {
checkedMappings[checkedMappings.length - 1] = !!freeformValue
})
}
}
if (confg.freeform?.key) {
@ -168,6 +171,12 @@
.then((changes) => state.changes.applyChanges(changes))
.catch(console.error)
}
function onInputKeypress(e: Event){
if (e.key === "Enter") {
onSave();
}
}
let featureSwitchIsTesting = state?.featureSwitchIsTesting ?? new ImmutableStore(false)
let featureSwitchIsDebugging =
@ -254,9 +263,8 @@
bind:group={selectedMapping}
name={"mappings-radio-" + config.id}
value={i}
on:keypress={(e) => {
if (e.key === "Enter") onSave()
}}
on:keypress={onInputKeypress}
/>
</TagRenderingMappingInput>
{/each}
@ -267,6 +275,7 @@
bind:group={selectedMapping}
name={"mappings-radio-" + config.id}
value={config.mappings?.length}
on:keypress={onInputKeypress}
/>
<FreeformInput
{config}
@ -298,6 +307,7 @@
type="checkbox"
name={"mappings-checkbox-" + config.id + "-" + i}
bind:checked={checkedMappings[i]}
on:keypress={onInputKeypress}
/>
</TagRenderingMappingInput>
{/each}
@ -307,6 +317,7 @@
type="checkbox"
name={"mappings-checkbox-" + config.id + "-" + config.mappings?.length}
bind:checked={checkedMappings[config.mappings.length]}
on:keypress={onInputKeypress}
/>
<FreeformInput
{config}
@ -315,7 +326,6 @@
{unit}
feature={selectedElement}
value={freeformInput}
on:selected={() => (checkedMappings[config.mappings.length] = true)}
on:submit={onSave}
/>
</label>