From 79ea76b48b87cf5cbf6ca0e29fd8eeeb20aed3b2 Mon Sep 17 00:00:00 2001
From: Lipis <lipiridis@gmail.com>
Date: Sun, 15 Mar 2020 20:05:12 +0200
Subject: [PATCH] Different color for the stroke of the collaborator's arrow
 (#963)

* Different color for the stroke of the arrow

* Sort
---
 src/renderer/renderScene.ts | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/renderer/renderScene.ts b/src/renderer/renderScene.ts
index efdf6090..19ebe79a 100644
--- a/src/renderer/renderScene.ts
+++ b/src/renderer/renderScene.ts
@@ -17,10 +17,13 @@ import { getSelectedElements } from "../scene/selection";
 import { renderElement, renderElementToSvg } from "./renderElement";
 import colors from "../colors";
 
-function colorForClientId(clientId: string) {
+function colorsForClientId(clientId: string) {
   // Naive way of getting an integer out of the clientId
   const sum = clientId.split("").reduce((a, str) => a + str.charCodeAt(0), 0);
-  return colors.elementBackground[sum % colors.elementBackground.length];
+  return {
+    background: colors.elementBackground[sum % colors.elementBackground.length],
+    stroke: colors.elementStroke[sum % colors.elementBackground.length],
+  };
 }
 
 export function renderScene(
@@ -178,13 +181,13 @@ export function renderScene(
     y = Math.max(y, 0);
     y = Math.min(y, normalizedCanvasHeight - height);
 
-    const color = colorForClientId(clientId);
+    const { background, stroke } = colorsForClientId(clientId);
 
     const strokeStyle = context.strokeStyle;
     const fillStyle = context.fillStyle;
     const globalAlpha = context.globalAlpha;
-    context.strokeStyle = color;
-    context.fillStyle = color;
+    context.strokeStyle = stroke;
+    context.fillStyle = background;
     if (isOutOfBounds) {
       context.globalAlpha = 0.2;
     }