# UI components for St. Andrews Shiny App

create_ui <- function() {
  f7Page(
    title = app_config$app_config$title,
    ## header ----
    tags$head(
      tags$link(rel = "manifest", href = "manifest.json"),
      tags$link(rel = "apple-touch-icon", sizes = "180x180", href = "images/apple-touch-icon.png"),
      tags$meta(name = "apple-mobile-web-app-capable", content = "yes"),
      tags$meta(name = "apple-mobile-web-app-status-bar-style", content = "default"),
      tags$style(HTML("
        .dataTables_wrapper {
          color: white;
        }
        .dataTables_wrapper table.dataTable thead th,
        .dataTables_wrapper table.dataTable tbody td {
          color: white;
        }
        .dataTables_wrapper table.dataTable tbody tr.odd {
          background-color: #333;
        }
        .dataTables_wrapper table.dataTable tbody tr.even {
          background-color: #444;
        }
        .dataTables_wrapper .dataTables_paginate .paginate_button {
          color: white !important;
        }
        .dataTables_wrapper .dataTables_paginate .paginate_button.current{
          color: black !important;
        }
        .dataTables_filter {
          display: none; /* Hide the search box */
        }
      "))
    ),
    ## options ----
    options = list(
      theme = app_config$app_config$theme,
      dark = app_config$app_config$dark,
      pullToRefresh = TRUE
    ),
    ## layout ----
    f7TabLayout(
      ### panels ----
      panels = tagList(
        f7Panel(
          id = "panel-left",
          side = "left",
          effect = "push",
          title = "Menu",
          f7PanelMenu(
            id = "menu",
            f7PanelItem(
              tabName = "About",
              title = "About",
              icon = f7Icon("info_circle"),
              active = TRUE
            ),
            f7PanelItem(
              tabName = "Owners",
              title = "Owners",
              icon = f7Icon("person_2_fill")
            ),
            f7PanelItem(
              tabName = "Listings",
              title = "Listings",
              icon = f7Icon("tag_fill")
            ),
            f7PanelItem(
              tabName = "Sales",
              title = "Sales",
              icon = f7Icon("money_dollar")
            ),
            f7PanelItem(
              tabName = "Resources",
              title = "Resources",
              icon = f7Icon("hammer_fill")
            )
          )
        )
      ),
      ### navbar ----
      navbar = f7Navbar(
        title = app_config$app_config$title,
        hairline = TRUE,
        leftPanel = TRUE
      ),
      ### begin tabs ----
      f7Tabs(
        id = "tabs",
        animated = TRUE,
        #### about ----
        f7Tab(
          title = "About",
          tabName = "About",
          icon = f7Icon("info_circle"),
          active = TRUE,
          f7Card(
            title = "About",
            divider = "TRUE",
            tags$img(src = "images/st_andrews.jpg", width = "100%"),
            "St. Andrews Park is located in Venice, Florida. The condominiums are a mix of single-family homes, villas (2 and 4 units) and multi-unit buildings (8 units). There are 388 separate properties within 14 subdivisions. St. Andrews Park is one of many communities in the Plantation Golf and Country Club. It is should not be confused with the adjacent community St. Andrews East.",
            tags$em(textOutput("sales_date", inline = TRUE)),
            footer = tagList(
              f7Link("More Info", href = "http://www.cpmi.us/standrews-plantation/outside_home.asp")
            )
          )
        ),
        #### owners ----
        f7Tab(
          title = "Owners",
          tabName = "Owners",
          icon = f7Icon("person_2_fill"),
          f7Card(
            title = "Owners:",
            divider = TRUE,
            raised = TRUE,
            footer = textOutput("last_sale_date_display"),
            f7List(
              inset = TRUE,
              dividers = TRUE,
              strong = TRUE,
              outline = FALSE,
              f7Text(
                inputId = "name",
                label = "Last Name:",
                placeholder = "\"Patel\""
              ),
              f7Text(
                inputId = "location",
                label = "Address:",
                placeholder = "\"123 Chalmers\""
              ),
              f7Select(
                inputId = "sub_name",
                label = "Select Subdivision:",
                choices = c("All", "FAIRWAY GLEN", "GARDENS 1", "GARDENS 2",
                           "GARDENS 3", "GARDENS 4", "PATIOS 1", "PATIOS 2",
                           "PATIOS 3", "STRATFORD GLENN", "TERRACE HOMES",
                           "TERRACE VILLAS", "VILLAS 1 ST", "VILLAS 2",
                           "WEST LAKE GARDENS")
              ),
              tags$br(),
              f7Button(
                inputId = "filterButton",
                label = "Find Owners",
                icon = "",
                color = "blue"
              )
            )
          ),
          f7Card(
            title = "Map:",
            divider = TRUE,
            leafletOutput("map")
          ),
          f7Card(
            title = "Table:",
            divider = TRUE,
            DTOutput("table")
          ),
          f7Card(
            title = "Download:",
            divider = TRUE,
            f7List(
              inset = TRUE,
              downloadButton("download_filtered", "Download Filtered"),
              downloadButton("download_all", "Download All (388)")
            )
          )
        ),
        #### listings ----
        f7Tab(
          title = "Listings",
          tabName = "Listings",
          icon = f7Icon("tag_fill"),
          f7Card(
            title = "Map:",
            divider = TRUE,
            leafletOutput("listings_map")
          ),
          f7Card(
            title = "Active Listings:",
            divider = TRUE,
            DTOutput("listings_table")
          )
        ),
        #### sales ----
        f7Tab(
          title = "Sales",
          tabName = "Sales",
          icon = f7Icon("money_dollar"),
          f7Card(
            title = "Map:",
            divider = TRUE,
            leafletOutput("sales_map")
          ),
          f7Card(
            title = "Recent Sales:",
            divider = TRUE,
            DTOutput("sales_table")
          )
        ),
        #### resources ----
        f7Tab(
          title = "Resources",
          tabName = "Resources",
          icon = f7Icon("hammer_fill"),
          f7Accordion(
            id = "resources_accordion",
            f7AccordionItem(
              title = "Beaches",
              f7Card(
                divider = TRUE,
                leafletOutput("beach_map"),
                footer = p("Source: Environmental Protection Agency")
              ),
              f7Block(
                f7List(
                  inset = TRUE, dividers = TRUE, strong = TRUE, outline = FALSE,
                  f7ListItem(title = "EPA Beaches",              href = "https://www.epa.gov/beaches",             external = TRUE),
                  f7ListItem(title = "Red Tide Forecast",        href = "https://habforecast.gcoos.org/",           external = TRUE),
                  f7ListItem(title = "Healthy Beaches Program",  href = "https://fdoh.maps.arcgis.com/apps/instant/nearby/index.html?appid=7106a20597de4bff98cc5ebc7f932047&findSource=0&find=1600%2520Harbor%2520Dr%2520S%252C%2520Venice%252C%2520Florida%252C%252034285&sliderDistance=2", external = TRUE),
                  f7ListItem(title = "MOTE Beach Conditions",    href = "https://visitbeaches.org/beach/6/report/53033", external = TRUE),
                  f7ListItem(title = "National Hurricane Center", href = "https://www.nhc.noaa.gov/",              external = TRUE)
                )
              )
            ),
            f7AccordionItem(
              title = "Services",
              f7Block(
                f7List(
                  inset = TRUE, dividers = TRUE, strong = TRUE, outline = FALSE,
                  f7ListItem(title = "City of Venice",           href = "https://www.venicegov.com/",             external = TRUE),
                  f7ListItem(title = "Florida Power & Light",    href = "https://www.fpl.com/",                   external = TRUE),
                  f7ListItem(title = "Sarasota County",          href = "https://www.scgov.net/",                 external = TRUE),
                  f7ListItem(title = "Property Appraiser",       href = "https://www.sc-pa.com/",                 external = TRUE),
                  f7ListItem(title = "Open GIS Portal",          href = "https://data-sarco.opendata.arcgis.com/", external = TRUE),
                  f7ListItem(title = "Waste & Recycling",        href = "https://www.venicegov.com/government/public-works/waste-and-recycling", external = TRUE),
                  f7ListItem(title = "Condo Regulation",         href = "https://condos.myfloridalicense.com/",   external = TRUE),
                  f7ListItem(title = "Property Records Search",  href = "https://www.sarasotaclerk.com/records/official-records/search-land-records", external = TRUE)
                )
              )
            ),
            f7AccordionItem(
              title = "Docs",
              f7BlockTitle("St. Andrews Park", size = "medium"),
              f7Block(
                f7List(
                  inset = TRUE, dividers = TRUE, strong = TRUE, outline = FALSE,
                  f7ListItem(title = "Covenants",       href = "docs/st_andrews/2000_01_01_st_andrews_covenants.pdf"),
                  f7ListItem(title = "Map (unrecorded)", href = "docs/st_andrews/2004_06_23_sap_map.pdf")
                )
              ),
              f7BlockTitle("Patios 2", size = "medium"),
              f7Block(
                f7List(
                  inset = TRUE, dividers = TRUE, strong = TRUE, outline = FALSE,
                  f7ListItem(title = "Plat", href = "docs/patios_2/1997_08_12_patios_2_plat.pdf")
                )
              ),
              f7BlockTitle("Patios 3", size = "medium"),
              f7Block(
                f7List(
                  inset = TRUE, dividers = TRUE, strong = TRUE, outline = FALSE,
                  f7ListItem(title = "Plat", href = "docs/patios_3/1998_11_17_patios_3_plat.pdf")
                )
              ),
              f7BlockTitle("Villas 2", size = "medium"),
              f7Block(
                f7List(
                  inset = TRUE, dividers = TRUE, strong = TRUE, outline = FALSE,
                  f7ListItem(title = "Plat", href = "docs/villas_2/1998_09_14_villas_2_plat.pdf")
                )
              )
            )
          )
        )
        ### end tabs----
      ),
      ### begin scripts ----
      tags$script(
        HTML(
          "
          $(document).on('click', '#pdfLink', function(event) {
            event.preventDefault();
            window.open($(this).attr('href'), '_blank');
          });
          $(document).on('click', '#download_filtered, #download_all', function(event) {
            event.preventDefault();
            window.open($(this).attr('href'), '_self');
          });
          "
        )
      )
      ### end scripts ----
    )
  )
}