Create about page

[jonrkarr]

For now, create a page with minimal content and styling consistent with the search results page

Content

• Paragraph about purpose
• Link to source code
• List of people who developed Datanator
• Link to MIT license
• Acknowledgements
  • Datanator was developed with support from the Center for Reproducible Biomodeling Modeling from the National Institute of Bioimaging and Bioengineering and the National Institute of General Medical Sciences of the National Institutes of Health and the National Science Foundation (award P41EB023912).

Examples

• https://crbm-viz.herokuapp.com/about
• https://www.bpforms.org/#about

[yosefdroth]

how is this? http://datanator.info/about/

[jonrkarr]

The page fails to load. I only see a spinner due to several errors.

xhr.js:172 GET http://api.datanator.info/ftx/text_search/num_of_index/?query_message=undefined&index=metabolites_meta&from_=0&size=10&fields=protein_name&fields=synonyms&fields=enzymes&fields=ko_name&fields=gene_name&fields=name&fields=enzyme_name&fields=product_names&fields=substrate_names&fields=enzymes.subunit.canonical_sequence&fields=species 503 (Service Unavailable)
(anonymous) @ xhr.js:172
e.exports @ xhr.js:11
e.exports @ dispatchRequest.js:57
Promise.then (async)
l.request @ Axios.js:53
n.forEach.l.<computed> @ Axios.js:68
(anonymous) @ bind.js:9
ae @ MongoApi.js:10
value @ AboutPage.js:122
value @ AboutPage.js:88
zl @ react-dom.production.min.js:251
t.unstable_runWithPriority @ scheduler.production.min.js:18
Xr @ react-dom.production.min.js:120
Nl @ react-dom.production.min.js:244
wl @ react-dom.production.min.js:223
vl @ react-dom.production.min.js:214
rc @ react-dom.production.min.js:279
(anonymous) @ react-dom.production.min.js:282
Ol @ react-dom.production.min.js:224
uc @ react-dom.production.min.js:282
render @ react-dom.production.min.js:286
525 @ index.js:73
a @ (index):1
386 @ main.0127a8c0.chunk.js:1
a @ (index):1
i @ (index):1
e @ (index):1
(anonymous) @ main.0127a8c0.chunk.js:1
(index):1 Access to XMLHttpRequest at 'http://api.datanator.info/ftx/text_search/num_of_index/?query_message=undefined&index=metabolites_meta&from_=0&size=10&fields=protein_name&fields=synonyms&fields=enzymes&fields=ko_name&fields=gene_name&fields=name&fields=enzyme_name&fields=product_names&fields=substrate_names&fields=enzymes.subunit.canonical_sequence&fields=species' from origin 'http://datanator.info' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
createError.js:16 Uncaught (in promise) Error: Network Error
    at e.exports (createError.js:16)
    at XMLHttpRequest.h.onerror (xhr.js:81)
