diff options
| author | monikahedman <monika_hedman@brown.edu> | 2019-08-13 16:32:01 -0400 |
|---|---|---|
| committer | monikahedman <monika_hedman@brown.edu> | 2019-08-13 16:32:01 -0400 |
| commit | 3d3f55b0b9fb66a1a02a2a57edb6bcc38c2a5803 (patch) | |
| tree | 6f0b778b307a335b3797a14317471ed7da2af9ac /src/client/views/InkingCanvas.tsx | |
| parent | 180a1268d6e732bca9557da7f935ec540de4b878 (diff) | |
| parent | afec8d91ec6de13de33e2a31c987727b4cc7101d (diff) | |
Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into checkbox
Diffstat (limited to 'src/client/views/InkingCanvas.tsx')
| -rw-r--r-- | src/client/views/InkingCanvas.tsx | 20 |
1 files changed, 12 insertions, 8 deletions
diff --git a/src/client/views/InkingCanvas.tsx b/src/client/views/InkingCanvas.tsx index 1c221e3df..b08133d80 100644 --- a/src/client/views/InkingCanvas.tsx +++ b/src/client/views/InkingCanvas.tsx @@ -165,14 +165,18 @@ export class InkingCanvas extends React.Component<InkCanvasProps> { } return paths; }, [] as JSX.Element[]); - return [<svg className={`inkingCanvas-paths-ink`} key="Pens" - style={{ left: `${this.inkMidX - this.maxCanvasDim}px`, top: `${this.inkMidY - this.maxCanvasDim}px` }} > - {paths.filter(path => path.props.tool !== InkTool.Highlighter)} - </svg>, - <svg className={`inkingCanvas-paths-markers`} key="Markers" - style={{ left: `${this.inkMidX - this.maxCanvasDim}px`, top: `${this.inkMidY - this.maxCanvasDim}px` }}> - {paths.filter(path => path.props.tool === InkTool.Highlighter)} - </svg>]; + let markerPaths = paths.filter(path => path.props.tool === InkTool.Highlighter); + let penPaths = paths.filter(path => path.props.tool !== InkTool.Highlighter); + return [!penPaths.length ? (null) : + <svg className={`inkingCanvas-paths-ink`} key="Pens" + style={{ left: `${this.inkMidX - this.maxCanvasDim}px`, top: `${this.inkMidY - this.maxCanvasDim}px` }} > + {} + </svg>, + !markerPaths.length ? (null) : + <svg className={`inkingCanvas-paths-markers`} key="Markers" + style={{ left: `${this.inkMidX - this.maxCanvasDim}px`, top: `${this.inkMidY - this.maxCanvasDim}px` }}> + {} + </svg>]; } render() { |