File content now changeable

src/file/edit-file-content.js

@@ -0,0 +1,82 @@
+/**
+ * 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 <http://www.gnu.org/licenses/>.
+ ******************************************************************************/
+
+import React from 'react';
+import {FormGroup, FormControl, Button, Col} from 'react-bootstrap';
+import AppDispatcher from "../common/app-dispatcher";
+import Dialog from '../common/dialogs/dialog';
+
+class EditFileContent extends React.Component {
+  valid = true;
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      uploadFile: null,
+      
+    };
+  }
+
+  selectUploadFile(event) {
+    this.setState({ uploadFile: event.target.files[0] });
+  };
+
+  startEditContent(){
+    const formData = new FormData();
+    formData.append("file", this.state.uploadFile);
+
+    AppDispatcher.dispatch({
+      type: 'files/start-edit',
+      data: formData,
+      token: this.props.sessionToken,
+      id: this.props.file.id
+    });
+
+    this.setState({ uploadFile: null });
+  };
+
+
+  onClose = () => {
+        this.props.onClose();
+  };
+
+
+  
+
+  render() {
+    return <Dialog show={this.props.show} title='Edit File Content' buttonTitle='Close' onClose={() => this.onClose()} blendOutCancel = {true} valid={true}>
+      <FormGroup as={Col} >
+        <FormControl
+          disabled={false}
+          type='file'
+          onChange={(event) => this.selectUploadFile(event)} />
+      </FormGroup>
+
+      <FormGroup as={Col} >
+        <Button
+          disabled={this.state.uploadFile === null}
+          onClick={() => this.startEditContent()}>
+          Upload
+            </Button>
+      </FormGroup>
+
+    </Dialog>;
+  }
+}
+
+export default EditFileContent;

src/file/edit-file-name.js

@@ -1,79 +0,0 @@
-/**
- * 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 <http://www.gnu.org/licenses/>.
- ******************************************************************************/
-
-import React from 'react';
-import {FormGroup, FormControl, FormLabel, Col} from 'react-bootstrap';
-
-import Dialog from '../common/dialogs/dialog';
-
-class EditFileName extends React.Component {
-  valid = true;
-
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      file: {},
-      
-    };
-  }
-
-  onClose = canceled => {
-    if (canceled) {
-      if (this.props.onClose != null) {
-        this.props.onClose();
-      }
-
-      return;
-    }
-
-    if (this.valid && this.props.onClose != null) {
-      this.props.onClose(this.state.file);
-    }
-  };
-
-  handleChange = event => {
-    this.props.file.name = event.target.value;
-    this.setState({file: this.props.file});
-
-    let name = true;
-
-    if (this.state.name === '') {
-      name = false;
-    }
-
-    this.valid = name;
-
-  };
-
-  
-
-  render() {
-    return <Dialog show={this.props.show} title='Edit File' buttonTitle='Save' onClose={(c) => this.onClose(c)}  valid={true}>
-      <form>
-        <FormGroup as={Col} controlId='name'>
-          <FormLabel column={false}>Name</FormLabel>
-          <FormControl type='text' value={this.props.file.name} onChange={this.handleChange} />
-          <FormControl.Feedback />
-        </FormGroup>
-
-      </form>
-    </Dialog>;
-  }
-}
-
-export default EditFileName;

src/file/edit-files.js

@@ -21,7 +21,7 @@ import Dialog from '../common/dialogs/dialog';
 import AppDispatcher from "../common/app-dispatcher";
 import Table from "../common/table";
 import TableColumn from "../common/table-column";
-import EditFileName from  "./edit-file-name";
+import EditFileContent from  "./edit-file-content";
 
 
 class EditFilesDialog extends React.Component {
@@ -39,14 +39,9 @@ class EditFilesDialog extends React.Component {
     };
   }
 
-  onClose(canceled) {
-    if (canceled === false) {
-      if (true) {
-        this.props.onClose();
-      }
-    } else {
-      this.props.onClose();
-    }
+  onClose() {
+    
+    this.props.onClose();
   }
 
   selectUploadFile(event) {
@@ -87,18 +82,7 @@ class EditFilesDialog extends React.Component {
 
   };
 
-  closeEditModal(data){
-    if(data !== {} || data !== "undefined"){
-    const formData = new FormData();
-    formData.append("object", data);
-
-    AppDispatcher.dispatch({
-      type: 'files/start-edit',
-      data: formData,
-      token: this.props.sessionToken,
-      id: data.id
-    });
-  }
+  closeEditModal(){
    
   this.setState({editModal: false});
   }
@@ -135,7 +119,7 @@ class EditFilesDialog extends React.Component {
 
 
     return (
-      <Dialog show={this.props.show} title="Edit Files of scenario" buttonTitle="Close" onClose={(c) => this.onClose(c)} blendOutCancel = {true} valid={true} size = 'lg'>
+      <Dialog show={this.props.show} title="Edit Files of scenario" buttonTitle="Close" onClose={() => this.onClose()} blendOutCancel = {true} valid={true} size = 'lg'>
         <div>
 
           <Table data={this.props.files}>
@@ -178,7 +162,7 @@ class EditFilesDialog extends React.Component {
           </FormGroup>
           <div style={{ clear: 'both' }} />
 
-          <EditFileName show={this.state.editModal} onClose={(data) => this.closeEditModal(data)} file={this.state.modalFile} />
+          <EditFileContent show={this.state.editModal} onClose={(data) => this.closeEditModal(data)} sessionToken={this.props.sessionToken} file={this.state.modalFile} />
 
          </div>
       </Dialog>

src/file/file-store.js

@@ -67,7 +67,17 @@ class FileStore extends ArrayStore {
 
       case 'files/downloaded':
         // in this case a file is contained in the response (no JSON)
-        return this.saveFile(state, action)
+        return this.saveFile(state, action);
+
+      case 'files/start-edit':
+          FilesDataManager.update(action.data, action.token, action.id);
+        return state;
+
+      case 'files/edited':
+          return this.updateElements(state, [action.data]);
+
+      case this.type + '/edit-error':
+        return state;
 
       default:
         return super.reduce(state, action);

src/file/files-data-manager.js

@@ -65,6 +65,21 @@ class FilesDataManager extends RestDataManager {
       });
     });
   }
+
+  update(file, token, id) {
+
+    RestAPI.put(this.makeURL(this.url + '/' + id), file, token).then(response => {
+        AppDispatcher.dispatch({
+          type: this.type + 's/edited',
+          data: response[this.type]
+        });
+      }).catch(error => {
+        AppDispatcher.dispatch({
+          type: this.type + 's/edit-error',
+          error: error
+        });
+      });
+    }
 }
 
 export default new FilesDataManager();

src/widget/widgets/image.js

@@ -26,6 +26,7 @@ class WidgetImage extends React.Component {
 
     this.state = {
       file: undefined,
+      fileDate: null
     }
   }
 
@@ -45,8 +46,9 @@ class WidgetImage extends React.Component {
 
     let file = this.props.files.find(file => file.id === parseInt(this.props.widget.customProperties.file, 10));
 
+
     if (file !== undefined) {
-      if (this.state.file === undefined || (this.state.file.id !== file.id)) {
+      if (this.state.file === undefined || (this.state.file.id !== file.id) || this.state.fileDate !== file.date) {
 
         AppDispatcher.dispatch({
           type: 'files/start-download',
@@ -54,7 +56,7 @@ class WidgetImage extends React.Component {
           token: this.props.token
         });
         
-        this.setState({ file: file })
+        this.setState({ file: file, fileDate: file.date });
       }
     }
 
@@ -65,7 +67,6 @@ class WidgetImage extends React.Component {
   }
 
   render() {
-
     let objectURL=''
     if(this.state.file !== undefined && this.state.file.objectURL !== undefined) {
       objectURL = this.state.file.objectURL