Hugging Face's logo

Spaces:
Soeman
/
parsguy
Running

App Files Community
1
Soeman commited on
Commit
67486c5
·
verified ·
1 Parent(s): 1a32e44

Create a complete, modern web application for an advanced AI chat assistant that is more powerful and feature-rich than ChatGPT, fully supporting Persian (Farsi) language and right-to-left (RTL) layout.

Browse files

The web app should include:

A clean, responsive UI/UX optimized for desktop and mobile, fully RTL.

A chat interface similar to ChatGPT, with message bubbles, code blocks, markdown rendering, and file upload.

User authentication (sign up, login, password reset).

User chat history, searchable and saved securely in a database.

Custom AI personas that users can switch between (e.g., teacher, doctor, programmer).

Speech-to-text and text-to-speech in Persian (Farsi).

Dark/light mode, message editing, and regeneration options.

API integration for connecting to advanced AI models (e.g., GPT-5 or custom models).

Admin dashboard for managing users, analytics, and model usage.

Beautiful RTL typography using Persian fonts like Vazir or IRANSansX.

The app should be fully localized in Persian, with all interface elements (buttons, menus, alerts) translated, and should provide a natural Persian chat experience.

Use modern web technologies such as:

Frontend: React (Next.js or Vite), TailwindCSS (with RTL support)

Backend: Node.js (Express or NestJS)

Database: PostgreSQL or MongoDB

Authentication: JWT or OAuth

Deployment: Docker, Nginx, HTTPS

Output: the complete project structure, key code files, and implementation details for frontend and backend.

Files changed (7) hide show
  1. README.md +8 -4
  2. history.html +85 -0
  3. index.html +310 -19
  4. login.html +75 -0
  5. personas.html +107 -0
  6. profile.html +119 -0
  7. register.html +75 -0
README.md CHANGED
@@ -1,10 +1,14 @@
1
  ---
2
- title: Parsguy
3
- emoji: 📉
4
- colorFrom: blue
5
  colorTo: purple
 
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
 
 
1
  ---
2
+ title: پارس‌گوی (ParsGuy) - دستیار هوشمند فارسی 🧠
3
+ colorFrom: green
 
4
  colorTo: purple
5
+ emoji: 🐳
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite-v3
10
  ---
11
 
