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

Refactoring: remove some more of the deprecated, old-style svg-images

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-01-10 23:46:57 +01:00
parent 859faead7f
commit d95e40e1c7
10 changed files with 131 additions and 68 deletions
Download patch file Download diff file Expand all files Collapse all files

109
scripts/generateIncludedImages.ts
View file

@ -6,68 +6,99 @@ function genImages(dryrun = false) {
const blacklist: string[] = [
"add",
"addSmall",
"back",
"blocked",
"brick_wall",
"brick_wall_raw",
"brick_wall_round",
"brick_wall_square",
"bug",
"center",
"checkmark",
"clock",
"close",
"community",
"compass",
"compass_arrow",
"confirm",
"copyright",
"cross",
"cross_bottom_right",
"crosshair",
"crosshair_locked",
"crosshair-locked",
"delete_not_allowed",
"direction_gradient",
"direction_stroke",
"duplicate",
"elevator",
"elevator_wheelchair",
"liberapay",
"length_crosshair",
"speech_bubble_black_outline",
"square",
"star_half",
"star_outline",
"star",
"osm_logo_us",
"triangle",
"teardrop_with_hole_green",
"SocialImageForeground",
"wikipedia",
"Upload",
"pin",
"mapillary_black",
"plantnet_logo",
"mastodon",
"move-arrows",
"mapcomplete_logo",
"logo",
"logout",
"hand",
"help",
"home",
"reload",
"min",
"plus",
"not_found",
"osm_logo_us",
"party",
"eye",
"filter",
"filter_disable",
"floppy",
"eye",
"gear",
"gender_bi",
"compass",
"blocked",
"brick_wall",
"brick_wall_raw",
"brick_wall_round",
"bug",
"back",
"gender_inter",
"gender_female",
"gender_male",
"gender_trans",
"gender_queer",
"generic_map",
"gps_arrow",
"hand",
"help",
"home",
"length_crosshair",
"length-crosshair",
"liberapay",
"location",
"location_empty",
"location_locked",
"location_refused",
"location-refused",
"location_unlocked",
"logo",
"logout",
"mapcomplete_logo",
"mapillary",
"mapillary_black",
"mastodon",
"min",
"move-arrows",
"move_confirm",
"move_not_allowed",
"not_found",
"osm_logo_us",
"osm-logo-us",
"party",
"person",
"pin",
"plantnet_logo",
"plus",
"reload",
"ring",
"robot",
"SocialImageForeground",
"speech_bubble_black_outline",
"square",
"star",
"star_half",
"star_outline",
"teardrop",
"teardrop_with_hole_green",
"translate",
"triangle",
"Upload",
"wikidata",
"wikimedia-commons-white",
"wikimedia_commons_white",
"wikipedia",
].map((s) => s.toLowerCase())
const dir = fs.readdirSync("./assets/svg")
let module =
'import Img from "./UI/Base/Img";\nimport {FixedUiElement} from "./UI/Base/FixedUiElement";\n\n/* @deprecated */\nexport default class Svg {\n\n\n'
'import Img from "./UI/Base/Img";\n\n/* @deprecated */\nexport default class Svg {\n\n\n'
for (const path of dir) {
if (path.endsWith("license_info.json")) {
continue

12
src/Logic/ImageProviders/WikidataImageProvider.ts
View file

@ -1,13 +1,11 @@
import ImageProvider, { ProvidedImage } from "./ImageProvider"
import BaseUIElement from "../../UI/BaseUIElement"
import Svg from "../../Svg"
import { WikimediaImageProvider } from "./WikimediaImageProvider"
import Wikidata from "../Web/Wikidata"
import SvelteUIElement from "../../UI/Base/SvelteUIElement"
import * as Wikidata_icon from "../../assets/svg/Wikidata.svelte"
export class WikidataImageProvider extends ImageProvider {
public apiUrls(): string[] {
return Wikidata.neededUrls
}
public static readonly singleton = new WikidataImageProvider()
public readonly defaultKeyPrefixes = ["wikidata"]
@ -15,8 +13,12 @@ export class WikidataImageProvider extends ImageProvider {
super()
}
public apiUrls(): string[] {
return Wikidata.neededUrls
}
public SourceIcon(): BaseUIElement {
return Svg.wikidata_svg()
return new SvelteUIElement(Wikidata_icon)
}
public async ExtractUrls(key: string, value: string): Promise<Promise<ProvidedImage>[]> {

4
src/Logic/ImageProviders/WikimediaImageProvider.ts
View file

@ -4,6 +4,8 @@ import Svg from "../../Svg"
import { Utils } from "../../Utils"
import { LicenseInfo } from "./LicenseInfo"
import Wikimedia from "../Web/Wikimedia"
import SvelteUIElement from "../../UI/Base/SvelteUIElement"
import Wikimedia_commons_white from "../../assets/svg/Wikimedia_commons_white.svelte"
/**
* This module provides endpoints for wikimedia and others
@ -70,7 +72,7 @@ export class WikimediaImageProvider extends ImageProvider {
}
SourceIcon(): BaseUIElement {
return Svg.wikimedia_commons_white_svg().SetStyle("width:2em;height: 2em")
return new SvelteUIElement(Wikimedia_commons_white).SetStyle("width:2em;height: 2em")
}
public PrepUrl(value: string): ProvidedImage {

4
src/UI/Base/LinkToWeblate.ts
View file

@ -2,6 +2,8 @@ import { VariableUiElement } from "./VariableUIElement"
import Locale from "../i18n/Locale"
import Link from "./Link"
import Svg from "../../Svg"
import SvelteUIElement from "./SvelteUIElement"
import Translate from "../../assets/svg/Translate.svelte"
/**
* The little 'translate'-icon next to every icon + some static helper functions
@ -20,7 +22,7 @@ export default class LinkToWeblate extends VariableUiElement {
if (context === undefined || context.indexOf(":") < 0) {
return undefined
}
const icon = Svg.translate_svg().SetClass(
const icon = new SvelteUIElement(Translate).SetClass(
"rounded-full inline-block w-3 h-3 ml-1 weblate-link self-center"
)
if (availableTranslations[ln] === undefined) {

10
src/UI/BigComponents/UploadTraceToOsmUI.ts
View file

@ -7,13 +7,15 @@ import { TextField } from "../Input/TextField"
import { Store, UIEventSource } from "../../Logic/UIEventSource"
import Title from "../Base/Title"
import { SubtleButton } from "../Base/SubtleButton"
import Svg from "../../Svg"
import { OsmConnection } from "../../Logic/Osm/OsmConnection"
import LayoutConfig from "../../Models/ThemeConfig/LayoutConfig"
import { Translation } from "../i18n/Translation"
import { LoginToggle } from "../Popup/LoginButton"
import SvelteUIElement from "../Base/SvelteUIElement"
import Upload from "../../assets/svg/Upload.svelte"
import Close from "../../assets/svg/Close.svelte"
import Confirm from "../../assets/svg/Confirm.svelte"
import Invalid from "../../assets/svg/Invalid.svelte"
export default class UploadTraceToOsmUI extends LoginToggle {
constructor(
@ -80,7 +82,7 @@ export default class UploadTraceToOsmUI extends LoginToggle {
t.meta.descriptionIntro,
description,
new Combine([
new SubtleButton(Svg.close_svg(), Translations.t.general.cancel)
new SubtleButton(new SvelteUIElement(Close), Translations.t.general.cancel)
.onClick(() => {
clicked.setData(false)
})
@ -116,7 +118,7 @@ export default class UploadTraceToOsmUI extends LoginToggle {
new Toggle(
new Toggle(
new Combine([
Svg.confirm_svg().SetClass("w-12 h-12 mr-2"),
new SvelteUIElement(Confirm).SetClass("w-12 h-12 mr-2"),
t.uploadFinished,
]).SetClass("flex p-2 rounded-xl border-2 subtle-border items-center"),
new Toggle(
@ -129,7 +131,7 @@ export default class UploadTraceToOsmUI extends LoginToggle {
uploadFinished
),
new Combine([
Svg.invalid_svg().SetClass("w-8 h-8 m-2"),
new SvelteUIElement(Invalid).SetClass("w-8 h-8 m-2"),
t.gpxServiceOffline.SetClass("p-2"),
]).SetClass("flex border alert items-center"),
state.osmConnection.gpxServiceIsOnline.map(

3
src/UI/Popup/ImportButtons/ImportFlow.svelte
View file

@ -18,6 +18,7 @@
import Svg from "../../../Svg"
import ToSvelte from "../../Base/ToSvelte.svelte"
import { EyeIcon, EyeOffIcon } from "@rgossiaux/svelte-heroicons/solid"
import Confirm from "../../../assets/svg/Confirm.svelte"
export let importFlow: ImportFlow
let state = importFlow.state
@ -143,7 +144,7 @@
{#if importFlow.args.icon}
<img src={importFlow.args.icon} />
{:else}
<ToSvelte construct={Svg.confirm_svg().SetClass("w-8 h-8 pr-4")} />
<Confirm class="w-8 h-8 pr-4"/>
{/if}
</span>
<slot name="confirm-text">

11
src/UI/Popup/MoveWizardState.ts
View file

@ -1,4 +1,3 @@
import Svg from "../../Svg"
import { UIEventSource } from "../../Logic/UIEventSource"
import Translations from "../i18n/Translations"
import { Translation } from "../i18n/Translation"
@ -10,6 +9,9 @@ import { And } from "../../Logic/Tags/And"
import { Tag } from "../../Logic/Tags/Tag"
import { SpecialVisualizationState } from "../SpecialVisualization"
import { Feature, Point } from "geojson"
import SvelteUIElement from "../Base/SvelteUIElement"
import Confirm from "../../assets/svg/Confirm.svelte"
import Relocation from "../../assets/svg/Relocation.svelte"
export interface MoveReason {
text: Translation | string
@ -32,10 +34,7 @@ export class MoveWizardState {
constructor(id: string, options: MoveConfig, state: SpecialVisualizationState) {
this._state = state
const t = Translations.t.move
this.reasons = MoveWizardState.initReasons(options)
if (this.reasons.length > 0) {
this.checkIsAllowed(id)
}
@ -49,7 +48,7 @@ export class MoveWizardState {
reasons.push({
text: t.reasons.reasonRelocation,
invitingText: t.inviteToMove.reasonRelocation,
icon: Svg.relocation_svg(),
icon: new SvelteUIElement(Relocation),
changesetCommentValue: "relocated",
lockBounds: false,
background: undefined,
@ -63,7 +62,7 @@ export class MoveWizardState {
reasons.push({
text: t.reasons.reasonInaccurate,
invitingText: t.inviteToMove.reasonInaccurate,
icon: Svg.crosshair_svg(),
icon: new SvelteUIElement(Confirm),
changesetCommentValue: "improve_accuracy",
lockBounds: true,
includeSearch: false,

4
src/UI/Popup/Notes/CloseNoteButton.ts
View file

@ -9,6 +9,8 @@ import { LoginToggle } from ".././LoginButton"
import { SpecialVisualization, SpecialVisualizationState } from "../../SpecialVisualization"
import { UIEventSource } from "../../../Logic/UIEventSource"
import Constants from "../../../Models/Constants"
import SvelteUIElement from "../../Base/SvelteUIElement"
import Checkmark from "../../../assets/svg/Checkmark.svelte"
export class CloseNoteButton implements SpecialVisualization {
public readonly funcName = "close_note"
@ -61,7 +63,7 @@ export class CloseNoteButton implements SpecialVisualization {
zoomButton: string
} = <any>Utils.ParseVisArgs(this.args, args)
let icon = Svg.checkmark_svg()
let icon: BaseUIElement = new SvelteUIElement(Checkmark)
if (params.icon !== "checkmark.svg" && (args[2] ?? "") !== "") {
icon = new Img(args[1])
}

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

@ -4,7 +4,7 @@
import type { Feature } from "geojson"
import type { SpecialVisualizationState } from "../../SpecialVisualization"
import TagRenderingAnswer from "./TagRenderingAnswer.svelte"
import { PencilAltIcon, XCircleIcon } from "@rgossiaux/svelte-heroicons/solid"
import { PencilAltIcon } from "@rgossiaux/svelte-heroicons/solid"
import TagRenderingQuestion from "./TagRenderingQuestion.svelte"
import { onDestroy } from "svelte"
import Tr from "../../Base/Tr.svelte"
@ -32,7 +32,7 @@
onDestroy(
tags.addCallbackD((tags) => {
editMode = !config.IsKnown(tags)
})
}),
)
}

38
src/UI/Wikipedia/WikidataPreviewBox.ts
View file

@ -9,9 +9,15 @@ import Combine from "../Base/Combine"
import Img from "../Base/Img"
import { WikimediaImageProvider } from "../../Logic/ImageProviders/WikimediaImageProvider"
import Link from "../Base/Link"
import Svg from "../../Svg"
import BaseUIElement from "../BaseUIElement"
import { Utils } from "../../Utils"
import SvelteUIElement from "../Base/SvelteUIElement"
import * as Wikidata_icon from "../../assets/svg/Wikidata.svelte"
import Gender_male from "../../assets/svg/Gender_male.svelte"
import Gender_female from "../../assets/svg/Gender_female.svelte"
import Gender_inter from "../../assets/svg/Gender_inter.svelte"
import Gender_trans from "../../assets/svg/Gender_trans.svelte"
import Gender_queer from "../../assets/svg/Gender_queer.svelte"
export default class WikidataPreviewBox extends VariableUiElement {
private static isHuman = [{ p: 31 /*is a*/, q: 5 /* human */ }]
@ -28,22 +34,36 @@ export default class WikidataPreviewBox extends VariableUiElement {
requires: WikidataPreviewBox.isHuman,
property: "P21",
display: new Map([
["Q6581097", () => Svg.gender_male_svg().SetStyle("width: 1rem; height: auto")],
["Q6581072", () => Svg.gender_female_svg().SetStyle("width: 1rem; height: auto")],
["Q1097630", () => Svg.gender_inter_svg().SetStyle("width: 1rem; height: auto")],
[
"Q6581097",
() => new SvelteUIElement(Gender_male).SetStyle("width: 1rem; height: auto"),
],
[
"Q6581072",
() => new SvelteUIElement(Gender_female).SetStyle("width: 1rem; height: auto"),
],
[
"Q1097630",
() => new SvelteUIElement(Gender_inter).SetStyle("width: 1rem; height: auto"),
],
[
"Q1052281",
() =>
Svg.gender_trans_svg().SetStyle(
new SvelteUIElement(Gender_trans).SetStyle(
"width: 1rem; height: auto"
) /*'transwomen'*/,
],
[
"Q2449503",
() =>
Svg.gender_trans_svg().SetStyle("width: 1rem; height: auto") /*'transmen'*/,
new SvelteUIElement(Gender_trans).SetStyle(
"width: 1rem; height: auto"
) /*'transmen'*/,
],
[
"Q48270",
() => new SvelteUIElement(Gender_queer).SetStyle("width: 1rem; height: auto"),
],
["Q48270", () => Svg.gender_queer_svg().SetStyle("width: 1rem; height: auto")],
]),
textMode: new Map([
["Q6581097", "♂️"],
@ -116,7 +136,9 @@ export default class WikidataPreviewBox extends VariableUiElement {
wikidata.id,
options?.noImages
? wikidata.id
: Svg.wikidata_svg().SetStyle("width: 2.5rem").SetClass("block"),
: new SvelteUIElement(Wikidata_icon)
.SetStyle("width: 2.5rem")
.SetClass("block"),
]).SetClass("flex"),
Wikidata.IdToArticle(wikidata.id),
true