mirror of
https://github.com/ae-utbm/sith.git
synced 2025-02-26 01:17:13 +00:00
Merge pull request #1025 from ae-utbm/dl_pictures
download button for user pictures and albums
This commit is contained in:
commit
8705fbe4b2
@ -1,101 +0,0 @@
|
||||
import { paginated } from "#core:utils/api";
|
||||
import { HttpReader, ZipWriter } from "@zip.js/zip.js";
|
||||
import { showSaveFilePicker } from "native-file-system-adapter";
|
||||
import { picturesFetchPictures } from "#openapi";
|
||||
|
||||
/**
|
||||
* @typedef UserProfile
|
||||
* @property {number} id
|
||||
* @property {string} first_name
|
||||
* @property {string} last_name
|
||||
* @property {string} nick_name
|
||||
* @property {string} display_name
|
||||
* @property {string} profile_url
|
||||
* @property {string} profile_pict
|
||||
*/
|
||||
/**
|
||||
* @typedef Picture
|
||||
* @property {number} id
|
||||
* @property {string} name
|
||||
* @property {number} size
|
||||
* @property {string} date
|
||||
* @property {UserProfile} owner
|
||||
* @property {string} full_size_url
|
||||
* @property {string} compressed_url
|
||||
* @property {string} thumb_url
|
||||
* @property {string} album
|
||||
* @property {boolean} is_moderated
|
||||
* @property {boolean} asked_for_removal
|
||||
*/
|
||||
|
||||
/**
|
||||
* @typedef PicturePageConfig
|
||||
* @property {number} userId Id of the user to get the pictures from
|
||||
**/
|
||||
|
||||
/**
|
||||
* Load user picture page with a nice download bar
|
||||
* @param {PicturePageConfig} config
|
||||
**/
|
||||
window.loadPicturePage = (config) => {
|
||||
document.addEventListener("alpine:init", () => {
|
||||
Alpine.data("user_pictures", () => ({
|
||||
isDownloading: false,
|
||||
loading: true,
|
||||
pictures: [],
|
||||
albums: {},
|
||||
|
||||
async init() {
|
||||
this.pictures = await paginated(picturesFetchPictures, {
|
||||
// biome-ignore lint/style/useNamingConvention: api is in snake_case
|
||||
query: { users_identified: [config.userId] },
|
||||
});
|
||||
this.albums = this.pictures.reduce((acc, picture) => {
|
||||
if (!acc[picture.album]) {
|
||||
acc[picture.album] = [];
|
||||
}
|
||||
acc[picture.album].push(picture);
|
||||
return acc;
|
||||
}, {});
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
async downloadZip() {
|
||||
this.isDownloading = true;
|
||||
const bar = this.$refs.progress;
|
||||
bar.value = 0;
|
||||
bar.max = this.pictures.length;
|
||||
|
||||
const incrementProgressBar = () => {
|
||||
bar.value++;
|
||||
};
|
||||
|
||||
const fileHandle = await showSaveFilePicker({
|
||||
_preferPolyfill: false,
|
||||
suggestedName: interpolate(
|
||||
gettext("pictures.%(extension)s"),
|
||||
{ extension: "zip" },
|
||||
true,
|
||||
),
|
||||
types: {},
|
||||
excludeAcceptAllOption: false,
|
||||
});
|
||||
const zipWriter = new ZipWriter(await fileHandle.createWritable());
|
||||
|
||||
await Promise.all(
|
||||
this.pictures.map((p) => {
|
||||
const imgName = `${p.album}/IMG_${p.date.replaceAll(/[:\-]/g, "_")}${p.name.slice(p.name.lastIndexOf("."))}`;
|
||||
return zipWriter.add(imgName, new HttpReader(p.full_size_url), {
|
||||
level: 9,
|
||||
lastModDate: new Date(p.date),
|
||||
onstart: incrementProgressBar,
|
||||
});
|
||||
}),
|
||||
);
|
||||
|
||||
await zipWriter.close();
|
||||
this.isDownloading = false;
|
||||
},
|
||||
}));
|
||||
});
|
||||
};
|
@ -272,11 +272,14 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.btn-no-text) {
|
||||
i {
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* A spacer below an element. Somewhat cleaner than putting <br/> everywhere.
|
||||
*/
|
||||
|
@ -64,40 +64,6 @@ class TestImageAccess:
|
||||
assert not picture.is_owned_by(user)
|
||||
|
||||
|
||||
@pytest.mark.django_db
|
||||
class TestUserPicture:
|
||||
def test_anonymous_user_unauthorized(self, client):
|
||||
"""An anonymous user shouldn't have access to an user's photo page."""
|
||||
response = client.get(
|
||||
reverse(
|
||||
"core:user_pictures",
|
||||
kwargs={"user_id": User.objects.get(username="sli").pk},
|
||||
)
|
||||
)
|
||||
assert response.status_code == 403
|
||||
|
||||
@pytest.mark.parametrize(
|
||||
("username", "status"),
|
||||
[
|
||||
("guy", 403),
|
||||
("root", 200),
|
||||
("skia", 200),
|
||||
("sli", 200),
|
||||
],
|
||||
)
|
||||
def test_page_is_working(self, client, username, status):
|
||||
"""Only user that subscribed (or admins) should be able to see the page."""
|
||||
# Test for simple user
|
||||
client.force_login(User.objects.get(username=username))
|
||||
response = client.get(
|
||||
reverse(
|
||||
"core:user_pictures",
|
||||
kwargs={"user_id": User.objects.get(username="sli").pk},
|
||||
)
|
||||
)
|
||||
assert response.status_code == status
|
||||
|
||||
|
||||
# TODO: many tests on the pages:
|
||||
# - renaming a page
|
||||
# - changing a page's parent --> check that page's children's full_name
|
||||
|
@ -23,6 +23,7 @@
|
||||
#
|
||||
|
||||
from django.urls import path, re_path, register_converter
|
||||
from django.views.generic import RedirectView
|
||||
|
||||
from core.converters import (
|
||||
BooleanStringConverter,
|
||||
@ -68,7 +69,6 @@ from core.views import (
|
||||
UserGodfathersView,
|
||||
UserListView,
|
||||
UserMiniView,
|
||||
UserPicturesView,
|
||||
UserPreferencesView,
|
||||
UserStatsView,
|
||||
UserToolsView,
|
||||
@ -144,7 +144,8 @@ urlpatterns = [
|
||||
path("user/<int:user_id>/mini/", UserMiniView.as_view(), name="user_profile_mini"),
|
||||
path("user/<int:user_id>/", UserView.as_view(), name="user_profile"),
|
||||
path(
|
||||
"user/<int:user_id>/pictures/", UserPicturesView.as_view(), name="user_pictures"
|
||||
"user/<int:user_id>/pictures/",
|
||||
RedirectView.as_view(pattern_name="sas:user_pictures", permanent=True),
|
||||
),
|
||||
path(
|
||||
"user/<int:user_id>/godfathers/",
|
||||
|
@ -200,7 +200,7 @@ class UserTabsMixin(TabedViewMixin):
|
||||
"name": _("Family"),
|
||||
},
|
||||
{
|
||||
"url": reverse("core:user_pictures", kwargs={"user_id": user.id}),
|
||||
"url": reverse("sas:user_pictures", kwargs={"user_id": user.id}),
|
||||
"slug": "pictures",
|
||||
"name": _("Pictures"),
|
||||
},
|
||||
@ -297,16 +297,6 @@ class UserView(UserTabsMixin, CanViewMixin, DetailView):
|
||||
return kwargs
|
||||
|
||||
|
||||
class UserPicturesView(UserTabsMixin, CanViewMixin, DetailView):
|
||||
"""Display a user's pictures."""
|
||||
|
||||
model = User
|
||||
pk_url_kwarg = "user_id"
|
||||
context_object_name = "profile"
|
||||
template_name = "core/user_pictures.jinja"
|
||||
current_tab = "pictures"
|
||||
|
||||
|
||||
def delete_user_godfather(request, user_id, godfather_id, is_father):
|
||||
user_is_admin = request.user.is_root or request.user.is_board_member
|
||||
if user_id != request.user.id and not user_is_admin:
|
||||
|
@ -6,7 +6,7 @@
|
||||
msgid ""
|
||||
msgstr ""
|
||||
"Report-Msgid-Bugs-To: \n"
|
||||
"POT-Creation-Date: 2025-02-12 15:55+0100\n"
|
||||
"POT-Creation-Date: 2025-02-18 15:03+0100\n"
|
||||
"PO-Revision-Date: 2016-07-18\n"
|
||||
"Last-Translator: Maréchal <thomas.girod@utbm.fr\n"
|
||||
"Language-Team: AE info <ae.info@utbm.fr>\n"
|
||||
@ -935,6 +935,10 @@ msgstr "rôle"
|
||||
msgid "description"
|
||||
msgstr "description"
|
||||
|
||||
#: club/models.py
|
||||
msgid "past member"
|
||||
msgstr "ancien membre"
|
||||
|
||||
#: club/models.py
|
||||
msgid "Email address"
|
||||
msgstr "Adresse email"
|
||||
@ -1425,8 +1429,9 @@ msgstr ""
|
||||
#: com/templates/com/macros.jinja
|
||||
#, python-format
|
||||
msgid ""
|
||||
"This event will take place every week for %(nb)s weeks. If you moderate or delete "
|
||||
"this event, it will also be moderated (or deleted) for the following weeks."
|
||||
"This event will take place every week for %(nb)s weeks. If you moderate or "
|
||||
"delete this event, it will also be moderated (or deleted) for the following "
|
||||
"weeks."
|
||||
msgstr ""
|
||||
"Cet événement se déroulera chaque semaine pendant %(nb)s semaines. Si vous "
|
||||
"modérez ou supprimez cet événement, il sera également modéré (ou supprimé) "
|
||||
@ -3070,20 +3075,6 @@ msgstr "Éditer les groupes pour %(user_name)s"
|
||||
msgid "User list"
|
||||
msgstr "Liste d'utilisateurs"
|
||||
|
||||
#: core/templates/core/user_pictures.jinja
|
||||
#, python-format
|
||||
msgid "%(user_name)s's pictures"
|
||||
msgstr "Photos de %(user_name)s"
|
||||
|
||||
#: core/templates/core/user_pictures.jinja
|
||||
msgid "Download all my pictures"
|
||||
msgstr "Télécharger toutes mes photos"
|
||||
|
||||
#: core/templates/core/user_pictures.jinja sas/templates/sas/album.jinja
|
||||
#: sas/templates/sas/macros.jinja
|
||||
msgid "To be moderated"
|
||||
msgstr "A modérer"
|
||||
|
||||
#: core/templates/core/user_preferences.jinja core/views/user.py
|
||||
msgid "Preferences"
|
||||
msgstr "Préférences"
|
||||
@ -3336,8 +3327,8 @@ msgstr "Nom d'utilisateur, email, ou numéro de compte AE"
|
||||
|
||||
#: core/views/forms.py
|
||||
msgid ""
|
||||
"Profile: you need to be visible on the picture, in order to be recognized (e."
|
||||
"g. by the barmen)"
|
||||
"Profile: you need to be visible on the picture, in order to be recognized "
|
||||
"(e.g. by the barmen)"
|
||||
msgstr ""
|
||||
"Photo de profil: vous devez être visible sur la photo afin d'être reconnu "
|
||||
"(par exemple par les barmen)"
|
||||
@ -3947,8 +3938,8 @@ msgstr ""
|
||||
#: counter/templates/counter/mails/account_dump.jinja
|
||||
msgid "If you think this was a mistake, please mail us at ae@utbm.fr."
|
||||
msgstr ""
|
||||
"Si vous pensez qu'il s'agit d'une erreur, veuillez envoyer un mail à ae@utbm."
|
||||
"fr."
|
||||
"Si vous pensez qu'il s'agit d'une erreur, veuillez envoyer un mail à "
|
||||
"ae@utbm.fr."
|
||||
|
||||
#: counter/templates/counter/mails/account_dump.jinja
|
||||
msgid ""
|
||||
@ -5217,6 +5208,15 @@ msgstr "SAS"
|
||||
msgid "Albums"
|
||||
msgstr "Albums"
|
||||
|
||||
#: sas/templates/sas/album.jinja
|
||||
msgid "Download album"
|
||||
msgstr "Télécharger l'album"
|
||||
|
||||
#: sas/templates/sas/album.jinja sas/templates/sas/macros.jinja
|
||||
#: sas/templates/sas/user_pictures.jinja
|
||||
msgid "To be moderated"
|
||||
msgstr "A modérer"
|
||||
|
||||
#: sas/templates/sas/album.jinja
|
||||
msgid "Upload"
|
||||
msgstr "Envoyer"
|
||||
@ -5286,6 +5286,15 @@ msgstr "Personne(s)"
|
||||
msgid "Identify users on pictures"
|
||||
msgstr "Identifiez les utilisateurs sur les photos"
|
||||
|
||||
#: sas/templates/sas/user_pictures.jinja
|
||||
#, python-format
|
||||
msgid "%(user_name)s's pictures"
|
||||
msgstr "Photos de %(user_name)s"
|
||||
|
||||
#: sas/templates/sas/user_pictures.jinja
|
||||
msgid "Download all my pictures"
|
||||
msgstr "Télécharger toutes mes photos"
|
||||
|
||||
#: sith/settings.py
|
||||
msgid "English"
|
||||
msgstr "Anglais"
|
||||
@ -6022,6 +6031,3 @@ msgstr "Vous ne pouvez plus écrire de commentaires, la date est passée."
|
||||
#, python-format
|
||||
msgid "Maximum characters: %(max_length)s"
|
||||
msgstr "Nombre de caractères max: %(max_length)s"
|
||||
|
||||
#~ msgid "past member"
|
||||
#~ msgstr "ancien membre"
|
||||
|
@ -104,7 +104,7 @@ class PicturesController(ControllerBase):
|
||||
viewed=False,
|
||||
type="NEW_PICTURES",
|
||||
defaults={
|
||||
"url": reverse("core:user_pictures", kwargs={"user_id": u.id})
|
||||
"url": reverse("sas:user_pictures", kwargs={"user_id": u.id})
|
||||
},
|
||||
)
|
||||
|
||||
|
@ -39,6 +39,8 @@ class PictureSchema(ModelSchema):
|
||||
compressed_url: str
|
||||
thumb_url: str
|
||||
album: str
|
||||
report_url: str
|
||||
edit_url: str
|
||||
|
||||
@staticmethod
|
||||
def resolve_sas_url(obj: Picture) -> str:
|
||||
@ -56,6 +58,14 @@ class PictureSchema(ModelSchema):
|
||||
def resolve_thumb_url(obj: Picture) -> str:
|
||||
return obj.get_download_thumb_url()
|
||||
|
||||
@staticmethod
|
||||
def resolve_report_url(obj: Picture) -> str:
|
||||
return reverse("sas:picture_ask_removal", kwargs={"picture_id": obj.id})
|
||||
|
||||
@staticmethod
|
||||
def resolve_edit_url(obj: Picture) -> str:
|
||||
return reverse("sas:picture_edit", kwargs={"picture_id": obj.id})
|
||||
|
||||
|
||||
class PictureRelationCreationSchema(Schema):
|
||||
picture: NonNegativeInt
|
||||
|
@ -1,59 +0,0 @@
|
||||
import { History, initialUrlParams, updateQueryString } from "#core:utils/history";
|
||||
import { picturesFetchPictures } from "#openapi";
|
||||
|
||||
/**
|
||||
* @typedef AlbumConfig
|
||||
* @property {number} albumId id of the album to visualize
|
||||
* @property {number} maxPageSize maximum number of elements to show on a page
|
||||
**/
|
||||
|
||||
/**
|
||||
* Create a family graph of an user
|
||||
* @param {AlbumConfig} config
|
||||
**/
|
||||
window.loadAlbum = (config) => {
|
||||
document.addEventListener("alpine:init", () => {
|
||||
Alpine.data("pictures", () => ({
|
||||
pictures: {},
|
||||
page: Number.parseInt(initialUrlParams.get("page")) || 1,
|
||||
pushstate: History.Push /* Used to avoid pushing a state on a back action */,
|
||||
loading: false,
|
||||
|
||||
async init() {
|
||||
await this.fetchPictures();
|
||||
this.$watch("page", () => {
|
||||
updateQueryString("page", this.page === 1 ? null : this.page, this.pushstate);
|
||||
this.pushstate = History.Push;
|
||||
this.fetchPictures();
|
||||
});
|
||||
|
||||
window.addEventListener("popstate", () => {
|
||||
this.pushstate = History.Replace;
|
||||
this.page =
|
||||
Number.parseInt(new URLSearchParams(window.location.search).get("page")) ||
|
||||
1;
|
||||
});
|
||||
},
|
||||
|
||||
async fetchPictures() {
|
||||
this.loading = true;
|
||||
this.pictures = (
|
||||
await picturesFetchPictures({
|
||||
query: {
|
||||
// biome-ignore lint/style/useNamingConvention: API is in snake_case
|
||||
album_id: config.albumId,
|
||||
page: this.page,
|
||||
// biome-ignore lint/style/useNamingConvention: API is in snake_case
|
||||
page_size: config.maxPageSize,
|
||||
},
|
||||
})
|
||||
).data;
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
nbPages() {
|
||||
return Math.ceil(this.pictures.count / config.maxPageSize);
|
||||
},
|
||||
}));
|
||||
});
|
||||
};
|
58
sas/static/bundled/sas/album-index.ts
Normal file
58
sas/static/bundled/sas/album-index.ts
Normal file
@ -0,0 +1,58 @@
|
||||
import { paginated } from "#core:utils/api";
|
||||
import { History, initialUrlParams, updateQueryString } from "#core:utils/history";
|
||||
import {
|
||||
type PictureSchema,
|
||||
type PicturesFetchPicturesData,
|
||||
picturesFetchPictures,
|
||||
} from "#openapi";
|
||||
|
||||
interface AlbumConfig {
|
||||
albumId: number;
|
||||
maxPageSize: number;
|
||||
}
|
||||
|
||||
document.addEventListener("alpine:init", () => {
|
||||
Alpine.data("pictures", (config: AlbumConfig) => ({
|
||||
pictures: [] as PictureSchema[],
|
||||
page: Number.parseInt(initialUrlParams.get("page")) || 1,
|
||||
pushstate: History.Push /* Used to avoid pushing a state on a back action */,
|
||||
loading: false,
|
||||
|
||||
async init() {
|
||||
await this.fetchPictures();
|
||||
this.$watch("page", () => {
|
||||
updateQueryString("page", this.page === 1 ? null : this.page, this.pushstate);
|
||||
this.pushstate = History.Push;
|
||||
});
|
||||
|
||||
window.addEventListener("popstate", () => {
|
||||
this.pushstate = History.Replace;
|
||||
this.page =
|
||||
Number.parseInt(new URLSearchParams(window.location.search).get("page")) || 1;
|
||||
});
|
||||
this.config = config;
|
||||
},
|
||||
|
||||
getPage(page: number) {
|
||||
return this.pictures.slice(
|
||||
(page - 1) * config.maxPageSize,
|
||||
config.maxPageSize * page,
|
||||
);
|
||||
},
|
||||
|
||||
async fetchPictures() {
|
||||
this.loading = true;
|
||||
this.pictures = await paginated(picturesFetchPictures, {
|
||||
query: {
|
||||
// biome-ignore lint/style/useNamingConvention: API is in snake_case
|
||||
album_id: config.albumId,
|
||||
} as PicturesFetchPicturesData["query"],
|
||||
});
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
nbPages() {
|
||||
return Math.ceil(this.pictures.length / config.maxPageSize);
|
||||
},
|
||||
}));
|
||||
});
|
46
sas/static/bundled/sas/pictures-download-index.ts
Normal file
46
sas/static/bundled/sas/pictures-download-index.ts
Normal file
@ -0,0 +1,46 @@
|
||||
import { HttpReader, ZipWriter } from "@zip.js/zip.js";
|
||||
import { showSaveFilePicker } from "native-file-system-adapter";
|
||||
import type { PictureSchema } from "#openapi";
|
||||
|
||||
document.addEventListener("alpine:init", () => {
|
||||
Alpine.data("pictures_download", () => ({
|
||||
isDownloading: false,
|
||||
|
||||
async downloadZip() {
|
||||
this.isDownloading = true;
|
||||
const bar = this.$refs.progress;
|
||||
bar.value = 0;
|
||||
bar.max = this.pictures.length;
|
||||
|
||||
const incrementProgressBar = (_total: number): undefined => {
|
||||
bar.value++;
|
||||
return undefined;
|
||||
};
|
||||
|
||||
const fileHandle = await showSaveFilePicker({
|
||||
_preferPolyfill: false,
|
||||
suggestedName: interpolate(
|
||||
gettext("pictures.%(extension)s"),
|
||||
{ extension: "zip" },
|
||||
true,
|
||||
),
|
||||
excludeAcceptAllOption: false,
|
||||
});
|
||||
const zipWriter = new ZipWriter(await fileHandle.createWritable());
|
||||
|
||||
await Promise.all(
|
||||
this.pictures.map((p: PictureSchema) => {
|
||||
const imgName = `${p.album}/IMG_${p.date.replace(/[:\-]/g, "_")}${p.name.slice(p.name.lastIndexOf("."))}`;
|
||||
return zipWriter.add(imgName, new HttpReader(p.full_size_url), {
|
||||
level: 9,
|
||||
lastModDate: new Date(p.date),
|
||||
onstart: incrementProgressBar,
|
||||
});
|
||||
}),
|
||||
);
|
||||
|
||||
await zipWriter.close();
|
||||
this.isDownloading = false;
|
||||
},
|
||||
}));
|
||||
});
|
39
sas/static/bundled/sas/user/pictures-index.ts
Normal file
39
sas/static/bundled/sas/user/pictures-index.ts
Normal file
@ -0,0 +1,39 @@
|
||||
import { paginated } from "#core:utils/api";
|
||||
import {
|
||||
type PictureSchema,
|
||||
type PicturesFetchPicturesData,
|
||||
picturesFetchPictures,
|
||||
} from "#openapi";
|
||||
|
||||
interface PagePictureConfig {
|
||||
userId: number;
|
||||
}
|
||||
|
||||
document.addEventListener("alpine:init", () => {
|
||||
Alpine.data("user_pictures", (config: PagePictureConfig) => ({
|
||||
loading: true,
|
||||
pictures: [] as PictureSchema[],
|
||||
albums: {} as Record<string, PictureSchema[]>,
|
||||
|
||||
async init() {
|
||||
this.pictures = await paginated(picturesFetchPictures, {
|
||||
query: {
|
||||
// biome-ignore lint/style/useNamingConvention: from python api
|
||||
users_identified: [config.userId],
|
||||
} as PicturesFetchPicturesData["query"],
|
||||
});
|
||||
|
||||
this.albums = this.pictures.reduce(
|
||||
(acc: Record<string, PictureSchema[]>, picture: PictureSchema) => {
|
||||
if (!acc[picture.album]) {
|
||||
acc[picture.album] = [];
|
||||
}
|
||||
acc[picture.album].push(picture);
|
||||
return acc;
|
||||
},
|
||||
{},
|
||||
);
|
||||
this.loading = false;
|
||||
},
|
||||
}));
|
||||
});
|
@ -166,6 +166,13 @@ main {
|
||||
|
||||
border: 1px solid rgba(0, 0, 0, .3);
|
||||
|
||||
>img {
|
||||
object-position: top bottom;
|
||||
object-fit: contain;
|
||||
height: 100%;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
@ -1,12 +1,14 @@
|
||||
{% extends "core/base.jinja" %}
|
||||
{% from 'core/macros.jinja' import paginate_alpine %}
|
||||
{% from "sas/macros.jinja" import download_button %}
|
||||
|
||||
{%- block additional_css -%}
|
||||
<link rel="stylesheet" href="{{ static('sas/css/album.scss') }}">
|
||||
{%- endblock -%}
|
||||
|
||||
{%- block additional_js -%}
|
||||
<script type="module" src="{{ static('bundled/sas/album-index.js') }}"></script>
|
||||
<script type="module" src="{{ static('bundled/sas/album-index.ts') }}"></script>
|
||||
<script type="module" src="{{ static('bundled/sas/pictures-download-index.ts') }}"></script>
|
||||
{%- endblock -%}
|
||||
|
||||
{% block title %}
|
||||
@ -27,7 +29,6 @@
|
||||
{% if is_sas_admin %}
|
||||
<form action="" method="post" enctype="multipart/form-data">
|
||||
{% csrf_token %}
|
||||
|
||||
<div class="album-navbar">
|
||||
<h3>{{ album.get_display_name() }}</h3>
|
||||
|
||||
@ -63,16 +64,22 @@
|
||||
<br>
|
||||
{% endif %}
|
||||
|
||||
<div x-data="pictures">
|
||||
<div x-data="pictures({
|
||||
albumId: {{ album.id }},
|
||||
maxPageSize: {{ settings.SITH_SAS_IMAGES_PER_PAGE }},
|
||||
})">
|
||||
|
||||
{{ download_button(_("Download album")) }}
|
||||
|
||||
<h4>{% trans %}Pictures{% endtrans %}</h4>
|
||||
<div class="photos" :aria-busy="loading">
|
||||
<template x-for="picture in pictures.results">
|
||||
<a :href="`/sas/picture/${picture.id}`">
|
||||
<template x-for="picture in getPage(page)">
|
||||
<a :href="picture.sas_url">
|
||||
<div
|
||||
class="photo"
|
||||
:class="{not_moderated: !picture.is_moderated}"
|
||||
:style="`background-image: url(${picture.thumb_url})`"
|
||||
>
|
||||
<img :src="picture.thumb_url" :alt="picture.name" loading="lazy" />
|
||||
<template x-if="!picture.is_moderated">
|
||||
<div class="overlay"> </div>
|
||||
<div class="text">{% trans %}To be moderated{% endtrans %}</div>
|
||||
@ -112,13 +119,6 @@
|
||||
{% block script %}
|
||||
{{ super() }}
|
||||
<script>
|
||||
window.addEventListener("DOMContentLoaded", () => {
|
||||
loadAlbum({
|
||||
albumId: {{ album.id }},
|
||||
maxPageSize: {{ settings.SITH_SAS_IMAGES_PER_PAGE }},
|
||||
});
|
||||
});
|
||||
|
||||
// Todo: migrate to alpine.js if we have some time
|
||||
$("form#upload_form").submit(function (event) {
|
||||
let formData = new FormData($(this)[0]);
|
||||
@ -225,6 +225,5 @@
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
|
@ -2,15 +2,19 @@
|
||||
<a href="{{ url('sas:album', album_id=a.id) }}">
|
||||
{% if a.file %}
|
||||
{% set img = a.get_download_url() %}
|
||||
{% set src = a.name %}
|
||||
{% elif a.children.filter(is_folder=False, is_moderated=True).exists() %}
|
||||
{% set img = a.children.filter(is_folder=False).first().as_picture.get_download_thumb_url() %}
|
||||
{% set picture = a.children.filter(is_folder=False).first().as_picture %}
|
||||
{% set img = picture.get_download_thumb_url() %}
|
||||
{% set src = picture.name %}
|
||||
{% else %}
|
||||
{% set img = static('core/img/sas.jpg') %}
|
||||
{% set src = "sas.jpg" %}
|
||||
{% endif %}
|
||||
<div
|
||||
class="album{% if not a.is_moderated %} not_moderated{% endif %}"
|
||||
style="background-image: url('{{ img }}');"
|
||||
>
|
||||
<img src="{{ img }}" alt="{{ src }}" loading="lazy" />
|
||||
{% if not a.is_moderated %}
|
||||
<div class="overlay"> </div>
|
||||
<div class="text">{% trans %}To be moderated{% endtrans %}</div>
|
||||
@ -30,3 +34,31 @@
|
||||
<a href="{{ url('sas:album', album_id=file.id) }}">{{ file.get_display_name() }}</a> /
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
{# Helper macro to create a download button for a
|
||||
record of albums with alpine
|
||||
|
||||
This needs to be used inside an alpine environment.
|
||||
Downloaded pictures will be `pictures` from the
|
||||
parent data store.
|
||||
|
||||
Note:
|
||||
This requires importing `bundled/sas/pictures-download-index.ts`
|
||||
|
||||
Parameters:
|
||||
name (str): name displayed on the button
|
||||
#}
|
||||
{% macro download_button(name) %}
|
||||
<div x-data="pictures_download">
|
||||
<div x-show="pictures.length > 0" x-cloak>
|
||||
<button
|
||||
:disabled="isDownloading"
|
||||
class="btn btn-blue {% if name == "" %}btn-no-text{% endif %}"
|
||||
@click="downloadZip()"
|
||||
>
|
||||
<i class="fa fa-download"></i>{{ name }}
|
||||
</button>
|
||||
<progress x-ref="progress" x-show="isDownloading"></progress>
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
@ -114,12 +114,12 @@
|
||||
{% trans %}HD version{% endtrans %}
|
||||
</a>
|
||||
<br>
|
||||
<a class="text danger" :href="`/sas/picture/${currentPicture.id}/report`">
|
||||
<a class="text danger" :href="currentPicture.report_url">
|
||||
{% trans %}Ask for removal{% endtrans %}
|
||||
</a>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<a class="button" :href="`/sas/picture/${currentPicture.id}/edit/`"><i class="fa-regular fa-pen-to-square edit-action"></i></a>
|
||||
<a class="button" :href="currentPicture.edit_url"><i class="fa-regular fa-pen-to-square edit-action"></i></a>
|
||||
<a class="button" href="?rotate_left"><i class="fa-solid fa-rotate-left"></i></a>
|
||||
<a class="button" href="?rotate_right"><i class="fa-solid fa-rotate-right"></i></a>
|
||||
</div>
|
||||
|
@ -1,11 +1,13 @@
|
||||
{% extends "core/base.jinja" %}
|
||||
{% from "sas/macros.jinja" import download_button %}
|
||||
|
||||
{%- block additional_css -%}
|
||||
<link rel="stylesheet" href="{{ static('sas/css/album.scss') }}">
|
||||
{%- endblock -%}
|
||||
|
||||
{% block additional_js %}
|
||||
<script type="module" src="{{ static('bundled/user/pictures-index.js') }}"></script>
|
||||
<script type="module" src="{{ static('bundled/sas/user/pictures-index.ts') }}"></script>
|
||||
<script type="module" src="{{ static('bundled/sas/pictures-download-index.ts') }}"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block title %}
|
||||
@ -13,33 +15,28 @@
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<main x-data="user_pictures">
|
||||
<main x-data="user_pictures({ userId: {{ object.id }} })">
|
||||
{% if user.id == object.id %}
|
||||
<div x-show="pictures.length > 0" x-cloak>
|
||||
<button
|
||||
:disabled="isDownloading"
|
||||
class="btn btn-blue"
|
||||
@click="downloadZip()"
|
||||
>
|
||||
<i class="fa fa-download"></i>
|
||||
{% trans %}Download all my pictures{% endtrans %}
|
||||
</button>
|
||||
<progress x-ref="progress" x-show="isDownloading"></progress>
|
||||
</div>
|
||||
{{ download_button(_("Download all my pictures")) }}
|
||||
{% endif %}
|
||||
|
||||
<template x-for="[album, pictures] in Object.entries(albums)" x-cloak>
|
||||
<section>
|
||||
<br />
|
||||
<div class="row">
|
||||
<h4 x-text="album"></h4>
|
||||
{% if user.id == object.id %}
|
||||
{{ download_button("") }}
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="photos">
|
||||
<template x-for="picture in pictures">
|
||||
<a :href="`/sas/picture/${picture.id}`">
|
||||
<a :href="picture.sas_url">
|
||||
<div
|
||||
class="photo"
|
||||
:class="{not_moderated: !picture.is_moderated}"
|
||||
:style="`background-image: url(${picture.thumb_url})`"
|
||||
>
|
||||
<img :src="picture.thumb_url" :alt="picture.name" loading="lazy" />
|
||||
<template x-if="!picture.is_moderated">
|
||||
<div class="overlay"> </div>
|
||||
<div class="text">{% trans %}To be moderated{% endtrans %}</div>
|
||||
@ -56,13 +53,3 @@
|
||||
<div class="photos" :aria-busy="loading"></div>
|
||||
</main>
|
||||
{% endblock content %}
|
||||
|
||||
{% block script %}
|
||||
|
||||
{{ super() }}
|
||||
<script>
|
||||
window.addEventListener("DOMContentLoaded", () => {
|
||||
loadPicturePage({ userId: {{ object.id }} });
|
||||
})
|
||||
</script>
|
||||
{% endblock script %}
|
@ -171,3 +171,37 @@ class TestSasModeration(TestCase):
|
||||
"Vous avez déjà déposé une demande de retrait pour cette photo.</li></ul>",
|
||||
res.content.decode(),
|
||||
)
|
||||
|
||||
|
||||
@pytest.mark.django_db
|
||||
class TestUserPicture:
|
||||
def test_anonymous_user_unauthorized(self, client):
|
||||
"""An anonymous user shouldn't have access to an user's photo page."""
|
||||
response = client.get(
|
||||
reverse(
|
||||
"sas:user_pictures",
|
||||
kwargs={"user_id": User.objects.get(username="sli").pk},
|
||||
)
|
||||
)
|
||||
assert response.status_code == 403
|
||||
|
||||
@pytest.mark.parametrize(
|
||||
("username", "status"),
|
||||
[
|
||||
("guy", 403),
|
||||
("root", 200),
|
||||
("skia", 200),
|
||||
("sli", 200),
|
||||
],
|
||||
)
|
||||
def test_page_is_working(self, client, username, status):
|
||||
"""Only user that subscribed (or admins) should be able to see the page."""
|
||||
# Test for simple user
|
||||
client.force_login(User.objects.get(username=username))
|
||||
response = client.get(
|
||||
reverse(
|
||||
"sas:user_pictures",
|
||||
kwargs={"user_id": User.objects.get(username="sli").pk},
|
||||
)
|
||||
)
|
||||
assert response.status_code == status
|
||||
|
@ -24,6 +24,7 @@ from sas.views import (
|
||||
PictureEditView,
|
||||
PictureView,
|
||||
SASMainView,
|
||||
UserPicturesView,
|
||||
send_album,
|
||||
send_compressed,
|
||||
send_pict,
|
||||
@ -55,4 +56,7 @@ urlpatterns = [
|
||||
name="download_compressed",
|
||||
),
|
||||
path("picture/<int:picture_id>/download/thumb/", send_thumb, name="download_thumb"),
|
||||
path(
|
||||
"user/<int:user_id>/pictures/", UserPicturesView.as_view(), name="user_pictures"
|
||||
),
|
||||
]
|
||||
|
11
sas/views.py
11
sas/views.py
@ -26,6 +26,7 @@ from django.views.generic.edit import FormMixin, FormView, UpdateView
|
||||
from core.auth.mixins import CanEditMixin, CanViewMixin
|
||||
from core.models import SithFile, User
|
||||
from core.views.files import FileView, send_file
|
||||
from core.views.user import UserTabsMixin
|
||||
from sas.forms import (
|
||||
AlbumEditForm,
|
||||
PictureEditForm,
|
||||
@ -193,6 +194,16 @@ class AlbumView(CanViewMixin, DetailView, FormMixin):
|
||||
return kwargs
|
||||
|
||||
|
||||
class UserPicturesView(UserTabsMixin, CanViewMixin, DetailView):
|
||||
"""Display a user's pictures."""
|
||||
|
||||
model = User
|
||||
pk_url_kwarg = "user_id"
|
||||
context_object_name = "profile"
|
||||
template_name = "sas/user_pictures.jinja"
|
||||
current_tab = "pictures"
|
||||
|
||||
|
||||
# Admin views
|
||||
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user