feat: replace lightGallery by lightgallery.js

Replace lightGallery by lightgallery.js because lightGallery require jQuery whereas lightgallery.js has no dependency.

README.md

@@ -34,6 +34,8 @@ If you would like, you can automate the installation of Apaxy with the included
 
 To get started, first open `apaxy.config` in your favorite editor, then edit the `apacheWebRootPath` and `installWebPath` variables to correspond to your server's settings. Save the file and exit.
 
+You can set some parameters of `apaxy.config` on the command line instead of the config file. You can see the documentation of the cli with the following command: `apaxy-configure.sh -h`.
+
 Then run the configuration script as a user that can write to the `installWebPath` directory. With apache under debian, this would be the `www-data` user:
 
 	$ sudo -u www-data ./apaxy-configure.sh
@@ -60,6 +62,13 @@ Should be changed to...
 AddIconByType (gif,/share/theme/icons/gif.png) image/gif
 ```
 
+- if you want to enable the [gallery](#gallery) feature, overwrite the header and footer files:
+
+```bash
+mv footer-lightgallery.html footer.html
+mv header-lightgallery.html header.html
+```
+
 - edit `footer.html`, along with all the other `html` documents (in the `/share/theme` folder) and update all instances of paths marked with *{FOLDERNAME}* to point to your site root
 
 So...
@@ -111,6 +120,12 @@ The default apaxy theme `/themes/apaxy` has icons in place for the following med
 
 3dml 3ds 3g2 3gp 7z aac adp ai aif aifc aiff apk appcache asf asm asx atom au avi azw bat bin bmp bpk btif bz bz2 c cab caf cb7 cba cbr cbt cbz cc cgm class cmx com conf cpp css csv curl cxx dcurl deb def deploy dic diff dist distz djv djvu dll dmg dms doc docx dot dra dsc dtd dts dtshd dump dvb dwg dxf ecelp4800 ecelp7470 ecelp9600 elc eol eps epub etx exe f f4v f77 f90 fbs fh fh4 fh5 fh7 fhc flac fli flv flx fly for fpx fst fvt g3 gif gv gz gzip h h261 h263 h264 hh hpp htm html ico ics ief ifb in iso jad jar java jpe jpeg jpg jpgm jpgv jpm js json kar ktx latex list log lrf lvp m1v m2a m2v m3a m3u m3u8 m4a m4u m4v Makefile man mar markdown mcurl md mdb mdi me mid midi mj2 mjp2 mk3d mka mks mkv mmr mng mobi mov movie mp2 mp2a mp3 mp4 mp4a mp4v mpe mpeg mpg mpg4 mpga mpkg ms msi mxu n3 nfo npx odb odc odf odft odg odi odm odp ods odt oga ogg ogv opml otc otf otg oth oti otp ots ott p pas patch pbm pct pcx pdf pgm php phtml pic pkg pls png pnm pot ppm pps ppsx ppt pptx prc ps psd py pya pyv qt ra ram rar ras rb README rgb rip rlc rmi rmp roff rpm rss rtf rtx s s3m sass scss scurl sfv sgi sgm sgml sh sid sil smv snd so spot spx sql sub svg svgz t tar tex text tga tif tiff torrent tr tsv ttc ttf ttl txt udeb uri uris urls uu uva uvg uvh uvi uvm uvp uvs uvu uvv uvva uvvg uvvh uvvi uvvm uvvp uvvs uvvu uvvv vcard vcf vcs viv vob wav wax wbmp wdp weba webm webp wm wma wml wmls wmv wmx woff woff2 wvx xbm xht xhtml xif xla xlc xlm xls xlsx xlt xlw xm xml xpmxwd xsl zip
 
+## Gallery
+
+You can enable a gallery feature on apaxy. This feature is based on [lightgallery.js](https://sachinchoolur.github.io/lightgallery.js/).
+
+See [installation](#installation) section for more information.
+
 ## Troubleshooting
 
 Make sure the options set in `.htaccess` files of Apaxy can actually be changed. This means that you need to allow to override the used options in your apache configuration of the directory apaxy used with: `AllowOverride Indexes`.

apaxy-configure.sh

@@ -20,6 +20,7 @@ defaultLogLevel=2
 defaultLogFile="$(basename "${0}" .sh).log"
 defaultApacheWebRootPath="/var/www/html"
 defaultInstallWebPath=""
+defaultEnableGallery=false
 
 # functions
 
@@ -40,6 +41,7 @@ Available optionnal parameters are :
   -h  - display help
   -d  - set path/to/dir/ directory where apaxy will be installed on the filesystem
   -w  - set path/to/dir/ directory where apaxy will be available on the httpd server
+  -g  - enable or disable gallery feature
   -ll - set the log level
   -lf - set the log file
 EOF
@@ -50,7 +52,7 @@ EOF
  ##
 displayUsage () {
     cat <<EOF
-usage - $(basename "${0}") [-h] [-d path/to/dir/] [-w path/to/dir/] [-ll logLevel] [-lf logFile]
+usage - $(basename "${0}") [-h] [-d path/to/dir/] [-w path/to/dir/] [-g true|false] [-ll logLevel] [-lf logFile]
 EOF
 }
 
@@ -107,6 +109,10 @@ while [ "$#" -ge 1 ] ; do
             shiftStep=2
             installWebPath="${2}"
             ;;
+        -g) # enable or disable gallery feature
+            shiftStep=2
+            enableGallery="${2}"
+            ;;
         -ll) # set the log level
             shiftStep=2
             logLevel="${2}"
@@ -148,6 +154,11 @@ else
     installDir="${apacheWebRootPath}${installWebPath}"
 fi
 
+if [ -z "${enableGallery}" ]
+then
+    enableGallery="${defaultEnableGallery}"
+fi
+
 if [ -z "${logLevel}" ]
 then
     logLevel="${defaultLogLevel}"
@@ -186,6 +197,15 @@ log 2 "- generating htaccess"
 sed "s|{FOLDERNAME}|${installWebPath}|g" < "${installDir}/htaccess.txt" > "${installDir}/.htaccess"
 rm "${installDir}/htaccess.txt"
 
+if [ "${enableGallery}" = "true" ]
+then
+    log 1 "- enabling gallery feature"
+    mv -f "${installDir}/theme/header-lightgallery.html" "${installDir}/theme/header.html"
+    mv -f "${installDir}/theme/footer-lightgallery.html" "${installDir}/theme/footer.html"
+else
+    log 2 "- gallery feature not enabled"
+fi
+
 # find all the html files and replace the variable in them
 # this will automatically take care of the error pages, headers and footers
 log 2 "- setting path in html files"

apaxy.config

@@ -42,3 +42,11 @@ apacheWebRootPath="/var/www/html"
 # installWebPath="/share"
 #
 installWebPath=""
+
+# enable lightgallery.js to preview images in the browser with navigation links
+#
+# this feature is disabled by default as it downloads css and js files from a CDN
+#
+# please enable it with caution
+#
+enableGallery=false

apaxy/theme/apaxy-lightgallery.js

@@ -0,0 +1,15 @@
+var imageSelector = [
+    'tr:not(.parent) td.indexcolname a[href$=".png"]',
+    'tr:not(.parent) td.indexcolname a[href$=".jpg"]',
+    'tr:not(.parent) td.indexcolname a[href$=".jpeg"]',
+].join(', ');
+
+lightGallery(document.getElementById('indexlist'), {
+    selector: imageSelector,
+    mode: 'lg-slide',
+    hideBarsDelay: 2000,
+    loop: false,
+    hideControlOnEnd: true,
+    download: true,
+    cssEasing : 'cubic-bezier(0.25, 0, 0.25, 1)'
+});

apaxy/theme/footer-lightgallery.html

@@ -0,0 +1,12 @@
+  <div class="block">
+    You can add your own HTML above or below the directory listing. Simply explore the <code>header.html</code> and <code>footer.html</code> files.
+  </div><!--/.postlisting-->
+
+</div><!--/.wrapper-->
+
+<div class="footer">
+  Apaxy by <a href="https://twitter.com/adamwhitcroft">@adamwhitcroft</a>
+</div><!--/.footer-->
+<script src={FOLDERNAME}/theme/apaxy.js></script>
+<script src="https://cdn.jsdelivr.net/npm/lightgallery.js@1.1.3/dist/js/lightgallery.min.js" integrity="sha256-eoTGOrFW1o5KcmlIfJxlpOs0sMeGTy0/0rh/fGZEgNM=" crossorigin="anonymous"></script>
+<script src={FOLDERNAME}/theme/apaxy-lightgallery.js></script>

apaxy/theme/header-lightgallery.html

@@ -0,0 +1,9 @@
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lightgallery.js@1.1.3/dist/css/lightgallery.min.css" integrity="sha256-oPZ2OUkKul2aJQeDwKoO1p+DpvFR+w17n7YXydvFRWU=" crossorigin="anonymous">
+
+<div class="wrapper">
+<!-- we open the `wrapper` element here, but close it in the `footer.html` file -->
+
+<ol class="breadcrumb" id="breadcrumb">
+</ol>
+
+<input type="search" id="filter" placeholder="filter contents" />

apaxy/theme/header.html

@@ -1,29 +1,3 @@
-<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.3.9/css/lightgallery.min.css" /> 
-
-<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.3.9/js/lightgallery.min.js"></script>
-
-<script type="text/javascript">
-$(document).ready(function () {
-    var imageSelector = [
-        '.indexcolname a:contains(".jpg"):not(:contains(".json"))',
-        '.indexcolname a:contains(".jpeg"):not(:contains(".json"))',
-        '.indexcolname a:contains(".png"):not(:contains(".json"))',
-    ].join(', ');
-
-    var $table = $('table'),
-        $images = $table.find(imageSelector);
-
-    if ($table.length && $images.length) {
-        $table.lightGallery({
-            selector: imageSelector,
-            mode: 'lg-fade',
-            download: true
-        });
-    }
-});
-</script>
-
 <div class="wrapper">
 <!-- we open the `wrapper` element here, but close it in the `footer.html` file -->