def test_rdls001_multi_loading_components(dash_duo):
lock = Lock()
app = Dash(__name__)
app.layout = html.Div(children=[
html.H3("Edit text input to see loading state"),
dcc.Input(id="input-3", value="Input triggers the loading states"),
dcc.Loading(
className="loading-1",
children=[html.Div(id="loading-output-1")],
type="default",
),
html.Div([
dcc.Loading(
className="loading-2",
children=[html.Div([html.Div(id="loading-output-2")])],
type="circle",
),
dcc.Loading(
className="loading-3",
children=dcc.Graph(id="graph"),
type="cube",
),
]),
], )
@app.callback(
[
Output("graph", "figure"),
Output("loading-output-1", "children"),
Output("loading-output-2", "children"),
],
[Input("input-3", "value")],
)
def input_triggers_nested(value):
with lock:
return dict(data=[dict(y=[1, 4, 2, 3])]), value, value
def wait_for_all_spinners():
dash_duo.find_element(".loading-1 .dash-spinner.dash-default-spinner")
dash_duo.find_element(".loading-2 .dash-spinner.dash-sk-circle")
dash_duo.find_element(".loading-3 .dash-spinner.dash-cube-container")
def wait_for_no_spinners():
dash_duo.wait_for_no_elements(".dash-spinner")
with lock:
dash_duo.start_server(app)
wait_for_all_spinners()
wait_for_no_spinners()
with lock:
dash_duo.find_element("#input-3").send_keys("X")
wait_for_all_spinners()
wait_for_no_spinners()
def test_ldcp004_nested_loading_components(dash_dcc):
lock = Lock()
app = Dash(__name__)
app.layout = html.Div(
[
dcc.Loading(
[
html.Button(id="btn-1"),
dcc.Loading([html.Button(id="btn-2")],
className="loading-2"),
],
className="loading-1",
)
],
id="root",
)
@app.callback(Output("btn-1", "children"), [Input("btn-2", "n_clicks")])
def updateDiv1(n_clicks):
if n_clicks is not None:
with lock:
return "changed 1"
return "content 1"
@app.callback(Output("btn-2", "children"), [Input("btn-1", "n_clicks")])
def updateDiv2(n_clicks):
if n_clicks is not None:
with lock:
return "changed 2"
return "content 2"
dash_dcc.start_server(app)
dash_dcc.wait_for_text_to_equal("#btn-1", "content 1")
dash_dcc.wait_for_text_to_equal("#btn-2", "content 2")
with lock:
dash_dcc.find_element("#btn-1").click()
dash_dcc.find_element(".loading-2 .dash-spinner")
dash_dcc.wait_for_text_to_equal("#btn-2", "")
dash_dcc.wait_for_text_to_equal("#btn-2", "changed 2")
with lock:
dash_dcc.find_element("#btn-2").click()
dash_dcc.find_element(".loading-1 .dash-spinner")
dash_dcc.wait_for_text_to_equal("#btn-1", "")
dash_dcc.wait_for_text_to_equal("#btn-1", "changed 1")
assert dash_dcc.get_logs() == []
def _add_plotting_col(self) -> dbc.Col:
"""Add column with plots and tables. It is placed on the right side.
"""
return dbc.Col(
id="col-plotting-area",
children=[
dbc.Row( # Passed / failed tests
id="row-graph-passed",
class_name="g-0 p-2",
children=[
dcc.Loading(children=[
dcc.Graph(id="graph-passed",
figure=self._default_fig_passed)
])
]),
dbc.Row( # Duration
id="row-graph-duration",
class_name="g-0 p-2",
children=[
dcc.Loading(children=[
dcc.Graph(id="graph-duration",
figure=self._default_fig_duration)
])
]),
dbc.Row(
class_name="g-0 p-2",
align="center",
justify="start",
children=[
dbc.Col( # Download
width=2,
children=[
dcc.Loading(children=[
dbc.Button(id="btn-download-data",
children=self._show_tooltip(
"help-download",
"Download Data"),
class_name="me-1",
color="info"),
dcc.Download(id="download-data")
]),
]),
dbc.Col( # Show URL
width=10,
children=[
dbc.Card(id="card-url",
body=True,
class_name="gy-2 p-0",
children=[]),
])
])
],
width=9,
)
def get_layout(**kwargs):
return html.Div([
dcc.Markdown(
dedent("""
# Research Analysis
""")),
dcc.Dropdown(id="app-option",
options=[{
'label': i,
'value': i
} for i in get_app_options()],
value=get_app_options()[0]),
dcc.Dropdown(id="balance-option",
options=[{
'label': i,
'value': i
} for i in get_balancing_options()],
value="Combined"),
dcc.Loading(id="loading-icon",
type="circle",
children=[
html.Div(
children=[dcc.Graph(id="latency_vs_price")],
style={'margin': 'auto'},
),
]),
dcc.Loading(id="loading-icon",
type="circle",
children=[
html.Div(dcc.Graph(id="price_cdf_koss_weights")),
]),
dcc.Loading(id="loading-icon",
type="circle",
children=[
html.Div(dcc.Graph(id="price_cdf_algo_comparison")),
]),
dcc.Loading(id="loading-icon",
type="circle",
children=[
html.Div(dcc.Graph(id="latency_cdf_koss_weights")),
]),
dcc.Loading(id="loading-icon",
type="circle",
children=[
html.Div(dcc.Graph(id="latency_cdf_algo_comparison")),
]),
# dcc.Loading(
# id = "loading-icon",
# type="circle",
# children=[html.Div(dcc.Graph(id="latecy-to-price-graph"))]
# ),
])
def test_ldcp002_loading_component_action(dash_dcc):
lock = Lock()
app = Dash(__name__)
app.layout = html.Div(
[dcc.Loading([html.Div(id="div-1")], className="loading")], id="root")
@app.callback(Output("div-1", "children"), [Input("root", "n_clicks")])
def updateDiv(n_clicks):
if n_clicks is not None:
with lock:
return "changed"
return "content"
with lock:
dash_dcc.start_server(app)
dash_dcc.wait_for_text_to_equal("#div-1", "content")
dash_dcc.find_element("#root").click()
dash_dcc.find_element(".loading .dash-spinner")
# mounted but hidden, so looks like no text
dash_dcc.wait_for_text_to_equal("#div-1", "")
dash_dcc.wait_for_text_to_equal("#div-1", "changed")
assert dash_dcc.get_logs() == []
def updateDiv(n_clicks):
if n_clicks is None:
return
with lock:
return html.Div([
html.Button(id="btn-2"),
dcc.Loading([html.Button(id="btn-3")], className="loading-1"),
])
def test_grbs002_wrapped_graph_has_no_infinite_loop(dash_dcc, is_eager):
df = pd.DataFrame(np.random.randn(50, 50))
figure = {
"data": [{"x": df.columns, "y": df.index, "z": df.values, "type": "heatmap"}],
"layout": {"xaxis": {"scaleanchor": "y"}},
}
app = Dash(__name__, eager_loading=is_eager)
app.layout = html.Div(
style={
"backgroundColor": "red",
"height": "100vmin",
"width": "100vmin",
"overflow": "hidden",
"position": "relative",
},
children=[
dcc.Loading(
children=[
dcc.Graph(
id="graph",
figure=figure,
style={
"position": "absolute",
"top": 0,
"left": 0,
"backgroundColor": "blue",
"width": "100%",
"height": "100%",
"overflow": "hidden",
},
)
]
)
],
)
call_count = Value("i", 0)
@app.callback(Output("graph", "figure"), [Input("graph", "relayoutData")])
def selected_df_figure(selection):
call_count.value += 1
figure["data"][0]["x"] = df.columns
figure["data"][0]["y"] = df.index
figure["data"][0]["z"] = df.values
return figure
dash_dcc.start_server(app)
wait.until(lambda: dash_dcc.driver.title == "Dash", timeout=2)
sleep(1)
# TODO: not sure 2 calls actually makes sense here, shouldn't it be 1?
# but that's what we had as of the 608 fix, PR 621, so let's lock that
# in for now.
assert call_count.value == 2
assert dash_dcc.get_logs() == []
def get_dash_app(server, storage_type='memory'):
# type: (flask.Flask, str) -> dash.Dash
'''
Generate Dash Flask app instance.
Args:
server (Flask): Flask instance.
storage_type (str): Storage type (used for testing). Default: memory.
Returns:
Dash: Dash app instance.
'''
store = dcc.Store(id='store', storage_type=storage_type)
icon = html.Img(id='icon', src='/assets/icon.svg')
tabs = dcc.Tabs(
id='tabs',
className='tabs',
value='plots',
children=[
dcc.Tab(className='tab', label='plots', value='plots'),
dcc.Tab(className='tab', label='data', value='data'),
dcc.Tab(className='tab', label='config', value='config'),
dcc.Tab(className='tab', label='api', value='api'),
dcc.Tab(className='tab', label='docs', value='docs'),
dcc.Tab(className='tab', label='monitor', value='monitor'),
],
)
tabs = html.Div(id='tabs-container', children=[icon, tabs])
content = dcc.Loading(
id="content",
className='content',
type="dot",
fullscreen=True,
)
# path to resources inside pip package
assets = lbt.relative_path(__file__, "../resources")
# path to resources inside repo
if 'REPO_ENV' in os.environ.keys():
assets = lbt.relative_path(__file__, "../../../resources")
app = dash.Dash(
name='Shekels',
title='Shekels',
server=server,
external_stylesheets=['/static/style.css'],
assets_folder=assets,
)
app.layout = html.Div(id='layout', children=[store, tabs, content])
app.config['suppress_callback_exceptions'] = True
return app
def test_grbs003_graph_wrapped_in_loading_component_does_not_fail(dash_dcc):
app = Dash(__name__, suppress_callback_exceptions=True)
app.layout = html.Div([
html.H1("subplot issue"),
dcc.Location(id="url", refresh=False),
dcc.Loading(id="page-content"),
])
@app.callback(Output("page-content", "children"),
[Input("url", "pathname")])
def render_page(url):
return [
dcc.Dropdown(
id="my-dropdown",
options=[
{
"label": "option 1",
"value": "1"
},
{
"label": "option 2",
"value": "2"
},
],
value="1",
),
dcc.Graph(id="my-graph"),
]
@app.callback(Output("my-graph", "figure"),
[Input("my-dropdown", "value")])
def update_graph(value):
values = [1, 2, 3]
ranges = [1, 2, 3]
return {
"data": [{
"x": ranges,
"y": values,
"line": {
"shape": "spline"
}
}],
}
dash_dcc.start_server(app)
dash_dcc.wait_for_element("#my-graph .main-svg")
assert dash_dcc.get_logs() == []
def get_content():
reports_graph_content = get_graph_content()
reports_content = [
dcc.Loading(id="loading-reports", children=[
dcc.Tabs(
id='tabs-reports',
value='0',
children=reports_graph_content,
vertical=True)
]),
html.Button('Refresh', id='button-reports-refresh')]
return reports_content
def loading_wrapped_div(_id, color):
return html.Div(
dcc.Loading(
html.Div(
id=_id,
style={
"width": 200,
"height": 200,
"backgroundColor": color
},
),
className=_id,
),
style={"display": "inline-block"},
)
def get_plots_tab(query=None):
# type: (Optional[str]) -> List
'''
Get tab element for Shekels plots.
Args:
query (str, optional): Query string. Default: None.
Return:
list: List of elements for plots tab.
'''
# dummies must go first for element props behavior to work
content = html.Div(id='lower-content', children=[
html.Div(id='plots-content', className='col', children=[
dcc.Loading(id="progress-bar", type="circle")
])
])
return [*get_dummy_elements(), get_searchbar(query), content]
def generate(self):
plot = self._record["discovery_parameters"]["discovery_plot"]
return dcc.Loading(id="pulsar-modal-load",
type="default",
children=[
html.Div(children=[
self.format_image(plot),
html.Br(),
self.format_pulsar_paramters(),
self.format_discovery_parameters(),
self.format_associations(),
self.format_additional_content()
],
style={
"margin-left": "2%",
"margin-right": "2%"
})
])
def get_layout(**kwargs):
print("pivot table")
return html.Div([
dcc.Markdown(
dedent("""
# Analysis Pivot Table
""")),
dcc.Dropdown(id="app-option",
options=[{
'label': i,
'value': i
} for i in get_app_options()],
value=get_app_options()[0]),
dcc.Loading(id="loading-icon",
type="circle",
children=[
html.Div(id="pivot-table"),
]),
])
def test_ldcp008_graph_in_loading_fits_container_height(dash_dcc):
lock = Lock()
app = Dash(__name__)
app.layout = html.Div(
className="outer-container",
children=[
html.Div(
dcc.Loading(
parent_style={"height": "100%"},
children=dcc.Graph(
style={"height": "100%"},
figure={
"data": [{
"x": [1, 2, 3, 4],
"y": [4, 1, 6, 9],
"line": {
"shape": "spline"
},
}]
},
),
), )
],
style={
"display": "flex",
"height": "300px"
},
)
dash_dcc.start_server(app)
with lock:
dash_dcc.wait_for_style_to_equal(".js-plotly-plot", "height", "300px")
assert dash_dcc.wait_for_element(".js-plotly-plot").size.get(
"height") == dash_dcc.wait_for_element(
".outer-container").size.get("height")
assert dash_dcc.get_logs() == []
def test_ldcp007_class_and_style_props(dash_dcc):
lock = Lock()
app = Dash(__name__)
app.layout = html.Div([
html.Button("click", id="btn"),
dcc.Loading(
id="loading",
className="spinner-class",
parent_className="parent-class",
style={"background-color": "rgb(255,192,203)"},
# rgb(240, 248, 255) = aliceblue
parent_style={"border": "3px solid rgb(240, 248, 255)"},
children=html.Div(id="loading-child"),
),
])
@app.callback(Output("loading-child", "children"),
[Input("btn", "n_clicks")])
def updateDiv(n_clicks):
if n_clicks is None:
return
with lock:
return "sample text content"
dash_dcc.start_server(app)
dash_dcc.wait_for_style_to_equal(".parent-class", "border-color",
"rgb(240, 248, 255)")
with lock:
button = dash_dcc.find_element("#btn")
button.click()
dash_dcc.wait_for_style_to_equal(".spinner-class", "background-color",
"rgba(255, 192, 203, 1)")
assert dash_dcc.get_logs() == []
def test_ldcp001_loading_component_initialization(dash_dcc):
lock = Lock()
app = Dash(__name__)
app.layout = html.Div(
[dcc.Loading([html.Div(id="div-1")], className="loading")], id="root")
@app.callback(Output("div-1", "children"), [Input("root", "n_clicks")])
def updateDiv(children):
with lock:
return "content"
with lock:
dash_dcc.start_server(app)
dash_dcc.find_element(".loading .dash-spinner")
# ensure inner component is also mounted
dash_dcc.wait_for_text_to_equal("#div-1", "")
dash_dcc.wait_for_text_to_equal("#div-1", "content")
assert dash_dcc.get_logs() == []
def add_content(self):
"""
"""
if self.html_layout:
return html.Div(
id="div-main",
children=[
dcc.Store(id="control-panel"),
dcc.Location(id="url", refresh=False),
dbc.Row(id="row-navbar",
class_name="g-0",
children=[
self._add_navbar(),
]),
dcc.Loading(
dbc.Offcanvas(class_name="w-25",
id="offcanvas-metadata",
title="Detailed Information",
placement="end",
is_open=False,
children=[dbc.Row(id="row-metadata")])),
dbc.Row(id="row-main",
class_name="g-0",
children=[
self._add_ctrl_col(),
self._add_plotting_col(),
])
])
else:
return html.Div(id="div-main-error",
children=[
dbc.Alert(
[
"An Error Occured",
],
color="danger",
),
])
def _set_layout(self):
"""
Create the layout of the app.
"""
self.app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
self._subplot_fig._fig['layout']['legend']['uirevision'] = True
self.app.layout = dbc.Container([
dbc.Row([
dbc.Col([
dcc.Loading(id='loading',
type='dot',
children=dcc.Graph(
figure=self._subplot_fig._fig,
id='fig',
style={'height': '80vh'}))
],
md=9),
dbc.Col([self._slider_component()], md=3)
])
],
fluid=True)
def _sub_layouts(self):
enable = daq.BooleanSwitch(
id=self.id("enable_transformation"),
style={
"display": "inline-block",
"vertical-align": "middle"
},
)
message = html.Div(id=self.id("message"))
description = dcc.Markdown(self.description)
options = html.Div(self.options_layouts(), id=self.id("options"))
preview = dcc.Loading(id=self.id("preview"))
if self.is_one_to_many:
ranked_list = daq.NumericInput(value=1,
min=1,
max=10,
id=self.id("ranked_list"))
else:
# if not 1-to-many, we don't need the control, we keep
# an empty container here to make the callbacks simpler
# since "ranked_list" will then always be present in layout
ranked_list = html.Div(id=self.id("ranked_list"))
return {
"options": options,
"description": description,
"enable": enable,
"message": message,
"preview": preview,
"ranked_list": ranked_list,
}
def get_layout(**kwargs):
return html.Div(
[
dcc.Markdown(
dedent(
"""
# App Dashboard
"""
)
),
html.Div(
children=[
html.H4(
[ "Select an app",],
className="app-selection-title",
),
dcc.Dropdown(
id="app-option",
options=[{
'label': i,
'value': i
} for i in get_app_options()],
value=get_app_options()[0]
),
]
),
html.Div(
children=[
html.Div(
children=[
html.H4(
["App Dependency Graph",],
className="price-heatmap-title",
),
dcc.Graph(
id="app-dag",
figure=blank_fig(),
# config={"displayModeBar": False},
)
],
style={'width': '49%', 'height': '100%', 'display': 'inline', 'text-align': 'center'},
),
html.Div(
children=[
html.Div(
children=[
dcc.Loading(
id = "loading-icon",
type="circle",
children=[
html.Div(
children=[
html.Div(
"Cost Saving: ",
style={'color': 'black', 'margin-right': 30,'fontSize': 36, 'text-align': 'justify'},
),
html.Div(
id="price-calc",
style={'color': 'black', 'fontSize': 36, 'text-align': 'justify'},
),
],
style={'flex-direction': 'row', 'display' : 'flex'},
),
]),
dcc.Loading(
id = "loading-icon",
type="circle",
children=[
html.Div(
children=[
html.Div(
"Latency reduction: ",
style={'color': 'black', 'fontSize': 36, 'text-align': 'justify'},
),
html.Div(
id="latency-calc",
style={'color': 'black', 'fontSize': 36, 'text-align': 'justify'},
),
],
style={'flex-direction': 'row', 'display' : 'flex'},
),
]),
],
),
],
style={'width': '100%', 'height': '100%','display': 'inline', 'text-align': 'center'},
),
]
),
html.Div(
children=[
html.H4(
["Clusters Locations",],
className="clusters-location-title",
),
dcc.Loading(
id = "loading-icon",
type="circle",
children=[
dcc.Graph(
id="clusters-map",
figure=blank_fig(),
# config={"displayModeBar": False},
),
]),
],
className="twelve columns pretty_container",
),
# Heat Maps
html.Div(
children=[
html.Div(
children=[
html.H4(
["Latency in ms",],
className="latency-heatmap-title",
),
dcc.Graph(
id="latency-heatmap",
figure=blank_fig(),
# config={"displayModeBar": False},
)
],
style={'width': '49%', 'display': 'inline-block'},
),
html.Div(
children=[
html.H4(
["Price per GB outbound in USD($)",],
className="price-heatmap-title",
),
dcc.Graph(
id="price-heatmap",
figure=blank_fig(),
# config={"displayModeBar": False},
)
],
style={'width': '49%', 'display': 'inline-block'},
),
]
),
# Capacity
html.Div(
children=[
html.H4(
[ "Service capacity per cluster (RPS)",],
className="app-balance-selection-title",
),
dcc.Loading(
id = "loading-icon",
type="circle",
children=[
dcc.Graph(
id="capacity-table",
figure=blank_fig(),
# config={"displayModeBar": False},
),
]),
]
),
html.Div(
children=[
html.H4(
[ "Select balancing option",],
className="app-balance-selection-title",
),
dcc.Dropdown(
id="balance-option",
options=[{
'label': i,
'value': i
} for i in get_balancing_options()] ,
value="Combined"
),
]
),
# Load
html.Div(
className="global-load",
children=[
html.H4(
["Global AVG Load",],
className="global-load-title",
),
dcc.Loading(
id = "loading-icon",
type="circle",
children=[
dcc.Graph(
id="global-load",
figure=blank_fig(),
# config={"displayModeBar": False},
),
]),
],
),
html.Div(
className="service-to-service-load",
children=[
html.H4(
["Load",],
className="service-to-service-load-title",
),
dcc.Loading(
id = "loading-icon",
type="circle",
children=[
dcc.Graph(
id="service-to-service-load",
figure=blank_fig(),
# config={"displayModeBar": False},
),
]),
],
),
#
# html.Div(
# className="services-map",
# children=[
# html.H4(
# ["Services Map",],
# className="service-map-title",
# ),
# dcc.Loading(
# id = "loading-icon",
# type="circle",
# children=[
# dcc.Graph(
# id="service-map",
# figure=blank_fig(),
# # config={"displayModeBar": False},
# ),
# ]),
# ],
# ),
]
)
],
value='Set', style={'width': '150px'}),
dcc.Dropdown(
id='meta-column', options=options,
value=None, style={'width': '150px'}),
dcc.Input(id='meta-input'),
dcc.Dropdown(
id='meta-input-bool', options=[{'value': 'True', 'label': 'True'},
{'value': 'False', 'label': 'False'}],
value=None),
html.Button('Apply', id='meta-apply'),
], style={'marginLeft': '5px'}),
dcc.Markdown('---'),
dcc.Loading( meta_table ),
html.Div(id='meta-upload-output', style={'visibility': 'hidden'}),
html.Div(id='meta-apply-output', style={'visibility': 'hidden'})
])
_outputs = html.Div(id='meta-outputs',
children=[
html.Div(id={'index': 'meta-apply-output', 'type': 'output'}),
html.Div(id={'index': 'meta-table-saved-on-edit-output', 'type': 'output'}),
]
)
def layout():
def layout():
return html.Div(
id='variantmap-body',
className='app-body',
children=[
html.Div(
id='variantmap-control-tabs',
className='control-tabs',
children=[
dcc.Tabs(
id='variantmap-tabs',
value='what-is',
children=[
# "What is" tab
dcc.Tab(
label='About',
value='what-is',
children=html.Div(
className='control-tab',
children=[
html.H4(
className='what-is',
children='What is VariantMap?'),
html.
P('VariantMap is a genomic structural variant (SV) visualization '
'technique that displays variants across multiple samples in a '
'single heatmap. Each row represents a sample and each column '
'represents an SV breakend in the sample cohort. The colors '
'indicate the class of an SV present in a sample. The '
'heatmap can be customized interactively to suit your analysis '
'by changing various components in the "Customize" tab.'
),
html.
P('VariantMap requires a dataframe object that is generated by '
'VariantBreak. Do note that only NanoVar VCF '
'files are currently compatible to work with VariantBreak in creating the '
'dataframe.')
])),
# Data tab
dcc.Tab(
label='Data',
value='data',
children=html.Div(
className='control-tab',
children=[
# Dataset upload
html.Div(
'Upload dataset:',
title=
'Upload your own dataset below.',
className='app-controls-name'),
html.Div(
id='variantmap-file-upload',
title=
'Upload your own VariantBreak generated HDF5 dataset here.',
children=[
dcc.Upload(
id='upload-data',
className='control-upload',
children=html.Div([
"Drag and drop your .h5 file or ",
html.A("select file.")
]),
accept='.hdf5,.h5',
multiple=False)
]),
html.Br(),
# Label file upload
html.Div(
'Upload label file:',
title=
'This file is used to rename and sort samples.\nExample:\n#Default '
'name<tab>Label\nS1<tab>SampleA\nS3<tab>SampleC\nS2<tab>SampleB',
className='app-controls-name'),
html.Div(
id='variantmap-tsv-upload',
title=
'Upload a .tsv file to rename and sort samples.\nExample:\n#Default '
'name<tab>Label\nS1<tab>SampleA\nS3<tab>SampleC\nS2<tab>SampleB',
children=[
dcc.Upload(
id='upload-tsv',
className='control-upload',
children=html.Div([
"Drag and drop your .tsv file or ",
html.A("select file.")
]),
accept='.txt,.tsv,.csv',
multiple=False)
]),
html.Br(),
# Sample selection check boxes
html.Div(
id='output-data-info',
className=
'fullwidth-app-controls-name',
children=[
dcc.Checklist(
id="select-samples",
style={'display': 'none'}),
html.Br(),
html.Button(
id='submit-button-samples',
style={'display': 'none'})
])
])),
# Customize tab
dcc.Tab(
label='Customize',
value='customize',
children=html.Div(
className='control-tab',
children=[
html.Div(
id='customize-tab',
className=
'fullwidth-app-controls-name',
children=[
dcc.Dropdown(
id='sample_filt',
style={'display': 'none'}),
dcc.Dropdown(
id='file_filt',
style={'display': 'none'}),
dcc.Dropdown(
id='gene_names',
style={'display': 'none'}),
dcc.Input(
id='input_index',
style={'display': 'none'}),
dcc.Checklist(
id="select-genetype",
style={'display': 'none'}),
dcc.Checklist(
id="select-feature",
style={'display': 'none'}),
dcc.Checklist(
id="select-annotation",
style={'display': 'none'}),
dcc.Input(
id='entries_size',
style={'display': 'none'}),
html.Button(
id='submit-button',
style={'display': 'none'})
])
])),
# Variant info tab
dcc.Tab(
label='Variant info',
value='info',
children=html.Div(
className='control-tab',
children=[
html.Div(
id='info-tab',
className=
'fullwidth-app-controls-name',
children=[
html.Div(
'Click on variant to display its information'
)
])
]))
])
]),
dcc.Loading(
className='dashbio-loading',
children=html.Div(
id='variantmap-wrapper',
children=[
# Error message box
html.Div(id='error-msg',
style={
'color': 'crimson',
'text-align': 'center',
'font-size': '18px'
}),
# Plot VariantMap figure
html.Div(id='variantmap-fig',
children=[
html.Div(dcc.Graph(id='variantmap'),
style={'display': 'none'})
]),
# Plot Slider
html.Div(id='batch-slider',
children=[
html.Div('',
style={
'textAlign': 'center',
}),
html.Div(dcc.Slider(id='slider', ),
style={'display': 'none'})
])
])),
# Create Store component to store JSON of dataframe and metadata
dcc.Store(id='memory'),
# To store variant counts
dcc.Store(id='count-store'),
# To store custom settings
dcc.Store(id='custom-store'),
# To store name dictionary
dcc.Store(id='name_dict'),
# To store sample labels
dcc.Store(id='sample_labels'),
# To store sample order
dcc.Store(id='sample_order')
])
def get_content():
# The data will be pivoted by session to show a row per session and
# a column per scan/assessor type,
# the values in the column a string of characters
# that represent the status of one scan or assesor,
# the number of characters is the number of scans or assessors
# the columns will be the merged
# status column with harmonized values to be red/yellow/green/blue
df = data.load_data()
#print(df)
dfp = qa_pivot(df)
qa_graph_content = get_graph_content(dfp)
# Get the rows and colums for the table
qa_columns = [{"name": i, "id": i} for i in dfp.index.names]
dfp.reset_index(inplace=True)
qa_data = dfp.to_dict('rows')
qa_content = [
dcc.Loading(id="loading-qa", children=[
html.Div(dcc.Tabs(
id='tabs-qa',
value='1',
children=qa_graph_content,
vertical=True))]),
html.Button('Refresh Data', id='button-qa-refresh'),
dcc.Dropdown(
id='dropdown-qa-time',
# Change filters to "Today", "this week", "last week",
#"this month", "last month", "YTD", "past year", "last year"
options=[
{'label': 'all time', 'value': 'ALL'},
{'label': '1 day', 'value': '1day'},
{'label': '1 week', 'value': '7day'},
{'label': '1 month', 'value': '30day'},
#{'label': 'this week', 'value': 'thisweek'},
#{'label': 'this month', 'value': 'thismonth'},
{'label': 'last month', 'value': 'lastmonth'},
{'label': '1 year', 'value': '365day'}],
value='ALL'),
dcc.RadioItems(
options=[
{'label': 'Group by Project', 'value': 'PROJECT'},
{'label': 'Group by Site', 'value': 'SITE'}],
value='PROJECT',
id='radio-qa-groupby',
labelStyle={'display': 'inline-block'}),
dcc.Dropdown(
id='dropdown-qa-proj', multi=True,
placeholder='Select Project(s)'),
dcc.Dropdown(
id='dropdown-qa-sess', multi=True,
placeholder='Select Session Type(s)'),
dcc.Dropdown(
id='dropdown-qa-proc', multi=True,
placeholder='Select Processing Type(s)'),
dcc.Dropdown(
id='dropdown-qa-scan', multi=True,
placeholder='Select Scan Type(s)'),
dt.DataTable(
columns=qa_columns,
data=qa_data,
filter_action='native',
page_action='none',
sort_action='native',
id='datatable-qa',
style_table={'overflowY': 'scroll', 'overflowX': 'scroll'},
style_cell={
'textAlign': 'left',
'padding': '5px 5px 0px 5px',
'width': '30px',
'overflow': 'hidden',
'textOverflow': 'ellipsis',
'height': 'auto',
'minWidth': '40',
'maxWidth': '60'},
style_header={
#'width': '80px',
'backgroundColor': 'white',
'fontWeight': 'bold',
'padding': '5px 15px 0px 10px'},
fill_width=False,
export_format='xlsx',
export_headers='names',
export_columns='visible')]
return qa_content
'padding': '0px',
'margin-bottom': '20px',
'display': 'inline-block',
}),
html.Button('Import from URL', id='ms-import-from-url'),
dcc.Input(id='url',
placeholder='Drop URL / path here',
style={'width': '100%'}),
dcc.Markdown('---', style={'marginTop': '10px'}),
dcc.Markdown('##### Actions'),
html.Button('Convert to Feather', id='ms-convert'),
html.Button('Delete selected files',
id='ms-delete',
style={'float': 'right'}),
html.Div(id='ms-n-files'),
dcc.Loading(ms_table),
html.Div(id='ms-uploader-fns', style={'visibility': 'hidden'}),
])
_outputs = html.Div(id='ms-outputs',
children=[
html.Div(id={
'index': 'ms-convert-output',
'type': 'output'
}),
html.Div(id={
'index': 'ms-delete-output',
'type': 'output'
}),
html.Div(id={
'index': 'ms-save-output',
from Comparison import plots as p
from Comparison.selection_card import selection
# Selection
selection_health, selection_workout = selection()
# connection with database
rdb = connect_db()
layout = html.Div([
dbc.Row([dbc.Col(selection_health)]),
html.Br(),
dbc.Row([
dbc.Col(
dbc.Card(dcc.Loading(dcc.Graph(id='scatter_plot')),
style={'height': '100%'}))
]),
html.Br(),
dbc.Row([
dbc.Col(dbc.Card(dcc.Loading(dcc.Graph(id='box_plot')),
style={'height': '100%'}),
lg=6),
dbc.Col(dbc.Card(dcc.Loading(dcc.Graph(id='histogram_plot')),
style={'height': '100%'}),
lg=6)
]),
html.Br(),
dbc.Row([
dbc.Col(dbc.Card(dcc.Loading(dcc.Graph(id='linear_plot')),
style={'height': '100%'}),
),
],
),
html.Button(id='itinerary-start',
n_clicks=0,
children='Create itinerary'),
# dbc.Spinner(),
html.Div([html.H3(id='output_address')])
],
),
html.Div(
id='map-container',
# style = {'zIndex':1},
children=[
dcc.Loading(id="loading-1",
type="default",
children=html.Div(id="loading-output-1")),
dcc.Graph(
id='map-route',
figure=dict(
data=[
dict(type='scattermapbox',
marker=[
dict(size=0,
color='white',
opacity=0)
])
],
layout=dict(
margin={
"r": 0,
dcc.Loading(type='dot',
className='loading-anim align-self-center',
children=[
dcc.
Graph(id='graph-inputs',
className='six columns',
figure={
'data': [{
'x': state['t'],
'y': state['i'],
'name': 'I',
'mode': 'lines'
}, {
'x': state['t'],
'y': state['q'],
'name': 'Q',
'mode': 'lines'
}],
'layout': {
'title':
'Input Signal',
'xaxis': {
'title': 'Time (s)'
},
'yaxis': {
'title': 'Normalised Amplitude'
},
'height':
350,
'margin':
dict(l=50, r=0, b=50, t=50, pad=4),
'legend':
dict(
yanchor="bottom",
y=1,
xanchor="right",
x=1,
),
'shapes': [{
'type': 'circle',
'name': 'envelope_' + str(i),
'x0': -5,
'x1': 5,
'xref': 'x',
'xanchor': x,
'xsizemode': 'pixel',
'y0': -5,
'y1': 5,
'yref': 'y',
'yanchor': y,
'ysizemode': 'pixel',
'fillcolor': '#001EB4',
'opacity': 0.9,
'line': {
'width': 5,
'color': '#001EB4',
'opacity': 0.9,
}
} for (i, (x, y)) in enumerate(state[
'handle_pos'])]
}
},
config={
'editable': True,
'edits': {
'shapePosition': True
}
})
])
html.Div(id='pko-peak-preview-images',
style={
"maxHeight": "630px",
"overflowX": "scroll",
'padding': 'auto'
}),
dcc.Markdown('---'),
html.Div(id='pko-controls'),
dcc.Dropdown(id='pko-dropdown', options=[], value=None),
dbc.Progress(id="pko-progress-bar",
value=0,
style={
'marginBottom': '20px',
'width': '100%'
}),
dcc.Loading(dcc.Graph('pko-figure')),
dcc.Checklist(id='pko-figure-options',
options=[{
'value': 'log',
'label': 'Logarithmic y-scale'
}],
value=[]),
html.Button('Set RT to current view', id='pko-set-rt'),
html.Button('Find largest peak', id='pko-find-largest-peak'),
html.Button('Confirm retention time', id='pko-confirm-rt'),
html.Button('Remove Peak', id='pko-delete', style={'float': 'right'}),
html.Div(id='pko-image-clicked'),
html.Div(children=[
html.Button('<< Previous', id='pko-prev'),
html.Button('Suggest', id='pko-suggest-next'),
html.Button('Next >>', id='pko-next')
day_of_week = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]
# Selection
selection = selection()
cards = cards_view()
information = patient_information()
layout = html.Div([
dbc.Row(dbc.Col(selection)),
html.Br(),
dbc.Row([
dbc.Col(dbc.Card(information, style={'height': '100%'}), lg=4),
dbc.Col([dcc.Loading(dbc.Row([dbc.Col([card for card in cards])]))], lg=8)]),
html.Br(),
dbc.Row([
dbc.Col(dbc.Card(
dcc.Loading(dash_table.DataTable(
id='table',
style_table={'overflowX': 'auto'},
page_size=9,
filter_action='native',
sort_action="native",
sort_mode="multi",
style_data_conditional=[
{
'if': {'row_index': 'odd'},
'backgroundColor': 'rgb(248, 248, 248)'