Show username for logged in users

This commit is contained in:
Edward Betts 2021-06-17 19:12:07 +02:00
parent 4689323583
commit 6cd2bfa6b0
3 changed files with 53 additions and 14 deletions

View file

@ -1,5 +1,40 @@
<template> <template>
<div> <div>
<nav id="nav" class="navbar navbar-expand navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="/">osm.wikidata.link</a>
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
</li>
</ul>
<ul class="navbar-nav">
<li class="nav-item">
<a v-if="username" class="nav-link" href="#">{{ username }}</a>
<a v-else class="nav-link" href="/login">Login</a>
</li>
</ul>
</div>
</nav>
<div id="map"> <div id="map">
</div> </div>
<button ref="btn" id="load-btn" type="button" class="btn btn-primary btn-lg" @click="load_wikidata_items"> <button ref="btn" id="load-btn" type="button" class="btn btn-primary btn-lg" @click="load_wikidata_items">
@ -221,6 +256,7 @@ export default {
startLat: Number, startLat: Number,
startLon: Number, startLon: Number,
startZoom: Number, startZoom: Number,
username: String,
}, },
data() { data() {
return { return {
@ -717,26 +753,31 @@ export default {
<style> <style>
#nav {
left: 35%;
width: 65%;
}
#map { #map {
position: absolute; position: absolute;
top: 0px; top: 57px;
bottom: 0px; bottom: 0px;
left: 35%; left: 35%;
width: 65%; width: 65%;
z-index: -1; z-index: -1;
} }
#load-btn { #load-btn {
position: absolute; position: absolute;
top: 20px; top: 77px;
left: 62.5%; left: 67.5%;
transform: translate(-50%, 0); transform: translate(-50%, 0);
} }
#search { #search {
position: absolute; position: absolute;
overflow: auto; overflow: auto;
top: 20px; top: 77px;
left: 20px; left: 20px;
bottom: 20px; bottom: 20px;
width: 25%; width: 25%;
@ -747,13 +788,6 @@ export default {
background: lightgray !important; background: lightgray !important;
} }
#load-btn {
position: absolute;
top: 20px;
left: 62.5%;
transform: translate(-50%, 0);
}
#sidebar { #sidebar {
position: absolute; position: absolute;
background: #eee; background: #eee;

View file

@ -21,6 +21,7 @@
startLat: {{ lat }}, startLat: {{ lat }},
startLon: {{ lon }}, startLon: {{ lon }},
startZoom: {{ zoom }}, startZoom: {{ zoom }},
username: {{ username | tojson }},
}; };
const app = createApp(App, props).mount('#app'); const app = createApp(App, props).mount('#app');

View file

@ -299,16 +299,20 @@ def old_map_location(zoom, lat, lng):
def map_start_page(): def map_start_page():
location = get_user_location() location = get_user_location()
lat, lon = location lat, lon = location
return redirect(url_for( return redirect(url_for(
'map_location', 'map_location',
zoom=16, zoom=16,
lat=f'{lat:.5f}', lat=f'{lat:.5f}',
lon=f'{lon:.5f}' lon=f'{lon:.5f}',
)) ))
@app.route("/map/<int:zoom>/<float(signed=True):lat>/<float(signed=True):lon>") @app.route("/map/<int:zoom>/<float(signed=True):lat>/<float(signed=True):lon>")
def map_location(zoom, lat, lon): def map_location(zoom, lat, lon):
return render_template("map.html", zoom=zoom, lat=lat, lon=lon) user = flask_login.current_user
username = user.username if user.is_authenticated else None
return render_template("map.html", zoom=zoom, lat=lat, lon=lon, username=username)
@app.route("/old_map") @app.route("/old_map")