From 566b33847cff9217ed6e4e11bed2e1b92798bc95 Mon Sep 17 00:00:00 2001
From: Naafiyan Ahmed <naafiyan@gmail.com>
Date: Tue, 21 Jun 2022 18:16:46 -0400
Subject: trying to get basic data viz view to work

---
 src/client/views/nodes/DataViz.tsx | 14 ++++++++++++++
 1 file changed, 14 insertions(+)
 create mode 100644 src/client/views/nodes/DataViz.tsx

(limited to 'src/client/views/nodes/DataViz.tsx')

diff --git a/src/client/views/nodes/DataViz.tsx b/src/client/views/nodes/DataViz.tsx
new file mode 100644
index 000000000..60b27c19c
--- /dev/null
+++ b/src/client/views/nodes/DataViz.tsx
@@ -0,0 +1,14 @@
+import React from "react";
+import "./DataViz.scss";
+import { FieldView, FieldViewProps } from "./FieldView";
+import { ViewBoxBaseComponent } from '../DocComponent';
+
+export class DataViz extends ViewBoxBaseComponent<FieldViewProps>() {
+    public static LayoutString(fieldKey: string) {
+        return FieldView.LayoutString(DataViz, fieldKey);
+    }
+
+    render() {
+        return (<div>Hi</div>)
+    }
+}
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From fa890475baceb8468e3c6e8c6e49d1b1fc1b962a Mon Sep 17 00:00:00 2001
From: Naafiyan Ahmed <naafiyan@gmail.com>
Date: Tue, 21 Jun 2022 19:30:17 -0400
Subject: running into jsx parsing error

---
 src/client/documents/Documents.ts   |  2 +-
 src/client/util/CurrentUserUtils.ts |  3 ++-
 src/client/views/nodes/DataViz.tsx  | 14 +++++++++++++-
 3 files changed, 16 insertions(+), 3 deletions(-)

(limited to 'src/client/views/nodes/DataViz.tsx')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index c5ec9eaf6..42191bd7e 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -62,7 +62,7 @@ import { DocumentType } from "./DocumentTypes";
 import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { MapBox } from "../views/nodes/MapBox/MapBox";
 import { RecordingBox } from "../views/nodes/RecordingBox/RecordingBox";
-import DataViz from "../views/nodes/DataViz";
+import { DataViz } from "../views/nodes/DataViz";
 
 const defaultNativeImageDim = Number(DFLT_IMAGE_NATIVE_DIM.replace("px", ""));
 class EmptyBox {
diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts
index a96f5cb18..8ccb0d197 100644
--- a/src/client/util/CurrentUserUtils.ts
+++ b/src/client/util/CurrentUserUtils.ts
@@ -310,7 +310,8 @@ export class CurrentUserUtils {
             { toolTip: "Tap to create a mobile view in a new pane, drag for a mobile view", title: "Phone", icon: "mobile", click: 'openOnRight(Doc.UserDoc().activeMobileMenu)', drag: 'this.dragFactory', dragFactory: doc.activeMobileMenu as Doc },
             { toolTip: "Tap to create a custom header note document, drag for a custom header note", title: "Custom", icon: "window-maximize", click: 'openOnRight(delegateDragFactory(this.dragFactory))', drag: 'delegateDragFactory(this.dragFactory)', dragFactory: doc.emptyHeader as Doc },
             { toolTip: "Toggle a Calculator REPL", title: "repl", icon: "calculator", click: 'addOverlayWindow("ScriptingRepl", { x: 300, y: 100, width: 200, height: 200, title: "Scripting REPL" })' },
-            { toolTip: "Tap to create a map in the new pane, drag for a map", title: "Map", icon: "map-marker-alt", click: 'openOnRight(copyDragFactory(this.dragFactory))', drag: 'copyDragFactory(this.dragFactory)', dragFactory: doc.emptyMap as Doc, noviceMode: true }
+            { toolTip: "Tap to create a map in the new pane, drag for a map", title: "Map", icon: "map-marker-alt", click: 'openOnRight(copyDragFactory(this.dragFactory))', drag: 'copyDragFactory(this.dragFactory)', dragFactory: doc.emptyMap as Doc, noviceMode: true },
+            { toolTip: "Tap to create a data visualization in a new pane", title: "Data Viz", icon: "microphone", click: 'openOnRight(copyDragFactory(this.dragFactory))', drag: 'copyDragFactory(this.dragFactory)', dragFactory: doc.emptyDataViz as Doc}
         ];
 
     }
