From ab714e6896ee2edc7dff60b9ba7c322722515976 Mon Sep 17 00:00:00 2001 From: Laura Fuentes Grau Date: Sun, 24 Nov 2019 20:32:12 +0100 Subject: [PATCH] wip: dashboardA and widgets can be accessed but aren't rendered yet --- src/app.js | 1 + src/common/api/rest-api.js | 1 + src/common/array-store.js | 7 +- src/common/data-managers/rest-data-manager.js | 10 +- src/dashboard/dashboard.js | 125 ++++++++++++------ src/dashboard/exdashboard.js | 23 +++- src/scenario/scenario.js | 1 + src/user/user.js | 2 +- src/widget/widget-store.js | 4 + src/widget/widgets-data-manager.js | 3 + 10 files changed, 132 insertions(+), 45 deletions(-) create mode 100644 src/widget/widget-store.js create mode 100644 src/widget/widgets-data-manager.js diff --git a/src/app.js b/src/app.js index a13b632..cd68009 100644 --- a/src/app.js +++ b/src/app.js @@ -146,6 +146,7 @@ class App extends React.Component {
+ diff --git a/src/common/api/rest-api.js b/src/common/api/rest-api.js index d515079..78f5d52 100644 --- a/src/common/api/rest-api.js +++ b/src/common/api/rest-api.js @@ -54,6 +54,7 @@ function isNetworkError(err) { class RestAPI { get(url, token) { + console.log(url); return new Promise(function (resolve, reject) { var req = request.get(url); diff --git a/src/common/array-store.js b/src/common/array-store.js index 710ff94..2bbdb1a 100644 --- a/src/common/array-store.js +++ b/src/common/array-store.js @@ -68,7 +68,6 @@ class ArrayStore extends ReduceStore { reduce(state, action) { switch (action.type) { case this.type + '/start-load': - if (Array.isArray(action.data)) { action.data.forEach((id) => { this.dataManager.load(id, action.token,action.param); @@ -80,8 +79,14 @@ class ArrayStore extends ReduceStore { case this.type + '/loaded': if (Array.isArray(action.data)) { + console.log(" loaded Array: "); + console.log(action.data); + console.log(state); return this.updateElements(state, action.data); } else { + console.log("loaded single object: "); + console.log([action.data]); + console.log(state); return this.updateElements(state, [action.data]); } diff --git a/src/common/data-managers/rest-data-manager.js b/src/common/data-managers/rest-data-manager.js index 7fc3c98..e928804 100644 --- a/src/common/data-managers/rest-data-manager.js +++ b/src/common/data-managers/rest-data-manager.js @@ -57,7 +57,8 @@ class RestDataManager { case 'load/add': if (param === null){ if(id != null){ - return this.url + '/' + id; + console.log("id != 0"); + return this.makeURL(this.url + '/' + id); } else { return this.makeURL(this.url); @@ -65,10 +66,10 @@ class RestDataManager { } else{ if(id != null){ - return this.url + '/' + id + '?' + param; + return this.makeURL(this.url + '/' + id + '?' + param); } else { - return this.makeURL(this.url) + '?' + param + return this.makeURL(this.url + '?' + param) } } case 'remove/update': @@ -86,10 +87,11 @@ class RestDataManager { load(id, token = null,param = null) { if (id != null) { + console.log("rdm load was called"); // load single object RestAPI.get(this.requestURL('load/add',id,param), token).then(response => { const data = this.filterKeys(response[this.type]); - + AppDispatcher.dispatch({ type: this.type + 's/loaded', data: data diff --git a/src/dashboard/dashboard.js b/src/dashboard/dashboard.js index 80b5406..7e5caff 100644 --- a/src/dashboard/dashboard.js +++ b/src/dashboard/dashboard.js @@ -27,7 +27,7 @@ import { Map } from 'immutable' //import Icon from '../common/icon'; import Widget from '../widget/widget'; -import EditWidget from '../widget/edit-widget'; +//import EditWidget from '../widget/edit-widget'; import WidgetContextMenu from './widget-context-menu'; import WidgetToolbox from './widget-toolbox'; @@ -40,6 +40,7 @@ import ProjectStore from '../project/project-store'; import SimulationStore from '../simulation/simulation-store'; import SimulationModelStore from '../simulationmodel/simulation-model-store'; import FileStore from '../file/file-store'; +import WidgetStore from '../widget/widget-store'; import AppDispatcher from '../common/app-dispatcher'; import 'react-contexify/dist/ReactContexify.min.css'; @@ -48,53 +49,100 @@ class Dashboard extends React.Component { static lastWidgetKey = 0; static getStores() { - return [ DashboardStore, ProjectStore, SimulationStore, SimulationModelStore, FileStore, UserStore ]; + return [ DashboardStore, ProjectStore, SimulationStore, SimulationModelStore, FileStore, UserStore, WidgetStore ]; } static calculateState(prevState, props) { if (prevState == null) { prevState = {}; } - + const sessionToken = UserStore.getState().token; let dashboard = Map(); - let rawDashboard = DashboardStore.getState().find(v => v._id === props.match.params.dashboard); - + console.log("dashboard calculate state was called: " + props.match.params.dashboard); + let dashboards = DashboardStore.getState() + let rawDashboard = dashboards[props.match.params.dashboard - 1]; + + + let str = JSON.stringify(rawDashboard, null, 4); + console.log(str); if (rawDashboard != null) { dashboard = Map(rawDashboard); + console.log("dashboard: " + dashboard); - // convert widgets list to a dictionary to be able to reference widgets - const widgets = {}; + // convert widgets list to a dictionary to be able to reference widgets + //let widgets = {}; - for (let widget of dashboard.get('widgets')) { - widgets[this.getNewWidgetKey()] = widget; + let rawWidgets = WidgetStore.getState(); + + if(rawWidgets.length === 0){ + AppDispatcher.dispatch({ + type: 'widgets/start-load', + token: sessionToken, + param: 'dashboardID=1' + }); } - dashboard = dashboard.set('widgets', widgets); + + console.log("here are the widgets: "); + console.log(rawWidgets); + + dashboard = dashboard.set('widgets', rawWidgets); - // this.computeHeightWithWidgets(widgets); + + /* for(let widget of dashboard.get('widgets')){ + console.log("load files got called") + console.log(widget); + AppDispatcher.dispatch({ + type: 'files/start-load', + token: sessionToken, + param: 'objectID=' + widget.id + '&objectType=widget' + }); + } + */ + let widgets = {}; - // this.setState({ dashboard: selectedDashboards, project: null }); + for (let widget of dashboard.get('widgets')) { + widgets[this.lastWidgetKey] = widget; + this.lastWidgetKey++; + } + //ist das überhaupt nötiG?? + /* if (this.state.dashboard.has('id') === false) { + AppDispatcher.dispatch({ + type: 'dashboards/start-load', + data: this.props.match.params.dashboard, + token: this.state.sessionToken + }); + } + + + // this.computeHeightWithWidgets(widgets); - // AppDispatcher.dispatch({ - // type: 'projects/start-load', - // data: selectedDashboard.get('project'), - // token: this.state.sessionToken - // }); + let selectedDashboards = dashboard; + /* this.setState({ dashboard: selectedDashboards, project: null }); + + AppDispatcher.dispatch({ + type: 'projects/start-load', + data: selectedDashboards.get('project'), + token: this.state.sessionToken + }); +*/ } + let simulationModels = []; - if (prevState.simulation != null) { - simulationModels = SimulationModelStore.getState().filter(m => prevState.simulation.models.includes(m._id)); - } + //if (prevState.simulation != null) { + // simulationModels = SimulationModelStore.getState().filter(m => prevState.simulation.models.includes(m._id)); + //} return { + rawDashboard, dashboard, - sessionToken: UserStore.getState().token, - projects: ProjectStore.getState(), - simulations: SimulationStore.getState(), - files: FileStore.getState(), + sessionToken: sessionToken, + projects: null, //ProjectStore.getState(), + simulations: null, //SimulationStore.getState(), + files: null, //FileStore.getState(), project: prevState.project || null, simulation: prevState.simulation || null, @@ -102,7 +150,7 @@ class Dashboard extends React.Component { editing: prevState.editing || false, paused: prevState.paused || false, - editModal: prevState.editModal || false, + //editModal: prevState.editModal || false, modalData: prevState.modalData || null, modalIndex: prevState.modalIndex || null, @@ -119,10 +167,10 @@ class Dashboard extends React.Component { return widgetKey; } - - componentWillMount() { +//!!!won't work anymore + /* componentDidMount() { //document.addEventListener('keydown', this.handleKeydown.bind(this)); - + console.log("problem in componentdidmount"); if (this.state.dashboard.has('id') === false) { AppDispatcher.dispatch({ type: 'dashboards/start-load', @@ -137,7 +185,7 @@ class Dashboard extends React.Component { //document.removeEventListener('keydown', this.handleKeydown.bind(this)); } - componentDidUpdate() { + /*componentDidUpdate() { if (this.state.dashboard._id !== this.props.match.params.dashboard) { this.reloadDashboard(); } @@ -167,7 +215,7 @@ class Dashboard extends React.Component { } }); } - } + }* /*handleKeydown(e) { switch (e.key) { @@ -183,8 +231,9 @@ class Dashboard extends React.Component { break; default: } - }*/ - + } + + } /* * Adapt the area's height with the position of the new widget. * Return true if the height increased, otherwise false. @@ -210,6 +259,7 @@ class Dashboard extends React.Component { } reloadDashboard() { + console.log("Error: reloadDashboard was called"); // select dashboard by param id this.state.dashboards.forEach((tempDashboard) => { if (tempDashboard._id === this.props.match.params.dashboard) { @@ -287,9 +337,9 @@ class Dashboard extends React.Component { } - editWidget = (widget, index) => { - this.setState({ editModal: true, modalData: widget, modalIndex: index }); - } + //editWidget = (widget, index) => { + // this.setState({ editModal: true, modalData: widget, modalIndex: index }); + //} closeEdit = data => { @@ -378,7 +428,6 @@ class Dashboard extends React.Component { editing={this.state.editing} fullscreen={this.props.isFullscreen} paused={this.state.paused} - onEdit={this.startEditing} onSave={this.saveEditing} onCancel={this.cancelEditing} onFullscreen={this.props.toggleFullscreen} @@ -413,7 +462,7 @@ class Dashboard extends React.Component { ))} - +
; } @@ -421,3 +470,5 @@ class Dashboard extends React.Component { let fluxContainerConverter = require('../common/FluxContainerConverter'); export default Fullscreenable()(Container.create(fluxContainerConverter.convert(Dashboard), { withProps: true })); +// +//onEdit={this.startEditing} \ No newline at end of file diff --git a/src/dashboard/exdashboard.js b/src/dashboard/exdashboard.js index 54ab039..ee7a014 100644 --- a/src/dashboard/exdashboard.js +++ b/src/dashboard/exdashboard.js @@ -4,7 +4,9 @@ import DashboardStore from './dashboard-store'; import AppDispatcher from '../common/app-dispatcher'; import Table from '../common/table'; import TableColumn from '../common/table-column'; -import UserStore from '../user/user-store' +import UserStore from '../user/user-store'; +import { Button } from 'react-bootstrap'; +import Icon from '../common/icon'; @@ -40,20 +42,37 @@ class ExDashboard extends Component { }); } + loadDash(){ + console.log('bis hierhin gekommen'); + AppDispatcher.dispatch({ + type: 'dashboards/start-load', + token: this.state.tokenState, + param: 'scenarioID=1' + }); + } render() { + const buttonStyle = { + marginLeft: '10px' + }; return ( +
+

Dashboards

- +
+ +
+ +
); } diff --git a/src/scenario/scenario.js b/src/scenario/scenario.js index 681dfc5..7de6e7d 100644 --- a/src/scenario/scenario.js +++ b/src/scenario/scenario.js @@ -57,6 +57,7 @@ class Scenario extends React.Component { }); scenario = {}; + console.log(scenario); } // load models diff --git a/src/user/user.js b/src/user/user.js index 74ac1a8..b587637 100644 --- a/src/user/user.js +++ b/src/user/user.js @@ -53,7 +53,7 @@ class User extends Component { user = {}; } - + console.log(user); console.log("extracted user 2: " + user.username); return { diff --git a/src/widget/widget-store.js b/src/widget/widget-store.js new file mode 100644 index 0000000..d6256ed --- /dev/null +++ b/src/widget/widget-store.js @@ -0,0 +1,4 @@ +import ArrayStore from '../common/array-store'; +import WidgetsDataManager from './widgets-data-manager'; + +export default new ArrayStore('widgets', WidgetsDataManager); diff --git a/src/widget/widgets-data-manager.js b/src/widget/widgets-data-manager.js new file mode 100644 index 0000000..ed03b2f --- /dev/null +++ b/src/widget/widgets-data-manager.js @@ -0,0 +1,3 @@ +import RestDataManager from '../common/data-managers/rest-data-manager'; + +export default new RestDataManager('widget', '/widgets');