Different color for the stroke of the collaborator's arrow (#963)

* Different color for the stroke of the arrow

* Sort
This commit is contained in:
Lipis 2020-03-15 20:05:12 +02:00 committed by GitHub
parent e44801123a
commit 79ea76b48b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -17,10 +17,13 @@ import { getSelectedElements } from "../scene/selection";
import { renderElement, renderElementToSvg } from "./renderElement"; import { renderElement, renderElementToSvg } from "./renderElement";
import colors from "../colors"; import colors from "../colors";
function colorForClientId(clientId: string) { function colorsForClientId(clientId: string) {
// Naive way of getting an integer out of the clientId // Naive way of getting an integer out of the clientId
const sum = clientId.split("").reduce((a, str) => a + str.charCodeAt(0), 0); 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( export function renderScene(
@ -178,13 +181,13 @@ export function renderScene(
y = Math.max(y, 0); y = Math.max(y, 0);
y = Math.min(y, normalizedCanvasHeight - height); y = Math.min(y, normalizedCanvasHeight - height);
const color = colorForClientId(clientId); const { background, stroke } = colorsForClientId(clientId);
const strokeStyle = context.strokeStyle; const strokeStyle = context.strokeStyle;
const fillStyle = context.fillStyle; const fillStyle = context.fillStyle;
const globalAlpha = context.globalAlpha; const globalAlpha = context.globalAlpha;
context.strokeStyle = color; context.strokeStyle = stroke;
context.fillStyle = color; context.fillStyle = background;
if (isOutOfBounds) { if (isOutOfBounds) {
context.globalAlpha = 0.2; context.globalAlpha = 0.2;
} }