|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
|
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>3GPP Document Finder</title> |
|
|
<link rel="stylesheet" href="/static/style.css"> |
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap"> |
|
|
</head> |
|
|
|
|
|
<body> |
|
|
<header> |
|
|
<div class="container header-content"> |
|
|
<div class="logo"> |
|
|
<h1>3GPP Document Finder</h1> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
<div class="container"> |
|
|
<div class="search-container"> |
|
|
<div class="search-header"> |
|
|
<h2 id="dynamicTitle">Find 3GPP Documents</h2> |
|
|
<p id="dynamicDesc">Enter a TSG document ID / specification ID (e.g., S1-123456, C2-987654 or 31.102) to |
|
|
locate the document in the 3GPP FTP server.</p> |
|
|
</div> |
|
|
|
|
|
<div class="search-mode"> |
|
|
<button id="single-mode-btn" class="active">Single Document</button> |
|
|
<button id="batch-mode-btn">Batch Search</button> |
|
|
<button id="keyword-mode-btn">Keyword Search</button> |
|
|
</div> |
|
|
|
|
|
<div class="search-form"> |
|
|
<div class="input-group single-input"> |
|
|
<label for="doc-id">Document ID</label> |
|
|
<div class="input-field"> |
|
|
<input type="text" id="doc-id" |
|
|
placeholder="Enter document ID or specification ID (e.g., S1-123456, 12.345)"> |
|
|
<button id="search-btn" class="btn">Search</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="input-group batch-input"> |
|
|
<label for="batch-ids">Document IDs or Specification IDs (one per line)</label> |
|
|
<textarea id="batch-ids" |
|
|
placeholder="Enter document IDs or specification IDs, one per line (e.g., S1-123456, C2-987654, 31.102)"></textarea> |
|
|
<div class="hint">Enter one document ID per line</div> |
|
|
<button id="batch-search-btn" class="btn" style="margin-top: 10px;">Search All</button> |
|
|
</div> |
|
|
|
|
|
<div class="input-group keyword-input"> |
|
|
<label for="keywords">Keywords</label> |
|
|
<div class="input-field"> |
|
|
<input type="text" id="keywords" placeholder="Enter your keywords separated by space"> |
|
|
<button id="keyword-search-btn" class="btn">Search</button> |
|
|
</div> |
|
|
<div class="filter-tab-container"> |
|
|
<button type="button" id="toggleFilters" class="filter-toggle-btn"> |
|
|
<span>Filters</span> |
|
|
<svg width="16" height="16" style="vertical-align:middle" fill="currentColor"> |
|
|
<path d="M4 7l4 4 4-4"></path> |
|
|
</svg> |
|
|
</button> |
|
|
<form id="filtersForm" class="filters-row" style="display:none;"> |
|
|
<input type="number" min="0" max="21" name="release" placeholder="Release" |
|
|
class="filter-input"> |
|
|
|
|
|
<select name="mode" class="filter-select"> |
|
|
<option value="and">AND</option> |
|
|
<option value="or">OR</option> |
|
|
</select> |
|
|
|
|
|
<select name="spec_type" class="filter-select"> |
|
|
<option value="TR">Technical Report</option> |
|
|
<option value="TS">Technical Specification</option> |
|
|
</select> |
|
|
|
|
|
<select name="working_group" class="filter-select"> |
|
|
<option value="">Working Group</option> |
|
|
<option value="CP">CP</option> |
|
|
<option value="C1">C1</option> |
|
|
<option value="C2">C2</option> |
|
|
<option value="C3">C3</option> |
|
|
<option value="C4">C4</option> |
|
|
<option value="C5">C5</option> |
|
|
<option value="C6">C6</option> |
|
|
<option value="SP">SP</option> |
|
|
<option value="S1">S1</option> |
|
|
<option value="S2">S2</option> |
|
|
<option value="S3">S3</option> |
|
|
<option value="S4">S4</option> |
|
|
<option value="S5">S5</option> |
|
|
<option value="S6">S6</option> |
|
|
</select> |
|
|
|
|
|
<label class="filter-checkbox-label"> |
|
|
<input type="checkbox" name="case_sensitive" class="filter-checkbox" /> |
|
|
Case sensitive |
|
|
</label> |
|
|
</form> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="error-message" id="error-message"></div> |
|
|
|
|
|
<div class="loader" id="loader"> |
|
|
<div class="spinner"></div> |
|
|
<p>Searching for documents...</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="results-container" id="results-container"> |
|
|
<div class="results-header"> |
|
|
<h2>Search Results</h2> |
|
|
<div class="results-stats" id="results-stats"></div> |
|
|
</div> |
|
|
<div class="results-list" id="results-list"></div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<footer> |
|
|
<p>© 2025 3GPP Document Finder | Powered by FastAPI</p> |
|
|
</footer> |
|
|
|
|
|
<script src="/static/script.js"></script> |
|
|
</body> |
|
|
|
|
|
</html> |
