File size: 6,614 Bytes
a76d7af
 
138f64c
a76d7af
 
 
 
 
 
 
138f64c
a76d7af
 
 
 
 
 
 
 
 
 
 
 
582da9b
138f64c
 
a76d7af
 
 
 
 
91b4b0a
a76d7af
 
 
 
 
 
138f64c
 
a76d7af
 
 
 
 
1b8934f
138f64c
 
a76d7af
 
 
91b4b0a
 
 
 
 
 
 
138f64c
 
70ea668
138f64c
 
 
 
 
 
 
 
 
 
 
 
 
 
4f2ed03
 
 
138f64c
 
 
70ea668
138f64c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
70ea668
138f64c
 
 
91b4b0a
a76d7af
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4f2ed03
 
 
 
 
 
 
 
 
 
 
 
 
a76d7af
 
 
 
 
 
 
 
138f64c
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
133
134
135
136
137
138
139
140
141
142
143
144
145
<!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="">All types</option>
                                <option value="TR">Technical Report (TR)</option>
                                <option value="TS">Technical Specification (TS)</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 id="sectionPopup" class="section-popup">
            <div class="section-popup-content">
                <div class="popup-header">
                <h2 id="popupTitle">Document Sections</h2>
                <span class="close-popup">&times;</span>
                </div>
                <div id="popupTextareas" class="popup-textareas">
                <!-- Les textareas seront générés ici dynamiquement -->
                </div>
                <button id="copyAllBtn" class="copy-all-btn">Copy all</button>
            </div>
        </div>
    </div>

    <footer>
        <p>© 2025 3GPP Document Finder | Powered by FastAPI</p>
    </footer>

    <script src="/static/script.js"></script>
</body>

</html>