BAMexploreR_shiny/ui.R at main · borealbirds/BAMexploreR_shiny · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
tagList(
  navbarPage(
    theme = bslib::bs_theme(version = 4, bootswatch = "lux"),
    id = 'tabs',
    collapsible = TRUE,
    header = tagList(
      tags$head(tags$link(href = "css/style_blanc.css", rel = "stylesheet")
                ),
      tags$div(
        style = "position: absolute; right: 20px; top: 10px;",
        actionButton(
          "reload_btn",
          label = "Reload",
          icon = icon("refresh"),
          style = "color: white; background-color: rgb(30, 80, 85); border: none; font-size: 16px; margin-top: 8px;"
        ),
        style = "position: absolute; right: 20px; top: 10px;" # adjust position
      )
    ),
    title = HTML('<div style="margin-top: -10px;"><a href="https://borealbirds.ca/" target="_blank"><img src="bam.png" height="50"></a></div>'),
    windowTitle = "BAM Landbird Model Explorer",
    tabPanel("Welcome", value = 'intro'),
    tabPanel("Model access", value = 'data'),
    tabPanel("Population distribution", value = 'popstats'),
    tabPanel("Predictor importance", value = 'pred'),
    navbarMenu("Support", icon = icon("life-ring"),
               HTML('<a href="https://borealbirds.ca/" target="_blank">BAM Homepage</a>'),
               HTML('<a href="https://github.com/borealbirds/BAMexploreR_shiny" target="_blank">Github Page</a>'),
               HTML('<a href="https://github.com/borealbirds/BAMexploreR_shiny/issues" target="_blank">GitHub Issues</a>'),
               HTML('<a href="mailto: bamp@ualberta.ca" target="_blank">Send Email</a>'))
  ),
  tags$div(
    useShinyjs(),

    # Intro tab
    conditionalPanel(
      condition="input.tabs == 'intro'",
      div(style = "background-color: white; width: 100vw; margin: 0; padding: 0; display: flex; justify-content: center;",
          tags$img(src = "bird.png", height = "350px",  style = "display: block; object-fit: contain; width: 100%; max-width: none;")),
      fluidRow(
        column(12, div(id = "markdown-content", includeMarkdown("Rmd/text_intro_tab.md")))
      ),
      tags$style(HTML("
  #markdown-content, #markdown-content *:not(a) {
    color: white !important;
  }

  /* Hyperlinks */
  #markdown-content a:link {
    color: #ABABAB !important;   /* Unclicked */
    text-decoration: underline;
  }

  #markdown-content a:visited {
    color: #EFEFEF !important;   /* Clicked / visited */
    text-decoration: underline;
  }

  #markdown-content a:hover,
  #markdown-content a:active,
  #markdown-content a:focus {
    color: #FFFFFF !important;   /* Hover / active */
    text-decoration: underline;
  }
"))
    ),

    # Main layout for data + popstats tabs
    conditionalPanel(
      condition="input.tabs == 'data' || input.tabs == 'popstats' || input.tabs == 'pred'",
      fluidRow(
        # Left panel changes depending on tab
        column(3,
               conditionalPanel(
                 condition="input.tabs == 'data'",
                 tabsetPanel(
                   tabPanel("Tool",
                            exploreUI("explore_module")
                   ),
                   tabPanel("Instructions", icon = icon("circle-info"), div(style = "color: white !important; font-size: 14px; font-family: 'Cormorant Garamond', serif;", includeMarkdown("./Rmd/gtext_data.Rmd")))
                 )
               ),
               conditionalPanel(
                 condition="input.tabs == 'popstats'",
                 tabsetPanel(
                   tabPanel("Tool", popUI("pop_module")),
                   tabPanel("Instructions", icon = icon("circle-info"), div(style = "color: white !important; font-size: 14px; font-family: 'Cormorant Garamond', serif;", includeMarkdown("./Rmd/gtext_popstats.Rmd")))
                 )
               ),
               conditionalPanel(
                 condition="input.tabs == 'pred'",
                 tabsetPanel(
                   tabPanel("Tool", predUI("pred_module")),
                   tabPanel("Instructions", icon = icon("circle-info"), div(style = "color: white !important; font-size: 14px; font-family: 'Cormorant Garamond', serif;", includeMarkdown("./Rmd/gtext_pred.Rmd")))
                 )
               )
        ),
        # Map always visible in the middle
        column(6,
               conditionalPanel(
                 condition="input.tabs == 'data' || input.tabs == 'popstats'" ,
                 tabsetPanel(id ="centerPanel",
                   tabPanel("Map View",
                            leafletOutput("myMap", height = 700) %>% withSpinner(),
                            #popTable("pop_module")
                            conditionalPanel(
                              condition = "input.tabs == 'popstats'",
                              popTable("pop_module")
                            )
                   ),
                   tabPanel("Species Occurrence",
                            conditionalPanel(
                              condition = "input.tabs == 'popstats' && input['pop_module-popAnalysis'] == 'popArea'",
                              popOccUI("pop_module")
                            )
                   )
                 )
               ),
               conditionalPanel(
                 condition="input.tabs == 'pred'" ,
                 barchartUI("pred_module")
               )
        ),
        column(3,
               #uiOutput("rightPanel")
               conditionalPanel(
                 condition="input.tabs == 'data'" ,
                 bandUI("explore_module"),
                 sppUI("explore_module"),
                 dwdUI("explore_module")
               ),
               conditionalPanel(
                 condition="input.tabs == 'popstats'" ,
                 popSppUI("pop_module"),
                 popDwdUI("pop_module")
               ),
               conditionalPanel(
                 condition="input.tabs == 'pred'" ,
                 axisUI("pred_module"),
#                 predDwdUI("pred_module")
               )

        )
      )
    )
  )
)