@@ -138,18 +138,123 @@ html {

   }

 }

+#player-audio-controls {

+  position: absolute;

+  right: 40px;

+  bottom: 120px;

+  height: 32px;

+  width: 39px;

+

+  a {

+    opacity: 0;

+    visibility: hidden;

+    @include transition(opacity 0.25s ease-in-out);

+

+    &:before {

+      display: block;

+      visibility: hidden;

+      opacity: 0;

+      font-family: $font-family-alternate;

+      font-size: font-size(10px);

+      white-space: nowrap;

+      position: absolute;

+      right: 100%;

+      margin-right: 20px;

+      top: 50%;

+      @include transform(translate3d(0,-50%,0));

+      content: attr(data-label);

+      background-color: rgba($color-bg-tertiary, 0.8);

+      color: $color-bg-primary;

+      padding: 2px 5px 0;

+      line-height: 2;

+      text-transform: uppercase;

+      @include transition(all 0.25s ease-in-out);

+

+    }

+

+    &.-show {

+      opacity: .8;

+      visibility: visible;

+    }

+

+    &:hover {

+      opacity: 1;

+

+      &:before {

+        opacity: 1;

+        visibility: visible;

+      }

+    }

+  }

+

+  svg {

+    height: 32px;

+    width: auto;

+    position: absolute;

+    fill: $color-bg-tertiary;

+  }

+}

+

 #scroll-down-indicator {

   z-index: 10;

   position: fixed;

   right: 40px;

   bottom: 40px;

-  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");

-  mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");

-  -webkit-mask-repeat: no-repeat;

-  mask-repeat: no-repeat;

   width: 40px;

   height: 20px;

-  background-color: rgba($color-bg-tertiary,0.8);

+

+  span {

+    display: block;

+    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");

+    mask-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 123 62' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cpath d='M57.548,60.943c2.509,1.409 5.581,1.409 8.09,0l54.92,-36.13c2.31,-1.41 3.18,-5.08 1.74,-7.05l-7,-15c-1.39,-2.22 -5.14,-2.78 -7.46,-1.37l-46.24,30.23l-45.67,-29.95c-2.6,-1.69 -6.36,-0.84 -7.52,0.85l-7.22,15.24c-1.45,2.25 -0.29,5.64 1.73,7.05l54.63,36.13Z' style='fill:%23000000;fill-rule:nonzero;'/%3E%3C/svg%3E");

+    -webkit-mask-repeat: no-repeat;

+    mask-repeat: no-repeat;

+    width: 40px;

+    height: 20px;

+    background-color: rgba($color-bg-tertiary, 0.8);

+    @include transition(all 0.25s ease-in-out);

+  }

+

+  &:before {

+    display: block;

+    visibility: hidden;

+    opacity: 0;

+    font-family: $font-family-alternate;

+    font-size: font-size(10px);

+    white-space: nowrap;

+    position: absolute;

+    right: 100%;

+    margin-right: 20px;

+    top: 50%;

+    @include transform(translate3d(0,-50%,0));

+    content: attr(data-label-down);

+    background-color: rgba($color-bg-tertiary, 0.8);

+    color: $color-bg-primary;

+    padding: 2px 5px 0;

+    line-height: 2;

+    text-transform: uppercase;

+    @include transition(all 0.25s ease-in-out);

+

+  }

+

+  &.-at-bottom {

+    span {

+      @include transform(rotate(180deg));

+    }

+    &:before {

+      content: attr(data-label-top);

+    }

+  }

+

