feat: Add Grafana Faro setup and made it configurable.

Release-As: 1.0.0

README.md

@@ -22,4 +22,35 @@ git submodule add https://github.com/cbos/hugo-faro-analytics.git themes/faro-an
 
 ```
 {{ partial "faro-analytics/assets/js" . }}
+```
+
+## Site Configuration TOML
+
+| Parameter   | type   | required | description                                                                                  |  
+|-------------|--------|----------|----------------------------------------------------------------------------------------------|
+| endpoint    | string | yes      | Url of the Faro collector like https://faro-collector-prod-eu-west-2.grafana.net/collect/xxx | 
+| name        | string | yes      | Name of the application                                                                      |
+| version     | string | no       | Version to report, can be used to make distinction between releases                          | 
+| environment | string | no       | Environment, can be used to make distinction between for example local and production        |
+
+```toml
+[params]
+[params.faro_analytics]
+    endpoint = "https://faro-collector-..."
+    name = "name"
+    version = "1.0.0"
+    environment = "production"
+```
+
+## Page Configuration TOML
+
+If you want to exclude a page from analytics, you can configure that per page.
+
+| Parameter   | type    | required | description                                                           |  
+|-------------|---------|----------|-----------------------------------------------------------------------|
+| enabled     | boolean | no       | By default analysis for a page is abled. Make it `false` to disable it | 
+
+```yaml
+faro_analytics:
+  analyze: true
 ```

layouts/partials/faro-analytics/assets/js.html

@@ -1,5 +1,47 @@
-<!-- place holder for code -->
+{{- if default true .Params.faro_analytics.analyze }}
+{{- $endpoint := site.Params.faro_analytics.endpoint }}
+{{- $name := site.Params.faro_analytics.name }}
+{{- $version := site.Params.faro_analytics.version }}
+{{- $environment := site.Params.faro_analytics.environment }}
 
 <script>
-    console.info("Hugo Faro analytics module loaded")
-</script>
+    (function () {
+        var webSdkScript = document.createElement("script");
+
+        webSdkScript.src =
+            "https://unpkg.com/@grafana/faro-web-sdk@^1.0.0/dist/bundle/faro-web-sdk.iife.js";
+
+        webSdkScript.onload = () => {
+            window.GrafanaFaroWebSdk.initializeFaro({
+                url: "{{ $endpoint }}",
+                app: {
+                    name: "{{ $name }}",
+                    version: "{{ $version }}",
+                    environment: "{{ $environment }}",
+                },
+            });
+
+
+            // Load instrumentations at the onLoad event of the web-SDK and after the above configuration.
+            // This is important because we need to ensure that the Web-SDK has been loaded and initialized before we add further instruments!
+            var webTracingScript = document.createElement("script");
+
+            webTracingScript.src =
+                "https://unpkg.com/@grafana/faro-web-tracing@^1.0.0/dist/bundle/faro-web-tracing.iife.js";
+
+            // Initialize, configure (if necessary) and add the the new instrumentation to the already loaded and configured Web-SDK.
+            webTracingScript.onload = () => {
+                window.GrafanaFaroWebSdk.faro.instrumentations.add(
+                    new window.GrafanaFaroWebTracing.TracingInstrumentation()
+                );
+            };
+
+            // Append the Web Tracing script script tag to the HTML page
+            document.head.appendChild(webTracingScript);
+        };
+
+        // Append the Web-SDK script script tag to the HTML page
+        document.head.appendChild(webSdkScript);
+    })();
+</script>
+{{- end }}