This repository has been archived by the owner on Mar 14, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 6
/
index.html
77 lines (74 loc) · 3.16 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Gemini Pro Chat Interface</title>
<link rel="manifest" href="/manifest.json">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script>
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/styles/github-dark.css">
<script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/highlight.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet">
<script>
window.MathJax = {
tex: {
inlineMath: [['$', '$'], ['\\(', '\\)']],
displayMath: [['$$', '$$'], ['\\[', '\\]']]
},
svgs: {
fontCache: 'global'
}
};
</script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js" async></script>
<link rel="stylesheet" href="style.css">
<script type="importmap">
{
"imports": {
"@google/generative-ai": "https://esm.run/@google/generative-ai"
}
}
</script>
<script type="module" src="module.js"></script>
</head>
<body>
<div id="chat-container">
<div id="manage-container" class="hidden">
<header>
<div id="heading">Gemini Pro Chat Interface</div>
</header>
<div id="api-key-container">
<input type="password" id="apiKeyInput" placeholder="Enter your API key">
</div>
<div id="chat-sessions-container">
<select id="chatSessions"></select>
<button id="addSession">New Session</button>
<button id="renameSession">Rename Session</button>
<button id="deleteSession">Delete Session</button>
</div>
<div id="generation-config">
<label for="maxOutputTokens">Max Output Tokens: <span id="maxOutputTokensValue">16384</span></label>
<input class="slider" type="range" id="maxOutputTokens" min="100" max="30720" value="16384" step="100">
<label for="temperature">Temperature: <span id="temperatureValue">0.9</span></label>
<input class="slider" type="range" id="temperature" min="0.1" max="2" value="0.9" step="0.1">
<label for="topP">Top P: <span id="topPValue">0.95</span></label>
<input class="slider" type="range" id="topP" min="0.1" max="1" value="0.95" step="0.05">
<label for="topK">Top K: <span id="topKValue">1</span></label>
<input class="slider" type="range" id="topK" min="1" max="20" value="1" step="1">
<button id="resetGenConfig">Reset to Default</button>
</div>
<button id="removeAttachments" title="Remove Attachments">Remove all attachments</button>
</div>
<div id="chat"></div>
<div id="image-preview-container" class="hidden"></div>
<div id="send-container">
<button id="toggle-manage" title="Toggle settings">⚙</button>
<input type="file" id="imageInput" accept="image/*" style="display: none;" multiple>
<label for="imageInput" id="uploadImageBtn" title="Upload Image">📷<span id="imageCounter" class="image-counter">0</span></label>
<textarea id="userInput" placeholder="Type your message here..."></textarea>
<button id="send">Send</button>
<span id="loading">Generating... </span>
</div>
</body>
</html>