diff options
| author | andrewdkim <adkim414@gmail.com> | 2019-08-14 11:55:16 -0400 |
|---|---|---|
| committer | andrewdkim <adkim414@gmail.com> | 2019-08-14 11:55:16 -0400 |
| commit | 46f4945d38ca9423f1114fb4c4b4f4a72389a89e (patch) | |
| tree | 49de0599cc94f504e4bb5e46f889cb01bbc1b641 /src/client/views/InkingCanvas.tsx | |
| parent | f43509c132b5302b9983667aaf99251051b38b59 (diff) | |
| parent | 7a71c9005189e111e9c9d197d02cc9a6a1bce389 (diff) | |
merge from master
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() { |
