Solution: Paris Arcos, Arantza Beitia, Daniella Alamo.

.gitignore

@@ -0,0 +1 @@
+.DS_Store

app/js/ajaxCreateFolder.js

@@ -0,0 +1,28 @@
+function ajaxCreateFolder($newFolderName) {
+  $.ajax({
+    url: "../../app/php/createFolder.php",
+    type: "post",
+    data: {
+      newFolderName: $newFolderName,
+    },
+    success: function (response) {
+      if (response) {
+        Swal.fire({
+          icon: "success",
+          title: "Folder created",
+          showConfirmButton: false,
+          timer: 1500,
+        });
+        //?recharge table
+        $("#folderName").trigger("reset");
+        loadSidebar();
+      } else {
+        Swal.fire({
+          icon: "error",
+          title: "Oops...",
+          text: "Something went wrong!",
+        });
+      }
+    },
+  });
+}

app/js/ajaxDelete.js

@@ -0,0 +1,21 @@
+function ajaxDelete(fileUrl) {
+  $.ajax({
+    url: "../../app/php/deleteFile.php",
+    type: "post",
+    data: {
+      filePath: fileUrl,
+    },
+    success: function (response) {
+      if (response) {
+        Swal.fire({
+          icon: "success",
+          title: "File deleted",
+          showConfirmButton: false,
+          timer: 1500,
+        });
+        //?recharge table
+        loadTable();
+      }
+    },
+  });
+}

app/js/ajaxGetCurrentFolder.js

@@ -0,0 +1,16 @@
+function ajaxGetCurrentFolder(fileUrl) {
+  $.ajax({
+    url: "../../app/php/utils/getCurrentFolder.php",
+    type: "post",
+    data: {
+      filePath: fileUrl,
+    },
+    success: function (response) {
+      if (response) {
+        console.log(response);
+        //?recharge table
+        loadTable();
+      }
+    },
+  });
+}

app/js/ajaxOpenFile.js

@@ -0,0 +1,24 @@
+function ajaxOpenFile(fileUrl) {
+  $.ajax({
+    url: "../../app/php/openFile.php",
+    type: "post",
+    data: {
+      filePath: fileUrl,
+    },
+    success: function (response) {
+      if (response) {
+        console.log(response)
+        Swal.fire({
+          html:`${response}`
+        });
+      } else {
+        console.log(response)
+        Swal.fire({
+          icon: "error",
+          title: "Oops...",
+          text: "Something went wrong!",
+        });
+      }
+    },
+  });
+}

app/js/ajaxRename.js

@@ -0,0 +1,29 @@
+function ajaxRename(oldName, newName, file) {
+  $.ajax({
+    url: "../../app/php/renameFile.php",
+    type: "post",
+    data: {
+      oldName: oldName,
+      newName: newName,
+      file: file,
+    },
+    success: function (response) {
+      if (response) {
+        Swal.fire({
+          icon: "success",
+          title: "File renamed",
+          showConfirmButton: false,
+          timer: 1500,
+        });
+        //?recharge table
+        loadTable();
+      } else {
+        Swal.fire({
+          icon: "error",
+          title: "Oops...",
+          text: "Something went wrong!",
+        });
+      }
+    },
+  });
+}

app/js/ajaxSetCurrentFolder.js

@@ -0,0 +1,15 @@
+function ajaxSetCurrentFolder(fileUrl) {
+  $.ajax({
+    url: "../../app/php/tableFillContent.php",
+    type: "post",
+    data: {
+      filePath: fileUrl,
+    },
+    success: function (response) {
+      if (response) {
+        console.log(response);
+        //?recharge table
+      }
+    },
+  });
+}

app/js/ajaxUpload.js

@@ -0,0 +1,42 @@
+function ajaxUpload() {
+  event.preventDefault();
+  var fd = new FormData();
+  var files = $("#file")[0].files;
+
+  if (files.length > 0) {
+    fd.append("file", files[0]);
+
+    $.ajax({
+      url: "../../app/php/uploadFile.php",
+      type: "post",
+      data: fd,
+      contentType: false,
+      processData: false,
+      success: function (response) {
+        console.log(response);
+        if (response) {
+          Swal.fire({
+            icon: "success",
+            title: "File updated",
+            showConfirmButton: false,
+            timer: 1500,
+          });
+          //?recharge table
+          loadTable();
+        } else {
+          Swal.fire({
+            icon: "error",
+            title: "Oops...",
+            text: "Something went wrong!",
+          });
+        }
+      },
+    });
+  } else {
+    Swal.fire({
+      icon: "error",
+      title: "Oops...",
+      text: "Something went wrong!",
+    });
+  }
+}

app/js/loadSidebar.js

@@ -0,0 +1,7 @@
+function loadSidebar() {
+  $(document).ready(function () {
+    $("#folderSidebar").load("sidebar.php");
+  });
+}
+
+loadSidebar();

app/js/loadTable.js

@@ -0,0 +1,7 @@
+function loadTable() {
+  $(document).ready(function () {
+    $("#fileDataTable").load("table.php");
+  });
+}
+
+loadTable();

app/php/createFolder.php

@@ -0,0 +1,13 @@
+<?php
+include "utils/getFilePath.php";
+session_start();
+if (isset($_POST['newFolderName'])) {
+	$newFolderName = $_POST['newFolderName'];
+	$path = $_SESSION['folderPath'];
+	$path = getFilePath($path);
+	$path = $path . '/' . $newFolderName;
+	mkdir($path, 0777, true);
+	echo $response;
+} else {
+	$response = false;
+}

