- {"Select delay for command execution (Format hh:mm, max 1h):"}
-
-
- {actionList}
-
-
- this.props.runAction(this.state.selectedAction, this.state.selectedDelay)}>Send command
-
-
-
;
+ setAction = id => {
+ // search action
+ for (let action of this.props.actions) {
+ if (action.id === id) {
+ this.setState({ selectedAction: action });
+ }
}
+ };
+
+ setTimeForAction = (time) => {
+ this.setState({ time: new Date(time) })
+ }
+
+ render() {
+
+ let sendCommandDisabled = this.props.runDisabled || this.state.selectedAction == null || this.state.selectedAction.id === "-1"
+
+ let time = this.state.time.getFullYear().pad(4) + '-' +
+ this.state.time.getMonth().pad(2) + '-' +
+ this.state.time.getDay().pad(2) + 'T' +
+ this.state.time.getHours().pad(2) + ':' +
+ this.state.time.getMinutes().pad(2);
+
+ const actionList = this.props.actions.map(action => (
+
-
Infrastructure Components
-
-
- this.onICChecked(index, event)} width='30' />
- this.modifyNameColumn(name)}/>
- this.stateLabelStyle(state, component)} />
- this.modifyManagedExternallyColumn(managedexternally)} width='105' />
- this.modifyUptimeColumn(uptime)}/>
- this.stateUpdateModifier(stateUpdateAt)} />
+ Infrastructure Components
{this.state.currentUser.role === "Admin" ?
- this.setState({ editModal: true, modalIC: this.state.ics[index], modalIndex: index })}
- onExport={index => this.exportIC(index)}
- onDelete={index => this.setState({ deleteModal: true, modalIC: this.state.ics[index], modalIndex: index })}
- />
- :
- this.exportIC(index)}
- />
+ (
+ Add Infrastructure Component } >
+ this.setState({newModal: true})} style={buttonStyle}>
+
+ Import Infrastructure Component } >
+ this.setState({importModal: true})} style={buttonStyle}>
+
+ )
+ :
+ ( )
}
-
- {this.state.currentUser.role === "Admin" ?
-
+
+
+ {managerTable}
+ {simulatorTable}
+ {gatewayTable}
+ {serviceTable}
+ {equipmentTable}
+
+ {this.state.currentUser.role === "Admin" && this.state.numberOfExternalICs > 0 ?
+
this.runAction(action)}
+ runAction={(action, when) => this.runAction(action, when)}
actions={[
- { id: '-1', title: 'Select command', data: { action: 'none' } },
- { id: '0', title: 'Reset', data: { action: 'reset' } },
- { id: '1', title: 'Shutdown', data: { action: 'shutdown' } },
- ]}
+ {id: '-1', title: 'Action', data: {action: 'none'}},
+ {id: '0', title: 'Reset', data: {action: 'reset'}},
+ {id: '1', title: 'Shutdown', data: {action: 'shutdown'}},
+ ]}
/>
:
-
- }
-
- {this.state.currentUser.role === "Admin" ?
-
- this.setState({ newModal: true })} style={buttonStyle}>
- this.setState({ importModal: true })} style={buttonStyle}>
-
- :
-
+
}
-
this.closeNewModal(data)} />
+ this.closeNewModal(data)} managers={this.state.managers} />
this.closeEditModal(data)} ic={this.state.modalIC} />
this.closeImportModal(data)} />
+ this.closeDeleteModal(e)} />
this.closeICModal(data)}
@@ -443,7 +518,6 @@ class InfrastructureComponents extends Component {
userRole={this.state.currentUser.role}
sendControlCommand={(command, ic) => this.sendControlCommand(command, ic)}/>
- this.closeDeleteModal(e)} />
);
}
diff --git a/src/ic/new-ic.js b/src/ic/new-ic.js
index 4f52667..b95b543 100644
--- a/src/ic/new-ic.js
+++ b/src/ic/new-ic.js
@@ -34,7 +34,8 @@ class NewICDialog extends React.Component {
category: '',
managedexternally: false,
description: '',
- location: ''
+ location: '',
+ manager: ''
};
}
@@ -48,7 +49,8 @@ class NewICDialog extends React.Component {
uuid: this.state.uuid,
managedexternally: this.state.managedexternally,
location: this.state.location,
- description: this.state.description
+ description: this.state.description,
+ manager: this.state.manager
};
if (this.state.websocketurl != null && this.state.websocketurl !== "" && this.state.websocketurl !== 'http://') {
@@ -88,6 +90,7 @@ class NewICDialog extends React.Component {
let websocketurl = true;
let type = true;
let category = true;
+ let manager = true;
if (this.state.name === '') {
name = false;
@@ -97,6 +100,10 @@ class NewICDialog extends React.Component {
uuid = false;
}
+ if(this.state.managedexternally && manager === ''){
+ manager = false;
+ }
+
if (this.state.type === '') {
type = false;
}
@@ -105,7 +112,7 @@ class NewICDialog extends React.Component {
category = false;
}
- this.valid = name && uuid && websocketurl && type && category;
+ this.valid = name && uuid && websocketurl && type && category && manager;
// return state to control
if (target === 'name') return name ? "success" : "error";
@@ -113,6 +120,7 @@ class NewICDialog extends React.Component {
if (target === 'websocketurl') return websocketurl ? "success" : "error";
if (target === 'type') return type ? "success" : "error";
if (target === 'category') return category ? "success" : "error";
+ if (target === 'manager') return manager ? "success" : "error";
return this.valid;
}
@@ -131,8 +139,8 @@ class NewICDialog extends React.Component {
case "simulator":
typeOptions = ["dummy","generic","dpsim","rtlab","rscad","opalrt"];
break;
- case "controller":
- typeOptions = ["kubernetes","villas-controller"];
+ case "manager":
+ typeOptions = ["villas-node","villas-relay","generic"];
break;
case "gateway":
typeOptions = ["villas-node","villas-relay"];
@@ -149,30 +157,49 @@ class NewICDialog extends React.Component {
return (
this.onClose(c)} onReset={() => this.resetState()} valid={this.validateForm()}>
);
diff --git a/src/result/edit-result.js b/src/result/edit-result.js
index 4833251..e1992c1 100644
--- a/src/result/edit-result.js
+++ b/src/result/edit-result.js
@@ -16,7 +16,7 @@
******************************************************************************/
import React from 'react';
-import {FormGroup, FormControl, FormLabel, Col, Button, ProgressBar} from 'react-bootstrap';
+import { FormGroup, FormControl, FormLabel, Col, Row, Button, ProgressBar } from 'react-bootstrap';
import AppDispatcher from "../common/app-dispatcher";
import FileStore from "../file/file-store"
@@ -38,8 +38,6 @@ class EditResultDialog extends React.Component {
uploadFile: null,
uploadProgress: 0,
files: null,
- result: null,
- resultExists: false,
};
}
@@ -53,26 +51,38 @@ class EditResultDialog extends React.Component {
this.setState({ [event.target.id]: event.target.value });
};
+ isEmpty(val) {
+ return (val === undefined || val == null || val.length <= 0);
+ };
+
componentDidUpdate(prevProps, prevState) {
- if (this.state.resultExists && this.props.files != prevProps.files) {
- this.setState({files: FileStore.getState().filter(file => this.state.result.resultFileIDs.includes(file.id))});
- }
- if (this.props.result != prevProps.result && Object.keys(this.props.result).length != 0) {
- this.setState({
- id: this.props.result.id,
- description: this.props.result.description,
- result: this.props.result,
- resultExists: true,
- files: FileStore.getState().filter(file => this.props.result.resultFileIDs.includes(file.id)),
- })
- }
- }
+ if (this.props.resultId != prevProps.resultId || this.props.results != prevProps.results) {
+ let result = this.props.results[this.props.resultId];
+
+ if (result && Object.keys(result).length != 0) {
+ let hasFiles = !this.isEmpty(result.resultFileIDs);
+ if (hasFiles) {
+ this.setState({
+ id: result.id,
+ description: result.description,
+ files: FileStore.getState().filter(file => result.resultFileIDs.includes(file.id)),
+ })
+ } else {
+ this.setState({
+ id: result.id,
+ description: result.description,
+ files: null,
+ })
+ }
+ }
+ }
+ };
selectUploadFile(event) {
this.setState({ uploadFile: event.target.files[0] });
};
- startFileUpload(){
+ startFileUpload() {
const formData = new FormData();
formData.append("file", this.state.uploadFile);
@@ -97,68 +107,98 @@ class EditResultDialog extends React.Component {
this.setState({ uploadProgress: parseInt(event.percent.toFixed(), 10) });
};
- deleteFile(index){
+ deleteFile(index) {
let file = this.state.files[index];
AppDispatcher.dispatch({
- type: 'files/start-remove',
- data: file,
+ type: 'resultfiles/start-remove',
+ resultID: this.state.id,
+ fileID: file.id,
token: this.props.sessionToken
});
+
+ }
+
+ submitDescription() {
+ let result = this.props.results[this.props.resultId];
+ if (!this.isEmpty(result)) {
+ result.description = this.state.description;
+ AppDispatcher.dispatch({
+ type: 'results/start-edit',
+ data: result,
+ token: this.props.sessionToken
+ });
+ }
}
render() {
return
this.onClose()}
- blendOutCancel = {true}
- valid={true}
- size = 'lg'>
+ title={'Edit Result No. ' + this.state.id}
+ buttonTitle='Close'
+ onClose={() => this.onClose()}
+ blendOutCancel={true}
+ valid={true}
+ size='lg'>
- Description
-
+ Description
+
+ this.submitDescription()}>
+ Save
+
+
+
+
+
- this.deleteFile(index)}
- />
+ this.deleteFile(index)}
+ />
- Add Result File
- this.selectUploadFile(event)} />
+ Add Result File
+ this.selectUploadFile(event)} />
-
- this.startFileUpload()}>
- Upload
+
+ this.startFileUpload()}>
+ Upload
-
+
+
+
+
-
-
-
;
}
diff --git a/src/result/result-store.js b/src/result/result-store.js
index d824b1e..519c94a 100644
--- a/src/result/result-store.js
+++ b/src/result/result-store.js
@@ -15,40 +15,14 @@
* along with VILLASweb. If not, see
.
******************************************************************************/
-
import ArrayStore from '../common/array-store';
import ResultsDataManager from './results-data-manager';
-import FilesDataManager from '../file/files-data-manager'
class ResultStore extends ArrayStore {
constructor() {
super('results', ResultsDataManager);
}
- saveFile(state, action){
-
- let fileID = parseInt(action.id)
- state.forEach((element, index, array) => {
- if (element.id === fileID) {
- // save blob object
- array[index]["data"] = new Blob([action.data.data], {type: action.data.type});
- // update file type
- array[index]["type"] = action.data.type;
-
- if (array[index]["objectURL"] !== ''){
- // free memory of previously generated object URL
- URL.revokeObjectURL(array[index]["objectURL"]);
- }
- // create an object URL for the file
- array[index]["objectURL"] = URL.createObjectURL(array[index]["data"])
- }
- });
-
- // announce change to listeners
- this.__emitChange();
- return state
- }
-
simplify(timestamp) {
let parts = timestamp.split("T");
let datestr = parts[0];
@@ -67,17 +41,29 @@ class ResultStore extends ArrayStore {
reduce(state, action) {
switch (action.type) {
case 'results/loaded':
- this.simplifyTimestamps(action.data);
+ if (Array.isArray(action.data)) {
+ this.simplifyTimestamps(action.data);
+ } else {
+ this.simplifyTimestamps([action.data]);
+ }
return super.reduce(state, action);
case 'results/added':
this.simplifyTimestamps([action.data]);
return super.reduce(state, action);
+ case 'results/edited':
+ this.simplifyTimestamps([action.data]);
+ return super.reduce(state, action);
+
case 'resultfiles/start-upload':
ResultsDataManager.uploadFile(action.data, action.resultID, action.token, action.progressCallback, action.finishedCallback, action.scenarioID);
return state;
+ case 'resultfiles/start-remove':
+ ResultsDataManager.removeFile(action.resultID, action.fileID, action.token);
+ return state;
+
default:
return super.reduce(state, action);
}
diff --git a/src/result/results-data-manager.js b/src/result/results-data-manager.js
index 5c7e2e0..3584c67 100644
--- a/src/result/results-data-manager.js
+++ b/src/result/results-data-manager.js
@@ -19,24 +19,24 @@ import RestDataManager from '../common/data-managers/rest-data-manager';
import RestAPI from '../common/api/rest-api';
import AppDispatcher from '../common/app-dispatcher';
-class ResultsDataManager extends RestDataManager{
+class ResultsDataManager extends RestDataManager {
constructor() {
super('result', '/results');
}
uploadFile(file, resultID, token = null, progressCallback = null, finishedCallback = null, scenarioID) {
- RestAPI.upload(this.makeURL(this.url + '/' + resultID + '/file') , file, token, progressCallback, scenarioID).then(response => {
+ RestAPI.upload(this.makeURL(this.url + '/' + resultID + '/file'), file, token, progressCallback, scenarioID).then(response => {
AppDispatcher.dispatch({
type: 'files/uploaded',
});
- // Trigger a results reload
+ // Trigger a result reload
AppDispatcher.dispatch({
type: 'results/start-load',
- param: '?scenarioID=' + scenarioID,
- token: token
+ data: resultID,
+ token: token,
});
// Trigger a files reload
@@ -57,6 +57,23 @@ class ResultsDataManager extends RestDataManager{
});
}
+ removeFile(resultID, fileID, token) {
+ RestAPI.delete(this.makeURL(this.url + '/' + resultID + '/file/' + fileID), token).then(response => {
+ // reload result
+ AppDispatcher.dispatch({
+ type: 'results/start-load',
+ data: resultID,
+ token: token,
+ });
+
+ // update files
+ AppDispatcher.dispatch({
+ type: 'files/removed',
+ data: fileID,
+ token: token,
+ });
+ });
+ }
}
export default new ResultsDataManager();
\ No newline at end of file
diff --git a/src/scenario/scenario.js b/src/scenario/scenario.js
index 56bdd96..7bf2de9 100644
--- a/src/scenario/scenario.js
+++ b/src/scenario/scenario.js
@@ -103,6 +103,7 @@ class Scenario extends React.Component {
files: FileStore.getState().filter(file => file.scenarioID === parseInt(props.match.params.scenario, 10)),
ics: ICStore.getState(),
+ ExternalICInUse: false,
deleteConfigModal: false,
importConfigModal: false,
@@ -113,9 +114,11 @@ class Scenario extends React.Component {
editResultsModal: prevState.editResultsModal || false,
modalResultsData: {},
- modalResultsIndex: 0,
+ modalResultsIndex: prevState.modalResultsIndex,
newResultModal: false,
- filesToDownload: [],
+ filesToDownload: prevState.filesToDownload,
+ zipfiles: prevState.zipfiles || false,
+ resultNodl: prevState.resultNodl,
editOutputSignalsModal: prevState.editOutputSignalsModal || false,
editInputSignalsModal: prevState.editInputSignalsModal || false,
@@ -158,25 +161,28 @@ class Scenario extends React.Component {
componentDidUpdate(prevProps, prevState) {
// check whether file data has been loaded
- if (this.state.filesToDownload.length > 0 ) {
- if (this.state.filesToDownload.length === 1) {
- let fileToDownload = FileStore.getState().filter(file => file.id === this.state.filesToDownload[0])
- if (fileToDownload.length === 1 && fileToDownload[0].data) {
- const blob = new Blob([fileToDownload[0].data], {type: fileToDownload[0].type});
- FileSaver.saveAs(blob, fileToDownload[0].name);
- this.setState({ filesToDownload: [] });
- }
- } else { // zip and save several files
- let filesToDownload = FileStore.getState().filter(file => this.state.filesToDownload.includes(file.id) && file.data);
- if (filesToDownload.length === this.state.filesToDownload.length) { // all requested files have been loaded
- var zip = new JSZip();
- filesToDownload.forEach(file => {
- zip.file(file.name, file.data);
- });
- zip.generateAsync({type: "blob"}).then(function(content) {
- saveAs(content, "results.zip");
- });
- this.setState({ filesToDownload: [] });
+ if (this.state.filesToDownload && this.state.filesToDownload.length > 0 ) {
+ if (this.state.files != prevState.files) {
+ if (!this.state.zipfiles) {
+ let fileToDownload = FileStore.getState().filter(file => file.id === this.state.filesToDownload[0])
+ if (fileToDownload.length === 1 && fileToDownload[0].data) {
+ const blob = new Blob([fileToDownload[0].data], {type: fileToDownload[0].type});
+ FileSaver.saveAs(blob, fileToDownload[0].name);
+ this.setState({ filesToDownload: [] });
+ }
+ } else { // zip and save one or more files (download all button)
+ let filesToDownload = FileStore.getState().filter(file => this.state.filesToDownload.includes(file.id) && file.data);
+ if (filesToDownload.length === this.state.filesToDownload.length) { // all requested files have been loaded
+ var zip = new JSZip();
+ filesToDownload.forEach(file => {
+ zip.file(file.name, file.data);
+ });
+ let zipname = "result_" + this.state.resultNodl + "_" + Date.now();
+ zip.generateAsync({type: "blob"}).then(function(content) {
+ saveAs(content, zipname);
+ });
+ this.setState({ filesToDownload: [] });
+ }
}
}
}
@@ -361,9 +367,30 @@ class Scenario extends React.Component {
this.setState({ selectedConfigs: selectedConfigs });
}
- runAction(action, delay) {
- // delay in seconds
+ usesExternalIC(index){
+ let icID = this.state.configs[index].icID;
+ let ic = null;
+ for (let component of this.state.ics) {
+ if (component.id === this.state.configs[index].icID) {
+ ic = component;
+ }
+ }
+
+ if (ic == null) {
+ return false;
+ }
+
+ if (ic.managedexternally === true){
+ this.setState({ExternalICInUse: true})
+ return true
+ }
+
+ return false
+
+ }
+
+ runAction(action, when) {
if (action.data.action === 'none') {
console.warn("No command selected. Nothing was sent.");
return;
@@ -386,8 +413,7 @@ class Scenario extends React.Component {
action.data.parameters = this.state.configs[index].startParameters;
}
- // Unix time stamp + delay
- action.data.when = Math.round(Date.now() / 1000.0 + delay)
+ action.data.when = when;
console.log("Sending action: ", action.data)
@@ -613,21 +639,19 @@ class Scenario extends React.Component {
closeEditResultsModal() {
this.setState({ editResultsModal: false });
-
- AppDispatcher.dispatch({
- type: 'results/start-load',
- token: this.state.sessionToken,
- param: '?scenarioID=' + this.state.scenario.id
- })
}
downloadResultData(param) {
let toDownload = [];
+ let zip = false;
- if (typeof(param) === 'object') {
+ if (typeof(param) === 'object') { // download all files
toDownload = param.resultFileIDs;
- } else {
+ zip = true;
+ this.setState({ filesToDownload: toDownload, zipfiles: zip, resultNodl: param.id });
+ } else { // download one file
toDownload.push(param);
+ this.setState({ filesToDownload: toDownload, zipfiles: zip});
}
toDownload.forEach(fileid => {
@@ -637,8 +661,6 @@ class Scenario extends React.Component {
token: this.state.sessionToken
});
});
-
- this.setState({ filesToDownload: toDownload });
}
closeDeleteResultsModal(confirmDelete) {
@@ -736,7 +758,7 @@ class Scenario extends React.Component {
editButton
downloadAllButton
deleteButton
- onEdit={index => this.setState({ editResultsModal: true, modalResultsData: this.state.results[index], modalResultsIndex: index })}
+ onEdit={index => this.setState({ editResultsModal: true, modalResultsIndex: index })}
onDownloadAll={(index) => this.downloadResultData(this.state.results[index])}
onDelete={(index) => this.setState({ deleteResultsModal: true, modalResultsData: this.state.results[index], modalResultsIndex: index })}
/>
@@ -746,7 +768,8 @@ class Scenario extends React.Component {
sessionToken={this.state.sessionToken}
show={this.state.editResultsModal}
files={this.state.files}
- result={this.state.modalResultsData}
+ results={this.state.results}
+ resultId={this.state.modalResultsIndex}
scenarioID={this.state.scenario.id}
onClose={this.closeEditResultsModal.bind(this)} />
this.closeDeleteResultsModal(e)} />
@@ -772,12 +795,27 @@ class Scenario extends React.Component {
scenarioID={this.state.scenario.id}
/>
-
-
{/*Component Configurations table*/}
- Component Configurations
+ Component Configurations
+ Add Component Configuration } >
+ this.addConfig()} style={buttonStyle}>
+
+ Import Component Configuration } >
+ this.setState({ importConfigModal: true })} style={buttonStyle}>
+
+
- this.onConfigChecked(index, event)} width='30' />
+ this.usesExternalIC(index)}
+ onChecked={(index, event) => this.onConfigChecked(index, event)}
+ width='30' />
this.getListOfFiles(fileIDs, ['json', 'JSON'])} />
-
- this.runAction(action, delay)}
- actions={[
- { id: '-1', title: 'Select command', data: { action: 'none' } },
- { id: '0', title: 'Start', data: { action: 'start' } },
- { id: '1', title: 'Stop', data: { action: 'stop' } },
- { id: '2', title: 'Pause', data: { action: 'pause' } },
- { id: '3', title: 'Resume', data: { action: 'resume' } }
- ]} />
-
-
-
- this.addConfig()} style={buttonStyle}>
- this.setState({ importConfigModal: true })} style={buttonStyle}>
-
-
+ { this.state.ExternalICInUse ? (
+
+ this.runAction(action, when)}
+ actions={[
+ {id: '-1', title: 'Action', data: {action: 'none'}},
+ {id: '0', title: 'Start', data: {action: 'start'}},
+ {id: '1', title: 'Stop', data: {action: 'stop'}},
+ {id: '2', title: 'Pause', data: {action: 'pause'}},
+ {id: '3', title: 'Resume', data: {action: 'resume'}}
+ ]}/>
+
+ ) : (
)
+ }
Dashboards
+ Dashboards
+ Add Dashboard } >
+ this.setState({ newDashboardModal: true })} style={buttonStyle}>
+
+ Import Dashboard } >
+ this.setState({ importDashboardModal: true })} style={buttonStyle}>
+
+
-
- this.setState({ newDashboardModal: true })} style={buttonStyle}>
- this.setState({ importDashboardModal: true })} style={buttonStyle}>
-
-
-
-
this.closeNewDashboardModal(data)} />
this.closeEditDashboardModal(data)} />
this.closeImportDashboardModal(data)} />
@@ -901,18 +942,15 @@ class Scenario extends React.Component {
this.closeDeleteDashboardModal(e)} />
{/*Result table*/}
-
-
Results
- this.setState({ newResultModal: true })} style={buttonStyle}>
-
-
-
+ Results
+ Add Result } >
+ this.setState({ newResultModal: true })} style={buttonStyle}>
+
+
{resulttable}
- {/*
-
- this.setState({ newResultModal: true })} style={buttonStyle}>
-
- */}
this.closeNewResultModal(data)} />
{/*Scenario Users table*/}
diff --git a/src/scenario/scenarios.js b/src/scenario/scenarios.js
index d176d0f..8158af8 100644
--- a/src/scenario/scenarios.js
+++ b/src/scenario/scenarios.js
@@ -17,7 +17,7 @@
import React, { Component } from 'react';
import { Container } from 'flux/utils';
-import { Button } from 'react-bootstrap';
+import {Button, OverlayTrigger, Tooltip} from 'react-bootstrap';
import FileSaver from 'file-saver';
import AppDispatcher from '../common/app-dispatcher';
@@ -241,7 +241,20 @@ class Scenarios extends Component {
return (
-
Scenarios
+
Scenarios
+ Add Scenario } >
+ this.setState({ newModal: true })} style={buttonStyle}>
+
+ Import Scenario } >
+ this.setState({ importModal: true })} style={buttonStyle}>
+
+
-
- this.setState({ newModal: true })} style={buttonStyle}>
- this.setState({ importModal: true })} style={buttonStyle}>
-
-
-
-
this.closeNewModal(data)} />
this.closeEditModal(data)} scenario={this.state.modalScenario} />
this.closeImportModal(data)} nodes={this.state.nodes} />
diff --git a/src/styles/swagger-ui.css b/src/styles/swagger-ui.css
new file mode 100644
index 0000000..066c2e1
--- /dev/null
+++ b/src/styles/swagger-ui.css
@@ -0,0 +1,3 @@
+.swagger-ui div.scheme-container {
+ display: none
+}
diff --git a/src/styles/widgets.css b/src/styles/widgets.css
index 06032c2..6f91c0e 100644
--- a/src/styles/widgets.css
+++ b/src/styles/widgets.css
@@ -398,6 +398,8 @@ div[class*="-widget"] label {
/* Begin time offset widget */
.time-offset {
+ width: 100%;
+ height: 100%;
display: flex;
align-items: center;
justify-content: space-around;
diff --git a/src/user/login-form.js b/src/user/login-form.js
index 1c2fc5e..3c26f51 100644
--- a/src/user/login-form.js
+++ b/src/user/login-form.js
@@ -70,14 +70,14 @@ class LoginForm extends Component {
Username
this.handleChange(e)} />
+ this.handleChange(e)} />
Password
this.handleChange(e)} />
+ this.handleChange(e)} />
@@ -95,11 +95,11 @@ class LoginForm extends Component {
this.openRecoverPassword()}>Forgot your password?
-
+
this.closeRecoverPassword()} sessionToken={this.props.sessionToken} />
-
+
);
}
}
diff --git a/src/user/recover-password.js b/src/user/recover-password.js
index 556f0d2..2602d9c 100644
--- a/src/user/recover-password.js
+++ b/src/user/recover-password.js
@@ -17,7 +17,7 @@
import React from 'react';
import Dialog from '../common/dialogs/dialog';
-import Config from '../config.js';
+import Config from '../config';
class RecoverPassword extends React.Component {
@@ -29,13 +29,10 @@ class RecoverPassword extends React.Component {
}
}
-
onClose() {
this.props.onClose();
}
-
-
render() {
return (
this.onClose(c)} blendOutCancel = {true} valid={true} size = 'lg'>
@@ -43,7 +40,7 @@ class RecoverPassword extends React.Component {
Please contact:
{this.state.admin.name}
E-Mail:
- {this.state.admin.mail}
+ {this.state.admin.mail}
-
Users
+
Users
+
+ Add User } >
+ this.setState({ newModal: true })}>
+
+
+
this.setState({ editModal: true, modalData: this.state.users[index] })} onDelete={index => this.setState({ deleteModal: true, modalData: this.state.users[index] })} />
-
this.setState({ newModal: true })}>
+
this.closeNewModal(data)} />
this.closeEditModal(data)} user={this.state.modalData} />
diff --git a/src/widget/edit-widget/edit-widget-control-creator.js b/src/widget/edit-widget/edit-widget-control-creator.js
index 5617d26..d2ee3fc 100644
--- a/src/widget/edit-widget/edit-widget-control-creator.js
+++ b/src/widget/edit-widget/edit-widget-control-creator.js
@@ -170,7 +170,8 @@ export default function CreateControls(widgetType = null, widget = null, session
handleChange(e)} />,
handleChange(e)} />,
handleChange(e)} />,
- handleChange(e)} />,
+ handleChange(e)} />,
+ handleChange(e)} />,
);
break;
diff --git a/src/widget/edit-widget/edit-widget-plot-colors-control.js b/src/widget/edit-widget/edit-widget-plot-colors-control.js
index 567e84f..a612277 100644
--- a/src/widget/edit-widget/edit-widget-plot-colors-control.js
+++ b/src/widget/edit-widget/edit-widget-plot-colors-control.js
@@ -19,6 +19,8 @@ import React, { Component } from 'react';
import { FormGroup, OverlayTrigger, Tooltip , FormLabel, Button } from 'react-bootstrap';
import ColorPicker from './color-picker'
import Icon from "../../common/icon";
+import {scaleOrdinal} from "d3-scale";
+import {schemeCategory10} from "d3-scale-chromatic";
// schemeCategory20 no longer available in d3
@@ -36,8 +38,20 @@ class EditWidgetPlotColorsControl extends Component {
}
static getDerivedStateFromProps(props, state){
+
+ let widget = props.widget;
+ if(widget.customProperties.lineColors === undefined || widget.customProperties.lineColors === null){
+ // for backwards compatibility with old plots
+ widget.customProperties.lineColors = []
+
+ const newLineColor = scaleOrdinal(schemeCategory10);
+ for (let signalID of widget.signalIDs){
+ widget.customProperties.lineColors.push(newLineColor(signalID))
+ }
+ }
+
return {
- widget: props.widget
+ widget: widget
};
}
@@ -62,9 +76,9 @@ class EditWidgetPlotColorsControl extends Component {
this.setState({selectedIndex: null});
}
}
-
+
render() {
-
+
return (
Line Colors
@@ -81,7 +95,7 @@ class EditWidgetPlotColorsControl extends Component {
}
let signal = this.props.signals.find(signal => signal.id === signalID);
-
+
return ({signal.name}}>
this.editLineColor(signalID)} >
diff --git a/src/widget/widget-factory.js b/src/widget/widget-factory.js
index 4bb4aaf..ed04630 100644
--- a/src/widget/widget-factory.js
+++ b/src/widget/widget-factory.js
@@ -168,6 +168,7 @@ class WidgetFactory {
widget.customProperties.valueMin = 0;
widget.customProperties.valueMax = 1;
widget.customProperties.valueUseMinMax = false;
+ widget.customProperties.lockAspect = true;
break;
case 'Box':
widget.minWidth = 50;
@@ -209,6 +210,7 @@ class WidgetFactory {
widget.customProperties.horizontal = true;
widget.customProperties.showOffset = true;
widget.customProperties.lockAspect = true;
+ widget.customProperties.showName = true;
break;
default:
diff --git a/src/widget/widget-plot/plot-legend.js b/src/widget/widget-plot/plot-legend.js
index 1ada30d..4dd7459 100644
--- a/src/widget/widget-plot/plot-legend.js
+++ b/src/widget/widget-plot/plot-legend.js
@@ -20,7 +20,7 @@ import { scaleOrdinal} from 'd3-scale';
import {schemeCategory10} from 'd3-scale-chromatic'
function Legend(props){
-
+
const signal = props.sig;
const hasScalingFactor = (signal.scalingFactor !== 1);
@@ -52,10 +52,15 @@ class PlotLegend extends React.Component {
return
- {
+ { this.props.lineColors !== undefined && this.props.lineColors != null ? (
this.props.signals.map( signal =>
- )}
+ )) : (
+ this.props.signals.map( signal =>
+
+ ))
+ }
+
;
}
diff --git a/src/widget/widget-plot/plot.js b/src/widget/widget-plot/plot.js
index 1677915..6f314fe 100644
--- a/src/widget/widget-plot/plot.js
+++ b/src/widget/widget-plot/plot.js
@@ -207,6 +207,11 @@ class Plot extends React.Component {
const lines = this.state.data.map((values, index) => {
let signalID = this.props.signalIDs[index];
+
+ if(this.props.lineColors === undefined || this.props.lineColors === null){
+ this.props.lineColors = [] // for backwards compatibility
+ }
+
if (typeof this.props.lineColors[signalID] === "undefined") {
this.props.lineColors[signalID] = newLineColor(signalID);
}
diff --git a/src/widget/widgets/time-offset.js b/src/widget/widgets/time-offset.js
index 6c6569b..3682da8 100644
--- a/src/widget/widgets/time-offset.js
+++ b/src/widget/widgets/time-offset.js
@@ -71,7 +71,10 @@ class WidgetTimeOffset extends Component {
{this.props.widget.customProperties.icID !== -1 ?
(no IC )
- }
+ }
+ {this.props.widget.customProperties.icID !== -1 && this.props.widget.customProperties.showName ?
+ ({this.state.icName} ) : (
{this.props.widget.customProperties.icID !== -1 ?
({this.state.icName} )
.default})
@@ -103,8 +84,6 @@ class Home extends React.Component {