shimmer 0.0.19 → 0.0.20

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: adda5b02ed66f485505f07b24ba314621c5b0dd1cae9ce3093681651f0a1a509
-  data.tar.gz: 89c1baa878afdf2bb38c2cc62eeafd298f15916f11466e5ec1e31eb5b42f9be6
+  metadata.gz: d8819816445402b9ba5fc3a8ffcd9e273f85b34018cd29d0e0c99b5a338e6c37
+  data.tar.gz: 91786fdab270afb2c5cd89c3874284dd1701263eacbd309043ba35b87ae49ad5
 SHA512:
-  metadata.gz: f2add223e56adabf705dcb3061950ea47613d50caf4b7c240b3c7aa1907dbb0ef52b179b409183d2d205f21789d3cc15719e0ade1ba17387085eb47f9e2945d1
-  data.tar.gz: e496ccb035f571cd070c2af88968d0ab6d9d45bcf23016655a9a7213beccf9c83907f001f2f26c4188ce5ce1bc4affbd5c29d2b16d43d60a7949df0e9446f908
+  metadata.gz: 0f0abe61b9c8a001df68bfd019cee02d5de58c2c582ab58ed0f6899dcad78409f9136e62cd5892be9dc5167708f19b04df66afbdaccf0f925e5b986f1e9de97b
+  data.tar.gz: 2f8031509918cd09d64dd87158b9b119fc90f3e594c2fbdc068898bdffe29b5687cb7f6161af7d7d98061fe17ad72747388c8a01e2c381f082801d02ace39193

data/.vscode/settings.json

@@ -5,4 +5,5 @@
     "editor.formatOnSave": false,
     "editor.defaultFormatter": "castwide.solargraph"
   },
+  "typescript.tsdk": "node_modules/typescript/lib"
 }

data/lib/shimmer/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Shimmer
-  VERSION = "0.0.19"
+  VERSION = "0.0.20"
 end

data/src/consent.ts

@@ -1,12 +1,24 @@
 import { getCookie, setCookie } from "./util";
 
+const consentCategories = ["essential", "targeting", "statistic"] as const;
+export type ConsentCategory = typeof consentCategories[number];
+
 export class Consent {
-  get permitted(): string[] {
-    return (getCookie("consent") ?? "").split(",");
+  #consentListeners: Record<ConsentCategory, Array<() => void>> = {
+    essential: [],
+    targeting: [],
+    statistic: [],
+  };
+
+  get permitted(): ConsentCategory[] {
+    return (getCookie("consent") ?? "").split(",") as ConsentCategory[];
   }
 
-  set permitted(settings: string[]) {
+  set permitted(settings: ConsentCategory[]) {
     setCookie("consent", settings.join(","));
+    settings.forEach((category) => {
+      this.#consentListeners[category].forEach((e) => e());
+    });
   }
 
   get given(): boolean {
@@ -14,7 +26,7 @@ export class Consent {
   }
 
   permitAll(): void {
-    this.permitted = ["essential", "targeting", "statistic"];
+    this.permitted = consentCategories.slice();
   }
 
   denyAll(): void {
@@ -25,4 +37,28 @@ export class Consent {
     const element = document.getElementById("personalization-settings");
     if (element) element.hidden = false;
   }
+
+  consentFor(category: ConsentCategory): Promise<void> {
+    return new Promise((res) => {
+      if (this.permitted.includes(category)) {
+        res();
+      } else {
+        this.#consentListeners[category].push(res);
+      }
+    });
+  }
+
+  async enableGoogleAnalytics(
+    id: string,
+    role: ConsentCategory = "statistic"
+  ): Promise<void> {
+    await this.consentFor(role);
+    window.gtag("config", id);
+    const script = document.createElement("script");
+    script.setAttribute(
+      "src",
+      `https://www.googletagmanager.com/gtag/js?id=${id}`
+    );
+    document.head.appendChild(script);
+  }
 }

data/src/controllers/analytics.ts

@@ -0,0 +1,42 @@
+import { Controller } from "@hotwired/stimulus";
+
+interface DataEvent {
+  event: string;
+}
+
+declare global {
+  interface Window {
+    dataLayer?: DataEvent[];
+    gtag(...arg): void;
+  }
+}
+
+const dataLayer = (window.dataLayer = window.dataLayer ?? []);
+
+window.gtag = (...arg) => {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  dataLayer.push(arg as any);
+};
+window.gtag("js", new Date());
+
+export default class extends Controller {
+  connect(): void {
+    this.recordPage();
+  }
+
+  recordAction(event: MouseEvent): void {
+    const data = JSON.parse(
+      (event.target as HTMLElement).dataset.analytics ?? "{}"
+    );
+    dataLayer.push(data);
+  }
+
+  recordPage(): void {
+    const event = {
+      event: "Pageview",
+      path: location.pathname + location.search,
+      host: location.host,
+    };
+    dataLayer.push(event);
+  }
+}

data/src/controllers/consent.ts

@@ -1,4 +1,5 @@
 import { Controller } from "@hotwired/stimulus";
+import { ConsentCategory } from "../consent";
 
 export default class extends Controller {
   static targets = ["check"];
@@ -7,7 +8,7 @@ export default class extends Controller {
   connect(): void {
     this.checkTargets.forEach((input) => {
       input.checked =
-        window.ui?.consent.permitted.includes(input.name) ||
+        window.ui?.consent.permitted.includes(input.name as ConsentCategory) ||
         input.name === "essential";
     });
   }
@@ -29,7 +30,7 @@ export default class extends Controller {
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     window.ui!.consent.permitted = this.checkTargets
       .filter((e) => e.checked)
-      .map((e) => e.name);
+      .map((e) => e.name) as ConsentCategory[];
     this.closeAll();
   }
 

data/src/index.ts

@@ -4,6 +4,7 @@ import { PopoverPresenter } from "./popover";
 import { Consent } from "./consent";
 import RemoteNavigationController from "./controllers/remote-navigation";
 import ConsentController from "./controllers/consent";
+import AnalyticsController from "./controllers/analytics";
 import "./touch";
 
 export { registerServiceWorker } from "./serviceworker";
@@ -19,6 +20,12 @@ declare global {
   }
 }
 
+window.ui = {
+  modal: new ModalPresenter(),
+  popover: new PopoverPresenter(),
+  consent: new Consent(),
+};
+
 function createRemoteDestination(): void {
   if (document.getElementById("shimmer")) {
     return;
@@ -37,9 +44,7 @@ export async function start({
   createRemoteDestination();
   application.register("remote-navigation", RemoteNavigationController);
   application.register("consent", ConsentController);
-  window.ui = {
-    modal: new ModalPresenter(),
-    popover: new PopoverPresenter(),
-    consent: new Consent(),
-  };
+  application.register("analytics", AnalyticsController);
 }
+
+export const ui = window.ui;

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: shimmer
 version: !ruby/object:Gem::Version
-  version: 0.0.19
+  version: 0.0.20
 platform: ruby
 authors:
 - Jens Ravens
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2022-07-12 00:00:00.000000000 Z
+date: 2022-07-20 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rake
@@ -165,6 +165,7 @@ files:
 - package.json
 - rollup.config.js
 - src/consent.ts
+- src/controllers/analytics.ts
 - src/controllers/consent.ts
 - src/controllers/remote-navigation.ts
 - src/index.ts