diff --git a/src/client/views/nodes/DataViz.tsx b/src/client/views/nodes/DataViz.tsx
index 60b27c19c..57c5c0259 100644
--- a/src/client/views/nodes/DataViz.tsx
+++ b/src/client/views/nodes/DataViz.tsx
@@ -4,11 +4,23 @@ import { FieldView, FieldViewProps } from "./FieldView";
 import { ViewBoxBaseComponent } from '../DocComponent';
 
 export class DataViz extends ViewBoxBaseComponent<FieldViewProps>() {
+
+    constructor(props: any) {
+        super(props);
+    }
+
+
     public static LayoutString(fieldKey: string) {
         return FieldView.LayoutString(DataViz, fieldKey);
     }
 
     render() {
-        return (<div>Hi</div>)
+        return (
+        <div className="dataViz">
+            <div>
+                Hi
+            </div>
+        </div>
+        );
     }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2


From e691d8e72ba632f0ef2d4122fe7233f9a48d4439 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 21 Jun 2022 21:36:40 -0400
Subject: fixed issues with register DataViz jsx.

---
 src/client/documents/Documents.ts               | 17 ++++++++---------
 src/client/views/nodes/DataViz.tsx              |  6 +++---
 src/client/views/nodes/DocumentContentsView.tsx | 13 ++++++-------
 3 files changed, 17 insertions(+), 19 deletions(-)

(limited to 'src/client/views/nodes/DataViz.tsx')

diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts
index 42191bd7e..29536b642 100644
--- a/src/client/documents/Documents.ts
+++ b/src/client/documents/Documents.ts
@@ -1,7 +1,8 @@
+import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { action, runInAction } from "mobx";
 import { basename } from "path";
 import { DateField } from "../../fields/DateField";
-import { Doc, DocListCast, DocListCastAsync, Field, HeightSym, Initializing, Opt, updateCachedAcls, WidthSym } from "../../fields/Doc";
+import { Doc, DocListCast, DocListCastAsync, Field, Initializing, Opt, updateCachedAcls } from "../../fields/Doc";
 import { Id } from "../../fields/FieldSymbols";
 import { HtmlField } from "../../fields/HtmlField";
 import { InkField, PointData } from "../../fields/InkField";
@@ -14,7 +15,7 @@ import { Cast, NumCast, StrCast } from "../../fields/Types";
 import { AudioField, ImageField, MapField, PdfField, RecordingField, VideoField, WebField, YoutubeField } from "../../fields/URLField";
 import { SharingPermissions } from "../../fields/util";
 import { Upload } from "../../server/SharedMediaTypes";
-import { OmitKeys, Utils, aggregateBounds } from "../../Utils";
+import { aggregateBounds, OmitKeys, Utils } from "../../Utils";
 import { YoutubeBox } from "../apis/youtube/YoutubeBox";
 import { DocServer } from "../DocServer";
 import { Networking } from "../Network";
@@ -33,13 +34,14 @@ import { ContextMenuProps } from "../views/ContextMenuItem";
 import { DFLT_IMAGE_NATIVE_DIM } from "../views/global/globalCssVariables.scss";
 import { ActiveArrowEnd, ActiveArrowStart, ActiveDash, ActiveFillColor, ActiveInkBezierApprox, ActiveInkColor, ActiveInkWidth, InkingStroke } from "../views/InkingStroke";
 import { AudioBox } from "../views/nodes/AudioBox";
+import { FontIconBox } from "../views/nodes/button/FontIconBox";
 import { ColorBox } from "../views/nodes/ColorBox";
 import { ComparisonBox } from "../views/nodes/ComparisonBox";
+import { DataVizBox } from "../views/nodes/DataViz";
 import { DocFocusOptions } from "../views/nodes/DocumentView";
 import { EquationBox } from "../views/nodes/EquationBox";
 import { FieldViewProps } from "../views/nodes/FieldView";
 import { FilterBox } from "../views/nodes/FilterBox";
-import { FontIconBox } from "../views/nodes/button/FontIconBox";
 import { FormattedTextBox } from "../views/nodes/formattedText/FormattedTextBox";
 import { FunctionPlotBox } from "../views/nodes/FunctionPlotBox";
 import { ImageBox } from "../views/nodes/ImageBox";
@@ -47,7 +49,9 @@ import { KeyValueBox } from "../views/nodes/KeyValueBox";
 import { LabelBox } from "../views/nodes/LabelBox";
 import { LinkBox } from "../views/nodes/LinkBox";
 import { LinkDescriptionPopup } from "../views/nodes/LinkDescriptionPopup";
+import { MapBox } from "../views/nodes/MapBox/MapBox";
 import { PDFBox } from "../views/nodes/PDFBox";
+import { RecordingBox } from "../views/nodes/RecordingBox/RecordingBox";
 import { ScreenshotBox } from "../views/nodes/ScreenshotBox";
 import { ScriptingBox } from "../views/nodes/ScriptingBox";
 import { SliderBox } from "../views/nodes/SliderBox";
@@ -57,12 +61,7 @@ import { PresElementBox } from "../views/nodes/trails/PresElementBox";
 import { VideoBox } from "../views/nodes/VideoBox";
 import { WebBox } from "../views/nodes/WebBox";
 import { SearchBox } from "../views/search/SearchBox";
-import { DashWebRTCVideo } from "../views/webcam/DashWebRTCVideo";
 import { DocumentType } from "./DocumentTypes";
-import { IconProp } from "@fortawesome/fontawesome-svg-core";
-import { MapBox } from "../views/nodes/MapBox/MapBox";
-import { RecordingBox } from "../views/nodes/RecordingBox/RecordingBox";
-import { DataViz } from "../views/nodes/DataViz";
 
 const defaultNativeImageDim = Number(DFLT_IMAGE_NATIVE_DIM.replace("px", ""));
 class EmptyBox {
@@ -519,7 +518,7 @@ export namespace Docs {
                 options: { links: "@links(self)" }
             }],
             [DocumentType.DATAVIZ, {
-                layout: { view: DataViz, dataField: defaultDataKey },
+                layout: { view: DataVizBox, dataField: defaultDataKey },
                 options: { _fitWidth: true, _fitHeight: true, links: "@links(self)" }
             }]
         ]);
