gentelellaShiny

This is an R Shiny HTML Template version of the gentelella bootstrap theme.

Features

• A unique looking Shiny dashboard
• Login authentication page (requires googleAuthR)
• Profile name and picture pulled from G+ (requires googleID)
• Dynamic headline tiles
• Dynamic progress bar visualisation
• Custom box for plots including date picker in header
• Custom collapsible box for dashboard elements

A demo app for viewing GoogleAnalytics data is available by running gentelellaShiny::runExample()

Example Shiny Google Analytics app

You can login and view a demo Google analytics dashboard using gentelellaShiny here.

It uses a login page hosted on github, linking to a demo Shiny app running on shinyapps.io.

Install

devtools::install_github("MarkEdmondson1234/gentelellaShiny")

For logins you also need googleID

devtools::install_github("MarkEdmondson1234/googleID")

For the demo to work it uses googleAnalyticsR, dev version:

devtools::install_github("MarkEdmondson1234/googleAnalyticsR")

Elements

Top tiles

A tile to show headline metrics

Plot Box

A box with datepicker for plots

Collapsible box

A box to display other dashboard content

Progress bars

For showing things like performance against target

Other Shiny elements

Any other Shiny UI elements can also be used, including htmlwidgets. A couple of examples are shown below:

Google Analytics dropdown

From googleAnalyticsR, a UI to selet GA view:

Gauge

From flexdashboards:

To use

A special function gentelellaPage() has been created that you pass normal ui.R elements to, that will then render each parameter in order to each row of content on the page.

If you want more items to appear in one row, then pass them in a shiny::tagList

Example:

In ui.R

## to appear in one row
boxRow <- tagList(
  dashboard_box(uiOutput("progress_bar2"), box_title = "Targets"),
  dashboard_box(gaugeOutput("gauge1"), box_title = "Flexdashboard Gauge", menuItems = NULL),
  dashboard_box(p("More interesting stuff"))
)

## each parameter holds UI elements that are rendered per row in order down the content page
gentelellaPage(
  column(width = 12, googleAnalyticsR::authDropdownUI("auth_dropdown")),
  tileCountRow(tileCountUI("e1"), tileCountUI("e2"), tileCountUI("e3"),
               tileCountUI("e4"), tileCountUI("e5"), tileCountUI("e6")),
  graph_box(dygraphOutput("trend_plot"),
            datepicker = dateRangeInput("datepicker_id", NULL, start = Sys.Date() - 300)),
  boxRow
)

gentelellaPage() also includes some named parameters to set options such as sidebar menu items, title tag and footer images.

## create menu items for sidebar using sidebarElement
menuItems <- list(
  sideBarElement(" Home ",
                 icon = icon("home"),
                 list(a(href="index.html", "Dashboard"),
                      a(href="index2.html", "Dashboard2"),
                      a(href="index3.html", "Dashboard3"))                        
  ),
  sideBarElement(" Contact ",
                 icon = icon("envelope"),
                 list(a(href="http://twitter.com/HoloMarkeD", 
                        HTML(paste(icon("twitter"), "@HoloMarkeD"))),
                      a(href="http://code.markedmondson.me", 
                        HTML(paste(icon("rss"), " Blog"))),
                      a(href="https://github.com/MarkEdmondson1234/gentelellaShiny", 
                        HTML(paste(icon("github"), " Github"))))                        
  ),
  sideBarElement(column(width = 12, googleAuthR::googleAuthUI("auth"),
                        icon = NULL)
  ))

gentelellaPage(
  tileCountRow(tileCountUI("e1"), tileCountUI("e2"), tileCountUI("e3"),
               tileCountUI("e4"), tileCountUI("e5"), tileCountUI("e6")),
  
  ## start named parameters:
  menuItems = menuItems,
  title_tag = "Shiny HTML Template",
  site_title = a(class="site_title", icon("eye"), span("Shiny HTML")),
  footer = "Made in Denmark"
)

There is no support for different layouts other than the defaults in gentelellaPage(), in that case use shiny::htmlTemplate directly and edit index.html to include your R code blocks in {{ brackets }}

Example files

A demo app for viewing GoogleAnalytics data is available by running runExample().

It will start up a login page and a (logged out) Shiny dashboard. Use the login page or the login button on the Shiny app to start.

In production the Shiny app would be running on a server and user's start at the login page.

Login page

googleAuthUI creates a login URL that includes a security code.

Set the security code to be static (default it changes each launch of googleAuthR) via options, e.g. options(googleAuthR.securitycode = "gentelellXXXXXXX") in the top of server.R

Generate the login URL with the security code, and use as the login link in the login.html file.

The login.html file can then be used for logins, with the Shiny app holding logic to not show content without logging in (e.g. req(auth()))