klmp200/Sith
1
0
Fork 0
mirror of https://github.com/ae-utbm/sith.git synced 2025-07-10 11:59:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve SAS UX

Browse Source
This commit is contained in:
Skia
2016-11-20 23:53:41 +01:00
parent 7dff98d853
commit 0e0e57458f
9 changed files with 153 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
sas/templates/sas/album.jinja
View File

@ -15,20 +15,29 @@
{% block content %}
<a href="{{ url('sas:main') }}">SAS</a> > {{ print_path(album.parent) }} {{ album.get_display_name() }}
<h3>{{ album.get_display_name() }}</h3>
<hr>
<div>
{% for a in album.children.filter(is_folder=True, is_moderated=True).all() %}
<div style="display: inline-block; border: solid 1px black;">
<a href="{{ url("sas:album", album_id=a.id) }}">{{ a.name }}</a>
<a href="{{ url("sas:album", album_id=a.id) }}" style="display: inline-block">
<div class="album">
<div>
{% if a.children.filter(is_folder=False, is_moderated=True).exists() %}
<img src="{{ a.children.filter(is_folder=False).first().as_picture.get_download_thumb_url() }}" alt="{% trans %}preview{% endtrans %}">
{% else %}
<img src="{{ static('core/img/sas.jpg') }}" alt="{% trans %}preview{% endtrans %}">
{% endif %}
</div>
{{ a.name }}
</div>
</a>
{% endfor %}
</div>
<div>
{# for a in album.children.filter(mime_type__in=['image/jpeg', 'image/png']).all() #}
{% for p in album.children.filter(is_folder=False, is_moderated=True).all() %}
{% if p.as_picture.can_be_viewed_by(user) %}
<div style="display: inline-block; border: solid 1px black; width: 9%; margin: 0.1%">
<div class="picture">
<a href="{{ url("sas:picture", picture_id=p.id) }}#pict">
<img src="{{ p.as_picture.get_download_thumb_url() }}" alt="{{ p.get_display_name() }}" style="max-width: 100%"/>
<img src="{{ p.as_picture.get_download_thumb_url() }}" alt="{{ p.get_display_name() }}" />
</a>
</div>
{% endif %}

38
sas/templates/sas/main.jinja
View File

@ -6,6 +6,30 @@
{% block content %}
<h3>{% trans %}SAS{% endtrans %}</h3>
<hr>
<div>
{% for a in root_file.children.filter(is_folder=True).all() %}
{% if a.is_moderated %}
<a href="{{ url("sas:album", album_id=a.id) }}">
<div class="album">
<div>
{% if a.children.filter(is_folder=False, is_moderated=True).exists() %}
<img src="{{ a.children.filter(is_folder=False).first().as_picture.get_download_thumb_url() }}" alt="{% trans %}preview{% endtrans %}">
{% else %}
<img src="{{ static('core/img/sas.jpg') }}" alt="{% trans %}preview{% endtrans %}">
{% endif %}
</div>
{{ a.name }}
</div>
</a>
{% elif user.is_in_group(settings.SITH_SAS_ADMIN_GROUP_ID) %}
<div style="display: inline-block; border: solid 1px red; text-align: center">
<p><a href="{{ url('core:file_moderate', file_id=a.id) }}?next={{ url('sas:moderation') }}">Moderate</a> or <a href="">Delete</a></p>
<a href="{{ url("sas:album", album_id=a.id) }}">{{ a.name }}</a>
</div>
{% endif %}
{% endfor %}
</div>
{% if user.is_in_group(settings.SITH_SAS_ADMIN_GROUP_ID) %}
<form action="" method="post" enctype="multipart/form-data">
{% csrf_token %}
@ -15,18 +39,4 @@
<p><input type="submit" value="{% trans %}Create{% endtrans %}" /></p>
</form>
{% endif %}
<div>
{% for a in root_file.children.filter(is_folder=True).all() %}
{% if a.is_moderated %}
<div style="display: inline-block; border: solid 1px black; text-align: center">
<a href="{{ url("sas:album", album_id=a.id) }}">{{ a.name }}</a>
</div>
{% elif user.is_in_group(settings.SITH_SAS_ADMIN_GROUP_ID) %}
<div style="display: inline-block; border: solid 1px red; text-align: center">
<p><a href="{{ url('core:file_moderate', file_id=a.id) }}?next={{ url('sas:moderation') }}">Moderate</a> or <a href="">Delete</a></p>
<a href="{{ url("sas:album", album_id=a.id) }}">{{ a.name }}</a>
</div>
{% endif %}
{% endfor %}
</div>
{% endblock %}

50
sas/templates/sas/picture.jinja
View File

@ -6,16 +6,18 @@
#prev, #next {
display: inline-block;
width: 42%;
height: 100px;
margin: 0.5%;
border: solid 1px grey;
overflow: auto;
background: #333;
overflow: hidden;
background: #aaa;
text-align: center;
}
#prev img, #next img {
display: block;
margin: auto;
max-height: 80%;
max-width: 100%;
max-height: 100%;
}
</style>
{% endblock %}
@ -34,18 +36,12 @@
{% block content %}
<a href="{{ url('sas:main') }}">SAS</a> > {{ print_path(picture.parent) }} {{ picture.get_display_name() }}
<h3>{{ picture.get_display_name() }}</h3>
<div style="display: inline-block; width: 89%; background: #333; border: solid #333 2px;" id="pict">
{% if is_vertical %}
<img src="{{ picture.get_download_compressed_url() }}" alt="{{ picture.get_display_name() }}" style="width: 60%; display: block; margin: auto"/>
{% else %}
<img src="{{ picture.get_download_compressed_url() }}" alt="{{ picture.get_display_name() }}" style="width: 100%; display: block; margin: auto"/>
{% endif %}
</div>
<div style="display: inline-block; width: 10%; vertical-align: top;">
<div style="display: inline-block; width: 19%; vertical-align: top; overflow: hidden; float: right">
<div>
<div id="prev">
{% if picture.get_previous() %}
<a href="{{ url("sas:picture", picture_id=picture.get_previous().id) }}#pict">
&larr;
<img src="{{ picture.get_previous().as_picture.get_download_thumb_url() }}" alt="{{ picture.get_previous().get_display_name() }}" />
</a>
{% endif %}
@ -53,12 +49,14 @@
<div id="next">
{% if picture.get_next() %}
<a href="{{ url("sas:picture", picture_id=picture.get_next().id) }}#pict">
&rarr;
<img src="{{ picture.get_next().as_picture.get_download_thumb_url() }}" alt="{{ picture.get_next().get_display_name() }}" />
</a>
{% endif %}
</div>
</div>
<div>
<h5>{% trans %}People{% endtrans %}</h5>
<ul>
{% for r in picture.people.all() %}
<li>
@ -69,22 +67,30 @@
</li>
{% endfor %}
</ul>
</div>
<div>
<form action="" method="post" enctype="multipart/form-data">
<form action="" method="post" enctype="multipart/form-data" style="margin: 0px;">
{% csrf_token %}
{{ form.as_p() }}
<p><input type="submit" value="{% trans %}Go{% endtrans %}" /></p>
</form>
</div>
<p>
<a href="{{ picture.get_download_url() }}">{% trans %}HD version{% endtrans %}</a>
</p>
<p style="font-size: smaller;">
<a href="?rotate_left">{% trans %}Rotate left{% endtrans %}</a><br>
<a href="?rotate_right">{% trans %}Rotate right{% endtrans %}</a><br>
<a href="?ask_removal">{% trans %}Ask for removal{% endtrans %}</a><br>
</p>
<div>
<h5>{% trans %}Tools{% endtrans %}</h5>
<p>
<a href="{{ picture.get_download_url() }}">{% trans %}HD version{% endtrans %}</a>
</p>
<p style="font-size: smaller;">
<a href="?rotate_left">{% trans %}Rotate left{% endtrans %}</a><br>
<a href="?rotate_right">{% trans %}Rotate right{% endtrans %}</a><br>
<a href="?ask_removal">{% trans %}Ask for removal{% endtrans %}</a><br>
</p>
</div>
</div>
<div style="display: inline-block; width: 80%; background: #333; border: solid #333 2px;" id="pict">
{% if picture.is_vertical %}
<img src="{{ picture.get_download_compressed_url() }}" alt="{{ picture.get_display_name() }}" style="width: 60%; display: block; margin: auto"/>
{% else %}
<img src="{{ picture.get_download_compressed_url() }}" alt="{{ picture.get_display_name() }}" style="width: 100%; display: block; margin: auto"/>
{% endif %}
</div>
{% endblock %}