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

Add icons and titles to studio accordeons

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-06-26 11:57:18 +02:00
parent c66e836cac
commit 5628e66dce
30 changed files with 197 additions and 128 deletions
Download patch file Download diff file Expand all files Collapse all files

6
Docs/Schemas/LayerConfigJson.schema.json
View file

@ -204,7 +204,7 @@
"type": "boolean" "type": "boolean"
}, },
"presets": { "presets": {
"description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets", "description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets\ntitle: value.title",
"type": "array", "type": "array",
"items": { "items": {
"type": "object", "type": "object",
@ -766,7 +766,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -957,7 +957,7 @@
} }
}, },
"marker": { "marker": {
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.", "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.\nicon: value\ntitle: value.icon",
"type": "array", "type": "array",
"items": { "items": {
"$ref": "#/definitions/IconConfigJson" "$ref": "#/definitions/IconConfigJson"

6
Docs/Schemas/LayerConfigJsonJSC.ts
View file

@ -204,7 +204,7 @@ export default {
"type": "boolean" "type": "boolean"
}, },
"presets": { "presets": {
"description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets", "description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets\ntitle: value.title",
"type": "array", "type": "array",
"items": { "items": {
"type": "object", "type": "object",
@ -759,7 +759,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -946,7 +946,7 @@ export default {
} }
}, },
"marker": { "marker": {
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.", "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.\nicon: value\ntitle: value.icon",
"type": "array", "type": "array",
"items": { "items": {
"$ref": "#/definitions/IconConfigJson" "$ref": "#/definitions/IconConfigJson"

8
Docs/Schemas/LayoutConfigJson.schema.json
View file

@ -657,7 +657,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -848,7 +848,7 @@
} }
}, },
"marker": { "marker": {
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.", "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.\nicon: value\ntitle: value.icon",
"type": "array", "type": "array",
"items": { "items": {
"$ref": "#/definitions/IconConfigJson" "$ref": "#/definitions/IconConfigJson"
@ -2099,7 +2099,7 @@
"type": "boolean" "type": "boolean"
}, },
"presets": { "presets": {
"description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets", "description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets\ntitle: value.title",
"type": "array", "type": "array",
"items": { "items": {
"type": "object", "type": "object",
@ -2522,7 +2522,7 @@
"type": "boolean" "type": "boolean"
}, },
"presets": { "presets": {
"description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets", "description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets\ntitle: value.title",
"type": "array", "type": "array",
"items": { "items": {
"type": "object", "type": "object",

8
Docs/Schemas/LayoutConfigJsonJSC.ts
View file

@ -650,7 +650,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -837,7 +837,7 @@ export default {
} }
}, },
"marker": { "marker": {
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.", "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.\nicon: value\ntitle: value.icon",
"type": "array", "type": "array",
"items": { "items": {
"$ref": "#/definitions/IconConfigJson" "$ref": "#/definitions/IconConfigJson"
@ -2077,7 +2077,7 @@ export default {
"type": "boolean" "type": "boolean"
}, },
"presets": { "presets": {
"description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets", "description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets\ntitle: value.title",
"type": "array", "type": "array",
"items": { "items": {
"type": "object", "type": "object",
@ -2499,7 +2499,7 @@ export default {
"type": "boolean" "type": "boolean"
}, },
"presets": { "presets": {
"description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets", "description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets\ntitle: value.title",
"type": "array", "type": "array",
"items": { "items": {
"type": "object", "type": "object",

2
Docs/Schemas/LineRenderingConfigJson.schema.json
View file

@ -438,7 +438,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/LineRenderingConfigJsonJSC.ts
View file

@ -431,7 +431,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/MappingConfigJson.schema.json
View file

@ -465,7 +465,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/MappingConfigJsonJSC.ts
View file

@ -458,7 +458,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

4
Docs/Schemas/PointRenderingConfigJson.schema.json
View file

@ -10,7 +10,7 @@
} }
}, },
"marker": { "marker": {
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.", "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.\nicon: value\ntitle: value.icon",
"type": "array", "type": "array",
"items": { "items": {
"$ref": "#/definitions/IconConfigJson" "$ref": "#/definitions/IconConfigJson"
@ -512,7 +512,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

4
Docs/Schemas/PointRenderingConfigJsonJSC.ts
View file

@ -10,7 +10,7 @@ export default {
} }
}, },
"marker": { "marker": {
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.", "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\n\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\n\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.\nicon: value\ntitle: value.icon",
"type": "array", "type": "array",
"items": { "items": {
"$ref": "#/definitions/IconConfigJson" "$ref": "#/definitions/IconConfigJson"
@ -505,7 +505,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/QuestionableTagRenderingConfigJson.schema.json
View file

@ -568,7 +568,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/QuestionableTagRenderingConfigJsonJSC.ts
View file

@ -561,7 +561,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/RewritableConfigJson.schema.json
View file

@ -392,7 +392,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/RewritableConfigJsonJSC.ts
View file

@ -385,7 +385,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/TagRenderingConfigJson.schema.json
View file

@ -123,7 +123,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

2
Docs/Schemas/TagRenderingConfigJsonJSC.ts
View file

@ -123,7 +123,7 @@ export default {
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",

6
Docs/Studio/TagRenderingIntro.md
View file

@ -15,7 +15,7 @@ In OpenStreetMap, this is encoded with the tag `lit=yes` or `lit=no`. We might w
This is what this will look like in the interface: This is what this will look like in the interface:
<img class="w-1/2" src="../../public/assets/docs/PredefinedOption.png"/> <img class="h-fit" src="../../public/assets/docs/PredefinedOption.png"/>
# Substituting attributes # Substituting attributes
@ -52,8 +52,8 @@ A text field and predefined options can be combined. The contributor can then ch
One can set a question to allow multiple answers. This works with predefined options or a freeform text field. One can set a question to allow multiple answers. This works with predefined options or a freeform text field.
<img class="w-1/2" src="../../public/assets/docs/QuestionMulti.png"/> <img class="w-1/2 h-fit" src="../../public/assets/docs/QuestionMulti.png"/>
Note that these will be rendered as a list: Note that these will be rendered as a list:
<img class="w-1/2" src="../../public/assets/docs/RenderMulti.png"/> <img class="w-1/2 h-fit" src="../../public/assets/docs/RenderMulti.png"/>

1
scripts/fixSchemas.ts
View file

@ -24,6 +24,7 @@ const metainfo = {
suggestions: suggestions:
'a javascript expression generating mappings; executed in an environment which has access to `layers: Map<string, LayerConfig>` and `themes: Map<string, ThemeConfig>`. Should return an array of type `{if: \'value=*\', then: string}[]`. Example: `return Array.from(layers.keys()).map(key => ({if: "value="+key, then: key+" - "+layers.get(key).description}))`. This code is executed at compile time, so no CSP is needed ', 'a javascript expression generating mappings; executed in an environment which has access to `layers: Map<string, LayerConfig>` and `themes: Map<string, ThemeConfig>`. Should return an array of type `{if: \'value=*\', then: string}[]`. Example: `return Array.from(layers.keys()).map(key => ({if: "value="+key, then: key+" - "+layers.get(key).description}))`. This code is executed at compile time, so no CSP is needed ',
title: "a title that is given to a MultiType", title: "a title that is given to a MultiType",
icon: "The icon that should be shown, a function body from a function which receives one argument, namely `value`. Value is the entire object when used in a list",
multianswer: "set to 'true' if multiple options should be selectable", multianswer: "set to 'true' if multiple options should be selectable",
} }

1
src/Models/ThemeConfig/Json/LayerConfigJson.ts
View file

@ -311,6 +311,7 @@ export interface LayerConfigJson {
*</div> *</div>
* *
* group: presets * group: presets
* title: value.title
*/ */
presets?: { presets?: {
/** /**

2
src/Models/ThemeConfig/Json/PointRenderingConfigJson.ts
View file

@ -52,6 +52,8 @@ export default interface PointRenderingConfigJson {
* - ... * - ...
* *
* As a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon. * As a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon.
* icon: value
* title: value.icon
*/ */
marker?: IconConfigJson[] marker?: IconConfigJson[]

6
src/UI/Studio/QuestionPreview.svelte
View file

@ -65,10 +65,8 @@
</script> </script>
<div class="flex"> <div class="flex">
<div class="interactive border-interactive m-4 flex w-full flex-col"> <div class="m-4 flex w-full flex-col">
{#if $id}
TagRendering {$id}
{/if}
<NextButton clss="primary" on:click={() => state.highlightedItem.setData({ path, schema })}> <NextButton clss="primary" on:click={() => state.highlightedItem.setData({ path, schema })}>
{#if schema.hints.question} {#if schema.hints.question}
{schema.hints.question} {schema.hints.question}

2
src/UI/Studio/Region.svelte
View file

@ -28,7 +28,7 @@
{:else if title} {:else if title}
<AccordionSingle> <AccordionSingle>
<div slot="header">{title}</div> <div slot="header">{title}</div>
<div class="flex w-full flex-col gap-y-1 border border-black pl-2"> <div class="flex w-full flex-col gap-y-1 pl-2">
<slot name="description" /> <slot name="description" />
{#each configsFiltered as config} {#each configsFiltered as config}
<SchemaBasedInput {state} path={config.path} schema={config} /> <SchemaBasedInput {state} path={config.path} schema={config} />

45
src/UI/Studio/SchemaBasedArray.svelte
View file

@ -10,11 +10,15 @@
import ShowConversionMessage from "./ShowConversionMessage.svelte" import ShowConversionMessage from "./ShowConversionMessage.svelte"
import Markdown from "../Base/Markdown.svelte" import Markdown from "../Base/Markdown.svelte"
import AccordionSingle from "../Flowbite/AccordionSingle.svelte" import AccordionSingle from "../Flowbite/AccordionSingle.svelte"
import Icon from "../Map/Icon.svelte"
import Tr from "../Base/Tr.svelte"
import Translations from "../i18n/Translations"
export let state: EditLayerState export let state: EditLayerState
export let schema: ConfigMeta export let schema: ConfigMeta
let title = schema.path.at(-1) let title = schema.path.at(-1)
console.log(">>>", schema)
let singular = title let singular = title
if (title?.endsWith("s")) { if (title?.endsWith("s")) {
singular = title.slice(0, title.length - 1) singular = title.slice(0, title.length - 1)
@ -92,6 +96,28 @@
currentValue.data.splice(target, 0, x) currentValue.data.splice(target, 0, x)
currentValue.ping() currentValue.ping()
} }
function genTitle(value: any, singular: string, i: number) {
if (schema.hints.title) {
return Function("value", "return " + schema.hints.title)(value)
}
return `${singular} ${i}`
}
let genIconF: (x: any) => ({ icon: string, color: string }) = <any>Function("value", "return " + schema.hints.icon)
console.log("Icon lambda is", schema.hints.icon, path, genIconF("test"))
function genIcon(value: any): string {
return genIconF(value)?.icon
}
function genColor(value: any): string {
if (!schema.hints.icon) {
return undefined
}
return genIconF(value)?.color
}
</script> </script>
<div class="pl-2"> <div class="pl-2">
@ -126,11 +152,22 @@
{/each} {/each}
{:else} {:else}
{#each $currentValue as value, i} {#each $currentValue as value, i}
<AccordionSingle> <AccordionSingle expanded={false}>
<span slot="header"> <span slot="header">
{#if !isTagRenderingBlock} {#if !isTagRenderingBlock}
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<h3 class="m-0">{singular} {i}</h3> <h3 class="m-0 flex">
{#if schema.hints.icon}
<Icon clss="w-6 h-6" icon={genIcon(value)} color={genColor(value)} />
{/if}
{singular} {i}
{#if schema.hints.title}
<div class="subtle ml-2">
<Tr t={Translations.T(genTitle(value, singular, i))}/>
</div>
{/if}
</h3>
<button <button
class="h-fit w-fit rounded-full border border-black p-1" class="h-fit w-fit rounded-full border border-black p-1"
on:click={() => { on:click={() => {
@ -140,6 +177,10 @@
<TrashIcon class="h-4 w-4" /> <TrashIcon class="h-4 w-4" />
</button> </button>
</div> </div>
{:else if typeof value === "string"}
Builtin: <b>{value}</b>
{:else}
<Tr cls="font-bold" t={Translations.T(value.question ?? value.render)}/>
{/if} {/if}
</span> </span>
<div class="normal-background p-2"> <div class="normal-background p-2">

3
src/UI/Studio/configMeta.ts
View file

@ -23,7 +23,8 @@ export interface ConfigMeta {
typesdefault?: string typesdefault?: string
suggestions?: [] suggestions?: []
title?: string title?: string
multianswer?: "true" | string multianswer?: "true" | string,
icon?: string
} }
required: boolean required: boolean
description: string description: string

10
src/UI/StudioGUI.svelte
View file

@ -183,18 +183,18 @@
state = "editing_layer" state = "editing_layer"
} }
async function selectStateBasedOnHash() { async function selectStateBasedOnHash(uid: number) {
const hash = Hash.hash.data const hash = Hash.hash.data
if (!hash) { if (!hash) {
return return
} }
console.log("Selecting state based on ", hash) console.log("Selecting state based on ", hash, uid)
const [mode, id, tab] = hash.split("/") const [mode, id, tab] = hash.split("/")
// Not really an event, we just set the 'detail' // Not really an event, we just set the 'detail'
const event = { const event = {
detail: { detail: {
id, id,
owner: uid.data, owner: uid,
}, },
} }
const statePromise: Promise<EditJsonState<any>> = const statePromise: Promise<EditJsonState<any>> =
@ -203,7 +203,9 @@
state.selectedTab.setData(Number(tab)) state.selectedTab.setData(Number(tab))
} }
selectStateBasedOnHash() uid.AsPromise().then(
uid => selectStateBasedOnHash(uid)
)
function backToStudio() { function backToStudio() {
console.log("Back to studio") console.log("Back to studio")

12
src/UI/i18n/Translations.ts
View file

@ -112,21 +112,21 @@ export default class Translations {
} }
} }
const langaugeCounts = {} const languageCounts = {}
for (const translation of tr) { for (const translation of tr) {
for (const language in translation.translations) { for (const language in translation.translations) {
if (langaugeCounts[language] === undefined) { if (languageCounts[language] === undefined) {
langaugeCounts[language] = 1 languageCounts[language] = 1
} else { } else {
langaugeCounts[language]++ languageCounts[language]++
} }
} }
} }
for (const language in langaugeCounts) { for (const language in languageCounts) {
console.log( console.log(
"Total translations in ", "Total translations in ",
language, language,
langaugeCounts[language], languageCounts[language],
"/", "/",
tr.length tr.length
) )

54
src/assets/schemas/layerconfigmeta.json
View file

@ -504,7 +504,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -971,7 +971,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -1525,7 +1525,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -1647,7 +1647,10 @@
"marker" "marker"
], ],
"required": false, "required": false,
"hints": {}, "hints": {
"title": "value.icon",
"icon": "value"
},
"type": "array", "type": "array",
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon." "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon."
}, },
@ -2436,7 +2439,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -2919,7 +2922,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -3138,7 +3141,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -3621,7 +3624,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -3818,7 +3821,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -4301,7 +4304,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -4500,7 +4503,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -4983,7 +4986,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -5183,7 +5186,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -5666,7 +5669,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -5871,7 +5874,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -6354,7 +6357,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -6554,7 +6557,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -7037,7 +7040,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -7237,7 +7240,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -7720,7 +7723,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -7927,7 +7930,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -8414,7 +8417,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -8622,7 +8625,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -9109,7 +9112,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -9976,7 +9979,8 @@
], ],
"required": false, "required": false,
"hints": { "hints": {
"group": "presets" "group": "presets",
"title": "value.title"
}, },
"type": "array", "type": "array",
"description": "<div class='flex'>\n <div>\nPresets for this layer.\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>" "description": "<div class='flex'>\n <div>\nPresets for this layer.\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>"

112
src/assets/schemas/layoutconfigmeta.json
View file

@ -1197,7 +1197,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -1327,7 +1327,7 @@
"type": "boolean" "type": "boolean"
}, },
"presets": { "presets": {
"description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets", "description": "<div class='flex'>\n <div>\nPresets for this layer.\n\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\n\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\n\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>\n\ngroup: presets\ntitle: value.title",
"type": "array", "type": "array",
"items": { "items": {
"type": "object", "type": "object",
@ -2441,7 +2441,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -2924,7 +2924,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -3501,7 +3501,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -3631,7 +3631,10 @@
"marker" "marker"
], ],
"required": false, "required": false,
"hints": {}, "hints": {
"title": "value.icon",
"icon": "value"
},
"type": "array", "type": "array",
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon." "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon."
}, },
@ -4438,7 +4441,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -4937,7 +4940,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -5161,7 +5164,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -5660,7 +5663,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -5862,7 +5865,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -6361,7 +6364,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -6565,7 +6568,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -7064,7 +7067,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -7269,7 +7272,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -7768,7 +7771,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -7978,7 +7981,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -8477,7 +8480,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -8682,7 +8685,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -9181,7 +9184,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -9386,7 +9389,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -9885,7 +9888,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -10097,7 +10100,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -10600,7 +10603,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -10813,7 +10816,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -11316,7 +11319,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -12221,7 +12224,8 @@
], ],
"required": false, "required": false,
"hints": { "hints": {
"group": "presets" "group": "presets",
"title": "value.title"
}, },
"type": "array", "type": "array",
"description": "<div class='flex'>\n <div>\nPresets for this layer.\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>" "description": "<div class='flex'>\n <div>\nPresets for this layer.\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>"
@ -22875,7 +22879,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -23374,7 +23378,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -23974,7 +23978,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -24112,7 +24116,10 @@
"marker" "marker"
], ],
"required": false, "required": false,
"hints": {}, "hints": {
"title": "value.icon",
"icon": "value"
},
"type": "array", "type": "array",
"description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon." "description": "The marker for an element.\nNote that this also defines the icon for this layer (rendered with the overpass-tags) <i>and</i> the icon in the presets.\nThe result of the icon is rendered as follows:\n- The first icon is rendered on the map\n- The second entry is overlayed on top of it\n- ...\nAs a result, on could use a generic icon (`pin`, `circle`, `square`) with a color, then overlay it with a specific icon."
}, },
@ -24937,7 +24944,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -25452,7 +25459,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -25681,7 +25688,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -26196,7 +26203,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -26403,7 +26410,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -26918,7 +26925,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -27127,7 +27134,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -27642,7 +27649,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -27852,7 +27859,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -28367,7 +28374,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -28582,7 +28589,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -29097,7 +29104,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -29307,7 +29314,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -29822,7 +29829,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -30032,7 +30039,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -30547,7 +30554,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -30764,7 +30771,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -31283,7 +31290,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -31501,7 +31508,7 @@
] ]
}, },
"icon": { "icon": {
"description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon", "description": "question: What icon should be added to this mapping?\nifunset: Do not show an extra icon next to the render value\n\nAn icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\n\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`\n\ninline: <img src='{icon}' class=\"w-8 h-8\" /> {icon}\nType: icon",
"anyOf": [ "anyOf": [
{ {
"type": "object", "type": "object",
@ -32020,7 +32027,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [
@ -32963,7 +32970,8 @@
], ],
"required": false, "required": false,
"hints": { "hints": {
"group": "presets" "group": "presets",
"title": "value.title"
}, },
"type": "array", "type": "array",
"description": "<div class='flex'>\n <div>\nPresets for this layer.\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>" "description": "<div class='flex'>\n <div>\nPresets for this layer.\nA preset consists of one or more attributes (tags), a title and optionally a description and optionally example images.\nWhen the contributor wishes to add a point to OpenStreetMap, they'll:\n1. Press the 'add new point'-button\n2. Choose a preset from the list of all presets\n3. Confirm the choice. In this step, the `description` (if set) and `exampleImages` (if given) will be shown\n4. Confirm the location\n5. A new point will be created with the attributes that were defined in the preset\nIf no presets are defined, the button which invites to add a new preset will not be shown.\n</div>\n<video controls autoplay muted src='./Docs/Screenshots/AddNewItemScreencast.webm' class='w-64'/>\n</div>"

2
src/assets/schemas/tagrenderingconfigmeta.json
View file

@ -403,7 +403,7 @@
"type": "string" "type": "string"
} }
], ],
"description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a 'phone'-icon next to the phone number" "description": "An icon supporting this mapping; typically shown pretty small.\nThis can be used to show a e.g. 'phone'-icon next to the phone number\nThis supports patterns, you can e.g. have `close:red;some/other/icon.svg`"
}, },
{ {
"path": [ "path": [

13
src/assets/studio_tagrenderings_intro.json
View file

@ -1 +1,12 @@
{"sections":["# How to work with TagRenderings\n\nThe information box shows various attributes of the selected feature in a human friendly way.\n\nThis is done by a **tagRendering** which converts attributes into text.\n\nThis can be done by using **predefined options** (mappings) or with a **render**-string\n","# Predefined options\n\nA predefined option states that, `if` a certain tag is present, `then` a certain text should be shown.\n\nFor example, a playground may be lit or not.\nIn OpenStreetMap, this is encoded with the tag `lit=yes` or `lit=no`. We might want to show `This playground is lit at night` and `This playground is not lit at night` to users of MapComplete.\n\nThis is what this will look like in the interface:\n\n<img class=\"w-1/2\" src=\"./assets/docs/PredefinedOption.png\"/>\n","# Substituting attributes\n\nIf none of the predefined options match, the string given in the `render`-field is used (under the question _\"What text should be rendered?\"_).\n\nA special property about all shown texts is that, **if the name of a key appears between braces, this will be replaced by the corresponding value**.\n\nFor example, if the object has tags `min_age=3` and the text to display is `Accessible to kids older than {min_age} years`, then this will be displayed to the user as **Accessible to kids older than 3 years**\n\nNote that this also works withing predifined options\n","# Special values\n\nSpecial components can be summoned by calling them. For example, the relevant wikipedia will be displayed by entering the text `{wikipedia()}`. A table with opening hours is displayed with `{opening_hours()}`. For a full reference, [see the documentation](https://github.com/pietervdvn/MapComplete/blob/master/Docs/SpecialRenderings.md).\n","# Requesting data with predefined options\n\nThese renderings can be turned into a way to contribute data easily. If a **question** is provided, then these renderings will be asked if unknown or gain the pencil to make changes. \n\nA predefined option will show up as an option that can be picked.\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionPredefinedOptions.png\"/>\n","# Requesting data with an input field\n\nIt is also possible to have a text field. For this, the **key** to write into must be given (_What is the name of the attribute that should be written to?_), in this case `max_age`.\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionTextField.png\"/>\n","# Combining predefined options and freeform text\n\nA text field and predefined options can be combined. The contributor can then choose between a predefined option or filling out something.\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionCombined.png\"/>\n","# Selecting multiple values\n\nOne can set a question to allow multiple answers. This works with predefined options or a freeform text field.\n\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionMulti.png\"/>\n\nNote that these will be rendered as a list:\n\n<img class=\"w-1/2\" src=\"./assets/docs/RenderMulti.png\"/>\n"]} {
"sections": [
"# How to work with TagRenderings\n\nThe information box shows various attributes of the selected feature in a human friendly way.\n\nThis is done by a **tagRendering** which converts attributes into text.\n\nThis can be done by using **predefined options** (mappings) or with a **render**-string\n",
"# Predefined options\n\nA predefined option states that, `if` a certain tag is present, `then` a certain text should be shown.\n\nFor example, a playground may be lit or not.\nIn OpenStreetMap, this is encoded with the tag `lit=yes` or `lit=no`. We might want to show `This playground is lit at night` and `This playground is not lit at night` to users of MapComplete.\n\nThis is what this will look like in the interface:\n\n<img class=\"w-1/2\" src=\"./assets/docs/PredefinedOption.png\"/>\n",
"# Substituting attributes\n\nIf none of the predefined options match, the string given in the `render`-field is used (under the question _\"What text should be rendered?\"_).\n\nA special property about all shown texts is that, **if the name of a key appears between braces, this will be replaced by the corresponding value**.\n\nFor example, if the object has tags `min_age=3` and the text to display is `Accessible to kids older than {min_age} years`, then this will be displayed to the user as **Accessible to kids older than 3 years**\n\nNote that this also works withing predifined options\n",
"# Special values\n\nSpecial components can be summoned by calling them. For example, the relevant wikipedia will be displayed by entering the text `{wikipedia()}`. A table with opening hours is displayed with `{opening_hours()}`. For a full reference, [see the documentation](https://github.com/pietervdvn/MapComplete/blob/master/Docs/SpecialRenderings.md).\n",
"# Requesting data with predefined options\n\nThese renderings can be turned into a way to contribute data easily. If a **question** is provided, then these renderings will be asked if unknown or gain the pencil to make changes. \n\nA predefined option will show up as an option that can be picked.\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionPredefinedOptions.png\"/>\n",
"# Requesting data with an input field\n\nIt is also possible to have a text field. For this, the **key** to write into must be given (_What is the name of the attribute that should be written to?_), in this case `max_age`.\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionTextField.png\"/>\n",
"# Combining predefined options and freeform text\n\nA text field and predefined options can be combined. The contributor can then choose between a predefined option or filling out something.\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionCombined.png\"/>\n",
"# Selecting multiple values\n\nOne can set a question to allow multiple answers. This works with predefined options or a freeform text field.\n\n<img class=\"w-1/2\" src=\"./assets/docs/QuestionMulti.png\"/>\n\nNote that these will be rendered as a list:\n\n<img class=\"w-1/2\" src=\"./assets/docs/RenderMulti.png\"/>\n"
]
}