diff options
| author | alyssaf16 <alyssa_feinberg@brown.edu> | 2024-03-18 10:08:32 -0400 |
|---|---|---|
| committer | alyssaf16 <alyssa_feinberg@brown.edu> | 2024-03-18 10:08:32 -0400 |
| commit | 416e00b5481e4835a674683c2e8213b536cab74c (patch) | |
| tree | 7ed8d9f3265258789d531bc99275beb6f0c3d38e | |
| parent | fa2b150fcccef8df17a4e199767dc6d643a9c16c (diff) | |
hover
| -rw-r--r-- | src/client/views/nodes/ComparisonBox.tsx | 13 | ||||
| -rw-r--r-- | src/client/views/nodes/DocumentView.tsx | 2 |
2 files changed, 11 insertions, 4 deletions
diff --git a/src/client/views/nodes/ComparisonBox.tsx b/src/client/views/nodes/ComparisonBox.tsx index 9caa216a5..81f624b20 100644 --- a/src/client/views/nodes/ComparisonBox.tsx +++ b/src/client/views/nodes/ComparisonBox.tsx @@ -179,6 +179,7 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>() flipFlashcard = () => { const usePath = this.layoutDoc[`_${this._props.fieldKey}_usePath`]; + this.layoutDoc[`_${this._props.fieldKey}_usePath`] = usePath === undefined ? 'alternate' : undefined; }; @@ -189,9 +190,8 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>() className="formattedTextBox-alternateButton" onPointerDown={e => setupMoveUpEvents(e.target, e, returnFalse, emptyFunction, e => { + console.log(this.layoutDoc[`_${this._props.fieldKey}_revealOp`]); if (!this.layoutDoc[`_${this._props.fieldKey}_revealOp`] || this.layoutDoc[`_${this._props.fieldKey}_revealOp`] == 'flip') { - this.layoutDoc[`_${this._props.fieldKey}_revealOp`] = 'flip'; - console.log(this.layoutDoc[`_${this._props.fieldKey}_revealOp`]); this.flipFlashcard(); } }) @@ -265,7 +265,14 @@ export class ComparisonBox extends ViewBoxAnnotatableComponent<FieldViewProps>() if (!(this.dataDoc[this.fieldKey + '_1'] || this.dataDoc[this.fieldKey + '_1'] == 'empty')) this.dataDoc[this.fieldKey + '_1'] = DocUtils.copyDragFactory(Doc.UserDoc().emptyNote as Doc); return ( - <div className={`comparisonBox${this._props.isContentActive() ? '-interactive' : ''}` /* change className to easily disable/enable pointer events in CSS */}> + <div + className={`comparisonBox${this._props.isContentActive() ? '-interactive' : ''}`} /* change className to easily disable/enable pointer events in CSS */ + onMouseEnter={() => { + if (this.layoutDoc[`_${this._props.fieldKey}_revealOp`] == 'hover') this.layoutDoc[`_${this._props.fieldKey}_usePath`] = 'alternate'; + }} + onMouseLeave={() => { + if (this.layoutDoc[`_${this._props.fieldKey}_revealOp`] == 'hover') this.layoutDoc[`_${this._props.fieldKey}_usePath`] = undefined; + }}> {displayBox(`${this.fieldKey}_${side}`, side, this._props.PanelWidth() - 3)} {this.overlayAlternateIcon} diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index c4c5204a3..26e5ec622 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -578,7 +578,7 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document const revealItems: ContextMenuProps[] = revealOptions && 'subitems' in revealOptions ? revealOptions.subitems : []; revealItems.push({ description: 'Hover', event: () => (this.layoutDoc[`_${this._props.fieldKey}_revealOp`] = 'hover'), icon: 'hand-point-up' }); revealItems.push({ description: 'Flip', event: () => (this.layoutDoc[`_${this._props.fieldKey}_revealOp`] = 'flip'), icon: 'rotate' }); - revealItems.push({ description: 'Hide & Reveal', event: () => this._props.pinToPres(this.Document, {}), icon: 'eye-slash' }); + revealItems.push({ description: 'Hide & Reveal', event: () => (this.layoutDoc[`_${this._props.fieldKey}_revealOp`] = 'hide/reveal'), icon: 'eye-slash' }); //revealItems.push({ description: 'Bring to Front', event: () => SelectionManager.Views.forEach(dv => dv._props.bringToFront?.(dv.Document, false)), icon: 'arrow-up' }); !revealOptions && cm.addItem({ description: 'Reveal Options', addDivider: false, noexpand: true, subitems: revealItems, icon: 'layer-group' }); } |