def all_layouts(self):
struct_layout = html.Div(
Simple3DSceneComponent(
id=self.id("scene"),
data=self.initial_scene_data,
settings=self.initial_scene_settings,
),
style={
"width": "100%",
"height": "100%",
"overflow": "hidden",
"margin": "0 auto",
},
)
screenshot_layout = html.Div(
[
Button(
[Icon(), html.Span(), "Download Image"],
kind="primary",
id=self.id("screenshot_button"),
)
],
# TODO: change to "bottom" when dropdown included
style={
"vertical-align": "top",
"display": "inline-block"
},
)
title_layout = html.Div(self._make_title(self.initial_legend),
id=self.id("title_container"))
legend_layout = html.Div(self._make_legend(self.initial_legend),
id=self.id("legend_container"))
# options = {
# "bonding_strategy": bonding_strategy,
# "bonding_strategy_kwargs": bonding_strategy_kwargs,
options_layout = Field([
# hide if molecule
html.Label("Change unit cell:", className="mpc-label"),
html.Div(
dcc.RadioItems(
options=[
{
"label": "Input cell",
"value": "input"
},
{
"label": "Primitive cell",
"value": "primitive"
},
{
"label": "Conventional cell",
"value": "conventional"
},
],
value="conventional",
id=self.id("unit-cell-choice"),
labelStyle={"display": "block"},
inputClassName="mpc-radio",
),
className="mpc-control",
),
# hide if molecule
html.Label("Change number of repeats:", className="mpc-label"),
html.Div(
dcc.RadioItems(
options=[
{
"label": "1×1×1",
"value": "1"
},
{
"label": "2×2×2",
"value": "2"
},
],
value="1",
id=self.id("repeats"),
labelStyle={"display": "block"},
inputClassName="mpc-radio",
),
className="mpc-control",
),
html.Label("Change color scheme:", className="mpc-label"),
html.Div(
dcc.Dropdown(
options=[
{
"label": "VESTA",
"value": "VESTA"
},
{
"label": "Jmol",
"value": "Jmol"
},
],
value="VESTA",
clearable=False,
id=self.id("color-scheme"),
),
className="mpc-control",
),
html.Label("Change atomic radii:", className="mpc-label"),
html.Div(
dcc.Dropdown(
options=[
{
"label": "Ionic",
"value": "specified_or_average_ionic"
},
{
"label": "Covalent",
"value": "covalent"
},
{
"label": "Van der Waals",
"value": "van_der_waals"
},
{
"label": "Uniform (0.5Å)",
"value": "uniform"
},
],
value="uniform",
clearable=False,
id=self.id("radius_strategy"),
),
className="mpc-control",
),
html.Label("Draw options:", className="mpc-label"),
html.Div([
dcc.Checklist(
options=[
{
"label":
"Draw repeats of atoms on periodic boundaries",
"value": "draw_image_atoms",
},
{
"label": "Draw atoms outside unit cell bonded to "
"atoms within unit cell",
"value": "bonded_sites_outside_unit_cell",
},
],
values=["draw_image_atoms"],
labelStyle={"display": "block"},
inputClassName="mpc-radio",
id=self.id("draw_options"),
)
]),
html.Label("Hide/show:", className="mpc-label"),
html.Div(
[
dcc.Checklist(
options=[
{
"label": "Atoms",
"value": "atoms"
},
{
"label": "Bonds",
"value": "bonds"
},
{
"label": "Unit cell",
"value": "unit_cell"
},
{
"label": "Polyhedra",
"value": "polyhedra"
},
],
values=["atoms", "bonds", "unit_cell", "polyhedra"],
labelStyle={"display": "block"},
inputClassName="mpc-radio",
id=self.id("hide-show"),
)
],
className="mpc-control",
),
])
return {
"struct": struct_layout,
"screenshot": screenshot_layout,
"options": options_layout,
"title": title_layout,
"legend": legend_layout,
}
def _sub_layouts(self):
struct_layout = html.Div(
Simple3DSceneComponent(
id=self.id("scene"),
data=self.initial_data["scene"],
settings=self.initial_scene_settings,
),
style={
"width": "100%",
"height": "100%",
"overflow": "hidden",
"margin": "0 auto",
},
)
screenshot_layout = html.Div(
[
Button(
[Icon(), html.Span(), "Download Image"],
kind="primary",
id=self.id("screenshot_button"),
)
],
# TODO: change to "bottom" when dropdown included
style={"verticalAlign": "top", "display": "inline-block"},
)
title_layout = html.Div(
self._make_title(self._initial_data["legend_data"]),
id=self.id("title_container"),
)
legend_layout = html.Div(
self._make_legend(self._initial_data["legend_data"]),
id=self.id("legend_container"),
)
nn_mapping = {
"CrystalNN": "CrystalNN",
"Custom Bonds": "CutOffDictNN",
"Jmol Bonding": "JmolNN",
"Minimum Distance (10% tolerance)": "MinimumDistanceNN",
"O'Keeffe's Algorithm": "MinimumOKeeffeNN",
"Hoppe's ECoN Algorithm": "EconNN",
"Brunner's Reciprocal Algorithm": "BrunnerNN_reciprocal",
}
bonding_algorithm = dcc.Dropdown(
options=[{"label": k, "value": v} for k, v in nn_mapping.items()],
value=self.initial_data["graph_generation_options"]["bonding_strategy"],
clearable=False,
id=self.id("bonding_algorithm"),
persistence=self.persistence,
persistence_type=self.persistence_type,
)
bonding_algorithm_custom_cutoffs = html.Div(
[
html.Br(),
dt.DataTable(
columns=[
{"name": "A", "id": "A"},
{"name": "B", "id": "B"},
{"name": "A—B /Å", "id": "A—B"},
],
editable=True,
data=self._make_bonding_algorithm_custom_cuffoff_data(
self.initial_data.get("default")
),
id=self.id("bonding_algorithm_custom_cutoffs"),
),
html.Br(),
],
id=self.id("bonding_algorithm_custom_cutoffs_container"),
style={"display": "none"},
)
options_layout = Field(
[
# TODO: hide if molecule
html.Label("Change unit cell:", className="mpc-label"),
html.Div(
dcc.Dropdown(
options=[
{"label": "Input cell", "value": "input"},
{"label": "Primitive cell", "value": "primitive"},
{"label": "Conventional cell", "value": "conventional"},
{"label": "Reduced cell", "value": "reduced"},
],
value="input",
clearable=False,
id=self.id("unit-cell-choice"),
persistence=self.persistence,
persistence_type=self.persistence_type,
),
className="mpc-control",
),
html.Div(
[
html.Label("Change bonding algorithm: ", className="mpc-label"),
bonding_algorithm,
bonding_algorithm_custom_cutoffs,
]
),
html.Label("Change color scheme:", className="mpc-label"),
html.Div(
dcc.Dropdown(
options=[
{"label": "VESTA", "value": "VESTA"},
{"label": "Jmol", "value": "Jmol"},
{"label": "Accessible", "value": "accessible"},
],
value=self.initial_data["display_options"]["color_scheme"],
clearable=False,
persistence=self.persistence,
persistence_type=self.persistence_type,
id=self.id("color-scheme"),
),
className="mpc-control",
),
html.Label("Change atomic radii:", className="mpc-label"),
html.Div(
dcc.Dropdown(
options=[
{"label": "Ionic", "value": "specified_or_average_ionic"},
{"label": "Covalent", "value": "covalent"},
{"label": "Van der Waals", "value": "van_der_waals"},
{
"label": f"Uniform ({Legend.uniform_radius}Å)",
"value": "uniform",
},
],
value=self.initial_data["display_options"]["radius_strategy"],
clearable=False,
persistence=self.persistence,
persistence_type=self.persistence_type,
id=self.id("radius_strategy"),
),
className="mpc-control",
),
html.Label("Draw options:", className="mpc-label"),
html.Div(
[
dcc.Checklist(
options=[
{
"label": "Draw repeats of atoms on periodic boundaries",
"value": "draw_image_atoms",
},
{
"label": "Draw atoms outside unit cell bonded to "
"atoms within unit cell",
"value": "bonded_sites_outside_unit_cell",
},
{
"label": "Hide bonds where destination atoms are not shown",
"value": "hide_incomplete_bonds",
},
],
value=[
opt
for opt in (
"draw_image_atoms",
"bonded_sites_outside_unit_cell",
"hide_incomplete_bonds",
)
if self.initial_data["display_options"][opt]
],
labelStyle={"display": "block"},
inputClassName="mpc-radio",
id=self.id("draw_options"),
persistence=self.persistence,
persistence_type=self.persistence_type,
)
]
),
html.Label("Hide/show:", className="mpc-label"),
html.Div(
[
dcc.Checklist(
options=[
{"label": "Atoms", "value": "atoms"},
{"label": "Bonds", "value": "bonds"},
{"label": "Unit cell", "value": "unit_cell"},
{"label": "Polyhedra", "value": "polyhedra"},
{"label": "Axes", "value": "axes"},
],
value=["atoms", "bonds", "unit_cell", "polyhedra"],
labelStyle={"display": "block"},
inputClassName="mpc-radio",
id=self.id("hide-show"),
persistence=self.persistence,
persistence_type=self.persistence_type,
)
],
className="mpc-control",
),
]
)
return {
"struct": struct_layout,
"screenshot": screenshot_layout,
"options": options_layout,
"title": title_layout,
"legend": legend_layout,
}