From 83ad2ff7b64f8ab67a0652192f1fc72ce8e7c1ad Mon Sep 17 00:00:00 2001
From: Bob Zeleznik <zzzman@gmail.com>
Date: Mon, 1 Apr 2019 00:49:57 -0400
Subject: since these changes look right, re-committing them and will look at
 tomorrow.

---
 src/client/views/InkingCanvas.scss | 11 ++++++-----
 src/client/views/InkingCanvas.tsx  | 28 ++++++++++++++++++++++------
 2 files changed, 28 insertions(+), 11 deletions(-)

(limited to 'src')

diff --git a/src/client/views/InkingCanvas.scss b/src/client/views/InkingCanvas.scss
index 0e2d7f8c1..fa8b8798a 100644
--- a/src/client/views/InkingCanvas.scss
+++ b/src/client/views/InkingCanvas.scss
@@ -1,14 +1,11 @@
 @import "global_variables";
 
-.inkingCanvas-paths, .inkingCanvas-paths-none {
+.inkingCanvas-paths-ink, .inkingCanvas-paths-markers, .inkingCanvas-paths {
     position: absolute;
     top: -50000px;
     left: -50000px;
     width: 100000px;
     height: 100000px;
-    .highlight {
-        mix-blend-mode: multiply;
-    }
     .inkingCanvas-children {
       transform: translate(50000px, 50000px);
       pointer-events: none;
@@ -17,8 +14,12 @@
     pointer-events: auto;
     
 }
-.inkingCanvas-paths-none {
+.inkingCanvas-paths-ink, .inkingCanvas-paths-markers  {
     pointer-events: none;
+    z-index: 10000; // overlays ink on top of everything 
     cursor: "arrow";
 }
+.inkingCanvas-paths-markers {
+    mix-blend-mode: multiply;
+}
 
diff --git a/src/client/views/InkingCanvas.tsx b/src/client/views/InkingCanvas.tsx
index 9ae3ade47..86a7a4456 100644
--- a/src/client/views/InkingCanvas.tsx
+++ b/src/client/views/InkingCanvas.tsx
@@ -1,4 +1,4 @@
-import { action, computed } from "mobx";
+import { action, computed, trace } from "mobx";
 import { observer } from "mobx-react";
 import { Document } from "../../fields/Document";
 import { FieldWaiting } from "../../fields/Field";
@@ -137,8 +137,20 @@ export class InkingCanvas extends React.Component<InkCanvasProps> {
     render() {
         // parse data from server
         let curPage = this.props.Document.GetNumber(KeyStore.CurPage, -1)
-        let paths = Array.from(this.inkData).reduce((paths, [id, strokeData]) => {
-            if (strokeData.page == -1 || strokeData.page == curPage)
+        let markerpaths = Array.from(this.inkData).reduce((paths, [id, strokeData]) => {
+            if ((strokeData.page == -1 || strokeData.page == curPage) &&
+                strokeData.tool == InkTool.Highlighter)
+                paths.push(<InkingStroke key={id} id={id}
+                    line={strokeData.pathData}
+                    color={strokeData.color}
+                    width={strokeData.width}
+                    tool={strokeData.tool}
+                    deleteCallback={this.removeLine} />)
+            return paths;
+        }, [] as JSX.Element[]);
+        let penpaths = Array.from(this.inkData).reduce((paths, [id, strokeData]) => {
+            if ((strokeData.page == -1 || strokeData.page == curPage) &&
+                strokeData.tool == InkTool.Pen)
                 paths.push(<InkingStroke key={id} id={id}
                     line={strokeData.pathData}
                     color={strokeData.color}
@@ -147,13 +159,17 @@ export class InkingCanvas extends React.Component<InkCanvasProps> {
                     deleteCallback={this.removeLine} />)
             return paths;
         }, [] as JSX.Element[]);
-        let svgCanvasStyle = InkingControl.Instance.selectedTool == InkTool.None ? "-none" : "";
 
+        trace();
         return (
             <div className="inkingCanvas" >
+                <svg className={`inkingCanvas-paths`} onPointerDown={this.onPointerDown} />
                 {this.props.children}
-                <svg className={`inkingCanvas-paths${svgCanvasStyle}`} onPointerDown={this.onPointerDown} >
-                    {paths}
+                <svg className={`inkingCanvas-paths-markers`}  >
+                    {markerpaths}
+                </svg>
+                <svg className={`inkingCanvas-paths-ink`}  >
+                    {penpaths}
                 </svg>
             </div >
         )
-- 
cgit v1.2.3-70-g09d2