init components

.Rbuildignore

@@ -0,0 +1,2 @@
+^.*\.Rproj$
+^\.Rproj\.user$

.gitignore

@@ -0,0 +1,4 @@
+.Rproj.user
+.Rhistory
+.RData
+.Ruserdata

DESCRIPTION

@@ -0,0 +1,13 @@
+Package: tablerDash
+Type: Package
+Title: tabler API for shiny
+Version: 0.1.0
+Author: David Granjon 
+Maintainer: David Granjon  <[email protected]>
+Description: R interface to the tabler Bootstrap 4 HTML template.
+    Create fancy dashboards.
+Imports: shiny, htmltools
+License: GPL-2
+Encoding: UTF-8
+LazyData: true
+RoxygenNote: 6.1.1

NAMESPACE

@@ -0,0 +1,10 @@
+# Generated by roxygen2: do not edit by hand
+
+export(tablerDashBody)
+export(tablerDashFooter)
+export(tablerDashNav)
+export(tablerDashPage)
+export(tablerNavMenu)
+export(tablerNavMenuItem)
+export(tablerTabItem)
+export(tablerTabItems)

R/dashboardBody.R

@@ -0,0 +1,55 @@
+#' Create a Boostrap 4 dashboard body
+#'
+#' Build a tabler dashboard body
+#'
+#' @param ... Body content, slot for \link{tablerTabItems}.
+#'
+#' @author David Granjon, \email{dgranjon@@ymail.com}
+#'
+#' @export
+tablerDashBody <- function(...) {
+  shiny::tags$div(
+    class = "my-3 my-md-5",
+    shiny::tags$div(
+      class = "container",
+      ...
+    )
+  )
+}
+
+
+
+
+#' A container for tab items
+#'
+#' @param ... Items to put in the container. Each item should be a
+#'   \code{\link{tablerTabItem}}.
+#'
+#' @export
+tablerTabItems <- function(...) {
+  lapply(list(...), tagAssert, class = "tab-pane")
+
+  shiny::tags$div(class = "tab-content", ...)
+}
+
+#' One tab to put inside a tab items container
+#'
+#' @param tabName The name of a tab. This must correspond to the \code{tabName}
+#'   of a \code{\link{tablerNavMenuItem}}.
+#' @param ... Contents of the tab.
+#'
+#' @export
+tablerTabItem <- function(tabName = NULL, ...) {
+  if (is.null(tabName))
+    stop("Need tabName")
+
+  validateTabName(tabName)
+
+  shiny::tags$div(
+    role = "tabpanel",
+    class = "tab-pane container-fluid",
+    id = paste0("shiny-tab-", tabName),
+    shiny::br(),
+    ...
+  )
+}

R/dashboardFooter.R

@@ -0,0 +1,35 @@
+#' Create a Boostrap 4 dashboard footer
+#'
+#' Build an adminLTE3 dashboard footer
+#'
+#' @param ... Left text.
+#' @param copyrights Copyrights, if any.
+#'
+#' @author David Granjon, \email{dgranjon@@ymail.com}
+#'
+#' @export
+tablerDashFooter <- function(..., copyrights = NULL) {
+
+  shiny::tags$footer(
+    class = "footer",
+    shiny::tags$div(
+      class = "container",
+      shiny::tags$div(
+        class = "row align-items-center flex-row-reverse",
+        # copyright left
+        shiny::tags$div(
+          class = "col-12 col-lg-auto mt-3 mt-lg-0 text-center",
+          copyrights
+        ),
+        # right elements
+        shiny::tags$div(
+          class = "col-auto ml-lg-auto",
+          shiny::tags$div(
+            class = "row align-items-center",
+            ...
+          )
+        )
+      )
+    )
+  )
+}

R/dashboardNavbar.R

