[OPTIMIZE] JavaScript loading&dependencies

Classes/ViewHelpers/Format/EscapeViewHelper.php

@@ -20,11 +20,11 @@ public static function renderStatic(array $arguments, \Closure $renderChildrenCl
         }
 
         // Remove Linebreaks from RTE fields
-        $value = preg_replace("/\r|\n/", " ", $value);
+        $value = preg_replace('/\R+/', ' ', $value);
 
         // Escape ', ", \
         $value = addslashes($value);
 
         return $value;
     }
-}
+}

Resources/Private/Partials/Klaro/Service.html

@@ -6,7 +6,7 @@
 <f:if condition="{service.categories}">
     <we:variable name="purposes"><f:for each="{service.categories}" as="category" iteration="iterator">'{category.title -> f:format.case(mode: 'lower')}'<f:if condition="{iterator.isLast} != 1">, </f:if></f:for></we:variable>
 </f:if>
-<script type="text/javascript">
+<script type="module">
     klaroConfig.services.push({
         name: '<f:format.raw>{service.provider}-{service.uid}</f:format.raw>',
         title: '<f:format.raw><we:format.escape>{service.title}</we:format.escape></f:format.raw>',

Resources/Private/Templates/Consent/Consent.html

@@ -18,20 +18,20 @@
 
 	<f:section name="FooterAssets">
 		<f:spaceless>
-			<script type="text/javascript" src="{f:uri.resource(path: 'JavaScript/Controller/ConsentController.js')}"></script>
-			<script type="text/javascript">var klaroConfig = {f:format.htmlentitiesDecode(value: '{klaroConfig -> we:format.json()}')}</script>
-			<f:for each="{services}" as="service">
-				<f:render partial="Service/{service.provider}" section="Footer" arguments="{service:service}" optional="1"/>
-				<f:render partial="Klaro/Service" arguments="{service:service}"/>
-			</f:for>
 			<f:if condition="{settings.klaro.stylePrefix}">
 				<f:then>
-					<script type="text/javascript" src="{f:uri.resource(path: 'Library/klaro/klaro.js')}"></script>
+					<script defer src="{f:uri.resource(path: 'Library/klaro/klaro.js')}"></script>
 				</f:then>
 				<f:else>
-					<script type="text/javascript" src="{f:uri.resource(path: 'Library/klaro/klaro-no-css.js')}"></script>
+					<script defer src="{f:uri.resource(path: 'Library/klaro/klaro-no-css.js')}"></script>
 				</f:else>
 			</f:if>
+			<script defer src="{f:uri.resource(path: 'JavaScript/Controller/ConsentController.js')}"></script>
+			<script>var klaroConfig = {f:format.htmlentitiesDecode(value: '{klaroConfig -> we:format.json()}')}</script>
+			<f:for each="{services}" as="service">
+				<f:render partial="Service/{service.provider}" section="Footer" arguments="{service:service}" optional="1"/>
+				<f:render partial="Klaro/Service" arguments="{service:service}"/>
+			</f:for>
 		</f:spaceless>
 	</f:section>
 </html>

Resources/Private/Templates/Consent/List.html

@@ -21,6 +21,6 @@
 				</table>
 			</f:if>
 		</f:for>
-		<a href="#" class="btn btn-primary btn-lg js-showConsentModal"><f:translate key="list.button.openConsent" /></a>
+		<a href="javascript:;" onclick="event.preventDefault();klaro.show()" class="btn btn-primary btn-lg"><f:translate key="list.button.openConsent"/></a>
 	</f:section>
 </html>

Resources/Public/JavaScript/Controller/ConsentController.js

@@ -10,40 +10,27 @@ let ConsentApp = new function ConsentController() {
      * @param object service
      */
     this.consentChanged = function (state, service) {
-        if (state === true) {
-            if (service.name.indexOf('google-tagmanager-service') !== -1) {
-                let tempObj = {
-                    event: service.gtm.trigger
-                };
-                tempObj[service.gtm.variable] = true;
-                window.dataLayer.push(tempObj);
+        if (state === true && service.name.indexOf('google-tagmanager-service') !== -1) {
+            let tempObj = {
+                event: service.gtm.trigger
+            };
+            tempObj[service.gtm.variable] = true;
+            window.dataLayer.push(tempObj);
 
-                /*
-                //ES6 - https://stackoverflow.com/questions/11508463/javascript-set-object-key-by-variable
-                window.dataLayer.push({
-                    event: service.name,
-                    [service.name]: true
-                });
-                */
-            }
+            /*
+            //ES6 - https://stackoverflow.com/questions/11508463/javascript-set-object-key-by-variable
+            window.dataLayer.push({
+                event: service.name,
+                [service.name]: true
+            });
+            */
         }
 
         //Check if the own callback function is allready defined
-        if (typeof window[service.ownCallback] === "function") {
+        if (typeof window[service.ownCallback] === 'function') {
             window[service.ownCallback](state, service);
         } else if (service.ownCallback !== '') {
             console.error('The Callback function ' + service.ownCallback + ' is not yet defined. Please create it first.');
         }
     };
-
-    //--- constructor ---
-    (function contruct() {
-        $(document).ready(function () {
-            //Listener for the button on the privacy page, to edit the consent
-            $(document).on('click', '.js-showConsentModal', function (event) {
-                event.preventDefault();
-                klaro.show();
-            });
-        });
-    })();
 };