e.exports @ createError.js:16
h.onerror @ xhr.js:81
error (async)
(anonymous) @ xhr.js:78
e.exports @ xhr.js:11
e.exports @ dispatchRequest.js:57
Promise.then (async)
l.request @ Axios.js:53
n.forEach.l.<computed> @ Axios.js:68
(anonymous) @ bind.js:9
ae @ MongoApi.js:10
value @ AboutPage.js:122
value @ AboutPage.js:88
zl @ react-dom.production.min.js:251
t.unstable_runWithPriority @ scheduler.production.min.js:18
Xr @ react-dom.production.min.js:120
Nl @ react-dom.production.min.js:244
wl @ react-dom.production.min.js:223
vl @ react-dom.production.min.js:214
rc @ react-dom.production.min.js:279
(anonymous) @ react-dom.production.min.js:282
Ol @ react-dom.production.min.js:224
uc @ react-dom.production.min.js:282
render @ react-dom.production.min.js:286
525 @ index.js:73
a @ (index):1
386 @ main.0127a8c0.chunk.js:1
a @ (index):1
i @ (index):1
e @ (index):1
(anonymous) @ main.0127a8c0.chunk.js:1
2xhr.js:172 GET http://api.datanator.info/ftx/text_search/num_of_index/?query_message=undefined&index=sabio_reaction_entries&from_=0&size=10&fields=protein_name&fields=synonyms&fields=enzymes&fields=ko_name&fields=gene_name&fields=name&fields=enzyme_name&fields=product_names&fields=substrate_names&fields=enzymes.subunit.canonical_sequence&fields=species 503 (Service Unavailable)
(anonymous) @ xhr.js:172
e.exports @ xhr.js:11
e.exports @ dispatchRequest.js:57
Promise.then (async)
l.request @ Axios.js:53
n.forEach.l.<computed> @ Axios.js:68
(anonymous) @ bind.js:9
ae @ MongoApi.js:10
value @ AboutPage.js:122
value @ AboutPage.js:89
zl @ react-dom.production.min.js:251
t.unstable_runWithPriority @ scheduler.production.min.js:18
Xr @ react-dom.production.min.js:120
Nl @ react-dom.production.min.js:244
wl @ react-dom.production.min.js:223
vl @ react-dom.production.min.js:214
rc @ react-dom.production.min.js:279
(anonymous) @ react-dom.production.min.js:282
Ol @ react-dom.production.min.js:224
uc @ react-dom.production.min.js:282
render @ react-dom.production.min.js:286
525 @ index.js:73
a @ (index):1
386 @ main.0127a8c0.chunk.js:1
a @ (index):1
i @ (index):1
e @ (index):1
(anonymous) @ main.0127a8c0.chunk.js:1
(index):1 Access to XMLHttpRequest at 'http://api.datanator.info/ftx/text_search/num_of_index/?query_message=undefined&index=sabio_reaction_entries&from_=0&size=10&fields=protein_name&fields=synonyms&fields=enzymes&fields=ko_name&fields=gene_name&fields=name&fields=enzyme_name&fields=product_names&fields=substrate_names&fields=enzymes.subunit.canonical_sequence&fields=species' from origin 'http://datanator.info' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
createError.js:16 Uncaught (in promise) Error: Network Error
    at e.exports (createError.js:16)
    at XMLHttpRequest.h.onerror (xhr.js:81)
e.exports @ createError.js:16
h.onerror @ xhr.js:81
error (async)
(anonymous) @ xhr.js:78
e.exports @ xhr.js:11
e.exports @ dispatchRequest.js:57
Promise.then (async)
l.request @ Axios.js:53
n.forEach.l.<computed> @ Axios.js:68
(anonymous) @ bind.js:9
ae @ MongoApi.js:10
value @ AboutPage.js:122
value @ AboutPage.js:89
zl @ react-dom.production.min.js:251
t.unstable_runWithPriority @ scheduler.production.min.js:18
Xr @ react-dom.production.min.js:120
Nl @ react-dom.production.min.js:244
wl @ react-dom.production.min.js:223
vl @ react-dom.production.min.js:214
rc @ react-dom.production.min.js:279
(anonymous) @ react-dom.production.min.js:282
Ol @ react-dom.production.min.js:224
uc @ react-dom.production.min.js:282
render @ react-dom.production.min.js:286
525 @ index.js:73
a @ (index):1
386 @ main.0127a8c0.chunk.js:1
a @ (index):1
i @ (index):1
e @ (index):1
(anonymous) @ main.0127a8c0.chunk.js:1
2xhr.js:172 GET http://api.datanator.info/ftx/text_search/protein_ranked_by_ko/?query_message=undefined&from_=0&size=10&fields=protein_name&fields=synonyms&fields=enzymes&fields=ko_name&fields=gene_name&fields=name&fields=enzymes.enzyme.enzyme_name&fields=enzymes.subunit.canonical_sequence&fields=species 503 (Service Unavailable)
(anonymous) @ xhr.js:172
e.exports @ xhr.js:11
e.exports @ dispatchRequest.js:57
Promise.then (async)
l.request @ Axios.js:53
n.forEach.l.<computed> @ Axios.js:68
(anonymous) @ bind.js:9
ae @ MongoApi.js:10
value @ AboutPage.js:122
value @ AboutPage.js:90
zl @ react-dom.production.min.js:251
t.unstable_runWithPriority @ scheduler.production.min.js:18
Xr @ react-dom.production.min.js:120
Nl @ react-dom.production.min.js:244
wl @ react-dom.production.min.js:223
vl @ react-dom.production.min.js:214
rc @ react-dom.production.min.js:279
(anonymous) @ react-dom.production.min.js:282
Ol @ react-dom.production.min.js:224
uc @ react-dom.production.min.js:282
render @ react-dom.production.min.js:286
525 @ index.js:73
a @ (index):1
386 @ main.0127a8c0.chunk.js:1
a @ (index):1
i @ (index):1
e @ (index):1
(anonymous) @ main.0127a8c0.chunk.js:1
(index):1 Access to XMLHttpRequest at 'http://api.datanator.info/ftx/text_search/protein_ranked_by_ko/?query_message=undefined&from_=0&size=10&fields=protein_name&fields=synonyms&fields=enzymes&fields=ko_name&fields=gene_name&fields=name&fields=enzymes.enzyme.enzyme_name&fields=enzymes.subunit.canonical_sequence&fields=species' from origin 'http://datanator.info' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
createError.js:16 Uncaught (in promise) Error: Network Error
    at e.exports (createError.js:16)
    at XMLHttpRequest.h.onerror (xhr.js:81)

