Skip to content

Commit f5c3e37

Browse files
janoshjanosh
committed
extract ModelCard component from page /models
fix /api route markdown processing continue work on paper
1 parent cd4b90f commit f5c3e37

File tree

16 files changed

+309
-137
lines changed

16 files changed

+309
-137
lines changed

‎.github/workflows/gh-pages.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,8 @@ jobs:
4040
4141
- name: Build site
4242
run: |
43+
python scripts/make_api_docs.py
4344
cd site
44-
npm run make-api-docs
4545
npm run build
4646
4747
- name: Upload build artifact

‎.pre-commit-config.yaml

+1-1
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ repos:
7272
- prettier
7373
- prettier-plugin-svelte
7474
- svelte
75-
exclude: ^(site/static/.+\.svelte|data/wbm/20.+\..+|.+references.yaml)$
75+
exclude: ^(site/static/.+\.svelte|data/wbm/20.+\..+|site/src/routes/.+\.(yml|yaml|json))$
7676

7777
- repo: https://github.com/pre-commit/mirrors-eslint
7878
rev: v8.31.0

‎data/wbm/readme.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -72,14 +72,14 @@ materialscloud:2021.68 includes a readme file with a description of the dataset,
7272

7373
## 📊   Plots
7474

75-
<caption>Heatmap of WBM training set element counts</caption>
7675
<slot name="wbm-elements-heatmap">
7776
<img src="./2023-01-08-wbm-elements.svg" alt="Periodic table log heatmap of WBM elements">
7877
</slot>
78+
<caption>Heatmap of WBM training set element counts</caption>
7979

8080
which compares as follows to the training set (all 146323 MP ComputedStructureEntries)
8181

82-
<caption>Heatmap of MP test set element counts</caption>
8382
<slot name="mp-elements-heatmap">
8483
<img src="./2023-01-08-mp-elements.svg" alt="Periodic table log heatmap of MP elements">
8584
</slot>
85+
<caption>Heatmap of MP test set element counts</caption>

‎models/voronoi/__init__.py

+27-15
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,35 @@
1-
import matminer.featurizers.composition as feat_comp
2-
import matminer.featurizers.structure as feat_struct
1+
import matminer.featurizers.composition as fc
2+
import matminer.featurizers.structure as fs
33
from matminer.featurizers.base import MultipleFeaturizer
44

