Hugging Face's logo

Spaces:
malvika2003
/
authenticate
Runtime error

App Files Community
malvika2003 commited on
Commit
2725a85
•
1 Parent(s): b6898b9

Upload 3 files

Browse files
Files changed (3) hide show
  1. app.py +14 -0
  2. chatbot.html +70 -0
  3. index.html +90 -0
app.py ADDED
@@ -0,0 +1,14 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ from http.server import SimpleHTTPRequestHandler, HTTPServer
2
+
3
+ class RequestHandler(SimpleHTTPRequestHandler):
4
+ def __init__(self, *args, **kwargs):
5
+ super().__init__(*args, directory='./', **kwargs)
6
+
7
+ def run(server_class=HTTPServer, handler_class=RequestHandler, port=8000):
8
+ server_address = ('', port)
9
+ httpd = server_class(server_address, handler_class)
10
+ print(f'Starting httpd on port {port}...')
11
+ httpd.serve_forever()
12
+
13
+ if __name__ == '__main__':
14
+ run()
chatbot.html ADDED
@@ -0,0 +1,70 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Chatbot Interface</title>
7
+ <!-- Include Bootstrap CSS for styling (optional) -->
8
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
9
+ <style>
10
+ body {
11
+ padding: 20px;
12
+ }
13
+ .chatbot-container {
14
+ max-width: 800px;
15
+ margin: auto;
16
+ background-color: #fff;
17
+ padding: 20px;
18
+ border-radius: 8px;
19
+ box-shadow: 0 0 10px rgba(0,0,0,0.1);
20
+ }
21
+ .chatbot-container h1 {
22
+ text-align: center;
23
+ margin-bottom: 20px;
24
+ }
25
+ </style>
26
+ </head>
27
+ <body>
28
+ <div class="chatbot-container">
29
+ <h1>Question answering chatbot</h1>
30
+ <div id="chatbot-interface">
31
+ <!-- Chatbot UI will be dynamically added here -->
32
+ </div>
33
+ </div>
34
+ <iframe src="http://127.0.0.1:7865/" width="1500" height="1000" frameborder="0"></iframe>
35
+ <!-- Include Gradio JavaScript library -->
36
+ <script src="https://cdn.jsdelivr.net/npm/@gradio/chatbot"></script>
37
+ <script>
38
+ // Define function to initialize Gradio chatbot
39
+ function initializeChatbot() {
40
+ gr.Chatbot({
41
+ container: document.getElementById('chatbot-interface'),
42
+ steps: [
43
+ {
44
+ type: 'text',
45
+ name: 'input',
46
+ message: 'Enter your question or instruction here...',
47
+ },
48
+ {
49
+ type: 'model',
50
+ name: 'output',
51
+ model: 'http://127.0.0.1:7865/', // Replace with your actual chatbot endpoint
52
+
53
+ options: {
54
+ headers: {
55
+ 'Authorization': 'Bearer your_auth_token', // If authentication is required
56
+ 'Content-Type': 'application/json',
57
+ },
58
+ },
59
+ }
60
+ ]
61
+ });
62
+ }
63
+
64
+ // Wait for DOM content to load before initializing chatbot
65
+ document.addEventListener('DOMContentLoaded', function() {
66
+ initializeChatbot();
67
+ });
68
+ </script>
69
+ </body>
70
+ </html>
index.html ADDED
@@ -0,0 +1,90 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Login Page</title>
7
+ <!-- Include Bootstrap CSS for styling (optional) -->
8
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
9
+ <style>
10
+ body {
11
+ background-color: #f0f0f0;
12
+ display: flex;
13
+ justify-content: center;
14
+ align-items: center;
15
+ height: 100vh;
16
+ }
17
+ .login-container {
18
+ max-width: 400px;
19
+ background-color: #fff;
20
+ padding: 20px;
21
+ border-radius: 8px;
22
+ box-shadow: 0 0 10px rgba(0,0,0,0.1);
23
+ }
24
+ .login-container h2 {
25
+ text-align: center;
26
+ margin-bottom: 20px;
27
+ }
28
+ .form-group {
29
+ margin-bottom: 20px;
30
+ }
31
+ .form-group label {
32
+ font-weight: bold;
33
+ }
34
+ .form-group input {
35
+ width: 100%;
36
+ padding: 10px;
37
+ border: 1px solid #ccc;
38
+ border-radius: 4px;
39
+ box-sizing: border-box;
40
+ }
41
+ .form-group button {
42
+ width: 100%;
43
+ padding: 10px;
44
+ background-color: #007bff;
45
+ color: #fff;
46
+ border: none;
47
+ border-radius: 4px;
48
+ cursor: pointer;
49
+ }
50
+ .form-group button:hover {
51
+ background-color: #0056b3;
52
+ }
53
+ </style>
54
+ </head>
55
+ <body>
56
+ <div class="login-container">
57
+ <h2>Login</h2>
58
+ <form id="loginForm">
59
+ <div class="form-group">
60
+ <label for="username">Username</label>
61
+ <input type="text" id="username" name="username" required>
62
+ </div>
63
+ <div class="form-group">
64
+ <label for="password">Password</label>
65
+ <input type="password" id="password" name="password" required>
66
+ </div>
67
+ <div class="form-group">
68
+ <button type="submit">Login</button>
69
+ </div>
70
+ </form>
71
+ </div>
72
+
73
+ <!-- Script for handling form submission -->
74
+ <script>
75
+ document.getElementById('loginForm').addEventListener('submit', function(event) {
76
+ event.preventDefault();
77
+ const username = document.getElementById('username').value;
78
+ const password = document.getElementById('password').value;
79
+
80
+ // Example validation (replace with your own logic)
81
+ if (username === 'admin' && password === 'password') {
82
+ // Redirect to main application page
83
+ window.location.href = 'chatbot.html';
84
+ } else {
85
+ alert('Invalid username or password. Please try again.');
86
+ }
87
+ });
88
+ </script>
89
+ </body>
90
+ </html>