upload_box <- function(width = 12, collapsible = T, collapsed = T,   # TODO: find a way to include all potential arguments
                       height = '600px') {  
  box(
    title = HTML('<p style="font-size:120%;">Upload Data</p>'), 
    width = width, height = height, collapsed = collapsed, collapsible = collapsible, 
    solidHeader = T, status = "primary", 
    sidebarPanel(
      width = 12,
      selectInput('upload.data_format',
                  label = "Please choose the format of your datasets",
                  choices = c(AUTOMATIC, TWO_COL),
                  selected = AUTOMATIC, width = '60%') %>%
        shinyInput_label_embed(
          custom_icon("info") %>%
            bs_embed_tooltip(
              title = "The IOHprofiler, COCO and Nevergrad formats can be automatically detected."
            )
        ),

      selectInput('upload.maximization',
                  label = "Maximization or minimization?",
                  choices = c(AUTOMATIC,"MAXIMIZE", "MINIMIZE"),
                  selected = AUTOMATIC, width = '60%') ,
      
      HTML('<p align="justify" style="font-size:120%;">When the dataset is huge, 
           the alignment can take a very long time. In this case, you could toggle 
           the efficient mode to subsample the dataset. However, 
           the precision of data will be compromised.</p>'),
      
      checkboxInput('upload.subsampling', 
                    label = HTML('<p align="left">
                                 Efficient mode</p>'), 
                    value = F),

      fileInput("upload.add_zip", 
                label = HTML('<p align="left">
                             Please choose a <i>zip file</i> containing the 
                             benchmark data</p>'),
                multiple = TRUE, accept = c("Application/zip", ".zip",
                                            ".csv", 'bz2', 'bz', 'gz', 'tar', 'tgz', 'tar.gz', 'xz')),

      actionButton('upload.remove_data', 
                   label = HTML('<p align="center" style="margin-bottom:0;"><b> 
                   Remove all the data</b></p>'))
      )
    )
}

upload_prompt_box <- function(width = 12, collapsible = T, collapsed = T) {
  box(title = HTML('<p style="font-size:120%;">Data Processing Prompt</p>'),
      width = width, solidHeader = T, status = "primary",
      collapsible = collapsible, collapsed = collapsed,

      verbatimTextOutput('process_data_promt'),
      # modifying CSS for 'process_data_promt'
      tags$head(tags$style("#process_data_promt{
                           color:black; font-size:12px; font-style:italic;
                           max-height: 500px;
                           overflow-y:visible; overflow-x: auto;
                           white-space: pre-wrap;
                           white-space: -moz-pre-wrap;
                           white-space: -pre-wrap;
                           white-space: -o-pre-wrap;
                           word-wrap: normal;
                           background: ghostwhite;}"))
      )
}

data_list_box <- function(width = 12, collapsible = T, collapsed = T) {
  box(
    title = HTML('<p style="font-size:120%;">List of Processed Data</p>'),
    width = width, solidHeader = T, status = "primary",
    collapsible = collapsible, collapsed = collapsed,
    dataTableOutput('data_info')
  )
}

repository_box <- function(width = 12, collapsible = F, collapsed = T, 
                           height = '600px') {
  box(
    title = HTML('<p style="font-size:120%;">Load Data from Repository</p>'), 
    width = width, height = height, collapsed = collapsed, collapsible = collapsible,
    solidHeader = T, status = "primary",  
    sidebarPanel(
      width = 12,
      
      HTML_P("Load the data from the available repositories. There are currently three available sources:
             <ul>
                <li>
                  Data generated with the PBO-suite, implemented in the <a href=https://github.com/IOHprofiler/IOHexperimenter>IOHexperimenter</a>
                </li>
                <li>
                  All data generated by the <a href=https://github.com/facebookresearch/nevergrad>nevergrad</a> benchmarking framework
                </li>
                <li>
                  The majority of the publicly available benchmark data on the single-objective <a href=https://github.com/numbbo/coco>BBOB</a> framework
                </li>"),
      
      selectInput('repository.type', label = "Select the dataset source",
                  choices = NULL, selected = NULL, width = '50%'),
      
      selectInput('repository.dataset', 
                  label = "Select the dataset",
                  choices = NULL, selected = NULL, width = '50%', multiple = T),

      selectInput('repository.funcId', 
                  label = "Please choose the function",
                  choices = NULL, selected = NULL, width = '50%', multiple = T),
      
      selectInput('repository.dim', 
                  label = "Please choose the dimension",
                  choices = NULL, selected = NULL, width = '50%', multiple = T),
      
      selectInput('repository.algId', 
                  label = "Please choose the algorithm",
                  choices = NULL, selected = NULL, width = '50%', multiple = T),
      
      shinyjs::disabled(
        actionButton('repository.load_button', 'load data')
      )
    )
  )
}

welcome_bar <- function(width = 12, collapsible = T, collapsed = F) {
  box(
    title = HTML('<p style="font-size:140%;">Welcome to IOHanalyzer!</p>'),
    width = width, collapsed = collapsed, collapsible = collapsible,
    solidHeader = T, status = "primary",  
    mainPanel(
      width = 12, 
      HTML(paste0(
        '<font size="4">',
        includeMarkdown('markdown/welcome.md'),
        '</font>')
      )
    )
  )
}

