Hugging Face's logo

Spaces:
OrganizedProgrammers
/
ReOpenAI
Sleeping

App Files Community
ReOpenAI
File size: 5,171 Bytes 
14f00fb
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
b7f3059
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
14f00fb
7d5dfa0
14f00fb
 
 
 
 
 
 
 
 
7d5dfa0
 
 
 
 
 
 
14f00fb
 
 
 
 
7d5dfa0
14f00fb
 
 
 
 
 
 
 
7d5dfa0
14f00fb
 
 
 
 
 
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
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
 
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Client WebSocket Simple</title>
    <style>
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            margin: 40px;
            background-color: #f0f2f5;
        }
        .container {
            max-width: 600px;
            margin: auto;
            padding: 20px;
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        #status {
            padding: 10px;
            border-radius: 5px;
            font-weight: bold;
            margin-bottom: 15px;
        }
        .connected {
            background-color: #e6ffed;
            color: #2f6f43;
        }
        .disconnected {
            background-color: #ffeef0;
            color: #c53030;
        }
        #logs {
            list-style-type: none;
            padding: 0;
            margin-top: 20px;
            background-color: #f7f7f7;
            border: 1px solid #ddd;
            border-radius: 5px;
            height: 200px;
            overflow-y: scroll;
            padding: 10px;
        }
        #logs li {
            padding: 5px;
            border-bottom: 1px solid #eee;
        }
    </style>
</head>
<body>

    <div class="container">
        <h2>Client WebSocket pour API Mock</h2>
        <div id="status" class="disconnected">Déconnecté</div>
        
        <h3>Logs de Communication :</h3>
        <ul id="logs">
            <li>En attente de connexion...</li>
        </ul>
    </div>

    <script>
        const statusDiv = document.getElementById('status');
        const logsList = document.getElementById('logs');
        let ws;
        function addLog(message) {
            const li = document.createElement('li');
            li.textContent = `[${new Date().toLocaleTimeString()}] ${message}`;
            logsList.appendChild(li);
            logsList.scrollTop = logsList.scrollHeight; // Auto-scroll
        }
        // OpenAI API Call for private mode
        async function callOpenAI(prompt) {
            console.log('prompt:', prompt)
            try {
                const response = await fetch('https://llm.synapse.thalescloud.io/v1/chat/completions', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json',
                        'Authorization': `Bearer sk-WzlemPa1Od-gAFwALPbgDA`
                    },
                    body: JSON.stringify({
                        model: 'gemini-2.5-pro',
                        messages: [
                            {
                                role: 'user',
                                content: prompt
                            }
                        ],
                        temperature: 0.7
                    })
                });
                console.log('response:', response)
                if (!response.ok) {
                    throw new Error(`OpenAI API error: ${response.status}`);
                }
        
                const data = await response.json();
                console.log('data:', data)
                return data.choices[0].message.content.trim();
            } catch (error) {
                console.error('Error calling OpenAI:', error);
                throw error;
            }
        }
        function connect() {
            // Adapte le protocole (ws ou wss pour le sécurisé)
            const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
            const wsUrl = `${protocol}//${window.location.host}/ws`;
            ws = new WebSocket(wsUrl);
            ws.onopen = function() {
                statusDiv.textContent = 'Connecté';
                statusDiv.className = 'connected';
                addLog('Connexion WebSocket établie.');
            };
            ws.onmessage = function(event) {
                const messageFromServer = event.data;
                addLog(`Message reçu du serveur : "${messageFromServer}"`);
                
                // C'est ici que le client répond automatiquement
                const responsePhrase = "Ceci est la phrase de réponse du client JavaScript.";
                addLog(`Envoi de la réponse automatique : "${responsePhrase}"`);
                ws.send(responsePhrase);
            };
            ws.onclose = function() {
                statusDiv.textContent = 'Déconnecté';
                statusDiv.className = 'disconnected';
                addLog('Connexion WebSocket fermée. Tentative de reconnexion dans 3 secondes...');
                // Tente de se reconnecter après 3 secondes
                setTimeout(connect, 3000); 
            };
            ws.onerror = function(error) {
                addLog('Erreur WebSocket.');
                console.error('WebSocket Error:', error);
                ws.close();
            };
        }
        // Lance la connexion au chargement de la page
        connect();
    </script>

</body>
</html>