Commit a2aad07e authored by Maxime Chaillet's avatar Maxime Chaillet

Merge branch 'issue126' into 'master'

Issue126

Closes #126

See merge request !160
parents 034c94a2 2fe03d65
Pipeline #12105 passed with stages
in 6 minutes and 42 seconds
import { DOC_VIEW } from '../../constants/EventTypes';
import React from 'react'
import ReactDOM from 'react-dom'
import { Grid, Row, OverlayTrigger, Tooltip } from 'react-bootstrap'
import PropTypes from 'prop-types'
import _ from 'lodash'
import Moment from 'moment'
import { getOriginalEvent } from '../../helpers/EventHelpers'
import Event from './Event';
import UserMessage from '../UserMessage';
import { INFO_MESSAGE_TYPE } from '../../constants/UserMessages';
require("./event.css");
const VERTICAL_BAR_EXTRA_LENGTH_ON_TOP = 10;
const VERTICAL_BAR_EXTRA_LENGTH_ON_BOTTOM = 15;
const VERTICAL_BAR_LENGTH_UNIT = 'px';
/**
* The list of the all events
*/
class EventList extends React.Component {
constructor(props) {
super(props)
this.state = {
verticalBarLength: '0px',
events: this.props.events, // the displayed (ie filtered) event list. The original list is in this.props.eventList
}
this.adjustVerticalBarLength = this.adjustVerticalBarLength.bind(this);
// this.onEventUpdated = this.onEventUpdated.bind(this);
}
/**
* Executed after all the events have been properly displayed
*/
componentDidMount() {
this.adjustVerticalBarLength();
}
componentDidUpdate() {
this.adjustVerticalBarLength();
}
render() {
const {
events,
investigationId,
onEventUpdated,
onEventClicked,
reverseEventsSortingByCreationDate,
selectedEventId,
user,
updateEvent,
view,
} = this.props;
/**
* Get existing events grouped by date
*
*/
function getGroupedEvents() {
//Groups events by day. For each group (=each day), events are still sorted from the youngest to the oldest
//groupedSortedEvents is an object : { "Aug 3":{ [{json event1}, {json event2}] }, "Aug 1":{ [{json event3}] } }
let groupedSortedEvents = _.groupBy(events, function (o) {
return Moment(getOriginalEvent(o).creationDate).format("MMMM D, YYYY");
});
// Iterates over each of the properties of the groupedSortedEvents object and create an array containing React components
let eventsAndDates = [];
let dateKey = 0;
for (var propertyName in groupedSortedEvents) {
eventsAndDates.push(
<div key={dateKey}>
<TimeAxisMarks userView={view} value={propertyName} />
{groupedSortedEvents[propertyName].map(
(event, eventKey) => {
return (<div key={eventKey}>
<Event
event={event}
investigationId={investigationId}
isSelected={event._id && event._id === selectedEventId}
onEventUpdated={onEventUpdated}
onEventClicked={onEventClicked}
reverseEventsSortingByCreationDate={reverseEventsSortingByCreationDate}
user={user}
updateEvent={updateEvent}
view={view}
/>
</div>)
}
)}
</div>
)
dateKey += 1;
}
return eventsAndDates;
}
let verticalBarLengthOntop = VERTICAL_BAR_EXTRA_LENGTH_ON_TOP + VERTICAL_BAR_LENGTH_UNIT;
if (!events || events.length === 0) {
return (
<Grid fluid={true} ref={(element) => { this.grid = element }} >
<Row style={{ marginLeft: '30px', marginRight: '30px', marginTop: '20px' }}>
<UserMessage
message="The logbook is currently empty."
isTextCentered={true}
type={INFO_MESSAGE_TYPE}
/>
</Row>
</Grid >
)
}
return (
<Grid fluid={true} ref={(element) => { this.grid = element }} >
<Row style={{ height: verticalBarLengthOntop }}>
<div ref={(element) => this.verticalBar = element}
style={{
/* this is the vertical line */
content: '',
position: 'relative',
height: this.state.verticalBarLength,
width: '2px',
background: '#CCCCCC',
zIndex: '1',
marginLeft: '120px',
}} />
</Row>
{getGroupedEvents()}
</Grid >
)
}
/**
* Determine the grid height and deduce the vertical bar height.
*/
adjustVerticalBarLength() {
var node = ReactDOM.findDOMNode(this.grid);
if (node) {
let gridLength = node.clientHeight;
let barLengthValue = gridLength + VERTICAL_BAR_EXTRA_LENGTH_ON_BOTTOM;
let barLength = barLengthValue + VERTICAL_BAR_LENGTH_UNIT;
if (barLength !== this.state.verticalBarLength) {
this.setState({ verticalBarLength: barLength });
}
}
}
}
const TimeAxisMarks = (props) => {
let userView = props.userView; // the view the user has choosen 'doc' or 'monitoring'
if (userView === DOC_VIEW) {
/* to be removed */
return (<div style={{ marginTop: '10px', marginBottom: '10px' }}>
<OverlayTrigger placement="right" overlay={<Tooltip id="tooltip"> <p> Events created on {props.value} </p> </Tooltip>}>
<span style={{ color: '#999999', marginLeft: '10px', fontStyle: 'italic', fontSize: '16px' }}> <strong> {Moment(props.value).format("MMM D")} </strong> </span>
</OverlayTrigger>
</div>)
} else {
// used in 'monitoring view'
return (<div style={{ marginTop: '10px', marginBottom: '10px' }}>
<OverlayTrigger placement="right" overlay={<Tooltip id="tooltip"> <p> Events created on {props.value} </p> </Tooltip>}>
<span style={{ color: '#999999', marginLeft: '0px', fontStyle: 'italic', fontSize: '16px' }}> <strong> {Moment(props.value).format("MMM D")} </strong> </span>
</OverlayTrigger>
</div>
)
}
}
EventList.propTypes = {
/** the array of unsorted events as provided by the ICAT+ server */
events: PropTypes.array,
/** the investigationId the provided events belong to. */
investigationId: PropTypes.string.isRequired,
/* Callback function triggered when the user updated an event */
onEventUpdated: PropTypes.func,
/** the callback functon which refresh the event list */
reloadEvents: PropTypes.func.isRequired,
/** callback function which reverse the sorting of events by date */
reverseEventsSortingByCreationDate: PropTypes.func.isRequired,
/** the user who is currently logged in */
user: PropTypes.object.isRequired,
/* the selected view to display the events in*/
view: PropTypes.string.isRequired,
}
export default EventList;
......@@ -12,6 +12,8 @@ class EventContentPanel extends React.Component {
constructor(props) {
super(props);
if (props.event) { this.eventId = props.event._id; }; //required for component will unmount in EDIT_EVENT_CONTEXT
this.storeToLocalStorage=this.storeToLocalStorage.bind(this);
}
render() {
let { event, context, investigationId, user, onEventModified } = this.props;
......@@ -73,7 +75,7 @@ class EventContentPanel extends React.Component {
* @param {string} content content data to store
* @param {string} contentFormat data format
*/
storeToLocalStorage = (context, content, contentFormat) => {
storeToLocalStorage(context, content, contentFormat) {
if (context && contentFormat) {
if (context === NEW_EVENT_CONTEXT) {
if (contentFormat === PLAINTEXT_CONTENT_FORMAT) {
......
......@@ -73,7 +73,7 @@ class HTMLEditor extends Component {
this.setEditingAreaHeight();
}
setEditingAreaHeight = () => {
setEditingAreaHeight() {
let panelPart = document.getElementById('refForEditorHeightCalculation');
let editorHeader = document.getElementsByClassName("mce-top-part mce-container mce-stack-layout-item mce-first")[0];
let iframe = this.props.text ? document.getElementById(EDITOR_ID_FOR_EDITION + '_ifr') : document.getElementById(EDITOR_ID_FOR_CREATION + '_ifr');
......
......@@ -60,7 +60,7 @@ class LabeledElement extends React.Component {
if (this.props.type === 'input') { this.props.onEventModified(); };
}
onChangeInputValue = (e) => {
onChangeInputValue(e) {
this.setState({ inputValue: e.target.value });
}
};
......
import React from 'react';
import PropTypes from 'prop-types';
import { getOriginalEvent, getEventIcon, getLastCommentContent, getEventCreationDate, getEventHistoryCreationDate, getContent } from '../../../helpers/EventHelpers'
import { getOriginalEvent, getEventIcon, getLastCommentContent, getContent } from '../../../helpers/EventHelpers'
import EventContentDisplayer from '../EventContentDisplayer';
import { ANNOTATION, NOTIFICATION, EDIT_MODE, DOC_VIEW, EDIT_EVENT_CONTEXT, BASIC_EVENT_CONTEXT } from '../../../constants/EventTypes';
import { OverlayTrigger, Tooltip, Dropdown, MenuItem } from 'react-bootstrap';
import { ANNOTATION, NOTIFICATION, DOC_VIEW } from '../../../constants/EventTypes';
......
......@@ -59,7 +59,7 @@ class EventList extends React.Component {
<tbody>
{this.getItems().map((event, index) => {
if (event.type === "date") {
return <tr key={index}><td style={{ borderTop: '1px solid #f2f2f2', textAlign: 'center', fontSize: '18px', fontWeight: 'bold' }} colSpan={3} ><a name={event.anchor}></a> {event.text}</td></tr>;
return <tr key={index}><td style={{ borderTop: '1px solid #f2f2f2', textAlign: 'center', fontSize: '18px', fontWeight: 'bold' }} colSpan={4} ><a name={event.anchor}></a> {event.text}</td></tr>;
}
return <Event key={index} event={event} onEventClicked={this.props.onEventClicked} ></Event>
})}
......
import React from 'react';
import { Well, Navbar, Nav, NavItem, MenuItem, DropdownButton, Radio } from 'react-bootstrap';
import { Well, Navbar, Nav, NavItem, MenuItem, Radio, NavDropdown, Checkbox } from 'react-bootstrap';
import EventListMenuButton from './EventListMenuButton';
import { getPDF } from '../../api/icat/icatPlus';
import { getPDF } from '../../../api/icat/icatPlus';
import { ComboSearch } from 'react-combo-search';
import PropTypes from 'prop-types';
import _ from 'lodash';
import { DOC_VIEW, LIST_VIEW, SORT_EVENTS_FROM_YOUNGEST, SORT_EVENTS_FROM_OLDEST, NEW_EVENT_VISIBLE } from '../../constants/EventTypes';
import { DOC_VIEW, LIST_VIEW, SORT_EVENTS_FROM_YOUNGEST, SORT_EVENTS_FROM_OLDEST, NEW_EVENT_VISIBLE } from '../../../constants/EventTypes';
import NewlyAvailableEventsDialogue from './NewlyAvailableEventsDialogue';
// styles
require('./react-datetime.css');
require('./react-combo-select.css');
require('./react-combo-search.css');
require('./eventListMenu.css');
/**
* The menu displayed above the event list
*/
......@@ -22,6 +23,12 @@ class EventListMenu extends React.Component {
this.state = {
isNavbarExpanded: false
};
this.getSelectPickerData = this.getSelectPickerData.bind(this);
this.onSelectNavbar = this.onSelectNavbar.bind(this);
this.onToggleNavbar = this.onToggleNavbar.bind(this);
this.onSearch = this.onSearch.bind(this);
this.sortByDate = this.sortByDate.bind(this);
}
render() {
......@@ -40,14 +47,13 @@ class EventListMenu extends React.Component {
return sortingFilter.createdAt;
}
}
return (
<Navbar
fluid
expanded={this.state.isNavbarExpanded}
onSelect={this.onSelectNavbar}
onToggle={this.onToggleNavbar}
style={{ background: 'none', border: 'none', WebkitBoxShadow: 'none', boxShadow: 'none', position: 'sticky', top: '0px', backgroundColor:'white' }}>
style={{ background: 'none', border: 'none', WebkitBoxShadow: 'none', boxShadow: 'none', position: 'sticky', top: '0px', backgroundColor: 'white' }}>
<Navbar.Header>
<Navbar.Toggle />
......@@ -64,21 +70,23 @@ class EventListMenu extends React.Component {
<Navbar.Collapse>
<Nav>
<NavItem eventKey={2} href="#" className="logbookNavItem" >
<DropdownButton onClick={(e) => { e.stopPropagation() }}
bsStyle={'primary'}
title={'View'}
bsSize='small'>
<MenuItem eventKey="1" onSelect={() => setView(DOC_VIEW)} > {view === DOC_VIEW ? <Radio checked> Classic (user logs)</Radio> : <Radio checked={false}> Classic (user logs)</Radio>} </MenuItem>
<MenuItem eventKey="2" onSelect={() => setView(LIST_VIEW)} > {view === LIST_VIEW ? <Radio checked> Full (all logs)</Radio> : <Radio checked={false}> Full (all logs)</Radio>} </MenuItem>
<MenuItem divider />
<MenuItem eventKey="3" onSelect={() => this.sortByDate(SORT_EVENTS_FROM_OLDEST)} > {getCurrentlyPressedSortButton() === SORT_EVENTS_FROM_OLDEST ? <Radio checked> Oldest log on top</Radio> : <Radio checked={false}> Oldest log on top</Radio>} </MenuItem>
<MenuItem eventKey="4" onSelect={() => this.sortByDate(SORT_EVENTS_FROM_YOUNGEST)} > {getCurrentlyPressedSortButton() === SORT_EVENTS_FROM_YOUNGEST ? <Radio checked> Latest log on top</Radio> : <Radio checked={false}> Latest log on top</Radio>} </MenuItem>
</DropdownButton>
</NavItem>
<NavItem eventKey={3} href={getPDF(sessionId, investigationId, selectionFilter)} target='_blank' className="logbookNavItem" >
<NavDropdown eventKey={3} title={<div className='btn btn-sm btn-primary'> View <span className='caret'></span></div>} id="nav-dropdown" className="logbookNavItem">
<MenuItem eventKey={3.1} onSelect={() => setView(DOC_VIEW)} > {view === DOC_VIEW ? <Radio checked readOnly> Classic (user's commented logs)</Radio> : <Radio checked={false} readOnly> Classic (user's commented logs)</Radio>} </MenuItem>
<MenuItem eventKey={3.2} onSelect={() => setView(LIST_VIEW)} > {view === LIST_VIEW ? <Radio checked readOnly> Full (all logs)</Radio> : <Radio checked={false} readOnly> Full (all logs)</Radio>} </MenuItem>
<MenuItem divider />
<MenuItem eventKey={3.3} onSelect={() => this.sortByDate(SORT_EVENTS_FROM_OLDEST)} > {getCurrentlyPressedSortButton() === SORT_EVENTS_FROM_OLDEST ? <Radio checked readOnly> Oldest log on top</Radio> : <Radio checked={false} readOnly> Oldest log on top</Radio>} </MenuItem>
<MenuItem eventKey={3.4} onSelect={() => this.sortByDate(SORT_EVENTS_FROM_YOUNGEST)} > {getCurrentlyPressedSortButton() === SORT_EVENTS_FROM_YOUNGEST ? <Radio checked readOnly> Latest log on top</Radio> : <Radio checked={false} readOnly> Latest log on top</Radio>} </MenuItem>
<MenuItem divider />
<MenuItem eventKey={3.5} onSelect={() => this.props.setEventListAutorefresh(!this.props.isEventListAutorefreshEnabled)}>
<Checkbox checked={this.props.isEventListAutorefreshEnabled} readOnly > Refresh logs automatically</Checkbox>
</MenuItem>
</NavDropdown>
<NavItem eventKey={4} href={getPDF(sessionId, investigationId, selectionFilter)} target='_blank' className="logbookNavItem" >
<EventListMenuButton text='PDF' glyph='download' tooltipText='Download as PDF' isEnabled={!(isNewEventVisible === undefined || isNewEventVisible === true || numberOfMatchingEventsFound === 0)} />
</NavItem>
<NavItem eventKey={5} className="logbookNavItem">
<NewlyAvailableEventsDialogue isEventListAutorefreshEnabled={this.props.isEventListAutorefreshEnabled} latestEvents={this.props.periodicdata} eventCountSinceLastRefresh={this.props.eventCountSinceLastRefresh} onIconClicked={this.props.getEvents} />
</NavItem>
</Nav>
<Nav pullRight>
......@@ -109,7 +117,7 @@ class EventListMenu extends React.Component {
);
}
getSelectPickerData = () => {
getSelectPickerData() {
let selectPickerData = { category: ['Info', 'Error', 'Command', 'Comment', 'Debug'] };
if (this.props.availableTags) {
......@@ -121,7 +129,7 @@ class EventListMenu extends React.Component {
/**
* Callback triggered when the user clicks the button to expand the navbar in mobile layout
*/
onToggleNavbar = () => {
onToggleNavbar() {
this.setState({ isNavbarExpanded: !this.state.isNavbarExpanded });
}
......@@ -129,17 +137,17 @@ class EventListMenu extends React.Component {
* Callback triggered when the user clicks an element of the navbar.
* @param {*} eventKey key of the element
*/
onSelectNavbar = (eventKey) => {
onSelectNavbar(eventKey) {
if (eventKey != 6) {
this.onToggleNavbar();
}
}
onSearch = (data) => {
onSearch(data) {
return this.props.searchEvents(data);
}
sortByDate = (sortingOrder) => {
sortByDate(sortingOrder) {
if (sortingOrder && this.props.sortingFilter.createdAt !== sortingOrder) {
//this.setState({ sortingOrder: sortingOrder })
this.props.reverseEventsSortingByCreationDate();
......
......@@ -7,12 +7,14 @@ class EventListMenuButton extends React.Component {
render() {
let { isEnabled, text, glyph, tooltipText } = this.props;
if (isEnabled === false) {
return (<Button bsSize="small" bsStyle="primary" disabled > <Glyphicon glyph={glyph} />{text} </Button>);
//return (<Button bsSize="small" bsStyle="primary" disabled > <Glyphicon glyph={glyph} />{text} </Button>);
return (<div className='btn btn-sm btn-primary'> <Glyphicon glyph={glyph} />{text} </div>);
}
// default behavior
return (<OverlayTrigger placement="bottom" overlay={<Tooltip id="tooltip"> {tooltipText} </Tooltip>}>
<Button bsSize="small" bsStyle="primary" disabled={false} > <Glyphicon glyph={glyph} /> {text} </Button>
{/* <Button bsSize="small" bsStyle="primary" disabled={false} > <Glyphicon glyph={glyph} /> {text} </Button> */}
<div className='btn btn-sm btn-primary'> <Glyphicon glyph={glyph} /> {text} </div>
</OverlayTrigger>
)
}
......
import React from 'react';
import PropTypes from 'prop-types';
import { Glyphicon } from 'react-bootstrap';
class NewlyAvailableEventsDialogue extends React.Component {
render() {
if (this.props.isEventListAutorefreshEnabled === true) {
return <div className='btn btn-sm' style={{ color: '#888888' }}> Auto refreshing ...</div>
}
else {
let { eventCountSinceLastRefresh, onIconClicked, latestEvents } = this.props;
let newEventCountSinceLastRefresh = 0;
if (latestEvents && latestEvents.data && eventCountSinceLastRefresh != undefined) {
newEventCountSinceLastRefresh = (latestEvents.data.length < eventCountSinceLastRefresh) ? 0 : latestEvents.data.length - eventCountSinceLastRefresh
}
if (newEventCountSinceLastRefresh > 0) {
return (<div className='btn btn-sm' style={{ color: '#888888' }}> {newEventCountSinceLastRefresh
} new log(s) arrived. <Glyphicon onClick={onIconClicked} glyph='refresh' /> </div>)
}
return null;
}
}
}
export default NewlyAvailableEventsDialogue;
NewlyAvailableEventsDialogue.proptype = {
/* Total number of event in the logbook known by the client since the last refresh of the event list */
eventCountSinceLastRefresh: PropTypes.number,
/* Callback function triggered which the user clicks the icon*/
onIconClicked: PropTypes.func,
/* Latest events of the logbook. Array is in latestEvents.data */
latestEvents: PropTypes.object
}
\ No newline at end of file
/* this hides the caret in the navdropdown used in the EventListMenu */
.logbookNavItem.dropdown>a>span {
display: none
}
\ No newline at end of file
......@@ -23,6 +23,16 @@ class NewOrEditEventPanel extends React.Component {
isEditorContentValid: false,
optionPanelDecollaped: false
}
this.createEvent = this.createEvent.bind(this);
this.onCancelButtonClicked = this.onCancelButtonClicked.bind(this);
this.onEventModified = this.onEventModified.bind(this);
this.onSaveButtonClicked = this.onSaveButtonClicked.bind(this);
this.onSuccessfullyCreated = this.onSuccessfullyCreated.bind(this);
this.onSuccessfullyUpdated = this.onSuccessfullyUpdated.bind(this);
this.setTagContainer = this.setTagContainer.bind(this);
this.setTitleInput = this.setTitleInput.bind(this);
this.updateEvent = this.updateEvent.bind(this);
}
render() {
let { event, user, context, investigationId } = this.props;
......@@ -104,7 +114,7 @@ class NewOrEditEventPanel extends React.Component {
* -1- hasText boolean which indicates whether the editor content has text or not; not null
* -2- currentTextEqualsOriginal, boolean, which indicates whether the current content is the same as the original content; not null
*/
onEventModified = (change) => {
onEventModified(change) {
let hasEventTitleChangedFromItsOriginalValue = this.inputTitle && this.props.event && this.inputTitle.props.value !== this.props.event.title;
let hasEventTagsChangedFromItsOriginalValue = this.tagContainer && this.props.event &&
......@@ -153,7 +163,7 @@ class NewOrEditEventPanel extends React.Component {
/**
* Callback function triggered when the user clicks on the cancel button
*/
onCancelButtonClicked = () => {
onCancelButtonClicked() {
if (this.props.context) {
if (this.props.context === NEW_EVENT_CONTEXT) {
localStorage.removeItem('plainText');
......@@ -169,7 +179,7 @@ class NewOrEditEventPanel extends React.Component {
/**
* Callback function triggered when the user click the save button while an event is being created or updated.
*/
onSaveButtonClicked = () => {
onSaveButtonClicked() {
if (this.props.context) {
if (this.props.context === NEW_EVENT_CONTEXT) {
this.createEvent();
......@@ -182,14 +192,14 @@ class NewOrEditEventPanel extends React.Component {
/**
* Callback triggered when the event has been successfully created on the server side
*/
onSuccessfullyCreated = () => {
onSuccessfullyCreated() {
this.props.onNewEventUploaded();
}
/**
* Callback triggered when the event has been successfully updated on the server side
*/
onSuccessfullyUpdated = (updatedEvent) => {
onSuccessfullyUpdated(updatedEvent) {
this.props.onEventUpdated(updatedEvent);
}
......@@ -197,19 +207,19 @@ class NewOrEditEventPanel extends React.Component {
/**
* Callback function used to set the tagcontainer instance to a class instance variable in order to access data stored within the tag container
*/
setTagContainer = (element) => {
setTagContainer(element) {
this.tagContainer = element;
}
/** Callback function used to set the titleInput instance to a class instance variable inorder to access data stored within the title input */
setTitleInput = (element) => {
setTitleInput(element) {
this.inputTitle = element;
}
/**
* Creates an event. It's a request to the server which may fail.
*/
createEvent = () => {
createEvent() {
let currentTagIds = this.tagContainer.state.selectedTags.map((tag) => tag._id);
let newEvent = {
......@@ -232,7 +242,7 @@ class NewOrEditEventPanel extends React.Component {
/**
* Updates an event. It's a request to the server which may fail.
*/
updateEvent = () => {
updateEvent() {
let { investigationId, event, user } = this.props;
// get tags
......@@ -258,7 +268,7 @@ class NewOrEditEventPanel extends React.Component {
NewOrEditEventPanel.propTypes = {
/* context in which this component is used */
context: PropTypes.oneOf({ NEW_EVENT_CONTEXT, EDIT_EVENT_CONTEXT }),
context: PropTypes.oneOf([ NEW_EVENT_CONTEXT, EDIT_EVENT_CONTEXT ]),
/* event to edit. Null when a new event is beaing created. */
event: PropTypes.object,
/* investigation identifier */
......
......@@ -12,6 +12,9 @@ class OverlayBox extends React.Component {
this.state = {
isChildComponentVisible: false
};
this.onEntered = this.onEntered.bind(this);
this.onExited = this.onExited.bind(this);
}
render() {
......@@ -31,7 +34,7 @@ class OverlayBox extends React.Component {
}
/** Callback triggered when the overlay box is opened. */
onEntered = () => {
onEntered() {
/** this is a trick to circumvent a bug with tinymce in modals. the modal needs to be displayed first and tinymce shown afterwards otherwise a bug occurs in tinymce. */
let timer = setTimeout(() => { this.setState({ isChildComponentVisible: true }) }, 100);
}
......@@ -39,7 +42,7 @@ class OverlayBox extends React.Component {
/**
* Callback triggered when the modal is close. This happends when props.open becomes false
*/
onExited = () => {
onExited() {
this.setState({ isChildComponentVisible: false })
}
}
......
import React from 'react';
import PropTypes from 'prop-types';
import { ButtonToolbar, Grid, Row, Col } from 'react-bootstrap';
import EventListMenuButton from '../EventListMenuButton';
import EventListMenuButton from '../Menu/EventListMenuButton';
/**
* The menu displayed above the tag list
......
import React from 'react';
import OverlayBox from '../OverlayBox';
class availableEventsDialogue extends React.Component {
render() {
return (<span style={{ color: '#888888' }}>
{this.props.newlyArrivedEventCount ? this.props.newlyArrivedEventCount : 0} new logs available.
</span>)
}
}
export default availableEventsDialogue;
\ No newline at end of file
......@@ -329,6 +329,24 @@ div.collapsedEventPanel-heading:hover {
right: 10px;
}
.autoRefreshOverlayClass {
background-color: transparent;
top: 0px;
height: 100px;
width: 200px;
left: unset;
padding-right: 0px;
}
.autoRefreshModalClass {
max-width: unset;
margin: unset;
width: 100%;
height: 100%;
padding: unset;
}
/* TinyMCE editor */
#editorContainer .mce-tinymce, #editorContainer .mce-tinymce .mce-container-body {
......
......@@ -34,6 +34,12 @@ export function GUI_CONFIG() {
DUAL_EDITOR_MAX_HEIGHT: "270px",
/* Default tag color used in the logbook when tag color is not set */
DEFAULT_TAG_COLOR: "#a6bded"
DEFAULT_TAG_COLOR: "#a6bded",
/* Activate the periodic refresh. So periodic http requests are performed*/
AUTOREFRESH_ENABLED: true,
/* Whether event list refreshed automatically or not by default. */
AUTOREFRESH_EVENTLIST: false,
/* the delay between 2 refreshments of event list. (in milliseconds)*/
AUTOREFRESH_DELAY: 30000,
}
}
\ No newline at end of file
......@@ -2,7 +2,7 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types'
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { Grid, Row, Col, Tab, Glyphicon, Badge, Nav, NavItem } from 'react-bootstrap';