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

Apply all biomejs fixes

Browse Source
This commit is contained in:
Antoine Bartuccio
2024-10-08 17:14:22 +02:00
parent 20bea62542
commit 7405241b82
25 changed files with 480 additions and 428 deletions
Download Patch File Download Diff File Expand all files Collapse all files

139
sas/static/sas/js/viewer.js
View File

@ -10,8 +10,8 @@
*/
class PictureWithIdentifications {
identifications = null;
image_loading = false;
identifications_loading = false;
imageLoading = false;
identificationsLoading = false;
/**
* @param {Picture} picture
@ -23,7 +23,7 @@ class PictureWithIdentifications {
/**
* @param {Picture} picture
*/
static from_picture(picture) {
static fromPicture(picture) {
return new PictureWithIdentifications(picture);
}
@ -33,19 +33,19 @@ class PictureWithIdentifications {
* @param {?Object=} options
* @return {Promise<void>}
*/
async load_identifications(options) {
if (this.identifications_loading) {
async loadIdentifications(options) {
if (this.identificationsLoading) {
return; // The users are already being fetched.
}
if (!!this.identifications && !options?.force_reload) {
if (!!this.identifications && !options?.forceReload) {
// The users are already fetched
// and the user does not want to force the reload
return;
}
this.identifications_loading = true;
this.identificationsLoading = true;
const url = `/api/sas/picture/${this.id}/identified`;
this.identifications = await (await fetch(url)).json();
this.identifications_loading = false;
this.identificationsLoading = false;
}
/**
@ -56,12 +56,12 @@ class PictureWithIdentifications {
const img = new Image();
img.src = this.compressed_url;
if (!img.complete) {
this.image_loading = true;
this.imageLoading = true;
img.addEventListener("load", () => {
this.image_loading = false;
this.imageLoading = false;
});
}
await this.load_identifications();
await this.loadIdentifications();
}
}
@ -78,13 +78,18 @@ document.addEventListener("alpine:init", () => {
* when loading the page at the beginning
* @type PictureWithIdentifications
**/
current_picture: {
currentPicture: {
// biome-ignore lint/style/useNamingConvention: json is snake_case
is_moderated: true,
id: null,
name: "",
// biome-ignore lint/style/useNamingConvention: json is snake_case
display_name: "",
// biome-ignore lint/style/useNamingConvention: json is snake_case
compressed_url: "",
// biome-ignore lint/style/useNamingConvention: json is snake_case
profile_url: "",
// biome-ignore lint/style/useNamingConvention: json is snake_case
full_size_url: "",
owner: "",
date: new Date(),
@ -94,12 +99,12 @@ document.addEventListener("alpine:init", () => {
* The picture which will be displayed next if the user press the "next" button
* @type ?PictureWithIdentifications
**/
next_picture: null,
nextPicture: null,
/**
* The picture which will be displayed next if the user press the "previous" button
* @type ?PictureWithIdentifications
**/
previous_picture: null,
previousPicture: null,
/**
* The select2 component used to identify users
**/
@ -111,7 +116,7 @@ document.addEventListener("alpine:init", () => {
* Error message when a moderation operation fails
* @type string
**/
moderation_error: "",
moderationError: "",
/**
* Method of pushing new url to the browser history
* Used by popstate event and always reset to it's default value when used
@ -120,114 +125,119 @@ document.addEventListener("alpine:init", () => {
pushstate: History.PUSH,
async init() {
this.pictures = (await fetch_paginated(picture_endpoint)).map(
PictureWithIdentifications.from_picture,
// biome-ignore lint/correctness/noUndeclaredVariables: Imported from script.js
this.pictures = (await fetchPaginated(pictureEndpoint)).map(
PictureWithIdentifications.fromPicture,
);
// biome-ignore lint/correctness/noUndeclaredVariables: Imported from script.js
this.selector = sithSelect2({
element: $(this.$refs.search),
data_source: remote_data_source("/api/user/search", {
// biome-ignore lint/correctness/noUndeclaredVariables: Imported from script.js
dataSource: remoteDataSource("/api/user/search", {
excluded: () => [
...(this.current_picture.identifications || []).map((i) => i.user.id),
...(this.currentPicture.identifications || []).map((i) => i.user.id),
],
result_converter: (obj) => Object({ ...obj, text: obj.display_name }),
resultConverter: (obj) => new Object({ ...obj, text: obj.display_name }),
}),
picture_getter: (user) => user.profile_pict,
pictureGetter: (user) => user.profile_pict,
});
this.current_picture = this.pictures.find((i) => i.id === first_picture_id);
this.$watch("current_picture", (current, previous) => {
// biome-ignore lint/correctness/noUndeclaredVariables: Imported from picture.jinja
this.currentPicture = this.pictures.find((i) => i.id === firstPictureId);
this.$watch("currentPicture", (current, previous) => {
if (current === previous) {
/* Avoid recursive updates */
return;
}
this.update_picture();
this.updatePicture();
});
window.addEventListener("popstate", async (event) => {
if (!event.state || event.state.sas_picture_id === undefined) {
if (!event.state || event.state.sasPictureId === undefined) {
return;
}
this.pushstate = History.REPLACE;
this.current_picture = this.pictures.find(
(i) => i.id === Number.parseInt(event.state.sas_picture_id),
this.currentPicture = this.pictures.find(
(i) => i.id === Number.parseInt(event.state.sasPictureId),
);
});
this.pushstate = History.REPLACE; /* Avoid first url push */
await this.update_picture();
await this.updatePicture();
},
/**
* Update the page.
* Called when the `current_picture` property changes.
* Called when the `currentPicture` property changes.
*
* The url is modified without reloading the page,
* and the previous picture, the next picture and
* the list of identified users are updated.
*/
async update_picture() {
const update_args = [
{ sas_picture_id: this.current_picture.id },
async updatePicture() {
const updateArgs = [
{ sasPictureId: this.currentPicture.id },
"",
`/sas/picture/${this.current_picture.id}/`,
`/sas/picture/${this.currentPicture.id}/`,
];
if (this.pushstate === History.REPLACE) {
window.history.replaceState(...update_args);
window.history.replaceState(...updateArgs);
this.pushstate = History.PUSH;
} else {
window.history.pushState(...update_args);
window.history.pushState(...updateArgs);
}
this.moderation_error = "";
const index = this.pictures.indexOf(this.current_picture);
this.previous_picture = this.pictures[index - 1] || null;
this.next_picture = this.pictures[index + 1] || null;
await this.current_picture.load_identifications();
this.$refs.main_picture?.addEventListener("load", () => {
this.moderationError = "";
const index = this.pictures.indexOf(this.currentPicture);
this.previousPicture = this.pictures[index - 1] || null;
this.nextPicture = this.pictures[index + 1] || null;
await this.currentPicture.loadIdentifications();
this.$refs.mainPicture?.addEventListener("load", () => {
// once the current picture is loaded,
// start preloading the next and previous pictures
this.next_picture?.preload();
this.previous_picture?.preload();
this.nextPicture?.preload();
this.previousPicture?.preload();
});
},
async moderate_picture() {
const res = await fetch(`/api/sas/picture/${this.current_picture.id}/moderate`, {
async moderatePicture() {
const res = await fetch(`/api/sas/picture/${this.currentPicture.id}/moderate`, {
method: "PATCH",
});
if (!res.ok) {
this.moderation_error = `${gettext("Couldn't moderate picture")} : ${res.statusText}`;
this.moderationError = `${gettext("Couldn't moderate picture")} : ${res.statusText}`;
return;
}
this.current_picture.is_moderated = true;
this.current_picture.asked_for_removal = false;
this.currentPicture.is_moderated = true;
this.currentPicture.askedForRemoval = false;
},
async delete_picture() {
const res = await fetch(`/api/sas/picture/${this.current_picture.id}`, {
async deletePicture() {
const res = await fetch(`/api/sas/picture/${this.currentPicture.id}`, {
method: "DELETE",
});
if (!res.ok) {
this.moderation_error = `${gettext("Couldn't delete picture")} : ${res.statusText}`;
this.moderationError = `${gettext("Couldn't delete picture")} : ${res.statusText}`;
return;
}
this.pictures.splice(this.pictures.indexOf(this.current_picture), 1);
this.pictures.splice(this.pictures.indexOf(this.currentPicture), 1);
if (this.pictures.length === 0) {
// The deleted picture was the only one in the list.
// As the album is now empty, go back to the parent page
document.location.href = album_url;
// biome-ignore lint/correctness/noUndeclaredVariables: imported from picture.jinja
document.location.href = albumUrl;
}
this.current_picture = this.next_picture || this.previous_picture;
this.currentPicture = this.nextPicture || this.previousPicture;
},
/**
* Send the identification request and update the list of identified users.
*/
async submit_identification() {
const url = `/api/sas/picture/${this.current_picture.id}/identified`;
async submitIdentification() {
const url = `/api/sas/picture/${this.currentPicture.id}/identified`;
await fetch(url, {
method: "PUT",
body: JSON.stringify(this.selector.val().map((i) => Number.parseInt(i))),
});
// refresh the identified users list
await this.current_picture.load_identifications({ force_reload: true });
await this.currentPicture.loadIdentifications({ forceReload: true });
this.selector.empty().trigger("change");
},
@ -236,23 +246,22 @@ document.addEventListener("alpine:init", () => {
* @param {PictureIdentification} identification
* @return {boolean}
*/
can_be_removed(identification) {
return user_is_sas_admin || identification.user.id === user_id;
canBeRemoved(identification) {
// biome-ignore lint/correctness/noUndeclaredVariables: imported from picture.jinja
return userIsSasAdmin || identification.user.id === userId;
},
/**
* Untag a user from the current picture
* @param {PictureIdentification} identification
*/
async remove_identification(identification) {
async removeIdentification(identification) {
const res = await fetch(`/api/sas/relation/${identification.id}`, {
method: "DELETE",
});
if (res.ok && Array.isArray(this.current_picture.identifications)) {
this.current_picture.identifications =
this.current_picture.identifications.filter(
(i) => i.id !== identification.id,
);
if (res.ok && Array.isArray(this.currentPicture.identifications)) {
this.currentPicture.identifications =
this.currentPicture.identifications.filter((i) => i.id !== identification.id);
}
},
}));