1<!DOCTYPE html> 2<html lang="en"> 3<head> 4 <meta charset="UTF-8"> 5 <title>Aurora Alerts - Northern Lights</title> 6 <meta name="viewport" content="width=device-width, initial-scale=1" /> 7 <meta name="description" content="Sign up for aurora alerts and get notified when northern lights are visible in your area. Set custom thresholds and receive email notifications."> 8 9 <link rel="canonical" href="https://auroramap.org/pages/alerts.html"> 10 11 <meta property="og:type" content="website"> 12 <meta property="og:url" content="https://auroramap.org/alerts.html"> 13 <meta property="og:title" content="Aurora Alerts - Get Northern Lights Notifications"> 14 <meta property="og:description" content="Sign up for aurora alerts and get notified when northern lights are visible in your area."> 15 <meta property="og:image" content="https://auroramap.org/favicon.svg"> 16 17 <link rel="icon" type="image/svg+xml" href="/favicon.svg"> 18 19 <link rel="stylesheet" href="/styles/style.css"> 20 <link rel="stylesheet" href="/styles/alerts.css"> 21 <link rel="stylesheet" href="/styles/support-modal.css"> 22 23 <link rel="preconnect" href="https://fonts.googleapis.com"> 24 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 25 <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"> 26 27 <!-- Google Consent Mode v2 â must come before gtag.js --> 28
28<script> 29 window.dataLayer = window.dataLayer || []; 30 function gtag(){dataLayer.push(arguments);} 31 gtag('consent', 'default', { 32 analytics_storage: 'denied', 33 ad_storage: 'denied', 34 ad_user_data: 'denied', 35 ad_personalization: 'denied', 36 wait_for_update: 500 37 }); 38 </script>
38 39 <!-- Ads --> 40
40<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-7860016825568010" crossorigin="anonymous"></script>
40 41 <!-- Google tag (gtag.js) -->
vendor: 66 bytes, lines 41-42
41 42 <script async src="https://www.googletagmanager.com/gtag/js?id=
42G-QLENNENVHL
vendor: 14 bytes, lines 42-43
42"></script> 43
43<script>gtag('js', new Date()); gtag('config', 'G-QLENNENVHL');</script>
43 44
44<script src="/js/cookieConsent.js" defer></script>
44 45</head> 46 47<body> 48 <canvas id="auroraBG" aria-hidden="true"></canvas> 49 50 <nav id="mainNav"> 51 <div class="nav-brand"> 52 <a href="/" class="nav-brand-link"> 53 <img src="/favicon.svg" alt="Aurora Viz Logo" class="nav-logo"> 54 <span class="nav-brand-name">AuroraMap</span> 55 </a> 56 </div> 57 <div class="nav-links"> 58 <a href="/" class="nav-link" title="Home"><span class="nav-icon">ð</span></a> 59 <a href="information.html" class="nav-link" title="Information"><span class="nav-icon">â¹ï¸</span></a> 60 <a href="alerts.html" class="nav-link active" title="Alerts"><span class="nav-icon">ð</span></a> 61 <a href="/pages/shop.html" class="nav-link" title="Shop"><span class="nav-icon">ðï¸</span></a> 62 </div> 63 </nav> 64 65 <header class="alerts-header"> 66 <h1 class="alerts-title">Aurora Alerts</h1> 67 <h3 class="alerts-subtitle">Get notified when the aurora is visible in your area</h3> 68 </header> 69 70 <main class="alerts-main"> 71 <div class="alerts-content"> 72 73 <form id="alertSignupForm"> 74 <div id="formMessage" class="form-message" style="display: none;"></div> 75 76 <div class="form-group"> 77 <label for="name">Name</label> 78 <input type="text" id="name" name="name" required placeholder="Your Name"> 79 </div> 80 81 <div class="form-group"> 82 <label for="email">Email</label> 83 <input type="email" id="email" name="email" required placeholder="[email protected]"> 84 </div> 85 86 <div class="form-group"> 87 <label for="location">Location</label> 88 <div class="location-input-wrapper"> 89 <button type="button" id="useMyLocationBtn" class="use-location-btn"> 90 <span class="button-icon">ð</span> Use My Location 91 </button> 92 93 <div class="search-container-inline"> 94 <input type="text" id="location" name="location" placeholder="Search City (e.g. Seattle, WA)" required autocomplete="off"> 95 <div id="alertsSearchDropdown" class="search-dropdown"> 96 <div id="alertsSearchResults" class="search-results"></div> 97 </div> 98 </div> 99 </div> 100 </div> 101 102 <div class="form-group" style="display:none;"> <input type="number" id="latitude" name="latitude" step="0.0001" readonly> 103 <input type="number" id="longitude" name="longitude" step="0.0001" readonly> 104 </div> 105 106 <div class="form-group"> 107 <label for="threshold">Minimum Aurora Probability</label> 108 <div class="threshold-display"> 109 <span id="thresholdValue" class="threshold-value">0%</span> 110 <span id="thresholdLabel" class="threshold-label">Get notified for all aurora activity</span> 111 </div> 112 113 <input type="range" id="threshold" name="threshold" min="0" max="100" value="0" step="1" class="threshold-slider" 114 oninput="document.getElementById('thresholdValue').innerText = this.value + '%'"> 115 116 <div class="threshold-markers"> 117 <span>0%<br><small>All</small></span> 118 <span>25%<br><small>Likely</small></span> 119 <span>50%<br><small>Good</small></span> 120 <span>75%<br><small>Excellent</small></span> 121 <span>100%<br><small>Extreme</small></span> 122 </div> 123 </div> 124 125 <div class="form-group"> 126 <label for="cooldown">Alert Frequency</label> 127 <select id="cooldown" name="cooldown"> 128 <option value="smart" selected>Smart (recommended)</option> 129 <option value="1">Up to once an hour</option> 130 <option value="3">At most every 3 hours</option> 131 <option value="12">At most once a night (12 hours)</option> 132 <option value="24">At most once a day</option> 133 </select> 134 <p class="form-help">Smart sends one alert, then stays quiet for 12 hours unless the chance at your location jumps by 10 points or more.</p> 135 </div> 136 137 <button type="submit" id="submitAlertsBtn" class="submit-btn">Sign up for alerts</button> 138 </form> 139 </div> 140 141 <div class="alerts-intro-bottom"> 142 <div class="feature"> 143 <div class="icon">â¡</div> 144 <h4>Real-time</h4> 145 <p>Instant notifications</p> 146 </div> 147 <div class="feature"> 148 <div class="icon">ð¯</div> 149 <h4>Customizable</h4> 150 <p>Set your probability</p> 151 </div> 152 <div class="feature"> 153 <div class="icon">ð</div> 154 <h4>Local</h4> 155 <p>Tailored to you</p> 156 </div> 157 </div> 158 </main> 159 160 <footer> 161 </footer> 162 163
163<script src="/js/footer.js"></script>
163 164 165
165<script type="module" src="/js/locationSearch.js"></script>
165 166
166<script type="module" src="/js/alerts.js"></script>
166 167 168</body> 169</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.