Solution: Ruben Zafra Traver & Albert Gomis Mulà

README.md

@@ -1,11 +1,5 @@
-`#html` `#css` `#js` `#php` `#master-in-software-development`
-
 # PHP Local FileSystem explorer <!-- omit in toc -->
 
-<p>
-  <img alt="Version" src="https://img.shields.io/badge/version-1.0-blue.svg?cacheSeconds=2592000" />
-</p>
-
 >In this project you will have to create a system file explorer that allows the user to navigate, create directories and upload files in the same way as he would in his usual operating system. 
 
 >The file explorer is a tool that allows you to directly view and manipulate the files and directories associated with a path, so you must take into account from which path the user starts and which path they can access.
@@ -34,13 +28,6 @@
 - You should try as much as possible that the commits and the planned tasks are the same
 Delete files that are not used or are not necessary to evaluate the project
 
-## Repository
-
-First of all you must fork this project into your GitHub account.
-
-To create a fork on GitHub is as easy as clicking the “fork” button on the repository page.
-
-<img src="https://docs.github.com/assets/cb-23088/images/help/repository/fork_button.png" alt="Fork on GitHub" width='450'>
 
 ## Technologies used
 
@@ -58,3 +45,11 @@ To create a fork on GitHub is as easy as clicking the “fork” button on the r
 - [PHP FileSystem W3C](https://www.w3schools.com/php/php_ref_filesystem.asp)
 - [PHP FileSystem Oficial](https://www.php.net/manual/es/book.filesystem.php)
 - [README Guidelines Example](https://gist.github.com/PurpleBooth/109311bb0361f32d87a2)
+
+
+![wireframe](https://user-images.githubusercontent.com/119521997/213163669-40a794c4-4445-4cb4-a61c-60efe880d698.png)
+
+La organización ha sido relativamente sencilla durante todo el desarrollo del proyecto. Hemos hecho pair coding practicamente en todas las fases del mismo, y hemos dividido las tareas a realizar en subtareas más claras y concisas para poder desarrollar de forma más optioma y pudiendo poner atención a todos los detalles.
+
+Tal y como se puede apreciar en la imagen superior, esa es la primera idea que teniamos de como devia ser nuestro proyecto, pero finalmente realizamos algunos cambios tanto en el estilo como en el layout para poder aplicar todas las funcionalidades del proyecto de manera más eficiente y sencilla.
+

check-request.php

@@ -0,0 +1,25 @@
+<?php
+
+checkRequest();
+
+function checkRequest() {
+
+    $folder = "root/";
+
+    if (isset($_REQUEST['name'])){
+
+    $folder = $folder . $_REQUEST['name']."/";
+    displayDirectories($folder);
+
+    // echo json_encode($folder);
+
+    } else {
+
+    displayDirectories($folder);
+    // echo "nothing";
+
+    }
+
+}
+
+?>

create-folder.php

@@ -0,0 +1,30 @@
+<?php
+
+if (isset($_REQUEST["name"])){
+    $name=$_REQUEST["name"];
+    echo $name;
+}
+
+if ($name !== "" && isset($_GET['nameFolder'])){
+
+    $newFolderName = $_GET['nameFolder'];
+
+    $folder = json_encode($newFolderName);
+
+    echo $folder;
+
+    mkdir("./root/$name/$newFolderName", 0777);
+
+} else if ($name === "" && isset($_GET['nameFolder'])){
+
+    $newFolderName = $_GET['nameFolder'];
+
+    $folder = json_encode($newFolderName);
+
+    echo $folder;
+
+    mkdir("./root/$newFolderName", 0777);
+
+}
+
+?>

delete-file.php

@@ -0,0 +1,9 @@
+<?php
+
+$actualFolder = $_GET["actualFolderName"];
+
+unlink("$actualFolder");
+
+echo json_encode($actualFolder);
+
+?>

delete-folder.php

@@ -0,0 +1,12 @@
+<?php
+
+$actualFolder = $_GET["actualFolderName"];
+
+array_map("unlink", glob("$actualFolder/*"));
+array_map("rmdir", glob("$actualFolder/*"));
+
+rmdir("$actualFolder");
+
+echo json_encode($actualFolder);
+
+?>

edit-folder.php

@@ -0,0 +1,26 @@
+<?php
+
+$oldname = $_POST["oldName"];
+$newname = $_POST["newname"];
+
+$ruta=explode("/", $oldname);
+
+array_pop($ruta);
+
+$rutacompleta = "";
+
+foreach ($ruta as $valor){
+    $rutacompleta .= $valor."/";
+}
+
+$newname = $rutacompleta . $newname;
+
+// echo newname;
+
+$data = [$oldname, $newname];
+
+rename($oldname, $newname);
+
+echo json_encode($data);
+
+?>

index.php

@@ -0,0 +1,155 @@
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="style.css">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
+    <script defer src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
+    <script defer src="https://kit.fontawesome.com/474cc18125.js" crossorigin="anonymous"></script>
+    <script defer src="script.js"></script>
+    <title>File Explorer</title>
+</head>
+
+<header>
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
+  <div class="container-fluid">
+    <a class="navbar-brand" href="#">RUBAL Explorer</a>
+      <form class="d-flex" role="search">
+
+        <input class="form-control me-2 buscadorValue" type="search" placeholder="Search" aria-label="Search">
+        <button class="btn btn-outline-success buscador" type="submit">Search</button>
+      </form>
+      <form class="d-flex upload-file" method="POST" action="upload-file.php" enctype="multipart/form-data">
+        <input class="form-control me-2 file-to-upload" type="file" name="file" placeholder="File name..." >
+        <button class="btn btn-secondary" type="submit" name="submit">Upload</button>
+      </form>
+      <div class="d-flex create-folder">
+        <input class="form-control me-2 folder-name" type="text" name="folder" placeholder="Folder or file name..." >
+        <button class="btn btn-secondary create-btn">Create</button>
+      </div>
+    </div>
+  </div>
+</nav>
+</header>
+
+<body>
+<table class="table caption-top align-middle">
+<button class="btn btn-outline-secondary"><a class="home" href="./index.php">Files & Folders</a></button>
+
+<ul id="searchResults">
+
+</ul>
+
+  <thead>
+    <tr>
+      <th scope="col">Extension</th>
+      <th scope="col">Name</th>
+      <th scope="col">Creation Date</th>
+      <th scope="col">Last Modified</th>
+      <th scope="col">Size</th>
+      <th scope="col"></th>
+    </tr>
+  </thead>
+  <tbody>    
+
+    <?php
+
+    require_once("check-request.php");
+
+    function displayDirectories($folder){
+
+      foreach (glob("$folder/*") as $dir) {
+
+        if (!strpos(basename($dir), '.')) {
+
+          $size = filesize($dir);
+
+          $sizeKB = $size / 1024 ;
+          $sizeMB = $sizeKB / 1024 ;
+
+          if ( $sizeKB < 1024 ) {
+
+            echo "<tr>\n<th scope='row'><img src='extensions/folder.png' width='50px'></th>\n<td><form method='GET'><input type='hidden' name='name' value='". basename($dir)."'class='folder'><button type='submit'>" . basename($dir) . "</button></form></td>\n<td>" . date('d-m-Y H:i:s', filectime($dir)) . "</td>\n<td>" . date('d-m-Y H:i:s', filemtime($dir)) . "</td>\n<td>" . round($sizeKB, 2) . 'KB' . "</td><td><button class='fa-solid fa-trash delete-btn' actual-folder='".$dir."'></button><button class='fa-regular fa-pen-to-square edit-btn' actualFolder =".$dir." ></button></td></tr>";
+
+          } else {
+
+            echo "<tr>\n<th scope='row'><img src='extensions/folder.png' width='50px'></th>\n<td><form method='GET'><input type='hidden' name='name' value='". basename($dir)."'class='folder'><button type='submit'>" . basename($dir) . "</button></form></td>\n<td>" . date('d-m-Y H:i:s', filectime($dir)) . "</td>\n<td>" . date('d-m-Y H:i:s', filemtime($dir)) . "</td>\n<td>" . round($sizeMB, 2) . 'MB' . "</td><td><button class='fa-solid fa-trash delete-btn' actual-folder='".$dir."'></button><button class='fa-regular fa-pen-to-square edit-btn' actualFolder =".$dir." ></button></td></tr>";
+
+          }
+
+        } else {
+
+          $extensionIcon = "";
+
+          $dirEx = explode(".",$dir);
+
+          $extension = end($dirEx);
+
+          switch ($extension){
+            case "mp3":
+              $extensionIcon = "extensions/mp3.png";
+              break;
+            case "doc":
+              $extensionIcon = "extensions/doc.png";
+              break;
+            case "exe":
+              $extensionIcon = "extensions/exe.png";
+              break;
+            case "jpg":
+              $extensionIcon = "extensions/jpg.png";
+              break;
+            case "mp4":
+              $extensionIcon = "extensions/mp4.png";
+              break;
+            case "odt":
+              $extensionIcon = "extensions/odt.png";
+              break;
+            case "pdf":
+              $extensionIcon = "extensions/pdf.png";
+              break;
+            case "html":
+              $extensionIcon = "extensions/html.png";
+              break;
+            case "php":
+              $extensionIcon = "extensions/php.png";
+              break;
+            case "zip":
+              $extensionIcon = "extensions/zip.png";
+              break;
+            case "txt":
+              $extensionIcon = "extensions/txt.png";
+              break;
+            case "png":
+              $extensionIcon = "extensions/png.png";
+              break;
+          }
+
+          $size = filesize($dir);
+
+          $sizeKB = $size / 1024 ;
+          $sizeMB = $sizeKB / 1024 ;
+
+          if ( $sizeKB < 1024 ) {
+
+            echo "<tr>\n<th scope='row'><img src='".$extensionIcon."' width='50px'></th>\n<td><a href='root/" . basename($dir) . "'>" . basename($dir) . "</a></td>\n<td>" . date('d-m-Y H:i:s', filectime($dir)) . "</td>\n<td>" . date('d-m-Y H:i:s', filemtime($dir)) . "</td>\n<td>" . round($sizeKB, 2) . 'KB' . "</td><td><button class='fa-solid fa-trash delete-btn' actual-folder='".$dir."'></button><button class='fa-regular fa-pen-to-square edit-btn' actualFolder =".$dir." ></button></td></tr>";
+
+          } else {
+
+            echo "<tr>\n<th scope='row'><img src='".$extensionIcon."' width='50px'></th>\n<td><a href='root/" . basename($dir) . "'>" . basename($dir) . "</a></td>\n<td>" . date('d-m-Y H:i:s', filectime($dir)) . "</td>\n<td>" . date('d-m-Y H:i:s', filemtime($dir)) . "</td>\n<td>" . round($sizeMB, 2) . 'MB' . "</td><td><button class='fa-solid fa-trash delete-btn' actual-folder='".$dir."'></button><button class='fa-regular fa-pen-to-square edit-btn' actualFolder =".$dir." ></button></td></tr>";
+
+          }
+
+        }
+      }
+    }
+
+    ?>
+  </tbody>
+</table>
+
+</body>
+
+</html>