ui.R

material_page(
  title = "SHINY",
  nav_bar_color = "#b71c1c red darken-4",
  background_color = "lightblue",
   nav_bar_fixed = TRUE,
   include_fonts = TRUE,
  
  # Para que la navegacion lateral al comienzo del interfaz de usuario.
  material_side_nav(
    fixed = TRUE, 
    image_source = "img/see.jpg",
    
    # ubicar las pestañas de navegación dentro de la navegación lateral
    material_side_nav_tabs(
      side_nav_tabs = c(
        "Precios" = "precio_casas",
        "Base de datos" = "datos",
        "Codigo" = "codigo"
      ),
      
      font_color='black'),
    background_color = '#ef9a9a red lighten-3'
  ),
  
  # Definimos el contenido 
  
  material_side_nav_tab_content(
    side_nav_tab_id = "precio_casas",
    tags$br(),
    material_row(
      material_column(
        width = 6,
        material_dropdown(
          input_id = "Area_State",
          label = "Lugar", 
          choices = sort(unique(data$Area_State)),
          color = "blue"
        )
      ),
      material_column(
        width = 3,
        material_slider(
          input_id = "from_year",
          label = "Desde",
          min_value = 1995,
          max_value = 2016,
          initial_value = 1995,
          color = "blue"
        )
      ),
      material_column(
        width = 3,
        material_slider(
          input_id = "to_year",
          label = "Hasta",
          min_value = 1996,
          max_value = 2017,
          initial_value = 2017,
          color = "blue"
        )
      )
    ),
    material_row(
      material_column(
        width = 12,
        material_card(
          title = "Vivienda: Evolución del precio en el tiempo",
          plotOutput("housing_plot"),
          uiOutput("housing_plot_error")
        )
      )
    )
  ),
  material_side_nav_tab_content(
    side_nav_tab_id = "datos",
    tags$br(),
    material_row(
      material_column(
        width = 14,
        material_card(
          title = "Base de datos",
          tags$a(href = "https://www.fhfa.gov/DataTools/Downloads",
                 target = "_blank",
                 "Federal Housing Finance Agency (FHFA)"),
          hr(),
          dataTableOutput("base")
        )
      )
    )
  ),
  material_side_nav_tab_content(
    side_nav_tab_id = "codigo",
    material_row(
      material_column(
        width = 12,
        h2("ui.R"),
        tags$pre(
         'gh776'

        ),
        br()
        
      )
    )
  )
)

server.R

server <- function(input, output, session) {
  
  output$housing_plot_error <- renderUI({
    if(input$from_year >= input$to_year){
      tags$span(
        style = "color:red; font-weight:bold",
        paste0('El año (', input$from_year, ') debe ser menor que el año (', input$to_year, ')')
      )
    } else {
      NULL
    }
  })
  
  output$housing_plot <- renderPlot({
    
    if(input$from_year >= input$to_year) return(NULL)
    
    material_spinner_show(session, "housing_plot")
    
   # Sys.sleep(2.5) 
    
    plot_data <- 
      data %>% 
      filter(Area_State == input$Area_State,
             Year >= input$from_year,
             Year <= input$to_year) %>% 
      mutate(
        Housing_Price_Index_Plot =
          round(((Housing_Price_Index / Housing_Price_Index[Year_Quarter_num == min(Year_Quarter_num)])) - 1,2)
      )
    
    plot_out <- 
      ggplot(plot_data, aes(x = Year_Quarter_num,
                            y = Housing_Price_Index_Plot)) +
      geom_line(size = 3, color = "#0000ff") +
      geom_label(data = plot_data[plot_data$Year_Quarter_num == max(plot_data$Year_Quarter_num), ],
                 aes(label = paste0(Housing_Price_Index_Plot * 100, "%")),
                 color = "#0000ff", size = 5) + 
      scale_y_continuous(labels = scales::percent) +
      geom_hline(yintercept = 0, linetype = 2) +
      scale_x_continuous(
        breaks = sort(unique(plot_data$Year))
      ) +
      # scale_y_continuous(labels = ) + 
      labs(x = "Year", 
           y = "") +
      theme(text = element_text(size = 15),
            legend.position = "none",
            plot.margin = unit(c(0, 0, 0, -5), "mm"),
            axis.text.x = element_text(angle=60, hjust=1))
    
    material_spinner_hide(session, "housing_plot")
    
    plot_out
  })
  
  output$base <- renderDataTable({
    
    if(input$from_year >= input$to_year) return(NULL)
    
    material_spinner_show(session, "housing_plot")
    data
  })
}

global.R

library(shiny)
library(shinymaterial)
library(tidyverse)
library(stringr)
library(shinydashboard)

data <-
  read_csv(
    "https://www.fhfa.gov/DataTools/Downloads/Documents/HPI/HPI_AT_metro.csv",
    col_names = FALSE
  ) %>%
  rename_(
    .dots = 
      setNames(colnames(.),
               c("Metropolitan_Statistical_Area_Name",  
                 "Core_Based_Statistical_Area", 
                 "Year",    
                 "Quarter", 
                 "Index",
                 "Index_Standard_Error"))
  ) %>%
  filter(Year > 1994) %>%
  transmute(
    Metropolitan_Statistical_Area_Name = Metropolitan_Statistical_Area_Name,
    Core_Based_Statistical_Area = as.character(Core_Based_Statistical_Area),
    Housing_Price_Index = as.numeric(ifelse(Index == '-', NA, Index)),
    Quarter = Quarter,
    Year = Year,
    Year_Quarter_num = Year + (Quarter / 4)
  ) %>%
  filter(complete.cases(.)) %>%
  mutate(
    Metropolitan_Statistical_Area_Name = 
      str_replace(Metropolitan_Statistical_Area_Name, '(MSAD)', '')
  ) %>%
  separate(
    Metropolitan_Statistical_Area_Name,
    c('Area', 'State'),
    ', '
  ) %>%
  mutate(State = str_sub(State, 1, 2)) %>% 
  unite(Area_State, State, Area, sep = ", ", remove = FALSE)