#3195: Plate Viewer: WIP

js-api/src/api/grok_api.g.ts

@@ -780,6 +780,8 @@ export interface IDartApi {
   grok_GridColumnList_SetVisible(columns: any, columnNames: any): any;
   grok_GridColumnList_Get_Length(columns: any): any;
   grok_GridColumnList_Add(columns: any, cellType: String, gridColumnName: String): any;
+  grok_GridColumnList_RemoveAt(columns: any, index: Num): any;
+  grok_GridColumnList_Clear(columns: any): any;
   grok_Grid_Create(table: any): any;
   grok_Grid_Sort(grid: any, columns: any, orders: any): any;
   grok_Grid_Get_Canvas(grid: any): any;

js-api/src/dataframe.ts

@@ -574,7 +574,7 @@ export class Row {
         return true;
       },
       get(target: any, name) {
-        if (name == 'cells' || name == 'get' || name == 'toDart' || target.hasOwnProperty(name))
+        if (name == 'cells' || name == 'get' || name == 'toDart' || name == 'toMap' || target.hasOwnProperty(name))
           return target[<any>name];
         return target.table.get(name, target.idx);
       }
@@ -583,6 +583,14 @@ export class Row {
 
   get cells(): Iterable<Cell> { return _toIterable(api.grok_Row_Get_Cells(this.table.dart, this.idx)); }
 
+  /** Returns a JS object with column names as keys and values as values. */
+  toMap(): {[index: string]: any} {
+    const res: {[index: string]: any} = {};
+    for (const column of this.table.columns)
+      res[column.name] = column.get(this.idx);
+    return res;
+  }
+
   /** Returns this row's value for the specified column
    * @param {string} columnName
    * @returns {Object} */
@@ -1237,6 +1245,14 @@ export class ColumnList {
     return _toIterable(api.grok_ColumnList_ByTags(this.dart, tags));
   }
 
+  /** Returns the first column that satisfies the specified criteria. */
+  firstWhere(predicate: (col: Column) => boolean): Column | undefined {
+    for (const col of this)
+      if (predicate(col))
+        return col;
+  }
+
+
   /** Finds categorical columns.
    * Sample: {@link https://public.datagrok.ai/js/samples/data-frame/find-columns} */
   get categorical(): Iterable<Column> {

js-api/src/grid.ts

@@ -9,6 +9,7 @@ import {SemType} from './const';
 import {Property} from './entities';
 import {IFormSettings, IGridSettings} from "./interfaces/d4";
 import {IDartApi} from "./api/grok_api.g";
+import * as DG from "./dataframe";
 
 
 const api: IDartApi = <any>window;
@@ -783,6 +784,12 @@ export class GridColumnList {
   add(options: {gridColumnName?: string, cellType: string, index?: number}): GridColumn {
     return api.grok_GridColumnList_Add(this.dart, options.cellType, options.gridColumnName);
   }
+
+  /** Removes a grid column at the specified position. */
+  removeAt(index: number) { api.grok_GridColumnList_RemoveAt(this.dart, index); }
+
+  /** Removes all columns. */
+  clear() { api.grok_GridColumnList_Clear(this.dart); }
 }
 
 /** DataFrame-bound viewer that contains {@link Form} */
@@ -1058,6 +1065,11 @@ export class Grid extends Viewer<IGridSettings> {
   autoSize(maxWidth: number, maxHeight: number, minWidth?: number, minHeight?: number, autoSizeOnDataChange?: boolean): void {
     api.grok_Grid_AutoSize(this.dart, maxWidth, maxHeight, minWidth, minHeight, autoSizeOnDataChange);
   }
+
+  /** Renders the content of this grid to the specified canvas and bounds. */
+  render(g: CanvasRenderingContext2D, bounds: Rect) {
+    api.grok_Grid_Render(this.dart, g, bounds.toDart());
+  }
 }
 
 

js-api/ui.ts

@@ -801,7 +801,7 @@ export namespace input {
 
   export interface IColumnInputInitOptions<T> extends IInputInitOptions<T> {
     table?: DataFrame;
-    filter?: Function;
+    filter?: (col: Column) => boolean;
   }
 
   export interface IColumnsInputInitOptions<T> extends IColumnInputInitOptions<T> {