Commit 0d9831b2 authored by Maxime Chaillet's avatar Maxime Chaillet

display images and pdf files in the event list.

parent aeaf9798
......@@ -4,10 +4,28 @@ import ICATPLUS from '../../config/icat/icatPlus.js'
/**
* The HTTP reauest used to retrieve all events from walleLog
*/
export function getEventsHTTPRequest() {
export function getEventsHTTPRequest() {
return ICATPLUS.server + "/events";
}
export function postEventsHTTPRequest() {
return ICATPLUS.server + "/events";
}
/**
* Retrieve the file of an event which category is 'file'
* @param {*} investigationId the investigationId
* @param {*} eventId the eventId
* @return {File} the file
*/
export function getFileByEventIdHTTPRequest(investigationId, eventId) {
return ICATPLUS.server + '/events/' + investigationId + '/event/' + eventId + '/download';
}
/**
* Upload data such as a file to ICAT+.
* @param {*} investigationId the investigationId
*/
export function uploadFile(investigationId) {
return ICATPLUS.server + "/events/" + investigationId + "/upload"
}
\ No newline at end of file
......@@ -26,7 +26,6 @@ class Event extends React.Component {
render() {
let creationDate = <Moment format="YYYY/MM/DD HH:mm" date={this.props.event.creationDate} />;
debugger
let toRender = () => {
//let lastTimestamp = <Moment format="YYYY/MM/DD HH:mm" date={this.props.event.lastTimestamp} />;
let typeImg = (category) => {
......
//react
import React from 'react';
import { getFileByEventIdHTTPRequest } from '../../api/icat/icatPlus'
/**
* Handles how a event which category is File is viewed
*/
class EventFileViewer extends React.Component {
render() {
debugger
if (this.props.event.contentType.search("image") != -1 ) {
return (
<div>
<img width={100} src={getFileByEventIdHTTPRequest(this.props.event.investigationId, this.props.event._id)} alt={this.props.event.filename} /> <span> {this.props.event.text} </span>
</div>)
}
if (this.props.event.contentType.search("pdf") != -1 ) {
return (
<div>
<img width={100} src="/pdfLogo.png" alt={this.props.event.filename}/> <span> {this.props.event.text} </span>
</div>)
}
}
}
export default EventFileViewer;
\ No newline at end of file
import React from 'react';
import { Panel, Button } from 'react-bootstrap';
import { Grid, Col, Row, Table } from 'react-bootstrap';
import EventFileViewer from './eventFileViewer'
/**
* This class displays a event history item. As such it does not have any knowledge of history.
......@@ -21,7 +22,6 @@ class EventHistoryItem extends React.Component {
render() {
let htmlContent = { __html: this.props.item.formattedHTML };
debugger
return (
<div style={{ 'padding-left': this.visuals.paddingLeft }}>
<Panel id="collapsible-panel-example-1" expanded={this.state.expanded}>
......@@ -58,7 +58,8 @@ class EventHistoryItem extends React.Component {
{/*<p> {this.props.item.content} </p> */}
{(this.props.item.category === "commandLine" || this.props.item.category === 'error') ? this.props.item.text : ""}
{this.props.item.category === "comment" ? (<div> {this.props.item.text} </div>) : ""}
{this.props.item.category === "File" ? <div> <img width={100} src={this.props.item.url} /> <span> {this.props.item.title} </span> </div>: ""}
{this.props.item.category === "file" ? <EventFileViewer event={this.props.item}/> : ""}
</Col>
</Row>
</Panel.Body>
......
......@@ -2,9 +2,10 @@
import React from 'react';
import { Grid, Row, Col, Button } from "react-bootstrap";
import { Link } from 'react-router-dom';
import axios from 'axios';
import { uploadFile } from '../../api/icat/icatPlus'
/**
* a new event which is a file upload
*/
......@@ -27,6 +28,7 @@ class NewEventUpload extends React.Component {
event.preventDefault();
this.errorDiv.style.display = "block";
} else {
debugger;
console.log(`Selected file - ${this.fileInput.files[0].name}`);
const file = this.fileInput.files[0];
......@@ -34,8 +36,12 @@ class NewEventUpload extends React.Component {
data.append('file', file);
data.append('investigationId', this.props.investigationId);
data.append('creationDate', Date());
data.append('type', 'annotation');
data.append('category', 'file');
data.append('text', this.textarea.value);
axios.post("http://lindemaria:8000/events/" + this.props.investigationId + "/upload", data)
axios.post(uploadFile(), data)
.then(console.log('file successfully sent')
)
.catch(error => console.log(error));
......@@ -53,7 +59,14 @@ class NewEventUpload extends React.Component {
<Grid fluid={true}>
<Row>
<Col>
<label> Select a file : </label>
<input type='file' ref={input => { this.fileInput = input; }} onChange={() => { this.switchOffErrorMessage() }} />
<br />
</Col>
<Col>
<label> Type a legend (optional) : </label>
<textarea style={{ width: '100%', height: '100px' }} ref={textarea => { this.textarea = textarea; }} > </textarea>
<br />
</Col>
</Row>
<Row>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment