Mirrors/VILLASweb
1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-09 00:00:01 +01:00
Code Issues Releases Wiki Activity

Dirty fix for widget context menu position in dashboard edit mode

Browse source
This commit is contained in:
Sonja Happ 2021-03-16 15:31:24 +01:00
parent 84dbb81cb0
commit 01be84132b
1 changed files with 44 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

74
src/widget/widget-context-menu.js
View file

@ -17,7 +17,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Menu, Item, Separator, useContextMenu } from 'react-contexify';
import { Menu, Item, Separator, contextMenu } from 'react-contexify';
import Widget from './widget';
class WidgetContextMenu extends React.Component {
@ -93,6 +93,25 @@ class WidgetContextMenu extends React.Component {
}
};
showMenu = e => {
let index = this.props.index
if (this.props.editing){
contextMenu.show({
event: e,
id: 'widgetMenu' + index,
position: {
x: 'inherit',
y: 'inherit',
}
})
}
else {
contextMenu.show({
event: e,
id: 'widgetMenu' + index,
})
}
}
render() {
const isLocked = this.props.widget.locked;
@ -102,41 +121,36 @@ class WidgetContextMenu extends React.Component {
height: '100%'
};
const { show } = useContextMenu({id:'widgetMenu'+ this.props.index} )
function showMenu(e) {
e.preventDefault();
show(e);
}
return (
return (<div onContextMenu={showMenu} style={dim}>
<Menu id={'widgetMenu'+ this.props.index}>
<Item disabled={isLocked} onClick={this.editWidget}>Edit</Item>
<Item disabled={isLocked} onClick={this.duplicateWidget}>Duplicate</Item>
<Item disabled={isLocked} onClick={this.deleteWidget}>Delete</Item>
<div style={dim} onContextMenu={this.showMenu}>
<Widget
data={this.props.widget}
onWidgetChange={this.props.onWidgetChange}
editing={this.props.editing}
index={this.props.index}
paused={this.props.paused}
/>
<Separator />
<Menu id={'widgetMenu' + this.props.index}>
<Item disabled={isLocked} onClick={this.editWidget}>Edit</Item>
<Item disabled={isLocked} onClick={this.duplicateWidget}>Duplicate</Item>
<Item disabled={isLocked} onClick={this.deleteWidget}>Delete</Item>
<Item disabled={isLocked} onClick={this.moveAbove}>Move above</Item>
<Item disabled={isLocked} onClick={this.moveToFront}>Move to front</Item>
<Item disabled={isLocked} onClick={this.moveUnderneath}>Move underneath</Item>
<Item disabled={isLocked} onClick={this.moveToBack}>Move to back</Item>
<Separator />
<Separator />
<Item disabled={isLocked} onClick={this.moveAbove}>Move above</Item>
<Item disabled={isLocked} onClick={this.moveToFront}>Move to front</Item>
<Item disabled={isLocked} onClick={this.moveUnderneath}>Move underneath</Item>
<Item disabled={isLocked} onClick={this.moveToBack}>Move to back</Item>
<Item disabled={isLocked} onClick={this.lockWidget}>Lock</Item>
<Item disabled={isLocked === false} onClick={this.unlockWidget}>Unlock</Item>
</Menu>
<Separator />
<Widget
data={this.props.widget}
onWidgetChange={this.props.onWidgetChange}
editing={this.props.editing}
index={this.props.index}
paused={this.props.paused}
/>
</div>);
<Item disabled={isLocked} onClick={this.lockWidget}>Lock</Item>
<Item disabled={isLocked === false} onClick={this.unlockWidget}>Unlock</Item>
</Menu>
</div>
);
}
}