contrapunctus/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Chore: linting

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-04-13 02:40:21 +02:00
parent 4625ad9a5c
commit 097141f944
307 changed files with 5346 additions and 2147 deletions
Download patch file Download diff file Expand all files Collapse all files

87
src/UI/BigComponents/FilterPanel.svelte
View file

@ -1,49 +1,48 @@
<script lang="ts">
/**
* THe panel containing all filter- and layerselection options
*/
/**
* THe panel containing all filter- and layerselection options
*/
import OverlayToggle from "./OverlayToggle.svelte"
import Filterview from "./Filterview.svelte"
import ThemeViewState from "../../Models/ThemeViewState"
import Translations from "../i18n/Translations"
import Tr from "../Base/Tr.svelte"
import Filter from "../../assets/svg/Filter.svelte"
import OverlayToggle from "./OverlayToggle.svelte"
import Filterview from "./Filterview.svelte"
import ThemeViewState from "../../Models/ThemeViewState"
import Translations from "../i18n/Translations"
import Tr from "../Base/Tr.svelte"
import Filter from "../../assets/svg/Filter.svelte"
export let state: ThemeViewState
let layout = state.layout
let allEnabled : boolean
let allDisabled: boolean
function updateEnableState(){
allEnabled = true
allDisabled = true
state.layerState.filteredLayers.forEach((v) => {
if(!v.layerDef.name){
return
}
allEnabled &&= v.isDisplayed.data
allDisabled &&= !v.isDisplayed.data
})
}
updateEnableState()
export let state: ThemeViewState
let layout = state.layout
let allEnabled: boolean
let allDisabled: boolean
function updateEnableState() {
allEnabled = true
allDisabled = true
state.layerState.filteredLayers.forEach((v) => {
if(!v.layerDef.name){
return
}
v.isDisplayed.addCallbackD(_ => updateEnableState())
if (!v.layerDef.name) {
return
}
allEnabled &&= v.isDisplayed.data
allDisabled &&= !v.isDisplayed.data
})
function enableAll(doEnable: boolean){
state.layerState.filteredLayers.forEach((v) => {
if(!v.layerDef.name){
return
}
v.isDisplayed.setData(doEnable)
})
}
updateEnableState()
state.layerState.filteredLayers.forEach((v) => {
if (!v.layerDef.name) {
return
}
v.isDisplayed.addCallbackD((_) => updateEnableState())
})
function enableAll(doEnable: boolean) {
state.layerState.filteredLayers.forEach((v) => {
if (!v.layerDef.name) {
return
}
v.isDisplayed.setData(doEnable)
})
}
</script>
<div class="m-2 flex flex-col">
@ -59,12 +58,12 @@
highlightedLayer={state.guistate.highlightedLayerInFilters}
/>
{/each}
<div class="flex self-end mt-1">
<div class="mt-1 flex self-end">
<button class="small" class:disabled={allEnabled} on:click={() => enableAll(true)}>
<Tr t={Translations.t.general.filterPanel.enableAll}/>
<Tr t={Translations.t.general.filterPanel.enableAll} />
</button>
<button class="small" class:disabled={allDisabled} on:click={() => enableAll(false)}>
<Tr t={Translations.t.general.filterPanel.disableAll}/>
<button class="small" class:disabled={allDisabled} on:click={() => enableAll(false)}>
<Tr t={Translations.t.general.filterPanel.disableAll} />
</button>
</div>

6
src/UI/BigComponents/Filterview.svelte
View file

@ -66,7 +66,7 @@
/>
</If>
<Tr t={filteredLayer.layerDef.name}/>
<Tr t={filteredLayer.layerDef.name} />
{#if $zoomlevel < layer.minzoom}
<span class="alert">
@ -82,7 +82,7 @@
<!-- There are three (and a half) modes of filters: a single checkbox, a radio button/dropdown or with searchable fields -->
{#if filter.options.length === 1 && filter.options[0].fields.length === 0}
<Checkbox selected={getBooleanStateFor(filter)}>
<Tr t={filter.options[0].question}/>
<Tr t={filter.options[0].question} />
</Checkbox>
{/if}
@ -94,7 +94,7 @@
<Dropdown value={getStateFor(filter)}>
{#each filter.options as option, i}
<option value={i}>
<Tr t={option.question}/>
<Tr t={option.question} />
</option>
{/each}
</Dropdown>

2
src/UI/BigComponents/MapCenterDetails.svelte
View file

@ -41,7 +41,7 @@
let compass = Orientation.singleton.alpha
let relativeBearing: Store<{ distance: string; bearing: Translation }> = compass.mapD(
(compass) => {
if(!distanceToCurrentLocation.data){
if (!distanceToCurrentLocation.data) {
return undefined
}
const bearing: Translation =

36
src/UI/BigComponents/NewPointLocationInput.svelte
View file

@ -8,7 +8,7 @@
import ShowDataLayer from "../Map/ShowDataLayer"
import type {
FeatureSource,
FeatureSourceForLayer
FeatureSourceForLayer,
} from "../../Logic/FeatureSource/FeatureSource"
import SnappingFeatureSource from "../../Logic/FeatureSource/Sources/SnappingFeatureSource"
import FeatureSourceMerger from "../../Logic/FeatureSource/Sources/FeatureSourceMerger"
@ -72,7 +72,7 @@
allowMoving: new UIEventSource<boolean>(true),
allowZooming: new UIEventSource<boolean>(true),
minzoom: new UIEventSource<number>(18),
rasterLayer: UIEventSource.feedFrom(state.mapProperties.rasterLayer)
rasterLayer: UIEventSource.feedFrom(state.mapProperties.rasterLayer),
}
state?.showCurrentLocationOn(map)
@ -82,7 +82,7 @@
if (featuresForLayer) {
new ShowDataLayer(map, {
layer: targetLayer,
features: featuresForLayer
features: featuresForLayer,
})
}
}
@ -99,7 +99,7 @@
new ShowDataLayer(map, {
layer: layer.layer.layerDef,
zoomToFeatures: false,
features: layer
features: layer,
})
}
const snappedLocation = new SnappingFeatureSource(
@ -110,28 +110,30 @@
maxDistance: maxSnapDistance ?? 15,
allowUnsnapped: true,
snappedTo,
snapLocation: value
snapLocation: value,
}
)
const withCorrectedAttributes = new StaticFeatureSource(
snappedLocation.features.mapD(feats => feats.map(f => {
const properties = {
...f.properties,
...presetPropertiesUnpacked
}
properties["_referencing_ways"] = f.properties["snapped-to"]
return ({
...f,
properties
snappedLocation.features.mapD((feats) =>
feats.map((f) => {
const properties = {
...f.properties,
...presetPropertiesUnpacked,
}
properties["_referencing_ways"] = f.properties["snapped-to"]
return {
...f,
properties,
}
})
}))
)
)
// The actual point to be created, snapped at the new location
new ShowDataLayer(map, {
layer: targetLayer,
features: withCorrectedAttributes
features: withCorrectedAttributes,
})
withCorrectedAttributes.features.addCallbackAndRunD(f => console.log("Snapped point is", f))
withCorrectedAttributes.features.addCallbackAndRunD((f) => console.log("Snapped point is", f))
}
</script>

3
src/UI/BigComponents/OpenBackgroundSelectorButton.svelte
View file

@ -22,8 +22,7 @@
arialabel={Translations.t.general.labels.background}
on:click={() => state.guistate.backgroundLayerSelectionIsOpened.setData(true)}
>
<StyleLoadingIndicator map={map ?? state.map} rasterLayer={state.mapProperties.rasterLayer} >
<StyleLoadingIndicator map={map ?? state.map} rasterLayer={state.mapProperties.rasterLayer}>
<Square3Stack3dIcon class="h-6 w-6" />
</StyleLoadingIndicator>
{#if !hideTooltip}

37
src/UI/BigComponents/SelectedElementTitle.svelte
View file

@ -13,7 +13,7 @@
export let layer: LayerConfig
export let selectedElement: Feature
let tags: UIEventSource<Record<string, string>> = state.featureProperties.getStore(
selectedElement.properties.id,
selectedElement.properties.id
)
$: {
tags = state.featureProperties.getStore(selectedElement.properties.id)
@ -43,7 +43,7 @@
class="no-weblate title-icons links-as-button mr-2 flex flex-row flex-wrap items-center gap-x-0.5 pt-0.5 sm:pt-1"
>
{#each layer.titleIcons as titleIconConfig}
{#if (titleIconConfig.condition?.matchesProperties($tags) ?? true) && (titleIconConfig.metacondition?.matchesProperties({ ...$metatags, ...$tags }) ?? true) && titleIconConfig.IsKnown($tags)}
{#if (titleIconConfig.condition?.matchesProperties($tags) ?? true) && (titleIconConfig.metacondition?.matchesProperties( { ...$metatags, ...$tags } ) ?? true) && titleIconConfig.IsKnown($tags)}
<div class={titleIconConfig.renderIconClass ?? "flex h-8 w-8 items-center"}>
<TagRenderingAnswer
config={titleIconConfig}
@ -58,28 +58,33 @@
{/each}
{#if $isTesting || $isDebugging}
<a class="subtle" href="https://github.com/pietervdvn/MapComplete/blob/develop/Docs/Layers/{layer.id}.md"
target="_blank" rel="noreferrer noopener ">{layer.id}</a>
<a
class="subtle"
href="https://github.com/pietervdvn/MapComplete/blob/develop/Docs/Layers/{layer.id}.md"
target="_blank"
rel="noreferrer noopener "
>
{layer.id}
</a>
{/if}
</div>
</div>
{/if}
</div>
<slot name="close-button">
<button
class="mt-2 h-fit shrink-0 rounded-full border-none p-0"
on:click={() => state.selectedElement.setData(undefined)}
style="border: 0 !important; padding: 0 !important;"
use:ariaLabel={Translations.t.general.backToMap}
>
<XCircleIcon aria-hidden={true} class="h-8 w-8" />
</button>
<button
class="mt-2 h-fit shrink-0 rounded-full border-none p-0"
on:click={() => state.selectedElement.setData(undefined)}
style="border: 0 !important; padding: 0 !important;"
use:ariaLabel={Translations.t.general.backToMap}
>
<XCircleIcon aria-hidden={true} class="h-8 w-8" />
</button>
</slot>
</div>
<style>
:global(.title-icons a) {
display: block !important;
}
:global(.title-icons a) {
display: block !important;
}
</style>

30
src/UI/BigComponents/SelectedElementView.svelte
View file

@ -20,19 +20,22 @@
selectedElement.properties.id
)
let layer: LayerConfig = selectedElement.properties.id === "settings" ? UserRelatedState.usersettingsConfig : state.layout.getMatchingLayer(tags.data)
let layer: LayerConfig =
selectedElement.properties.id === "settings"
? UserRelatedState.usersettingsConfig
: state.layout.getMatchingLayer(tags.data)
let stillMatches = tags.map(tags => !layer?.source?.osmTags || layer.source.osmTags?.matchesProperties(tags))
let stillMatches = tags.map(
(tags) => !layer?.source?.osmTags || layer.source.osmTags?.matchesProperties(tags)
)
let _metatags: Record<string, string>
if(state?.userRelatedState?.preferencesAsTags){
onDestroy(
state.userRelatedState.preferencesAsTags.addCallbackAndRun((tags) => {
_metatags = tags
}),
)
if (state?.userRelatedState?.preferencesAsTags) {
onDestroy(
state.userRelatedState.preferencesAsTags.addCallbackAndRun((tags) => {
_metatags = tags
})
)
}
let knownTagRenderings: Store<TagRenderingConfig[]> = tags.mapD((tgs) =>
@ -40,8 +43,8 @@
(config) =>
(config.condition?.matchesProperties(tgs) ?? true) &&
(config.metacondition?.matchesProperties({ ...tgs, ..._metatags }) ?? true) &&
config.IsKnown(tgs),
),
config.IsKnown(tgs)
)
)
</script>
@ -52,13 +55,12 @@
{:else if $tags._deleted === "yes"}
<div class="flex w-full flex-col p-2">
<div aria-live="assertive" class="alert flex items-center justify-center self-stretch">
<Delete_icon class="w-8 h-8 m-2" />
<Delete_icon class="m-2 h-8 w-8" />
<Tr t={Translations.t.delete.isDeleted} />
</div>
<BackButton clss="self-stretch mt-4" on:click={() => state.selectedElement.setData(undefined)}>
<Tr t={Translations.t.general.returnToTheMap} />
</BackButton>
</div>
{:else}
<div

17
src/UI/BigComponents/ShareScreen.svelte
View file

@ -71,10 +71,8 @@
</script>
<div class="flex flex-col">
<div class="flex justify-between items-start">
<div class="flex items-start justify-between">
<div class="flex flex-col">
<Tr t={tr.intro} />
<div class="flex">
{#if typeof navigator?.share === "function"}
@ -92,10 +90,10 @@
</div>
</div>
</div>
<ToSvelte construct={() => new Img(new Qr(linkToShare).toImageElement(125)).SetStyle(
"width: 125px"
)} />
<ToSvelte
construct={() => new Img(new Qr(linkToShare).toImageElement(125)).SetStyle("width: 125px")}
/>
</div>
<div class="flex justify-center">
@ -106,8 +104,7 @@
<Tr t={tr.embedIntro} />
<div class="flex flex-col interactive p-1">
<div class="interactive flex flex-col p-1">
<div class="literal-code m-1">
&lt;span class="literal-code iframe-code-block"&gt; <br />
&lt;iframe src="{linkToShare}"
@ -127,7 +124,7 @@
</label>
<label>
<input bind:checked={enableLogin} type="checkbox" id="share_enable_login"/>
<input bind:checked={enableLogin} type="checkbox" id="share_enable_login" />
<Tr t={tr.fsUserbadge} />
</label>
</div>

7
src/UI/BigComponents/StatisticsPanel.ts
View file

@ -17,10 +17,9 @@ export default class StatisticsForLayerPanel extends VariableUiElement {
return new Loading("Loading data")
}
if (features.length === 0) {
return new Combine([
"No elements in view for layer ",
layer.id
]).SetClass("block")
return new Combine(["No elements in view for layer ", layer.id]).SetClass(
"block"
)
}
const els: BaseUIElement[] = []
const featuresForLayer = features

61
src/UI/BigComponents/TagRenderingChart.ts
View file

@ -8,8 +8,8 @@ import { OsmFeature } from "../../Models/OsmFeature"
export interface TagRenderingChartOptions {
groupToOtherCutoff?: 3 | number
sort?: boolean,
hideUnkown?: boolean,
sort?: boolean
hideUnkown?: boolean
hideNotApplicable?: boolean
}
@ -21,8 +21,8 @@ export class StackedRenderingChart extends ChartJs {
period: "day" | "month"
groupToOtherCutoff?: 3 | number
// If given, take the sum of these fields to get the feature weight
sumFields?: string[],
hideUnknown?: boolean,
sumFields?: string[]
hideUnknown?: boolean
hideNotApplicable?: boolean
}
) {
@ -30,7 +30,7 @@ export class StackedRenderingChart extends ChartJs {
sort: true,
groupToOtherCutoff: options?.groupToOtherCutoff,
hideNotApplicable: options?.hideNotApplicable,
hideUnkown: options?.hideUnknown
hideUnkown: options?.hideUnknown,
})
if (labels === undefined || data === undefined) {
console.error(
@ -121,13 +121,13 @@ export class StackedRenderingChart extends ChartJs {
datasets.push({
data: countsPerDay,
backgroundColor,
label
label,
})
}
const perDayData = {
labels: trimmedDays,
datasets
datasets,
}
const config = <ChartConfiguration>{
@ -136,17 +136,17 @@ export class StackedRenderingChart extends ChartJs {
options: {
responsive: true,
legend: {
display: false
display: false,
},
scales: {
x: {
stacked: true
stacked: true,
},
y: {
stacked: true
}
}
}
stacked: true,
},
},
},
}
super(config)
}
@ -199,7 +199,7 @@ export default class TagRenderingChart extends Combine {
"rgba(255, 206, 86, 0.2)",
"rgba(75, 192, 192, 0.2)",
"rgba(153, 102, 255, 0.2)",
"rgba(255, 159, 64, 0.2)"
"rgba(255, 159, 64, 0.2)",
]
public static readonly borderColors = [
@ -208,7 +208,7 @@ export default class TagRenderingChart extends Combine {
"rgba(255, 206, 86, 1)",
"rgba(75, 192, 192, 1)",
"rgba(153, 102, 255, 1)",
"rgba(255, 159, 64, 1)"
"rgba(255, 159, 64, 1)",
]
/**
@ -244,12 +244,12 @@ export default class TagRenderingChart extends Combine {
const borderColor = [
TagRenderingChart.unkownBorderColor,
TagRenderingChart.otherBorderColor,
TagRenderingChart.notApplicableBorderColor
TagRenderingChart.notApplicableBorderColor,
]
const backgroundColor = [
TagRenderingChart.unkownColor,
TagRenderingChart.otherColor,
TagRenderingChart.notApplicableColor
TagRenderingChart.notApplicableColor,
]
while (borderColor.length < data.length) {
@ -281,17 +281,17 @@ export default class TagRenderingChart extends Combine {
backgroundColor,
borderColor,
borderWidth: 1,
label: undefined
}
]
label: undefined,
},
],
},
options: {
plugins: {
legend: {
display: !barchartMode
}
}
}
display: !barchartMode,
},
},
},
}
const chart = new ChartJs(config).SetClass(options?.chartclasses ?? "w-32 h-32")
@ -302,7 +302,7 @@ export default class TagRenderingChart extends Combine {
super([
options?.includeTitle ? tagRendering.question.Clone() ?? tagRendering.id : undefined,
chart
chart,
])
this.SetClass("block")
@ -402,15 +402,10 @@ export default class TagRenderingChart extends Combine {
labels.push("Other")
if (!options.hideNotApplicable) {
data.push(notApplicable)
labels.push(
"Not applicable"
)
labels.push("Not applicable")
}
data.push(...categoryCounts,
...otherData)
labels.push(
...(mappings?.map((m) => m.then.txt) ?? []),
...otherLabels)
data.push(...categoryCounts, ...otherData)
labels.push(...(mappings?.map((m) => m.then.txt) ?? []), ...otherLabels)
return { labels, data }
}

9
src/UI/BigComponents/ThemeButton.svelte
View file

@ -85,10 +85,8 @@
</script>
{#if theme.id !== personal.id || $unlockedPersonal}
<a
class={"w-full button text-ellipsis"}
href={$href}
> <img src={theme.icon} class="m-1 mr-2 block h-11 w-11 sm:m-2 sm:mr-4" alt="" />
<a class={"button w-full text-ellipsis"} href={$href}>
<img src={theme.icon} class="m-1 mr-2 block h-11 w-11 sm:m-2 sm:mr-4" alt="" />
<span class="flex flex-col overflow-hidden text-ellipsis">
<Tr t={title} />
@ -97,5 +95,6 @@
<Tr t={Translations.t.general.morescreen.enterToOpen} />
</span>
{/if}
</span></a>
</span>
</a>
{/if}

6
src/UI/BigComponents/WaySplitMap.svelte
View file

@ -29,13 +29,13 @@
const splitpoint_style = new LayerConfig(
<LayerConfigJson>split_point,
"(BUILTIN) SplitRoadWizard.ts",
true,
true
)
const splitroad_style = new LayerConfig(
<LayerConfigJson>split_road,
"(BUILTIN) SplitRoadWizard.ts",
true,
true
)
/**
@ -105,7 +105,7 @@
})
</script>
<div class="h-full w-full relative">
<div class="relative h-full w-full">
<MaplibreMap {map} mapProperties={adaptor} />
<SmallZoomButtons {adaptor} />
</div>