/folder-listing.php
Last active May 17, 2020
A good looking replacement for Apache DirectoryIndex
| <!doctype html> | |
| <!-- - - - - - - - - - - - - - - - - - - - - - - - - - --> | |
| <!-- Folder Listing --> | |
| <!-- ============== --> | |
| <!-- A good looking replacement for "DirectoryIndex": --> | |
| <!-- Rename this file to "index.php" and copy it --> | |
| <!-- into a web server directory to enable --> | |
| <!-- browsing on that directory. --> | |
| <!-- Requirement: --> | |
| <!-- Apache HTTP Server Project with php7_module --> | |
| <!-- enabled (see /private/etc/apache2/httpd.conf) --> | |
| <!-- Example page: --> | |
| <!-- https://centerkey.com/files --> | |
| <!-- WTFPL --> | |
| <!-- - - - - - - - - - - - - - - - - - - - - - - - - - --> | |
| <html lang=en> | |
| <head> | |
| <meta charset=utf-8> | |
| <meta name=viewport content="width=device-width, initial-scale=1"> | |
| <meta name=apple-mobile-web-app-title content="<?=basename(__DIR__)?>"> | |
| <title>Folder: <?=basename(__DIR__)?></title> | |
| <link rel=icon href=https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.13/svgs/solid/folder.svg> | |
| <link rel=apple-touch-icon href=https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.13/svgs/solid/folder.svg> | |
| <link rel=stylesheet href=https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.13/css/all.min.css> | |
| <link rel=stylesheet href=https://cdn.jsdelivr.net/npm/dna.js@1.6/dist/dna.css> | |
| <link rel=stylesheet href=https://cdn.jsdelivr.net/npm/web-ignition@1.2/dist/reset.min.css> | |
| <style> | |
| body { margin: 0px 20px; } | |
| body >main { min-height: auto; } | |
| body >main h1 { color: cadetblue; } | |
| body >main a { border-color: cadetblue; } | |
| body >main a { outline-color: white; } /* workaround for ghost line on hover in safari */ | |
| body >main a:hover { background-color: cadetblue; outline-color: cadetblue; } | |
| body >main ul.simple-text { margin: 0px 0px 30px 15px; } | |
| body >main ul.simple-text li { display: flex; align-items: center; margin-bottom: 10px; } | |
| body >main ul.simple-text li i.font-icon { width: 1.8em; text-align: center; } | |
| body >main p a { margin-right: 8px; } | |
| body >main ul.simple-text li i.font-icon[data-icon=folder] { color: darkgoldenrod; } | |
| body >main ul.simple-text li i.font-icon[data-icon=file] { color: darkslateblue; } | |
| @media (max-width: 667px) { /* selects iPhone 6/6s/7/8/SE(2020) landscape and anything narrower */ | |
| body { margin: 0px; } | |
| body >main h1 { font-size: 1.7em; } | |
| body >main ul.simple-text { margin-left: 0px; } | |
| } | |
| </style> | |
| <?php | |
| function showFile($file) { | |
| $extension = pathinfo($file, PATHINFO_EXTENSION); | |
| return !is_dir($file) && $file[0] !== "." && $extension !== 'php' && $file !== 'error_log'; | |
| } | |
| function toHtml($file) { | |
| $icon = is_dir($file) ? "folder" : "file"; | |
| return "<li><a href=$file><i data-icon=$icon></i></a> <a href=$file>$file</a></li>"; | |
| } | |
| ?> | |
| </head> | |
| <body> | |
| <main> | |
| <h1>Folder Listing</h1> | |
| <h2></h2> | |
| <ul class=simple-text> | |
| <li><a href=..><i data-icon=arrow-alt-circle-up></i></a> <a href=..>Parent folder</a></li> | |
| <?=implode(PHP_EOL, array_map("toHtml", glob("*", GLOB_ONLYDIR)))?> | |
| <?=implode(PHP_EOL, array_map("toHtml", array_filter(glob("*"), "showFile")))?> | |
| </ul> | |
| <p> | |
| <a href=# class=home-link><i data-icon=home></i></a> | |
| <a href=https://gist.github.com/dpilafian/930e1677d0c08eed3c39f04d32d7bf19><i data-brand=github-alt></i></a> | |
| </p> | |
| </main> | |
| <script src=https://cdn.jsdelivr.net/npm/jquery@3.5/dist/jquery.min.js></script> | |
| <script src=https://cdn.jsdelivr.net/npm/dna.js@1.6/dist/dna.min.js></script> | |
| <script src=https://cdn.jsdelivr.net/npm/web-ignition@1.2/dist/library.min.js></script> | |
| <script> | |
| $('.home-link').attr({ href: window.location.origin }); | |
| $('main >h2').text(window.location.origin + window.location.pathname); | |
| </script> | |
| </body> | |
| </html> |
| #!/bin/bash | |
| ################## | |
| # Folder Listing # | |
| # WTFPL # | |
| ################## | |
| # To make this file runnable: | |
| # $ chmod +x *.sh.command | |
| banner="Folder Listing" | |
| projectHome=$(cd $(dirname $0); pwd) | |
| displayIntro() { | |
| cd $projectHome | |
| echo | |
| echo $banner | |
| echo $(echo $banner | sed s/./=/g) | |
| pwd | |
| echo | |
| } | |
| publishWebFiles() { | |
| cd $projectHome | |
| publishWebRoot=$(grep ^DocumentRoot /private/etc/apache2/httpd.conf | awk -F'"' '{ print $2 }') | |
| publishSite=$publishWebRoot/centerkey.com | |
| publishFolder=$publishSite/files | |
| publish() { | |
| echo "Publishing:" | |
| mkdir -p $publishFolder | |
| cp -v *.php $publishFolder/index.php | |
| echo | |
| } | |
| test -w $publishSite && publish | |
| } | |
| launchBrowser() { | |
| cd $projectHome | |
| url=https://centerkey.com/files | |
| test -w $publishSite && url=http://localhost/centerkey.com/files | |
| echo "Opening:" | |
| echo $url | |
| sleep 2 | |
| open $url | |
| echo | |
| } | |
| displayIntro | |
| publishWebFiles | |
| launchBrowser |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment