/** * File: simulators.js * Author: Markus Grigull * Date: 02.03.2017 * * This file is part of VILLASweb. * * VILLASweb is free software: you can redistribute it and/or modify * it under the terms of the GNU General Public License as published by * the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. * * VILLASweb is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU General Public License for more details. * * You should have received a copy of the GNU General Public License * along with VILLASweb. If not, see . ******************************************************************************/ import React, { Component } from 'react'; import { Container } from 'flux/utils'; import { Button } from 'react-bootstrap'; import FileSaver from 'file-saver'; import _ from 'lodash'; import AppDispatcher from '../common/app-dispatcher'; import SimulatorStore from './simulator-store'; import UserStore from '../user/user-store'; import Icon from '../common/icon'; import Table from '../common/table'; import TableColumn from '../common/table-column'; import NewSimulatorDialog from './new-simulator'; import EditSimulatorDialog from './edit-simulator'; import ImportSimulatorDialog from './import-simulator'; import SimulatorAction from './simulator-action'; import DeleteDialog from '../common/dialogs/delete-dialog'; class Simulators extends Component { static getStores() { return [ UserStore, SimulatorStore ]; } static statePrio(state) { switch (state) { case 'running': case 'starting': return 1; case 'paused': case 'pausing': case 'resuming': return 2; case 'idle': return 3; case 'shutdown': return 4; case 'error': return 10; default: return 99; } } static calculateState() { const simulators = SimulatorStore.getState().sort((a, b) => { if (a.state !== b.state) { return Simulators.statePrio(a.state) > Simulators.statePrio(b.state); } else if (a.name !== b.name) { return a.name < b.name; } else { return a.stateUpdatedAt < b.stateUpdatedAt; } }); return { sessionToken: UserStore.getState().token, sessionUserID: UserStore.getState().userid, simulators, modalSimulator: {}, deleteModal: false, selectedSimulators: [] }; } componentWillMount() { AppDispatcher.dispatch({ type: 'simulators/start-load', token: this.state.sessionToken, userid: this.state.sessionUserID }); // Start timer for periodic refresh this.timer = window.setInterval(() => this.refresh(), 1000); } componentWillUnmount() { window.clearInterval(this.timer); } refresh() { if (this.state.editModal || this.state.deleteModal){ // do nothing since a dialog is open at the moment } else { AppDispatcher.dispatch({ type: 'simulators/start-load', token: this.state.sessionToken, userid: this.state.sessionUserID }); } } closeNewModal(data) { this.setState({ newModal : false }); if (data) { AppDispatcher.dispatch({ type: 'simulators/start-add', data, token: this.state.sessionToken, userid: this.state.sessionUserID }); } } closeEditModal(data) { this.setState({ editModal : false }); if (data) { let simulator = this.state.simulators[this.state.modalIndex]; console.log("modalIndex: " + this.state.modalIndex); console.log("Simulator Host:" + simulator.host); console.log("Simulator at index 1: " + this.state.simulators[1].host) simulator.properties = data; this.setState({ simulator }); AppDispatcher.dispatch({ type: 'simulators/start-edit', data: simulator, token: this.state.sessionToken, userid: this.state.sessionUserID }); } } closeDeleteModal(confirmDelete){ this.setState({ deleteModal: false }); if (confirmDelete === false) { return; } AppDispatcher.dispatch({ type: 'simulators/start-remove', data: this.state.modalSimulator, token: this.state.sessionToken, userid: this.state.sessionUserID }); } exportSimulator(index) { // filter properties let simulator = Object.assign({}, this.state.simulators[index]); delete simulator.id; // show save dialog const blob = new Blob([JSON.stringify(simulator, null, 2)], { type: 'application/json' }); FileSaver.saveAs(blob, 'simulator - ' + (_.get(simulator, 'properties.name') || _.get(simulator, 'rawProperties.name') || 'undefined') + '.json'); } closeImportModal(data) { this.setState({ importModal: false }); if (data) { AppDispatcher.dispatch({ type: 'simulators/start-add', data, token: this.state.sessionToken, userid: this.state.sessionUserID }); } } onSimulatorChecked(index, event) { const selectedSimulators = Object.assign([], this.state.selectedSimulators); for (let key in selectedSimulators) { if (selectedSimulators[key] === index) { // update existing entry if (event.target.checked) { return; } selectedSimulators.splice(key, 1); this.setState({ selectedSimulators }); return; } } // add new entry if (event.target.checked === false) { return; } selectedSimulators.push(index); this.setState({ selectedSimulators }); } runAction = action => { for (let index of this.state.selectedSimulators) { AppDispatcher.dispatch({ type: 'simulators/start-action', simulator: this.state.simulators[index], data: action.data, token: this.state.sessionToken, userid: this.state.sessionUserID }); } } static isSimulatorOutdated(simulator) { if (!simulator.stateUpdatedAt) return true; const fiveMinutes = 5 * 60 * 1000; return Date.now() - new Date(simulator.stateUpdatedAt) > fiveMinutes; } static stateLabelStyle(state, simulator){ var style = [ 'label' ]; if (Simulators.isSimulatorOutdated(simulator) && state !== 'shutdown') { style.push('label-outdated'); } switch (state) { case 'running': style.push('label-success'); break; case 'paused': style.push('label-info'); break; case 'idle': style.push('label-primary'); break; case 'error': style.push('label-danger'); break; case 'shutdown': style.push('label-warning'); break; default: style.push('label-default'); } return style.join(' '); } static stateUpdateModifier(updatedAt) { const date = new Date(updatedAt); return date.toLocaleString('de-DE'); } render() { const buttonStyle = { marginLeft: '10px' }; return (

Simulators

this.onSimulatorChecked(index, event)} width='30' /> {/* */} this.setState({ editModal: true, modalSimulator: this.state.simulators[index], modalIndex: index })} onExport={index => this.exportSimulator(index)} onDelete={index => this.setState({ deleteModal: true, modalSimulator: this.state.simulators[index], modalIndex: index })} />
this.closeNewModal(data)} /> this.closeEditModal(data)} simulator={this.state.modalSimulator} /> this.closeImportModal(data)} /> this.closeDeleteModal(e)} />
); } } let fluxContainerConverter = require('../common/FluxContainerConverter'); export default Container.create(fluxContainerConverter.convert(Simulators));