@@ -252,22 +252,57 @@ document.addEventListener('DOMContentLoaded', function () {
252252 } ) ;
253253 } ) ;
254254
255- const modalParentFolder = document . querySelector ( '#parentFolder' ) ;
255+ const modalParentFolders = document . querySelectorAll ( '#parentFolder' ) ;
256+ const modalExistingFolders = document . querySelector ( '#existingFolder' ) ;
256257 folders . forEach ( ( folder ) => {
257- modalParentFolder . innerHTML += `<option value="${ folder . dataset . folder } ">${ folder . dataset . name } </option>` ;
258+ modalParentFolders . forEach ( ( select ) => {
259+ select . innerHTML += `<option value="${ folder . dataset . folder } ">${ folder . dataset . name } </option>` ;
260+ } ) ;
261+ modalExistingFolders . innerHTML += `<option value="${ folder . dataset . folder } ">${ folder . dataset . name } </option>` ;
262+ } ) ;
263+
264+ const modifyFolderModal = document . querySelector ( '#modifyFolderModal' ) ;
265+ modalExistingFolders . addEventListener ( 'change' , function ( event ) {
266+ let folderId = event . target . value ;
267+ if ( folderId == '0' ) {
268+ modifyFolderModal . querySelector ( '#folderName' ) . value = '' ;
269+ modifyFolderModal . querySelector ( '#parentFolder' ) . value = '0' ;
270+ modifyFolderModal . querySelectorAll ( '.role-checkbox:checked' ) . forEach ( ( cb ) => {
271+ cb . checked = false ;
272+ } ) ;
273+ modifyFolderModal . querySelector ( '#folderColor' ) . value = '#000000' ;
274+ return ;
275+ }
276+ let folderArray = Array . from ( folders ) ;
277+ let folder = folderArray . find ( f => f . dataset . folder == folderId ) ;
278+ modifyFolderModal . querySelector ( '#folderName' ) . value = folder . dataset . name ;
279+ modifyFolderModal . querySelector ( '#parentFolder' ) . value = folder . dataset . parent ;
280+ folder . dataset . roles . split ( ',' ) . forEach ( ( role ) => {
281+ if ( role !== '1' ) {
282+ modifyFolderModal . querySelector ( `#role${ role } ` ) . checked = true ;
283+ }
284+ } ) ;
285+ modifyFolderModal . querySelector ( '#folderColor' ) . value = folder . dataset . color ;
258286 } ) ;
259287
288+ const addFolderModal = document . querySelector ( '#addFolderModal' ) ;
260289 const createFolderButton = document . querySelector ( '#createFolderButton' ) ;
261290 createFolderButton . addEventListener ( 'click' , function ( event ) {
262291 if ( fileTotal != fileUploadTotal ) {
263292 return ;
264293 }
265- let folderName = document . querySelector ( '#folderName' ) . value ;
266- let parentFolderId = document . querySelector ( '#parentFolder' ) . value ;
267- let folderRoles = Array . from ( document . querySelectorAll ( '.role-checkbox:checked' ) ) . map ( cb => cb . value ) ;
268- let folderColor = document . querySelector ( '#folderColor' ) . value ;
294+ let folderName = addFolderModal . querySelector ( '#folderName' ) . value ;
295+ let parentFolderId = addFolderModal . querySelector ( '#parentFolder' ) . value ;
296+ let folderRoles = Array . from ( addFolderModal . querySelectorAll ( '.role-checkbox:checked' ) ) . map ( cb => cb . value ) ;
297+ let folderColor = addFolderModal . querySelector ( '#folderColor' ) . value ;
269298 createFolderButton . disabled = true ;
270- socket . emit ( 'create_folder' , { folderName : folderName , parentFolderId : parentFolderId , folderRoles : folderRoles , folderColor : folderColor } ) ;
299+ if ( folderName !== '' ) {
300+ socket . emit ( 'create_folder' , { folderName : folderName , parentFolderId : parentFolderId , folderRoles : folderRoles , folderColor : folderColor } ) ;
301+ }
302+ else {
303+ alert ( 'Veuillez remplir tous les champs.' ) ;
304+ createFolderButton . disabled = false ;
305+ }
271306 } ) ;
272307
273308 socket . on ( 'folder_created' , function ( data ) {
@@ -287,4 +322,42 @@ document.addEventListener('DOMContentLoaded', function () {
287322 return ;
288323 }
289324 } ) ;
325+
326+ const modifyFolderButton = document . querySelector ( '#modifyFolderButton' ) ;
327+ modifyFolderButton . addEventListener ( 'click' , function ( event ) {
328+ if ( fileTotal != fileUploadTotal ) {
329+ return ;
330+ }
331+ let folderId = modifyFolderModal . querySelector ( '#existingFolder' ) . value ;
332+ let folderName = modifyFolderModal . querySelector ( '#folderName' ) . value ;
333+ let parentFolderId = modifyFolderModal . querySelector ( '#parentFolder' ) . value ;
334+ let folderRoles = Array . from ( modifyFolderModal . querySelectorAll ( '.role-checkbox:checked' ) ) . map ( cb => cb . value ) ;
335+ let folderColor = modifyFolderModal . querySelector ( '#folderColor' ) . value ;
336+ modifyFolderButton . disabled = true ;
337+ if ( folderName !== '' && folderId !== '0' ) {
338+ socket . emit ( 'modify_folder' , { folderId : folderId , folderName : folderName , parentFolderId : parentFolderId , folderRoles : folderRoles , folderColor : folderColor } ) ;
339+ }
340+ else {
341+ alert ( 'Veuillez remplir tous les champs.' ) ;
342+ modifyFolderButton . disabled = false ;
343+ }
344+ } ) ;
345+
346+ socket . on ( 'folder_modified' , function ( data ) {
347+ window . location . reload ( ) ;
348+ } ) ;
349+
350+ socket . on ( 'folder_not_modified' , function ( data ) {
351+ alert ( `La modification du dossier a échoué: ${ data . error } ` ) ;
352+ modifyFolderButton . disabled = false ;
353+ } ) ;
354+
355+ const formModifyFolder = document . querySelector ( '#modifyFolderModal' ) . querySelector ( 'form' ) ;
356+ formModifyFolder . addEventListener ( 'submit' , function ( event ) {
357+ if ( fileTotal != fileUploadTotal ) {
358+ event . preventDefault ( ) ;
359+ alert ( 'Veuillez attendre la fin du téléversement des fichiers avant de modifier un dossier.' ) ;
360+ return ;
361+ }
362+ } ) ;
290363} ) ;
0 commit comments