Skip to content

Commit f2e956d

Browse files
Chiu PeterChiu Peter
Chiu Peter
authored and
Chiu Peter
committed
update comp-conc panel and filter solid tip
1 parent bd75b78 commit f2e956d

File tree

1 file changed

+84
-30
lines changed

1 file changed

+84
-30
lines changed

‎crystal_toolkit/components/pourbaix.py‎

Lines changed: 84 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -440,11 +440,10 @@ def _sub_layouts(self) -> dict[str, Component]:
440440
default=self.default_state["filter_solids"],
441441
label="Filter Solids",
442442
help_str="Whether to filter solid phases by stability on the compositional phase diagram. "
443-
"The practical consequence of this is that highly oxidized or reduced phases that "
444-
"might show up in experiments due to kinetic limitations on oxygen/hydrogen evolution "
445-
"won't appear in the diagram, but they are not actually “stable” (and are frequently "
446-
"overstabilized from DFT errors). Hence, including only the stable solid phases generally "
447-
"leads to the most accurate Pourbaix diagrams.",
443+
"The practical consequence of this is that we only include materials that are predicted to "
444+
"be thermodynamically stable at RT within the limitations of DFT. Notably, there may be "
445+
"disagreements with experiments e.g., highly oxidized or reduced phases, which are kinetically "
446+
"stabilized through surface passivation.",
448447
),
449448
html.Div(
450449
[
@@ -454,23 +453,40 @@ def _sub_layouts(self) -> dict[str, Component]:
454453
id=self.id("invalid-comp-alarm"),
455454
message="Illegal composition entry!",
456455
),
457-
html.H5(
458-
"Composition",
459-
id=self.id("composition-title"),
460-
style={"fontWeight": "bold"},
456+
html.Div(
457+
[
458+
html.H5(
459+
"Composition Control",
460+
style={
461+
"fontWeight": "bold",
462+
"textAlign": "center",
463+
},
464+
),
465+
html.H5(
466+
"Composition of",
467+
id=self.id("composition-title"),
468+
# style={"fontWeight": "bold"},
469+
),
470+
]
461471
),
462472
dcc.Input(
463473
id=self.id("comp-text"),
464474
type="text",
465-
# placeholder="composition e.g. 1:1:1",
466-
),
467-
html.Button(
468-
"Update",
469-
id=self.id("comp-btn"),
475+
style={
476+
"textAlign": "center",
477+
"width": "10rem",
478+
"marginRight": "0.2rem",
479+
"marginBottom": "0.2rem",
480+
"height": "36px",
481+
"fontSize": "14px",
482+
},
470483
),
471484
ctl.Block(html.Div(id=self.id("display-composition"))),
472-
html.Br(),
473-
html.Br(),
485+
html.Hr(
486+
style={
487+
"backgroundColor": "#C5C5C6",
488+
}
489+
),
474490
dcc.Store(id=self.id("elements-store")),
475491
],
476492
id=self.id("comp-panel"),
@@ -486,8 +502,18 @@ def _sub_layouts(self) -> dict[str, Component]:
486502
id=self.id("conc-panel"),
487503
style={"display": "none"},
488504
),
489-
html.Div(id=self.id("element_specific_controls")),
490-
]
505+
html.Div(
506+
id=self.id("element_specific_controls"),
507+
),
508+
html.Button(
509+
"Update",
510+
id=self.id("comp-conc-btn"),
511+
style={"display": "none"},
512+
),
513+
],
514+
style={
515+
"backgroundColor": "#F1F1F5",
516+
},
491517
),
492518
self.get_bool_input(
493519
"show_heatmap", # kwarg_label
@@ -629,6 +655,8 @@ def update_heatmap_choices(entries, mat_detials, filter_solids):
629655
Output(self.id("elements-store"), "data"),
630656
Output(self.id("comp-text"), "value"),
631657
Output(self.id("composition-title"), "children"),
658+
Output(self.id("comp-conc-btn"), "children"),
659+
Output(self.id("comp-conc-btn"), "style"),
632660
Input(self.id(), "data"),
633661
prevent_initial_call=True,
634662
)
@@ -662,7 +690,7 @@ def update_element_specific_sliders(
662690
default=1e-6,
663691
min=MIN_CONCENTRATION,
664692
max=MAX_CONCENTRATION,
665-
label=f"Concentration of {element} ion",
693+
label=f"concentration of {element} ion",
666694
style={"width": "10rem", "fontSize": "14px"},
667695
)
668696
]
@@ -674,34 +702,52 @@ def update_element_specific_sliders(
674702
comp_conc_controls += comp_inputs
675703

676704
ion_label = (
677-
"Set Ion Concentrations (M)"
705+
"Ion Concentrations Control"
678706
if len(elements) > 1
679-
else "Set Ion Concentration"
707+
else "Ion Concentration Control"
708+
)
709+
710+
comp_conc_controls.append(
711+
html.H5(
712+
ion_label,
713+
style={"fontWeight": "bold", "textAlign": "center"},
714+
),
715+
)
716+
comp_conc_controls.append(
717+
html.H6(
718+
f"💡 Set the range between {MIN_CONCENTRATION} and {MAX_CONCENTRATION} (M)"
719+
)
680720
)
681-
comp_conc_controls.append(ctl.Label(ion_label))
682721

683722
comp_conc_controls += conc_inputs
684723

685-
#
724+
# comp_panel_style
686725
comp_panel_style = {"display": "none"}
687726
if len(elements) > 1:
688727
comp_panel_style = {"display": "block"}
689728

690-
#
729+
# elements store
691730
elements = [element.symbol for element in elements]
692731

693-
#
732+
# default_comp
694733
default_comp = ":".join(["1" for _ in elements])
695734

696-
#
697-
title = "Composition of " + ":".join(elements)
735+
# composition title
736+
title = "💡 Composition of " + ":".join(elements)
737+
738+
# update_string
739+
update_string = "Concentration update"
740+
if len(elements) > 1:
741+
update_string = "Composition & concentration update"
698742

699743
return (
700744
html.Div(comp_conc_controls),
701745
comp_panel_style,
702746
elements,
703747
default_comp,
704748
title,
749+
update_string,
750+
{"display": "block"},
705751
)
706752

707753
@cache.memoize(timeout=5 * 60)
@@ -715,11 +761,14 @@ def get_pourbaix_diagram(pourbaix_entries, **kwargs):
715761
Output(self.id("display-composition"), "children"),
716762
Input(self.id(), "data"),
717763
Input(self.id("display-composition"), "children"),
718-
Input(self.get_all_kwargs_id(), "value"),
719-
Input(self.id("comp-btn"), "n_clicks"),
764+
State(self.get_all_kwargs_id(), "value"),
765+
Input(self.id("comp-conc-btn"), "n_clicks"),
720766
State(self.id("elements-store"), "data"),
721767
State(self.id("comp-text"), "value"),
722768
Input(self.id("element_specific_controls"), "children"),
769+
Input(self.get_kwarg_id("filter_solids"), "value"),
770+
Input(self.get_kwarg_id("show_heatmap"), "value"),
771+
Input(self.get_kwarg_id("heatmap_choice"), "value"),
723772
prevent_initial_call=True,
724773
)
725774
def make_figure(
@@ -730,11 +779,14 @@ def make_figure(
730779
elements,
731780
comp_text,
732781
dependency2,
782+
dependency3,
783+
dependency4,
784+
dependency5,
733785
) -> go.Figure:
734786
if pourbaix_entries is None:
735787
raise PreventUpdate
736788

737-
# check if composition input
789+
# Only update
738790
if n_clicks:
739791
raw_comp_list = comp_text.split(":")
740792
else:
@@ -757,6 +809,7 @@ def make_figure(
757809
return (self.get_figure_div(), True, False, "")
758810

759811
kwargs = self.reconstruct_kwargs_from_state()
812+
print(kwargs)
760813

761814
pourbaix_entries = self.from_data(pourbaix_entries)
762815

@@ -808,6 +861,7 @@ def make_figure(
808861
pourbaix_diagram,
809862
heatmap_entry=heatmap_entry,
810863
)
864+
811865
return (
812866
self.get_figure_div(figure=figure),
813867
False,

0 commit comments

Comments
 (0)