@@ -0,0 +1,107 @@
+#' Create a Boostrap 4 dashboard navbar
+#'
+#' Build a tabler dashboard page
+#'
+#' @param id Navbar id.
+#' @param ... Navbar content.
+#' @param src Brand image url or path.
+#' @param navMenu Slot for \link{tablerNavMenu}
+#'
+#' @author David Granjon, \email{dgranjon@@ymail.com}
+#'
+#' @export
+tablerDashNav <- function(id, ..., src = NULL, navMenu) {
+
+  headerTag <- shiny::tags$div(
+    class = "header py-4",
+    shiny::tags$div(
+      class = "container",
+      shiny::tags$div(
+        class = "d-flex",
+        # header brand
+        shiny::tags$a(
+          class = "header-brand",
+          href = "#",
+          shiny::img(src = src, class = "header-brand-img")
+        ),
+        # navbar content
+        shiny::tags$div(class = "d-flex order-lg-2 ml-auto", ...),
+        # header toggle
+        shiny::tags$a(
+          href = "#",
+          class = "header-toggler d-lg-none ml-3 ml-lg-0",
+          `data-toggle` = "collapse",
+          `data-target` = paste0("#", id),
+          shiny::tags$span(class="header-toggler-icon")
+        )
+      )
+    )
+  )
+
+  navTag <- shiny::tags$div(
+    class = "header collapse d-lg-flex p-0",
+    id = id,
+    shiny::tags$div(
+      class = "container",
+      shiny::tags$div(
+        class = "row align-items-center",
+        # navigation
+        shiny::tags$div(
+          class = "col-lg order-lg-first",
+          navMenu
+        )
+      )
+    )
+  )
+  shiny::tagList(headerTag, navTag)
+}
+
+
+
+
+#' Create a Boostrap 4 dashboard navbar menu
+#'
+#' Build a tabler dashboard main navbar menu
+#'
+#' @param ... Slot for \link{tablerNavMenuItem}.
+#'
+#' @author David Granjon, \email{dgranjon@@ymail.com}
+#'
+#' @export
+tablerNavMenu <- function(...){
+  shiny::tags$ul(
+    class = "nav nav-tabs border-0 flex-column flex-lg-row",
+    ...
+  )
+}
+
+
+
+
+#' Create a Boostrap 4 dashboard navbar menu item
+#'
+#' Build a tabler dashboard navbar menu item
+#'
+#' @param ... Item name.
+#' @param tabName Should correspond exactly to the tabName given in \code{\link{tablerTabItem}}.
+#' @param icon Item icon.
+#'
+#' @author David Granjon, \email{dgranjon@@ymail.com}
+#'
+#' @export
+tablerNavMenuItem <- function(..., tabName = NULL, icon = NULL) {
+  shiny::tags$li(
+    class = "nav-item",
+    shiny::tags$a(
+      class = "nav-link",
+      id = paste0("tab-", tabName),
+      href = paste0("#shiny-tab-", tabName),
+      `data-toggle` = "tab",
+      `data-value` = tabName,
+      shiny::tags$i(class = paste0("fe fe-", icon)),
+      shiny::tags$p(
+        ...
+      )
+    )
+  )
+}

R/dashboardPage.R

