diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/client/views/nodes/DataVizBox/DocCreatorMenu.scss | 14 | ||||
| -rw-r--r-- | src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx | 46 |
2 files changed, 46 insertions, 14 deletions
diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss b/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss index 43053ee34..dc0f99cbd 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss @@ -46,10 +46,22 @@ margin-bottom: 0px; } -.docCreatorMenu-content { +.docCreatorMenu-preview-content { + display: grid; + grid-template-columns: repeat(2, 1fr); + overflow-y: scroll; margin: 5px; width: calc(100% - 10px); height: calc(100% - 51px); border: 1px solid whitesmoke; border-radius: 5px; + + .docCreatorMenu-preview-window { + width: 125px; + height: 125px; + margin-top: 10px; + margin-left: 10px; + border: 1px solid whitesmoke; + border-radius: 5px; + } }
\ No newline at end of file diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx index dbd385047..520dd9c2d 100644 --- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx +++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.tsx @@ -79,8 +79,6 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> { @action toggleDisplay = (x: number, y: number) => { - // maxX and maxY will change if the UI/font size changes, but will work for any amount - // of items added to the menu if (this._shouldDisplay) { this._shouldDisplay = false; } else { @@ -107,8 +105,24 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> { } } - setDragStart = () => { + get templatesPreviewContents(){ + const tempArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; + return ( + <div className='docCreatorMenu-preview-content'> + {tempArray.map(i => + <div + className='docCreatorMenu-preview-window' + > + + </div>)} + </div> + ); + } + get optionsMenuContents(){ + return ( + <div></div> + ); } render() { @@ -167,7 +181,21 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> { > <FontAwesomeIcon icon={this._menuContent === 'templates' ? 'table-cells' : 'window-maximize'}/> </button> - <button className='docCreatorMenu-menu-button close-menu'> + <button + className='docCreatorMenu-menu-button close-menu' + onPointerDown={e => + setupMoveUpEvents( + this, + e, + returnFalse, + emptyFunction, + undoable(clickEv => { + clickEv.stopPropagation(); + this.closeMenu(); + }, 'open actions menu') + ) + } + > <FontAwesomeIcon icon={'minus'}/> </button> <button className='docCreatorMenu-menu-button right'> @@ -175,15 +203,7 @@ export class DocCreatorMenu extends ObservableReactComponent<{}> { </button> </div> <hr className='docCreatorMenu-menu-hr'/> - <div className='docCreatorMenu-content'> - {this._menuContent === 'templates' ? - <div> - </div> - : - <div> - </div> - } - </div> + {this._menuContent === 'templates' ? this.templatesPreviewContents : this.optionsMenuContents} </> } </div> |