diff --git a/FileManager.pdf b/FileManager.pdf new file mode 100644 index 00000000..2f101d2b Binary files /dev/null and b/FileManager.pdf differ diff --git a/src/JS/utilities.js b/src/JS/utilities.js new file mode 100644 index 00000000..47fa64ad --- /dev/null +++ b/src/JS/utilities.js @@ -0,0 +1,67 @@ +const getFiles = async () => { + const response = await fetch( + "http://192.168.64.2/Managizer-filesystem-explorer/src/modules/sendFileInfo.php", + { mode: "no-cors" } + ); + const files = await response.json(); + return files; +}; + +const fileIcons = { + doc: "../assets/doc.png", + csv: "../src/assets/archivo-csv.png", + jpg: "../src/assets/jpg.png", + png: "../src/assets/png.png", + txt: "../src/assets/archivo-txt.png", + ppt: "../src/assets/png.png", + odt: "../src/assets/archivo-odt.png", + pdf: "../src/assets/pdf-file.png", + zip: "../src/assets/archivo-zip.png", + rar: "../src/assets/archivo-rar.png", + exe: "../src/assets/exe.png", + svg: "../src/assets/archivo-csv.png", + mp3: "../src/assets/archivo-mp3.png", + mp4: "../src/assets/mp4.png", + folder: "../src/assets/folder.png" +}; + +export const displayFileIcon = () => { + const fileIconsEl = document.querySelectorAll('[file-icon]'); + fileIconsEl.forEach(iconEl => { + // getting the extention of the current file from its title + const fileTitleEl = iconEl.parentElement.querySelector('[file-title]').textContent; + const fileTitleSplitArray = fileTitleEl.split('.'); + const fileExt = fileTitleSplitArray[fileTitleSplitArray.length - 1]; + iconEl.src = fileExt.length > 3 ? fileIcons.folder : fileIcons[fileExt]; + iconEl.alt = fileExt.length > 3 ? "folder-icon" : `${fileExt}-icon`; + + + }) +} + + export const appendInfoToFilePreview = async (fileTitle) => { + const allFiles = await getFiles(); + // getting the right file from JSON res by comparing it tothe card title + const fileNeeded = allFiles.filter(file => file.name == fileTitle)[0]; + const {name , size , ext, modified} = fileNeeded; + + const previewImageEl = document.getElementById('preview-image'); + // appending the correct file icon from the fileIcon object + previewImageEl.src = ext == "" ? fileIcons.folder : fileIcons[ext]; + + const previewTilteEl = document.getElementById('preview-title'); + previewTilteEl.textContent = name; + + const fileSizePreviewEL = document.getElementById('fileSizePreview'); + // showing the size of the file above 1MB in MB or less in KB + fileSizePreviewEL.textContent = size > 1000000 ? `Size: ${(size/1000000).toFixed(1)} MB` : `Size: ${(size/1024).toFixed(1)} KB` + + const fileExtensionPreviewEl = document.getElementById('fileExtensionPreview'); + // checking file extension whether it's a file or a directory + fileExtensionPreviewEl.textContent = ext == "" ? "File type: folder" : `File type: ${ext}`; + + const fileLastModifiedEl = document.getElementById('fileLastModified'); + fileLastModifiedEl.textContent = `Last Modfied: ${modified}`; + } + + export default {appendInfoToFilePreview, displayFileIcon}; \ No newline at end of file diff --git a/src/assets/add.png b/src/assets/add.png new file mode 100644 index 00000000..50815caa Binary files /dev/null and b/src/assets/add.png differ diff --git a/src/assets/archivo-csv.png b/src/assets/archivo-csv.png new file mode 100644 index 00000000..d483883a Binary files /dev/null and b/src/assets/archivo-csv.png differ diff --git a/src/assets/archivo-mp3.png b/src/assets/archivo-mp3.png new file mode 100644 index 00000000..39f618aa Binary files /dev/null and b/src/assets/archivo-mp3.png differ diff --git a/src/assets/archivo-odt.png b/src/assets/archivo-odt.png new file mode 100644 index 00000000..877686d8 Binary files /dev/null and b/src/assets/archivo-odt.png differ diff --git a/src/assets/archivo-rar.png b/src/assets/archivo-rar.png new file mode 100644 index 00000000..cc5a19f6 Binary files /dev/null and b/src/assets/archivo-rar.png differ diff --git a/src/assets/archivo-txt.png b/src/assets/archivo-txt.png new file mode 100644 index 00000000..91da4130 Binary files /dev/null and b/src/assets/archivo-txt.png differ diff --git a/src/assets/archivo-zip.png b/src/assets/archivo-zip.png new file mode 100644 index 00000000..25c5ce56 Binary files /dev/null and b/src/assets/archivo-zip.png differ diff --git a/src/assets/camera.png b/src/assets/camera.png new file mode 100644 index 00000000..d76e3858 Binary files /dev/null and b/src/assets/camera.png differ diff --git a/src/assets/delete.png b/src/assets/delete.png new file mode 100644 index 00000000..efc47ecf Binary files /dev/null and b/src/assets/delete.png differ diff --git a/src/assets/doc.png b/src/assets/doc.png new file mode 100644 index 00000000..2f30604b Binary files /dev/null and b/src/assets/doc.png differ diff --git a/src/assets/dustbin.png b/src/assets/dustbin.png new file mode 100644 index 00000000..86185500 Binary files /dev/null and b/src/assets/dustbin.png differ diff --git a/src/assets/edit (1).png b/src/assets/edit (1).png new file mode 100644 index 00000000..9f02e07c Binary files /dev/null and b/src/assets/edit (1).png differ diff --git a/src/assets/exe.png b/src/assets/exe.png new file mode 100644 index 00000000..21725fc7 Binary files /dev/null and b/src/assets/exe.png differ diff --git a/src/assets/file.png b/src/assets/file.png new file mode 100644 index 00000000..0be268e8 Binary files /dev/null and b/src/assets/file.png differ diff --git a/src/assets/folder.png b/src/assets/folder.png new file mode 100644 index 00000000..09e8fe78 Binary files /dev/null and b/src/assets/folder.png differ diff --git a/src/assets/headset.png b/src/assets/headset.png new file mode 100644 index 00000000..f4f6ce65 Binary files /dev/null and b/src/assets/headset.png differ diff --git a/src/assets/home (1).png b/src/assets/home (1).png new file mode 100644 index 00000000..94f157c4 Binary files /dev/null and b/src/assets/home (1).png differ diff --git a/src/assets/home.png b/src/assets/home.png new file mode 100644 index 00000000..7d3a2b67 Binary files /dev/null and b/src/assets/home.png differ diff --git a/src/assets/jpg.png b/src/assets/jpg.png new file mode 100644 index 00000000..f8074f6e Binary files /dev/null and b/src/assets/jpg.png differ diff --git a/src/assets/left.png b/src/assets/left.png new file mode 100644 index 00000000..ecbb39f1 Binary files /dev/null and b/src/assets/left.png differ diff --git a/src/assets/mp4.png b/src/assets/mp4.png new file mode 100644 index 00000000..c12e3882 Binary files /dev/null and b/src/assets/mp4.png differ diff --git a/src/assets/music-note.png b/src/assets/music-note.png new file mode 100644 index 00000000..67dc77d0 Binary files /dev/null and b/src/assets/music-note.png differ diff --git a/src/assets/next.png b/src/assets/next.png new file mode 100644 index 00000000..639f1070 Binary files /dev/null and b/src/assets/next.png differ diff --git a/src/assets/one-drive.png b/src/assets/one-drive.png new file mode 100644 index 00000000..a1e51dfe Binary files /dev/null and b/src/assets/one-drive.png differ diff --git a/src/assets/pdf-file.png b/src/assets/pdf-file.png new file mode 100644 index 00000000..4c907ab0 Binary files /dev/null and b/src/assets/pdf-file.png differ diff --git a/src/assets/php.png b/src/assets/php.png new file mode 100644 index 00000000..7ca736fd Binary files /dev/null and b/src/assets/php.png differ diff --git a/src/assets/play-button (1).png b/src/assets/play-button (1).png new file mode 100644 index 00000000..5a62b245 Binary files /dev/null and b/src/assets/play-button (1).png differ diff --git a/src/assets/png.png b/src/assets/png.png new file mode 100644 index 00000000..c6babf18 Binary files /dev/null and b/src/assets/png.png differ diff --git a/src/assets/ppt.png b/src/assets/ppt.png new file mode 100644 index 00000000..05b9031e Binary files /dev/null and b/src/assets/ppt.png differ diff --git a/src/assets/search.png b/src/assets/search.png new file mode 100644 index 00000000..78b3b3cd Binary files /dev/null and b/src/assets/search.png differ diff --git a/src/assets/svg.png b/src/assets/svg.png new file mode 100644 index 00000000..4eb263c6 Binary files /dev/null and b/src/assets/svg.png differ diff --git a/src/assets/video-camera (1).png b/src/assets/video-camera (1).png new file mode 100644 index 00000000..72ba2b34 Binary files /dev/null and b/src/assets/video-camera (1).png differ diff --git a/src/index.php b/src/index.php new file mode 100644 index 00000000..87fc1495 --- /dev/null +++ b/src/index.php @@ -0,0 +1,315 @@ + 0) { + $dir = key($data); + $listOfElement = openFolder($dir); + } +} +if (isset($_POST['search'])) { + $target_dir = __DIR__; + $newR = $target_dir . "/modules/root/"; + $searchValue = $_POST['search']; + + + getFiles($newR, $searchValue); +} + +function getFiles($dir, $search) +{ + + $ffs = scandir($dir); + + + unset($ffs[array_search('.', $ffs)]); + unset($ffs[array_search('..', $ffs)]); + + if (count($ffs) < 1) { + return; + } + + foreach ($ffs as $ff) { + + if (str_contains($ff, $search)) { + array_push($GLOBALS['results'], $ff); + } + if (is_dir($dir . '/' . $ff)) { + getFiles($dir . '/' . $ff, $search); + } + } +} + +?> + + + + + + + + + Managizer - Manage your Files + + + + + + +
+
+
+ +
+
+ +
+ + +
+ + + +
+
+ + + +
+
+ + 0) { + foreach ($listOfElement as $key => $value) { + echo "
+
+ pdf-file +
+
{$value}
+
+
+ + +
+ +
+ + +
+ + +
+
+
+
"; + } + } elseif (count($results) > 0) { + foreach ($results as $key => $value) { + echo "
+
+ pdf-file +
+
{$value}
+
+
+ + +
+ +
+ + +
+ + + +
+
+
+
"; + } + } else { + foreach ($dirFiles as $key => $value) { + echo "
+
+ pdf-file +
+
{$value}
+
+
+ + +
+ +
+ + +
+ + + +
+
+
+
"; + } + } + ?> + +
+
+
+
+ + + + + +
+
+ +

File Preview

+
+
+
+ ... +
+

contrato_calle_toledo_madrid.pdf

+
+
+ +
+
File Description:
+

Size: 246KB

+

Exstention: pdf

+

Last Modfied: Tue 24 May 14:42

+
+ +
+
+ + + +

Move to bin

+
+
+ + + +

Open file

+
+
+ + + +

Edit file

+
+
+
+
+ +
+
+
+ + + + + \ No newline at end of file diff --git a/src/main.js b/src/main.js new file mode 100644 index 00000000..61aa6dc2 --- /dev/null +++ b/src/main.js @@ -0,0 +1,21 @@ +import {appendInfoToFilePreview ,displayFileIcon} from './JS/utilities.js' + +// Global variables +const fileCards = document.querySelectorAll('[file-cards]'); + + +const displayFilePreview = (e) => { + const fileCardEl = e.currentTarget; + const fileTitle = fileCardEl.querySelector('[file-title]').textContent; + appendInfoToFilePreview(fileTitle) +} + + + +displayFileIcon() + + + + +// Event Listener +fileCards.forEach(card => card.addEventListener('click', displayFilePreview)) diff --git a/src/modules/browseFile.php b/src/modules/browseFile.php new file mode 100644 index 00000000..313981e5 --- /dev/null +++ b/src/modules/browseFile.php @@ -0,0 +1,29 @@ + + + + + + +"; +// print_r($array); +// echo ""; +// } + +// listAllFiles($target_dir); \ No newline at end of file diff --git a/src/modules/createFolder.php b/src/modules/createFolder.php new file mode 100644 index 00000000..9855c9fc --- /dev/null +++ b/src/modules/createFolder.php @@ -0,0 +1,12 @@ + + + "; + } elseif ($fileActExt === 'mp3') { + $filename = basename($path, "mp3"); + echo ""; + } +} + + +function openImage($dir) +{ + $file = $dir; + header('Content-Type: image/jpeg'); + header('Content-Length: ' . filesize($file)); + echo file_get_contents($file); +} +function playSong($dir) +{ + $file = $dir; + header('Content-Type: mp3'); + header('Content-Length: ' . filesize($file)); + echo file_get_contents($file); +} diff --git a/src/modules/root/NCS.mp3 b/src/modules/root/NCS.mp3 new file mode 100644 index 00000000..67c106b1 Binary files /dev/null and b/src/modules/root/NCS.mp3 differ diff --git a/src/modules/root/Screenshot 2022-05-24 at 15.42.51.png b/src/modules/root/Screenshot 2022-05-24 at 15.42.51.png new file mode 100644 index 00000000..318f3617 Binary files /dev/null and b/src/modules/root/Screenshot 2022-05-24 at 15.42.51.png differ diff --git a/src/modules/root/Screenshot 2022-05-24 at 16.51.22.png b/src/modules/root/Screenshot 2022-05-24 at 16.51.22.png new file mode 100644 index 00000000..b5cb3905 Binary files /dev/null and b/src/modules/root/Screenshot 2022-05-24 at 16.51.22.png differ diff --git a/src/modules/root/meme.mp4 b/src/modules/root/meme.mp4 new file mode 100644 index 00000000..ff0b1c30 Binary files /dev/null and b/src/modules/root/meme.mp4 differ diff --git a/src/modules/root/test/test inside test/text inside text.txt b/src/modules/root/test/test inside test/text inside text.txt new file mode 100644 index 00000000..e69de29b diff --git a/src/modules/root/test/text.txt b/src/modules/root/test/text.txt new file mode 100644 index 00000000..e69de29b diff --git a/src/modules/search.php b/src/modules/search.php new file mode 100644 index 00000000..41f9ed7f --- /dev/null +++ b/src/modules/search.php @@ -0,0 +1,46 @@ + + + +"; + + +$results = array(); + +if (isset($_POST['searchFile'])) { + $searchFile = $_POST['searchFile']; + $target_dir = __DIR__; + $newR = $target_dir . "/root/"; + echo $newR; + getFiles($newR, $searchFile); + + echo "
";
+    print_r($results);
+    echo "
"; +} + + +function getFiles($dir, $search) +{ + + $ffs = scandir($dir); + + unset($ffs[array_search('.', $ffs)]); + unset($ffs[array_search('..', $ffs)]); + + if (count($ffs) < 1) { + return; + } + + foreach ($ffs as $ff) { + + if (str_contains($ff, $search)) { + + array_push($GLOBALS['results'], $ff); + } + if (is_dir($dir . '/' . $ff)) { + getFiles($dir . '/' . $ff, $search); + } + } +} diff --git a/src/modules/sendFileInfo.php b/src/modules/sendFileInfo.php new file mode 100644 index 00000000..6337bb6e --- /dev/null +++ b/src/modules/sendFileInfo.php @@ -0,0 +1,22 @@ + $file) { + $fileName = $file; + $route = $target_dir . '/' .$file; + $fileExt = pathinfo($file, PATHINFO_EXTENSION); + $fileSize = filesize($route); + $lastModified = date("F d Y H:i:s.", filectime($route)); + array_push($arrayOfFiles, array("name" => $fileName, "size" => $fileSize, "modified" => $lastModified, "ext" => $fileExt)); + +} + +echo json_encode($arrayOfFiles); diff --git a/src/modules/showFiles.php b/src/modules/showFiles.php new file mode 100644 index 00000000..f2c9ba12 --- /dev/null +++ b/src/modules/showFiles.php @@ -0,0 +1,22 @@ + + add-file-icon + '; + } +} + +$target_dir = __DIR__ .'/root'; +$dirFiles = scandir($target_dir); + +unset($dirFiles[array_search('.', $dirFiles)]); +unset($dirFiles[array_search('..', $dirFiles)]); + + + diff --git a/src/modules/uploadFile.php b/src/modules/uploadFile.php new file mode 100644 index 00000000..5bfd1fa8 --- /dev/null +++ b/src/modules/uploadFile.php @@ -0,0 +1,32 @@ +getMessage(), "\n"; + } + header("Location: ../index.php "); + } +} diff --git a/src/style.css b/src/style.css new file mode 100644 index 00000000..1f14cb7f --- /dev/null +++ b/src/style.css @@ -0,0 +1,41 @@ +main { + background-color: #BACBE5; +} +.container { + background-color: white; +} +button { + all: unset; +} + +.add-file-icon { + width: 20px; + height: 20px; +} + +.file-display-icon { + height: 35%; + +} +.file-preview-img { + width: 20px; + height: 20px; +} + +.action-icon { + width: 45px; + height: 45px; +} + +.logo { + width: 40px; + height: 80px; +} + + + +.card-btns { + + width: 20px; + height: 20px; +} \ No newline at end of file