Add Lighttpd example setup [WIP]

README.md

@@ -8,7 +8,7 @@ without the need for using a third party application.
 The application has since been rewritten to not rely on jQuery and use more modern methods and provide a single runtime
 file. Now that there's more separation between the interface code and the library code, I'd like to investigate using
 other frontend approaches to see which I prefer (and also to weigh up the differences between the currently available
-frameworks). There's still work to do around code separation andhopefully this will be something I can continue to work
+frameworks). There's still work to do around code separation and hopefully this will be something I can continue to work
 on (as time allows) I feel it's at least as stable as the previous version.
 
 
@@ -17,7 +17,6 @@ on (as time allows) I feel it's at least as stable as the previous version.
 - Chrome
 - Firefox
 - Edge
-- IE11 (I may drop support for this to reduce the package size in the future - unless anyone REALY needs it?)
 
 
 ## Implementations

assets/css/style.css

@@ -251,6 +251,16 @@ a {
   background-color: #ffc;
 }
 
+body > * {
+  display: none;
+}
+
+body > main,
+body > footer,
+body > .toast__container {
+  display: block;
+}
+
 main {
   padding: 20px;
 }

assets/scss/style.scss

@@ -49,6 +49,19 @@ a {
   background-color: #ffc;
 }
 
+// Hide all elements on the page except ours - might be easier to add a wrapper or identifying classes to all these...
+body {
+  > * {
+    display: none;
+  }
+
+  > main,
+  > footer,
+  > .toast__container {
+    display: block;
+  }
+}
+
 // Items
 main {
   padding: 20px;

docker-compose.lighttpd.yml

@@ -0,0 +1,17 @@
+version: "3"
+
+services:
+  webdav:
+    build: docker/lighttpd
+    ports:
+      - 8080:80
+    volumes:
+      # main functionality
+      - ./:/var/www/webdav-js
+
+      # configs
+      - ./examples/apache-directory-list-local/webdav.conf:/var/www/conf/webdav.conf:ro
+
+      # demo content
+      - ./src/webdav.js:/var/www/html/source.js:ro
+      - ./assets/css/style.css:/var/www/html/style.css:ro

docker-compose.yml

@@ -2,7 +2,7 @@ version: "3"
 
 services:
   webdav:
-    build: docker/test
+    build: docker/apache
     ports:
       - 8080:80
     volumes:

docker/test/Dockerfile → docker/apache/Dockerfile

@@ -1,28 +1,45 @@
-FROM httpd:2.4.37-alpine
+FROM httpd:2.4-alpine
 
 RUN \
   apk add --upgrade --update-cache curl && \
   mkdir -p /var/www/html && \
   mkdir -p /var/www/conf && \
+\
+  echo "Generating content..." && \
 \
   # add images
   for i in 0 1 2 3 4 5 6 7 8 9; do \
     curl -sL -o "/var/www/html/$i.jpg" "https://picsum.photos/1280/960"; \
+    echo "Added $i.jpg."; \
   done && \
 \
   # add transparent png
   curl -s -o /var/www/html/transparent-test.png "https://www.w3.org/Graphics/PNG/alphatest.png" && \
+  echo "Added transparent-test.png." && \
 \
   # add fonts
   for font in notoserif/NotoSerif-Regular.ttf unlock/Unlock-Regular.ttf blackandwhitepicture/BlackAndWhitePicture-Regular.ttf indieflower/IndieFlower-Regular.ttf; do \
     curl -s -o "/var/www/html/$(basename $font)" "https://cdn.jsdelivr.net/gh/google/fonts/ofl/$font"; \
+    echo "Added $font."; \
   done && \
 \
   # add video
   curl -s -o /var/www/html/video.mp4 "http://techslides.com/demos/sample-videos/small.mp4" && \
+  echo "Added small.mp4." && \
 \
   # add PDF
   curl -s -o /var/www/html/dummy.pdf "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" && \
+  echo "Added dummy.pdf." && \
+\
+  # set ownership properly
+  chown -R daemon:daemon /var/www && \
+\
+  # create some inaccessible files for testing
+  mkdir -p /var/www/html/inaccessible-dir && \
+  curl -sL -o "/var/www/html/inaccessible-image.jpg" "https://picsum.photos/1280/960" && \
+  echo 'Lorem upsum dolor sit amet' > /var/www/html/inaccessible-text-file.txt && \
+  > /var/www/html/inaccessible-file && \
+  chmod 700 /var/www/html/inaccessible* && \
 \
   # set up apache
   echo >> /usr/local/apache2/conf/httpd.conf && \
@@ -45,13 +62,6 @@ RUN \
 \
   # set ownership properly
   chown -R daemon:daemon /var/www && \
-\
-  # create som inaccessible files for testing
-  mkdir -p /var/www/html/inaccessible-dir && \
-  curl -sL -o "/var/www/html/inaccessible-image.jpg" "https://picsum.photos/1280/960" && \
-  echo 'Lorem upsum dolor sit amet' > /var/www/html/inaccessible-text-file.txt && \
-  > /var/www/html/inaccessible-file && \
-  chmod 700 /var/www/html/inaccessible* && \
 \
   # clean up
   apk del curl;

docker/lighttpd/Dockerfile

@@ -0,0 +1,66 @@
+FROM alpine:latest
+
+RUN \
+  apk add --upgrade --update-cache lighttpd lighttpd-mod_webdav curl && \
+  mkdir -p /var/www/html && \
+\
+  echo "Generating content..." && \
+\
+  # add images
+  for i in 0 1 2 3 4 5 6 7 8 9; do \
+    curl -sL -o "/var/www/html/$i.jpg" "https://picsum.photos/1280/960"; \
+    echo "Added $i.jpg."; \
+  done && \
+\
+  # add transparent png
+  curl -s -o /var/www/html/transparent-test.png "https://www.w3.org/Graphics/PNG/alphatest.png" && \
+  echo "Added transparent-test.png." && \
+\
+  # add fonts
+  for font in notoserif/NotoSerif-Regular.ttf unlock/Unlock-Regular.ttf blackandwhitepicture/BlackAndWhitePicture-Regular.ttf indieflower/IndieFlower-Regular.ttf; do \
+    curl -s -o "/var/www/html/$(basename $font)" "https://cdn.jsdelivr.net/gh/google/fonts/ofl/$font"; \
+    echo "Added $font."; \
+  done && \
+\
+  # add video
+  curl -s -o /var/www/html/video.mp4 "http://techslides.com/demos/sample-videos/small.mp4" && \
+  echo "Added small.mp4." && \
+\
+  # add PDF
+  curl -s -o /var/www/html/dummy.pdf "https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" && \
+  echo "Added dummy.pdf." && \
+\
+  # set ownership properly
+  chown -R lighttpd:lighttpd /var/www && \
+\
+  # create some inaccessible files for testing
+  mkdir -p /var/www/html/inaccessible-dir && \
+  curl -sL -o "/var/www/html/inaccessible-image.jpg" "https://picsum.photos/1280/960" && \
+  echo 'Lorem upsum dolor sit amet' > /var/www/html/inaccessible-text-file.txt && \
+  > /var/www/html/inaccessible-file && \
+  chmod 700 /var/www/html/inaccessible* && \
+\
+  mkdir -p /var/run/lighttpd && \
+  chown lighttpd:lighttpd /var/run/lighttpd && \
+  chmod a+w /dev/stderr && \
+\
+  sed -i -e 's/#    "mod_webdav",/    "mod_webdav",/' /etc/lighttpd/lighttpd.conf && \
+  sed -i -e 's/#    "mod_alias",/    "mod_alias",/' /etc/lighttpd/lighttpd.conf && \
+  sed -i -e 's!server.document-root = var.basedir + "/htdocs"!server.document-root = "/var/www/html"!' /etc/lighttpd/lighttpd.conf && \
+\
+  echo >> /etc/lighttpd/lighttpd.conf && \
+  echo 'alias.url = ( "/webdav-js" => "/var/www/webdav-js" )' >> /etc/lighttpd/lighttpd.conf && \
+  echo 'webdav.activate = "enable"' >> /etc/lighttpd/lighttpd.conf && \
+  echo 'webdav.is-readonly = "disable"' >> /etc/lighttpd/lighttpd.conf && \
+  echo 'dir-listing.activate = "enable"' >> /etc/lighttpd/lighttpd.conf && \
+  echo 'dir-listing.external-css = "/webdav-js/assets/css/style-min.css"' >> /etc/lighttpd/lighttpd.conf && \
+  echo 'dir-listing.external-js = "/webdav-js/src/webdav-min.js"' >> /etc/lighttpd/lighttpd.conf && \
+  echo 'dir-listing.encoding = "utf-8"' >> /etc/lighttpd/lighttpd.conf && \
+  echo 'webdav.sqlite-db-name = "/var/run/lighttpd/lighttpd.webdav_lock.db"' >> /etc/lighttpd/lighttpd.conf && \
+\
+  # clean up
+  apk del curl;
+
+EXPOSE 80
+
+CMD ["lighttpd", "-D", "-f", "/etc/lighttpd/lighttpd.conf"]