-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
237 lines (212 loc) · 12.4 KB
/
index.html
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
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-QKMVPXQLP3"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-QKMVPXQLP3');
</script>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>GPTionary: Automate Thesaurus with AI</title>
<meta name="description" content="GPTionary: The AI-powered thesaurus and dictionary that leverages GPT and open-source language models to enhance vocabulary acquisition through concise word and phrase descriptions. Ideal for students, teachers, and lifelong learners looking to expand their knowledge base.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="src/images/favicon.ico?v=M44lzPylqQ">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
<link rel="stylesheet" href="src/css/animate.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> </script>
<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<link rel="stylesheet" href="src/css/style.css" />
<script defer src="/_vercel/insights/script.js"></script>
<!-- <title>GPTionary: Leveraging Dictionary with AI</title> -->
</head>
<body style="background-color: #b2d0c1;">
<nav class="navbar navbar-expand-md navbar-light">
<div class="container-fluid">
<a class="navbar-brand" href="/">GPTionary</a>
<button class="navbar-toggler collapsed d-flex d-md-none flex-column justify-content-around" type="button"
data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false"
aria-label="Toggle navigation">
<span class="toggler-icon top-bar"></span>
<span class="toggler-icon middle-bar"></span>
<span class="toggler-icon bottom-bar"></span>
</button>
<div class="collapse navbar-collapse justify-content-start" id="navbarNav">
<ul class="navbar-nav">
<!-- <li class="nav-item d-md-none"> -->
<!-- <a class="nav-link" style="margin-top: 0px; color: rgba(0, 0, 0, 0.79); cursor: pointer;">Beta (Free) Release</a> -->
<!-- DELETE THE LINE ABOVE AND UNCOMMENT THE LINES BELOW ONCE BETA (FREE) RELEASE IS OVER -->
<!-- <a class="nav-link" style="margin-top: 0px; color: rgba(0, 0, 0, 0.79); cursor: pointer;" id="passcode1"></a> -->
<!-- </li> -->
<li class="nav-item">
<a class="nav-link" onclick="opendemoview()" style="margin-top: 0px; cursor: pointer;">Demo</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./about.html" target="_blank" style="margin-top: 0px;">About</a>
</li>
<li class="nav-item">
<a class="nav-link" onclick="openhelp()" style="margin-top: 0px; cursor: pointer;">Help</a>
</li>
<script>
function opendemoview() {
$('#demoview').modal('show');
}
function openkeyrequest() {
$('#keyrequest').modal('show');
}
function openhelp() {
$('#help').modal('show');
}
</script>
<li class="nav-item">
<a class="nav-link" href="https://github.com/tlsgusdn1107/GPTionary" target="_blank" style="margin-top: 0px;">Code</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://buy.stripe.com/cN2g2ceDC5IYbyUbII" target="_blank" style="margin-top: 0px;">Donate</a>
</li>
</ul>
</div>
<div class="d-none d-md-block justify-content-end" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" style="margin-top: 0px; color: rgba(0, 0, 0, 0.79);">Beta (Free) Release</a>
<!-- COMMENT THE LINE ABOVE AND UNCOMMENT THE LINE BELOW ONCE BETA (FREE) RELEASE IS OVER -->
<!-- <a class="nav-link" style="margin-top: 0px; color: rgba(0, 0, 0, 0.79);" id="passcode"></a> -->
</li>
<script src="src/js/navbar-passcode.js"></script>
</ul>
</div>
</div>
</nav>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"
integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ"
crossorigin="anonymous"></script>
<!-- Search history -->
<div class="d-flex justify-content-center align-items-center">
<ul id="search-history" class="scrollable-container"></ul>
</div>
<script src="src/js/search-history.js"></script>
<!-- introduction -->
<div id="introduction" class="d-flex justify-content-center align-items-center" style="z-index: 10; height:150px; width:100%; position:absolute; top: 50%; bottom:0; left: 0; right: 0; transform: translateY(-50%);">
<div class="mx-5 text-center">
<h1><b>GPTionary: Thesaurus with ChatGPT</b></h1>
<br>
<h5>Search for words or phrases much quicker by describing them below.</h5>
<h5>In just 10 days, users from <b>100</b> countries have accessed GPTionary.</h5>
<h5>Questions outside its scope are not answered for educational purpose.</h5>
</div>
</div>
<!-- blocking scroll -->
<div class="container"
style="z-index: 5; height:150px; width:100%; position:absolute; bottom:0; left: 0; right: 0; background-color: #b2d0c1;">
</div>
<!-- Search bar -->
<div class="parent-element container" style="z-index: 10;">
<div class="container bottom-container" style="width: 50%;">
<form id="search-form">
<div class="row-inner rounded-div" style="box-sizing: border-box;">
<div class="input-group shadow-none">
<input type="text" class="form-control usersearch" id="search-input"
placeholder="Describe what you're thinking of ..."
style="flex-wrap: wrap; border-color:rgb(255, 255, 255); height: 48px;" />
<button class="btn btn-dark btn-lg" id="button-addon2"
style="border-radius: 0px 5px 5px 0px; box-shadow: 5px 5px 2px 2px grey;">Enter</button>
<script src="src/js/search-button.js"></script>
</div>
</div>
<div class="row-outer">
<div class="container">
<div class="animated-heading d-none d-xl-block" style="padding-top: 10px;">
<span id="words" style="color: rgb(255, 255, 255);"></span></small>
</div>
</div>
</div>
<script src="src/js/sample-load.js"></script>
</form>
</div>
</div>
<div class="modal fade" id="keyquery" tabindex="-1" role="dialog">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header text-center border-0">
<h5 class="modal-title w-100" id="title">Your session has expired</h5>
</div>
<div class="modal-body border-0" style="padding-top: 0.5%;">
<input type="text" class="form-control text-center preuserkey" id="userkey"
placeholder="Type in the key to access GPTionary" />
</div>
<div class="modal-footer justify-content-center">
<button type="button" class="btn btn-primary" id="submitbutton" onclick="checkkey()">Submit</button>
</div>
<script src="src/js/key-submit.js"></script>
</div>
</div>
</div>
<div class="modal fade" id="demoview" tabindex="-1">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
<div class="embed-responsive embed-responsive-16by9">
<iframe id="video" width="560" height="315" src="https://www.youtube.com/embed/gMp3-Emb9hA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function(){
var url = $("#video").attr('src');
$("#demoview").on('hidden.bs.modal', function(){
$("#video").attr('src', '');
});
$("#demoview").on('shown.bs.modal', function(){
$("#video").attr('src', url);
});
});
</script>
<div class="modal fade" id="keyrequest" tabindex="-1">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body" style="padding-bottom: 0%;">
<p>Access to GPTionary will only be granted to community leaders, such as school teachers, principals, and officials. If you need a key, please email us at <a href=mailto:gptionary@gmail.com>gptionary@gmail.com</a> with valid credentials, such as a professional email address or official document, to verify your identity.</p>
</div>
<div class="modal-footer justify-content-center">
<button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="help" tabindex="-1">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-body" style="padding-bottom: 0%;">
<p>
<b>Error messages keep popping up?</b>
<br><br>
To prevent misuse, we may pause responses. Please refresh the page and try again. Please note that your search history will not be saved after refreshing.
<br><br>
<b>Key not working?</b>
<br><br>
If your key isn't working, it could be due to it being misused (such as making repeated inappropriate requests) or possibly even leaked to the public. To avoid this kind of misuse, we only allow access to GPTionary for verified communities.
<br><br>If you're having trouble with your key, reach out to your community leader to get a new one.
<br><br>
<b>Need further assistance?</b>
<br><br>
If you are still experiencing problems or have any feedback, please reach out to us at <a href=mailto:charlesshin@gptionary.org>charlesshin@gptionary.org</a>.
</p>
</div>
<div class="modal-footer justify-content-center">
<button type="button" class="btn btn-primary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</body>
<script src="src/js/search-submit.js" type="module"></script>
</html>