inst/shiny_app/ui.R

In shutinet/metabSeek: Search in several databases metabolites masses or spectras

#' @title Shiny app ui page
#'
#' @description
#' ui part if the shiny app
#'

header <- shinydashboard::dashboardHeader(
    disable = TRUE
)

sidebar <- shinydashboard::dashboardSidebar(disable = TRUE)
    
body <- shinydashboard::dashboardBody(fluidPage(
    shiny::tags$head(
        shiny::tags$link(rel = "stylesheet", type = "text/css", href = "style.css"), 
        shiny::tags$script(src = "smiles-drawer.min.js"),
        shiny::tags$script(src = "func.js"),
        shinytoastr::useToastr(),
        shinyFeedback::useShinyFeedback()
    ),
    
    shinydashboard::box(width = 12, 
        shiny::tags$table(id = "inputs-table", 
            shiny::tags$tr(
                shiny::tags$td(style = "width: 10%", 
                    shiny::numericInput("mz", "m/z", value = NA)
                ),
                shiny::tags$td(style = "width: 10%", 
                    shiny::numericInput("tol", "mass tolerance", value = 5)
                ),
                shiny::tags$td(style = "width: 10%", 
                    shinyWidgets::switchInput("unit", "", value = TRUE, 
                        onLabel = "ppm", offLabel = "mDa")
                ),
                shiny::tags$td(style = "width: 10%", 
                    shinyWidgets::switchInput("polarity", "Polarity", value = TRUE, 
                        onLabel = "NEG", offLabel ="POS")
                ),
                shiny::tags$td(style = "width: 60%", 
                    shiny::selectizeInput("adducts", "adducts", choices = c(), 
                        selected = c(), multiple = TRUE, options = 
                        list(plugins = list("remove_button")))
                )
            )
        )
    ),
    shinydashboard::box(width = 6, 
        shinycssloaders::withSpinner(DT::dataTableOutput("hits"))
    ),
    shiny::column(width = 3, 
        shinydashboard::box(title = "Databases", width = 12, 
            plotly::plotlyOutput("piechart_databases", height = "29vh")
        ),
        shinydashboard::box(title = "Adducts", width = 12, 
            plotly::plotlyOutput("piechart_adducts", height = "29vh")
        )
    ),
    shiny::column(width = 3, 
        shinydashboard::box(width = 12, 
            shiny::tags$div(style = 'height: 33.5vh;', 
                shiny::tags$canvas(id = "chem_struct")
            )
        ),
        shinydashboard::box(width = 12)
    )
))

shinydashboard::dashboardPage(
    header,
    sidebar, 
    body    
)