+  &:hover {

+    span {

+      background-color: rgba($color-bg-tertiary, 1);

+    }

+    &:before {

+      opacity: 1;

+      visibility: visible;

+    }

+  }

 }

 .widget p.error {

new file mode 100644

@@ -0,0 +1 @@

+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 39 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g><path d="M0,11.056c0.096,-0.555 0.511,-1.003 1.058,-1.14c0.299,-0.05 0.603,-0.07 0.907,-0.06l4.237,0c0.073,-0.003 0.141,-0.035 0.188,-0.09c1.14,-1.11 2.25,-2.25 3.397,-3.337l6,-5.843c0.318,-0.33 0.744,-0.535 1.2,-0.577c0.05,-0.006 0.101,-0.009 0.151,-0.009c0.705,-0 1.289,0.571 1.304,1.276c0.056,0.621 0.073,1.245 0.053,1.868l0,26.04c-0.009,0.364 -0.08,0.724 -0.21,1.065c-0.161,0.515 -0.641,0.868 -1.181,0.868c-0.244,-0 -0.483,-0.073 -0.686,-0.208c-0.359,-0.21 -0.691,-0.462 -0.99,-0.75c-2.245,-2.19 -4.483,-4.385 -6.713,-6.585l-2.25,-2.25c-0.069,-0.061 -0.156,-0.097 -0.248,-0.105l-4.717,-0c-0.675,0.013 -1.273,-0.452 -1.425,-1.11c0.003,-0.03 0.003,-0.06 0,-0.09l-0.075,-8.963Z" style="fill-rule:nonzero;"/><path d="M22.5,7.899c-0.321,0.318 -0.502,0.752 -0.502,1.203c0,0.452 0.181,0.886 0.502,1.204l12.923,12.923c0.322,0.361 0.784,0.567 1.268,0.567c0.934,0 1.703,-0.768 1.703,-1.702c-0,-0.486 -0.208,-0.95 -0.572,-1.273l-12.914,-12.922c-0.663,-0.657 -1.746,-0.657 -2.408,-0" style="fill-rule:nonzero;"/><path d="M37.785,7.899c0.321,0.318 0.502,0.752 0.502,1.203c-0,0.452 -0.181,0.886 -0.502,1.204l-12.915,12.923c-0.318,0.309 -0.744,0.483 -1.188,0.483c-0.934,-0 -1.703,-0.769 -1.703,-1.703c0,-0.443 0.174,-0.87 0.483,-1.188l12.923,-12.922c0.66,-0.656 1.74,-0.656 2.4,-0" style="fill-rule:nonzero;"/></g></svg>

\ No newline at end of file

new file mode 100644

@@ -0,0 +1 @@

+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 37 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g><path d="M0,11.055c0.096,-0.554 0.511,-1.003 1.058,-1.14c0.299,-0.05 0.603,-0.07 0.907,-0.06l4.237,0c0.072,-0.004 0.14,-0.037 0.188,-0.09l3.398,-3.337l6,-5.843c0.321,-0.329 0.749,-0.533 1.207,-0.577c0.047,-0.005 0.095,-0.008 0.143,-0.008c0.706,0 1.292,0.57 1.312,1.275c0.04,0.637 0.045,1.276 0.015,1.913l0,26.04c-0.002,0.364 -0.071,0.725 -0.202,1.065c-0.164,0.515 -0.646,0.868 -1.187,0.868c-0.245,-0 -0.484,-0.073 -0.688,-0.208c-0.357,-0.21 -0.687,-0.462 -0.983,-0.75l-6.75,-6.585l-2.25,-2.25c-0.069,-0.06 -0.156,-0.097 -0.247,-0.105l-4.695,-0c-0.677,0.017 -1.276,-0.45 -1.425,-1.11c0.002,-0.03 0.002,-0.06 -0,-0.09l-0.038,-9.008Z" style="fill-rule:nonzero;"/><path d="M36.93,15.81c-0.107,5.614 -3.233,10.754 -8.167,13.433c-0.32,0.228 -0.686,0.382 -1.073,0.45c-0.548,0.081 -1.092,-0.185 -1.365,-0.668c-0.302,-0.458 -0.284,-1.06 0.045,-1.5c0.146,-0.204 0.339,-0.371 0.563,-0.487c0.95,-0.464 1.839,-1.043 2.647,-1.725c2.468,-2.087 4.048,-5.039 4.417,-8.25c0.571,-4.782 -1.614,-9.496 -5.632,-12.15c-0.435,-0.285 -0.908,-0.533 -1.373,-0.75c-0.51,-0.252 -0.811,-0.799 -0.75,-1.365c0.017,-0.567 0.391,-1.064 0.931,-1.238c0.369,-0.131 0.778,-0.101 1.125,0.083c2.037,1.023 3.829,2.477 5.25,4.26c1.261,1.566 2.201,3.365 2.767,5.295c0.451,1.518 0.666,3.096 0.637,4.68" style="fill-rule:nonzero;"/><path d="M31.253,15.72c-0.036,3.174 -1.412,6.19 -3.788,8.295c-0.685,0.617 -1.44,1.151 -2.25,1.59c-0.668,0.374 -1.524,0.142 -1.912,-0.517c-0.132,-0.219 -0.202,-0.469 -0.202,-0.724c0,-0.526 0.296,-1.009 0.764,-1.249c2.816,-1.468 4.588,-4.392 4.588,-7.567c-0,-3.176 -1.772,-6.099 -4.588,-7.568c-0.435,-0.252 -0.704,-0.719 -0.704,-1.222c-0,-0.775 0.638,-1.413 1.413,-1.413c0.249,-0 0.493,0.065 0.709,0.19c2.702,1.44 4.715,3.91 5.58,6.848c0.304,1.086 0.455,2.209 0.45,3.337" style="fill-rule:nonzero;"/><path d="M25.575,15.533c-0.014,2.444 -1.59,4.622 -3.907,5.4c-0.407,0.177 -0.867,0.19 -1.283,0.037c-0.534,-0.236 -0.876,-0.773 -0.863,-1.357c0.029,-0.606 0.439,-1.131 1.021,-1.305c1.096,-0.249 1.937,-1.141 2.122,-2.25c0.29,-1.452 -0.61,-2.897 -2.04,-3.278c-0.679,-0.116 -1.18,-0.713 -1.178,-1.402c-0.008,-0.757 0.601,-1.39 1.358,-1.41c0.619,0.029 1.22,0.215 1.747,0.54c1.575,0.83 2.667,2.358 2.94,4.117c0.043,0.294 0.07,0.589 0.083,0.885" style="fill-rule:nonzero;"/></g></svg>

\ No newline at end of file

@@ -105,27 +105,72 @@ function Onepage(list, options) {

     window.scrollToNextSection = function () {

       let sections = document.querySelectorAll('#main .inside > .mod_article, #footer');

+      var scroller = document.querySelector('#scroll-down-indicator');

       var section;

-      for (let i = 0; i < sections.length; i++)

+      if ((scroller !== undefined && !scroller.classList.contains('-at-bottom')) || scroller === undefined)

       {

-        section = sections[i];

-        let boundingArea = section.getBoundingClientRect();

-        let viewportTrigger = window.innerHeight;

-        if (boundingArea.top < viewportTrigger-15)

+        for (var i = 0; i < sections.length; i++)

         {

-          continue;

-        }

+          section = sections[i];

+          let boundingArea = section.getBoundingClientRect();

+          let viewportTrigger = window.innerHeight;

+

+          if (boundingArea.top < viewportTrigger - 15)

+          {

+            continue;

+          }

+          scrollTo({

+            top: getOffsetTop(section),

+            behavior: "smooth"

+          });

+          break;

+        }

+      } else if (i == sections.length || (scroller !== undefined && scroller.classList.contains('-at-bottom'))) {

         scrollTo({

-          top: getOffsetTop(section),

+          top: 0,

           behavior: "smooth"

         });

-        break;

       }

+

       return section;

     }

+    var scroller = document.querySelector('#scroll-down-indicator');

+

+    if (scroller)

+    {

+      // let bottomElements = document.querySelectorAll('#main .inside > .mod_article:last-child, #footer');

+      let bottomElements = document.querySelectorAll('#footer');

+      const scrollIndicatorObserver = new IntersectionObserver (function (elements) {

+        let isIntersecting = false;

+        elements.forEach(function(element) {

+          if (element.isIntersecting) {

+            isIntersecting = true;

+          }

+        });

+        if (isIntersecting)

+        {

+          scroller.classList.add('-at-bottom');

+        } else {

+          scroller.classList.remove('-at-bottom');

+        }

+      },{rootMargin: "0px 0px 33.333% 0px"});

+

+      bottomElements.forEach(function(el) {

+        scrollIndicatorObserver.observe(el);

+      });

+

+      scroller.addEventListener("click", function(event) {

+        if (window.scrollToNextSection)

+        {

+          event.preventDefault();

+          window.scrollToNextSection();

+        }

+      })

+    }

+

   });

 };