app/php/deleteFile.php

@@ -0,0 +1,9 @@
+<?php 
+
+if(file_exists($_POST['filePath'])) {
+	unlink($_POST['filePath']);
+	echo $response;
+} else {
+	$response = false;
+}
+

app/php/openFile.php

@@ -0,0 +1,28 @@
+<?php
+$file = $_POST['filePath'];
+$fileExtension = mime_content_type($file);
+$fileExtension = explode('/', $fileExtension)[0];
+switch ($fileExtension) {
+  case 'image':
+    echo "<img src='$file' style='width:150px;'>";
+    break;
+  case 'audio':
+    echo "<audio controls> <source src='$file' type='audio/mpeg'> No audio support. </audio>";
+    break;
+  case 'video':
+    echo "<video width='320' height='240' controls autoplay> <source src='$file' type='video/mp4'> Your browser does not support the video tag. </video>";
+    break;
+  case 'text':
+    $file = fopen($file, "r");
+    $content = fread($file, filesize($file));
+    echo "<p>'$content' </p>";
+    fclose($file);
+    break;
+  default:
+    # code...
+    break;
+}
+
+
+  // fclose($file);
+  //txt -> // echo file_get_contents($file);

app/php/renameFile.php

@@ -0,0 +1,32 @@
+<?php
+include "./utils/getFilePath.php";
+
+//? incoming file
+$file = '/' . $_POST['file'];
+$newName = $_POST['newName'];
+
+$fileType = strtolower(pathinfo($file, PATHINFO_EXTENSION));
+$newName = substr($newName, 1);
+
+
+//? File path
+$oldFilePath = getFilePath($file);
+$newFilePath = dirname($oldFilePath) . '/' .  $newName . '.' . $fileType;
+
+//? New file path
+if (strtoupper(substr(PHP_OS, 0, 3)) === 'WIN') {
+	$oldFilePath =  str_replace('/', '\\', $oldFilePath);
+	$newFilePath = str_replace('/', '\\', $newFilePath);
+} else {
+	$newName = substr($newName, 1);
+	$oldFilePath = getFilePath($file);
+	$newFilePath = dirname($oldFilePath) . '/' .  $newName . '.' . $fileType;
+}
+
+//? Change Name
+if ($_POST['oldName'] !== $_POST['newName']) {
+	rename($oldFilePath,  $newFilePath);
+	echo $response = true;
+} else {
+	$response = false;
+}

app/php/sidebarFillContent.php

@@ -0,0 +1,59 @@
+<?php
+include "utils/fileBrowser.php";
+include "utils/getFileSize.php";
+function sidebarFillContent($initFolder = "", $id = -1)
+{
+    $id++;
+    //?loop 0  $initFolder="/storage/*"
+    foreach (fileBrowser($initFolder) as $secondFolder) {
+        //!is_dir trouble solution
+        if (pathinfo($secondFolder, PATHINFO_EXTENSION) === "") {
+            $id++;
+            $secondFolderName = basename($secondFolder);
+            echo
+            "<li class='mb-1 p-2' id='folder-$id' data-file='$secondFolder'>" .
+                "<button id='folderButton' class='btn btn-toggle align-items-center rounded collapsed' data-bs-toggle='collapse' data-bs-target='#folder-$id-collapse' aria-expanded='false'>" .
+                "<h5>$secondFolderName </h5>" .
+                '</button>' .
+                "<div class='collapse' id='folder-$id-collapse'>";
+            if (fileBrowser("$secondFolder/*")) {
+                echo
+                "<ul class='btn-toggle-nav list-unstyled fw-normal pb-1 small'>";
+                //?loop 1 $secondFolder="/storage/insideFolder/*"
+                foreach (fileBrowser("$secondFolder/*") as $thirdFolder) {
+                    if (pathinfo($thirdFolder, PATHINFO_EXTENSION) === "") {
+                        $thirdFolderName = basename($thirdFolder);
+                        $id++;
+                        echo "<li class='mb-1 p-2' id='folder-$id' data-file='$thirdFolder'>" .
+                            "<button id='folderButton' class='btn btn-toggle align-items-center rounded collapsed' data-bs-toggle='collapse' data-bs-target='#folder-$id-collapse' aria-expanded='false'>" .
+                            "<h5>$thirdFolderName</h5>" .
+                            '</button>' .
+                            "<div class='collapse' id='folder-$id-collapse'>" .
+                            "<ul class='btn-toggle-nav list-unstyled fw-normal pb-1 small'>";
+                        //?loop 2 $thirdFolder="/storage/insideFolder/insideFolder/*"
+                        sidebarFillContent("$thirdFolder/*", $id);
+                        echo '</ul>
+                                    </div>
+                                </li>';
+                    }
+                }
+                echo '</ul>';
+            } else {
+                echo '<h5>empty!! </h5><br/> <br/>';
+            }
+            echo '</div>
+            </li>';
+        }
+    }
+}
+?>
+<script>
+    $(document).on('click', '#folderButton', function(e) {
+
+        $('.class-toggle').toggle();
+        //$('.class-toggle').toggleClass('add-class'); })
+
+        $file = e.target.parentElement.parentElement.dataset.file ? e.target.parentElement.parentElement.dataset.file : e.target.parentElement.dataset.file;
+        ajaxGetCurrentFolder($file)
+    })
+</script>