Add docker support, fix smaller dependency issues in javascript and fix outdated "flattenImage" method

Dockerfile

@@ -0,0 +1,25 @@
+FROM php:7.3-apache
+RUN echo "deb http://http.debian.net/debian/ buster main contrib non-free" > /etc/apt/sources.list && \
+    echo "deb http://http.debian.net/debian/ buster-updates main contrib non-free" >> /etc/apt/sources.list && \
+    echo "deb http://security.debian.org/ buster/updates main contrib non-free" >> /etc/apt/sources.list && \
+    apt-get update
+RUN apt-get install -y --no-install-recommends \
+    imagemagick \
+    ghostscript \
+    libmagickwand-dev \
+    librsvg2-bin \
+    xfonts-100dpi \
+    xfonts-75dpi \
+    xfonts-base \
+    fonts-roboto \
+    fonts-inconsolata \
+    ttf-mscorefonts-installer \
+    fonts-open-sans \
+    fontconfig 
+COPY server/fontconfig/* /etc/fonts/conf.d/
+RUN fc-cache -f -v
+RUN printf "\n" | pecl install imagick
+RUN mkdir -p /tmp
+RUN chmod a+rw /tmp
+
+RUN docker-php-ext-enable imagick

README.md

@@ -27,6 +27,19 @@ To reuse the display driver for another board, just redefine the macros to point
 
 The server should be copied to a PHP enabled server, create a config.php and fill it. Also create a screens/ dir and chmod it to be world readable/writtable.
 
+How to run with docker
+----------------------
+
+If you have docker-compose installed, you can do a simple
+```
+docker-compose up --build
+````
+to start the server. To run it with docker directly you can run
+```
+docker build -t php-im/wifi-display . 
+docker run  -p 80:80  -v "$PWD/server":/var/www/html php-im/wifi-display
+```
+
 Schematics
 ----------
 

docker-compose.yml

@@ -0,0 +1,16 @@
+---
+    version: "3"
+    networks: 
+      web: 
+        driver: "bridge"
+    services: 
+      wifi-display:
+        build:
+          context: .
+          dockerfile: Dockerfile
+        volumes:
+          - "./server:/var/www/html"
+        ports: 
+          - "80:80"
+        networks: 
+          - "web"

server/editor.php

@@ -50,7 +50,7 @@
     <![endif]-->
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
-    <script src="//code.interactjs.io/v1.2.6/interact.min.js"></script>
+    <script src="//cdn.jsdelivr.net/interact.js/1.2.6/interact.min.js"></script>
 
     <script type="text/javascript">
 

server/fontconfig/99-antialiasing-off.conf

@@ -0,0 +1,38 @@
+<?xml version="1.0"?>
+<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
+<fontconfig>
+
+  <match target="pattern" >
+    <!-- autohint was the old automatic hinter when hinting was patent
+    protected, so turn it off to ensure any hinting information in the font
+    itself is used, this is the default -->
+    <edit mode="assign" name="autohint">  <bool>false</bool></edit>
+
+    <!-- hinting is enabled by default -->
+    <edit mode="assign" name="hinting">   <bool>false</bool></edit>
+
+    <!-- for the lcdfilter see http://www.spasche.net/files/lcdfiltering/ -->
+    <edit mode="assign" name="lcdfilter"> <const>lcdnone</const></edit>
+
+    <!-- options for hintstyle:
+    hintfull: is supposed to give a crisp font that aligns well to the
+    character-cell grid but at the cost of its proper shape.
+    hintmedium: poorly documented, maybe a synonym for hintfull.
+    hintslight is the default: - supposed to be more fuzzy but retains shape.
+    
+    hintnone: seems to turn hinting off.
+    The variations are marginal and results vary with different fonts -->
+    <edit mode="assign" name="hintstyle"> <const>hintnone</const></edit>
+
+    <!-- antialiasing is on by default and really helps for faint characters
+    and also for 'xft:' fonts used in rxvt-unicode -->
+    <edit mode="assign" name="antialias"> <bool>false</bool></edit>
+
+    <!-- subpixels are usually rgb, see
+    http://www.lagom.nl/lcd-test/subpixel.php -->
+    <edit mode="assign" name="rgba">      <const>rgb</const></edit>
+
+    <!-- thanks to the Arch wiki for the lcd and subpixel links -->
+  </match>
+
+</fontconfig>

server/functions.php

@@ -55,7 +55,6 @@ static function getRender($widget_name, $settings, $ws, $hs) {
 // Image rendering stuff
 
 function renderSVG($id) {
-	header('Content-type: image/svg+xml');
 
 	// Read the screen and parse it as JSON
 	$scr = file_get_contents("screens/".$id);
@@ -108,7 +107,7 @@ function renderBMP($id, $numc, $maxwidth, $maxheight) {
 	$im->transformImageColorspace(imagick::COLORSPACE_GRAY);
 	$im->posterizeImage($numc, imagick::DITHERMETHOD_NO);
 	$im->setImageBackgroundColor('white');
-	$im = $im->flattenImages(); 
+	$im = $im->mergeImageLayers(Imagick::LAYERMETHOD_FLATTEN);
 	unlink($svgf);
 	unlink($svgf.".png");
 	return $im;