new file mode 100644

@@ -0,0 +1,93 @@

+<?php

+

+declare(strict_types=1);

+

+namespace App\EventListener;

+

+use Contao\CoreBundle\DependencyInjection\Attribute\AsHook;

+use Contao\FilesModel;

+use Contao\Validator;

+

+#[AsHook("replaceInsertTags")]

+class ReplaceInsertTagListener

+{

+    public function __invoke(string $insertTag, bool $useCache, string $cachedValue, array $flags, array $tags, array $cache, int $_rit, int $_cnt)

+    {

+        $elements = explode('::', $insertTag,2);

+        $insertTag = array_shift($elements);

+

+        if (strtolower($insertTag) === 'svg_inline') {

+            if (isset($elements[0]) && $elements[0])

+            {

+                $fragments = explode(':', $elements[0]);

+                $strFile = $fragments[0];

+                $strId = null;

+                $strClass = null;

+                if (isset($fragments[1]))

+                {

+                    $strClass = $fragments[1];

+                }

+                if (isset($fragments[2]))

+                {

+                    $strId = $fragments[2];

+                }

+

+                if (Validator::isUuid($strFile))

+                {

+                    // Handle UUIDs

+                    $objFile = FilesModel::findByUuid($strFile);

+

+                    if ($objFile === null)

+                    {

+                        return '';

+                    }

+

+                    $strFile = $objFile->path;

+                }

+                elseif (is_numeric($strFile))

+                {

+                    // Handle numeric IDs (see #4805)

+                    $objFile = FilesModel::findByPk($strFile);

+

+                    if ($objFile === null)

+                    {

+                        return '';

+                    }

+

+                    $strFile = $objFile->path;

+                }

+                elseif (Validator::isInsecurePath($strFile))

+                {

+                    throw new \RuntimeException('Invalid path ' . $strFile);

+                }

+                elseif (($objFile = FilesModel::findByPath($strFile)) !== null)

+                {

+                    $strFile = $objFile->path;

+                } else {

+                    return '';

+                }

+

+                return $this->print_svg($strFile,$strClass,$strId);

+            }

+        }

+    }

+

+    protected function print_svg($svgPath, ?string $strClass=null, ?string$strId=null){

+        $iconfile = new \DOMDocument();

+        $iconfile->load($svgPath);

+        if (($svg = $iconfile->getElementsByTagName('svg')->item(0)))

+        {

+            if ($strClass) {

+                if (($embClass = $svg->getAttribute('class')))

+                {

+                    $strClass = $embClass. ' ' . $strClass;

+                }

+                $svg->setAttribute('class', $strClass);

+            }

+            if ($strId){

+                $svg->setAttribute('id', $strId);

+            }

+            return $iconfile->saveHTML($svg);

+        }

+    }

+}

