display: Merge click maps of the same urls in the session

1 files changed, 38 insertions, 15 deletions

diff --git a/src/clicks_display.ts b/src/clicks_display.ts
index faf9ce0..9dd958c 100644
--- a/src/clicks_display.ts
+++ b/src/clicks_display.ts
@@ -79,32 +79,55 @@ class Display {
             this.data = []
             const scaleX = data.width
             const scaleY = data.width
-            let url: string | undefined
-            let clicks: h337.DataPoint[] = []
-            const map = new Map<string, number>()
+            type TempPage = {
+                url: string
+                added: boolean
+                map: Map<string, number>
+                clicks: h337.DataPoint[]
+            }
+            let current: TempPage | undefined
+            const pages: TempPage[] = []
             for (const event of data.events) {
                 if ("url" in event) {
-                    if (url !== undefined) {
-                        this.data.push(new PageData(url, data.width, clicks))
+                    if (current !== undefined && !current.added) {
+                        current.added = true
+                        pages.push(current)
+                    }
+                    current = undefined
+                    for (const page of pages) {
+                        if (page.url === event.url) {
+                            current = page
+                            break
+                        }
+                    }
+                    if (current === undefined) {
+                        current = {
+                            url: event.url,
+                            added: false,
+                            map: new Map<string, number>(),
+                            clicks: [],
+                        }
                     }
-                    url = event.url
-                    clicks = []
-                    map.clear()
-                } else {
+                } else if (current !== undefined) {
                     const x = Math.round(event.x * scaleX)
                     const y = Math.round(event.y * scaleY)
                     const pos = `${x}x${y}`
-                    const index = map.get(pos)
+                    const index = current.map.get(pos)
                     if (index === undefined) {
-                        map.set(pos, clicks.length)
-                        clicks.push({ x: x, y: y, value: 1 })
+                        current.map.set(pos, current.clicks.length)
+                        current.clicks.push({ x: x, y: y, value: 1 })
                     } else {
-                        clicks[index].value++
+                        current.clicks[index].value++
                     }
                 }
             }
-            if (url !== undefined) {
-                this.data.push(new PageData(url, data.width, clicks))
+            if (current !== undefined && !current.added) {
+                current.added = true
+                pages.push(current)
+            }
+
+            for (const page of pages) {
+                this.data.push(new PageData(page.url, data.width, page.clicks))
             }
 
             while (this.url.options.length > 0) this.url.options.remove(0)