highlighting rows based on layoutpreview hover

1 files changed, 18 insertions, 2 deletions

diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.tsx b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
index e03da8e7b..765642891 100644
--- a/src/client/views/nodes/DataVizBox/DataVizBox.tsx
+++ b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
@@ -38,6 +38,7 @@ import { CollectionFreeFormView } from '../../collections/collectionFreeForm';
 import { PrefetchProxy } from '../../../../fields/Proxy';
 import { AclAdmin, AclAugment, AclEdit } from '../../../../fields/DocSymbols';
 import { template } from 'lodash';
+import { data } from 'jquery';
 
 export enum DataVizView {
     TABLE = 'table',
@@ -57,6 +58,7 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     crop: ((region: Doc | undefined, addCrop?: boolean) => Doc | undefined) | undefined;
     @observable _marqueeing: number[] | undefined = undefined;
     @observable _savedAnnotations = new ObservableMap<number, HTMLDivElement[]>();
+    @observable _specialHighlightedRow: number | undefined = undefined;
 
     constructor(props: FieldViewProps) {
         super(props);
@@ -131,6 +133,10 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         this.layoutDoc._dataViz_titleCol = titleCol;
     };
 
+    @action setSpecialHighlightedRow = (row: number | undefined) => {
+        this._specialHighlightedRow = row;
+    }
+
     @action // pinned / linked anchor doc includes selected rows, graph titles, and graph colors
     restoreView = (data: Doc) => {
         // const changedView = data.config_dataViz && this.dataVizView !== data.config_dataViz && (this.layoutDoc._dataViz = data.config_dataViz);
@@ -366,7 +372,7 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         };
         if (!this.records.length) return 'no data/visualization';
         switch (this.dataVizView) {
-            case DataVizView.TABLE:     return <TableBox  {...sharedProps} docView={this.DocumentView} selectAxes={this.selectAxes} selectTitleCol={this.selectTitleCol}/>;
+            case DataVizView.TABLE:     return <TableBox  {...sharedProps} specHighlightedRow={this._specialHighlightedRow} docView={this.DocumentView} selectAxes={this.selectAxes} selectTitleCol={this.selectTitleCol}/>;
             case DataVizView.LINECHART: return <LineChart {...sharedProps} dataDoc={this.dataDoc} fieldKey={this.fieldKey} ref={r => {this._vizRenderer = r ?? undefined;}} vizBox={this} />;
             case DataVizView.HISTOGRAM: return <Histogram {...sharedProps} dataDoc={this.dataDoc} fieldKey={this.fieldKey} ref={r => {this._vizRenderer = r ?? undefined;}} />;
             case DataVizView.PIECHART:  return <PieChart  {...sharedProps} dataDoc={this.dataDoc} fieldKey={this.fieldKey} ref={r => {this._vizRenderer = r ?? undefined;}} 
@@ -515,7 +521,6 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             while (i < columns && docsChanged < docs.length){ 
                 docs[docsChanged].x = curX;
                 docs[docsChanged].y = curY;
-                console.log('x: ' + docs[i].x + ' y: ' + docs[i].y);
                 curX += templWidth + xGap;
                 ++docsChanged;
                 ++i;
@@ -527,6 +532,16 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
         }
     }
 
+    // applyImagesTo = (doc: Doc, cols: string[]) => {
+    //     const childDocs = DocListCast(doc[Doc.LayoutFieldKey(doc)]);
+    //     const imageFields = childDocs.filter(doc => doc.type === 'image');
+    //     const imageToKey: Map<Doc, string> = new Map();
+    //     imageFields.forEach(img => cols.forEach(col => {if (img[col]) imageToKey.set(img, col)}));
+
+    //     imageFields.forEach(doc => doc['data'] = String(doc[String(imageToKey.get(doc))]).replace(/"/g, ''));
+
+    // }
+
     @action
     createDocsFromTemplate = (templateInfo: DataVizTemplateInfo) => {
         if (!templateInfo.doc) return;
@@ -545,6 +560,7 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
             const targetKey = StrCast(templateInfo.doc!.layout_fieldKey, 'layout');
             const applied = this.ApplyTemplateTo(templateInfo.doc!, target, targetKey, templateInfo.doc!.title + `${row}`);
             target.layout_fieldKey = targetKey;
+            //this.applyImagesTo(target, fields);
             return applied;
         });