new file mode 100644

@@ -0,0 +1,47 @@

+<div id="player-audio-controls" data-source-selector="#image-clip video">

+    <a href="{{env::request|urlattr}}" class="audio-mute" aria-label="Ton stummschalten" data-label="Ton stummschalten">{{svg_inline::f6824c1a-7d6c-11ed-9054-d8cb8a1a4c4f}}</a>

+    <a href="{{env::request|urlattr}}" class="audio-unmute" aria-label="Ton einschalten" data-label="Ton einschalten">{{svg_inline::9b19cf0a-7d6d-11ed-9054-d8cb8a1a4c4f}}</a>

+</div>

+<script>

+  document.addEventListener("DOMContentLoaded", function() {

+

+    var controls = document.getElementById('player-audio-controls');

+    var video = controls !== undefined && controls.dataset.sourceSelector !== undefined ? document.querySelector(controls.dataset.sourceSelector) : undefined;

+

+    if (video !== undefined)

+    {

+      let mute = controls.querySelector('.audio-mute'),

+        unmute = controls.querySelector('.audio-unmute');

+

+      if (mute !== undefined && unmute !== undefined)

+      {

+        if (video.muted)

+        {

+          unmute.classList.add('-show');

+          mute.classList.remove('-show');

+        } else {

+          mute.classList.add('-show');

+          unmute.classList.remove('-show');

+        }

+

+        unmute.addEventListener('click', (event) => {

+          event.preventDefault();

+          if (video.muted) {

+            video.muted = false;

+            mute.classList.add('-show');

+            unmute.classList.remove('-show');

+          }

+        });

+        mute.addEventListener('click', (event) => {

+          event.preventDefault();

+          if (!video.muted) {

+            video.muted = true;

+            unmute.classList.add('-show');

+            mute.classList.remove('-show');

+          }

+        });

+      }

+    }

+

+  });

+</script>

deleted file mode 100644

Binary files a/var/backups/backup__20221216103209.sql.gz and /dev/null differ

new file mode 100644

Binary files /dev/null and b/var/backups/backup__20221216185236.sql.gz differ