clarity-js 0.8.3 → 0.8.4-beta

package/src/interaction/encode.ts

@@ -1,193 +1,196 @@
-import { Constant, Event, Token } from "@clarity-types/data";
-import * as scrub from "@src/core/scrub";
-import { time } from "@src/core/time";
-import * as baseline from "@src/data/baseline";
-import { queue } from "@src/data/upload";
-import { metadata } from "@src/layout/target";
-import * as change from "@src/interaction/change";
-import * as click from "@src/interaction/click";
-import * as clipboard from "@src/interaction/clipboard";
-import * as input from "@src/interaction/input";
-import * as pointer from "@src/interaction/pointer";
-import * as resize from "@src/interaction/resize";
-import * as scroll from "@src/interaction/scroll";
-import * as selection from "@src/interaction/selection";
-import * as submit from "@src/interaction/submit";
-import * as timeline from "@src/interaction/timeline";
-import * as unload from "@src/interaction/unload";
-import * as visibility from "@src/interaction/visibility";
-
-export default async function (type: Event, ts: number = null): Promise<void> {
-    let t = ts || time();
-    let tokens: Token[] = [t, type];
-    switch (type) {
-        case Event.MouseDown:
-        case Event.MouseUp:
-        case Event.MouseMove:
-        case Event.MouseWheel:
-        case Event.DoubleClick:
-        case Event.TouchStart:
-        case Event.TouchEnd:
-        case Event.TouchMove:
-        case Event.TouchCancel:
-            for (let entry of pointer.state) {
-                let pTarget = metadata(entry.data.target as Node, entry.event);
-                if (pTarget.id > 0) {
-                    tokens = [entry.time, entry.event];
-                    tokens.push(pTarget.id);
-                    tokens.push(entry.data.x);
-                    tokens.push(entry.data.y);
-                    if (entry.data.id !== undefined) { 
-                        tokens.push(entry.data.id); 
-
-                        if (entry.data.isPrimary !== undefined) { 
-                            tokens.push(entry.data.isPrimary.toString()); 
-                        }
-                    }
-                    queue(tokens);
-                    baseline.track(entry.event, entry.data.x, entry.data.y, entry.time);
-                }
-            }
-            pointer.reset();
-            break;
-        case Event.Click:
-            for (let entry of click.state) {
-                let cTarget = metadata(entry.data.target as Node, entry.event, entry.data.text);
-                tokens = [entry.time, entry.event];
-                let cHash = cTarget.hash ? cTarget.hash.join(Constant.Dot) : Constant.Empty;
-                tokens.push(cTarget.id);
-                tokens.push(entry.data.x);
-                tokens.push(entry.data.y);
-                tokens.push(entry.data.eX);
-                tokens.push(entry.data.eY);
-                tokens.push(entry.data.button);
-                tokens.push(entry.data.reaction);
-                tokens.push(entry.data.context);
-                tokens.push(scrub.text(entry.data.text, "click", cTarget.privacy));
-                tokens.push(scrub.url(entry.data.link));
-                tokens.push(cHash);
-                tokens.push(entry.data.trust);
-                tokens.push(entry.data.isFullText);
-                queue(tokens);
-                timeline.track(entry.time, entry.event, cHash, entry.data.x, entry.data.y, entry.data.reaction, entry.data.context);
-            }
-            click.reset();
-            break;
-        case Event.Clipboard:
-            for (let entry of clipboard.state) {
-                tokens = [entry.time, entry.event];
-                let target = metadata(entry.data.target as Node, entry.event);
-                if (target.id > 0) {
-                    tokens.push(target.id);
-                    tokens.push(entry.data.action);
-                    queue(tokens);
-                }
-            }
-            clipboard.reset();
-            break;
-        case Event.Resize:
-            let r = resize.data;
-            tokens.push(r.width);
-            tokens.push(r.height);
-            baseline.track(type, r.width, r.height);
-            resize.reset();
-            queue(tokens);
-            break;
-        case Event.Unload:
-            let u = unload.data;
-            tokens.push(u.name);
-            tokens.push(u.persisted);
-            unload.reset();
-            queue(tokens);
-            break;
-        case Event.Input:
-            for (let entry of input.state) {
-                let iTarget = metadata(entry.data.target as Node, entry.event, entry.data.value);
-                tokens = [entry.time, entry.event];
-                tokens.push(iTarget.id);
-                tokens.push(scrub.text(entry.data.value, "input", iTarget.privacy, false, entry.data.type));
-                queue(tokens);
-            }
-            input.reset();
-            break;
-        case Event.Selection:
-            let s = selection.data;
-            if (s) {
-                let startTarget = metadata(s.start as Node, type);
-                let endTarget = metadata(s.end as Node, type);
-                tokens.push(startTarget.id);
-                tokens.push(s.startOffset);
-                tokens.push(endTarget.id);
-                tokens.push(s.endOffset);
-                selection.reset();
-                queue(tokens);
-            }
-            break;
-        case Event.Scroll:
-            for (let entry of scroll.state) {
-                let sTarget = metadata(entry.data.target as Node, entry.event);
-                const top = metadata(entry.data.top as Node, entry.event);
-                const bottom = metadata(entry.data.bottom as Node, entry.event);
-                const sTopHash = top?.hash ? top.hash.join(Constant.Dot) : Constant.Empty;
-                const sBottomHash = bottom?.hash ? bottom.hash.join(Constant.Dot) : Constant.Empty;
-                if (sTarget.id > 0) {
-                    tokens = [entry.time, entry.event];
-                    tokens.push(sTarget.id);
-                    tokens.push(entry.data.x);
-                    tokens.push(entry.data.y);
-                    tokens.push(sTopHash);
-                    tokens.push(sBottomHash);
-                    queue(tokens);
-                    baseline.track(entry.event, entry.data.x, entry.data.y, entry.time);
-                }
-            }
-            scroll.reset();
-            break;
-        case Event.Change:
-            for (let entry of change.state) {
-                tokens = [entry.time, entry.event];
-                let target = metadata(entry.data.target as Node, entry.event);
-                if (target.id > 0) {
-                    tokens = [entry.time, entry.event];
-                    tokens.push(target.id);
-                    tokens.push(entry.data.type);
-                    tokens.push(scrub.text(entry.data.value, "change", target.privacy));
-                    tokens.push(scrub.text(entry.data.checksum, "checksum", target.privacy));
-                    queue(tokens);
-                }
-            }
-            change.reset();
-            break;
-        case Event.Submit:
-            for (let entry of submit.state) {
-                tokens = [entry.time, entry.event];
-                let target = metadata(entry.data.target as Node, entry.event);
-                if (target.id > 0) {
-                    tokens.push(target.id);
-                    queue(tokens);
-                }
-            }
-            submit.reset();
-            break;
-        case Event.Timeline:
-            for (let entry of timeline.updates) {
-                tokens = [entry.time, entry.event];
-                tokens.push(entry.data.type);
-                tokens.push(entry.data.hash);
-                tokens.push(entry.data.x);
-                tokens.push(entry.data.y);
-                tokens.push(entry.data.reaction);
-                tokens.push(entry.data.context);
-                queue(tokens, false);
-            }
-            timeline.reset();
-            break;
-        case Event.Visibility:
-            let v = visibility.data;
-            tokens.push(v.visible);
-            queue(tokens);
-            baseline.visibility(t, v.visible);
-            visibility.reset();
-            break;
-    }
-}
+import { Constant, Event, Token } from "@clarity-types/data";
+import * as scrub from "@src/core/scrub";
+import { time } from "@src/core/time";
+import * as baseline from "@src/data/baseline";
+import { queue } from "@src/data/upload";
+import { metadata } from "@src/layout/target";
+import * as change from "@src/interaction/change";
+import * as click from "@src/interaction/click";
+import * as clipboard from "@src/interaction/clipboard";
+import * as input from "@src/interaction/input";
+import * as pointer from "@src/interaction/pointer";
+import * as resize from "@src/interaction/resize";
+import * as scroll from "@src/interaction/scroll";
+import * as selection from "@src/interaction/selection";
+import * as submit from "@src/interaction/submit";
+import * as timeline from "@src/interaction/timeline";
+import * as unload from "@src/interaction/unload";
+import * as visibility from "@src/interaction/visibility";
+
+export default async function (type: Event, ts: number = null): Promise<void> {
+    let t = ts || time();
+    let tokens: Token[] = [t, type];
+    switch (type) {
+        case Event.MouseDown:
+        case Event.MouseUp:
+        case Event.MouseMove:
+        case Event.MouseWheel:
+        case Event.DoubleClick:
+        case Event.TouchStart:
+        case Event.TouchEnd:
+        case Event.TouchMove:
+        case Event.TouchCancel:
+            for (let entry of pointer.state) {
+                let pTarget = metadata(entry.data.target as Node, entry.event);
+                if (pTarget.id > 0) {
+                    tokens = [entry.time, entry.event];
+                    tokens.push(pTarget.id);
+                    tokens.push(entry.data.x);
+                    tokens.push(entry.data.y);
+                    if (entry.data.id !== undefined) { 
+                        tokens.push(entry.data.id); 
+
+                        if (entry.data.isPrimary !== undefined) { 
+                            tokens.push(entry.data.isPrimary.toString()); 
+                        }
+                    }
+                    queue(tokens);
+                    baseline.track(entry.event, entry.data.x, entry.data.y, entry.time);
+                }
+            }
+            pointer.reset();
+            break;
+        case Event.Click:
+            for (let entry of click.state) {
+                let cTarget = metadata(entry.data.target as Node, entry.event, entry.data.text);
+                tokens = [entry.time, entry.event];
+                let cHash = cTarget.hash ? cTarget.hash.join(Constant.Dot) : Constant.Empty;
+                tokens.push(cTarget.id);
+                tokens.push(entry.data.x);
+                tokens.push(entry.data.y);
+                tokens.push(entry.data.eX);
+                tokens.push(entry.data.eY);
+                tokens.push(entry.data.button);
+                tokens.push(entry.data.reaction);
+                tokens.push(entry.data.context);
+                tokens.push(scrub.text(entry.data.text, "click", cTarget.privacy));
+                tokens.push(scrub.url(entry.data.link));
+                tokens.push(cHash);
+                tokens.push(entry.data.trust);
+                tokens.push(entry.data.isFullText);
+                tokens.push(entry.data.tag);
+                tokens.push(entry.data.class);
+                tokens.push(entry.data.id);
+                queue(tokens);
+                timeline.track(entry.time, entry.event, cHash, entry.data.x, entry.data.y, entry.data.reaction, entry.data.context);
+            }
+            click.reset();
+            break;
+        case Event.Clipboard:
+            for (let entry of clipboard.state) {
+                tokens = [entry.time, entry.event];
+                let target = metadata(entry.data.target as Node, entry.event);
+                if (target.id > 0) {
+                    tokens.push(target.id);
+                    tokens.push(entry.data.action);
+                    queue(tokens);
+                }
+            }
+            clipboard.reset();
+            break;
+        case Event.Resize:
+            let r = resize.data;
+            tokens.push(r.width);
+            tokens.push(r.height);
+            baseline.track(type, r.width, r.height);
+            resize.reset();
+            queue(tokens);
+            break;
+        case Event.Unload:
+            let u = unload.data;
+            tokens.push(u.name);
+            tokens.push(u.persisted);
+            unload.reset();
+            queue(tokens);
+            break;
+        case Event.Input:
+            for (let entry of input.state) {
+                let iTarget = metadata(entry.data.target as Node, entry.event, entry.data.value);
+                tokens = [entry.time, entry.event];
+                tokens.push(iTarget.id);
+                tokens.push(scrub.text(entry.data.value, "input", iTarget.privacy, false, entry.data.type));
+                queue(tokens);
+            }
+            input.reset();
+            break;
+        case Event.Selection:
+            let s = selection.data;
+            if (s) {
+                let startTarget = metadata(s.start as Node, type);
+                let endTarget = metadata(s.end as Node, type);
+                tokens.push(startTarget.id);
+                tokens.push(s.startOffset);
+                tokens.push(endTarget.id);
+                tokens.push(s.endOffset);
+                selection.reset();
+                queue(tokens);
+            }
+            break;
+        case Event.Scroll:
+            for (let entry of scroll.state) {
+                let sTarget = metadata(entry.data.target as Node, entry.event);
+                const top = metadata(entry.data.top as Node, entry.event);
+                const bottom = metadata(entry.data.bottom as Node, entry.event);
+                const sTopHash = top?.hash ? top.hash.join(Constant.Dot) : Constant.Empty;
+                const sBottomHash = bottom?.hash ? bottom.hash.join(Constant.Dot) : Constant.Empty;
+                if (sTarget.id > 0) {
+                    tokens = [entry.time, entry.event];
+                    tokens.push(sTarget.id);
+                    tokens.push(entry.data.x);
+                    tokens.push(entry.data.y);
+                    tokens.push(sTopHash);
+                    tokens.push(sBottomHash);
+                    queue(tokens);
+                    baseline.track(entry.event, entry.data.x, entry.data.y, entry.time);
+                }
+            }
+            scroll.reset();
+            break;
+        case Event.Change:
+            for (let entry of change.state) {
+                tokens = [entry.time, entry.event];
+                let target = metadata(entry.data.target as Node, entry.event);
+                if (target.id > 0) {
+                    tokens = [entry.time, entry.event];
+                    tokens.push(target.id);
+                    tokens.push(entry.data.type);
+                    tokens.push(scrub.text(entry.data.value, "change", target.privacy));
+                    tokens.push(scrub.text(entry.data.checksum, "checksum", target.privacy));
+                    queue(tokens);
+                }
+            }
+            change.reset();
+            break;
+        case Event.Submit:
+            for (let entry of submit.state) {
+                tokens = [entry.time, entry.event];
+                let target = metadata(entry.data.target as Node, entry.event);
+                if (target.id > 0) {
+                    tokens.push(target.id);
+                    queue(tokens);
+                }
+            }
+            submit.reset();
+            break;
+        case Event.Timeline:
+            for (let entry of timeline.updates) {
+                tokens = [entry.time, entry.event];
+                tokens.push(entry.data.type);
+                tokens.push(entry.data.hash);
+                tokens.push(entry.data.x);
+                tokens.push(entry.data.y);
+                tokens.push(entry.data.reaction);
+                tokens.push(entry.data.context);
+                queue(tokens, false);
+            }
+            timeline.reset();
+            break;
+        case Event.Visibility:
+            let v = visibility.data;
+            tokens.push(v.visible);
+            queue(tokens);
+            baseline.visibility(t, v.visible);
+            visibility.reset();
+            break;
+    }
+}

