user can choose their avatar to send
This commit is contained in:
parent
d61c402aea
commit
67dbcb9723
|
@ -3,7 +3,7 @@
|
||||||
|
|
||||||
Authorization code flow:
|
Authorization code flow:
|
||||||
|
|
||||||
http://sl-server:7777/oauth/authorize?client_id=client-id&state=123456&response_type=code&redirect_uri=http%3A%2F%2Fsl-client%3A7000%2Fcallback&state=dvoQ6Jtv0PV68tBUgUMM035oFiZw57
|
http://sl-server:7777/oauth/authorize?client_id=client-id&state=123456&response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A7000%2Fcallback&state=dvoQ6Jtv0PV68tBUgUMM035oFiZw57
|
||||||
|
|
||||||
Implicit flow:
|
Implicit flow:
|
||||||
http://sl-server:7777/oauth/authorize?client_id=client-id&state=123456&response_type=token&redirect_uri=http%3A%2F%2Fsl-client%3A7000%2Fcallback&state=dvoQ6Jtv0PV68tBUgUMM035oFiZw57
|
http://sl-server:7777/oauth/authorize?client_id=client-id&state=123456&response_type=token&redirect_uri=http%3A%2F%2Fsl-client%3A7000%2Fcallback&state=dvoQ6Jtv0PV68tBUgUMM035oFiZw57
|
||||||
|
|
|
@ -446,7 +446,12 @@ class ClientUser(db.Model, ModelMixin):
|
||||||
res[Scope.NAME.value] = self.user.name
|
res[Scope.NAME.value] = self.user.name
|
||||||
elif scope == Scope.AVATAR_URL:
|
elif scope == Scope.AVATAR_URL:
|
||||||
if self.user.profile_picture_id:
|
if self.user.profile_picture_id:
|
||||||
res[Scope.AVATAR_URL.value] = self.user.profile_picture.get_url()
|
if self.default_avatar:
|
||||||
|
res[Scope.AVATAR_URL.value] = URL + "/static/default-avatar.png"
|
||||||
|
else:
|
||||||
|
res[
|
||||||
|
Scope.AVATAR_URL.value
|
||||||
|
] = self.user.profile_picture.get_url()
|
||||||
else:
|
else:
|
||||||
res[Scope.AVATAR_URL.value] = None
|
res[Scope.AVATAR_URL.value] = None
|
||||||
elif scope == Scope.EMAIL:
|
elif scope == Scope.EMAIL:
|
||||||
|
|
|
@ -4,6 +4,33 @@
|
||||||
Authorization
|
Authorization
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block head %}
|
||||||
|
<style>
|
||||||
|
/* Inspired from https://stackoverflow.com/a/17541916/1428034 */
|
||||||
|
/* HIDE RADIO */
|
||||||
|
[type=radio] {
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* IMAGE STYLES */
|
||||||
|
[type=radio] + img {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* CHECKED STYLES */
|
||||||
|
[type=radio]:checked + img {
|
||||||
|
{#outline: 2px solid #f00;#} display: block;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-color: #0ff;
|
||||||
|
border: 3px solid #88d748;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
{% block default_content %}
|
{% block default_content %}
|
||||||
<form class="card" method="post" style="max-width: 40rem; margin: auto">
|
<form class="card" method="post" style="max-width: 40rem; margin: auto">
|
||||||
<div class="card-body p-6">
|
<div class="card-body p-6">
|
||||||
|
@ -43,6 +70,9 @@
|
||||||
|
|
||||||
<div class="text-center mt-4">
|
<div class="text-center mt-4">
|
||||||
<b>{{ client.name }}</b> will receive the following info
|
<b>{{ client.name }}</b> will receive the following info
|
||||||
|
<div>
|
||||||
|
<small class="font-weight-lighter">You can customize the information sent to this app.</small>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row mt-4 md-4">
|
<div class="row mt-4 md-4">
|
||||||
|
@ -95,19 +125,26 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
{% if current_user.profile_picture_id %}
|
{% if current_user.profile_picture_id %}
|
||||||
<div class="row mt-4">
|
<div class="row mt-4 md-4">
|
||||||
<div class="col-md-3 text-right">
|
<div class="col-md-3 text-left">
|
||||||
<label>Avatar</label>
|
<label style="padding-top: 2rem">Avatar</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-9">
|
<div class="col-md-9" style="display: flex; align-items: center">
|
||||||
<img class="profile-picture" href="{{ current_user.profile_picture_url() }}">
|
<label>
|
||||||
|
<input type="radio" name="avatar-choice" value="real" checked>
|
||||||
|
<img src="{{ current_user.profile_picture_url() }}" class="small-profile-picture">
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<div style="margin: 0 1rem">OR</div>
|
||||||
|
|
||||||
|
<label>
|
||||||
|
<input type="radio" name="avatar-choice" value="default">
|
||||||
|
<img src="{{ url_for('static', filename='default-avatar.png') }}" class="small-profile-picture">
|
||||||
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% if client_user %}
|
{% if client_user %}
|
||||||
|
|
|
@ -122,6 +122,8 @@ def authorize():
|
||||||
suggested_name = request.form.get("suggested-name")
|
suggested_name = request.form.get("suggested-name")
|
||||||
custom_name = request.form.get("custom-name")
|
custom_name = request.form.get("custom-name")
|
||||||
|
|
||||||
|
use_default_avatar = request.form.get("avatar-choice") == "default"
|
||||||
|
|
||||||
gen_email = None
|
gen_email = None
|
||||||
if custom_email_prefix:
|
if custom_email_prefix:
|
||||||
# check if user can generate custom email
|
# check if user can generate custom email
|
||||||
|
@ -167,6 +169,11 @@ def authorize():
|
||||||
)
|
)
|
||||||
client_user.name = suggested_name
|
client_user.name = suggested_name
|
||||||
|
|
||||||
|
if use_default_avatar:
|
||||||
|
# use default avatar
|
||||||
|
LOG.d("use default avatar for user %s client %s", current_user, client)
|
||||||
|
client_user.default_avatar = True
|
||||||
|
|
||||||
db.session.flush()
|
db.session.flush()
|
||||||
LOG.d("create client-user for client %s, user %s", client, current_user)
|
LOG.d("create client-user for client %s, user %s", client, current_user)
|
||||||
|
|
||||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 47 KiB After Width: | Height: | Size: 46 KiB |
|
@ -28,5 +28,16 @@
|
||||||
/* round the edges to a circle with border radius 1/2 container size */
|
/* round the edges to a circle with border radius 1/2 container size */
|
||||||
border-radius: 10%;
|
border-radius: 10%;
|
||||||
|
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.small-profile-picture {
|
||||||
|
/* make a square container */
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
|
||||||
|
/* round the edges to a circle with border radius 1/2 container size */
|
||||||
|
border-radius: 50%;
|
||||||
|
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
Loading…
Reference in New Issue