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

Merge branch '143-widgets-cannot-be-dragged' into 'develop'

Browse source 
Resolve "Widgets cannot be dragged"

Closes #143

See merge request acs/public/villas/VILLASweb!27
This commit is contained in:
Markus Grigull 2018-05-04 12:33:08 +02:00
commit be4bf42d20
4 changed files with 4418 additions and 4133 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8509
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

4
package.json
View file

@ -20,14 +20,14 @@
"rc-slider": "^8.3.0",
"react": "^15.4.2",
"react-bootstrap": "^0.31.1",
"react-contextmenu": "^2.3.0",
"react-contexify": "^3.0.0",
"react-d3": "^0.4.0",
"react-dnd": "^2.2.4",
"react-dnd-html5-backend": "^2.2.4",
"react-dom": "^15.4.2",
"react-fullscreenable": "^2.4.3",
"react-notification-system": "^0.2.13",
"react-rnd": "^5.0.9",
"react-rnd": "^7.4.0",
"react-router": "^4.1.2",
"react-router-dom": "^4.1.2",
"react-scripts": "1.0.10",

32
src/containers/visualization.js
View file

@ -22,7 +22,7 @@
import React from 'react';
import { Container } from 'flux/utils';
import { Button, Glyphicon } from 'react-bootstrap';
import { ContextMenu, MenuItem } from 'react-contextmenu';
import { ContextMenu, Item, Separator } from 'react-contexify';
import Fullscreenable from 'react-fullscreenable';
import Slider from 'rc-slider';
import classNames from 'classnames';
@ -44,7 +44,7 @@ import AppDispatcher from '../app-dispatcher';
import NotificationsDataManager from '../data-managers/notifications-data-manager';
import NotificationsFactory from '../data-managers/notifications-factory';
import '../styles/context-menu.css';
import 'react-contexify/dist/ReactContexify.min.css';
class Visualization extends React.Component {
static getStores() {
@ -521,20 +521,22 @@ class Visualization extends React.Component {
</Dropzone>
{current_widgets != null &&
Object.keys(current_widgets).map( (widget_key) => (
<ContextMenu id={'widgetMenu'+ widget_key} key={widget_key} >
<MenuItem data={{key: widget_key}} disabled={this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.editWidget(e, data)}>Edit</MenuItem>
<MenuItem data={{key: widget_key}} disabled={this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.deleteWidget(e, data)}>Delete</MenuItem>
<MenuItem divider />
<MenuItem data={{key: widget_key}} disabled={this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.moveWidget(e, data, this.moveAbove)}>Move above</MenuItem>
<MenuItem data={{key: widget_key}} disabled={this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.moveWidget(e, data, this.moveToFront)}>Move to front</MenuItem>
<MenuItem data={{key: widget_key}} disabled={this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.moveWidget(e, data, this.moveUnderneath)}>Move underneath</MenuItem>
<MenuItem data={{key: widget_key}} disabled={this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.moveWidget(e, data, this.moveToBack)}>Move to back</MenuItem>
<MenuItem divider />
<MenuItem data={{key: widget_key}} disabled={this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.lockWidget(data)}>Lock</MenuItem>
<MenuItem data={{key: widget_key}} disabled={!this.state.visualization.widgets[widget_key].locked} onClick={(e, data) => this.unlockWidget(data)}>Unlock</MenuItem>
Object.keys(current_widgets).map(widget_key => {
const data = { key: widget_key };
return <ContextMenu id={'widgetMenu'+ widget_key} key={widget_key}>
<Item disabled={this.state.visualization.widgets[widget_key].locked} onClick={e => this.editWidget(e, data)}>Edit</Item>
<Item disabled={this.state.visualization.widgets[widget_key].locked} onClick={e => this.deleteWidget(e, data)}>Delete</Item>
<Separator />
<Item disabled={this.state.visualization.widgets[widget_key].locked} onClick={e => this.moveWidget(e, data, this.moveAbove)}>Move above</Item>
<Item disabled={this.state.visualization.widgets[widget_key].locked} onClick={e => this.moveWidget(e, data, this.moveToFront)}>Move to front</Item>
<Item disabled={this.state.visualization.widgets[widget_key].locked} onClick={e => this.moveWidget(e, data, this.moveUnderneath)}>Move underneath</Item>
<Item disabled={this.state.visualization.widgets[widget_key].locked} onClick={e => this.moveWidget(e, data, this.moveToBack)}>Move to back</Item>
<Separator />
<Item disabled={this.state.visualization.widgets[widget_key].locked} onClick={e => this.lockWidget(data)}>Lock</Item>
<Item disabled={!this.state.visualization.widgets[widget_key].locked} onClick={e => this.unlockWidget(data)}>Unlock</Item>
</ContextMenu>
))}
})}
<EditWidget sessionToken={this.state.sessionToken} show={this.state.editModal} onClose={(data) => this.closeEdit(data)} widget={this.state.modalData} simulationModels={this.state.simulationModels} files={this.state.files} />
</div>

6
src/containers/widget.js
View file

@ -21,7 +21,7 @@
import React from 'react';
import { Container } from 'flux/utils';
import { ContextMenuTrigger } from 'react-contextmenu';
import { ContextMenuProvider } from 'react-contexify';
import Rnd from 'react-rnd';
import classNames from 'classnames';
@ -252,9 +252,9 @@ class Widget extends React.Component {
enableResizing={resizing}
disableDragging={widget.locked}
>
<ContextMenuTrigger id={'widgetMenu' + this.props.index} ref={c => this.contextMenuTriggerViaDraggable = c} >
<ContextMenuProvider id={'widgetMenu' + this.props.index}>
{element}
</ContextMenuTrigger>
</ContextMenuProvider>
</Rnd>
);
} else {