Solution: Sebastian Brupbacher & Victor Hugo Gomez

README.md

@@ -6,42 +6,67 @@
   <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. 
+![PHP Logo](https://www.hostname.cl/uploads/2013/07/php-logo.jpeg)
+
 
 >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.
 
 
 ## Index <!-- omit in toc -->
 
 - [Requirements](#requirements)
-- [Repository](#repository)
+- [Getting Started](#getting-started)
+  - [Repository](#repository)
+  - [Installing](#installing)
+  - [Server Environment](#server-environment)
 - [Technologies used](#technologies-used)
-- [Project delivery](#project-delivery)
 - [Resources](#resources)
 
+
 ## Requirements
 
-- You cannot use file third-party libraries
-- You will not be able to use global variables in PHP.
-- You must use GIT
-- You must use the PHP > v7
+- Non use third-party libraries
+- Non global variables in PHP.
+- Using GIT
+- PHP > v7
 - Create a clear and orderly directory structure
-- Both the code and the comments must be written in English
 - Use the camelCase code style to define variables and functions
-- In the case of using HTML, never use inline styles
+- Never use inline styles in HTML
 - In the case of using different programming languages ​​always define the implementation in separate terms
-- Remember that it is important to divide the tasks into several sub-tasks so that in this way you can associate each particular step of the construction with a specific commit
-- 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
+## Getting Started
 
-First of all you must fork this project into your GitHub account.
+These instructions will get you a copy of the project up and running on your
+local machine for development and testing purposes.
+### Repository
 
-To create a fork on GitHub is as easy as clicking the “fork” button on the repository page.
+First, you will need to `clone` or `fork` the repository into your Github
+account:
 
 <img src="https://docs.github.com/assets/images/help/repository/fork_button.jpg" alt="Fork on GitHub" width='450'>
 
+```
+$ git clone https://github.com/labietelabiete/filesystem-explorer
+```
+### Installing
+
+First, you will need to install the dependencies with: `npm install`.
+
+Run the following command in your terminal after cloning the main repo:
+
+```sh
+$ npm install
+```
+### Server Environment
+
+Then, you can run your local server environment (XAMPP for example) in order to run the web application.
+
+For more information about XAMPP local server environment:
+
+  [XAMPP local server enviroment](https://www.apachefriends.org/es/index.html)
+
+
+
 ## Technologies used
 
 \* HTML
@@ -52,20 +77,6 @@ To create a fork on GitHub is as easy as clicking the “fork” button on the r
 
 \* PHP
 
-## Project delivery
-
-To deliver this project you must follow the steps indicated in the document:
-
-- [Submitting a solution](https://www.notion.so/Submitting-a-solution-524dab1a71dd4b96903f26385e24cdb6)
-
-- You must include the project documentation in PDF format.
-- You must include a presentation in PDF format explaining:
-  - Comparison of the original design (Wireframe) with the final result of the project
-  - Comparison of the use case diagram with the actions that the user can finally perform
-  - Comparison of the original use case diagram with the final user actions
-  - What lessons you’ve learned during this project
-  - What problems have you encountered when developing this project?
-  - How you have organized and distributed the tasks
 
 
 ## Resources

index.php

@@ -0,0 +1,84 @@
+<?php
+// $rootPathManual = "C:/xampp/htdocs/Assembler/Projects/02-php-file-manager/filesystem-explorer/root";
+
+session_start();
+require("./src/modules/upload.php");
+require("./src/modules/path_manager.php");
+$rootPath = getRootPath();
+require_once("./src/modules/set_dir.php");
+
+?>
+
+<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">
+  <title>PHP File Manager</title>
+  <link rel="preconnect" href="https://fonts.gstatic.com">
+  <link href="https://fonts.googleapis.com/css2?family=Anton&display=swap" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;700&display=swap" rel="stylesheet">
+  <script src="https://kit.fontawesome.com/ecea200bd3.js" crossorigin="anonymous"></script>
+  <link href="node_modules\bootstrap\dist\css\bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
+  <link rel="stylesheet" href="./src/assets/css/styles.css">
+</head>
+
+<body>
+  <div class="row">
+    <div class="col col-12 title d-flex align-items-center justify-content-center">
+      <img src="./src/assets/img/logo-orange-01.png">
+      <h2>Filesystem Explorer</h2>
+    </div>
+  </div>
+  <main class="main_container container">
+    <div class="top_container row">
+      <form class="form-inline search_bar col col-12 d-flex" action="./src/modules/search.php" method="POST">
+        <input class="form-control" type="text" name="search" placeholder="Search..." id="search" aria-label="Search">
+        <button class="btn btn-search" type="submit">Search</button>
+      </form>
+      <div class="col-6"></div>
+      <form class="form-inline search_bar col col-6 d-flex" action="./src/modules/creating_folder.php" method="POST">
+        <input class="form-control" type="text" name="folderName" placeholder="Folder name..." id="folderName">
+        <button class="btn btn-new-folder" type="submit">New Folder</button>
+      </form>
+
+      <div class="col col-12 current_path">
+        <?php require_once("./src/modules/set_navbar.php"); ?>
+      </div>
+    </div>
+    <div class="content-container">
+      <table class="table">
+        <thead>
+          <tr>
+            <th class="col col-3" scope="col">File name</th>
+            <th class="col col-2" scope="col">Creation date</th>
+            <th class="col col-2" scope="col">Modified date</th>
+            <th class="col col-1" scope="col">Type</th>
+            <th class="col col-2" scope="col">Size</th>
+            <th class="col col-2" scope="col"></th>
+          </tr>
+        </thead>
+        <tbody class="table-content">
+          <?php require_once("./src/modules/set_files_info.php") ?>
+        </tbody>
+      </table>
+    </div>
+  </main>
+  <?php
+  require("./src/modules/modal.php");
+  ?>
+  <aside class="aside_left">
+    <form action="" method="POST" enctype="multipart/form-data">
+      <label class="custom-file-input">
+        <span>+</span>
+        <input type="file" name="file" onchange="form.submit()" style="display:none;">
+      </label>
+    </form>
+  </aside>
+</body>
+<script src="node_modules/jquery/dist/jquery.min.js"></script>
+<script src="node_modules\bootstrap\dist\js\bootstrap.bundle.min.js" crossorigin="anonymous"></script>
+<script src="src/assets/js/getModalInfo.js"></script>
+
+</html>