[FEAT] basic pop-up and upload a single file (can not read)
This commit is contained in:
parent
08eb0f878a
commit
725cd54d92
@ -10,17 +10,13 @@ import java.util.UUID;
|
||||
import org.glassfish.jersey.media.multipart.FormDataContentDisposition;
|
||||
import org.glassfish.jersey.media.multipart.FormDataParam;
|
||||
import org.kar.archidata.annotation.AsyncType;
|
||||
import org.kar.archidata.annotation.FormDataOptional;
|
||||
import org.kar.archidata.annotation.TypeScriptProgress;
|
||||
import org.kar.archidata.dataAccess.DataAccess;
|
||||
import org.kar.archidata.dataAccess.QueryCondition;
|
||||
import org.kar.archidata.dataAccess.addOn.AddOnDataJson;
|
||||
import org.kar.archidata.dataAccess.addOn.AddOnManyToMany;
|
||||
import org.kar.archidata.dataAccess.options.Condition;
|
||||
import org.kar.archidata.model.Data;
|
||||
import org.kar.archidata.tools.DataTools;
|
||||
import org.kar.karusic.model.Album;
|
||||
import org.kar.karusic.model.Artist;
|
||||
import org.kar.karusic.model.Gender;
|
||||
import org.kar.karusic.model.Track;
|
||||
import org.slf4j.Logger;
|
||||
import org.slf4j.LoggerFactory;
|
||||
@ -66,7 +62,8 @@ public class TrackResource {
|
||||
@Path("{id}")
|
||||
@RolesAllowed("ADMIN")
|
||||
@Consumes(MediaType.APPLICATION_JSON)
|
||||
public Track patch(@PathParam("id") final Long id, @AsyncType(Track.class) final String jsonRequest) throws Exception {
|
||||
public Track patch(@PathParam("id") final Long id, @AsyncType(Track.class) final String jsonRequest)
|
||||
throws Exception {
|
||||
DataAccess.updateWithJson(Track.class, id, jsonRequest);
|
||||
return DataAccess.get(Track.class, id);
|
||||
}
|
||||
@ -90,7 +87,8 @@ public class TrackResource {
|
||||
@DELETE
|
||||
@Path("{id}/artist/{trackId}")
|
||||
@RolesAllowed("ADMIN")
|
||||
public Track removeTrack(@PathParam("id") final Long id, @PathParam("artistId") final Long artistId) throws Exception {
|
||||
public Track removeTrack(@PathParam("id") final Long id, @PathParam("artistId") final Long artistId)
|
||||
throws Exception {
|
||||
AddOnManyToMany.removeLink(Track.class, id, "artist", artistId);
|
||||
return DataAccess.get(Track.class, id);
|
||||
}
|
||||
@ -113,7 +111,8 @@ public class TrackResource {
|
||||
@DELETE
|
||||
@Path("{id}/cover/{coverId}")
|
||||
@RolesAllowed("ADMIN")
|
||||
public Track removeCover(@PathParam("id") final Long id, @PathParam("coverId") final UUID coverId) throws Exception {
|
||||
public Track removeCover(@PathParam("id") final Long id, @PathParam("coverId") final UUID coverId)
|
||||
throws Exception {
|
||||
AddOnDataJson.removeLink(Track.class, id, "covers", coverId);
|
||||
return DataAccess.get(Track.class, id);
|
||||
}
|
||||
@ -125,32 +124,29 @@ public class TrackResource {
|
||||
// Formatter:off
|
||||
@AsyncType(Track.class)
|
||||
@TypeScriptProgress
|
||||
public Response uploadTrack(@FormDataParam("fileName") String fileName, //
|
||||
@FormDataParam("gender") String gender, //
|
||||
@FormDataParam("artist") String artist, //
|
||||
// @FormDataParam("seriesId") String seriesId, Not used ...
|
||||
@FormDataParam("album") String album, //
|
||||
@AsyncType(Long.class) @FormDataParam("trackId") String trackId, //
|
||||
public Response uploadTrack( //
|
||||
@FormDataParam("title") String title, //
|
||||
@FormDataOptional @AsyncType(Long.class) @FormDataParam("genderId") String genderId, //
|
||||
@FormDataOptional @AsyncType(Long.class) @FormDataParam("artistId") String artistId, //
|
||||
@FormDataOptional @AsyncType(Long.class) @FormDataParam("albumId") String albumId, //
|
||||
@FormDataOptional @AsyncType(Long.class) @FormDataParam("trackId") String trackId, //
|
||||
@FormDataParam("file") final InputStream fileInputStream, //
|
||||
@FormDataParam("file") final FormDataContentDisposition fileMetaData //
|
||||
) {
|
||||
// Formatter:on
|
||||
try {
|
||||
// correct input string stream :
|
||||
fileName = DataTools.multipartCorrection(fileName);
|
||||
gender = DataTools.multipartCorrection(gender);
|
||||
artist = DataTools.multipartCorrection(artist);
|
||||
album = DataTools.multipartCorrection(album);
|
||||
trackId = DataTools.multipartCorrection(trackId);
|
||||
albumId = DataTools.multipartCorrection(albumId);
|
||||
artistId = DataTools.multipartCorrection(artistId);
|
||||
genderId = DataTools.multipartCorrection(genderId);
|
||||
title = DataTools.multipartCorrection(title);
|
||||
|
||||
// public NodeSmall uploadFile(final FormDataMultiPart form) {
|
||||
LOGGER.info("Upload media file: " + fileMetaData);
|
||||
LOGGER.info(" > fileName: " + fileName);
|
||||
LOGGER.info(" > gender: " + gender);
|
||||
LOGGER.info(" > artist: " + artist);
|
||||
LOGGER.info(" > album: " + album);
|
||||
LOGGER.info(" > genderId: " + genderId);
|
||||
LOGGER.info(" > artistId: " + artistId);
|
||||
LOGGER.info(" > albumId: " + albumId);
|
||||
LOGGER.info(" > trackId: " + trackId);
|
||||
LOGGER.info(" > title: " + title);
|
||||
LOGGER.info(" > fileInputStream: " + fileInputStream);
|
||||
@ -164,7 +160,7 @@ public class TrackResource {
|
||||
LOGGER.info("Need to add the data in the BDD ... ");
|
||||
|
||||
try {
|
||||
data = DataTools.createNewData(tmpUID, fileName, sha512);
|
||||
data = DataTools.createNewData(tmpUID, fileMetaData.getFileName(), sha512);
|
||||
} catch (final IOException ex) {
|
||||
DataTools.removeTemporaryFile(tmpUID);
|
||||
ex.printStackTrace();
|
||||
@ -181,60 +177,18 @@ public class TrackResource {
|
||||
} else {
|
||||
LOGGER.info("Data already exist ... all good");
|
||||
}
|
||||
// Fist step: retrieve all the Id of each parents:...
|
||||
LOGGER.info("Find typeNode");
|
||||
Gender genderElem = null;
|
||||
if (gender != null) {
|
||||
genderElem = DataAccess.getWhere(Gender.class, new Condition(new QueryCondition("name", "=", gender)));
|
||||
if (genderElem == null) {
|
||||
genderElem = new Gender();
|
||||
genderElem.name = gender;
|
||||
genderElem = DataAccess.insert(genderElem);
|
||||
}
|
||||
}
|
||||
// NodeSmall typeNode = TypeResource.getWithId(Long.parseLong(typeId));
|
||||
// if (typeNode == null) {
|
||||
// DataTools.removeTemporaryFile(tmpUID);
|
||||
// return Response.notModified("TypeId does not exist ...").build();
|
||||
// }
|
||||
LOGGER.info(" ==> genderElem={}", genderElem);
|
||||
|
||||
Artist artistElem = null;
|
||||
if (artist != null) {
|
||||
LOGGER.info(" Try to find Artist: '{}'", artist);
|
||||
artistElem = DataAccess.getWhere(Artist.class, new Condition(new QueryCondition("name", "=", artist)));
|
||||
if (artistElem == null) {
|
||||
LOGGER.info(" ** Create a new one...");
|
||||
artistElem = new Artist();
|
||||
artistElem.name = artist;
|
||||
artistElem = DataAccess.insert(artistElem);
|
||||
}
|
||||
}
|
||||
LOGGER.info(" ==> artistElem={}", artistElem);
|
||||
|
||||
Album albumElem = null;
|
||||
if (album != null) {
|
||||
albumElem = DataAccess.getWhere(Album.class, new Condition(new QueryCondition("name", "=", album)));
|
||||
if (albumElem == null) {
|
||||
albumElem = new Album();
|
||||
albumElem.name = album;
|
||||
albumElem = DataAccess.insert(albumElem);
|
||||
}
|
||||
}
|
||||
LOGGER.info(" ==> " + album);
|
||||
|
||||
LOGGER.info("add media");
|
||||
|
||||
Track trackElem = new Track();
|
||||
trackElem.name = title;
|
||||
trackElem.track = trackId != null ? Long.parseLong(trackId) : null;
|
||||
trackElem.albumId = albumElem != null ? albumElem.id : null;
|
||||
trackElem.genderId = genderElem != null ? genderElem.id : null;
|
||||
trackElem.albumId = albumId != null ? Long.parseLong(albumId) : null;
|
||||
trackElem.genderId = genderId != null ? Long.parseLong(genderId) : null;
|
||||
trackElem.dataId = data.uuid;
|
||||
// Now list of artist has an internal management:
|
||||
if (artistElem != null) {
|
||||
if (artistId != null) {
|
||||
trackElem.artists = new ArrayList<>();
|
||||
trackElem.artists.add(artistElem.id);
|
||||
trackElem.artists.add(artistId != null ? Long.parseLong(artistId) : null);
|
||||
}
|
||||
trackElem = DataAccess.insert(trackElem);
|
||||
/* Old mode of artist insertion (removed due to the slowlest request of getting value if (artistElem != null) { DataAccess.addLink(Track.class, trackElem.id, "artist", artistElem.id); } */
|
||||
|
||||
@ -228,12 +228,11 @@ export namespace TrackResource {
|
||||
}: {
|
||||
restConfig: RESTConfig,
|
||||
data: {
|
||||
fileName: string,
|
||||
file: File,
|
||||
gender: string,
|
||||
artist: string,
|
||||
album: string,
|
||||
trackId: Long,
|
||||
trackId?: Long,
|
||||
genderId?: Long,
|
||||
albumId?: Long,
|
||||
artistId?: Long,
|
||||
title: string,
|
||||
},
|
||||
callbacks?: RESTCallbacks,
|
||||
|
||||
@ -86,6 +86,10 @@ export const useFormidable = <TYPE extends object = object>({
|
||||
setIsModify,
|
||||
setIsFormModified,
|
||||
]);
|
||||
const reset = useCallback(() => {
|
||||
setValues({ ...initialData });
|
||||
},
|
||||
[setValues, initialData]);
|
||||
const setValuesExternal = useCallback(
|
||||
(data: object) => {
|
||||
//console.log(`FORMIDABLE: setValuesExternal(${JSON.stringify(data)}) ==> keys=${Object.keys(data)}`);
|
||||
@ -151,12 +155,13 @@ export const useFormidable = <TYPE extends object = object>({
|
||||
[isModify, values]
|
||||
);
|
||||
return {
|
||||
values,
|
||||
isModify,
|
||||
isFormModified,
|
||||
setValues: setValuesExternal,
|
||||
getDeltaData,
|
||||
isFormModified,
|
||||
isModify,
|
||||
reset,
|
||||
restoreValue,
|
||||
setValues: setValuesExternal,
|
||||
values,
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
92
front/src/components/popup/PopUpUploadProgress.tsx
Normal file
92
front/src/components/popup/PopUpUploadProgress.tsx
Normal file
@ -0,0 +1,92 @@
|
||||
import { ReactElement, useRef, useState } from 'react';
|
||||
|
||||
import {
|
||||
Button,
|
||||
Flex,
|
||||
Modal,
|
||||
ModalBody,
|
||||
ModalCloseButton,
|
||||
ModalContent,
|
||||
ModalFooter,
|
||||
ModalHeader,
|
||||
ModalOverlay,
|
||||
Progress,
|
||||
Text,
|
||||
useDisclosure,
|
||||
} from '@chakra-ui/react';
|
||||
import {
|
||||
MdAdminPanelSettings,
|
||||
MdDeleteForever,
|
||||
MdEdit,
|
||||
MdWarning,
|
||||
} from 'react-icons/md';
|
||||
import { useNavigate, useParams } from 'react-router-dom';
|
||||
|
||||
import { Artist, ArtistResource } from '@/back-api';
|
||||
import { FormCovers } from '@/components/form/FormCovers';
|
||||
import { FormGroup } from '@/components/form/FormGroup';
|
||||
import { FormInput } from '@/components/form/FormInput';
|
||||
import { FormTextarea } from '@/components/form/FormTextarea';
|
||||
import { useFormidable } from '@/components/form/Formidable';
|
||||
import { ConfirmPopUp } from '@/components/popup/ConfirmPopUp';
|
||||
import { useArtistService, useSpecificArtist } from '@/service/Artist';
|
||||
import { useServiceContext } from '@/service/ServiceContext';
|
||||
import { useCountTracksOfAnArtist } from '@/service/Track';
|
||||
import { isNullOrUndefined } from '@/utils/validator';
|
||||
|
||||
export type PopUpUploadProgressProps = {
|
||||
title: string;
|
||||
// current size send or receive
|
||||
currentSize: number;
|
||||
// Total size to transfer
|
||||
totalSize: number;
|
||||
// index of the file to transfer
|
||||
index: number;
|
||||
// List of element to Transfer
|
||||
elements: string[];
|
||||
onAbort: () => void;
|
||||
onClose: () => void;
|
||||
};
|
||||
|
||||
export const PopUpUploadProgress = ({
|
||||
title,
|
||||
currentSize,
|
||||
totalSize,
|
||||
index,
|
||||
elements,
|
||||
onAbort,
|
||||
onClose,
|
||||
}: PopUpUploadProgressProps) => {
|
||||
const disclosure = useDisclosure();
|
||||
const initialRef = useRef(null);
|
||||
const finalRef = useRef(null);
|
||||
return (
|
||||
<Modal
|
||||
initialFocusRef={initialRef}
|
||||
finalFocusRef={finalRef}
|
||||
closeOnOverlayClick={false}
|
||||
onClose={onClose}
|
||||
isOpen={true}
|
||||
>
|
||||
<ModalOverlay />
|
||||
<ModalContent>
|
||||
<ModalHeader>{title}</ModalHeader>
|
||||
<ModalCloseButton ref={finalRef} />
|
||||
|
||||
<ModalBody pb={6} paddingLeft="18px">
|
||||
<Flex direction="column" gap="10px">
|
||||
<Text fontSize="20px" fontWeight="bold">[{index}/{elements.length}] {elements[index]}</Text>
|
||||
<Progress colorScheme='green' hasStripe value={currentSize} isAnimated max={totalSize} height='24px' />
|
||||
<Flex><Text>{currentSize.toLocaleString('fr-FR')} Bytes</Text><Text marginLeft="auto">{totalSize.toLocaleString('fr-FR')} Bytes</Text></Flex>
|
||||
</Flex>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button colorScheme="red" mr={3} onClick={onAbort} ref={initialRef}>
|
||||
Abort
|
||||
</Button>
|
||||
<Button onClick={onClose}>Close</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
@ -50,10 +50,9 @@ export const SelectSingle = ({
|
||||
onCreate ? suggestion : undefined
|
||||
);
|
||||
useEffect(() => {
|
||||
if (suggestion) {
|
||||
setCurrentSearch(suggestion);
|
||||
setHasSuggestion(true);
|
||||
}
|
||||
console.log(`Update suggestion : ${onCreate} ${suggestion} ==> ${onCreate ? suggestion : undefined} .. ${onCreate && !isNullOrUndefined(suggestion) ? true : false}`);
|
||||
setCurrentSearch(onCreate ? suggestion : undefined);
|
||||
setHasSuggestion(onCreate && !isNullOrUndefined(suggestion) ? true : false);
|
||||
}, [suggestion]);
|
||||
const refFocus = ref ?? useRef<HTMLInputElement | null>(null);
|
||||
const selectedOptions = useMemo(() => {
|
||||
@ -111,7 +110,7 @@ export const SelectSingle = ({
|
||||
onFocus={() => setShowList(true)}
|
||||
onBlur={() => setTimeout(() => setShowList(false), 200)}
|
||||
value={
|
||||
showList ? (currentSearch ?? '') : (selectedOptions?.name ?? hasSuggestion ? `suggest: ${currentSearch}` : '')
|
||||
showList ? (currentSearch ?? '') : (selectedOptions?.name ?? (hasSuggestion ? `suggest: ${currentSearch}` : ''))
|
||||
}
|
||||
backgroundColor={
|
||||
showList || !selectedOptions ? undefined : 'green.500'
|
||||
|
||||
@ -1,8 +1,9 @@
|
||||
import { Album, AlbumResource, Artist, ArtistResource, Gender, GenderResource } from '@/back-api';
|
||||
import { Album, AlbumResource, Artist, ArtistResource, Gender, GenderResource, RestErrorResponse, Track, TrackResource } from '@/back-api';
|
||||
import { useFormidable } from '@/components/form/Formidable';
|
||||
import { FormInput } from '@/components/form/FormInput';
|
||||
import { FormSelect } from '@/components/form/FormSelect';
|
||||
import { PageLayout } from '@/components/Layout/PageLayout';
|
||||
import { PopUpUploadProgress } from '@/components/popup/PopUpUploadProgress';
|
||||
import { TopBar } from '@/components/TopBar/TopBar';
|
||||
import { useAlbumService, useOrderedAlbums } from '@/service/Album';
|
||||
import { useArtistService, useOrderedArtists } from '@/service/Artist';
|
||||
@ -47,7 +48,7 @@ export class FileFailParsedElement {
|
||||
|
||||
type FormInsertData = {
|
||||
genderId?: number;
|
||||
artistId?: number[];
|
||||
artistId?: number;
|
||||
titleAlbum?: string;
|
||||
}
|
||||
|
||||
@ -57,17 +58,8 @@ export const AddPage = () => {
|
||||
const [parsedElement, setParsedElement] = useState<FileParsedElement[]>([]);
|
||||
const [parsedFailedElement, setParsedFailedElement] = useState<FileFailParsedElement[] | undefined>(undefined);
|
||||
|
||||
const [uploadFileValue, setUploadFileValue] = useState<string>('');
|
||||
const [selectedFiles, setSelectedFiles] = useState<FileList | undefined>(undefined);
|
||||
const [genderId, setGenderId] = useState<number | undefined>(undefined);
|
||||
const [artistId, setArtistId] = useState<number | undefined>(undefined);
|
||||
const [albumId, setAlbumId] = useState<number | undefined>(undefined);
|
||||
const [needSend, setNeedSend] = useState<boolean>(false);
|
||||
|
||||
const [globalGender, setGlobalGender] = useState<string | undefined>(undefined);
|
||||
const [globalArtist, setGlobalArtist] = useState<string | undefined>(undefined);
|
||||
const [globalAlbum, setGlobalAlbum] = useState<string | undefined>(undefined);
|
||||
|
||||
// list of all files already registered in the bdd to compare with the current list of files.
|
||||
const [listFileInBdd, setListFileInBdd] = useState<any[] | undefined>(undefined);
|
||||
|
||||
@ -79,6 +71,8 @@ export const AddPage = () => {
|
||||
const { store: storeAlbum } = useAlbumService();
|
||||
const { session } = useServiceContext();
|
||||
|
||||
const form = useFormidable<FormInsertData>({});
|
||||
|
||||
const updateNeedSend = () => {
|
||||
if (parsedElement.length === 0) {
|
||||
setNeedSend(false);
|
||||
@ -93,107 +87,8 @@ export const AddPage = () => {
|
||||
setNeedSend(tmp);
|
||||
}
|
||||
|
||||
const onGender = (value: any): void => {
|
||||
// this.globalGender = value;
|
||||
// let self = this;
|
||||
// if (this.globalGender !== '') {
|
||||
// this.genderService.getLike(this.globalGender)
|
||||
// .then((response: any[]) => {
|
||||
// console.log(`find element: ${response.length}`);
|
||||
// for (let iii = 0; iii < response.length; iii++) {
|
||||
// console.log(` - ${JSON.stringify(response[iii])}`);
|
||||
// }
|
||||
// if (response.length === 0) {
|
||||
// self.genderId = undefined;
|
||||
// } else if (response.length === 1) {
|
||||
// self.genderId = response[0].id;
|
||||
// }
|
||||
// }).catch((response) => {
|
||||
// console.log('CAN NOT find element: ');
|
||||
// self.genderId = undefined;
|
||||
// });
|
||||
// }
|
||||
// updateNeedSend();
|
||||
}
|
||||
|
||||
|
||||
const onChangeGender = (value: any): void => {
|
||||
// this.globalGender = value;
|
||||
// if (!isNullOrUndefined(value)) {
|
||||
// for (let iii = 0; iii < this.listGender.length; iii++) {
|
||||
// if (this.listGender[iii].value === value) {
|
||||
// this.globalGender = this.listGender[iii].label;
|
||||
// break;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// updateNeedSend();
|
||||
}
|
||||
|
||||
const updateTheListOfAlbum = () => {
|
||||
// this.listAlbum = [{ value: null, label: '---' }];
|
||||
// if (isNullOrUndefined(this.artistId)) {
|
||||
// return;
|
||||
// }
|
||||
// let self = this;
|
||||
// this.trackService.getAlbumIdsOfAnArtist(this.artistId)
|
||||
// .then((listAlbumIds: number[]) => {
|
||||
// this.albumService.getAll(listAlbumIds)
|
||||
// .then((response2) => {
|
||||
// for (let iii = 0; iii < response2.length; iii++) {
|
||||
// self.listAlbum.push({ value: response2[iii].id, label: response2[iii].name });
|
||||
// }
|
||||
// }).catch((response2) => {
|
||||
// console.log(`get response22 : ${JSON.stringify(response2, null, 2)}`);
|
||||
// });
|
||||
// });
|
||||
}
|
||||
const onArtist = (value: any): void => {
|
||||
// this.globalArtist = value;
|
||||
// let self = this;
|
||||
// if (this.globalArtist !== '') {
|
||||
// console.log(`update artist List Element: ${this.globalArtist}`);
|
||||
// this.artistService.getLike(this.globalArtist)
|
||||
// .then((response: any[]) => {
|
||||
// console.log(` ==> find artist like ${this.globalArtist} : ${JSON.stringify(response, null, 2)}`);
|
||||
// if (response.length === 0) {
|
||||
// self.artistId = undefined;
|
||||
// } else if (response.length === 1) {
|
||||
// self.artistId = response[0].id;
|
||||
// self.updateTheListOfAlbum();
|
||||
// }
|
||||
// if (!isNullOrUndefined(this.globalAlbum)) {
|
||||
// this.onAlbum(this.globalAlbum)
|
||||
// } else {
|
||||
// self.updateListOfTrackToCheck();
|
||||
// }
|
||||
// }).catch((response) => {
|
||||
// console.log(` ==> CAN NOT find artist like ${this.globalArtist} : ${response.length}`);
|
||||
// self.artistId = undefined;
|
||||
// });
|
||||
// }
|
||||
// updateNeedSend();
|
||||
}
|
||||
const onChangeArtist = (value: any): void => {
|
||||
// this.artistId = value;
|
||||
// if (!isNullOrUndefined(value)) {
|
||||
// for (let iii = 0; iii < this.listArtist.length; iii++) {
|
||||
// if (this.listArtist[iii].value === value) {
|
||||
// this.globalArtist = this.listArtist[iii].label;
|
||||
// break;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// updateNeedSend();
|
||||
// updateListOfTrackToCheck();
|
||||
}
|
||||
const onAlbum = (value: any): void => {
|
||||
// this.globalAlbum = value;
|
||||
// // console.log("change episode ID: " + value + " ==> " + this.parseAlbum.toString());
|
||||
// updateNeedSend();
|
||||
// updateListOfTrackToCheck();
|
||||
}
|
||||
|
||||
const onTitle = (data: FileParsedElement, value: any): void => {
|
||||
data.title = value;
|
||||
setParsedElement([...parsedElement]);
|
||||
@ -216,22 +111,17 @@ export const AddPage = () => {
|
||||
const onTrackId = (data: FileParsedElement, value: any): void => {
|
||||
data.trackId = value;
|
||||
setParsedElement([...parsedElement]);
|
||||
// // console.log("change episode ID: " + value + " ==> " + this.parseEpisode.toString());
|
||||
updateNeedSend();
|
||||
}
|
||||
|
||||
|
||||
const clearData = () => {
|
||||
setGlobalGender(undefined);
|
||||
setGlobalArtist(undefined);
|
||||
setGlobalAlbum(undefined);
|
||||
setParsedElement([]);
|
||||
setParsedFailedElement(undefined);
|
||||
setListFileInBdd(undefined);
|
||||
|
||||
setGenderId(undefined);
|
||||
setArtistId(undefined);
|
||||
setAlbumId(undefined);
|
||||
setSuggestedArtist(undefined);
|
||||
setSuggestedAlbum(undefined);
|
||||
}
|
||||
|
||||
const addFileWithMetaData = (file: File) => {
|
||||
@ -241,6 +131,8 @@ export const AddPage = () => {
|
||||
let trackIdNumber: number | undefined = undefined;
|
||||
let title: string = '';
|
||||
|
||||
form.reset();
|
||||
|
||||
console.log(`select file ${file.name}`);
|
||||
let tmpName = file.name.replace(/[ \t]*-[ \t]*/g, '-');
|
||||
//tmpName = tmpName.replace(/_/g, '-');
|
||||
@ -318,7 +210,6 @@ export const AddPage = () => {
|
||||
setParsedFailedElement(parsedFailedElementTmp);
|
||||
console.log(`check : ${JSON.stringify(parsedElementTmp[0])}`)
|
||||
|
||||
setGlobalArtist(parsedElementTmp[0].artist);
|
||||
// find artistId:
|
||||
console.log(`try find artist : ${parsedElementTmp[0].artist}`);
|
||||
let artistFound = false;
|
||||
@ -330,10 +221,11 @@ export const AddPage = () => {
|
||||
}
|
||||
})
|
||||
if (!artistFound) {
|
||||
console.log(` set Suggested artist : ${parsedElementTmp[0].artist}`);
|
||||
setSuggestedArtist(parsedElementTmp[0].artist);
|
||||
} else {
|
||||
setSuggestedArtist(undefined);
|
||||
}
|
||||
|
||||
setGlobalAlbum(parsedElementTmp[0].album);
|
||||
// try to find album
|
||||
console.log(`try find album : ${parsedElementTmp[0].album}`);
|
||||
let albumFound = false;
|
||||
@ -345,201 +237,61 @@ export const AddPage = () => {
|
||||
}
|
||||
})
|
||||
if (!albumFound) {
|
||||
console.log(` set Suggested album : ${parsedElementTmp[0].album}`);
|
||||
setSuggestedAlbum(parsedElementTmp[0].album);
|
||||
}
|
||||
updateNeedSend();
|
||||
setArtistId(undefined);
|
||||
setAlbumId(undefined);
|
||||
onArtist(globalArtist);
|
||||
}
|
||||
|
||||
const [indexUpload, setIndexUpload] = useState<number | undefined>(undefined);
|
||||
const [listValues, setListValues] = useState<string[]>([]);
|
||||
const [currentPosition, setCurrentPosition] = useState<number>(0);
|
||||
const [totalPosition, setTotalPosition] = useState<number>(0);
|
||||
|
||||
function progressUpload(count: number, total: number): void {
|
||||
setTotalPosition(total);
|
||||
setCurrentPosition(count);
|
||||
}
|
||||
|
||||
const uploadNext = (): void => {
|
||||
|
||||
setIndexUpload((previous) => (previous ?? -1 + 1));
|
||||
|
||||
TrackResource.uploadTrack({
|
||||
restConfig: session.getRestConfig(),
|
||||
data: {
|
||||
title: parsedElement[0].title,
|
||||
file: parsedElement[0].file,
|
||||
albumId: form.values['albumId'],
|
||||
artistId: form.values['artistId'],
|
||||
genderId: form.values['genderId'],
|
||||
trackId: parsedElement[0].trackId,
|
||||
}, callbacks: {
|
||||
progressUpload: progressUpload
|
||||
}
|
||||
}).then((data: Track) => {
|
||||
// TODO: add the element in the local base...
|
||||
console.log(`element added: ${JSON.stringify(data, null, 2)}`);
|
||||
}).catch((error: RestErrorResponse) => {
|
||||
// TODO: manage error
|
||||
console.log(`element error: ${JSON.stringify(error, null, 2)}`);
|
||||
});
|
||||
}
|
||||
|
||||
const sendFile = (): void => {
|
||||
// console.log(`Send file requested ... ${this.parsedElement.length}`);
|
||||
// this.upload = new UploadProgress();
|
||||
// // display the upload pop-in
|
||||
// this.popInService.open('popin-upload-progress');
|
||||
// this.globalUpLoad(0, this.parsedElement.length);
|
||||
console.log(`Send file requested ... ${parsedElement.length}`);
|
||||
setListValues(parsedElement.map((element) => element.file.name));
|
||||
uploadNext();
|
||||
}
|
||||
|
||||
const globalUpLoad = (id: number, total: number): void => {
|
||||
// let self = this;
|
||||
// this.uploadFile(this.parsedElement[id], id, total, () => {
|
||||
// let id2 = id + 1;
|
||||
// if (id2 < total) {
|
||||
// self.globalUpLoad(id2, total);
|
||||
// } else {
|
||||
// self.upload.result = 'Media creation done';
|
||||
// }
|
||||
// }, (value: string) => {
|
||||
// self.upload.error = `Error in the upload of the data...${value}`;
|
||||
// });
|
||||
}
|
||||
const uploadFile = (element: FileParsedElement, id: number, total: number, sendDone: any, errorOccurred: any): void => {
|
||||
// let self = this;
|
||||
|
||||
// self.upload.labelMediaTitle = '';
|
||||
// // add gender
|
||||
// /*
|
||||
// if(self.globalGender !== null) {
|
||||
// self.upload.labelMediaTitle = self.upload.labelMediaTitle + self.globalGender;
|
||||
// }
|
||||
// */
|
||||
// // add artist
|
||||
// if (!isNullOrUndefined(self.globalArtist)) {
|
||||
// if (self.upload.labelMediaTitle.length !== 0) {
|
||||
// self.upload.labelMediaTitle = `${self.upload.labelMediaTitle}:`;
|
||||
// }
|
||||
// self.upload.labelMediaTitle = self.upload.labelMediaTitle + self.globalArtist;
|
||||
// }
|
||||
// // add album
|
||||
// if (!isNullOrUndefined(self.globalAlbum) && self.globalAlbum.toString().length !== 0) {
|
||||
// if (self.upload.labelMediaTitle.length !== 0) {
|
||||
// self.upload.labelMediaTitle = `${self.upload.labelMediaTitle}-`;
|
||||
// }
|
||||
// self.upload.labelMediaTitle = `${self.upload.labelMediaTitle}s${self.globalAlbum.toString()}`;
|
||||
// }
|
||||
// // add episode ID
|
||||
// if (!isNullOrUndefined(element.trackId) && element.trackId.toString().length !== 0) {
|
||||
// if (self.upload.labelMediaTitle.length !== 0) {
|
||||
// self.upload.labelMediaTitle = `${self.upload.labelMediaTitle}-`;
|
||||
// }
|
||||
// self.upload.labelMediaTitle = `${self.upload.labelMediaTitle}e${element.trackId.toString()}`;
|
||||
// }
|
||||
// // add title
|
||||
// if (self.upload.labelMediaTitle.length !== 0) {
|
||||
// self.upload.labelMediaTitle = `${self.upload.labelMediaTitle}-`;
|
||||
// }
|
||||
// self.upload.labelMediaTitle = `[${id + 1}/${total}]${self.upload.labelMediaTitle}${element.title}`;
|
||||
|
||||
// self.trackService.uploadFile(element.file,
|
||||
// self.globalGender,
|
||||
// self.globalArtist,
|
||||
// self.globalAlbum,
|
||||
// element.trackId,
|
||||
// element.title,
|
||||
// (count, totalTmp) => {
|
||||
// // console.log("upload : " + count*100/totalTmp);
|
||||
// self.upload.mediaSendSize = count;
|
||||
// self.upload.mediaSize = totalTmp;
|
||||
// })
|
||||
// .then((response) => {
|
||||
// console.log(`get response of track : ${JSON.stringify(response, null, 2)}`);
|
||||
// sendDone();
|
||||
// }).catch((response) => {
|
||||
// // self.error = "Can not get the data";
|
||||
// console.log('Can not add the data in the system...');
|
||||
// errorOccurred(JSON.stringify(response, null, 2));
|
||||
// });
|
||||
function onUploadAbort(): void {
|
||||
//throw new Error('Function not implemented.');
|
||||
}
|
||||
|
||||
const checkSimilarString = (valueA: string, valueB: string): boolean => {
|
||||
// let valueAL = valueA.toLowerCase();
|
||||
// let valueBL = valueB.toLowerCase();
|
||||
// valueAL = valueAL.replace(/[ \t\n\r-_#~@]/g, '');
|
||||
// valueBL = valueBL.replace(/[ \t\n\r-_#~@]/g, '');
|
||||
// if (valueAL === valueBL) {
|
||||
// return true;
|
||||
// }
|
||||
// if (valueAL.startsWith(valueBL)) {
|
||||
// return true;
|
||||
// }
|
||||
// if (valueBL.startsWith(valueAL)) {
|
||||
// return true;
|
||||
// }
|
||||
return false;
|
||||
function OnUploadClose(): void {
|
||||
//throw new Error('Function not implemented.');
|
||||
}
|
||||
|
||||
const checkConcordance = (): void => {
|
||||
// if (isNullOrUndefined(this.parsedElement)) {
|
||||
// return;
|
||||
// }
|
||||
// // ckear checker
|
||||
// for (let iii = 0; iii < this.parsedElement.length; iii++) {
|
||||
// this.parsedElement[iii].nameDetected = false;
|
||||
// this.parsedElement[iii].trackIdDetected = false;
|
||||
// }
|
||||
// if (isNullOrUndefined(this.listFileInBdd)) {
|
||||
// return;
|
||||
// }
|
||||
// for (let iii = 0; iii < this.listFileInBdd.length; iii++) {
|
||||
// this.listFileInBdd[iii].nameDetected = false;
|
||||
// this.listFileInBdd[iii].trackIdDetected = false;
|
||||
// }
|
||||
// for (let iii = 0; iii < this.parsedElement.length; iii++) {
|
||||
// for (let jjj = 0; jjj < this.listFileInBdd.length; jjj++) {
|
||||
// if (this.checkSimilarString(this.parsedElement[iii].title, this.listFileInBdd[jjj].name)) {
|
||||
// this.parsedElement[iii].nameDetected = true;
|
||||
// this.listFileInBdd[jjj].nameDetected = true;
|
||||
// }
|
||||
// if (this.parsedElement[iii].trackId === this.listFileInBdd[jjj].episode) {
|
||||
// this.parsedElement[iii].trackIdDetected = true;
|
||||
// this.listFileInBdd[jjj].trackIdDetected = true;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
const updateListOfTrackToCheck = (): void => {
|
||||
// // No artist ID set ==> nothing to do.
|
||||
// if (isNullOrUndefined(this.artistId)) {
|
||||
// this.listFileInBdd = undefined;
|
||||
// return;
|
||||
// }
|
||||
// let self = this;
|
||||
// // no album check only the artist files.
|
||||
// if (isNullOrUndefined(this.globalAlbum)) {
|
||||
// console.error(`NO ALBUM ==> check artist ID...`);
|
||||
// self.trackService.getTracksOfAnArtist(self.artistId)
|
||||
// .then((response: any[]) => {
|
||||
// self.listFileInBdd = response;
|
||||
// console.error(`find track: ${JSON.stringify(response, null, 2)}`);
|
||||
// // for (let iii = 0; iii<response.length; iii++) {
|
||||
// // console.log(" - " + JSON.stringify(response[iii]));
|
||||
// // }
|
||||
// self.checkConcordance();
|
||||
// }).catch((response) => {
|
||||
// self.listFileInBdd = undefined;
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
|
||||
// self.albumId = undefined;
|
||||
// console.error(`ALBUM ==> check album values...`);
|
||||
// // set 1 find the ID of the album:
|
||||
// this.trackService.getAlbumIdsOfAnArtist(this.artistId)
|
||||
// .then((listAlbumIds: number[]) => {
|
||||
// this.artistService.getAll(listAlbumIds)
|
||||
// .then((response: Artist[]) => {
|
||||
// for (let iii = 0; iii < response.length; iii++) {
|
||||
// // console.log(" - " + JSON.stringify(response[iii]) + 'compare with : ' + JSON.stringify(self.globalAlbum));
|
||||
// if (response[iii].name === `${self.globalAlbum}`) {
|
||||
// self.albumId = response[iii].id;
|
||||
// break;
|
||||
// }
|
||||
// }
|
||||
// if (isNullOrUndefined(self.albumId)) {
|
||||
// return;
|
||||
// }
|
||||
// self.trackService.getTracksWithAlbumId(self.albumId)
|
||||
// .then((response2: any[]) => {
|
||||
// self.listFileInBdd = response2;
|
||||
// console.log(`find album: ${JSON.stringify(response, null, 2)}`);
|
||||
// // console.log("find track: " + response2.length);
|
||||
// // for (let iii = 0; iii<response2.length; iii++) {
|
||||
// // console.log(" - " + JSON.stringify(response2[iii]));
|
||||
// // }
|
||||
// self.checkConcordance();
|
||||
// }).catch((response3) => {
|
||||
// self.listFileInBdd = undefined;
|
||||
// });
|
||||
// })
|
||||
// }).catch((response4) => {
|
||||
// self.listFileInBdd = undefined;
|
||||
// });
|
||||
}
|
||||
|
||||
const form = useFormidable<FormInsertData>({});
|
||||
|
||||
const addNewGender = (data: string): Promise<Gender> => {
|
||||
return storeGender.update(GenderResource.post({
|
||||
restConfig: session.getRestConfig(),
|
||||
@ -565,11 +317,11 @@ export const AddPage = () => {
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<TopBar title="Add new media" />
|
||||
<PageLayout>
|
||||
|
||||
<Flex
|
||||
direction="column"
|
||||
width="80%"
|
||||
@ -685,7 +437,18 @@ export const AddPage = () => {
|
||||
</TableContainer>
|
||||
</>)}
|
||||
</Flex>
|
||||
{indexUpload !== undefined &&
|
||||
<PopUpUploadProgress
|
||||
title="Upload File(s)"
|
||||
currentSize={currentPosition}
|
||||
totalSize={totalPosition}
|
||||
index={indexUpload}
|
||||
elements={listValues}
|
||||
onAbort={onUploadAbort}
|
||||
onClose={OnUploadClose} />
|
||||
}
|
||||
</PageLayout >
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user