Hugging Face's logo

Spaces:
Muhammadidrees
/
RiayatechConverstionalAI
Running

App Files Community
RiayatechConverstionalAI
File size: 4,710 Bytes 
2cca11c
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AI Doctor Consultation with Voice</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="notification" id="notification"></div>

    <div class="container">
        <div class="header">
            <h1>🩺 AI Doctor Consultation</h1>
            <p>Professional Medical Consultation with Voice & PDF Summary</p>
            
            <div class="voice-controls">
                <button class="voice-btn" id="continuousModeBtn" onclick="toggleContinuousMode()">
                    <span class="voice-indicator"></span>
                    <span>🔄 Continuous: OFF</span>
                </button>
                <button class="voice-btn" id="toggleAutoSpeak" onclick="toggleAutoSpeak()">
                    <span class="voice-indicator" id="speakIndicator"></span>
                    <span id="autoSpeakText">🔊 Auto-Speak: OFF</span>
                </button>
                <button class="voice-btn" id="voiceInputBtn" onclick="toggleVoiceInput()">
                    🎤 Voice Input
                </button>
            </div>

            <div class="voice-status" id="voiceStatus"></div>
            
            <div class="session-info" id="sessionInfo">
                Starting new session...
            </div>
            <div class="session-id-display" id="sessionIdDisplay" onclick="copySessionId()" title="Click to copy">
                Session ID: Loading...
            </div>
        </div>

        <div class="loading" id="loading">Dr. AI is typing...</div>

        <div class="chat-container" id="chatContainer">
            <!-- Messages will appear here -->
        </div>

        <div class="input-area">
            <button class="btn btn-voice" id="voiceBtn" onclick="toggleVoiceInput()">
                🎤
            </button>
            <input type="text" id="messageInput" placeholder="Type or speak your message..." />
            <button class="btn btn-primary" onclick="sendMessage()">Send 📤</button>
        </div>

        <div class="controls">
            <button class="btn btn-success" onclick="generateSummary()">📋 Generate Summary & PDF</button>
            <button class="btn btn-info" onclick="showHistoryModal()">📜 Load History</button>
            <button class="btn btn-secondary" onclick="restartSession()">🔄 Restart</button>
        </div>
    </div>

    <!-- Summary Modal with PDF -->
    <div class="modal" id="summaryModal">
        <div class="modal-content">
            <span class="close-btn" onclick="closeSummary()">&times;</span>
            <h2>📋 Consultation Summary</h2>
            
            <div id="pdfDownloadInfo" class="pdf-download-info" style="display: none;">
                <div class="pdf-icon">📄</div>
                <h3>PDF Generated Successfully!</h3>
                <p>Your consultation summary has been saved as a PDF document.</p>
            </div>

            <div class="summary-actions">
                <button class="btn btn-success" id="downloadPdfBtn" onclick="downloadPDF()" style="display: none;">
                    📥 Download PDF
                </button>
                <button class="btn btn-info" id="viewPdfBtn" onclick="togglePDFViewer()" style="display: none;">
                    👁️ View PDF
                </button>
            </div>

            <div id="pdfViewerContainer" style="display: none;">
                <h3 style="margin-top: 20px;">PDF Preview:</h3>
                <iframe id="pdfViewer" class="pdf-viewer"></iframe>
            </div>

            <h3 style="margin-top: 20px;">Text Summary:</h3>
            <pre id="summaryText"></pre>
        </div>
    </div>

    <!-- History Modal -->
    <div class="modal" id="historyModal">
        <div class="modal-content">
            <span class="close-btn" onclick="closeHistory()">&times;</span>
            <h2>📜 Load Previous Consultation</h2>
            
            <div class="load-session-form">
                <input type="text" id="sessionIdInput" placeholder="Enter Session ID..." />
                <button class="btn btn-primary" onclick="loadSessionById()">Load</button>
            </div>

            <h3>Recent Consultations:</h3>
            <div class="history-list" id="historyList">
                <p style="text-align: center; color: #999;">Loading history...</p>
            </div>
        </div>
    </div>

    <script src="script.js"></script>
</body>
</html>