55
# Create the featurizer: Ward et al. use a variety of different featurizers
66
# https://journals.aps.org/prb/abstract/10.1103/PhysRevB.96.024104
7-
featurizers = [
8-
feat_struct.SiteStatsFingerprint.from_preset("CoordinationNumber_ward-prb-2017"),
9-
feat_struct.StructuralHeterogeneity(),
10-
feat_struct.ChemicalOrdering(),
11-
feat_struct.MaximumPackingEfficiency(),
12-
feat_struct.SiteStatsFingerprint.from_preset(
13-
"LocalPropertyDifference_ward-prb-2017"
14-
),
15-
feat_struct.StructureComposition(feat_comp.Stoichiometry()),
16-
feat_struct.StructureComposition(feat_comp.ElementProperty.from_preset("magpie")),
17-
feat_struct.StructureComposition(feat_comp.ValenceOrbital(props=["frac"])),
18-
feat_struct.StructureComposition(feat_comp.IonProperty(fast=True)),
7+
8+
composition_features = [
9+
# Ward+Wolverton' Magpie https://rdcu.be/c3jug
10+
fc.ElementProperty.from_preset("magpie"),
11+
# Ionic property attributes. Similar to ElementProperty.
12+
fc.IonProperty(fast=True),
13+
# Calculate norms of stoichiometric attributes.
14+
fc.Stoichiometry(),
15+
# Attributes of valence orbital shells
16+
fc.ValenceOrbital(props=["frac"]),
17+
]
18+
structure_features = [
19+
# How much the ordering of species in the structure differs from random
20+
fs.ChemicalOrdering(),
21+
# Maximum possible packing efficiency of this structure
22+
fs.MaximumPackingEfficiency(),
23+
# Differences in elemental properties between site and its neighboring sites
24+
fs.SiteStatsFingerprint.from_preset("LocalPropertyDifference_ward-prb-2017"),
25+
# Number of first nearest neighbors of a site.
26+
fs.SiteStatsFingerprint.from_preset("CoordinationNumber_ward-prb-2017"),
27+
# Variance in the bond lengths and atomic volumes in a structure
28+
fs.StructuralHeterogeneity(),
1929
]
20-
featurizer = MultipleFeaturizer(featurizers)
30+
featurizer = MultipleFeaturizer(
31+
structure_features + [*map(fs.StructureComposition, composition_features)]
32+
)
2133

2234

2335
# multiprocessing seems to be the cause of OOM errors on large structures even when

‎scripts/make_api_docs.py

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import json
2+
import os
3+
from glob import glob
4+
from subprocess import run
5+
6+
# update generated API docs on production builds
7+
8+
pkg = json.load(open("site/package.json"))
9+
route = "site/src/routes/api"
10+
11+
for path in glob(f"{route}/*.md"):
12+
os.remove(path)
13+
14+
run(
15+
f"lazydocs matbench_discovery --output-path {route} "
16+
f"--no-watermark --src-base-url {pkg['repository']}/blob/main",
17+
shell=True,
18+
)
19+
20+
for path in glob(f"{route}/*.md"):
21+
markdown = open(path).read()
22+
# remove <b> tags from generated markdown as they break inline code
23+
markdown = markdown.replace("<b>", "").replace("</b>", "")
24+
# improve style of badges linking to source code on GitHub
25+
markdown = markdown.replace(
26+
'src="https://img.shields.io/badge/-source-cccccc?style=flat-square"',
27+
'src="https://img.shields.io/badge/source-blue?style=flat" alt="source link"',
28+
)
29+
open(path, "w").write(markdown)

‎site/package.json

+10-10
Original file line numberDiff line numberDiff line change
@@ -13,16 +13,16 @@
1313
"preview": "vite preview",
1414
"serve": "vite build && vite preview",
1515
"check": "svelte-check",
16-
"make-api-docs": "rm -f src/routes/api/*.md && cd .. && lazydocs matbench_discovery --output-path site/src/routes/api --no-watermark --src-base-url https://github.com/janosh/matbench-discovery/blob/main"
16+
"make-api-docs": "python ../scripts/make_api_docs.py"
1717
},
1818
"devDependencies": {
1919
"@iconify/svelte": "^3.0.1",
2020
"@rollup/plugin-yaml": "^4.0.1",
21-
"@sveltejs/adapter-static": "1.0.1",
22-
"@sveltejs/kit": "1.0.7",
21+
"@sveltejs/adapter-static": "^1.0.1",
22+
"@sveltejs/kit": "^1.0.11",
2323
"@sveltejs/vite-plugin-svelte": "^2.0.2",
24-
"@typescript-eslint/eslint-plugin": "^5.48.0",
25-
"@typescript-eslint/parser": "^5.48.0",
24+
"@typescript-eslint/eslint-plugin": "^5.48.1",
25+
"@typescript-eslint/parser": "^5.48.1",
2626
"eslint": "^8.31.0",
2727
"eslint-plugin-svelte3": "^4.0.0",
2828
"hast-util-from-string": "^2.0.0",
@@ -36,12 +36,12 @@
3636
"prettier-plugin-svelte": "^2.9.0",
3737
"rehype-autolink-headings": "^6.1.1",
3838
"rehype-slug": "^5.1.0",
39-
"remark-math": "^3.0.0",
40-
"svelte": "^3.55.0",
41-
"svelte-check": "^3.0.1",
42-
"svelte-github-corner": "^0.2.0",
39+
"remark-math": "3.0.0",
40+
"svelte": "^3.55.1",
41+
"svelte-check": "^3.0.2",
4342
"svelte-preprocess": "^5.0.0",
44-
"svelte-toc": "^0.5.1",
43+
"svelte-toc": "^0.5.2",
44+
"svelte-zoo": "^0.2.0",
4545
"svelte2tsx": "^0.6.0",
4646
"sveriodic-table": "^0.1.4",
4747
"tslib": "^2.4.1",

‎site/src/app.css

+4-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@
33
--blue: cornflowerblue;
44
--text-color: rgb(208, 208, 208);
55

6-
--toc-mobile-bg: #1c0e3e;
6+
--toc-mobile-bg: #0d1a1d;
7+
--toc-mobile-shadow: 0 0 1em 0 black;
8+
--toc-title-padding: 0 0 0 3pt;
79
--toc-li-padding: 4pt 1ex;
810
--toc-mobile-btn-color: white;
911
--toc-desktop-nav-margin: 0 0 0 1em;
@@ -145,4 +147,5 @@ aside.toc.desktop {
145147

146148
caption {
147149
display: block;
150+
margin: 1em auto 2em;
148151
}

‎site/src/lib/ModelCard.svelte

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
<script lang="ts">
2+
import { repository } from '$site/package.json'
3+
import Icon from '@iconify/svelte'
4+
import type { ModelMetadata } from './types'
5+
6+
export let key: string
7+
export let data: ModelMetadata
8+
9+
const { model_name, repo, doi, preprint, url, date_added } = data
10+
</script>
11+
12+
<h2>{model_name}</h2>
13+
<nav>
14+
{#each [[repo, `Repo`, `octicon:mark-github`], [`${repository}/tree/main/models/${key}`, `Submission files`, `octicon:file-directory`], [doi, `DOI`, `academicons:doi`], [preprint, `Preprint`, `ion:ios-paper`], [url, `Website`, `ion:ios-globe`]] as [href, title, icon]}
15+
<span>
16+
<Icon {icon} inline />
17+
<a {href}>{title}</a>
18+
</span>
19+
{/each}
20+
</nav>
21+
<p>
22+
Date added: {new Date(date_added).toISOString().split(`T`)[0]}
23+
&nbsp;&bull;&nbsp; Benchmark version: {data.matbench_discovery_version}
24+
</p>
25+
<strong>Authors</strong>
26+
<section>
27+
<ul>
28+
{#each data.authors as { name, email, orcid, affiliation, url }}
29+
<li>
30+
<span title={affiliation}>{name}</span>
31+
{#if email}
32+
[<a href="mailto:{email}">email</a>]
33+
{/if}
34+
{#if orcid}
35+
[<a href={orcid}>Orcid</a>]
36+
{/if}
37+
{#if url}
38+
[<a href={url}>web</a>]
39+
{/if}
40+
</li>
41+
{/each}
42+
</ul>
43+
<strong>Package versions</strong>
44+
<ul>
45+
{#each Object.entries(data.requirements) as [name, version]}
46+
<li>
47+
{#if ![`aviary`].includes(name)}
48+
{@const href = `https://pypi.org/project/${name}/${version}`}
49+
{name}: <a {href}>{version}</a>
50+
{:else}
51+
{name}: {version}
52+
{/if}
53+
</li>
54+
{/each}
55+
</ul>
56+
</section>
57+
58+
<!-- TODO add table with performance metrics (F1, Acc, Recall, Precision) for each model -->
59+
<style>
60+
h2 {
61+
margin: 5pt 0 1ex;
62+
}
63+
ul {
64+
list-style-type: disc;
65+
}
66+
nav {
67+
font-weight: 250;
68+
display: flex;
69+
gap: 5pt 1em;
70+
flex-wrap: wrap;
71+
}
72+
nav > span {
73+
display: flex;
74+
gap: 0.5em;
75+
place-items: center;
76+
}
77+
strong {
78+
display: block;
79+
margin: 1em 0 5pt;
80+
}
81+
</style>

‎site/src/lib/index.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export { default as Footer } from './Footer.svelte'
2+
export { default as ModelCard } from './ModelCard.svelte'
3+
export { default as Nav } from './Nav.svelte'

‎site/src/routes/+layout.svelte

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
<script lang="ts">
22
import { page } from '$app/stores'
3-
import Footer from '$lib/Footer.svelte'
4-
import Nav from '$lib/Nav.svelte'
3+
import { Footer, Nav } from '$lib'
54
import { repository } from '$site/package.json'
65
import { onMount } from 'svelte'
7-
import GitHubCorner from 'svelte-github-corner'
86
import Toc from 'svelte-toc'
7+
import { GitHubCorner } from 'svelte-zoo'
98
import '../app.css'
109
1110
onMount(() => {

‎site/src/routes/how-to-contribute/+page.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -170,4 +170,4 @@ And you're done! Once tests pass and the PR is merged, your model will be added
170170

171171
## 😵‍💫 &thinsp; Troubleshooting
172172

173-
Having problems using or contributing to the project? Please [open an issue on GitHub](https://github.com/janosh/matbench-discovery/issues). We're happy to help!
173+
Having problems using or contributing to the project? Please [open an issue on GitHub](https://github.com/janosh/matbench-discovery/issues). Happy to help! 😊

‎site/src/routes/models/+page.server.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
1+
import type { ModelMetadata } from '$lib/types'
12
import { dirname } from 'path'
23
import type { PageServerLoad } from './$types'
34

45
export const load: PageServerLoad = async () => {
5-
const model_metas = Object.entries(
6+
const models: [string, ModelMetadata][] = Object.entries(
67
import.meta.glob(`$root/models/**/metadata.yml`, {
78
eager: true,
89
})
910
).map(([key, module]) => [dirname(key), module.default])
1011

11-
return { model_metas }
12+
return { models }
1213
}

‎site/src/routes/models/+page.svelte

+3-71
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
<script lang="ts">
2-
import { repository } from '$site/package.json'
3-
import Icon from '@iconify/svelte'
2+
import { ModelCard } from '$lib'
43
import type { PageData } from './$types'
54
65
export let data: PageData
@@ -9,55 +8,9 @@
98
<h1>Models</h1>
109

1110
<ol>
12-
{#each data.model_metas as [key, meta], idx}
13-
{@const { repo, doi, preprint, url, date_added } = meta}
11+
{#each data.models as [key, metadata], idx}
1412
<li>
15-
<h2>{meta.model_name}</h2>
16-
<nav>
17-
{#each [[repo, `Repo`, `octicon:mark-github`], [`${repository}/tree/main/models/${key}`, `Submission files`, `octicon:file-directory`], [doi, `DOI`, `academicons:doi`], [preprint, `Preprint`, `ion:ios-paper`], [url, `Website`, `ion:ios-globe`]] as [href, title, icon]}
18-
<span>
19-
<Icon {icon} inline />
20-
<a {href}>{title}</a>
21-
</span>
22-
{/each}
23-
</nav>
24-
<p>
25-
Date added: {new Date(date_added).toISOString().split(`T`)[0]}
26-
&nbsp;&bull;&nbsp; Benchmark version: {meta.matbench_discovery_version}
27-
</p>
28-
<strong>Authors</strong>
29-
<section>
30-
<ul>
31-
{#each meta.authors as { name, email, orcid, affiliation, url }}
32-
<li>
33-
<span title={affiliation}>{name}</span>
34-
{#if email}
35-
[<a href="mailto:{email}">email</a>]
36-
{/if}
37-
{#if orcid}
38-
[<a href={orcid}>Orcid</a>]
39-
{/if}
40-
{#if url}
41-
[<a href={url}>web</a>]
42-
{/if}
43-
</li>
44-
{/each}
45-
</ul>
46-
<strong>Package versions</strong>
47-
<ul>
48-
{#each Object.entries(meta.requirements) as [name, version]}
49-
<li>
50-
{#if ![`aviary`].includes(name)}
51-
{@const href = `https://pypi.org/project/${name}/${version}`}
52-
{name}: <a {href}>{version}</a>
53-
{:else}
54-
{name}: {version}
55-
{/if}
56-
</li>
57-
{/each}
58-
</ul>
59-
</section>
60-
<!-- TODO add table with performance metrics (F1, Acc, Recall, Precision) for each model -->
13+
<ModelCard {key} data={metadata} />
6114
</li>
6215
{/each}
6316
</ol>
@@ -72,25 +25,4 @@
7225
background-color: rgba(255, 255, 255, 0.05);
7326
padding: 3pt 9pt 5pt;
7427
}
75-
ol > li > h2 {
76-
margin: 5pt 0 1ex;
77-
}
78-
ul {
79-
list-style-type: disc;
80-
}
81-
nav {
82-
font-weight: 250;
83-
display: flex;
84-
gap: 5pt 1em;
85-
flex-wrap: wrap;
86-
}
87-
nav > span {
88-
display: flex;
89-
gap: 0.5em;
90-
place-items: center;
91-
}
92-
strong {
93-
display: block;
94-
margin: 1em 0 5pt;
95-
}
9628
</style>

0 commit comments

Comments
 (0)