forked from MapComplete/MapComplete
Add attribution for plantnet, styling tweaks
This commit is contained in:
pietervdvn
parent
b1ea986515
commit
d713e00671
6 changed files with 91 additions and 32 deletions
|
|
@ -9,6 +9,8 @@ import Combine from "../Base/Combine";
|
|||
import Title from "../Base/Title";
|
||||
import WikipediaBox from "../Wikipedia/WikipediaBox";
|
||||
import Translations from "../i18n/Translations";
|
||||
import List from "../Base/List";
|
||||
import Svg from "../../Svg";
|
||||
|
||||
|
||||
export default class PlantNetSpeciesSearch extends VariableUiElement {
|
||||
|
|
@ -28,8 +30,15 @@ export default class PlantNetSpeciesSearch extends VariableUiElement {
|
|||
return UIEventSource.FromPromiseWithErr(PlantNet.query(images.slice(0,5)));
|
||||
})
|
||||
.map(result => {
|
||||
if (result === null) {
|
||||
return t.takeImages
|
||||
if (images.data.length === 0) {
|
||||
return new Combine([t.takeImages, t.howTo.intro, new List(
|
||||
[
|
||||
t.howTo.li0,
|
||||
t.howTo.li1,
|
||||
t.howTo.li2,
|
||||
t.howTo.li3
|
||||
]
|
||||
)]).SetClass("flex flex-col")
|
||||
}
|
||||
if (result === undefined) {
|
||||
return new Loading(t.querying.Subs(images.data))
|
||||
|
|
@ -79,13 +88,21 @@ export default class PlantNetSpeciesSearch extends VariableUiElement {
|
|||
return plantOverview
|
||||
}
|
||||
const buttons = new Combine([
|
||||
new Button("Confirm", () => {
|
||||
new Button(
|
||||
new Combine([
|
||||
Svg.back_svg().SetClass("w-4"),
|
||||
t.back]).SetClass("flex"),
|
||||
() => {
|
||||
selectedSpecies.setData(undefined)
|
||||
}).SetClass("btn btn-secondary"),
|
||||
|
||||
new Button(
|
||||
new Combine([Svg.confirm_svg().SetClass("w-4"), t.confirm]).SetClass("flex")
|
||||
, () => {
|
||||
onConfirm(wikidataSpecies)
|
||||
}).SetClass("btn"),
|
||||
new Button("Back to plant overview", () => {
|
||||
selectedSpecies.setData(undefined)
|
||||
}).SetClass("btn btn-secondary")
|
||||
]).SetClass("flex self-end");
|
||||
|
||||
]).SetClass("flex justify-between");
|
||||
|
||||
return new Combine([
|
||||
new WikipediaBox([wikidataSpecies], {
|
||||
|
|
|
|||
|
|
@ -1318,7 +1318,7 @@ export default class SpecialVisualizations {
|
|||
}
|
||||
|
||||
const detect = new UIEventSource(false)
|
||||
return new Toggle(
|
||||
const toggle = new Toggle(
|
||||
new Lazy(() => {
|
||||
const allProvidedImages: Store<ProvidedImage[]> = AllImageProviders.LoadImagesFor(tags, imagePrefixes)
|
||||
const allImages: Store<string[]> = allProvidedImages.map(pi => pi.map(pi => pi.url))
|
||||
|
|
@ -1340,6 +1340,13 @@ export default class SpecialVisualizations {
|
|||
new SubtleButton(undefined, "Detect plant species with plantnet.org").onClick(() => detect.setData(true)),
|
||||
detect
|
||||
)
|
||||
|
||||
return new Combine([
|
||||
toggle,
|
||||
new Combine([Svg.plantnet_logo_svg().SetClass("w-8"),
|
||||
Translations.t.plantDetection.poweredByPlantnet])
|
||||
.SetClass("flex p-2 bg-gray-200 rounded-xl self-end")
|
||||
]).SetClass("flex flex-col")
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
|
|
@ -985,6 +985,16 @@
|
|||
"authors": [],
|
||||
"sources": []
|
||||
},
|
||||
{
|
||||
"path": "plantnet_logo.svg",
|
||||
"license": "Logo (fair usage)",
|
||||
"authors": [
|
||||
"https://plantnet.org"
|
||||
],
|
||||
"sources": [
|
||||
"Plantnet.org"
|
||||
]
|
||||
},
|
||||
{
|
||||
"path": "plus.svg",
|
||||
"license": "CC0; trivial",
|
||||
|
|
|
|||
22
assets/svg/plantnet_logo.svg
Normal file
22
assets/svg/plantnet_logo.svg
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
version="1.1"
|
||||
id="svg2"
|
||||
width="197"
|
||||
height="116.32127"
|
||||
viewBox="0 0 197 116.32127"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<defs
|
||||
id="defs6" />
|
||||
<g
|
||||
id="g8"
|
||||
transform="translate(-1.375196,-41.199913)">
|
||||
<path
|
||||
style="fill:#8fb636;stroke:none"
|
||||
d="m 93.3752,135.52119 12,-21 -4,25 c 23.045,-11.772 32.998,-47.038298 33,-70.999998 0,-5.9908 0.838,-25.2828 -7.213,-27.1721 -7.654,-1.7961 -17.603,13.1208 -21.041,18.1721 -13.3558,19.6213 -22.8241,53.184998 -12.746,75.999998 M 42.375196,50.521192 c -3.2439,25.6902 16.759104,62.735998 41.000004,72.999998 -0.0234,-8.487 -1.0391,-16.513 0.4637,-24.999998 1.0531,-5.9466 5.1683,-13.9996 4.0093,-20 -0.914,-4.7316 -6.0155,-8.7352 -9.473,-11.6998 -9.978,-8.5558 -22.5558,-16.0213 -36.000004,-16.3002 m -41,72.999998 c 4.19365,8.258 15.8253,12.614 24,15.989 22.0533,9.107 46.351404,15.02 70.000004,18.011 -6.7774,-45.892 -61.032604,-47.725 -94.000004,-34 m 102.000004,34 c 22.945,-1.699 47.762,-8.999 69,-17.604 9.137,-3.702 20.019,-8.293 26,-16.396 -34.944,-13.554 -85.475,-12.001 -95,34 z"
|
||||
id="path881" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -1054,10 +1054,6 @@ video {
|
|||
height: 6rem;
|
||||
}
|
||||
|
||||
.h-96 {
|
||||
height: 24rem;
|
||||
}
|
||||
|
||||
.h-64 {
|
||||
height: 16rem;
|
||||
}
|
||||
|
|
@ -1102,6 +1098,10 @@ video {
|
|||
height: 8rem;
|
||||
}
|
||||
|
||||
.h-96 {
|
||||
height: 24rem;
|
||||
}
|
||||
|
||||
.h-16 {
|
||||
height: 4rem;
|
||||
}
|
||||
|
|
@ -1166,6 +1166,11 @@ video {
|
|||
width: 2rem;
|
||||
}
|
||||
|
||||
.w-min {
|
||||
width: -webkit-min-content;
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
.w-1\/3 {
|
||||
width: 33.333333%;
|
||||
}
|
||||
|
|
@ -1186,11 +1191,6 @@ video {
|
|||
width: 2.75rem;
|
||||
}
|
||||
|
||||
.w-min {
|
||||
width: -webkit-min-content;
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
.w-max {
|
||||
width: -webkit-max-content;
|
||||
width: max-content;
|
||||
|
|
@ -1512,6 +1512,11 @@ video {
|
|||
background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-gray-200 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgba(229, 231, 235, var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-red-400 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgba(248, 113, 113, var(--tw-bg-opacity));
|
||||
|
|
@ -1532,11 +1537,6 @@ video {
|
|||
background-color: rgba(0, 0, 0, var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-gray-200 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgba(229, 231, 235, var(--tw-bg-opacity));
|
||||
}
|
||||
|
||||
.bg-gray-100 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgba(243, 244, 246, var(--tw-bg-opacity));
|
||||
|
|
|
|||
|
|
@ -686,22 +686,25 @@
|
|||
"warnAnonymous": "You are not logged in. We won't be able to contact you to resolve your issue."
|
||||
},
|
||||
"plantDetection": {
|
||||
"back": "Back to species overview",
|
||||
"confirm": "Select species",
|
||||
"error": "Something went wrong while detecting the tree species: {error}",
|
||||
"loadingWikidata": "Loading information about {species}",
|
||||
"matchPercentage": "{match}% match",
|
||||
"overviewIntro": "The AI on <a href='https://plantnet.org/' target='_blank'>PlantNet.org</a> thinks the images show the species below.",
|
||||
"overviewTitle": "Automatically detected species",
|
||||
"overviewVerify": "Please verify that correct species and link it to the tree",
|
||||
"querying": "Querying plantnet.org with {length} images",
|
||||
"seeInfo": "See more information about the species",
|
||||
"takeImages": "Take images of the tree to automatically detect the tree type",
|
||||
"howTo":{
|
||||
"howTo": {
|
||||
"intro": "For optimal results,",
|
||||
"li0": "take a picture which show the tree in the center without much background",
|
||||
"li1": "take a picture which shows a single leaf",
|
||||
"li2": "take a picture which shows the bark",
|
||||
"li3": "take a picture of the flowers"
|
||||
}
|
||||
},
|
||||
"loadingWikidata": "Loading information about {species}",
|
||||
"matchPercentage": "{match}% match",
|
||||
"overviewIntro": "The AI on <a href='https://plantnet.org/' target='_blank'>PlantNet.org</a> thinks the images show the species below.",
|
||||
"overviewTitle": "Automatically detected species",
|
||||
"overviewVerify": "Please verify that correct species and link it to the tree",
|
||||
"poweredByPlantnet": "Powered by <a href='https://plantnet.org' target='_blank'>plantnet.org</a>",
|
||||
"querying": "Querying plantnet.org with {length} images",
|
||||
"seeInfo": "See more information about the species",
|
||||
"takeImages": "Take images of the tree to automatically detect the tree type"
|
||||
},
|
||||
"privacy": {
|
||||
"editing": "When you make a change to the map, this change is recorded on OpenStreetMap and is publicly available to anyone. A changeset made with MapComplete includes the following data: <ul><li>The changes you made</li><li>Your username</li><li>When this change is made</li><li>The theme you used while making the change</li><li>The language of the user interface</li><li>An indication of how close you were to changed objects. Other mappers can use this information to determine if a change was made based on survey or on remote research</li></ul> Please refer to <a href='https://wiki.osmfoundation.org/wiki/Privacy_Policy' target='_blank'>the privacy policy on OpenStreetMap.org</a> for detailed information. We'd like to remind you that you can use a fictional name when signing up.",
|
||||
|
|
|
|||
Loading…
Reference in a new issue