Hugging Face's logo

Spaces:
redfernstech
/
ghj
Running

App Files Community
Srinivasulu kethanaboina commited on
Commit
672ca78
·
verified ·
1 Parent(s): d7a4ce1

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +95 -29
index.html CHANGED
@@ -3,45 +3,111 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Embedded App</title>
7
  <style>
8
  body {
9
- margin: 0;
10
- padding: 0;
11
- display: flex;
12
- justify-content: center;
13
- align-items: center;
14
- height: 100vh;
15
- background-color: #f0f0f0;
16
- position: relative;
17
- }
18
- iframe {
19
- border: none;
20
- width: 100%;
21
- height: 100%;
22
- }
23
- .close-button {
24
- position: absolute;
25
- top: 10px;
26
- right: 10px;
27
- background-color: #ff0000;
28
- color: white;
29
- border: none;
30
  padding: 10px;
 
 
 
 
31
  cursor: pointer;
32
- border-radius: 5px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
33
  }
34
  </style>
35
  </head>
36
  <body>
37
- <button class="close-button" onclick="closeIframe()">Close</button>
38
- <iframe src="https://srinukethanaboina-srunu.hf.space" title="Embedded App"></iframe>
 
 
 
 
 
 
 
 
 
39
 
40
  <script>
41
- function closeIframe() {
42
- document.querySelector('iframe').style.display = 'none';
43
- document.querySelector('.close-button').style.display = 'none';
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
44
  }
45
  </script>
 
46
  </body>
47
- </html>
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Fetch and Display Chat History</title>
7
  <style>
8
  body {
9
+ font-family: Arial, sans-serif;
10
+ margin: 20px;
11
+ }
12
+ label {
13
+ font-weight: bold;
14
+ display: block;
15
+ margin-bottom: 5px;
16
+ }
17
+ input, button {
 
 
 
 
 
 
 
 
 
 
 
 
18
  padding: 10px;
19
+ margin-bottom: 10px;
20
+ font-size: 16px;
21
+ }
22
+ button {
23
  cursor: pointer;
24
+ }
25
+ #chat-history {
26
+ border: 1px solid #ddd;
27
+ padding: 20px;
28
+ max-height: 300px;
29
+ overflow-y: auto;
30
+ background-color: #f9f9f9;
31
+ }
32
+ .chat-entry {
33
+ margin-bottom: 15px;
34
+ padding-bottom: 10px;
35
+ border-bottom: 1px solid #ddd;
36
+ }
37
+ .chat-entry .timestamp {
38
+ font-size: 0.9em;
39
+ color: #666;
40
+ }
41
+ .chat-entry .user-query {
42
+ font-weight: bold;
43
+ }
44
+ .chat-entry .bot-response {
45
+ margin-top: 5px;
46
+ color: #007BFF;
47
  }
48
  </style>
49
  </head>
50
  <body>
51
+
52
+ <h1>Chat History Viewer</h1>
53
+
54
+ <label for="url-input">Enter the URL of the chat history:</label>
55
+ <input type="text" id="url-input" placeholder="https://example.com/chat-history" />
56
+ <button onclick="fetchChatHistory()">Fetch Chat History</button>
57
+
58
+ <h2>Chat History:</h2>
59
+ <div id="chat-history">
60
+ <!-- Chat history will be displayed here -->
61
+ </div>
62
 
63
  <script>
64
+ async function fetchChatHistory() {
65
+ const url = document.getElementById('url-input').value;
66
+ const chatHistoryDiv = document.getElementById('chat-history');
67
+ chatHistoryDiv.innerHTML = ''; // Clear previous history
68
+
69
+ if (!url) {
70
+ alert('Please enter a URL');
71
+ return;
72
+ }
73
+
74
+ try {
75
+ const response = await fetch(url);
76
+ if (!response.ok) {
77
+ throw new Error('Failed to fetch chat history.');
78
+ }
79
+
80
+ const chatHistory = await response.json();
81
+
82
+ // Display chat history
83
+ chatHistory.forEach(entry => {
84
+ const chatEntryDiv = document.createElement('div');
85
+ chatEntryDiv.classList.add('chat-entry');
86
+
87
+ const timestampDiv = document.createElement('div');
88
+ timestampDiv.classList.add('timestamp');
89
+ timestampDiv.textContent = `Timestamp: ${entry.timestamp}`;
90
+
91
+ const userQueryDiv = document.createElement('div');
92
+ userQueryDiv.classList.add('user-query');
93
+ userQueryDiv.textContent = `User asked: ${entry.query}`;
94
+
95
+ const botResponseDiv = document.createElement('div');
96
+ botResponseDiv.classList.add('bot-response');
97
+ botResponseDiv.textContent = `Bot answered: ${entry.response}`;
98
+
99
+ chatEntryDiv.appendChild(timestampDiv);
100
+ chatEntryDiv.appendChild(userQueryDiv);
101
+ chatEntryDiv.appendChild(botResponseDiv);
102
+
103
+ chatHistoryDiv.appendChild(chatEntryDiv);
104
+ });
105
+
106
+ } catch (error) {
107
+ alert('Error fetching chat history: ' + error.message);
108
+ }
109
  }
110
  </script>
111
+
112
  </body>
113
+ </html>