Update app.R

app.R

@@ -494,98 +494,173 @@ clean_college_data <- function(data, teams = NA) {
 
 
 # ============================================================
-# CSS
+# Theme + CSS (Hawks look, inlined — no theme.R needed)
 # ============================================================
-app_css <- "
-  body { background:#f5f5f5; font-family:'Segoe UI',Arial,sans-serif; }
-  .header { background:linear-gradient(135deg,#002855 0%,#164EA7 100%); color:#fff;
-            padding:24px 30px; box-shadow:0 4px 6px rgba(0,0,0,.1); margin-bottom:24px;
-            border-bottom:3px solid #F25B00; }
-  .header h1 { margin:0; font-size:2em; font-weight:800; }
-  .header p  { margin:8px 0 0; opacity:.9; }
-  .main-panel { background:#fff; border-radius:12px; padding:24px; box-shadow:0 2px 8px rgba(0,0,0,.1); }
-  .btn-primary { background:#164EA7 !important; border:none !important; font-weight:700; }
-  .btn-primary:hover { background:#002855 !important; }
-  .btn-hf { background:#F25B00 !important; border:none !important; color:#fff !important; font-weight:700; }
-  .status-box { background:#eef3fb; border-left:4px solid #164EA7; padding:14px; border-radius:4px;
-                white-space:pre-wrap; font-family:monospace; font-size:13px; }
-"
+HAWKS_ORANGE <- "#F25B00"; HAWKS_BLUE <- "#164EA7"; HAWKS_DARK <- "#0D1B2A"
+HAWKS_LIGHT  <- "#F5F7FA"; HAWKS_GRAY <- "#6B7280"; HAWKS_BORDER <- "#E2E8F0"
+
+hawks_theme <- bs_theme(
+  version = 5, bg = "#FFFFFF", fg = HAWKS_DARK,
+  primary = HAWKS_BLUE, secondary = HAWKS_ORANGE,
+  base_font = font_google("Inter"), heading_font = font_google("Inter"),
+  `border-radius` = "0.5rem", `font-size-base` = "0.925rem"
+)
+
+hawks_css <- tags$style(HTML(glue("
+  * {{ box-sizing:border-box; }}
+  body {{ background:{HAWKS_LIGHT}; font-family:'Inter',system-ui,sans-serif; margin:0; }}
+  .hawks-shell {{ display:flex; flex-direction:column; min-height:100vh; }}
+  .hawks-topbar {{ background:{HAWKS_DARK}; padding:0 24px; display:flex; align-items:center;
+    justify-content:space-between; border-bottom:3px solid {HAWKS_ORANGE}; }}
+  .topbar-brand {{ display:flex; align-items:center; gap:10px; padding:14px 0; }}
+  .topbar-brand .app-title {{ color:#fff; font-size:16px; font-weight:800; }}
+  .topbar-title {{ color:#fff; font-size:26px; font-weight:800; flex:1; text-align:center; white-space:nowrap; }}
+  .topbar-spacer {{ width:110px; }}
+  .hawks-content {{ flex:1; padding:24px; }}
+  .data-card {{ background:#fff; border:1px solid {HAWKS_BORDER}; border-radius:8px; overflow:hidden; }}
+  .data-card-hdr {{ padding:10px 14px; border-bottom:1px solid {HAWKS_BORDER};
+    display:flex; align-items:center; justify-content:space-between; }}
+  .data-card-title {{ font-size:11px; font-weight:700; color:{HAWKS_DARK};
+    text-transform:uppercase; letter-spacing:.05em; }}
+  .data-card-sub {{ font-size:10px; color:#9CA3AF; }}
+  .data-card-body {{ padding:16px; }}
+  .status-box {{ background:#eef3fb; border-left:4px solid {HAWKS_BLUE}; padding:14px;
+    border-radius:4px; white-space:pre-wrap; font-family:monospace; font-size:13px; color:{HAWKS_DARK}; }}
+  .btn-scrape {{ background:{HAWKS_BLUE} !important; border:none !important; color:#fff !important;
+    font-weight:700; width:100%; }}
+  .btn-scrape:hover {{ background:#0f3d82 !important; }}
+  .btn-hf {{ background:{HAWKS_ORANGE} !important; border:none !important; color:#fff !important;
+    font-weight:700; width:100%; }}
+  .btn-hf:hover {{ background:#d44f00 !important; }}
+")))
 
 # ============================================================
-# UI
+# Login overlay (JS, matches the other apps)
 # ============================================================
-login_ui <- fluidPage(
-  tags$style(HTML("
-    body { background:#f0f4f8; font-family:'Segoe UI',sans-serif; }
-    .login-container { max-width:360px; margin:120px auto; background:#002855; padding:30px 25px;
-      border-radius:8px; box-shadow:0 4px 15px #A1A1A4; text-align:center; color:#fff; }
-    .btn-primary { background:#F25B00 !important; border-color:#F25B00 !important; color:#fff !important;
-      font-weight:bold; width:100%; margin-top:10px; }
-    .form-control { border-radius:4px; border:1.5px solid #164EA7 !important; }
-  ")),
-  div(class = "login-container",
-      h3("Hyannis TrackMan Scraper"),
-      passwordInput("login_password", "Password:"),
-      actionButton("login", "Login", class = "btn-primary"),
-      textOutput("wrong_pass")
+login_css <- tags$style(HTML("
+  #login_screen { position:fixed; inset:0; z-index:9999; display:flex; flex-direction:column;
+    align-items:center; justify-content:center;
+    background:linear-gradient(135deg,#001a3a 0%,#003366 40%,#0a4a8a 100%);
+    transition:opacity .8s ease, transform .8s ease; }
+  #login_screen.fade-out { opacity:0; transform:scale(1.02); pointer-events:none; }
+  #login_screen .login-logo { width:120px; height:120px; margin-bottom:20px; border-radius:50%;
+    object-fit:cover; border:3px solid rgba(255,165,0,.6); box-shadow:0 0 30px rgba(255,165,0,.2); }
+  #login_screen .login-title { font-size:42px; font-weight:800; color:#fff; letter-spacing:1.5px;
+    margin-bottom:6px; text-align:center; }
+  #login_screen .login-subtitle { font-size:16px; color:rgba(255,165,0,.7); letter-spacing:3px;
+    text-transform:uppercase; margin-bottom:40px; }
+  #login_screen .login-accent { width:60px; height:3px; background:#FF8C00; margin:0 auto 30px; border-radius:2px; }
+  #login_screen .login-box { background:rgba(255,255,255,.06); border:1px solid rgba(255,165,0,.2);
+    border-radius:12px; padding:32px 40px; backdrop-filter:blur(10px); width:340px; text-align:center; }
+  #login_screen .login-box input[type='password'] { width:100%; padding:12px 16px;
+    border:1px solid rgba(255,165,0,.3); border-radius:6px; background:rgba(255,255,255,.08);
+    color:#fff; font-size:15px; margin-bottom:16px; outline:none; text-align:center; letter-spacing:2px; }
+  #login_screen .login-box input[type='password']:focus { border-color:#FF8C00; }
+  #login_screen .login-btn { width:100%; padding:12px; border:none; border-radius:6px;
+    background:#FF8C00; color:#fff; font-size:14px; font-weight:700; letter-spacing:1px;
+    text-transform:uppercase; cursor:pointer; }
+  #login_screen .login-btn:hover { background:#e67e00; }
+  #login_screen .login-error { color:#ff6b6b; font-size:13px; margin-top:12px; min-height:20px; }
+"))
+
+login_overlay <- tags$div(id = "login_screen",
+  tags$img(class = "login-logo", src = logo_uri),
+  tags$div(class = "login-title", "TrackMan Scraper"),
+  tags$div(class = "login-accent"),
+  tags$div(class = "login-subtitle", "Hyannis Harbor Hawks"),
+  tags$div(class = "login-box",
+    tags$input(id = "login_pw", type = "password", placeholder = "Enter password"),
+    tags$button(id = "login_btn", class = "login-btn", "Enter"),
+    tags$div(id = "login_error", class = "login-error")
   )
 )
 
-app_ui <- fluidPage(
-  tags$head(tags$style(HTML(app_css))),
-  div(class = "header",
-      h1("TrackMan Scraper \u2014 2026 Cape"),
-      p("Scrape TrackMan PBP or Positional data and push it to the PastSeasonData dataset")
-  ),
-  fluidRow(
-    column(4,
-      div(class = "main-panel",
-        h4("Controls", style = "color:#002855; margin-top:0;"),
-        radioButtons("scrape_source", "Data Source",
-                     choices = c("TrackMan PBP" = "pbp", "TrackMan Positional" = "pos"),
-                     selected = "pbp"),
-        dateInput("start_date", "Start Date:", value = Sys.Date() - 1),
-        dateInput("end_date",   "End Date:",   value = Sys.Date() - 1),
-        br(),
-        actionButton("scrape_btn", "Scrape Data", class = "btn-primary", width = "100%"),
-        br(), br(),
-        downloadButton("download_scrape", "Download CSV", style = "width:100%;"),
-        br(), br(),
-        actionButton("upload_hf_btn", "Upload to HF Dataset", class = "btn-hf", width = "100%")
-      )
+login_js <- tags$script(HTML(paste0("
+  var APP_PASSWORD = '", PASSWORD, "';
+  function tryLogin() {
+    var pw = document.getElementById('login_pw').value;
+    if (pw === APP_PASSWORD) {
+      document.getElementById('login_screen').classList.add('fade-out');
+      setTimeout(function(){ document.getElementById('login_screen').style.display='none'; }, 800);
+    } else {
+      document.getElementById('login_error').textContent = 'Incorrect password';
+      document.getElementById('login_pw').value = '';
+    }
+  }
+  document.addEventListener('DOMContentLoaded', function(){
+    document.getElementById('login_btn').addEventListener('click', tryLogin);
+    document.getElementById('login_pw').addEventListener('keydown', function(e){
+      if (e.key === 'Enter') tryLogin();
+    });
+  });
+")))
+
+# ============================================================
+# UI
+# ============================================================
+ui <- fluidPage(
+  theme = hawks_theme,
+  hawks_css,
+  login_css,
+  tags$div(class = "hawks-shell",
+    tags$div(class = "hawks-topbar",
+      tags$div(class = "topbar-brand",
+        tags$svg(width = "24", height = "24", viewBox = "0 0 30 30", fill = "none",
+          tags$polygon(points = "15,2 28,26 15,21 2,26", fill = HAWKS_ORANGE, opacity = "0.9"),
+          tags$polygon(points = "15,2 15,21 2,26", fill = "#fff", opacity = "0.18")),
+        tags$span(class = "app-title", "Scraper")
+      ),
+      tags$div(class = "topbar-title", "TrackMan Scraper \u2014 2026 Cape"),
+      tags$div(class = "topbar-spacer")
     ),
-    column(8,
-      div(class = "main-panel",
-        h4("Progress", style = "color:#002855; margin-top:0;"),
-        div(class = "status-box", textOutput("scrape_status")),
-        hr(),
-        h4("Data Preview", style = "color:#002855;"),
-        DT::dataTableOutput("scrape_preview")
+    tags$div(class = "hawks-content",
+      fluidRow(
+        column(4,
+          tags$div(class = "data-card",
+            tags$div(class = "data-card-hdr",
+              tags$span(class = "data-card-title", "Controls"),
+              tags$span(class = "data-card-sub", "Source & dates")),
+            tags$div(class = "data-card-body",
+              radioButtons("scrape_source", "Data Source",
+                choices = c("TrackMan PBP" = "pbp", "TrackMan Positional" = "pos"), selected = "pbp"),
+              dateInput("start_date", "Start Date:", value = Sys.Date() - 1),
+              dateInput("end_date",   "End Date:",   value = Sys.Date() - 1),
+              br(),
+              actionButton("scrape_btn", "Scrape Data", class = "btn-scrape"),
+              br(), br(),
+              downloadButton("download_scrape", "Download CSV", style = "width:100%;"),
+              br(), br(),
+              actionButton("upload_hf_btn", "Upload to HF Dataset", class = "btn-hf")
+            )
+          )
+        ),
+        column(8,
+          tags$div(class = "data-card", style = "margin-bottom:16px;",
+            tags$div(class = "data-card-hdr",
+              tags$span(class = "data-card-title", "Progress"),
+              tags$span(class = "data-card-sub", "Live status")),
+            tags$div(class = "data-card-body",
+              tags$div(class = "status-box", textOutput("scrape_status")))
+          ),
+          tags$div(class = "data-card",
+            tags$div(class = "data-card-hdr",
+              tags$span(class = "data-card-title", "Data Preview"),
+              tags$span(class = "data-card-sub", "Scraped rows")),
+            tags$div(class = "data-card-body", DT::dataTableOutput("scrape_preview"))
+          )
+        )
       )
     )
-  )
+  ),
+  login_overlay,
+  login_js
 )
 
-ui <- fluidPage(uiOutput("page"))
-
 # ============================================================
 # Server
 # ============================================================
 server <- function(input, output, session) {
 
-  logged_in <- reactiveVal(FALSE)
-
-  output$page <- renderUI({ if (logged_in()) app_ui else login_ui })
-
-  observeEvent(input$login, {
-    if (nzchar(PASSWORD) && identical(input$login_password, PASSWORD)) {
-      logged_in(TRUE)
-      output$wrong_pass <- renderText("")
-    } else {
-      output$wrong_pass <- renderText("Incorrect password, please try again.")
-    }
-  })
-
   scraped_data      <- reactiveVal(NULL)
   scrape_polling    <- reactiveVal(FALSE)
   scrape_status_msg <- reactiveVal("Ready.")