12
+ # Welcome to your new DeepSite project!
13
+ This project was created with [DeepSite](https://deepsite.hf.co).
14
+
history.html ADDED
@@ -0,0 +1,85 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fa" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>تاریخچه چت - پارس‌گوی</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet">
11
+ <style>
12
+ body { font-family: 'Vazir', sans-serif; }
13
+ .rtl { direction: rtl; }
14
+ </style>
15
+ </head>
16
+ <body class="bg-gray-50 font-vazir rtl">
17
+ <nav class="bg-white shadow-sm border-b border-gray-200">
18
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
19
+ <div class="flex justify-between items-center h-16">
20
+ <div class="flex items-center">
21
+ <div class="flex-shrink-0">
22
+ <h1 class="text-xl font-bold text-gray-900">پارس‌گوی 🧠</h1>
23
+ </div>
24
+ <div class="hidden md:block mr-8">
25
+ <div class="flex items-baseline space-x-4 space-x-reverse">
26
+ <a href="/" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">چت</a>
27
+ <a href="/history.html" class="text-gray-900 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">تاریخچه</a>
28
+ <a href="/personas.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">شخصیت‌ها</a>
29
+ <a href="/profile.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">پروفایل</a>
30
+ </div>
31
+ </div>
32
+ </div>
33
+ </div>
34
+ </div>
35
+ </nav>
36
+
37
+ <div class="max-w-6xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
38
+ <div class="bg-white rounded-lg shadow-sm p-6">
39
+ <div class="flex justify-between items-center mb-6">
40
+ <h2 class="text-2xl font-bold text-gray-900">تاریخچه مکالمات</h2>
41
+ <div class="flex space-x-3 space-x-reverse">
42
+ <div class="relative">
43
+ <input type="text" placeholder="جستجو در تاریخچه..." class="pr-10 pl-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent w-64">
44
+ <i data-feather="search" class="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4"></i>
45
+ </div>
46
+ <button class="bg-primary-500 hover:bg-primary-600 text-white px-4 py-2 rounded-lg text-sm font-medium">
47
+ پاک کردن تاریخچه
48
+ </button>
49
+ </div>
50
+ </div>
51
+
52
+ <div class="space-y-4">
53
+ <!-- Chat History Item -->
54
+ <div class="border border-gray-200 rounded-lg p-4 hover:border-primary-300 transition-colors">
55
+ <div class="flex justify-between items-start mb-2">
56
+ <h3 class="font-semibold text-gray-900">بحث درباره برنامه‌نویسی پایتون</h3>
57
+ <span class="text-sm text-gray-500">۲ ساعت پیش</span>
58
+ </div>
59
+ <p class="text-gray-600 text-sm mb-3">چگونه می‌توانم در پایتون یک API REST بسازم؟</p>
60
+ <div class="flex space-x-2 space-x-reverse">
61
+ <button class="text-primary-600 hover:text-primary-700 text-sm">ادامه چت</button>
62
+ <button class="text-red-600 hover:text-red-700 text-sm">حذف</button>
63
+ </div>
64
+ </div>
65
+
66
+ <div class="border border-gray-200 rounded-lg p-4 hover:border-primary-300 transition-colors">
67
+ <div class="flex justify-between items-start mb-2">
68
+ <h3 class="font-semibold text-gray-900">کمک در نوشتن مقاله</h3>
69
+ <span class="text-sm text-gray-500">دیروز</span>
70
+ </div>
71
+ <p class="text-gray-600 text-sm mb-3">نیاز به کمک در نوشتن مقاله علمی درباره هوش مصنوعی...</p>
72
+ <div class="flex space-x-2 space-x-reverse">
73
+ <button class="text-primary-600 hover:text-primary-700 text-sm">ادامه چت</button>
74
+ <button class="text-red-600 hover:text-red-700 text-sm">حذف</button>
75
+ </div>
76
+ </div>
77
+ </div>
78
+ </div>
79
+ </div>
80
+
81
+ <script>
82
+ feather.replace();
83
+ </script>
84
+ </body>
85
+ </html>
index.html CHANGED
@@ -1,19 +1,310 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fa" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>پارس‌گوی - دستیار هوشمند فارسی</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/animejs/lib/anime.iife.min.js"></script>
11
+ <script>
12
+ tailwind.config = {
13
+ theme: {
14
+ extend: {
15
+ fontFamily: {
16
+ 'vazir': ['Vazir', 'system-ui'],
17
+ },
18
+ colors: {
19
+ primary: {
20
+ 50: '#f0f9ff',
21
+ 100: '#e0f2fe',
22
+ 500: '#0ea5e9',
23
+ 600: '#0284c7',
24
+ 700: '#0369a1',
25
+ }
26
+ }
27
+ }
28
+ }
29
+ }
30
+ </script>
31
+ <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet">
32
+ <style>
33
+ body {
34
+ font-family: 'Vazir', sans-serif;
35
+ }
36
+ .rtl {
37
+ direction: rtl;
38
+ }
39
+ .message-bubble-user {
40
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
41
+ color: white;
42
+ border-radius: 18px 18px 4px 18px;
43
+ }
44
+ .message-bubble-ai {
45
+ background: #f1f5f9;
46
+ color: #334155;
47
+ border-radius: 18px 18px 18px 4px;
48
+ }
49
+ .code-block {
50
+ background: #1e293b;
51
+ color: #e2e8f0;
52
+ border-radius: 8px;
53
+ font-family: 'Monaco', 'Consolas', monospace;
54
+ }
55
+ </style>
56
+ </head>
57
+ <body class="bg-gray-50 font-vazir rtl">
58
+ <!-- Navigation -->
59
+ <nav class="bg-white shadow-sm border-b border-gray-200">
60
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
61
+ <div class="flex justify-between items-center h-16">
62
+ <div class="flex items-center">
63
+ <div class="flex-shrink-0">
64
+ <h1 class="text-xl font-bold text-gray-900">پارس‌گوی 🧠</h1>
65
+ </div>
66
+ <div class="hidden md:block mr-8">
67
+ <div class="flex items-baseline space-x-4 space-x-reverse">
68
+ <a href="/" class="text-gray-900 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">چت</a>
69
+ <a href="/history.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">تاریخچه</a>
70
+ <a href="/personas.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">شخصیت‌ها</a>
71
+ <a href="/profile.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">پروفایل</a>
72
+ </div>
73
+ </div>
74
+ </div>
75
+ <div class="flex items-center">
76
+ <button id="themeToggle" class="p-2 text-gray-500 hover:text-primary-600">
77
+ <i data-feather="moon"></i>
78
+ </button>
79
+ <button id="authButton" class="mr-4 bg-primary-500 hover:bg-primary-600 text-white px-4 py-2 rounded-md text-sm font-medium">
80
+ ورود / ثبت‌نام
81
+ </button>
82
+ </div>
83
+ </div>
84
+ </div>
85
+ </nav>
86
+
87
+ <!-- Main Chat Interface -->
88
+ <div class="max-w-4xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
89
+ <!-- Chat Header -->
90
+ <div class="bg-white rounded-lg shadow-sm p-4 mb-6">
91
+ <div class="flex items-center justify-between">
92
+ <div class="flex items-center space-x-3 space-x-reverse">
93
+ <div class="w-12 h-12 bg-gradient-to-r from-primary-500 to-primary-600 rounded-full flex items-center justify-center text-white font-bold">
94
+ AI
95
+ </div>
96
+ <div>
97
+ <h2 class="text-lg font-semibold text-gray-900">دستیار هوشمند فارسی</h2>
98
+ <p class="text-sm text-gray-500">همیشه در دسترس برای کمک به شما</p>
99
+ </div>
100
+ </div>
101
+ <div class="flex items-center space-x-2 space-x-reverse">
102
+ <button id="voiceInput" class="p-2 text-gray-500 hover:text-primary-600 rounded-full hover:bg-gray-100">
103
+ <i data-feather="mic"></i>
104
+ </button>
105
+ <button id="clearChat" class="p-2 text-gray-500 hover:text-red-600 rounded-full hover:bg-gray-100">
106
+ <i data-feather="trash-2"></i>
107
+ </button>
108
+ </div>
109
+ </div>
110
+ </div>
111
+
112
+ <!-- Chat Messages -->
113
+ <div id="chatMessages" class="space-y-4 mb-6 min-h-[400px]">
114
+ <!-- Welcome Message -->
115
+ <div class="flex justify-start">
116
+ <div class="message-bubble-ai p-4 max-w-[80%]">
117
+ <div class="flex items-center space-x-2 space-x-reverse mb-2">
118
+ <div class="w-6 h-6 bg-primary-500 rounded-full flex items-center justify-center text-white text-xs">
119
+ AI
120
+ </div>
121
+ <span class="text-sm text-gray-500">پارس‌گوی</span>
122
+ </div>
123
+ <p class="text-gray-800">سلام! من پارس‌گوی هستم، دستیار هوشمند فارسی شما. چگونه می‌توانم کمکتان کنم؟</p>
124
+ </div>
125
+ </div>
126
+ </div>
127
+
128
+ <!-- Chat Input -->
129
+ <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-4">
130
+ <div class="flex space-x-3 space-x-reverse">
131
+ <div class="flex-1">
132
+ <textarea
133
+ id="messageInput"
134
+ placeholder="پیام خود را اینجا بنویسید... (برای استفاده از گفتار، روی آیکون میکروفون کلیک کنید)"
135
+ class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent resize-none"
136
+ rows="3"
137
+ ></textarea>
138
+ </div>
139
+ <div class="flex flex-col space-y-2">
140
+ <button id="sendMessage" class="bg-primary-500 hover:bg-primary-600 text-white p-3 rounded-lg transition-colors">
141
+ <i data-feather="send"></i>
142
+ </button>
143
+ <button id="attachFile" class="text-gray-500 hover:text-primary-600 p-3 rounded-lg border border-gray-300 hover:border-primary-500">
144
+ <i data-feather="paperclip"></i>
145
+ </button>
146
+ </div>
147
+ </div>
148
+ <div class="mt-3 flex items-center justify-between text-sm text-gray-500">
149
+ <div class="flex items-center space-x-2 space-x-reverse">
150
+ <button id="regenerateBtn" class="hover:text-primary-600">
151
+ <i data-feather="refresh-cw" class="w-4 h-4"></i>
152
+ تولید مجدد
153
+ </button>
154
+ </div>
155
+ <div>
156
+ <span id="charCount">0/4000</span>
157
+ </div>
158
+ </div>
159
+ </div>
160
+ </div>
161
+
162
+ <!-- Auth Modal -->
163
+ <div id="authModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center hidden z-50">
164
+ <div class="bg-white rounded-lg p-6 w-full max-w-md">
165
+ <div class="flex justify-between items-center mb-4">
166
+ <h3 class="text-lg font-semibold">ورود / ثبت‌نام</h3>
167
+ <button id="closeAuthModal" class="text-gray-500 hover:text-gray-700">
168
+ <i data-feather="x"></i>
169
+ </button>
170
+ </div>
171
+ <form id="authForm" class="space-y-4">
172
+ <div>
173
+ <label class="block text-sm font-medium text-gray-700 mb-1">ایمیل</label>
174
+ <input type="email" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent" required>
175
+ </div>
176
+ <div>
177
+ <label class="block text-sm font-medium text-gray-700 mb-1">رمز عبور</label>
178
+ <input type="password" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent" required>
179
+ </div>
180
+ <button type="submit" class="w-full bg-primary-500 hover:bg-primary-600 text-white py-2 px-4 rounded-lg transition-colors">
181
+ ادامه
182
+ </button>
183
+ <div class="text-center">
184
+ <a href="#" class="text-sm text-primary-600 hover:text-primary-700">فراموشی رمز عبور</a>
185
+ </div>
186
+ </form>
187
+ </div>
188
+ </div>
189
+
190
+ <script>
191
+ // Initialize Feather Icons
192
+ feather.replace();
193
+
194
+ // Theme Toggle
195
+ const themeToggle = document.getElementById('themeToggle');
196
+ themeToggle.addEventListener('click', () => {
197
+ document.body.classList.toggle('dark');
198
+ const icon = themeToggle.querySelector('i');
199
+ if (document.body.classList.contains('dark')) {
200
+ document.body.classList.add('bg-gray-900', 'text-white');
201
+ icon.setAttribute('data-feather', 'sun');
202
+ } else {
203
+ document.body.classList.remove('bg-gray-900', 'text-white');
204
+ icon.setAttribute('data-feather', 'moon');
205
+ }
206
+ feather.replace();
207
+ });
208
+
209
+ // Auth Modal
210
+ const authButton = document.getElementById('authButton');
211
+ const authModal = document.getElementById('authModal');
212
+ const closeAuthModal = document.getElementById('closeAuthModal');
213
+
214
+ authButton.addEventListener('click', () => {
215
+ authModal.classList.remove('hidden');
216
+ });
217
+
218
+ closeAuthModal.addEventListener('click', () => {
219
+ authModal.classList.add('hidden');
220
+ });
221
+
222
+ // Chat Functionality
223
+ const messageInput = document.getElementById('messageInput');
224
+ const sendMessage = document.getElementById('sendMessage');
225
+ const chatMessages = document.getElementById('chatMessages');
226
+ const charCount = document.getElementById('charCount');
227
+
228
+ messageInput.addEventListener('input', () => {
229
+ charCount.textContent = `${messageInput.value.length}/4000`;
230
+ });
231
+
232
+ sendMessage.addEventListener('click', sendChatMessage);
233
+
234
+ messageInput.addEventListener('keydown', (e) => {
235
+ if (e.key === 'Enter' && !e.shiftKey) {
236
+ e.preventDefault();
237
+ sendChatMessage();
238
+ }
239
+ });
240
+
241
+ function sendChatMessage() {
242
+ const message = messageInput.value.trim();
243
+ if (!message) return;
244
+
245
+ // Add user message
246
+ addMessage(message, 'user');
247
+
248
+ // Clear input
249
+ messageInput.value = '';
250
+ charCount.textContent = '0/4000';
251
+
252
+ // Simulate AI response
253
+ setTimeout(() => {
254
+ addMessage('این یک پاسخ شبیه‌سازی شده از هوش مصنوعی است. در نسخه کامل، پاسخ واقعی از API دریافت می‌شود.', 'ai');
255
+ }, 1000);
256
+ }
257
+
258
+ function addMessage(text, sender) {
259
+ const messageDiv = document.createElement('div');
260
+ messageDiv.className = `flex ${sender === 'user' ? 'justify-end' : 'justify-start'}`;
261
+
262
+ const bubbleClass = sender === 'user' ? 'message-bubble-user' : 'message-bubble-ai';
263
+
264
+ messageDiv.innerHTML = `
265
+ <div class="${bubbleClass} p-4 max-w-[80%]">
266
+ <div class="flex items-center space-x-2 space-x-reverse mb-2">
267
+ ${sender === 'ai' ? `
268
+ <div class="w-6 h-6 bg-primary-500 rounded-full flex items-center justify-center text-white text-xs">
269
+ AI
270
+ </div>
271
+ <span class="text-sm ${sender === 'user' ? 'text-blue-100' : 'text-gray-500'}">
272
+ ${sender === 'user' ? 'شما' : 'پارس‌گوی'}
273
+ </span>
274
+ </div>
275
+ <p class="${sender === 'user' ? 'text-white' : 'text-gray-800'}">${text}</p>
276
+ </div>
277
+ `;
278
+
279
+ chatMessages.appendChild(messageDiv);
280
+ chatMessages.scrollTop = chatMessages.scrollHeight;
281
+ }
282
+
283
+ // Voice Input
284
+ const voiceInput = document.getElementById('voiceInput');
285
+ voiceInput.addEventListener('click', () => {
286
+ // In a real implementation, this would use the Web Speech API
287
+ alert('قابلیت گفتار به متن در مرورگر شما فعال شد. شروع به صحبت کنید...');
288
+ });
289
+
290
+ // Clear Chat
291
+ document.getElementById('clearChat').addEventListener('click', () => {
292
+ if (confirm('آیا از پاک کردن تمام پیام‌ها مطمئن هستید؟')) {
293
+ chatMessages.innerHTML = `
294
+ <div class="flex justify-start">
295
+ <div class="message-bubble-ai p-4 max-w-[80%]">
296
+ <div class="flex items-center space-x-2 space-x-reverse mb-2">
297
+ <div class="w-6 h-6 bg-primary-500 rounded-full flex items-center justify-center text-white text-xs">
298
+ AI
299
+ </div>
300
+ <span class="text-sm text-gray-500">پارس‌گوی</span>
301
+ </div>
302
+ <p class="text-gray-800">سلام! من پارس‌گوی هستم، دستیار هوشمند فارسی شم��. چگونه می‌توانم کمکتان کنم؟</p>
303
+ </div>
304
+ </div>
305
+ `;
306
+ }
307
+ });
308
+ </script>
309
+ </body>
310
+ </html>
login.html ADDED
@@ -0,0 +1,75 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fa" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ورود - پارس‌گوی</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet">
11
+ <style>
12
+ body { font-family: 'Vazir', sans-serif; }
13
+ .rtl { direction: rtl; }
14
+ </style>
15
+ </head>
16
+ <body class="bg-gray-50 font-vazir rtl">
17
+ <div class="min-h-screen flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
18
+ <div class="max-w-md w-full space-y-8">
19
+ <div>
20
+ <div class="flex justify-center">
21
+ <div class="w-16 h-16 bg-gradient-to-r from-primary-500 to-primary-600 rounded-full flex items-center justify-center text-white font-bold text-2xl">
22
+ 🧠
23
+ </div>
24
+ <h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
25
+ ورود به پارس‌گوی
26
+ </h2>
27
+ </div>
28
+ <form class="mt-8 space-y-6" action="#" method="POST">
29
+ <div class="rounded-md shadow-sm -space-y-px">
30
+ <div>
31
+ <label for="email-address" class="sr-only">آدرس ایمیل</label>
32
+ <input id="email-address" name="email" type="email" autocomplete="email" required class="relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-t-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500" placeholder="آدرس ایمیل">
33
+ </div>
34
+ <div>
35
+ <label for="password" class="sr-only">رمز عبور</label>
36
+ <input id="password" name="password" type="password" autocomplete="current-password" required class="relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-b-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500" placeholder="رمز عبور">
37
+ </div>
38
+ </div>
39
+
40
+ <div class="flex items-center justify-between">
41
+ <div class="flex items-center">
42
+ <input id="remember-me" name="remember-me" type="checkbox" class="h-4 w-4 text-primary-600 focus:ring-primary-500 border-gray-300 rounded">
43
+ <label for="remember-me" class="mr-2 block text-sm text-gray-900">
44
+ مرا به خاطر بسپار
45
+ </label>
46
+ </div>
47
+
48
+ <div class="text-sm">
49
+ <a href="#" class="font-medium text-primary-600 hover:text-primary-500">
50
+ فراموشی رمز عبور؟
51
+ </a>
52
+ </div>
53
+ </div>
54
+
55
+ <div>
56
+ <button type="submit" class="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500">
57
+ ورود به حساب
58
+ </button>
59
+ </div>
60
+
61
+ <div class="text-center">
62
+ <span class="text-sm text-gray-600">حساب کاربری ندارید؟ </span>
63
+ <a href="/register.html" class="font-medium text-primary-600 hover:text-primary-500">
64
+ ثبت‌نام کنید
65
+ </a>
66
+ </div>
67
+ </form>
68
+ </div>
69
+ </div>
70
+
71
+ <script>
72
+ feather.replace();
73
+ </script>
74
+ </body>
75
+ </html>
personas.html ADDED
@@ -0,0 +1,107 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fa" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>شخصیت‌های AI - پارس‌گوی</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet">
11
+ <style>
12
+ body { font-family: 'Vazir', sans-serif; }
13
+ .rtl { direction: rtl; }
14
+ </style>
15
+ </head>
16
+ <body class="bg-gray-50 font-vazir rtl">
17
+ <nav class="bg-white shadow-sm border-b border-gray-200">
18
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
19
+ <div class="flex justify-between items-center h-16">
20
+ <div class="flex items-center">
21
+ <div class="flex-shrink-0">
22
+ <h1 class="text-xl font-bold text-gray-900">پارس‌گوی 🧠</h1>
23
+ </div>
24
+ <div class="hidden md:block mr-8">
25
+ <div class="flex items-baseline space-x-4 space-x-reverse">
26
+ <a href="/" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">چت</a>
27
+ <a href="/history.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">تاریخچه</a>
28
+ <a href="/personas.html" class="text-gray-900 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">شخصیت‌ها</a>
29
+ <a href="/profile.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">پروفایل</a>
30
+ </div>
31
+ </div>
32
+ </div>
33
+ </div>
34
+ </div>
35
+ </nav>
36
+
37
+ <div class="max-w-6xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
38
+ <div class="bg-white rounded-lg shadow-sm p-6">
39
+ <h2 class="text-2xl font-bold text-gray-900 mb-6">شخصیت‌های هوش مصنوعی</h2>
40
+
41
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
42
+ <!-- Persona Card -->
43
+ <div class="bg-gradient-to-br from-blue-50 to-indigo-100 rounded-xl p-6 border border-blue-200">
44
+ <div class="flex items-center space-x-3 space-x-reverse mb-4">
45
+ <div class="w-12 h-12 bg-blue-500 rounded-full flex items-center justify-center text-white font-bold">
46
+ 👨‍🏫
47
+ </div>
48
+ <div>
49
+ <h3 class="font-semibold text-gray-900">معلم خصوصی</h3>
50
+ <p class="text-sm text-gray-600">تخصص: آموزش و یادگیری</p>
51
+ </div>
52
+ </div>
53
+ <p class="text-gray-700 mb-4">این شخصیت برای آموزش مفاهیم پیچیده و پاسخ به سوالات درسی طراحی شده است.</p>
54
+ <button class="w-full bg-blue-500 hover:bg-blue-600 text-white py-2 px-4 rounded-lg transition-colors">
55
+ انتخاب
56
+ </button>
57
+ </div>
58
+
59
+ <div class="bg-gradient-to-br from-green-50 to-emerald-100 rounded-xl p-6 border border-green-200">
60
+ <div class="flex items-center space-x-3 space-x-reverse mb-4">
61
+ <div class="w-12 h-12 bg-green-500 rounded-full flex items-center justify-center text-white font-bold">
62
+ 👨‍⚕️
63
+ </div>
64
+ <div>
65
+ <h3 class="font-semibold text-gray-900">پزشک مشاور</h3>
66
+ <p class="text-sm text-gray-600">تخصص: سلامت و پزشکی</p>
67
+ </div>
68
+ </div>
69
+ <p class="text-gray-700 mb-4">مشاوره در زمینه سلامت، تغذیه و اطلاعات پزشکی عمومی.</p>
70
+ <button class="w-full bg-green-500 hover:bg-green-600 text-white py-2 px-4 rounded-lg transition-colors">
71
+ انتخاب
72
+ </button>
73
+ </div>
74
+
75
+ <div class="bg-gradient-to-br from-purple-50 to-violet-100 rounded-xl p-6 border border-purple-200">
76
+ <div class="flex items-center space-x-3 space-x-reverse mb-4">
77
+ <div class="w-12 h-12 bg-purple-500 rounded-full flex items-center justify-center text-white font-bold">
78
+ 💻
79
+ </div>
80
+ <div>
81
+ <h3 class="font-semibold text-gray-900">برنامه‌نویس</h3>
82
+ <p class="text-sm text-gray-600">تخصص: توسعه نرم‌افزار</p>
83
+ </div>
84
+ </div>
85
+ <p class="text-gray-700 mb-4">کمک در کدنویسی، دیباگ و طراحی الگوریتم.</p>
86
+ <button class="w-full bg-purple-500 hover:bg-purple-600 text-white py-2 px-4 rounded-lg transition-colors">
87
+ انتخاب
88
+ </button>
89
+ </div>
90
+ </div>
91
+ </div>
92
+
93
+ <script>
94
+ feather.replace();
95
+
96
+ // Persona selection
97
+ document.querySelectorAll('button').forEach(button => {
98
+ if (button.textContent.includes('انتخاب')) {
99
+ button.addEventListener('click', function() {
100
+ const personaName = this.closest('div').querySelector('h3').textContent;
101
+ alert(`شخصیت "${personaName}" انتخاب شد!`);
102
+ });
103
+ }
104
+ });
105
+ </script>
106
+ </body>
107
+ </html>
profile.html ADDED
@@ -0,0 +1,119 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fa" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>پروفایل کاربر - پارس‌گوی</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet">
11
+ <style>
12
+ body { font-family: 'Vazir', sans-serif; }
13
+ .rtl { direction: rtl; }
14
+ </style>
15
+ </head>
16
+ <body class="bg-gray-50 font-vazir rtl">
17
+ <nav class="bg-white shadow-sm border-b border-gray-200">
18
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
19
+ <div class="flex justify-between items-center h-16">
20
+ <div class="flex items-center">
21
+ <div class="flex-shrink-0">
22
+ <h1 class="text-xl font-bold text-gray-900">پارس‌گوی 🧠</h1>
23
+ </div>
24
+ <div class="hidden md:block mr-8">
25
+ <div class="flex items-baseline space-x-4 space-x-reverse">
26
+ <a href="/" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">چت</a>
27
+ <a href="/history.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">تاریخچه</a>
28
+ <a href="/personas.html" class="text-gray-500 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">شخصیت‌ها</a>
29
+ <a href="/profile.html" class="text-gray-900 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">پروفایل</a>
30
+ </div>
31
+ </div>
32
+ </div>
33
+ </div>
34
+ </div>
35
+ </nav>
36
+
37
+ <div class="max-w-4xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
38
+ <div class="bg-white rounded-lg shadow-sm p-6">
39
+ <h2 class="text-2xl font-bold text-gray-900 mb-6">پروفایل کاربری</h2>
40
+
41
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
42
+ <!-- Profile Info -->
43
+ <div class="lg:col-span-2 space-y-6">
44
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
45
+ <div>
46
+ <label class="block text-sm font-medium text-gray-700 mb-1">نام</label>
47
+ <input type="text" value="کاربر نمونه" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent">
48
+ </div>
49
+ <div>
50
+ <label class="block text-sm font-medium text-gray-700 mb-1">ایمیل</label>
51
+ <input type="email" value="user@example.com" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent">
52
+ </div>
53
+ <div>
54
+ <label class="block text-sm font-medium text-gray-700 mb-1">شماره تلفن</label>
55
+ <input type="tel" value="+98 912 345 6789" class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent">
56
+ </div>
57
+ <div>
58
+ <label class="block text-sm font-medium text-gray-700 mb-1">زبان</label>
59
+ <select class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent">
60
+ <option selected>فارسی</option>
61
+ <option>انگلیسی</option>
62
+ </select>
63
+ </div>
64
+ </div>
65
+
66
+ <div>
67
+ <label class="block text-sm font-medium text-gray-700 mb-1">بیوگرافی</label>
68
+ <textarea class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent" rows="3">علاقه‌مند به تکنولوژی و هوش مصنوعی</textarea>
69
+ </div>
70
+
71
+ <div class="flex space-x-3 space-x-reverse">
72
+ <button class="bg-primary-500 hover:bg-primary-600 text-white px-6 py-2 rounded-lg transition-colors">
73
+ ذخیره تغییرات
74
+ </button>
75
+ </div>
76
+ </div>
77
+
78
+ <!-- Stats Sidebar -->
79
+ <div class="space-y-6">
80
+ <div class="bg-gray-50 rounded-lg p-4">
81
+ <h3 class="font-semibold text-gray-900 mb-4">آمار استفاده</h3>
82
+ <div class="space-y-3">
83
+ <div class="flex justify-between items-center">
84
+ <span class="text-sm text-gray-600">تعداد مکالمات</span>
85
+ <span class="font-semibold">۴۷</span>
86
+ </div>
87
+ <div class="flex justify-between items-center">
88
+ <span class="text-sm text-gray-600">مجموع پیام‌ها</span>
89
+ <span class="font-semibold">۱,۲۳۴</span>
90
+ </div>
91
+ <div class="flex justify-between items-center">
92
+ <span class="text-sm text-gray-600">اعضا از</span>
93
+ <span class="font-semibold">۱۴۰۲/۰۱/۱۵</span>
94
+ </div>
95
+ </div>
96
+ </div>
97
+
98
+ <div class="bg-gray-50 rounded-lg p-4">
99
+ <h3 class="font-semibold text-gray-900 mb-4">تنظیمات</h3>
100
+ <div class="space-y-2">
101
+ <label class="flex items-center space-x-2 space-x-reverse">
102
+ <input type="checkbox" class="rounded border-gray-300 text-primary-600 focus:ring-primary-500">
103
+ <span class="text-sm text-gray-600">فعال کردن گفتار</span>
104
+ </label>
105
+ <label class="flex items-center space-x-2 space-x-reverse">
106
+ <input type="checkbox" checked class="rounded border-gray-300 text-primary-600 focus:ring-primary-500">
107
+ <span class="text-sm text-gray-600">اعلان‌ها</span>
108
+ </label>
109
+ </div>
110
+ </div>
111
+ </div>
112
+ </div>
113
+ </div>
114
+
115
+ <script>
116
+ feather.replace();
117
+ </script>
118
+ </body>
119
+ </html>
register.html ADDED
@@ -0,0 +1,75 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fa" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>ثبت‌نام - پارس‌گوی</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet">
11
+ <style>
12
+ body { font-family: 'Vazir', sans-serif; }
13
+ .rtl { direction: rtl; }
14
+ </style>
15
+ </head>
16
+ <body class="bg-gray-50 font-vazir rtl">
17
+ <div class="min-h-screen flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
18
+ <div class="max-w-md w-full space-y-8">
19
+ <div>
20
+ <div class="flex justify-center">
21
+ <div class="w-16 h-16 bg-gradient-to-r from-primary-500 to-primary-600 rounded-full flex items-center justify-center text-white font-bold text-2xl">
22
+ 🧠
23
+ </div>
24
+ <h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
25
+ ثبت‌نام در پارس‌گوی
26
+ </h2>
27
+ </div>
28
+ <form class="mt-8 space-y-6" action="#" method="POST">
29
+ <div class="rounded-md shadow-sm space-y-4">
30
+ <div>
31
+ <label for="full-name" class="block text-sm font-medium text-gray-700 mb-1">نام کامل</label>
32
+ <input id="full-name" name="full-name" type="text" required class="relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500" placeholder="نام و نام خانوادگی">
33
+ </div>
34
+ <div>
35
+ <label for="email-address" class="block text-sm font-medium text-gray-700 mb-1">آدرس ایمیل</label>
36
+ <input id="email-address" name="email" type="email" autocomplete="email" required class="relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500" placeholder="آدرس ایمیل">
37
+ </div>
38
+ <div>
39
+ <label for="password" class="block text-sm font-medium text-gray-700 mb-1">رمز عبور</label>
40
+ <input id="password" name="password" type="password" autocomplete="new-password" required class="relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500" placeholder="رمز عبور">
41
+ </div>
42
+ <div>
43
+ <label for="confirm-password" class="block text-sm font-medium text-gray-700 mb-1">تکرار رمز عبور</label>
44
+ <input id="confirm-password" name="confirm-password" type="password" autocomplete="new-password" required class="relative block w-full px-3 py-2 border border-gray-300 placeholder-gray-500 text-gray-900 rounded-lg focus:outline-none focus:ring-primary-500 focus:border-primary-500" placeholder="تکرار رمز عبور">
45
+ </div>
46
+ </div>
47
+
48
+ <div class="flex items-center">
49
+ <input id="agree-terms" name="agree-terms" type="checkbox" required class="h-4 w-4 text-primary-600 focus:ring-primary-500 border-gray-300 rounded">
50
+ <label for="agree-terms" class="mr-2 block text-sm text-gray-900">
51
+ با <a href="#" class="text-primary-600 hover:text-primary-500">قوانین و شرایط</a> موافقم
52
+ </label>
53
+ </div>
54
+
55
+ <div>
56
+ <button type="submit" class="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500">
57
+ ایجاد حساب کاربری
58
+ </button>
59
+ </div>
60
+
61
+ <div class="text-center">
62
+ <span class="text-sm text-gray-600">حساب کاربری دارید؟ </span>
63
+ <a href="/login.html" class="font-medium text-primary-600 hover:text-primary-500">
64
+ ورود
65
+ </a>
66
+ </div>
67
+ </form>
68
+ </div>
69
+ </div>
70
+
71
+ <script>
72
+ feather.replace();
73
+ </script>
74
+ </body>
75
+ </html>