@@ -0,0 +1,75 @@
+#' Create a Boostrap 4 dashboard page
+#'
+#' Build a tabler dashboard page
+#'
+#' @param navbar Slot for \link{tablerDashNav}.
+#' @param body Slot for \link{tablerDashBody}.
+#' @param footer Slot for \link{tablerDashFooter}.
+#' @param title App title.
+#'
+#' @examples
+#' if(interactive()){
+#'  library(shiny)
+#'  library(tablerDash)
+#'
+#'  shiny::shinyApp(
+#'    ui = tablerDashPage(
+#'     navbar = tablerDashNavbar(),
+#'     footer = btablerDashFooter(),
+#'     title = "test",
+#'     body = tablerDashBody()
+#'    ),
+#'    server = function(input, output) {}
+#'  )
+#' }
+#'
+#' @author David Granjon, \email{dgranjon@@ymail.com}
+#'
+#' @export
+tablerDashPage <- function(navbar = NULL, body = NULL,
+                        footer = NULL, title = NULL){
+
+  shiny::tags$html(
+    # Head
+    shiny::tags$head(
+        shiny::tags$meta(charset="UTF-8"),
+        shiny::tags$meta(
+          name = "viewport",
+          content = "
+          width=device-width,
+          user-scalable=no,
+          initial-scale=1.0,
+          maximum-scale=1.0,
+          minimum-scale=1.0"
+        ),
+        shiny::tags$meta(`http-equiv` = "X-UA-Compatible", content = "ie=edge"),
+        shiny::tags$meta(`http-equiv` = "Content-Language", content = "en"),
+        shiny::tags$meta(name = "msapplication-TileColor", content = "#2d89ef"),
+        shiny::tags$meta(name = "theme-color", content = "#4188c9"),
+        shiny::tags$meta(name = "apple-mobile-web-app-status-bar-style", content = "black-translucent"),
+        shiny::tags$meta(name = "apple-mobile-web-app-capable", content = "yes"),
+        shiny::tags$meta(name = "mobile-web-app-capable", content = "yes"),
+        shiny::tags$meta(name = "HandheldFriendly", content = "True"),
+        shiny::tags$meta(name = "MobileOptimized", content = "320"),
+        #<link rel="icon" href="./favicon.ico" type="image/x-icon">
+        #<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico">
+      shiny::tags$script("requirejs.config({ baseUrl: '.' });"),
+      shiny::tags$title(title)
+    ),
+    # Body
+    addDeps(
+      shiny::tags$body(
+        class = NA,
+        shiny::tags$div(
+          class = "page",
+          shiny::tags$div(
+            class = "page-main",
+            navbar,
+            body
+          ),
+          footer
+        )
+      )
+    )
+  )
+}

R/deps.R

@@ -0,0 +1,59 @@
+# Add an html dependency, without overwriting existing ones
+appendDependencies <- function(x, value) {
+  if (inherits(value, "html_dependency"))
+    value <- list(value)
+
+  old <- attr(x, "html_dependencies", TRUE)
+
+  htmltools::htmlDependencies(x) <- c(old, value)
+  x
+}
+
+# Add dashboard dependencies to a tag object
+addDeps <- function(x) {
+
+  # put all necessary ressources here
+
+  tablerDash_js <- "dashboard.js"
+  tablerDash_css <- "dashboard.css"
+
+  require_js <- "require.min.js"
+  core_js <- "core.js"
+
+  bootstrap_js <- "bootstrap.bundle.min.js"
+  fontawesome_css <- "https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
+  google_fonts <- "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&subset=latin-ext"
+
+  dashboardDeps <- list(
+    #tablerDash
+    htmltools::htmlDependency(
+      name = "tablerDash",
+      version = "0.1.0",
+      src = c(file = system.file("tablerDash-0.1.0", package = "tablerDash")),
+      script = c(tablerDash_js, require_js, core_js),
+      stylesheet = tablerDash_css
+    ),
+    # fontawesome
+    htmltools::htmlDependency(
+      name = "fontawesome",
+      version = as.character(utils::packageVersion("tablerDash")),
+      src = c(href = fontawesome_css),
+      stylesheet = ""
+    ),
+    # google fonts
+    htmltools::htmlDependency(
+      name = "googlefonts",
+      version = as.character(utils::packageVersion("tablerDash")),
+      src = c(href = google_fonts),
+      stylesheet = ""
+    ),
+    # bootstrap deps
+    htmltools::htmlDependency(
+      name = "bootstrap",
+      version = "4.0.0",
+      src = c(file = system.file("bootstrap-4.0.0", package = "tablerDash")),
+      script = bootstrap_js
+    )
+  )
+  appendDependencies(x, dashboardDeps)
+}