Files
infstarweb/stats.html

218 lines
10 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>玩家数据统计 - 白鹿原 Minecraft 服务器</title>
<meta name="description" content="查看白鹿原Minecraft服务器全面的玩家数据统计与排行榜包括总游戏时长、方块放置与破坏数、击杀数、死亡数等多项数据指标。搜索玩家名称查看个人详细统计信息实时了解服务器玩家活跃度与数据榜单发现白鹿原最活跃的冒险家们。">
<meta name="keywords" content="Minecraft玩家数据,服务器统计,玩家排行榜,白鹿原数据,MC统计,游戏时长排行">
<meta name="author" content="白鹿原 Minecraft 服务器">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://mcpure.lunadeer.cn/stats.html">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://mcpure.lunadeer.cn/stats.html">
<meta property="og:title" content="玩家数据统计 - 白鹿原 Minecraft 服务器">
<meta property="og:description" content="查看白鹿原Minecraft服务器玩家数据统计与排行榜包括游戏时长、方块放置破坏、击杀死亡等多项数据。搜索玩家名称查看详细信息发现最活跃的冒险家。">
<meta property="og:image" content="https://img.lunadeer.cn/i/2024/04/22/6625ce6c8ddc1.png">
<meta property="og:site_name" content="白鹿原 Minecraft 服务器">
<!-- Twitter -->
<meta property="twitter:card" content="summary">
<meta property="twitter:url" content="https://mcpure.lunadeer.cn/stats.html">
<meta property="twitter:title" content="玩家数据统计 - 白鹿原 Minecraft 服务器">
<meta property="twitter:description" content="查看白鹿原Minecraft服务器玩家数据统计与排行榜包括游戏时长、方块放置破坏、击杀死亡等多项数据。搜索玩家名称查看详细信息发现最活跃的冒险家。">
<meta property="twitter:image" content="https://img.lunadeer.cn/i/2024/04/22/6625ce6c8ddc1.png">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="css/style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://img.lunadeer.cn">
<link rel="dns-prefetch" href="https://outline.lunadeer.cn">
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700&family=Inter:wght@400;600;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<link rel="stylesheet" href="css/pages/stats.css">
<!-- Structured Data -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebPage",
"name": "玩家数据统计",
"description": "白鹿原Minecraft服务器玩家数据统计和排行榜",
"url": "https://mcpure.lunadeer.cn/stats.html",
"isPartOf": {
"@type": "WebSite",
"name": "白鹿原 Minecraft 服务器",
"url": "https://mcpure.lunadeer.cn/"
}
}
</script>
</head>
<body>
<div id="navbar-component"></div>
<!-- Hero Section -->
<header id="hero-component" data-title="数据中心" data-subtitle="记录每一位冒险者的足迹" data-class="stats-hero-bg"></header>
<!-- Main Content -->
<div class="features-section stats-main-section">
<div class="container">
<!-- Leaderboards -->
<h2 class="section-header">排行榜</h2>
<p class="stats-updated-at" id="stats-updated-at"></p>
<div class="leaderboard-grid" id="leaderboard-container">
<!-- 1. Walker -->
<div class="lb-card gold">
<div class="lb-header">
<div class="lb-icon"><i class="fas fa-walking"></i></div>
<div class="lb-title">旅行者</div>
</div>
<div class="lb-content" id="lb-walk">
<div class="lb-top-player">加载中...</div>
</div>
</div>
<!-- 2. Placer -->
<div class="lb-card silver">
<div class="lb-header">
<div class="lb-icon"><i class="fas fa-cube"></i></div>
<div class="lb-title">搬石大师</div>
</div>
<div class="lb-content" id="lb-placed">
<div class="lb-top-player">加载中...</div>
</div>
</div>
<!-- 3. Miner -->
<div class="lb-card bronze">
<div class="lb-header">
<div class="lb-icon"><i class="fas fa-hammer"></i></div>
<div class="lb-title">挖挖机</div>
</div>
<div class="lb-content" id="lb-mined">
<div class="lb-top-player">加载中...</div>
</div>
</div>
<!-- 4. Deaths -->
<div class="lb-card red">
<div class="lb-header">
<div class="lb-icon"><i class="fas fa-skull"></i></div>
<div class="lb-title">亡灵</div>
</div>
<div class="lb-content" id="lb-deaths">
<div class="lb-top-player">加载中...</div>
</div>
</div>
<!-- 5. Play Time -->
<div class="lb-card purple">
<div class="lb-header">
<div class="lb-icon"><i class="fas fa-crown"></i></div>
<div class="lb-title">尊者</div>
</div>
<div class="lb-content" id="lb-playtime">
<div class="lb-top-player">加载中...</div>
</div>
</div>
<!-- 6. Kills -->
<div class="lb-card kill-red">
<div class="lb-header">
<div class="lb-icon"><i class="fas fa-crosshairs"></i></div>
<div class="lb-title">屠夫</div>
</div>
<div class="lb-content" id="lb-kills">
<div class="lb-top-player">加载中...</div>
</div>
</div>
</div>
<!-- Search & Grid -->
<h2 class="section-header">玩家档案</h2>
<div class="search-container">
<i class="fas fa-search search-icon"></i>
<input type="text" id="player-search" class="search-input" placeholder="搜索玩家名称或 UUID...">
</div>
<div class="stats-grid" id="players-grid">
<!-- Players injected here -->
</div>
<div class="load-more-container">
<button id="load-more-btn" class="load-more-btn">加载更多</button>
</div>
<div id="loading-indicator" class="loading-text">正在从服务器获取数据...</div>
</div>
</div>
<!-- Player Details Modal -->
<div id="player-modal" class="modal">
<div class="modal-content expanded-modal">
<span class="close-modal">&times;</span>
<!-- Top Section: Header Info + Summary Stats -->
<div class="modal-top-section">
<!-- Left: Identity -->
<div class="modal-identity">
<img id="modal-avatar" src="" alt="Avatar">
<h2 id="modal-name">Player Name</h2>
<p id="modal-uuid">UUID</p>
</div>
<!-- Right: Summary Stats -->
<div class="stats-list-container compact-stats">
<div class="stat-row">
<span class="stat-label"><i class="fas fa-walking"></i> 行走距离</span>
<span class="stat-value" id="modal-walk">0 m</span>
</div>
<div class="stat-row">
<span class="stat-label"><i class="fas fa-cube"></i> 放置方块</span>
<span class="stat-value" id="modal-placed">0</span>
</div>
<div class="stat-row">
<span class="stat-label"><i class="fas fa-hammer"></i> 挖掘方块</span>
<span class="stat-value" id="modal-mined">0</span>
</div>
<div class="stat-row">
<span class="stat-label"><i class="fas fa-skull"></i> 死亡次数</span>
<span class="stat-value" id="modal-deaths">0</span>
</div>
<div class="stat-row">
<span class="stat-label"><i class="fas fa-crosshairs"></i> 击杀数量</span>
<span class="stat-value" id="modal-kills">0</span>
</div>
<div class="stat-row">
<span class="stat-label"><i class="fas fa-crown"></i> 游玩时间</span>
<span class="stat-value" id="modal-playtime">0 秒</span>
</div>
</div>
</div>
<!-- Bottom Section: Detailed Stats Accordion -->
<div class="modal-details-section">
<hr class="modal-divider">
<div id="loading-details" class="loading-details-text">正在加载详细数据...</div>
<div id="stats-accordion" class="accordion">
<!-- Dynamic Content -->
</div>
</div>
</div>
</div>
<div id="footer-component"></div>
<script src="js/components.js"></script>
<script src="js/stats_script.js"></script>
</body>
</html>