conditionalPanel(condition='output.showPanels',
fixedPage(
HTML("<div style='width:1048px;'>"),
fixedRow(
column(12,
height = "50px",
helpPopup("Help: Feature Table",
id="helpFT",
content = "Below you will find your uploaded
data represented as an interactive table.
If the uploaded table contains more than one
measured value per well,
only the first one will be shown by default.
Measured values can be added to the table
by selecting them from the list below
('select channel') or using the button below (to select all channels).
If the shown table contains more than one measured
value per well, a reactive heatmap of
selected rows (select/unselect rows by clicking)
can be created. Buttons to select more than one row at a time
and to delete the entire selection are provided
below the table.",
iconClass = "fa fa-question"),
tags$style(type='text/css',"#helpFT {
margin-top: 25px;}")
)
),
#Reset Button & Downloads
HTML("<div style='width:1048px;'>"),
fixedRow(
column( 3,
style="vertical-align: middle;",
uiOutput("features_ft")
),
column(3),
column(1,
helpPopup("Attention:",
id="helpDowFT",
content = "Depending on the size of the table,
the download might take several minutes. The
table will be downloaded as a .csv table
with columns separated by ',' and '.' as
decimal separator.",
iconClass = "fa fa-exclamation"
),
tags$style(type='text/css',"#helpDowFT {
margin-top: 38px;
margin-left:50px;")
),
column( 2,
style="vertical-align: middle;",
downloadButton( 'downloadFeatureTable',
label = h6("click to download")),
tags$style(
type='text/css',
"#downloadFeatureTable { margin-top:25px;
margin-left:-10px;}")
),
column( 3,
style="vertical-align: middle;",
textInput("filnameFeatureTable",
label = h6("Enter Filename"),
placeholder = "filename"),
tags$style(
type='text/css',
"#filnameFeatureTable { margin-left:-50px;
margin-right:50px}")
)
),
# #Spacer row
HTML("</div>"),
HTML("<div style='height: 25px;'>"),
HTML("</div>"),
HTML("<div style='width:1048px;'>"),
fixedRow(
column( 3,
style="vertical-align: middle;",
actionButton( 'selectAllFeatures',
label="Or click to select all channels")
)
),
#Spacer row
HTML("</div>"),
HTML("<div style='height: 50px;'>"),
HTML("</div>"),
#Feature Table
HTML("<div style='width:1000px;'>"),
fixedRow(
column( 12,
div(style = 'overflow-x: scroll',
DT::dataTableOutput('featureTable') )
)
),
HTML("</div>"),
#Spacer row
HTML("</div>"),
HTML("<div style='height: 50px;'>"),
HTML("</div>"),
#Heatmap
HTML("<div style='width:1000px;'>"),
fixedRow(
conditionalPanel(condition='output.showSelectAll',
column(4,
actionButton("selectAllRows",
label = "Click to select all rows from the filtered table"),
tags$style(HTML(
"#selectAllRows { margin-top:25px;
margin-bottom: 25px;"))
),
helpPopup("Help: Select Rows",
id="helpSR",
content = "Rows to be shown in the heatmap can either be selected
manually by clicking on single rows, or
by clicking the button on the left. This
will select all rows of the current table as shown above
(if the shown table has less than 500 rows).
Note: If rows are selected cumulatively, the table will be refreshed
without previously set filters. The selected rows are highlighted.
The entire selection can be reset
with the 'reset' button.",
iconClass = "fa fa-question"),
tags$style(type='text/css',"#helpSR {
margin-top: 25px;}"),
column(3,
actionButton( 'resetSelection',
label="Click to reset row selection"),
tags$style(
type='text/css',
"#resetSelection { margin-top: 25px;
margin-bottom: 25px;}")
),
column(5)
),
conditionalPanel(condition='output.hideFt',
column(12,
align="center",
htmlOutput("textFtDummy"),
tags$style(HTML(
"#textFtDummy { margin-top:50px;
margin-bottom:50px;
font-size:12px;"))
)
),
conditionalPanel(condition='output.showFt',
column( 12,
plotOutput('featureHeatmap'),
tags$style(HTML(
"#featureHeatmap {
margin-bottom:100px;"))
)
),
conditionalPanel(condition='output.showFt',
column(3,
radioButtons( 'scaleFTheatmap',
label = h6("Coose scaling method"),
choices = c("none" = "none",
"row" = "row",
"column" = "column"),
selected = "none",
inline = T )
),
column(1,
helpPopup("Help: Heatmap Scaling",
id="helpScaleFT",
content = "By default ('none') the
color scale of the heatmap is spanned
between the minimum and maximum value of the
all data points. If 'row/column'
is set, the values will be centered and
scaled per row/column. See the documentation
of the R package heatmap.2 for more
details.",
iconClass = "fa fa-question"),
tags$style(type='text/css',"#helpScaleFT {
margin-top: 25px;}")),
column(4),
column(4,
textInput( 'fileNameFTheatmap',
label = h6('Enter filename'),
placeholder = "filename") ,
radioButtons( 'fileFormatFTheatmap',
label = h6("Coose file format"),
choices = c(".png" = ".png",
".tiff" = ".tiff",
".jpeg" = ".jpeg"),
selected = ".png",
inline = T ),
downloadButton('downloadFTheatmap',
'Click to Download Plot'),
tags$style(type='text/css',
"#downloadFTheatmap { margin-bottom:25px;")
)
)
),
HTML("</div>")
)#end of fixedPage
)#end of conditional panel
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.