[yosefdroth]

I have fixed this error. It should be finished deploying in about ten minutes. There seems to be an error with the Datanator backend at the moment, so part of the site may not work right now.

[jonrkarr]

• Style

  • Align the vertical position of the TOC and first section. This can be done by removing style="margin-top: 10px" from the div for the first section.
  • Vertically space the sections more. This can be done by removing style="margin-top: 10px" from the div for divs for the other sections because this css rule already exists. This applies a top margin of 2rem to all of the sections except for the first one (this is what :not(:first-child) does).

    .google.results>.MuiGrid-root>div:not(:first-child) { margin-top: 2rem; }

• Table of contents

  • Shorten "Source Code and License" to "Source Code" so it fits on one line.

• Purpose

  • Rename to "Motivation and Features"; the TOC could just say "Features".
  • Add link to whole-cell models -- https://wholecell.org.
  • Replace -- with —
  • Consider making "Datanator" standout by italicizing the word.
  • Split into 3 sections (see below)

  • Edits to text:

    <p>Systems biology aims to understand how genotype influences phenotype. Mechanistic models, such as <a href="https://www.wholecell.org" target="_blank">whole-cell models</a>, are a promising tool for understanding the molecular determinants of behavior. However, it is difficult to obtain the large and varied data needed for mechanistic modeling. Although substantial data is already publicly available, the data is difficult to obtain because it is scattered across numerous databases and publications and described with different identifiers, units, and formats. In addition, there are few tools for finding data that is relevant to modeling a specific cell in a specific environment. These barriers impede mechanistic modeling.</p>
    
    <p>To accelerate cell modeling, we developed <i>Datanator</i>, a toolkit for systematically discovering data for modeling a specific cell in a specific environment. <i>Datanator</i> includes an integrated database of genomic and biochemical data about several aspects of cells, this web application for searching the database for data relevant to specific cells, and a REST API and Python library for programmatically aggregating data for large models. The web application enables investigators to search for experimental measurements of biochemical parameters (e.g. metabolite concentration, reaction rate, etc.) relevant to a specific cell (taxon, cell type) in a specific environment (e.g., temperature, pH, growth media, etc.). For each search, this web application displays a filterable and sortable list of relevant experimental measurements aggregated from a range of sources.</p>

• Data

  • Move the first sentence of the last paragraph of Purpose to a separate section: "Data Types and Sources"

    <p>Currently, <i>Datanator</i> includes measured metabolite concentrations, protein abundances, and reaction rate parameters integrated from ECMDB, PAX-DB, SABIO-RK, and YMDB. We aim to continually incorporate additional data from additional sources.</p>

  • Add links to ECMDB, PAX-DB, etc.

• Searching

  • Move the second sentence of the last paragraph of Purpose to a separate section "Searching and Filtering for Data About Specific Cells"
  • Add more information about the searching/filtering. Outline the individual features:

    <p>To help investigators find data about specific cells in specific environments, <i>Datanator</i> provides multiple tools for searching and filtering the integrated database.</p>
    <ul>
    <li>Full text search: Users can use the search form on the home page to identify metabolites, proteins, and reactions that they would like information.</li>
    <li>Molecular similarity: Users can identify measurements of similar metabolites according to the tanitomo distance of their structures. Users can identify measurements of similar proteins according to their orthology and sequence similarity. Users can identify measurements of similar reactions according to their Enzyme Classification.</li>
    <li>Phylogenetic similarity: Users can identify measurements observed in closely related taxa to their taxon of interest by filtering measurements according to their distance along the NCBI Taxonomy tree.</li>
    <li>Environmental similarity: Users can filter for measurements from similar temperatures, pHs, and media conditions.</li>
    </ul>

  • Add links to tanimoto, KEGG orthology, EC, NCBI Taxonomy

• Acknowledgements

  • Add a link to Center for Reproducible Biomodeling Modeling
  • Add a period to the end of the paragraph

[yosefdroth]

I have made those changes - https://datanator.info/about/ How is it now?

[jonrkarr]

Done