import {UIElement} from "./UIElement"; import {UserDetails} from "../Logic/OsmConnection"; import {UIEventSource} from "./UIEventSource"; import {Basemap} from "../Logic/Basemap"; import L from "leaflet"; import {FixedUiElement} from "./Base/FixedUiElement"; import {VariableUiElement} from "./Base/VariableUIElement"; /** * Handles and updates the user badge */ export class UserBadge extends UIElement { private _userDetails: UIEventSource; private _pendingChanges: UIElement; private _logout: UIElement; private _basemap: Basemap; private _homeButton: UIElement; constructor(userDetails: UIEventSource, pendingChanges: UIElement, basemap: Basemap) { super(userDetails); this._userDetails = userDetails; this._pendingChanges = pendingChanges; this._basemap = basemap; this._logout = new FixedUiElement("logout") .onClick(() => { userDetails.data.osmConnection.LogOut(); }); userDetails.addCallback(function () { const profilePic = document.getElementById("profile-pic"); if (profilePic) { profilePic.onload = function () { profilePic.style.opacity = "1" }; } }); this._homeButton = new VariableUiElement( userDetails.map((userinfo) => { if (userinfo.home) { return "home "; } return ""; }) ).onClick(() => { const home = userDetails.data?.home; if (home === undefined) { return; } basemap.map.flyTo([home.lat, home.lon], 18); }); } protected InnerRender(): string { const user = this._userDetails.data; if (!user.loggedIn) { return "
Klik hier om aan te melden bij OSM
"; } let messageSpan = "" + " msgs" + user.totalMessages + ""; if (user.unreadMessages > 0) { messageSpan = "" + " msgs" + " " + "" + user.unreadMessages.toString() + ""; } let dryrun = ""; if (user.dryRun) { dryrun = " TESTING"; } if (user.home !== undefined) { const icon = L.icon({ iconUrl: 'assets/home.svg', iconSize: [20, 20], iconAnchor: [10, 10] }); L.marker([user.home.lat, user.home.lon], {icon: icon}).addTo(this._basemap.map); } const settings = "" + "settings" + " "; return "" + "profile-pic " + "" + "
" + "

" + "" + user.name + "" + dryrun + "

" + "

" + this._homeButton.Render() + settings + messageSpan + " " + " star " + user.csCount + " " + this._logout.Render() + this._pendingChanges.Render() + "

" + "
"; } }