File size: 6,029 Bytes
a76d7af
 
53fa589
a76d7af
 
 
 
 
 
 
53fa589
a76d7af
 
 
 
 
 
 
 
 
 
 
 
582da9b
53fa589
 
a76d7af
 
 
 
 
91b4b0a
a76d7af
 
 
 
 
 
53fa589
 
a76d7af
 
 
 
 
1b8934f
53fa589
 
a76d7af
 
 
91b4b0a
 
 
 
 
 
 
53fa589
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
91b4b0a
a76d7af
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
53fa589
a76d7af
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<!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>Filtres avancés</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="">All types</option>
                                <option value="TR">Report</option>
                                <option value="TS">Specification</option>
                            </select>

                            <select name="working_group" class="filter-select">
                                <option value="">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" />
                                Sensible à la casse
                            </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>