+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ By clicking on the 'Get to work' button you will access a
+ personal space that is available to each NOMAD user. After
+ logging in, you will see a 'tutorials' and 'work' directory.
+ The 'tutorials' directory contains all notebooks available in
+ the AI toolkit, while the 'work' directory offers some space
+ to save personal work. When you are in the 'work' directory,
+ click on the 'new' icon on the top right and then select
+ 'Python 3'. This will create a Jupyter notebook that is
+ stored in the AI toolkit and can be reaccessed and iteratively
+ modified by the user. All packages and software installed in the AI
+ toolkit are also available in the 'work' directory, that
+ makes it possible to employ the same code syntax used in
+ each tutorial contained in the AI toolkit for your own project.
+ For example, you can deploy any of the methodologies described in
+ tutorials on a different dataset. You can also upload your own data with
+ the 'Upload' button (via the menu bar on top, under the 'Publish' menu),
+ or directly access datasets in the NOMAD Archive. Make sure to learn
+ how to access the data in the NOMAD Archive, which is explained in the
+ tutorial accessible from the 'Query the Archive' button.
+
+
+
+
+
+
+
+
+
+
+ What is the NOMAD Artificial-Intelligence Toolkit?
+
+
+ The preparation, synthesis, and characterization of new materials is a
+ complex and costly aspect of materials design. The number of possible
+ materials is practically infinite, about 200,000 materials are “known”
+ to exist. But the basic properties (e.g., optical gap, elasticity
+ constants, plasticity, piezoelectric tensors, conductivity, etc.) have
+ been determined for very few of them. NOMAD develops and provides a
+ big set of tools - the Artificial-Intelligence Toolkit - using the
+ latest artificial-intelligence approaches (including machine-learning,
+ compressed sensing, and data mining) that make it possible to sort all
+ available material data, to identify correlations and structures, and
+ to detect trends and anomalies. Thus, the Artificial Intelligence Toolkit
+ enables scientists and engineers to decide which materials are useful for
+ specific applications or which new materials should be the focus of future
+ studies.
+
+
+
+
+
+
+
+
+ How to get started
+
+
+ Introduction to the scope of the NOMAD Artificial-Intelligence toolkit.
+
+
+
- ))}
+
+
+ The NOMAD Artificial-Intelligence Toolkit is very accessible. Watch this video and
+ learn more about its features.
+
+
+
+
+
+
+
+
+ Read about us!
+
+
+ By clicking on the image below, you will access a Nature Reviews paper
+ which gives an introduction to the NOMAD Artificial-Intelligence Toolkit.
+
+
+
+
+
+
+
+ Access the tutorials
+
+ Ready to start? Click on one of the options below. If you're new, we
+ suggest starting with the tutorials.
+
+
-
- option}
- style={{ width: '100%', marginBottom: 8 }}
- renderInput={params => (
-
- )}
- value={queryParameters.author}
- onChange={(_, value) => setQueryParameters({...emptyQuery, author: value})}
- />
- option}
- style={{ width: '100%', marginBottom: 8 }}
- renderInput={params => (
-
- )}
- value={queryParameters.keyword}
- onChange={(_, value) => setQueryParameters({...emptyQuery, keyword: value})}
- />
- (
-
- )}
- value={queryParameters.method}
- onChange={(_, value) => setQueryParameters({...emptyQuery, method: value})}
- />
- {/* */}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
}
diff --git a/gui/src/components/aitoolkit/AccordionsList.js b/gui/src/components/aitoolkit/AccordionsList.js
new file mode 100644
index 0000000000000000000000000000000000000000..381468e03b96f03f2d23bf14d40a6e9487fab1db
--- /dev/null
+++ b/gui/src/components/aitoolkit/AccordionsList.js
@@ -0,0 +1,287 @@
+/*
+ * Copyright The NOMAD Authors.
+ *
+ * This file is part of NOMAD. See https://nomad-lab.eu for further info.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react'
+import {
+ Divider,
+ Typography,
+ Link,
+ AccordionActions,
+ Button,
+ Grid,
+ makeStyles
+} from '@material-ui/core'
+import MuiAccordion from '@material-ui/core/Accordion'
+import MuiAccordionSummary from '@material-ui/core/AccordionSummary'
+import MuiAccordionDetails from '@material-ui/core/AccordionDetails'
+import { styled } from '@material-ui/core/styles'
+import ArrowForwardIosSharpIcon from '@material-ui/icons/ArrowForwardIosSharp'
+import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
+import Markdown from '../Markdown'
+import { StringParam, useQueryParam } from 'use-query-params'
+import AccessIcon from '../../images/AIT_ico_bd_link_external_big.svg'
+import WatchIcon from '../../images/AIT_ico_bd_youtube.svg'
+import PdfIcon from '../../images/AIT_ico_bd_link_pdf.svg'
+import DoiIcon from '../../images/AIT_ico_bd_link_doi.svg'
+
+const useStyles = makeStyles(theme => ({
+ tutorialTitleGrid: {
+ marginRight: '40px'
+ },
+ tutorialTitleText: {
+ fontWeight: theme.typography.fontWeightMedium,
+ fontSize: '28px',
+ color: '#2A3C67',
+ lineHeight: '30px'
+ },
+ fieldText: {
+ color: '#2A3C67'
+ },
+ linkAuthors: {
+ color: '#2A3C67',
+ cursor: 'pointer',
+ lineHeight: '20px',
+ fontSize: '16px'
+ },
+ tutorialDescriptionGrid: {
+ marginLeft: '50px'
+ },
+ tutorialDescriptionText: {
+ color: '#2A3C67',
+ fontSize: '18px'
+ },
+ keywordsGrid: {
+ marginLeft: '80px'
+ },
+ linkKeywords: {
+ border: '1.5px solid #00DFE0',
+ lineHeight: '35px',
+ color: '#2A3C67',
+ cursor: 'pointer',
+ fontStyle: 'normal',
+ fontSize: '16px'
+ },
+ tutorialActions: {
+ marginLeft: '50px'
+ },
+ tutorialResources: {
+ marginTop: '-17px',
+ marginLeft: '-6px'
+ }
+}))
+
+const Accordion = styled((props) => (
+
+))(({ theme }) => ({
+ backgroundColor: theme.palette.background.default,
+ borderBottom: '13px solid #7FEFEF'
+}))
+
+const AccordionSummary = styled((props) => (
+ }
+ {...props}
+ />
+))(({ theme }) => ({
+ flexDirection: 'row-reverse',
+ '& .MuiAccordionSummary-expandIconWrapper.Mui-expanded': {
+ transform: 'rotate(90deg)'
+ },
+ '& .MuiAccordionSummary-content': {
+ marginLeft: theme.spacing(1),
+ marginTop: '20px',
+ marginBottom: '20px'
+ }
+}))
+
+const AccordionDetails = styled(MuiAccordionDetails)(({ theme }) => ({
+ padding: theme.spacing(2)
+}))
+
+function AccordionsList(props) {
+ const styles = useStyles()
+ const [expanded, setExpanded] = useQueryParam('expanded', StringParam)
+ return (
+ props.tutorials_list.map(tutorial => (
+ props.filter(tutorial) &&
+