def Homepage():
layout = html.Div(children=[
nav,html.H5(id='fedbk'),html.Canvas(id='yes',height=1080,width=1920,style={'background-image':'url("assets/2.jpg")',
'background-repeat': 'no-repeat',
'background-size': '85% 75%'
})
])
return layout
def setTopology(self, types, names, x, y, operatesFrom, operatesTo, style):
divList = [html.Canvas(id="fabricjs-canvas", style=style)]
tList = []
for i in range(len(names)):
id = "fabricjs-" + types[i] + '-' + names[i] + '-' + str(
x[i]) + '-' + str(
y[i]) + '-' + operatesFrom[i] + '-' + operatesTo[i]
tList.append(html.Div(id=id))
divList.append(html.Div(tList, id="fabricjs-objects-container"))
self.setDashRendering(
html.Div(divList, id="fabricjs-canvas-container", style=style))
className="sliderContainer"),
html.Div([
html.A('Nightlife:', className='preferencesText'),
dcc.RangeSlider(id='nightlifeSlider',
min=0,
max=10,
value=[5],
step=1,
marks={
0: '0',
5: '5',
10: '10'
},
className='slider')
],
className="sliderContainer"),
],
id="preferences_div",
className="paddings"),
html.Div(
[html.Canvas(id="map", width='900', height='400')],
id='map-div',
)
],
id='map-section',
className='col-12')
],
className='body',
)
])
'name': 'viewport',
'content': 'width=device-width, initial-scale=1.0'
}])
app.title = 'Pose Estimation Demo'
app.layout = html.Div([
html.Div(id='start-target'),
html.Div(id='stop-target'),
dbc.Button("Start Recording", id="demo-start-recording"),
dbc.Button("Stop Recording", id="demo-stop-recording"),
html.Video(id='demo-video',
width=600,
height=500,
autoPlay=True,
controls=False),
html.Canvas(id='demo-output'),
html.Div(id='poses', style={'display': 'block'}),
dcc.Interval(id='interval', interval=2000)
])
app.clientside_callback(
"""
function () {
return sessionStorage.getItem('cachePoses');
}
""", Output('poses', 'children'), [Input('interval', 'n_intervals')])
app.clientside_callback(
ClientsideFunction(namespace='posenet',
function_name='start_estimating_poses'),
Output('start-target', 'children'),
block=True),
visdcc.Run_js(id='guiajs'),
]),
]),
]),
],
style={"width": "100%"},
)
],
width=8),
dbc.Col([
dbc.Card(
[
dbc.CardHeader(html.H6("Mordida")),
dbc.CardBody([
html.Canvas(id='canvasMordida'),
]),
],
style={"width": "100%"},
),
dbc.Card(
[
dbc.CardHeader(
html.H6("Cuña de medición")),
dbc.CardBody([
html.Canvas(id='canvasCuna'),
]),
],
style={"width": "100%"},
),
dbc.Card(
import dash_bootstrap_components as dbc
import dash_html_components as html
from data.others.home_background_script import script
import visdcc
from building_blocks import *
from callbacks import *
prefix="home"
print("Loading "+prefix.capitalize()+" ...")
layout=dbc.Col([
dbc.Col([
html.Canvas(id="fancy-network-background",style={"position":"absolute", "width":"100%", "height":"66vh", "padding":"0px", "z-index":"0"}),# "background": "linear-gradient(to top, rgba(230,245,249,0), rgba(230,245,249,0.5))"
visdcc.Run_js(id="fancy_network_background_script", run=script),
# html.Center(html.H1(html.Strong("COVIDrugNet"))),
dbc.Row([
dbc.Col([
html.Img(src=app.get_asset_url("imgs/logo_wide.svg"), alt="COVID-19 Drugs Networker", style={"width":"100%"}),
], xs=10, lg=6, align="center", style={"position":"relative","z-index":"1"}),
dbc.Col([
html.P("Visualize and Analyze Networks about Drugs and Targets Related to COVID-19", style={"text-align":"center","font-size":"x-large","font-weight":"bold","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem"}),
html.P("COVIDrugNet is a free and open web tool", style={"text-align":"center","font-size":"large","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem", "margin-bottom":0}),
html.P("based on networks and designed to support the exploration and investigation of the landscape of medicines currently in clinical trial for the treatment of COVID-19", style={"text-align":"center","font-size":"large","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem", "margin-bottom":0}),
html.P(["(according to ",html.A("DrugBank Dashboard dedicated to COVID-19", href="https://go.drugbank.com/covid-19", target="_blank", style={"color":"black"}),")"], style={"text-align":"center","font-size":"medium","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem"})
], xs=10, lg=3, align="center", style={"position":"relative","z-index":"1"})
], justify="center", align="center", style={"padding-top":"7.5vh", "padding-bottom":"7.5vh"}),
# html.Center(html.H4("Visualize and Analyze Networks about Drugs and Targets Related to COVID-19")),
dbc.Row([
def setTopologyRedactor(self, types, names, x, y, operatesFrom, operatesTo,
style):
divList = [html.Canvas(id="fabricjs-canvas", style=style)]
tList = []
for i in range(len(names)):
id = "fabricjs-" + types[i] + '-' + names[i] + '-' + str(
x[i]) + '-' + str(
y[i]) + '-' + operatesFrom[i] + '-' + operatesTo[i]
tList.append(html.Div(id=id))
divList.append(html.Div(tList, id="fabricjs-objects-container"))
self.setDashRendering(
html.Div([
html.Div(divList, id="fabricjs-canvas-container", style=style),
html.Div([
'Add Component:',
html.Button(
'Reservoir',
id="fabricjs-add-reservoir",
name="fabricjs-add-reservoir",
style={
'backgroundColor': 'white',
'boxShadow':
'0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)',
'fontSize': '0.7vmax',
'marginTop': '1vh',
'width': '15vw'
}),
html.Button(
'Turbine',
id="fabricjs-add-turbine",
name="fabricjs-add-turbine",
style={
'backgroundColor': 'white',
'boxShadow':
'0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)',
'fontSize': '0.7vmax',
'marginTop': '1vh',
'width': '15vw'
}),
html.Button(
'Pump',
id="fabricjs-add-pump",
name="fabricjs-add-pump",
style={
'backgroundColor': 'white',
'boxShadow':
'0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)',
'fontSize': '0.7vmax',
'marginTop': '1vh',
'width': '15vw'
}),
html.Button(
'Flow',
id="fabricjs-add-flow",
name="fabricjs-add-flow",
style={
'backgroundColor': 'white',
'boxShadow':
'0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)',
'fontSize': '0.7vmax',
'marginTop': '1vh',
'width': '15vw'
}),
],
style={
'display': 'flex',
'flexDirection': 'row'
}),
html.Button(
'Save',
id="fabricjs-redactor-save",
name="fabricjs-redactor-save",
style={
'backgroundColor': 'white',
'boxShadow':
'0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)',
'fontSize': '0.7vmax',
'marginTop': '1vh',
'width': '15vw'
}),
],
id="fabricjs-redactor"))