diff options
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionNoteTakingView.tsx | 21 | ||||
| -rw-r--r-- | src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx | 37 |
3 files changed, 43 insertions, 16 deletions
diff --git a/.gitignore b/.gitignore index 7a3c82ee6..7d3a4d214 100644 --- a/.gitignore +++ b/.gitignore @@ -19,3 +19,4 @@ src/server/session_manager/logs/**/*.log debug.log .vscodeignore Dockerfile +.vscode/launch.json diff --git a/src/client/views/collections/CollectionNoteTakingView.tsx b/src/client/views/collections/CollectionNoteTakingView.tsx index 5f9a4f4d0..0cdf63939 100644 --- a/src/client/views/collections/CollectionNoteTakingView.tsx +++ b/src/client/views/collections/CollectionNoteTakingView.tsx @@ -67,12 +67,14 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti @computed get yMargin() { return this.props.yPadding || NumCast(this.layoutDoc._yMargin, 5); } // 2 * this.gridGap)); } @computed get gridGap() { return NumCast(this.layoutDoc._gridGap, 10); } @computed get numGroupColumns() { return this.columnHeaders.length; } - @computed get columnWidth() {return this.props.PanelWidth() - 2 * this.xMargin;} + // @computed get columnWidth() {return this.props.PanelWidth() - 2 * this.xMargin;} //-------------------------------------------- Parker's Playground --------------------------------------------// - draggedDocBackgroundColors: string[] = [] + // draggedDocBackgroundColors: string[] = [] columnStartXCoords: number[] = [] - dividerXCoords: number[] = [] + @computed get PanelWidth() {return this.props.PanelWidth()} + @computed get maxColWdith() {return this.props.PanelWidth() - 2 * this.xMargin;} + // dividerXCoords: number[] = [] //-------------------------------------------------------------------------------------------------------------// constructor(props: any) { @@ -315,8 +317,9 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti const nw = Doc.NativeWidth(childLayoutDoc, childDataDoc) || (!(childLayoutDoc._fitWidth || this.props.childFitWidth?.(d)) ? d[WidthSym]() : 0); const nh = Doc.NativeHeight(childLayoutDoc, childDataDoc) || (!(childLayoutDoc._fitWidth || this.props.childFitWidth?.(d)) ? d[HeightSym]() : 0); if (nw && nh) { - const colWid = this.columnWidth / this.numGroupColumns; - const docWid = this.layoutDoc._columnsFill ? colWid : Math.min(this.getDocWidth(d), colWid); + // const colWid = this.columnWidth / this.numGroupColumns; + // const docWid = this.layoutDoc._columnsFill ? colWid : Math.min(this.getDocWidth(d), colWid); + const docWid = this.getDocWidth(d) return Math.min( maxHeight, docWid * nh / nw); @@ -347,7 +350,7 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti // } resizeColumns = (n: number) => { - const totalWidth = this.props.PanelWidth() + const totalWidth = this.PanelWidth const colWidth = totalWidth / n const newColXCoords: number[] = [] let colStart = 0 @@ -356,6 +359,7 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti colStart += colWidth } this.columnStartXCoords = newColXCoords + console.log(newColXCoords) } // TODO: This is where you want to create a copy of the document to take its place @@ -558,10 +562,13 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti DataDoc={this.props.DataDoc} resizeColumns={this.resizeColumns.bind(this)} renderChildren={this.children} - columnWidth={this.columnWidth} + // columnWidth={this.columnWidth} numGroupColumns={this.numGroupColumns} gridGap={this.gridGap} pivotField={this.pivotField} + columnStartXCoords={this.columnStartXCoords} + maxColWidth={this.maxColWdith} + PanelWidth={this.PanelWidth} key={heading?.heading ?? ""} headings={this.headings} heading={heading?.heading ?? ""} diff --git a/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx b/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx index 452af2ddf..b9bed7174 100644 --- a/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx +++ b/src/client/views/collections/CollectionNoteTakingViewFieldColumn.tsx @@ -37,7 +37,7 @@ interface CSVFieldColumnProps { columnHeaders: SchemaHeaderField[] | undefined; headingObject: SchemaHeaderField | undefined; yMargin: number; - columnWidth: number; + // columnWidth: number; numGroupColumns: number; gridGap: number; type: "string" | "number" | "bigint" | "boolean" | "symbol" | "undefined" | "object" | "function" | undefined; @@ -50,12 +50,29 @@ interface CSVFieldColumnProps { unobserveHeight: (myref: any) => void; editableViewProps: any; resizeColumns: (n: number) => void + columnStartXCoords: number[] + PanelWidth: number + maxColWidth: number } @observer export class CollectionNoteTakingViewFieldColumn extends React.Component<CSVFieldColumnProps> { @observable private _background = "inherit"; + // It seems like this is being a little funky atm + @computed get columnWidth() { + // base cases + if (!this.props.columnHeaders || !this.props.headingObject || this.props.columnHeaders.length == 1) { + return this.props.maxColWidth + } + const i = this.props.columnHeaders.indexOf(this.props.headingObject) + if (i < 0) { + return this.props.maxColWidth + } + const endColValue = i == this.props.numGroupColumns - 1 ? this.props.PanelWidth : this.props.columnStartXCoords[i+1] + return endColValue - this.props.columnStartXCoords[i] - 10 + } + private dropDisposer?: DragManager.DragDropDisposer; private _headerRef: React.RefObject<HTMLDivElement> = React.createRef(); @@ -150,7 +167,8 @@ export class CollectionNoteTakingViewFieldColumn extends React.Component<CSVFiel console.log('in startDrag') // is MakeAlias a way to make a copy of a doc without rendering it? const alias = Doc.MakeAlias(this.props.Document); - alias._width = this.props.columnWidth / (this.props.columnHeaders?.length || 1); + // alias._width = this.props.columnWidth / (this.props.columnHeaders?.length || 1); + alias._width = this.columnWidth; alias._pivotField = undefined; let value = this.getValue(this._heading); value = typeof value === "string" ? `"${value}"` : value; @@ -219,17 +237,16 @@ export class CollectionNoteTakingViewFieldColumn extends React.Component<CSVFiel @computed get innards() { TraceMobx(); const key = this.props.pivotField; - const headings = this.props.headings(); const heading = this._heading; const columnYMargin = this.props.headingObject ? 0 : this.props.yMargin; - const uniqueHeadings = headings.map((i, idx) => headings.indexOf(i) === idx); const evContents = heading ? heading : "25"; const headingView = this.props.headingObject ? <div key={heading} className="collectionNoteTakingView-sectionHeader" ref={this._headerRef} style={{ - marginTop: this.props.yMargin, - width: (this.props.columnWidth) / - ((uniqueHeadings.length) || 1) + marginTop: 2 * this.props.yMargin, + // width: (this.props.columnWidth) / + // ((uniqueHeadings.length) || 1) + width: this.columnWidth }}> <div className="collectionNoteTakingView-sectionHeader-subCont" onPointerDown={this.headerDown} title={evContents === `No Value` ? @@ -243,7 +260,8 @@ export class CollectionNoteTakingViewFieldColumn extends React.Component<CSVFiel /> </div> </div> : (null); - const templatecols = `${this.props.columnWidth / this.props.numGroupColumns}px `; + // const templatecols = `${this.props.columnWidth / this.props.numGroupColumns}px `; + const templatecols = `${this.columnWidth}px `; const type = this.props.Document.type; return <> {headingView} @@ -264,7 +282,8 @@ export class CollectionNoteTakingViewFieldColumn extends React.Component<CSVFiel {!this.props.chromeHidden && type !== DocumentType.PRES ? <div className="collectionNoteTakingView-DocumentButtons" - style={{ width: this.props.columnWidth / this.props.numGroupColumns, marginBottom: 10 }}> + // style={{ width: this.props.columnWidth / this.props.numGroupColumns, marginBottom: 10 }}> + style={{ width: this.columnWidth, marginBottom: 10 }}> <div key={`${heading}-add-document`} className="collectionNoteTakingView-addDocumentButton"> <EditableView GetValue={returnEmptyString} |