From 8d7a10be1b335a48df4e775d1c00e0f7ac3f2b75 Mon Sep 17 00:00:00 2001
From: cudr <codefaster@yandex.ru>
Date: Sun, 27 Oct 2019 15:43:12 +0300
Subject: [PATCH] feat: garbage cursors on client

---
 packages/backend/src/Connection.ts  |  2 +-
 packages/backend/src/model.ts       |  3 +-
 packages/backend/src/utils/index.ts |  2 +-
 packages/client/src/Connection.ts   | 44 ++++++++++++++++++++++++-----
 packages/example/server.js          |  5 +++-
 5 files changed, 45 insertions(+), 11 deletions(-)

diff --git a/packages/backend/src/Connection.ts b/packages/backend/src/Connection.ts
index 241e85f..3da204a 100644
--- a/packages/backend/src/Connection.ts
+++ b/packages/backend/src/Connection.ts
@@ -16,7 +16,7 @@ class Connection {
   private options: ConnectionOptions
 
   constructor(options: ConnectionOptions = defaultOptions) {
-    this.io = io(options.port, options.connectOpts)
+    this.io = io(options.entry, options.connectOpts)
     this.docSet = new Automerge.DocSet()
     this.connections = {}
     this.options = merge(defaultOptions, options)
diff --git a/packages/backend/src/model.ts b/packages/backend/src/model.ts
index 4adcf09..aefb42b 100644
--- a/packages/backend/src/model.ts
+++ b/packages/backend/src/model.ts
@@ -1,7 +1,8 @@
 import { ValueJSON } from 'slate'
+import { Server } from 'http'
 
 export interface ConnectionOptions {
-  port: number
+  entry: number | Server
   connectOpts?: SocketIO.ServerOptions
   defaultValue?: ValueJSON
   saveTreshold?: number
diff --git a/packages/backend/src/utils/index.ts b/packages/backend/src/utils/index.ts
index 5bcce0e..20fc09b 100644
--- a/packages/backend/src/utils/index.ts
+++ b/packages/backend/src/utils/index.ts
@@ -6,7 +6,7 @@ export const getClients = (io, nsp) =>
   })
 
 export const defaultOptions = {
-  port: 9000,
+  entry: 9000,
   saveTreshold: 2000,
   cursorAnnotationType: 'collaborative_selection'
 }
diff --git a/packages/client/src/Connection.ts b/packages/client/src/Connection.ts
index 708d5ab..f8edeb9 100644
--- a/packages/client/src/Connection.ts
+++ b/packages/client/src/Connection.ts
@@ -63,14 +63,14 @@ class Connection {
       return
     }
 
-    const currentDoc = this.docSet.getDoc(this.docId)
-    const docNew = this.connection.receiveMsg(data)
-
-    if (!docNew) {
-      return
-    }
-
     try {
+      const currentDoc = this.docSet.getDoc(this.docId)
+      const docNew = this.connection.receiveMsg(data)
+
+      if (!docNew) {
+        return
+      }
+
       const operations = Automerge.diff(currentDoc, docNew)
 
       if (operations.length !== 0) {
@@ -87,12 +87,42 @@ class Connection {
         await Promise.resolve()
 
         this.editor.remote = false
+
+        this.garbageCursors()
       }
     } catch (e) {
       console.error(e)
     }
   }
 
+  garbageCursors = async () => {
+    const doc = this.docSet.getDoc(this.docId)
+    const { value } = this.editor
+
+    if (value.annotations.size === Object.keys(doc.annotations).length) {
+      return
+    }
+
+    const garbage = []
+
+    value.annotations.forEach(annotation => {
+      if (
+        annotation.type === this.cursorAnnotationType &&
+        !doc.annotations[annotation.key]
+      ) {
+        garbage.push(annotation)
+      }
+    })
+
+    if (garbage.length) {
+      this.editor.withoutSaving(() => {
+        garbage.forEach(annotation => {
+          this.editor.removeAnnotation(annotation)
+        })
+      })
+    }
+  }
+
   receiveSlateOps = (operations: Immutable.List<Operation>) => {
     const doc = this.docSet.getDoc(this.docId)
     const message = `change from ${this.socket.id}`
diff --git a/packages/example/server.js b/packages/example/server.js
index 0a437ec..087bda0 100644
--- a/packages/example/server.js
+++ b/packages/example/server.js
@@ -1,8 +1,9 @@
 const Connection = require('@slate-collaborative/backend')
 const defaultValue = require('./src/defaultValue')
+const server = require('http').createServer()
 
 const config = {
-  port: 9000,
+  entry: server, // or specify port to start io server
   defaultValue,
   saveTreshold: 2000,
   onAuthRequest: async (query, socket) => {
@@ -19,3 +20,5 @@ const config = {
 }
 
 const connection = new Connection(config)
+
+server.listen(9000)