hedgertronic.github.io/index.html at main · hedgertronic/hedgertronic.github.io · 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
<!DOCTYPE html>
<html lang="en" style="background-color: #0a1317;">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
    <meta name="color-scheme" content="dark">
    <meta name="theme-color" content="#0a1317">
    <script>
        // Single source of truth for theme configuration
        window.__themeConfig = {
            colors: { driveline: "#0a0a0a", hopkins: "#0a0f17", mets: "#0a1222", phillies: "#170a0c", rangers: "#0a1017", marlins: "#0a1317" },
            headshots: {
                driveline: "/assets/images/headshot/headshot-dl-sm.jpg",
                hopkins: "/assets/images/headshot/headshot-dl-sm.jpg",
                mets: "/assets/images/headshot/headshot-mets-sm.jpg",
                phillies: "/assets/images/headshot/headshot-phillies-sm.jpg",
                rangers: "/assets/images/headshot/headshot-dl-sm.jpg",
                marlins: "/assets/images/headshot/headshot-dl-sm.jpg"
            }
        };
        // Apply theme background IMMEDIATELY - before any rendering
        (function() {
            var cfg = window.__themeConfig;
            var theme = localStorage.getItem("theme") || "marlins";
            var color = cfg.colors[theme] || cfg.colors.marlins;
            window.__currentTheme = theme;
            window.__currentColor = color;
            document.documentElement.setAttribute("data-theme", theme);
            document.documentElement.style.backgroundColor = color;
            var meta = document.querySelector('meta[name="theme-color"]');
            if (meta) meta.setAttribute("content", color);
            // Handle Safari bfcache restoration (use the live theme color, not the load-time one)
            window.addEventListener("pageshow", function(e) {
                if (e.persisted) {
                    document.documentElement.style.backgroundColor = window.__currentColor || color;
                }
            });
        })();
    </script>
    <!-- Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-35RY8Y6Q5V"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      // `config` fires the automatic page_view, and localhost dev sessions must
      // not count as production traffic. Mirrors the guard in hot-stove's
      // index.html. Accepted gap: a LAN phone test (192.168.x) still fires.
      var h = location.hostname;
      if (h !== 'localhost' && h !== '127.0.0.1' && h !== '')
        gtag('config', 'G-35RY8Y6Q5V');
    </script>
    <meta name="description" content="Professional pitcher in the Marlins organization and R&D analyst at Driveline Baseball.">

    <!-- Open Graph -->
    <meta property="og:type" content="website">
    <meta property="og:url" content="https://hedgertronic.com/">
    <meta property="og:title" content="Josh Hejka">
    <meta property="og:description" content="Professional pitcher in the Marlins organization and R&D analyst at Driveline Baseball.">
    <meta property="og:image" content="https://hedgertronic.com/assets/images/og/og-image.png">

    <!-- Twitter Card -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:site" content="@hedgertronic">
    <meta name="twitter:title" content="Josh Hejka">
    <meta name="twitter:description" content="Professional pitcher in the Marlins organization and R&D analyst at Driveline Baseball.">
    <meta name="twitter:image" content="https://hedgertronic.com/assets/images/og/og-image.png">

    <title>Josh Hejka</title>
    <link rel="icon" href="/assets/images/favicons/favicon.ico?v=12" sizes="32x32">
    <link rel="icon" type="image/png" href="/assets/images/favicons/favicon-16.png?v=12" sizes="16x16">
    <link rel="icon" type="image/png" href="/assets/images/favicons/favicon-32.png?v=12" sizes="32x32">
    <!-- Google Search reads the homepage favicon for every result on the
         domain and wants at least 48px (multiples of 48 preferred); the
         16/32px icons alone render as a blurry upscale in SERPs. -->
    <link rel="icon" type="image/png" href="/assets/images/favicons/favicon-96.png?v=12" sizes="96x96">
    <link rel="apple-touch-icon" href="/assets/images/favicons/apple-touch-icon.png?v=12">
    <style>
        /* Critical CSS: prevent background flash before external CSS loads.
           The page background lives on html/body (not a fixed overlay) so iOS
           26 Safari can sample it for Liquid Glass toolbar tint and extend it
           into the toolbar and overscroll areas. */
        html, body { background-color: #0a1317; }
        [data-theme="driveline"], [data-theme="driveline"] body { background-color: #0a0a0a; }
        [data-theme="mets"], [data-theme="mets"] body { background-color: #0a1222; }
        [data-theme="phillies"], [data-theme="phillies"] body { background-color: #170a0c; }
        [data-theme="rangers"], [data-theme="rangers"] body { background-color: #0a1017; }
        [data-theme="hopkins"], [data-theme="hopkins"] body { background-color: #0a0f17; }
    </style>
    <link rel="stylesheet" href="/styles.css">
    <script>
        // Preload theme-specific headshot for faster LCP (uses config from above)
        (function() {
            var cfg = window.__themeConfig;
            var theme = window.__currentTheme || "marlins";
            var headshot = cfg.headshots[theme] || cfg.headshots.marlins;
            var link = document.createElement("link");
            link.rel = "preload";
            link.as = "image";
            link.href = headshot;
            link.fetchPriority = "high";
            document.head.appendChild(link);
            window.__themeHeadshot = headshot;
        })();
    </script>
</head>
<body id="top" style="background-color: #0a1317;">
    <script>
        // Immediately apply theme background to body (uses cached value from head)
        document.body.style.backgroundColor = window.__currentColor || "#0a1317";
    </script>
    <header></header>
    <main>
        <section id="about" class="hero">
            <div class="container">
                <div class="hero-intro">
                    <!-- Static content pre-rendered for instant display, zero layout shift -->
                    <img id="hero-headshot-img"
                         src="/assets/images/headshot/headshot-dl-sm.jpg"
                         alt="Josh Hejka"
                         class="hero-headshot"
                         width="100"
                         height="100"
                         fetchpriority="high">
                    <script>
                        // Update headshot src immediately after element exists
                        if (window.__themeHeadshot) {
                            document.getElementById("hero-headshot-img").src = window.__themeHeadshot;
                        }
                    </script>
                    <h1 class="hero-name">Josh Hejka</h1>
                    <p class="hero-description">Professional pitcher in the Marlins organization. Former member of the Mets, Phillies, and Rangers. Current R&D analyst at Driveline Baseball.</p>
                    <!-- Social links populated by JS -->
                    <div class="social-links"></div>
                </div>
                <!-- Hero nav placeholder - reserves space to prevent layout shift -->
                <nav class="hero-nav"></nav>
            </div>
        </section>
    </main>
    <footer></footer>
    <script defer src="/script.js"></script>
</body>
</html>