Mapping refactor

R/mod_mappingTab.R

@@ -38,20 +38,29 @@ mappingTabUI <- function(id, meta, domainData, mappings=NULL, standards=NULL){
     current_mapping <- mappings %>% filter(domain %in% !!domains[i]) %>% select(-"domain")
     current_standard <- standards[[domain]]
     domain_ui[[i]] <-div(class="mapping-domain",
-    div(class="domain-header",
-      span(class="domain-title", str_to_upper(domain)),
-      div(class="domain-wrap",
-          span(class="domain-label", "Dimension"),
-          span(class="domain-value", paste(dim(domainData[[domain]]),collapse="x"))
+      div(class="domain-header",
+        span(class="domain-title", str_to_upper(domain)),
+        div(class="domain-wrap",
+            span(class="domain-label", "Dimension"),
+            span(class="domain-value", paste(dim(domainData[[domain]]),collapse="x")),
+        ),
+        div(class="domain-wrap",
+            span(class="domain-label", "Standard"),
+            span(class="domain-value", current_standard[["label"]])
+        )
       ),
-      div(class="domain-wrap",
-          span(class="domain-label", "Standard"),
-          span(class="domain-value", current_standard[["label"]])
+      div(class="domain-body row",
+        div(class="domain-controls col-md-3", mappingDomainUI(ns(domain), current_meta, domainData[[domain]], current_mapping)),
+        div(class="domain-preview col-md-9", DT::DTOutput(ns(paste0(domain,"-preview"))))
       )
-    ),
-    mappingDomainUI(ns(domain), current_meta, domainData[[domain]], current_mapping)
     )
   }
+  domain_ui<- list(      
+    checkboxInput(ns("toggleData"), "Show Data Previews?", TRUE),
+    br(),
+    domain_ui
+  )
+
   return(domain_ui)
 }
 
@@ -67,6 +76,8 @@ mappingTabUI <- function(id, meta, domainData, mappings=NULL, standards=NULL){
 #' 
 #' @return list of mappings for all domains
 #'
+#' @import shinyjs
+#' 
 #' @export
 
 mappingTab <- function(input, output, session, meta, domainData){
@@ -79,6 +90,30 @@ mappingTab <- function(input, output, session, meta, domainData){
     message("No data sets provided for the following domains listed in metadata: ",paste(domains_noData, collapse=", "))
   }
 
+  observeEvent(input$toggleData,{
+    if(input$toggleData){
+      shinyjs::addClass(class="col-md-3", selector = ".domain-controls")
+      shinyjs::show(selector = ".domain-body .domain-preview")
+    }else{
+      shinyjs::removeClass(class="col-md-3", selector = ".domain-controls")
+      shinyjs::hide(selector = ".domain-body .domain-preview")
+    }
+  })
+
+  #show data previews
+  lapply(domain_ids, function(domain){
+    output[[paste0(domain,"-preview")]] <- renderDT({
+      DT::datatable(
+        domainData[[domain]], 
+        rownames = FALSE,
+        options = list(
+          scrollX=TRUE
+        ),
+        class="compact"
+      )
+    })
+  })
+
   names(domain_ids)<-domain_ids # so that lapply() creates a named list below
   domain_modules <- domain_ids %>% lapply(function(domain){
     this_meta<- meta%>%filter(domain==!!domain)

R/mod_safetyGraphicsUI.R

@@ -44,19 +44,17 @@ safetyGraphicsUI <- function(id, meta, domainData, mapping, standards){
             "safetyGraphics",
             id=ns("safetyGraphicsApp"),
             tabPanel("Home", icon=icon("home"),homeTabUI(ns("home"))),
-            navbarMenu('Data',icon=icon("database"),
-                tabPanel("Preview", icon=icon("table"), settingsDataUI(ns("dataSettings"))),
-                tabPanel("Mapping", icon=icon("map"), mappingTabUI(ns("mapping"), meta, domainData, mapping, standards)),
-                tabPanel("Filtering", icon=icon("filter"), filterTabUI(ns("filter")))
-            ),
+            tabPanel("Mapping", icon=icon("map"), mappingTabUI(ns("mapping"), meta, domainData, mapping, standards)),
+            tabPanel("Filtering", icon=icon("filter"), filterTabUI(ns("filter"))),
             navbarMenu('Charts', icon=icon("chart-bar")),
             tabPanel("Reports", icon=icon("file-alt"), reportsTabUI(ns("reports"))),
             navbarMenu('',icon=icon("cog"),
                 tabPanel(title = "Metadata", settingsMappingUI(ns("metaSettings"))),
-                tabPanel(title = "Charts", settingsChartsUI(ns("chartSettings")))
-            ),
-            participant_badge
-        )
+                tabPanel(title = "Charts", settingsChartsUI(ns("chartSettings"))),
+                tabPanel(title = "Data", icon=icon("table"), settingsDataUI(ns("dataSettings")))
+            )
+        ),
+        participant_badge
     )
     return(ui)
 }

inst/www/index.css

@@ -1,4 +1,7 @@
+/* Mapping Module formatting */
+
 .mapping-domain{
+  max-width:100%;
   padding:1em;
   border:1px solid black;
   border-radius:0.2em;
@@ -42,6 +45,15 @@
   border-color:green;
 }
 
+.mapping-domain .domain-body>*{
+  display:inline-block;
+  vertical-align:top;
+}
+
+.mapping-domain .domain-body .domain-controls{
+  padding:0.5em;
+}
+
 table.metatable.dataTable tr > td:last-of-type, table.metatable.trdataTable tr > th:last-of-type {
   border-left:2px solid black;
   background:#d0d1e6;