Files
infstarweb/facilities.html

321 lines
17 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公共设施,白鹿原设施,Minecraft农场,服务器公共资源">
<meta name="author" content="白鹿原 Minecraft 服务器">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://mcpure.lunadeer.cn/facilities.html">
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website">
<meta property="og:url" content="https://mcpure.lunadeer.cn/facilities.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 服务器">
<meta property="og:locale" content="zh_CN">
<!-- Twitter -->
<meta property="twitter:card" content="summary">
<meta property="twitter:url" content="https://mcpure.lunadeer.cn/facilities.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 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/facilities.css">
<!-- Structured Data -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebPage",
"name": "全服共享资源",
"description": "白鹿原Minecraft服务器全服共享资源一览",
"url": "https://mcpure.lunadeer.cn/facilities.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="facilities-hero-bg"></header>
<div class="facilities-container">
<!-- Controls -->
<div class="controls-section">
<div class="controls-header-row">
<div class="title-with-action">
<h2 class="section-title">设施列表</h2>
<button class="btn-add-facility" id="btn-add-facility">
<i class="fas fa-plus"></i> 新增设施
</button>
</div>
<div class="search-box">
<i class="fas fa-search"></i>
<input type="text" id="facility-search" placeholder="搜索设施名称...">
</div>
</div>
<div class="filters-wrapper">
<div class="filter-group">
<div class="filter-label"><i class="fas fa-layer-group"></i> 类型</div>
<div class="filter-tags" id="type-filters">
<button class="filter-tag active" data-filter="all">全部</button>
<button class="filter-tag" data-filter="resource"><i class="fas fa-cube"></i> 资源</button>
<button class="filter-tag" data-filter="xp"><i class="fas fa-star"></i> 经验</button>
<button class="filter-tag" data-filter="infrastructure"><i class="fas fa-road"></i> 基建</button>
</div>
</div>
<div class="filter-group">
<div class="filter-label"><i class="fas fa-globe"></i> 维度</div>
<div class="filter-tags" id="dimension-filters">
<button class="filter-tag active" data-filter="all">全部</button>
<button class="filter-tag" data-filter="overworld">主世界</button>
<button class="filter-tag" data-filter="nether">下界</button>
<button class="filter-tag" data-filter="end">末地</button>
</div>
</div>
</div>
</div>
<!-- Facilities Grid -->
<div class="facilities-grid" id="facilities-list">
<!-- JS will inject cards here -->
</div>
<div id="no-results" class="no-results-message is-hidden">
没有找到匹配的设施
</div>
</div>
<!-- Facility Modal -->
<div id="facility-modal" class="modal">
<div class="modal-content facility-modal-content">
<span class="close-modal">&times;</span>
<div class="modal-header">
<h3 class="modal-title" id="modal-title">设施名称</h3>
<div class="modal-badges-row">
<div class="modal-badges" id="modal-badges">
<!-- Badges injected by JS -->
</div>
<div class="modal-actions">
<button class="btn-share-facility" id="btn-share-facility" title="分享此设施">
<i class="fas fa-share-alt"></i> 分享
</button>
<button class="btn-edit-facility" id="btn-edit-facility" title="编辑此设施">
<i class="fas fa-pen"></i> 编辑
</button>
</div>
</div>
</div>
<div class="modal-body">
<p class="modal-intro" id="modal-intro">设施简介...</p>
<div class="modal-section">
<h4 class="modal-section-title"><i class="fas fa-map-marker-alt"></i> 位置信息</h4>
<p>
<span id="modal-dimension"></span>:
<span id="modal-coords"></span>
<a href="#" target="_blank" id="modal-map-link" class="map-link">
<i class="fas fa-map-marked-alt"></i> 查看地图
</a>
</p>
</div>
<div class="modal-section">
<h4 class="modal-section-title"><i class="fas fa-users-cog"></i> 贡献/维护人员</h4>
<div class="contributors-list" id="modal-contributors">
<!-- Contributors injected by JS -->
</div>
</div>
<div class="modal-section">
<h4 class="modal-section-title"><i class="fas fa-book-open"></i> 使用说明</h4>
<div class="instruction-content" id="modal-instructions">
<!-- Instructions injected by JS -->
</div>
</div>
<div class="modal-section">
<h4 class="modal-section-title"><i class="fas fa-exclamation-triangle"></i> 注意事项</h4>
<div class="notes-content" id="modal-notes">
<!-- Notes injected by JS -->
</div>
</div>
</div>
</div>
</div>
<!-- Editor Modal -->
<div id="editor-modal" class="modal">
<div class="modal-content editor-modal-content">
<span class="close-editor-modal">&times;</span>
<div class="editor-modal-header">
<h3><i class="fas fa-tools"></i> 设施编辑器</h3>
</div>
<div class="editor-layout">
<!-- Left: Preview -->
<div class="editor-preview">
<div class="editor-panel-title"><i class="fas fa-eye"></i> 实时预览</div>
<div class="editor-preview-content" id="editor-preview-area"></div>
</div>
<!-- Right: Editor Form -->
<div class="editor-form">
<div class="editor-panel-title"><i class="fas fa-edit"></i> 编辑内容</div>
<div class="editor-form-scroll">
<div class="form-group">
<label for="editor-title">设施名称</label>
<input type="text" id="editor-title" placeholder="输入设施名称...">
</div>
<div class="form-group">
<label for="editor-intro">设施简介</label>
<textarea id="editor-intro" placeholder="输入设施简介..." rows="3"></textarea>
</div>
<div class="form-row">
<div class="form-group">
<label>类型</label>
<div class="custom-select">
<input type="hidden" id="editor-type" value="resource">
<div class="custom-select-trigger">
<span class="custom-select-text">资源类</span>
<i class="fas fa-chevron-down"></i>
</div>
<div class="custom-select-options">
<div class="custom-option selected" data-value="resource">资源类</div>
<div class="custom-option" data-value="xp">经验类</div>
<div class="custom-option" data-value="infrastructure">基础设施</div>
</div>
</div>
</div>
<div class="form-group">
<label>状态</label>
<div class="custom-select">
<input type="hidden" id="editor-status" value="online">
<div class="custom-select-trigger">
<span class="custom-select-text">正常运行</span>
<i class="fas fa-chevron-down"></i>
</div>
<div class="custom-select-options">
<div class="custom-option selected" data-value="online">正常运行</div>
<div class="custom-option" data-value="maintenance">维护中</div>
<div class="custom-option" data-value="offline">暂时失效</div>
</div>
</div>
</div>
<div class="form-group">
<label>维度</label>
<div class="custom-select">
<input type="hidden" id="editor-dimension" value="overworld">
<div class="custom-select-trigger">
<span class="custom-select-text">主世界</span>
<i class="fas fa-chevron-down"></i>
</div>
<div class="custom-select-options">
<div class="custom-option selected" data-value="overworld">主世界</div>
<div class="custom-option" data-value="nether">下界</div>
<div class="custom-option" data-value="end">末地</div>
</div>
</div>
</div>
</div>
<div class="form-row coords-row">
<div class="form-group">
<label for="editor-x">X 坐标</label>
<input type="number" id="editor-x" placeholder="0">
</div>
<div class="form-group">
<label for="editor-y">Y 坐标</label>
<input type="number" id="editor-y" placeholder="64">
</div>
<div class="form-group">
<label for="editor-z">Z 坐标</label>
<input type="number" id="editor-z" placeholder="0">
</div>
</div>
<div class="form-group">
<label>贡献/维护人员</label>
<div class="tags-input-wrapper" id="editor-contributors-wrapper">
<div class="tags-list" id="editor-contributors-tags"></div>
<input type="text" id="editor-contributor-input" placeholder="输入名称后按回车添加...">
</div>
</div>
<div class="form-group">
<label>使用说明</label>
<div class="sortable-list" id="editor-instructions-list"></div>
<div class="add-item-row">
<button type="button" class="add-item-btn" data-target="instructions" data-type="text">
<i class="fas fa-plus"></i> 添加文字
</button>
<button type="button" class="add-item-btn" data-target="instructions" data-type="image">
<i class="fas fa-image"></i> 添加图片
</button>
<button type="button" class="add-item-btn" data-target="instructions" data-type="video">
<i class="fas fa-video"></i> 添加视频
</button>
</div>
</div>
<div class="form-group">
<label>注意事项</label>
<div class="sortable-list" id="editor-notes-list"></div>
<div class="add-item-row">
<button type="button" class="add-item-btn" data-target="notes" data-type="text">
<i class="fas fa-plus"></i> 添加文字
</button>
<button type="button" class="add-item-btn" data-target="notes" data-type="image">
<i class="fas fa-image"></i> 添加图片
</button>
<button type="button" class="add-item-btn" data-target="notes" data-type="video">
<i class="fas fa-video"></i> 添加视频
</button>
</div>
</div>
<div class="editor-actions">
<button type="button" class="btn-save-facility" id="btn-save-facility">
<i class="fas fa-save"></i> 生成 JSON
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- JSON Output Modal -->
<div id="json-output-modal" class="modal">
<div class="modal-content json-output-content">
<span class="close-json-modal">&times;</span>
<h3><i class="fas fa-code"></i> 生成完成</h3>
<p class="json-output-hint">请复制以下 JSON 内容,发送给服主以更新到网站上。</p>
<textarea id="json-output" readonly></textarea>
<button type="button" class="btn-copy-json" id="btn-copy-json">
<i class="fas fa-copy"></i> 复制到剪贴板
</button>
</div>
</div>
<div id="footer-component"></div>
<script src="js/components.js"></script>
<script src="js/facilities_script.js"></script>
</body>
</html>