package/src/interaction/index.ts

@@ -1,59 +1,59 @@
-import { FunctionNames } from "@clarity-types/performance";
-import * as change from "@src/interaction/change";
-import * as click from "@src/interaction/click";
-import * as clipboard from "@src/interaction/clipboard";
-import * as input from "@src/interaction/input";
-import * as pointer from "@src/interaction/pointer";
-import * as resize from "@src/interaction/resize";
-import * as scroll from "@src/interaction/scroll";
-import * as selection from "@src/interaction/selection";
-import * as submit from "@src/interaction/submit";
-import * as timeline from "@src/interaction/timeline";
-import * as unload from "@src/interaction/unload";
-import * as visibility from "@src/interaction/visibility";
-
-export function start(): void {
-    start.dn = FunctionNames.InteractionStart;
-    timeline.start();
-    click.start();
-    clipboard.start();
-    pointer.start();
-    input.start();
-    resize.start();
-    visibility.start();
-    scroll.start();
-    selection.start();
-    change.start();
-    submit.start();
-    unload.start();
-}
-
-export function stop(): void {
-    timeline.stop();
-    click.stop();
-    clipboard.stop();
-    pointer.stop();
-    input.stop();
-    resize.stop();
-    visibility.stop();
-    scroll.stop();
-    selection.stop();
-    change.stop();
-    submit.stop();
-    unload.stop()
-}
-
-export function observe(root: Node): void {
-    scroll.observe(root);
-    // Only monitor following interactions if the root node is a document
-    // In case of shadow DOM, following events automatically bubble up to the parent document.
-    if (root.nodeType === Node.DOCUMENT_NODE) {
-        click.observe(root);
-        clipboard.observe(root);
-        pointer.observe(root);
-        input.observe(root);
-        selection.observe(root);
-        change.observe(root);
-        submit.observe(root);
-    }
-}
+import { FunctionNames } from "@clarity-types/performance";
+import * as change from "@src/interaction/change";
+import * as click from "@src/interaction/click";
+import * as clipboard from "@src/interaction/clipboard";
+import * as input from "@src/interaction/input";
+import * as pointer from "@src/interaction/pointer";
+import * as resize from "@src/interaction/resize";
+import * as scroll from "@src/interaction/scroll";
+import * as selection from "@src/interaction/selection";
+import * as submit from "@src/interaction/submit";
+import * as timeline from "@src/interaction/timeline";
+import * as unload from "@src/interaction/unload";
+import * as visibility from "@src/interaction/visibility";
+
+export function start(): void {
+    start.dn = FunctionNames.InteractionStart;
+    timeline.start();
+    click.start();
+    clipboard.start();
+    pointer.start();
+    input.start();
+    resize.start();
+    visibility.start();
+    scroll.start();
+    selection.start();
+    change.start();
+    submit.start();
+    unload.start();
+}
+
+export function stop(): void {
+    timeline.stop();
+    click.stop();
+    clipboard.stop();
+    pointer.stop();
+    input.stop();
+    resize.stop();
+    visibility.stop();
+    scroll.stop();
+    selection.stop();
+    change.stop();
+    submit.stop();
+    unload.stop()
+}
+
+export function observe(root: Node): void {
+    scroll.observe(root);
+    // Only monitor following interactions if the root node is a document
+    // In case of shadow DOM, following events automatically bubble up to the parent document.
+    if (root.nodeType === Node.DOCUMENT_NODE) {
+        click.observe(root);
+        clipboard.observe(root);
+        pointer.observe(root);
+        input.observe(root);
+        selection.observe(root);
+        change.observe(root);
+        submit.observe(root);
+    }
+}

