diff options
Diffstat (limited to 'src/client/views/collections/CollectionNoteTakingView.tsx')
| -rw-r--r-- | src/client/views/collections/CollectionNoteTakingView.tsx | 54 |
1 files changed, 43 insertions, 11 deletions
diff --git a/src/client/views/collections/CollectionNoteTakingView.tsx b/src/client/views/collections/CollectionNoteTakingView.tsx index 0cdf63939..5435650b4 100644 --- a/src/client/views/collections/CollectionNoteTakingView.tsx +++ b/src/client/views/collections/CollectionNoteTakingView.tsx @@ -302,9 +302,9 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti if (existingHeader) { const index = this.columnHeaders.indexOf(existingHeader) if (this.columnHeaders.length == 1) { - return this.props.PanelWidth() - this.columnStartXCoords[index] - 4 * this.gridGap + return this.props.PanelWidth() - this.columnStartXCoords[index] - 4 * this.gridGap - 100 } - return this.columnStartXCoords[index + 1] - this.columnStartXCoords[index] - 2 * this.gridGap + return this.columnStartXCoords[index + 1] - this.columnStartXCoords[index] - 2 * this.gridGap - 100 } return 1000; } @@ -350,13 +350,16 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti // } resizeColumns = (n: number) => { + //TODO: that isn't the proper width of columns const totalWidth = this.PanelWidth - const colWidth = totalWidth / n + const dividerWidth = 70 + const totaldividerWidth = (n - 1) * dividerWidth + const colWidth = (totalWidth - totaldividerWidth) / n const newColXCoords: number[] = [] let colStart = 0 for (let i = 0; i < n; i++) { newColXCoords.push(colStart) - colStart += colWidth + colStart += colWidth + dividerWidth } this.columnStartXCoords = newColXCoords console.log(newColXCoords) @@ -617,6 +620,29 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti } } + //TODO: look at MultiRowResizer.tsx + // @action + // onDividerPointerDown = (e: React.PointerEvent) => { + // const eles = HTMLElement[e.currentTarget.Elem] + // DragManager.StartDrag(e.target, {}, e.clientX, e.clientY) + // } + + @action + onDividerPointerOver = (e: React.PointerEvent, index: number) => { + if (DragManager.docsBeingDragged.length == 0) { + //convert client X to how we're doing stuff + const xPos = e.clientX + 2 * this.xMargin + // get difference (-25 is because that's the center of the divider) + const xDividerPos = this.columnStartXCoords[index + 1] - 25 + const diff = xDividerPos - xPos + // make a copy of the array + const colXCoords : number[] = [] + this.columnStartXCoords.forEach(val => colXCoords.push(val)) + colXCoords[index + 1] -= diff + this.columnStartXCoords = colXCoords + } + } + // @computed get renderedSections() { TraceMobx(); @@ -631,13 +657,19 @@ export class CollectionNoteTakingView extends CollectionSubView<Partial<collecti const col = this.sectionNoteTaking(sections[i][0], sections[i][1]) eles.push(col) //TODO make this look pretty - // if (i < sections.length - 1) { - // eles.push( - // <div className={"collectionNoteTakingViewFieldColumn"}> - // new div - // </div> - // ) - // } + if (i < sections.length - 1) { + eles.push( + <div className="columnDivider" onPointerOver={e => this.onDividerPointerOver(e, i)} key={i} + style={{ + height: "100%", + width: 50, + padding: `0 10 10 0`, + margin: "auto", + backgroundColor: "black" + }} + /> + ) + } } return eles } |