1<!DOCTYPE html> 2<html lang="en"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>IoTeXLab - Validator Node & Staking Hub</title> 7 <link href="https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Courier+Prime:wght@400;700&family=IBM+Plex+Mono:wght@400;600&display=swap" rel="stylesheet"> 8 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"> 9
9<script type="module" crossorigin src="/assets/main-Du7OxYjk.js"></script>
9 10 <link rel="modulepreload" crossorigin href="/assets/styles-CREPMQu3.js"> 11 <link rel="modulepreload" crossorigin href="/assets/vendor-C4-Xx_9d.js"> 12 <link rel="modulepreload" crossorigin href="/assets/wallet-selector-CJxmKkox.js"> 13 <link rel="modulepreload" crossorigin href="/assets/wallet-ui-BDQllbJT.js"> 14 <link rel="stylesheet" crossorigin href="/assets/styles-CSj4q6vj.css"> 15</head> 16<body> 17 <!-- Navigation --> 18 <nav class="navbar"> 19 <div class="nav-container"> 20 <div class="logo-wrapper"> 21 <a href="#" class="logo" id="logoLink"> 22 <span class="logo-gradient">IoTeXLab</span> 23 <span class="beta-badge">BETA</span> 24 </a> 25 <a href="https://t.me/iotexlab" target="_blank" class="feedback-link"><i class="fab fa-telegram"></i> Send Feedback</a> 26 </div> 27 <div class="nav-search"> 28 <i class="fas fa-search nav-search-icon"></i> 29 <input type="text" id="navSearchInput" class="nav-search-input" placeholder="Address or Bucket ID" autocomplete="off" spellcheck="false"> 30 </div> 31 <button class="nav-toggle" aria-label="Toggle navigation"> 32 <span></span> 33 <span></span> 34 <span></span> 35 </button> 36 <ul class="nav-links"> 37 <li><a href="#stats">Network</a></li> 38 <li><a href="#delegates">Validators</a></li> 39 <li><a href="/address.html">Explorer</a></li> 40 <li><a href="/staking.html">Stake</a></li> 41 <li><a href="#resources">Resources</a></li> 42 <li><a href="/updates.html">Updates</a></li> 43 <!-- Wallet button will be inserted here by wallet-ui.js --> 44 </ul> 45 </div> 46 </nav> 47 48 <!-- Hero Section --> 49 <section class="hero"> 50 <!-- Animated Network Background --> 51 <div class="hero-network-bg"> 52 <div class="network-grid"></div> 53 <div class="network-nodes"> 54 <div class="node node-1"></div> 55 <div class="node node-2"></div> 56 <div class="node node-3"></div> 57 <div class="node node-4"></div> 58 <div class="node node-5"></div> 59 <div class="node node-6"></div> 60 <div class="node node-7"></div> 61 <div class="node node-8"></div> 62 </div> 63 <div class="data-streams"> 64 <div class="stream stream-1"></div> 65 <div class="stream stream-2"></div> 66 <div class="stream stream-3"></div> 67 </div> 68 <div class="glow-orbs"> 69 <div class="orb orb-green"></div> 70 <div class="orb orb-cyan"></div> 71 </div> 72 </div> 73 <div class="hero-bg-effect"></div> 74 <div class="hero-content hero-content-centered"> 75 <div class="hero-text hero-text-centered"> 76 <h1 class="hero-title">Join <span class="text-gradient">IoTeXLab</span> Validator</h1> 77 <p class="hero-subtitle">A reliable validator for IoTeX staking.<br>Transparent, community-focused, and committed to network growth.</p> 78 <div class="hero-cta"> 79 <a href="/staking.html" class="btn btn-primary">Start Staking</a> 80 <button class="btn btn-secondary" id="viewDelegatesBtn">View Validators</button> 81 </div> 82 </div> 83 </div> 84 <button class="scroll-indicator" id="scrollIndicator" aria-label="Scroll to network status"> 85 <i class="fas fa-chevron-down"></i> 86 </button> 87 </section> 88 89 <!-- Live Chain Stats --> 90 <section class="stats" id="stats"> 91 <div class="container"> 92 <h2 class="section-title">Network Status</h2> 93 <div class="stats-grid"> 94 <div class="stat-card"> 95 <div class="stat-label">Current Block</div> 96 <div class="stat-value" id="chainHeight">--</div> 97 <div class="stat-subtext">Height</div> 98 </div> 99 <div class="stat-card"> 100 <div class="stat-label">Current Epoch</div> 101 <div class="stat-value" id="chainEpoch">--</div> 102 <div class="stat-subtext">Number</div> 103 </div> 104 <div class="stat-card"> 105 <div class="stat-label">Epoch Progress</div> 106 <div class="stat-value" id="chainEpochHeight">--</div> 107 <div class="stat-subtext">of 1440 Blocks</div> 108 <div class="epoch-progress-bar-container"> 109 <div class="epoch-progress-bar"> 110 <div class="epoch-progress-fill" id="epochProgressBar"></div> 111 </div> 112 </div> 113 </div> 114 <div class="stat-card stat-card-tps"> 115 <div class="stat-label">Network Throughput</div> 116 <div class="tps-content"> 117 <div class="tps-value-display">
118 <span class="stat-value" id="chainTPS">--</span> 119 <span class="stat-subtext">TPS</span> 120 </div> 121 <div class="tps-gauge"> 122 <svg class="gauge-svg" viewBox="0 0 120 75"> 123 <!-- Gradient definition --> 124 <defs> 125 <linearGradient id="tpsGradient" x1="0%" y1="0%" x2="100%" y2="0%"> 126 <stop offset="0%" stop-color="#22c55e" /> 127 <stop offset="50%" stop-color="#4ade80" /> 128 <stop offset="100%" stop-color="#00d9ff" /> 129 </linearGradient> 130 </defs> 131 <!-- Background arc --> 132 <path class="gauge-bg" d="M 15 60 A 45 45 0 0 1 105 60" /> 133 <!-- Colored arc --> 134 <path class="gauge-fill" d="M 15 60 A 45 45 0 0 1 105 60" /> 135 <!-- Tick marks (logarithmic: 1, 10, 100, 1K, 2K) --> 136 <g class="gauge-ticks"> 137 <line x1="15" y1="60" x2="22" y2="60" /> 138 <line x1="23" y1="33" x2="29" y2="37" /> 139 <line x1="49" y1="17" x2="52" y2="24" /> 140 <line x1="82" y1="20" x2="79" y2="27" /> 141 <line x1="105" y1="60" x2="98" y2="60" /> 142 </g> 143 <!-- Tick labels (logarithmic scale) --> 144 <g class="gauge-labels"> 145 <text x="10" y="72">1</text> 146 <text x="14" y="28">10</text> 147 <text x="44" y="10">100</text> 148 <text x="80" y="12">1K</text> 149 <text x="102" y="72">2K</text> 150 </g> 151 <!-- Needle --> 152 <g class="gauge-needle" id="tpsNeedle"> 153 <circle cx="60" cy="60" r="5" class="needle-base" /> 154 <path d="M 60 60 L 58 56 L 60 20 L 62 56 Z" class="needle-pointer" /> 155 </g> 156 <!-- Center glow --> 157 <circle cx="60" cy="60" r="3" class="needle-center" /> 158 </svg> 159 </div> 160 </div> 161 </div> 162 <div class="stat-card"> 163 <div class="stat-label">Eligible Validators</div> 164 <div class="stat-value"> 165 <span id="eligibleDelegateCount">--</span> 166 <span id="totalDelegateCount" class="total-count">/ --</span> 167 </div> 168 <div class="stat-subtext">Can Accept Staking</div> 169 </div> 170 <div class="stat-card"> 171 <div class="stat-label">Total Votes</div> 172 <div class="stat-value" id="totalVotesNetwork">--</div> 173 <div class="stat-subtext">Weighted (Top 100)</div> 174 </div> 175 <div class="stat-card stat-card-status" id="probatedCard"> 176 <div class="stat-label">Probated Validators</div> 177 <div class="stat-value" id="probatedCount"> 178 <i class="fas fa-check-circle status-ok-icon"></i> 179 </div> 180 <div class="stat-subtext status-list" id="probatedList">All validators active</div> 181 </div> 182 <div class="stat-card stat-card-status" id="slowDelegatesCard"> 183 <div class="stat-label">Block Production</div> 184 <div class="stat-value" id="slowDelegatesCount"> 185 <i class="fas fa-check-circle status-ok-icon"></i> 186 </div> 187 <div class="stat-subtext status-list" id="slowDelegatesList">All validators on track</div> 188 </div> 189 </div> 190 </div> 191 </section> 192 193 <!-- Delegates Section --> 194 <section class="delegates" id="delegates"> 195 <div class="container"> 196 <h2 class="section-title" style="margin: 0 0 1rem 0;">All Validators</h2> 197 <p class="section-subtitle">Vote for validators to secure the network and earn rewards. IoTeXLab is highlighted below.</p> 198 <div class="delegates-warning" id="delegatesWarning" style="display: none;"> 199 <i class="fas fa-exclamation-triangle"></i>
200 <span id="delegatesWarningText"></span> 201 </div> 202 203 <!-- Flexible header with live data and pagination --> 204 <div class="delegates-header-wrap"> 205 <span id="delegatesRefreshStatus" class="delegates-live-status">Updating...</span> 206 <div id="delegatesPaginationTop" class="delegates-pagination-inline"> 207 <!-- Pagination controls populated by JS --> 208 </div> 209 </div> 210 <div class="delegates-table-wrapper"> 211 <table class="delegates-table"> 212 <thead> 213 <tr> 214 <th>Rank</th> 215 <th>Validator</th> 216 <th>Votes</th> 217 <th>Blocks</th> 218 </tr> 219 </thead> 220 <tbody id="delegatesBody"> 221 <!-- Populated by JS --> 222 </tbody> 223 </table> 224 <div id="delegatesPagination" style="margin-top: 1.5rem;"> 225 <!-- Pagination controls populated by JS --> 226 </div> 227 </div> 228 </div> 229 </section> 230 231 <!-- Staking CTA Section --> 232 <section id="staking" style="padding: 4rem 1.5rem; background: linear-gradient(135deg, rgba(34, 197, 94, 0.1) 0%, transparent 100%); position: relative; z-index: 1;"> 233 <div class="container" style="max-width: 1400px; margin: 0 auto; text-align: center;"> 234 <h2 class="section-title">Ready to Stake?</h2> 235 <p style="color: var(--color-text-secondary); margin-bottom: 2rem; font-size: 1.1rem; max-width: 600px; margin-left: auto; margin-right: auto;"> 236 Stake your IOTX tokens with IoTeXLab and earn rewards. Lock your stake for more voting power and higher returns. 237 </p> 238 <a href="/staking.html" class="btn btn-primary" style="display: inline-block;"> 239 Stake with IoTeXLab 240 </a> 241 </div> 242 </section> 243 244 <!-- Educational Resources --> 245 <section class="resources" id="resources"> 246 <div class="container"> 247 <h2 class="section-title">Learning Resources</h2> 248 <div class="resources-grid"> 249 <div class="resource-card"> 250 <div class="resource-icon">ð</div> 251 <h3>IoTeX Basics</h3> 252 <p>Understand blockchain fundamentals, consensus mechanisms, and how IoTeX powers IoT applications.</p> 253 </div> 254 <div class="resource-card"> 255 <div class="resource-icon">ð</div> 256 <h3>Staking Guide</h3> 257 <p>Complete walkthrough for staking IOTX tokens, selecting validators, and maximizing rewards.</p> 258 </div> 259 <div class="resource-card"> 260 <div class="resource-icon">ð»</div> 261 <h3>Developer Docs</h3> 262 <p>Technical documentation for building on IoTeX, including smart contracts and APIs.</p> 263 </div> 264 <div class="resource-card"> 265 <div class="resource-icon">ð</div> 266 <h3>Network Upgrades</h3> 267 <p>Stay updated on IoTeX protocol improvements, new features, and ecosystem developments.</p> 268 </div> 269 <div class="resource-card"> 270 <div class="resource-icon">ð¡ï¸</div> 271 <h3>Security Best Practices</h3> 272 <p>Learn how to securely manage your keys, wallets, and staking operations.</p> 273 </div> 274 <div class="resource-card"> 275 <div class="resource-icon">ð</div> 276 <h3>Community</h3> 277 <p>Join the IoTeX community forums, Discord, and events to connect with other participants.</p> 278 </div> 279 </div> 280 </div> 281 </section> 282 283 <!-- Footer --> 284 <footer class="footer"> 285 <div class="container"> 286 <div class="footer-content"> 287 <div class="footer-section"> 288 <h4>About IoTeXLab <span class="beta-badge">BETA</span></h4> 289 <p>Real-time IoTeX blockchain dashboard providing live validator statistics, staking information, and network metrics. Supporting secure participation in the IoTeX ecosystem.</p> 290 <div class="footer-social"> 291 <a href="https://twitter.com/iotexlab" target="_blank" title="IoTeXLab on X" class="social-icon"> 292 <i class="fab fa-x-twitter"></i> 293 </a> 294 <a href="https://t.me/iotexlab" target="_blank" title="Feedback on Telegram" class="social-icon"> 295 <i class="fab fa-telegram"></i> 296 </a> 297 </div> 298 <p class="feedback-note"><a href="https://t.me/iotexlab" target="_blank">Send us feedback on Telegram â</a></p> 299 </div> 300 <div class="footer-section"> 301 <h4>Navigation</h4> 302 <ul> 303 <li><a href="#stats">Network Status</a></li> 304 <li><a href="#delegates">Active Validators</a></li> 305 <li><a href="#resources">Learning Resources</a></li> 306 <li><a href="/staking.html">Stake with IoTeXLab</a></li> 307 <li><a href="/updates.html">Updates</a></li> 308 </ul> 309 </div> 310 <div class="footer-section"> 311 <h4>Resources</h4> 312 <ul> 313 <li><a href="https://iotex.io" target="_blank">IoTeX Official â</a></li> 314 <li><a href="https://docs.iotex.io" target="_blank">Documentation â</a></li> 315 <li><a href="https://github.com/iotexproject" target="_blank">GitHub â</a></li> 316 <li><a href="https://community.iotex.io" target="_blank">Community â</a></li> 317 </ul> 318 </div> 319 <div class="footer-section"> 320 <h4>Network Info</h4> 321 <div class="network-stats"> 322 <div class="stat-item">
323 <span class="stat-label">Chain</span> 324 <span class="stat-value">IoTeX Mainnet</span> 325 </div> 326 <div class="stat-item"> 327 <span class="stat-label">Explorer</span> 328 <a href="https://iotexscan.io" target="_blank">IoTeXscan â</a> 329 </div> 330 </div> 331 </div> 332 </div> 333 <div class="footer-divider"></div> 334 <div class="footer-bottom"> 335 <div class="footer-left"> 336 <p>© 2026 <strong>IoTeXLab</strong>. All rights reserved.</p> 337 </div> 338 <div class="footer-center"> 339 <a href="#">Privacy Policy</a> 340 <span class="divider">â¢</span> 341 <a href="#">Terms of Service</a> 342 </div> 343 <div class="footer-right"> 344 <p>Built with <span class="heart">â¥</span> for IoTeX</p> 345 </div> 346 </div> 347 </div> 348 </footer> 349 350</body> 351</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.