diff --git a/src/client/views/nodes/DataViz.tsx b/src/client/views/nodes/DataViz.tsx
index 57c5c0259..a3ffade70 100644
--- a/src/client/views/nodes/DataViz.tsx
+++ b/src/client/views/nodes/DataViz.tsx
@@ -1,9 +1,9 @@
 import React from "react";
+import { ViewBoxBaseComponent } from '../DocComponent';
 import "./DataViz.scss";
 import { FieldView, FieldViewProps } from "./FieldView";
-import { ViewBoxBaseComponent } from '../DocComponent';
 
-export class DataViz extends ViewBoxBaseComponent<FieldViewProps>() {
+export class DataVizBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
     constructor(props: any) {
         super(props);
@@ -11,7 +11,7 @@ export class DataViz extends ViewBoxBaseComponent<FieldViewProps>() {
 
 
     public static LayoutString(fieldKey: string) {
-        return FieldView.LayoutString(DataViz, fieldKey);
+        return FieldView.LayoutString(DataVizBox, fieldKey);
     }
 
     render() {
diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx
index 8715fc33a..60eef7cfd 100644
--- a/src/client/views/nodes/DocumentContentsView.tsx
+++ b/src/client/views/nodes/DocumentContentsView.tsx
@@ -16,14 +16,15 @@ import { SearchBox } from "../search/SearchBox";
 import { DashWebRTCVideo } from "../webcam/DashWebRTCVideo";
 import { YoutubeBox } from "./../../apis/youtube/YoutubeBox";
 import { AudioBox } from "./AudioBox";
+import { FontIconBox } from "./button/FontIconBox";
 import { ColorBox } from "./ColorBox";
 import { ComparisonBox } from "./ComparisonBox";
+import { DataVizBox } from "./DataViz";
 import { DocumentViewProps } from "./DocumentView";
 import "./DocumentView.scss";
 import { EquationBox } from "./EquationBox";
 import { FieldView, FieldViewProps } from "./FieldView";
 import { FilterBox } from "./FilterBox";
-import { FontIconBox } from "./button/FontIconBox";
 import { FormattedTextBox, FormattedTextBoxProps } from "./formattedText/FormattedTextBox";
 import { FunctionPlotBox } from "./FunctionPlotBox";
 import { ImageBox } from "./ImageBox";
@@ -31,18 +32,17 @@ import { KeyValueBox } from "./KeyValueBox";
 import { LabelBox } from "./LabelBox";
 import { LinkAnchorBox } from "./LinkAnchorBox";
 import { LinkBox } from "./LinkBox";
+import { MapBox } from "./MapBox/MapBox";
 import { PDFBox } from "./PDFBox";
-import { PresBox } from "./trails/PresBox";
+import { RecordingBox } from "./RecordingBox";
 import { ScreenshotBox } from "./ScreenshotBox";
 import { ScriptingBox } from "./ScriptingBox";
 import { SliderBox } from "./SliderBox";
+import { PresBox } from "./trails/PresBox";
 import { VideoBox } from "./VideoBox";
 import { WebBox } from "./WebBox";
 import React = require("react");
 import XRegExp = require("xregexp");
-import { MapBox } from "./MapBox/MapBox";
-import { RecordingBox } from "./RecordingBox";
-import { DataViz } from "./DataViz";
 
 const JsxParser = require('react-jsx-parser').default; //TODO Why does this need to be imported like this?
 
@@ -229,8 +229,7 @@ export class DocumentContentsView extends React.Component<DocumentViewProps & Fo
                     CollectionFreeFormView, CollectionDockingView, CollectionSchemaView, CollectionView, WebBox, KeyValueBox,
                     PDFBox, VideoBox, AudioBox, RecordingBox, PresBox, YoutubeBox, PresElementBox, SearchBox, FilterBox, FunctionPlotBox,
                     ColorBox, DashWebRTCVideo, LinkAnchorBox, InkingStroke, LinkBox, ScriptingBox, MapBox,
-                    ScreenshotBox,
-                    HTMLtag, ComparisonBox, DataViz
+                    ScreenshotBox, DataVizBox, HTMLtag, ComparisonBox
                 }}
                 bindings={bindings}
                 jsx={layoutFrame}
-- 
cgit v1.2.3-70-g09d2


From 8a2d35bd9bf9d9871c1aa12332d11a99706b4a73 Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Tue, 21 Jun 2022 21:51:28 -0400
Subject: fixed rendering error with DataViz

---
 src/client/views/nodes/DataViz.tsx | 21 ++++++++-------------
 1 file changed, 8 insertions(+), 13 deletions(-)

(limited to 'src/client/views/nodes/DataViz.tsx')

diff --git a/src/client/views/nodes/DataViz.tsx b/src/client/views/nodes/DataViz.tsx
index a3ffade70..d9541dba0 100644
--- a/src/client/views/nodes/DataViz.tsx
+++ b/src/client/views/nodes/DataViz.tsx
@@ -1,26 +1,21 @@
-import React from "react";
+import { observer } from "mobx-react";
+import * as React from "react";
 import { ViewBoxBaseComponent } from '../DocComponent';
 import "./DataViz.scss";
 import { FieldView, FieldViewProps } from "./FieldView";
 
+@observer
 export class DataVizBox extends ViewBoxBaseComponent<FieldViewProps>() {
 
-    constructor(props: any) {
-        super(props);
-    }
-
-
-    public static LayoutString(fieldKey: string) {
-        return FieldView.LayoutString(DataVizBox, fieldKey);
-    }
+    public static LayoutString(fieldKey: string) {  return FieldView.LayoutString(DataVizBox, fieldKey);  }
 
     render() {
         return (
-        <div className="dataViz">
-            <div>
-                Hi
+            <div >
+                <div>
+                    Hi
+                </div>
             </div>
-        </div>
         );
     }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2

