social-area page and profile page update

This commit is contained in:
Inga Kirschnick
2023-03-01 14:09:15 +01:00
parent ec6d0a6477
commit b1586b3679
10 changed files with 144 additions and 58 deletions

View File

@ -22,6 +22,7 @@
'js/ResourceLists/CorpusFileList.js',
'js/ResourceLists/PublicCorpusFileList.js',
'js/ResourceLists/CorpusList.js',
'js/ResourceLists/FollowedCorpusList.js',
'js/ResourceLists/PublicCorpusList.js',
'js/ResourceLists/JobList.js',
'js/ResourceLists/JobInputList.js',

View File

@ -6,11 +6,10 @@
<div class="col s4">
<a href="{{ url_for('users.user', user_id=current_user.id) }}">
{% if current_user.avatar %}
<img src="{{ url_for('users.profile_avatar', user_id=current_user.id) }}" alt="user-image" class="circle responsive-img" style="height:80%; margin-top: 20px; margin-left:-15px;">
<img src="{{ url_for('users.profile_avatar', user_id=current_user.id) }}" alt="user-image" class="circle responsive-img" style="height:80%; margin-top: 13px; margin-left:-15px;">
{% else %}
<img src="{{ url_for('static', filename='images/user_avatar.png') }}" alt="user-image" class="circle responsive-img" style="height:80%; margin-top: 20px; margin-left:-15px;">
<img src="{{ url_for('static', filename='images/user_avatar.png') }}" alt="user-image" class="circle responsive-img" style="height:80%; margin-top: 13px; margin-left:-15px;">
{% endif %}
{# <i class="material-icons" style="color:white; font-size:3em; margin-top: 25px; margin-left:-15px;">account_circle</i></div> #}
</a>
</div>
<div class="col s8">
@ -27,6 +26,7 @@
<li><a href="{{ url_for('main.dashboard', _anchor='corpora') }}" style="padding-left: 47px;"><i class="nopaque-icons">I</i>My Corpora</a></li>
<li><a href="{{ url_for('main.dashboard', _anchor='jobs') }}" style="padding-left: 47px;"><i class="nopaque-icons">J</i>My Jobs</a></li>
<li><a href="{{ url_for('contributions.contributions') }}"><i class="material-icons">new_label</i>Contribute</a></li>
<li><a href="{{ url_for('main.social_area') }}"><i class="material-icons">group</i>Social Area</a></li>
<li><div class="divider"></div></li>
<li><a class="subheader">Processes & Services</a></li>
<li class="service-color service-color-border border-darken" data-service="file-setup-pipeline" style="border-left: 10px solid; margin-top: 5px;"><a href="{{ url_for('services.file_setup_pipeline') }}"><i class="nopaque-icons service-icons" data-service="file-setup-pipeline"></i>File setup</a></li>

View File

@ -0,0 +1,70 @@
{% extends "base.html.j2" %}
{% import "materialize/wtf.html.j2" as wtf %}
{% block main_attribs %} style="background-color:#d8c9ba86" {% endblock main_attribs %}
{% block page_content %}
<div class="container">
<div class="row">
<div class="col s12">
<h1 id="title">{{ title }}</h1>
</div>
<div class="col s12 m3 push-m9">
<div class="center-align">
<p class="hide-on-small-only">&nbsp;</p>
<p class="hide-on-small-only">&nbsp;</p>
<a class="btn-floating btn-large btn-scale-x2 waves-effect waves-light" style="background-color:#D9A36D">
<i class="left material-icons">group</i>
</a>
</div>
</div>
<div class="col s12 m9 pull-m3">
<div class="card" style="border-top: 10px solid #D9A36D;">
<div class="card-content">
<div class="row">
<div class="col s12">
<div class="card-panel z-depth-0">
<span class="card-title"><i class="left material-icons">layers</i>Your social area</span>
<p>Here you can network with your team and other users. You can find corpora that are public and request them or just see what other users are working on.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col s12">
<h3>Other Users</h3>
<p>Find other users and see what corpora they have made public.</p>
<div class="card">
<div class="card-content">
<div class="user-list no-autoinit"></div>
</div>
</div>
</div>
<div class="col s12">
<h3>Public Corpora</h3>
<p>Find public corpora.</p>
<div class="card">
<div class="card-content">
<span class="card-title">Public Corpora</span>
<div class="public-corpus-list no-autoinit"></div>
</div>
</div>
</div>
</div>
</div>
{% endblock page_content %}
{% block scripts %}
{{ super() }}
<script>
let userList = new UserList(document.querySelector('.user-list'));
userList.add({{ users|tojson }});
let publicCorpusList = new PublicCorpusList(document.querySelector('.public-corpus-list'));
publicCorpusList.add({{ corpora|tojson }});
</script>
{% endblock scripts %}

View File

@ -26,7 +26,7 @@
</div>
<div class="col 12">
{% if user.show_last_seen %}
<div class="chip">Last seen: {{ user.last_seen }}</div>
<div class="chip">Last seen: {{ last_seen }}</div>
{% endif %}
{% if user.location %}
<p><span class="material-icons" style="margin-right:20px; margin-top:20px;">location_on</span><i>{{ user.location }}</i></p>
@ -76,7 +76,7 @@
</table>
<br>
{% if user.show_member_since %}
<p><i>Member since: {{ user.member_since }}</i></p>
<p><i>Member since: {{ member_since }}</i></p>
{% endif %}
<p></p>
<br>
@ -93,7 +93,8 @@
<div class="col s6">
<div class="card">
<div class="card-content">
<h4>Groups</h4>
<h4>Followed corpora</h4>
<div class="followed-corpus-list no-autoinit"></div>
</div>
</div>
</div>
@ -101,7 +102,7 @@
<div class="card">
<div class="card-content">
<h4>Public corpora</h4>
<div class="public-corpora-list" data-user-id="{{ user.hashid }}"></div>
<div class="public-corpus-list no-autoinit"></div>
</div>
</div>
</div>
@ -127,6 +128,11 @@ if ("{{ user.id }}" == "{{ current_user.hashid }}") {
} else {
publicInformationBadge.remove();
}
let followedCorpusList = new FollowedCorpusList(document.querySelector('.followed-corpus-list'));
followedCorpusList.add({{ followed_corpora|tojson }});
let publicCorpusList = new PublicCorpusList(document.querySelector('.public-corpus-list'));
publicCorpusList.add({{ own_public_corpora|tojson }});
</script>
{% endblock scripts %}