Adding progress to material_file_input

DESCRIPTION

@@ -13,7 +13,11 @@ Maintainer: Eric Anderson <eric.ray.anderson@gmail.com>
 Description: Allows shiny developers to incorporate UI elements based on Google's Material design. See <https://material.io/guidelines/> for more information.
 URL: https://ericrayanderson.github.io/shinymaterial/
 License: GPL-3 | file LICENSE
-Imports: shiny (>= 0.7.0), jsonlite, sass
+Imports: 
+    shiny (>= 0.7.0),
+    jsonlite,
+    sass,
+    shinyjs
 Encoding: UTF-8
 LazyData: true
-RoxygenNote: 7.1.0
+RoxygenNote: 7.1.1

NAMESPACE

@@ -40,4 +40,4 @@ export(update_material_radio_button)
 export(update_material_slider)
 export(update_material_switch)
 export(update_material_text_box)
-
+export(activate_material_side_nav_tab)

R/activate_material_side_nav_tab.R

@@ -0,0 +1,28 @@
+#' Update the active side nav tab from the code.
+#'
+#' Update the active side nav tab from the code.
+#' @param side_nav_tab_id The side_nav_tab_id of the material_side_nav_tab_content to be shown.
+#' @importFrom shinyjs runjs
+#' @seealso \code{\link{material_side_nav_tab_content}}
+#' @examples
+#' \dontrun{
+#' activate_material_side_nav_tab(
+#'   input_id = "example_material_side_nav_tab_content",
+#' )
+#' }
+activate_material_side_nav_tab <- function(side_nav_tab_id) {
+
+  js_code <- paste0(
+    "$('.shiny-material-side-nav-tab-content').hide();",
+    "$('.shiny-material-side-nav-tab-content').trigger('hide');",
+    "$('.shiny-material-side-nav-tab-content').trigger('hidden');",
+    "$('.shiny-material-side-nav-tab').removeClass('active');",
+    "$('#", side_nav_tab_id, "').show();",
+    "$('#", side_nav_tab_id, "').trigger('show');",
+    "$('#", side_nav_tab_id, "').trigger('shown');",
+    "$('#", side_nav_tab_id, "_tab_id').addClass('active');",
+    "$('#side_nav_tabs_click_info').trigger('click');"
+  )
+
+  shinyjs::runjs(js_code)
+}

R/shiny-material-file-input.R

@@ -78,28 +78,39 @@ material_file_input <- function(input_id,
     material_tag_list =
       shiny::tagList(
         shiny::tags$div(
-          class = "file-field input-field",
+          class = "form-group",
           shiny::tags$div(
-            class = "btn",
-            style = 
-              ifelse(
-                is.null(color),
-                "",
-                paste0("background-color:", color)
-              ),
-            shiny::tags$span(label),
-            shiny::tags$input(
-              id = input_id,
-              class = "shiny-material-file-input",
-              type = "file"
+            class = "file-field input-field input-group",
+            shiny::tags$div(
+              class = "btn",
+              style = 
+                ifelse(
+                  is.null(color),
+                  "",
+                  paste0("background-color:", color)
+                ),
+              shiny::tags$span(label),
+              shiny::tags$input(
+                id = input_id,
+                class = "shiny-material-file-input",
+                type = "file"
+              )
+            ),
+            shiny::tags$div(
+              class = "file-path-wrapper",
+              shiny::tags$input(
+                class = "file-path validate",
+                type="text",
+                name = paste0("shiny-material-file-path-wrapper-", input_id)
+              )
             )
           ),
           shiny::tags$div(
-            class = "file-path-wrapper",
-            shiny::tags$input(
-              class = "file-path validate",
-              type="text",
-              name = paste0("shiny-material-file-path-wrapper-", input_id)
+            id = paste0(input_id,"_progress"),
+            class="progress shiny-file-input-progress",
+            style="height:20px",
+            shiny::tags$div(
+              class="progress-bar determinate"
             )
           )
         ),