Skip to content

Commit

Permalink
Merge pull request #50 from kirstenwinther/master
Browse files Browse the repository at this point in the history 
Show additional calc info and improve loading speed
  • Loading branch information
@kirstenwinther
kirstenwinther authored Mar 25, 2019
2 parents 3ee540f + 086233d commit caf8177
Show file tree
Hide file tree
Showing 9 changed files with 118 additions and 166 deletions.
5 changes: 3 additions & 2 deletions app/components/About/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,17 +47,18 @@ class About extends React.Component { // eslint-disable-line react/prefer-statel

<Paper className={this.props.classes.paper}>
<h2>License</h2>
<img src={ccLogoBig} alt="ccLogoBig" />
<div className={this.props.classes.text}>
Except where otherwise noted, content on Catalysis-Hub is licensed under a
{' '}
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>
.
</div>
<img src={ccLogoBig} alt="ccLogoBig" />
</Paper>

<Paper className={this.props.classes.paper}>
<h2>People</h2>
<h2>People and Contact</h2>
<div>The platform is developed at the SUNCAT Center for Interface Science and Catalysis, SLAC National Accelerator Laboratory, Stanford University. Contact information for the primary people involved is provided below. For technical support please contact postdoc Kirsten Winther at winther@stanford.edu.</div>
<ul className={this.props.classes.peopleList}>
{Object.keys(people).map((name, i) => (
<li key={`person_${i}`}>
Expand Down
14 changes: 11 additions & 3 deletions app/components/Apps/filteredApps.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,17 @@ class FilteredApps extends React.Component { // eslint-disable-line react/prefer
elevation={0}
>
<Tooltip title={app.tooltip} placement="top">
<h3>
{getAppIcon(app.title)}
{'\u00A0'}{app.title}</h3>
{(app.title === 'Activity Maps' || app.title === 'Scaling Relations' || app.title === 'Pourbaix Diagrams') ?
<h3>
{getAppIcon(app.title)}
{'\u00A0'}{app.title}{' (Beta) '}
</h3>
:
<h3>
{getAppIcon(app.title)}
{'\u00A0'}{app.title}
</h3>
}
</Tooltip>
<div className={this.props.classes.appHint}>{app.tooltip} <MdChevronRight /></div>
</Paper>
Expand Down
136 changes: 34 additions & 102 deletions app/components/Publications/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,115 +82,48 @@ class Publications extends React.Component { // eslint-disable-line react/prefer
this.clickPublication = this.clickPublication.bind(this);
this.loadPreviewCif = this.loadPreviewCif.bind(this);
this.backToList = this.backToList.bind(this);

if (_.get(props, 'routeParams.pubId', '') !== '') {
const publicationQuery = {
ttl: 300,
query: `{publications(pubId: "${this.state.pubId}") {
edges {
node {
id
pubId
title
authors
pages
volume
journal
doi
pubtextsearch
}
}
}}` };

axios(newGraphQLRoot,
{
method: 'post',
data: publicationQuery,
}).then((response) => {
this.setState({
reference: _.get(response,
'data.data.publications.edges[0].node',
{}),
});
});
}
}
componentDidMount() {
const mtimeQuery = `{systems(first:50, keyValuePairs: "~", jsonkey: "pub_id", distinct: true) {
totalCount
edges {
node {
keyValuePairs
mtime
}
}
}}`;
const yearQuery = '{publications { edges { node { year } } }}';
axios.post(newGraphQLRoot, {
query: mtimeQuery,
query: yearQuery,
})
.then((mtimeResponse) => {
const mtimes = mtimeResponse.data.data.systems.edges.map((n) => (n.node.mtime));
const sortedMtimes = mtimes.slice().sort((a, b) => b - a);
const systemPubIds = mtimeResponse.data.data.systems.edges.map((n) => (JSON.parse(n.node.keyValuePairs).pub_id));
let orderedPubIds = sortedMtimes.map((sortedMtime) => systemPubIds[mtimes.indexOf(sortedMtime)]);
orderedPubIds = Array.from(new Set(orderedPubIds));
const yearQuery = '{publications { edges { node { year } } }}';
axios.post(newGraphQLRoot, {
query: yearQuery,
})
.then((response) => {
let years = response.data.data.publications.edges.map((n) => n.node.year);
years = [...new Set(years)].sort().reverse().filter((x) => x !== null);
this.setState({
years,
});
years.map((year) => {
const query = `{publications (year: ${year}) { edges { node { doi title year authors journal pages pubId pubtextsearch } } }}`;
return axios.post(newGraphQLRoot, {
query,
})
.then((yearResponse) => {
let references = yearResponse.data.data.publications.edges
.then((response) => {
let years = response.data.data.publications.edges.map((n) => n.node.year);
years = [...new Set(years)].sort().reverse().filter((x) => x !== null);
this.setState({
years,
});
years.map((year) => {
const query = `{publications (year: ${year}, order: "-stime") { edges { node { doi title year authors journal volume number pages pubId pubtextsearch } } }}`;
return axios.post(newGraphQLRoot, {
query,
})
.then((yearResponse) => {
let references = yearResponse.data.data.publications.edges
.map((n) => (n.node));
references = [...new Set(references)];
const dois = yearResponse.data.data.publications.edges.map((n) => (n.node.doi));
const titles = yearResponse.data.data.publications.edges.map((n) => (n.node.title));
const pubIds = yearResponse.data.data.publications.edges.map((n) => (n.node.pubId));
const pubIndices = [];
orderedPubIds.map((orderedPubId) => {
if (pubIds.includes(orderedPubId)) {
pubIndices.push(pubIds.indexOf(orderedPubId));
}
return pubIndices;
});
pubIds.map((pubId, index) => {
if (!orderedPubIds.includes(pubId)) {
pubIndices.push(index);
}
return pubIndices;
});
const allReferences = this.state.references;
const allDois = this.state.dois;
const allTitles = this.state.titles;
const allPubIds = this.state.pubIds;
references = [...new Set(references)];
const dois = yearResponse.data.data.publications.edges.map((n) => (n.node.doi));
const titles = yearResponse.data.data.publications.edges.map((n) => (n.node.title));

allReferences[year] = pubIndices.map((p) => references[p]);
allDois[year] = pubIndices.map((p) => dois[p]);
allTitles[year] = pubIndices.map((p) => titles[p]);
allPubIds[year] = pubIndices.map((p) => pubIds[p]);
const allReferences = this.state.references;
const allDois = this.state.dois;
const allTitles = this.state.titles;

this.setState({
references: allReferences,
dois: allDois,
titles: allTitles,
});
})
.catch(() => {
})
;
});
allReferences[year] = references;
allDois[year] = dois;
allTitles[year] = titles;

this.setState({
references: allReferences,
dois: allDois,
titles: allTitles,
});
})
.catch(() => {
});
});
});
});
}
backToList() {
this.setState({
Expand Down Expand Up @@ -391,7 +324,6 @@ totalCount
if (!notFound.every((x) => x)) {
return null;
}

if (this.state.titles[year][j] !== null) {
return (

Expand Down
33 changes: 29 additions & 4 deletions app/components/SingleStructureView/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
} from 'utils/functions';

import GeometryCanvasWithOptions from 'components/GeometryCanvasWithOptions';
import GraphQlbutton from 'components/GraphQlbutton';

const initialState = {
Formula: '',
Expand All @@ -39,10 +40,31 @@ class SingleStructureView extends React.Component { // eslint-disable-line react
constructor(props) {
super(props);
this.state = initialState;
this.state.printquery = `query{systems( uniqueId: "${this.props.selectedSystem.aseId}" ) {
edges {
node {
Formula
energy
numbers
initialMagmoms
magmoms
magmom
charges
momenta
calculator
keyValuePairs
calculatorParameters
publication {
title
authors
doi
}
}
}
}}`;
}
render() {
const energy = this.props.selectedSystem.energy || this.state.energy || 0.0;

let x;
let y;
let z;
Expand Down Expand Up @@ -72,11 +94,11 @@ class SingleStructureView extends React.Component { // eslint-disable-line react
<ul style={{ width: '50%' }}>
<li>Formula: {this.props.selectedSystem.Formula}</li>
<li>DFT Total Energy: {energy.toFixed(2)} eV</li>
{this.props.selectedSystem.energyCorrection !== 0 &&
<li> Energy correction: {this.props.selectedSystem.energyCorrection}</li>
}
<li>DFT Code: {this.props.selectedSystem.DFTCode}</li>
<li>DFT Functional: {this.props.selectedSystem.DFTFunctional}</li>
{_.isEmpty(this.props.selectedSystem.calculatorParameters) ? null :
<li> DFT parameters: {this.props.selectedSystem.calculatorParameters}</li>
}
<li>Publication: {prettyPrintReference(this.props.selectedPublication)}</li>
<div>
{_.isEmpty(this.props.selectedPublication.doi) ? null :
Expand All @@ -98,6 +120,9 @@ class SingleStructureView extends React.Component { // eslint-disable-line react
View all reactions in dataset
</a>
</li>
<li>
Open <GraphQlbutton query={this.state.printquery} newSchema /> to view calculational details.
</li>
</ul>
</div>
}
Expand Down
3 changes: 2 additions & 1 deletion app/containers/EnergiesPage/Input.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -191,6 +191,7 @@ class EnergiesPageInput extends React.Component { // eslint-disable-line react/p
chemicalComposition
reactionSystems {
name
energyCorrection
aseId
}
}
Expand Down Expand Up @@ -273,7 +274,7 @@ class EnergiesPageInput extends React.Component { // eslint-disable-line react/p
<div> A quick guide: </div>
<ul>
<li> Leave fields blank if you {"don't"} want to impose any restrictions. </li>
<li> For the <b>Reactants</b> and <b>Product</b> fields, choose the chemical species taking part in the left- and/or right hand side of the chemical reaction respectively. The phase of the molecules and elements can also be specified, such that {"'CO2gas'"} refers to CO<sub>2</sub> in the gas phase, whereas {"'CO2*'"} refers to CO<sub>2</sub> adsorbed on the surface. </li>
<li> For the <b>Reactants</b> and <b>Products</b> fields, choose the chemical species taking part in the left- and/or right hand side of the chemical reaction respectively. The phase of the molecules and elements can also be specified, such that {"'CO2gas'"} refers to CO<sub>2</sub> in the gas phase, whereas {"'CO2*'"} refers to CO<sub>2</sub> adsorbed on the surface. </li>
<li> In the <b>Surface</b> field, enter the (reduced) chemical composition of the surface, or a sum of elements that must be present, such as {"'Ag+'"} or {"'Ag+Sr'"}. </li>
</ul>
</div>
Expand Down
18 changes: 11 additions & 7 deletions app/containers/EnergiesPage/MatchingReactions.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -129,13 +129,15 @@ class MatchingReactions extends React.Component { // eslint-disable-line react/p
loading: true,
});
this.props.saveLoading(true);
let catappIds;
let catappNames;
let cathubIds;
let cathubNames;
let catenergyCorrections;
if (typeof reaction.reactionSystems !== 'undefined' && reaction.reactionSystems !== null) {
catappIds = (reaction.reactionSystems.map((x) => x.aseId));
catappNames = (reaction.reactionSystems.map((x) => x.name));
cathubIds = (reaction.reactionSystems.map((x) => x.aseId));
cathubNames = (reaction.reactionSystems.map((x) => x.name));
catenergyCorrections = (reaction.reactionSystems.map((x) => x.energyCorrection));
} else {
catappIds = {};
cathubIds = {};
snackbarActions.open('Scroll down for detailed structure.');
}

Expand All @@ -160,9 +162,10 @@ class MatchingReactions extends React.Component { // eslint-disable-line react/p
});

this.props.clearSystems();
catappIds.map((key, index) => {
cathubIds.map((key, index) => {
let aseId = key;
const name = catappNames[index];
const name = cathubNames[index];
const energyCorrection = catenergyCorrections[index];
if (typeof aseId === 'object') {
aseId = aseId[1];
}
Expand All @@ -189,6 +192,7 @@ class MatchingReactions extends React.Component { // eslint-disable-line react/p
node.Facet = reaction.facet;
node.publication = this.props.publication;
node.aseId = aseId;
node.energyCorrection = energyCorrection;
node.key = name;
node.full_key = node.Formula;
const ads = name.replace('star', ' @');
Expand Down
Loading

0 comments on commit caf8177

Please sign in to comment.