package/src/interaction/input.ts

@@ -1,60 +1,60 @@
-import { Event } from "@clarity-types/data";
-import { InputData, InputState, Setting } from "@clarity-types/interaction";
-import { FunctionNames } from "@clarity-types/performance";
-import { bind } from "@src/core/event";
-import { schedule } from "@src/core/task";
-import { time } from "@src/core/time";
-import { clearTimeout, setTimeout } from "@src/core/timeout";
-import { get } from "@src/layout/dom";
-import encode from "./encode";
-import { target } from "@src/layout/target";
-
-let timeout: number = null;
-export let state: InputState[] = [];
-
-export function start(): void {
-    reset();
-}
-
-export function observe(root: Node): void {
-    bind(root, "input", recompute, true);
-}
-
-function recompute(evt: UIEvent): void {
-    recompute.dn = FunctionNames.InputRecompute;
-    let input = target(evt) as HTMLInputElement;
-    let value = get(input);
-    if (input && input.type && value) {
-        let v = input.value;
-        let t = input.type;
-        switch (input.type) {
-            case "radio":
-            case "checkbox":
-                v = input.checked ? "true" : "false";
-                break;
-        }
-
-        let data: InputData = { target: input, value: v, type: t };
-
-        // If last entry in the queue is for the same target node as the current one, remove it so we can later swap it with current data.
-        if (state.length > 0 && (state[state.length - 1].data.target === data.target)) { state.pop(); }
-
-        state.push({ time: time(evt), event: Event.Input, data });
-
-        clearTimeout(timeout);
-        timeout = setTimeout(process, Setting.InputLookAhead, Event.Input);
-    }
-}
-
-function process(event: Event): void {
-    schedule(encode.bind(this, event));
-}
-
-export function reset(): void {
-    state = [];
-}
-
-export function stop(): void {
-    clearTimeout(timeout);
-    reset();
+import { Event } from "@clarity-types/data";
+import { InputData, InputState, Setting } from "@clarity-types/interaction";
+import { FunctionNames } from "@clarity-types/performance";
+import { bind } from "@src/core/event";
+import { schedule } from "@src/core/task";
+import { time } from "@src/core/time";
+import { clearTimeout, setTimeout } from "@src/core/timeout";
+import { get } from "@src/layout/dom";
+import encode from "./encode";
+import { target } from "@src/layout/target";
+
+let timeout: number = null;
+export let state: InputState[] = [];
+
+export function start(): void {
+    reset();
+}
+
+export function observe(root: Node): void {
+    bind(root, "input", recompute, true);
+}
+
+function recompute(evt: UIEvent): void {
+    recompute.dn = FunctionNames.InputRecompute;
+    let input = target(evt) as HTMLInputElement;
+    let value = get(input);
+    if (input && input.type && value) {
+        let v = input.value;
+        let t = input.type;
+        switch (input.type) {
+            case "radio":
+            case "checkbox":
+                v = input.checked ? "true" : "false";
+                break;
+        }
+
+        let data: InputData = { target: input, value: v, type: t };
+
+        // If last entry in the queue is for the same target node as the current one, remove it so we can later swap it with current data.
+        if (state.length > 0 && (state[state.length - 1].data.target === data.target)) { state.pop(); }
+
+        state.push({ time: time(evt), event: Event.Input, data });
+
+        clearTimeout(timeout);
+        timeout = setTimeout(process, Setting.InputLookAhead, Event.Input);
+    }
+}
+
+function process(event: Event): void {
+    schedule(encode.bind(this, event));
+}
+
+export function reset(): void {
+    state = [];
+}
+
+export function stop(): void {
+    clearTimeout(timeout);
+    reset();
 }