midgard/mapcomplete
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Add mapillary button in the attribution

Browse source
This commit is contained in:
pietervdvn 2021-04-23 12:56:33 +02:00
parent 141d4db028
commit 86dd93c593
2 changed files with 70 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
UI/BigComponents/Attribution.ts
View file

@ -7,14 +7,13 @@ import UserDetails from "../../Logic/Osm/OsmConnection";
import Constants from "../../Models/Constants";
import LayoutConfig from "../../Customizations/JSON/LayoutConfig";
import Loc from "../../Models/Loc";
import LeafletMap from "../../Models/LeafletMap";
import * as L from "leaflet"
/**
* The bottom right attribution panel in the leaflet map
*/
export default class Attribution extends UIElement {
private readonly _location: UIEventSource<Loc>;
private readonly _layoutToUse: UIEventSource<LayoutConfig>;
private readonly _userDetails: UIEventSource<UserDetails>;
@ -35,7 +34,7 @@ export default class Attribution extends UIElement {
}
InnerRender(): string {
const location : Loc = this._location?.data;
const location: Loc = this._location?.data;
const userDetails = this._userDetails?.data;
const mapComplete = new Link(`Mapcomplete ${Constants.vNumber}`, 'https://github.com/pietervdvn/MapComplete', true);
@ -45,15 +44,22 @@ export default class Attribution extends UIElement {
const osmChaLink = `https://osmcha.org/?filters=%7B%22comment%22%3A%5B%7B%22label%22%3A%22%23${layoutId}%22%2C%22value%22%3A%22%23${layoutId}%22%7D%5D%2C%22date__gte%22%3A%5B%7B%22label%22%3A%222020-07-05%22%2C%22value%22%3A%222020-07-05%22%7D%5D%2C%22editor%22%3A%5B%7B%22label%22%3A%22MapComplete%22%2C%22value%22%3A%22MapComplete%22%7D%5D%7D`
const stats = new Link(Svg.statistics_img, osmChaLink, true)
let editHere: (UIElement | string) = "";
let mapillary: UIElement = undefined;
if (location !== undefined) {
const idLink = `https://www.openstreetmap.org/edit?editor=id#map=${location.zoom}/${location.lat}/${location.lon}`
editHere = new Link(Svg.pencil_img, idLink, true);
const mapillaryLink: string = `https://www.mapillary.com/app/?focus=map&lat=${location.lat}&lng=${location.lon}&z=${Math.max(location.zoom - 1, 1)}`;
mapillary = new Link(Svg.mapillary_black_img, mapillaryLink, true);
}
let editWithJosm: (UIElement | string) = ""
if (location !== undefined &&
this._leafletMap?.data !== undefined &&
userDetails.csCount >= Constants.userJourney.tagsVisibleAndWikiLinked) {
const bounds : any= this._leafletMap.data.getBounds();
userDetails.csCount >= Constants.userJourney.tagsVisibleAndWikiLinked) {
const bounds: any = this._leafletMap.data.getBounds();
const top = bounds.getNorth();
const bottom = bounds.getSouth();
const right = bounds.getEast();
@ -62,7 +68,7 @@ export default class Attribution extends UIElement {
const josmLink = `http://127.0.0.1:8111/load_and_zoom?left=${left}&right=${right}&top=${top}&bottom=${bottom}`
editWithJosm = new Link(Svg.josm_logo_img, josmLink, true);
}
return new Combine([mapComplete, reportBug, stats, editHere, editWithJosm]).Render();
return new Combine([mapComplete, reportBug, stats, editHere, editWithJosm, mapillary]).Render();
}

58
assets/svg/mapillary_black.svg Normal file
View file

@ -0,0 +1,58 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="32"
height="32"
fill="none"
viewBox="0 0 32 32"
version="1.1"
id="svg4"
sodipodi:docname="mapillary_black.svg"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)">
<metadata
id="metadata10">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs8" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1039"
id="namedview6"
showgrid="false"
inkscape:zoom="7.375"
inkscape:cx="16"
inkscape:cy="16"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg4" />
<path
fill="#fff"
fill-rule="evenodd"
d="M32 16c0 8.837-7.163 16-16 16S0 24.837 0 16 7.163 0 16 0s16 7.163 16 16zm-24.44-.974c-.371-.201-.303-.725.166-.859.398-.113 3.627-1.196 4.605-1.524a.59.59 0 00.373-.369l1.57-4.603c.146-.43.678-.432.894-.015.024.046.325.593.731 1.331v.001c.896 1.629 2.302 4.185 2.372 4.34a.473.473 0 01-.194.617c-.133.083-.314.19-.469.28l-.269.16c-.237.148-.464.045-.573-.183-.065-.137-.39-.719-.713-1.299-.217-.389-.433-.776-.57-1.027-.17-.313-.682-.433-.854.072l-.566 1.66a.613.613 0 01-.376.373l-1.703.564c-.336.111-.5.626-.046.843.038.018.383.202.798.423h.001c.631.337 1.425.76 1.552.82.21.1.328.39.204.595-.168.28-.384.635-.462.75a.48.48 0 01-.626.149c-.223-.119-5.711-3.027-5.844-3.099zm7.378 3.9c.288.147 7.276 3.844 7.496 3.963.441.238.907-.222.668-.652-.041-.073-.507-.929-1.107-2.034l-.002-.004c-1.166-2.144-2.84-5.224-2.925-5.365-.128-.214-.442-.322-.678-.178-.232.14-.498.298-.648.374-.3.153-.338.383-.203.639.297.562 1.232 2.267 1.34 2.446.223.374-.276.801-.615.615-.054-.03-.408-.217-.834-.442-.697-.368-1.587-.839-1.684-.896-.157-.09-.435-.09-.626.218-.138.224-.308.502-.386.642-.155.274-.084.527.204.674z"
clip-rule="evenodd"
style="transition:all 0.20000000000000001s ease 0s;fill:#000000;fill-opacity:1"
id="path2" />
</svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB