forked from MapComplete/MapComplete
Merge develop
This commit is contained in:
commit
d1e7eba2db
19 changed files with 554 additions and 448 deletions
|
|
@ -175,13 +175,23 @@
|
|||
"cs": "Jaké je telefonní číslo {title()}?"
|
||||
},
|
||||
"render": {
|
||||
"*": "<a href='tel:{phone}'>{phone}</a>"
|
||||
"special": {
|
||||
"type": "link",
|
||||
"href": "tel:{phone}",
|
||||
"text": "{phone}"
|
||||
}
|
||||
},
|
||||
"icon": "./assets/layers/questions/phone.svg",
|
||||
"mappings": [
|
||||
{
|
||||
"if": "contact:phone~*",
|
||||
"then": "<a href='tel:{contact:phone}'>{contact:phone}</a>",
|
||||
"then": {
|
||||
"special": {
|
||||
"type": "link",
|
||||
"href": "tel:{contact:phone}",
|
||||
"text": "{contact:phone}"
|
||||
}
|
||||
},
|
||||
"hideInAnswer": true,
|
||||
"icon": "./assets/layers/questions/phone.svg"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -231,6 +231,7 @@
|
|||
},
|
||||
{
|
||||
"if": "access=customers",
|
||||
"icon": "key",
|
||||
"then": {
|
||||
"en": "Only access to customers",
|
||||
"de": "Der Zugang ist nur für Kunden",
|
||||
|
|
@ -245,6 +246,7 @@
|
|||
},
|
||||
{
|
||||
"if": "access=no",
|
||||
"icon": "lock",
|
||||
"alsoShowIf": "access=private",
|
||||
"then": {
|
||||
"en": "Not accessible",
|
||||
|
|
@ -261,6 +263,7 @@
|
|||
},
|
||||
{
|
||||
"if": "access=key",
|
||||
"icon": "key",
|
||||
"then": {
|
||||
"en": "Accessible, but one has to ask a key to enter",
|
||||
"de": "Der Zugang ist möglich, aber man muss nach einen Schlüssel fragen",
|
||||
|
|
|
|||
|
|
@ -91,7 +91,7 @@
|
|||
},
|
||||
"freeform": {
|
||||
"key": "inscription",
|
||||
"type": "string",
|
||||
"type": "text",
|
||||
"placeholder": {
|
||||
"en": "Text on the sign",
|
||||
"de": "Text auf dem Schild",
|
||||
|
|
|
|||
|
|
@ -193,6 +193,7 @@
|
|||
},
|
||||
"josmNotOpened": "JOSM could not be reached. Make sure it is opened and remote control is enabled",
|
||||
"josmOpened": "JOSM is opened",
|
||||
"madeBy": "Mady by <b>{author}</b>",
|
||||
"mapContributionsBy": "The current visible data has edits made by {contributors}",
|
||||
"mapContributionsByAndHidden": "The current visible data has edits made by {contributors} and {hiddenCount} more contributors",
|
||||
"mapDataByOsm": "Map data: OpenStreetMap",
|
||||
|
|
|
|||
|
|
@ -2077,6 +2077,12 @@ video {
|
|||
margin-bottom: calc(0px * var(--tw-space-y-reverse));
|
||||
}
|
||||
|
||||
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
||||
|
|
@ -2101,12 +2107,6 @@ video {
|
|||
margin-left: calc(-1px * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
||||
|
|
@ -2435,6 +2435,10 @@ video {
|
|||
border-top-right-radius: 0.25rem;
|
||||
}
|
||||
|
||||
.rounded-bl-full {
|
||||
border-bottom-left-radius: 9999px;
|
||||
}
|
||||
|
||||
.rounded-tl {
|
||||
border-top-left-radius: 0.25rem;
|
||||
}
|
||||
|
|
@ -3458,6 +3462,14 @@ video {
|
|||
padding-top: 0px;
|
||||
}
|
||||
|
||||
.pl-3 {
|
||||
padding-left: 0.75rem;
|
||||
}
|
||||
|
||||
.pb-3 {
|
||||
padding-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.pl-4 {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
|
@ -3466,14 +3478,6 @@ video {
|
|||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.pl-3 {
|
||||
padding-left: 0.75rem;
|
||||
}
|
||||
|
||||
.pr-3 {
|
||||
padding-right: 0.75rem;
|
||||
}
|
||||
|
||||
.pl-1 {
|
||||
padding-left: 0.25rem;
|
||||
}
|
||||
|
|
@ -4908,6 +4912,10 @@ a:hover {
|
|||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.no-bold b {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/************************* MISC ELEMENTS *************************/
|
||||
|
||||
.selected svg:not(.noselect *) path.selectable {
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ import Script from "./Script"
|
|||
|
||||
const knownLanguages = ["en", "nl", "de", "fr", "es", "gl", "ca"]
|
||||
const ignoreTerms = ["searchTerms"]
|
||||
|
||||
class TranslationPart {
|
||||
contents: Map<string, TranslationPart | string> = new Map<string, TranslationPart | string>()
|
||||
|
||||
|
|
@ -14,7 +15,8 @@ class TranslationPart {
|
|||
const rootTranslation = new TranslationPart()
|
||||
for (const file of files) {
|
||||
const content = JSON.parse(readFileSync(file, { encoding: "utf8" }))
|
||||
rootTranslation.addTranslation(file.substr(0, file.length - ".json".length), content)
|
||||
const language = file.substr(0, file.length - ".json".length)
|
||||
rootTranslation.addTranslation(language, content)
|
||||
}
|
||||
return rootTranslation
|
||||
}
|
||||
|
|
@ -46,10 +48,6 @@ class TranslationPart {
|
|||
return
|
||||
}
|
||||
for (const translationsKey in translations) {
|
||||
if (!translations.hasOwnProperty(translationsKey)) {
|
||||
continue
|
||||
}
|
||||
|
||||
const v = translations[translationsKey]
|
||||
if (typeof v != "string") {
|
||||
console.error(
|
||||
|
|
@ -104,9 +102,6 @@ class TranslationPart {
|
|||
}
|
||||
|
||||
for (let key in object) {
|
||||
if (!object.hasOwnProperty(key)) {
|
||||
continue
|
||||
}
|
||||
if (ignoreTerms.indexOf(key) >= 0) {
|
||||
continue
|
||||
}
|
||||
|
|
@ -155,13 +150,13 @@ class TranslationPart {
|
|||
this.contents.set(key, new TranslationPart())
|
||||
}
|
||||
|
||||
;(this.contents.get(key) as TranslationPart).recursiveAdd(v, context + "." + key)
|
||||
(this.contents.get(key) as TranslationPart).recursiveAdd(v, context + "." + key)
|
||||
}
|
||||
}
|
||||
|
||||
knownLanguages(): string[] {
|
||||
const languages = []
|
||||
for (let key of Array.from(this.contents.keys())) {
|
||||
for (const key of Array.from(this.contents.keys())) {
|
||||
const value = this.contents.get(key)
|
||||
|
||||
if (typeof value === "string") {
|
||||
|
|
@ -180,20 +175,20 @@ class TranslationPart {
|
|||
const parts = []
|
||||
let keys = Array.from(this.contents.keys())
|
||||
keys = keys.sort()
|
||||
for (let key of keys) {
|
||||
for (const key of keys) {
|
||||
let value = this.contents.get(key)
|
||||
|
||||
if (typeof value === "string") {
|
||||
value = value.replace(/"/g, '\\"').replace(/\n/g, "\\n")
|
||||
value = value.replace(/"/g, "\\\"").replace(/\n/g, "\\n")
|
||||
if (neededLanguage === undefined) {
|
||||
parts.push(`\"${key}\": \"${value}\"`)
|
||||
parts.push(`"${key}": "${value}"`)
|
||||
} else if (key === neededLanguage) {
|
||||
return `"${value}"`
|
||||
}
|
||||
} else {
|
||||
const sub = (value as TranslationPart).toJson(neededLanguage)
|
||||
if (sub !== "") {
|
||||
parts.push(`\"${key}\": ${sub}`)
|
||||
parts.push(`"${key}": ${sub}`)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -234,7 +229,7 @@ class TranslationPart {
|
|||
} else if (!isLeaf) {
|
||||
errors.push({
|
||||
error: "Mixed node: non-leaf node has translation strings",
|
||||
path: path,
|
||||
path: path
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -285,7 +280,7 @@ class TranslationPart {
|
|||
value +
|
||||
"\n" +
|
||||
fixLink,
|
||||
path: path,
|
||||
path: path
|
||||
})
|
||||
}
|
||||
return
|
||||
|
|
@ -297,7 +292,7 @@ class TranslationPart {
|
|||
error: `The translation for ${key} does not have the required subpart ${part} (in ${usedByLanguage}).
|
||||
\tThe full translation is ${value}
|
||||
\t${fixLink}`,
|
||||
path: path,
|
||||
path: path
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -334,24 +329,6 @@ class TranslationPart {
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks that the given object only contains string-values
|
||||
* @param tr
|
||||
*/
|
||||
function isTranslation(tr: any): boolean {
|
||||
if (tr["#"] === "no-translations") {
|
||||
return false
|
||||
}
|
||||
if (tr["special"]) {
|
||||
return false
|
||||
}
|
||||
for (const key in tr) {
|
||||
if (typeof tr[key] !== "string") {
|
||||
return false
|
||||
}
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts a translation object into something that can be added to the 'generated translations'.
|
||||
|
|
@ -361,9 +338,10 @@ function isTranslation(tr: any): boolean {
|
|||
function transformTranslation(
|
||||
obj: any,
|
||||
path: string[] = [],
|
||||
languageWhitelist: string[] = undefined
|
||||
languageWhitelist: string[] = undefined,
|
||||
shortNotation = false
|
||||
) {
|
||||
if (isTranslation(obj)) {
|
||||
if (GenerateTranslations.isTranslation(obj)) {
|
||||
return `new Translation( ${JSON.stringify(obj)} )`
|
||||
}
|
||||
|
||||
|
|
@ -380,7 +358,7 @@ function transformTranslation(
|
|||
}
|
||||
let value = obj[key]
|
||||
|
||||
if (isTranslation(value)) {
|
||||
if (GenerateTranslations.isTranslation(value)) {
|
||||
if (languageWhitelist !== undefined) {
|
||||
const nv = {}
|
||||
for (const ln of languageWhitelist) {
|
||||
|
|
@ -395,7 +373,7 @@ function transformTranslation(
|
|||
)}.${key}\n\tThe translations in other languages are ${JSON.stringify(value)}`
|
||||
}
|
||||
const subParts: string[] = value["en"].match(/{[^}]*}/g)
|
||||
let expr = `return new Translation(${JSON.stringify(value)}, "core:${path.join(
|
||||
let expr = `new Translation(${JSON.stringify(value)}, "core:${path.join(
|
||||
"."
|
||||
)}.${key}")`
|
||||
if (subParts !== null) {
|
||||
|
|
@ -409,12 +387,16 @@ function transformTranslation(
|
|||
"."
|
||||
)}: A subpart contains invalid characters: ${subParts.join(", ")}`
|
||||
}
|
||||
expr = `return new TypedTranslation<{ ${types.join(", ")} }>(${JSON.stringify(
|
||||
expr = `new TypedTranslation<{ ${types.join(", ")} }>(${JSON.stringify(
|
||||
value
|
||||
)}, "core:${path.join(".")}.${key}")`
|
||||
}
|
||||
if (shortNotation) {
|
||||
values.push(`${spaces} ${key}: ${expr}`)
|
||||
|
||||
values.push(`${spaces}get ${key}() { ${expr} }`)
|
||||
} else {
|
||||
values.push(`${spaces}get ${key}() { return ${expr} }`)
|
||||
}
|
||||
} else {
|
||||
values.push(
|
||||
spaces + key + ": " + transformTranslation(value, [...path, key], languageWhitelist)
|
||||
|
|
@ -469,54 +451,11 @@ function formatFile(path) {
|
|||
writeFileSync(path, JSON.stringify(contents, null, " ") + (endsWithNewline ? "\n" : ""))
|
||||
}
|
||||
|
||||
/**
|
||||
* Generates the big compiledTranslations file
|
||||
*/
|
||||
function genTranslations() {
|
||||
if (!fs.existsSync("./src/assets/generated/")) {
|
||||
fs.mkdirSync("./src/assets/generated/")
|
||||
}
|
||||
const translations = JSON.parse(
|
||||
fs.readFileSync("./src/assets/generated/translations.json", "utf-8")
|
||||
)
|
||||
const transformed = transformTranslation(translations)
|
||||
|
||||
let module = `import {Translation, TypedTranslation} from "../../UI/i18n/Translation"\n\nexport default class CompiledTranslations {\n\n`
|
||||
module += " public static t = " + transformed
|
||||
module += "\n }"
|
||||
|
||||
fs.writeFileSync("./src/assets/generated/CompiledTranslations.ts", module)
|
||||
}
|
||||
|
||||
/**
|
||||
* Reads 'lang/*.json', writes them into to 'assets/generated/translations.json'.
|
||||
* This is only for the core translations
|
||||
*/
|
||||
function compileTranslationsFromWeblate() {
|
||||
const translations = ScriptUtils.readDirRecSync("./langs", 1).filter(
|
||||
(path) => path.indexOf(".json") > 0
|
||||
)
|
||||
|
||||
const allTranslations = new TranslationPart()
|
||||
|
||||
allTranslations.validateStrict()
|
||||
|
||||
for (const translationFile of translations) {
|
||||
try {
|
||||
const contents = JSON.parse(readFileSync(translationFile, "utf-8"))
|
||||
let language = translationFile.substring(translationFile.lastIndexOf("/") + 1)
|
||||
language = language.substring(0, language.length - 5)
|
||||
allTranslations.add(language, contents)
|
||||
} catch (e) {
|
||||
throw "Could not read file " + translationFile + " due to " + e
|
||||
}
|
||||
}
|
||||
|
||||
writeFileSync(
|
||||
"./src/assets/generated/translations.json",
|
||||
JSON.stringify(JSON.parse(allTranslations.toJson()), null, " ")
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Get all the strings out of the layers; writes them onto the weblate paths
|
||||
|
|
@ -608,7 +547,7 @@ function MergeTranslation(source: any, target: any, language: string, context: s
|
|||
if (targetV[language] !== undefined && targetV[language] !== sourceV) {
|
||||
was = " (overwritten " + targetV[language] + ")"
|
||||
}
|
||||
console.log(" + ", context + "." + language, "-->", sourceV, was)
|
||||
// console.log(" + ", context + "." + language, "-->", sourceV, was)
|
||||
continue
|
||||
}
|
||||
if (typeof sourceV === "object") {
|
||||
|
|
@ -697,7 +636,7 @@ function removeNonEnglishTranslations(object: any) {
|
|||
leaf["en"] = en
|
||||
},
|
||||
(possibleLeaf) =>
|
||||
possibleLeaf !== null && typeof possibleLeaf === "object" && isTranslation(possibleLeaf)
|
||||
possibleLeaf !== null && typeof possibleLeaf === "object" && GenerateTranslations.isTranslation(possibleLeaf)
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -732,6 +671,25 @@ class GenerateTranslations extends Script {
|
|||
super("Syncs translations from/to the theme and layer files")
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks that the given object only contains string-values
|
||||
* @param tr
|
||||
*/
|
||||
static isTranslation(tr: Record<string, string | object>): boolean {
|
||||
if (tr["#"] === "no-translations") {
|
||||
return false
|
||||
}
|
||||
if (tr["special"]) {
|
||||
return false
|
||||
}
|
||||
for (const key in tr) {
|
||||
if (typeof tr[key] !== "string") {
|
||||
return false
|
||||
}
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
/**
|
||||
* OUtputs the 'used_languages.json'-file
|
||||
*/
|
||||
|
|
@ -754,22 +712,74 @@ class GenerateTranslations extends Script {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Generates the big compiledTranslations file based on 'translations.json'
|
||||
*/
|
||||
genTranslations(englishOnly?: boolean) {
|
||||
if (!fs.existsSync("./src/assets/generated/")) {
|
||||
fs.mkdirSync("./src/assets/generated/")
|
||||
}
|
||||
const translations = JSON.parse(
|
||||
fs.readFileSync("./src/assets/generated/translations.json", "utf-8")
|
||||
)
|
||||
const transformed = transformTranslation(translations, undefined, englishOnly ? ["en"] : undefined, englishOnly)
|
||||
|
||||
let module = `import {Translation, TypedTranslation} from "../../UI/i18n/Translation"\n\nexport default class CompiledTranslations {\n\n`
|
||||
module += " public static t = " + transformed
|
||||
module += "\n }"
|
||||
|
||||
fs.writeFileSync("./src/assets/generated/CompiledTranslations.ts", module)
|
||||
}
|
||||
|
||||
compileTranslationsFromWeblate(englishOnly: boolean) {
|
||||
const translations = ScriptUtils.readDirRecSync("./langs", 1).filter(
|
||||
(path) => path.indexOf(".json") > 0
|
||||
)
|
||||
|
||||
const allTranslations = new TranslationPart()
|
||||
|
||||
allTranslations.validateStrict()
|
||||
|
||||
for (const translationFile of translations) {
|
||||
try {
|
||||
const contents = JSON.parse(readFileSync(translationFile, "utf-8"))
|
||||
let language = translationFile.substring(translationFile.lastIndexOf("/") + 1)
|
||||
language = language.substring(0, language.length - 5)
|
||||
if (englishOnly && language !== "en") {
|
||||
continue
|
||||
}
|
||||
allTranslations.add(language, contents)
|
||||
} catch (e) {
|
||||
throw "Could not read file " + translationFile + " due to " + e
|
||||
}
|
||||
}
|
||||
|
||||
writeFileSync(
|
||||
"./src/assets/generated/translations.json",
|
||||
JSON.stringify(JSON.parse(allTranslations.toJson()), null, " ")
|
||||
)
|
||||
}
|
||||
|
||||
async main(args: string[]): Promise<void> {
|
||||
if (!existsSync("./langs/themes")) {
|
||||
mkdirSync("./langs/themes")
|
||||
}
|
||||
const themeOverwritesWeblate = args[0] === "--ignore-weblate"
|
||||
const englishOnly = args[0] === "--english-only"
|
||||
if (englishOnly) {
|
||||
console.log("ENGLISH ONLY")
|
||||
}
|
||||
if (!themeOverwritesWeblate) {
|
||||
mergeLayerTranslations()
|
||||
mergeThemeTranslations()
|
||||
compileTranslationsFromWeblate()
|
||||
mergeLayerTranslations(englishOnly)
|
||||
mergeThemeTranslations(englishOnly)
|
||||
this.compileTranslationsFromWeblate(englishOnly)
|
||||
} else {
|
||||
console.log("Ignore weblate")
|
||||
}
|
||||
|
||||
this.detectUsedLanguages()
|
||||
genTranslations()
|
||||
this.genTranslations(englishOnly)
|
||||
{
|
||||
const allTranslationFiles = ScriptUtils.readDirRecSync("langs").filter((path) =>
|
||||
path.endsWith(".json")
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<script lang="ts">
|
||||
import { ImmutableStore, Store } from "../../Logic/UIEventSource"
|
||||
import Icon from "../Map/Icon.svelte"
|
||||
import { Utils } from "../../Utils"
|
||||
|
||||
export let text: Store<string>
|
||||
export let href: Store<string>
|
||||
|
|
@ -13,7 +14,7 @@
|
|||
</script>
|
||||
|
||||
<a
|
||||
href={$href}
|
||||
href={Utils.prepareHref($href)}
|
||||
aria-label={$ariaLabel}
|
||||
title={$ariaLabel}
|
||||
target={$newTab ? "_blank" : undefined}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
<script lang="ts">
|
||||
import { Utils } from "../../Utils"
|
||||
|
||||
export let text: string
|
||||
export let href: string
|
||||
|
||||
|
||||
export let classnames: string = undefined
|
||||
export let download: string = undefined
|
||||
export let ariaLabel: string = undefined
|
||||
|
|
@ -9,7 +13,7 @@
|
|||
</script>
|
||||
|
||||
<a
|
||||
{href}
|
||||
href={Utils.prepareHref(href)}
|
||||
aria-label={ariaLabel}
|
||||
title={ariaLabel}
|
||||
target={newTab ? "_blank" : undefined}
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@
|
|||
import AccordionSingle from "../Flowbite/AccordionSingle.svelte"
|
||||
import GlobeAlt from "@babeard/svelte-heroicons/mini/GlobeAlt"
|
||||
import { ComparisonState } from "./ComparisonState"
|
||||
import LoginToggle from "../Base/LoginToggle.svelte"
|
||||
|
||||
export let externalData: Store<
|
||||
| { success: { content: Record<string, string> } }
|
||||
|
|
@ -45,6 +46,8 @@
|
|||
let enableLogin = state.featureSwitches.featureSwitchEnableLogin
|
||||
</script>
|
||||
|
||||
<LoginToggle {state} silentFail>
|
||||
|
||||
{#if !$sourceUrl || !$enableLogin}
|
||||
<!-- empty block -->
|
||||
{:else if $externalData === undefined}
|
||||
|
|
@ -77,3 +80,4 @@
|
|||
/>
|
||||
</AccordionSingle>
|
||||
{/if}
|
||||
</LoginToggle>
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
import type { ProvidedImage } from "../../Logic/ImageProviders/ImageProvider"
|
||||
import { Mapillary } from "../../Logic/ImageProviders/Mapillary"
|
||||
import { UIEventSource } from "../../Logic/UIEventSource"
|
||||
import { MagnifyingGlassPlusIcon } from "@babeard/svelte-heroicons/outline"
|
||||
|
||||
export let image: Partial<ProvidedImage>
|
||||
let fallbackImage: string = undefined
|
||||
|
|
@ -16,13 +17,18 @@
|
|||
let imgEl: HTMLImageElement
|
||||
export let imgClass: string = undefined
|
||||
export let previewedImage: UIEventSource<ProvidedImage> = undefined
|
||||
export let attributionFormat: "minimal" | "medium" | "large" = "medium"
|
||||
let canZoom = previewedImage !== undefined // We check if there is a SOURCE, not if there is data in it!
|
||||
let loaded = false
|
||||
</script>
|
||||
|
||||
<div class="relative shrink-0">
|
||||
<div class="relative w-fit">
|
||||
<img
|
||||
bind:this={imgEl}
|
||||
on:load={() => loaded = true}
|
||||
class={imgClass ?? ""}
|
||||
class:cursor-pointer={previewedImage !== undefined}
|
||||
class:cursor-zoom-in={previewedImage !== undefined}
|
||||
on:click={() => {
|
||||
previewedImage?.setData(image)
|
||||
}}
|
||||
|
|
@ -34,7 +40,14 @@
|
|||
src={image.url}
|
||||
/>
|
||||
|
||||
{#if canZoom && loaded}
|
||||
<div class="absolute right-0 top-0 bg-black-transparent rounded-bl-full">
|
||||
<MagnifyingGlassPlusIcon class="w-8 h-8 pl-3 pb-3 cursor-zoom-in" color="white" />
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
</div>
|
||||
<div class="absolute bottom-0 left-0">
|
||||
<ImageAttribution {image} />
|
||||
<ImageAttribution {image} {attributionFormat} />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,15 @@
|
|||
import { Store, UIEventSource } from "../../Logic/UIEventSource"
|
||||
import ToSvelte from "../Base/ToSvelte.svelte"
|
||||
import { EyeIcon } from "@rgossiaux/svelte-heroicons/solid"
|
||||
import Tr from "../Base/Tr.svelte"
|
||||
import Translations from "../i18n/Translations"
|
||||
|
||||
/**
|
||||
* A small element showing the attribution of a single image
|
||||
*/
|
||||
export let image: Partial<ProvidedImage> & { id: string; url: string }
|
||||
export let attributionFormat: "minimal" | "medium" | "large" = "medium"
|
||||
|
||||
let license: Store<LicenseInfo> = UIEventSource.FromPromise(
|
||||
image.provider?.DownloadAttribution(image)
|
||||
)
|
||||
|
|
@ -16,14 +20,15 @@
|
|||
</script>
|
||||
|
||||
{#if $license !== undefined}
|
||||
<div class="no-images flex items-center rounded-lg bg-black p-0.5 pl-3 pr-3 text-sm text-white">
|
||||
<div class="no-images flex items-center rounded-lg bg-black-transparent p-0.5 px-3 text-sm text-white">
|
||||
{#if icon !== undefined}
|
||||
<div class="mr-2 h-6 w-6">
|
||||
<ToSvelte construct={icon} />
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="flex flex-col">
|
||||
<div class="flex gap-x-2" class:flex-col={attributionFormat !== "minimal"}>
|
||||
{#if attributionFormat !== "minimal" }
|
||||
{#if $license.title}
|
||||
{#if $license.informationLocation}
|
||||
<a href={$license.informationLocation.href} target="_blank" rel="noopener nofollower">
|
||||
|
|
@ -33,33 +38,41 @@
|
|||
$license.title
|
||||
{/if}
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
{#if $license.artist}
|
||||
{#if attributionFormat === "large"}
|
||||
<Tr t={Translations.t.general.attribution.madeBy.Subs({author: $license.artist})} />
|
||||
{:else}
|
||||
<div class="font-bold">
|
||||
{@html $license.artist}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="flex w-full justify-between gap-x-1">
|
||||
{#if $license.license !== undefined || $license.licenseShortName !== undefined}
|
||||
<div>
|
||||
{$license?.license ?? $license?.licenseShortName}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if $license.views}
|
||||
<div class="flex justify-around self-center">
|
||||
<EyeIcon class="h-4 w-4 pr-1" />
|
||||
{$license.views}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
{#if $license.date}
|
||||
<div>
|
||||
{$license.date.toLocaleDateString()}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if attributionFormat !== "minimal"}
|
||||
<div class="flex w-full justify-between gap-x-1">
|
||||
{#if ($license.license !== undefined || $license.licenseShortName !== undefined)}
|
||||
<div>
|
||||
{$license?.license ?? $license?.licenseShortName}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if $license.views}
|
||||
<div class="flex justify-around self-center text-xs">
|
||||
<EyeIcon class="h-4 w-4 pr-1" />
|
||||
{$license.views}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -38,9 +38,9 @@
|
|||
class="pointer-events-none absolute bottom-0 left-0 flex w-full flex-wrap items-end justify-between"
|
||||
>
|
||||
<div
|
||||
class="pointer-events-auto m-1 w-fit opacity-50 transition-colors duration-200 hover:opacity-100"
|
||||
class="pointer-events-auto m-1 w-fit transition-colors duration-200"
|
||||
>
|
||||
<ImageAttribution {image} />
|
||||
<ImageAttribution {image} attributionFormat="large"/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
|
|
|
|||
|
|
@ -14,6 +14,8 @@
|
|||
import AttributedImage from "./AttributedImage.svelte"
|
||||
import SpecialTranslation from "../Popup/TagRendering/SpecialTranslation.svelte"
|
||||
import LoginToggle from "../Base/LoginToggle.svelte"
|
||||
import ImagePreview from "./ImagePreview.svelte"
|
||||
import FloatOver from "../Base/FloatOver.svelte"
|
||||
|
||||
export let tags: UIEventSource<OsmTags>
|
||||
export let state: SpecialVisualizationState
|
||||
|
|
@ -31,7 +33,7 @@
|
|||
key: undefined,
|
||||
provider: AllImageProviders.byName(image.provider),
|
||||
date: new Date(image.date),
|
||||
id: Object.values(image.osmTags)[0],
|
||||
id: Object.values(image.osmTags)[0]
|
||||
}
|
||||
|
||||
async function applyLink(isLinked: boolean) {
|
||||
|
|
@ -42,7 +44,7 @@
|
|||
if (isLinked) {
|
||||
const action = new LinkImageAction(currentTags.id, key, url, tags, {
|
||||
theme: tags.data._orig_theme ?? state.layout.id,
|
||||
changeType: "link-image",
|
||||
changeType: "link-image"
|
||||
})
|
||||
await state.changes.applyAction(action)
|
||||
} else {
|
||||
|
|
@ -51,24 +53,26 @@
|
|||
if (v === url) {
|
||||
const action = new ChangeTagAction(currentTags.id, new Tag(k, ""), currentTags, {
|
||||
theme: tags.data._orig_theme ?? state.layout.id,
|
||||
changeType: "remove-image",
|
||||
changeType: "remove-image"
|
||||
})
|
||||
state.changes.applyAction(action)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
isLinked.addCallback((isLinked) => applyLink(isLinked))
|
||||
|
||||
</script>
|
||||
|
||||
<div class="flex w-fit shrink-0 flex-col">
|
||||
<div class="cursor-zoom-in" on:click={() => state.previewedImage.setData(providedImage)}>
|
||||
<div class="flex w-fit shrink-0 flex-col rounded-lg overflow-hidden" class:border-interactive={$isLinked}
|
||||
style="border-width: 2px">
|
||||
<AttributedImage
|
||||
image={providedImage}
|
||||
imgClass="max-h-64 w-auto"
|
||||
previewedImage={state.previewedImage}
|
||||
attributionFormat="minimal"
|
||||
/>
|
||||
</div>
|
||||
<LoginToggle {state} silentFail={true}>
|
||||
{#if linkable}
|
||||
<label>
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@
|
|||
<Tr t={Translations.t.image.nearby.noNearbyImages} cls="alert" />
|
||||
{/if}
|
||||
{:else}
|
||||
<div class="flex w-full space-x-1 overflow-x-auto" style="scroll-snap-type: x proximity">
|
||||
<div class="flex w-full space-x-4 overflow-x-auto" style="scroll-snap-type: x proximity">
|
||||
{#each $result as image (image.pictureUrl)}
|
||||
<span class="w-fit shrink-0" style="scroll-snap-align: start">
|
||||
<LinkableImage {tags} {image} {state} {feature} {layer} {linkable} />
|
||||
|
|
|
|||
|
|
@ -352,6 +352,7 @@
|
|||
{/if}
|
||||
</legend>
|
||||
|
||||
<!-- Search menu -->
|
||||
{#if config.mappings?.length >= 8 || hideMappingsUnlessSearchedFor}
|
||||
<div class="sticky flex w-full" aria-hidden="true">
|
||||
<Search class="h-6 w-6" />
|
||||
|
|
@ -369,6 +370,7 @@
|
|||
{/if}
|
||||
{/if}
|
||||
|
||||
<!-- Actual options-->
|
||||
{#if config?.freeform?.key && !(config?.mappings?.filter((m) => m.hideInAnswer != true)?.length > 0)}
|
||||
<!-- There are no options to choose from, simply show the input element: fill out the text field -->
|
||||
<FreeformInput
|
||||
|
|
@ -384,7 +386,7 @@
|
|||
/>
|
||||
{:else if config.mappings !== undefined && !config.multiAnswer}
|
||||
<!-- Simple radiobuttons as mapping -->
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-col no-bold">
|
||||
{#each config.mappings as mapping, i (mapping.then)}
|
||||
<!-- Even though we have a list of 'mappings' already, we still iterate over the list as to keep the original indices-->
|
||||
<TagRenderingMappingInput
|
||||
|
|
@ -432,7 +434,7 @@
|
|||
</div>
|
||||
{:else if config.mappings !== undefined && config.multiAnswer}
|
||||
<!-- Multiple answers can be chosen: checkboxes -->
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-col no-bold">
|
||||
{#each config.mappings as mapping, i (mapping.then)}
|
||||
<TagRenderingMappingInput
|
||||
{mapping}
|
||||
|
|
@ -475,6 +477,8 @@
|
|||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Save and cancel buttons, in a logintoggle -->
|
||||
<LoginToggle {state}>
|
||||
<Loading slot="loading" />
|
||||
<SubtleButton slot="not-logged-in" on:click={() => state?.osmConnection?.AttemptLogin()}>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
|
|
@ -3,7 +3,6 @@ import { Translation, TypedTranslation } from "./Translation"
|
|||
import BaseUIElement from "../BaseUIElement"
|
||||
import CompiledTranslations from "../../assets/generated/CompiledTranslations"
|
||||
import LanguageUtils from "../../Utils/LanguageUtils"
|
||||
import { ClickableToggle } from "../Input/Toggle"
|
||||
import { Store } from "../../Logic/UIEventSource"
|
||||
import Locale from "./Locale"
|
||||
import { Utils } from "../../Utils"
|
||||
|
|
|
|||
44
src/Utils.ts
44
src/Utils.ts
|
|
@ -960,11 +960,15 @@ In the case that MapComplete is pointed to the testing grounds, the edit will be
|
|||
if (!result["error"]) {
|
||||
return result
|
||||
}
|
||||
console.log(result)
|
||||
if(result["error"]?.statuscode === 410){
|
||||
const error = result.error
|
||||
if (error.statuscode === 410) {
|
||||
// Gone permanently is not recoverable
|
||||
return result
|
||||
}
|
||||
if (error.statuscode === 429 || error.statuscode === 509) {
|
||||
// rate limited
|
||||
return result
|
||||
}
|
||||
console.log(
|
||||
`Request to ${url} failed, Trying again in a moment. Attempt ${
|
||||
i + 1
|
||||
|
|
@ -1774,7 +1778,8 @@ In the case that MapComplete is pointed to the testing grounds, the edit will be
|
|||
|
||||
}
|
||||
|
||||
static NoNullInplace<T>(items: T[]): T[] {
|
||||
|
||||
public static NoNullInplace<T>(items: T[]): T[] {
|
||||
for (let i = items.length - 1; i >= 0; i--) {
|
||||
if (items[i] === null || items[i] === undefined) {
|
||||
items.splice(i, 1)
|
||||
|
|
@ -1783,6 +1788,27 @@ In the case that MapComplete is pointed to the testing grounds, the edit will be
|
|||
return items
|
||||
}
|
||||
|
||||
/**
|
||||
* Removes or rewrites some characters in links, as some blink/chromium based browsers are picky about them
|
||||
*
|
||||
* Utils.prepareHref("tel:+32 123 456") // => "tel:+32123456"
|
||||
* Utils.prepareHref("https://osm.org/user/User Name") // => "https://osm.org/user/User%20Name"
|
||||
*/
|
||||
static prepareHref(href: string): string {
|
||||
if (href.startsWith("tel:")) {
|
||||
// Telephone numbers are not allowed to contain spaces in chromium-based browsers
|
||||
href = "tel:" + href.replaceAll(/[^+0-9]/g, "")
|
||||
}
|
||||
|
||||
/* Chromium based browsers eat the spaces */
|
||||
href = href.replaceAll(
|
||||
/ /g,
|
||||
"%20"
|
||||
)
|
||||
return href
|
||||
}
|
||||
|
||||
|
||||
private static emojiRegex = /[\p{Extended_Pictographic}🛰️]/u
|
||||
|
||||
/**
|
||||
|
|
@ -1793,7 +1819,15 @@ In the case that MapComplete is pointed to the testing grounds, the edit will be
|
|||
* Utils.isEmoji("🍕") // => true
|
||||
*/
|
||||
public static isEmoji(string: string) {
|
||||
return Utils.emojiRegex.test(string) ||
|
||||
/[🇦-🇿]{2}/u.test(string) // flags, see https://stackoverflow.com/questions/53360006/detect-with-regex-if-emoji-is-country-flag
|
||||
return Utils.emojiRegex.test(string) || Utils.isEmojiFlag(string)
|
||||
}
|
||||
|
||||
/**
|
||||
* Utils.isEmoji("🍕") // => false
|
||||
* Utils.isEmojiFlag("🇧🇪") // => true
|
||||
*/
|
||||
public static isEmojiFlag(string: string) {
|
||||
return /[🇦-🇿]{2}/u.test(string) // flags, see https://stackoverflow.com/questions/53360006/detect-with-regex-if-emoji-is-country-flag
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -568,6 +568,10 @@ a:hover {
|
|||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
.no-bold b {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/************************* MISC ELEMENTS *************************/
|
||||
|
||||
.selected svg:not(.noselect *) path.selectable {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue