Funders page (xchem#102)

* Funders page (#35)

js/components/errorReport.js

@@ -4,8 +4,7 @@
 import React from "react";
 import {connect} from "react-redux";
 import {Button} from "react-bootstrap";
-import { showReportDialog } from '@sentry/browser';
-
+// import { showReportDialog } from '@sentry/browser';
 
 export class ErrorReport extends React.Component {
     constructor(props) {
@@ -25,10 +24,8 @@ export class ErrorReport extends React.Component {
 
 function mapStateToProps(state) {
   return {
-
   }
 }
 const mapDispatchToProps = {
-
 }
 export default connect(mapStateToProps, mapDispatchToProps)(ErrorReport);

js/components/header.js

@@ -3,7 +3,7 @@
  */
 
 import React from "react";
-import {Navbar, Nav, NavItem} from "react-bootstrap";
+import {Navbar, Nav, NavItem, Row} from "react-bootstrap";
 import {connect} from "react-redux";
 import * as nglObjectTypes from "../components/nglObjectTypes";
 import {withRouter} from "react-router-dom";
@@ -20,6 +20,7 @@ class Header extends React.Component {
         this.openXchem = this.openXchem.bind(this);
         this.openDiamond = this.openDiamond.bind(this);
         this.openSgc = this.openSgc.bind(this);
+        this.showFunders = this.showFunders.bind(this);
     }
 
     getViewUrl(pk, get_view) {
@@ -66,6 +67,10 @@ class Header extends React.Component {
         window.location.href = 'https://www.sgc.ox.ac.uk/'
     }
 
+    showFunders() {
+        window.location.href = "/viewer/react/funders"
+    }
+
     render() {
         var landing = "/viewer/react/landing";
         var login = "/accounts/login"
@@ -86,9 +91,7 @@ class Header extends React.Component {
         return <Navbar>
             <Navbar.Header>
                 <Navbar.Brand>
-                    <h4>
-                        <a href={landing}>FragalysisHome</a>
-                    </h4>
+                        <h4><a href={landing}>FragalysisHome</a></h4>
                 </Navbar.Brand>
             </Navbar.Header>
             <Nav pullLeft>
@@ -99,10 +102,15 @@ class Header extends React.Component {
             </Nav>
             <Nav pullRight>
                 <NavItem>
-                    <img src={require('../img/xchemLogo.png')} width="67" height="31" onClick={this.openXchem}/>
-                    <img src={require('../img/dlsLogo.png')} width="100" height="31" onClick={this.openDiamond}/>
-                    <img src={require('../img/sgcLogo.png')} width="65" height="31" onClick={this.openSgc}/>
-                    <ErrorReport/>
+                    <Row>
+                        <img src={require('../img/xchemLogo.png')} width="67" height="31" onClick={this.openXchem}/>
+                        <img src={require('../img/dlsLogo.png')} width="100" height="31" onClick={this.openDiamond}/>
+                        <img src={require('../img/sgcLogo.png')} width="65" height="31" onClick={this.openSgc}/>
+                        <ErrorReport/>
+                    </Row>
+                    <Row>
+                        <p onClick={this.showFunders}>Supported by...</p>
+                    </Row>
                 </NavItem>
             </Nav>
             <TargetList key="TARGLIST" render={false}/>

js/components/modalStateSave.js

@@ -85,7 +85,7 @@ export class ModalStateSave extends Component {
                 <ReactModal isOpen={this.props.savingState.startsWith("saving") || this.props.savingState.startsWith("overwriting")} style={customStyles}>
                     <Row>
                         <strong>
-                            {information} be viewed <a href={urlToCopy}>here.</a>
+                            {information}<a href={urlToCopy}>here.</a>
                         </strong>
                     </Row>
                     <Row>

js/components/sessionManagement.js

@@ -220,9 +220,7 @@ export class SessionManagement extends React.Component {
 
     render() {
         const {pathname} = this.props.location;
-        var urlToCopy = "testing";
         if (this.props.latestSession != undefined) {
-            urlToCopy = window.location.protocol + "//" + window.location.hostname + "/viewer/react/fragglebox/" + this.props.latestSession.slice(1, -1);
         }
         var buttons = "";
         if (pathname != "/viewer/react/landing") {

js/components/switches.js

@@ -8,6 +8,7 @@ import {ErrorView} from "./errorComponent";
 import Tindspect from "../containers/tindspectHolder";
 import FraggleBox from "../containers/fraggleBoxHolder";
 import Preview from "../containers/previewHolder";
+import Funders from "../containers/funders";
 import Landing from "../containers/landingHolder";
 import {Route, Switch} from "react-router-dom";
 
@@ -17,6 +18,7 @@ class Switches extends Component {
             <Header></Header>
             <ErrorView></ErrorView>
             <Switch>
+                <Route exact path="/viewer/react/funders" component={Funders}/>
                 <Route exact path="/viewer/react/landing" component={Landing}/>
                 <Route exact path="/viewer/react/preview" component={Preview}/>
                 <Route exact path="/viewer/react/preview/target/:target" component={Preview}/>

js/containers/funders.js

@@ -0,0 +1,89 @@
+/**
+ * Created by ricgillams on 23/10/2018.
+ */
+import React, {Component} from "react";
+import {connect} from "react-redux";
+import {Row, Col, Grid} from "react-bootstrap";
+
+class Funders extends Component {
+
+    constructor(props) {
+        super(props)
+        this.openXchem = this.openXchem.bind(this);
+        this.openDls = this.openDls.bind(this);
+        this.openSgc = this.openSgc.bind(this);
+        this.openInext = this.openInext.bind(this);
+        this.openJff = this.openJff.bind(this);
+        this.openNf = this.openNf.bind(this);
+    }
+
+    openXchem() {window.location.href = 'https://www.diamond.ac.uk/Instruments/Mx/Fragment-Screening.html'}
+    openDls() {window.location.href = 'https://www.diamond.ac.uk/Home.html'}
+    openSgc() {window.location.href = 'https://www.sgc.ox.ac.uk/'}
+    openInext() {window.location.href = 'http://www.inext-eu.org/'}
+    openJff() {window.location.href = 'https://researchsupport.admin.ox.ac.uk/funding/internal/jff'}
+    openNf() {window.location.href = 'https://www.newtonfund.ac.uk/'}
+    openMrc() {window.location.href = 'https://mrc.ukri.org/'}
+    openWt() {window.location.href = 'https://wellcome.ac.uk/'}
+
+    render() {
+        var rowHeight = window.innerHeight * 0.25.toString() + "px";
+
+        return (
+            <div>
+                <Grid fluid>
+                    <Row>
+                        <h1></h1>
+                    </Row>
+                    <Row>
+                        <Col xs={4} md={4}>
+                            <img src={require('../img/xchemLogo.png')} width="170" height="75" onClick={this.openXchem}/>
+                        </Col>
+                        <Col xs={4} md={4}>
+                            <img src={require('../img/dlsLogo.png')} width="200" height="63" onClick={this.openDls}/>
+                        </Col>
+                        <Col xs={4} md={4} className="pull-right">
+                            <img src={require('../img/sgcLogo.png')} width="209" height="99" onClick={this.openSgc}/>
+                        </Col>
+                    </Row>
+                    <Row>
+                        <h1></h1>
+                    </Row>
+                    <Row>
+                        <Col xs={2} md={2}>
+                        </Col>
+                        <Col xs={4} md={4}>
+                            <img src={require('../img/mrcLogo.png')} width="213" height="94" onClick={this.openMrc}/>
+                        </Col>
+                        <Col xs={4} md={4}>
+                            <img src={require('../img/wtLogo.png')} width="176" height="55" onClick={this.openWt}/>
+                        </Col>
+                        <Col xs={2} md={2}>
+                        </Col>
+                    </Row>
+                    <Row>
+                        <h1></h1>
+                    </Row>
+                    <Row>
+                        <Col xs={4} md={4}>
+                            <img src={require('../img/inextLogo.png')} width="135" height="90"
+                                 onClick={this.openInext}/>
+                        </Col>
+                        <Col xs={4} md={4}>
+                            <img src={require('../img/jffLogo.jpg')} width="175" height="82" onClick={this.openJff}/>
+                        </Col>
+                        <Col xs={4} md={4} className="pull-right">
+                            <img src={require('../img/nfLogo.png')} width="176" height="71" onClick={this.openNf}/>
+                        </Col>
+                    </Row>
+                </Grid>
+            </div>
+        )
+    }
+}
+
+function mapStateToProps(state) {
+  return { }
+}
+
+export default connect(mapStateToProps)(Funders)