[mirotalksfu] - add DeepSeek integration

2025-05-03 04:25:32 +02:00
--- a/public/images/deepSeek.png
+++ b/public/images/deepSeek.png
--- a/public/js/Brand.js
+++ b/public/js/Brand.js
@@ -64,7 +64,7 @@ let BRAND = {
    },
    about: {
        imageUrl: '../images/mirotalk-logo.gif',
-        title: '<strong>WebRTC SFU v1.8.36</strong>',
+        title: '<strong>WebRTC SFU v1.8.37</strong>',
        html: `
            <button 
                id="support-button" 
--- a/public/js/LocalStorage.js
+++ b/public/js/LocalStorage.js
@@ -28,6 +28,7 @@ class LocalStorage {
            moderator_screen_cant_share: false, // Everyone can't share screen
            moderator_chat_cant_privately: false, // Everyone can't chat privately, only Public chat allowed
            moderator_chat_cant_chatgpt: false, // Everyone can't chat with ChatGPT
+            moderator_chat_cant_deep_seek: false, // Everyone can't chat with DeepSeek
            moderator_media_cant_sharing: false, // Everyone can't share media
            moderator_disconnect_all_on_leave: false, // Disconnect all participants on leave room
            mic_auto_gain_control: true,
--- a/public/js/Room.js
+++ b/public/js/Room.js
@@ -11,7 +11,7 @@ if (location.href.substr(0, 5) !== 'https') location.href = 'https' + location.h
 * @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
 * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
 * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.8.36
+ * @version 1.8.37
 *
 */

@@ -250,6 +250,7 @@ let isVideoControlsOn = false;
 let isChatPasteTxt = false;
 let isChatMarkdownOn = false;
 let isChatGPTOn = false;
+let isDeepSeekOn = false;
 let isSpeechSynthesisSupported = 'speechSynthesis' in window;
 let joinRoomWithoutAudioVideo = true;
 let joinRoomWithScreen = false;
@@ -2853,6 +2854,14 @@ function handleSelects() {
        lS.setSettings(localStorageSettings);
        e.target.blur();
    };
+    switchEveryoneCantChatDeepSeek.onchange = (e) => {
+        const chatCantDeepSeek = e.currentTarget.checked;
+        rc.updateRoomModerator({ type: 'chat_cant_deep_seek', status: chatCantDeepSeek });
+        rc.roomMessage('chat_cant_deep_seek', chatCantDeepSeek);
+        localStorageSettings.moderator_chat_cant_deep_seek = chatCantDeepSeek;
+        lS.setSettings(localStorageSettings);
+        e.target.blur();
+    };
    switchEveryoneCantMediaSharing.onchange = (e) => {
        const mediaCantSharing = e.currentTarget.checked;
        rc.updateRoomModerator({ type: 'media_cant_sharing', status: mediaCantSharing });
@@ -4465,6 +4474,31 @@ function getParticipantsList(peers) {
        </li>`;
    }

+    const deepSeek = BUTTONS.chat.deepSeek !== undefined ? BUTTONS.chat.deepSeek : true;
+
+    // DEEP-SEEK
+    if (deepSeek) {
+        const deepSeek_active = rc.chatPeerName === 'DeepSeek' ? ' active' : '';
+
+        li += `
+        <li 
+            id="DeepSeek" 
+            data-to-id="DeepSeek"
+            data-to-name="DeepSeek"
+            class="clearfix${deepSeek_active}" 
+            onclick="rc.showPeerAboutAndMessages(this.id, 'DeepSeek', '', event)"
+        >
+            <img 
+                src="${image.deepSeek}"
+                alt="avatar"
+            />
+            <div class="about">
+                <div class="name">DeepSeek</div>
+                <div class="status"><i class="fa fa-circle online"></i> online</div>
+            </div>
+        </li>`;
+    }
+
    const public_chat_active = rc.chatPeerName === 'all' ? ' active' : '';

    // ALL
@@ -5351,7 +5385,7 @@ function showAbout() {
        position: 'center',
        imageUrl: BRAND.about?.imageUrl && BRAND.about.imageUrl.trim() !== '' ? BRAND.about.imageUrl : image.about,
        customClass: { image: 'img-about' },
-        title: BRAND.about?.title && BRAND.about.title.trim() !== '' ? BRAND.about.title : 'WebRTC SFU v1.8.36',
+        title: BRAND.about?.title && BRAND.about.title.trim() !== '' ? BRAND.about.title : 'WebRTC SFU v1.8.37',
        html: `
            <br />
            <div id="about">
--- a/public/js/RoomClient.js
+++ b/public/js/RoomClient.js
@@ -9,7 +9,7 @@
 * @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
 * @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
 * @author  Miroslav Pejic - miroslav.pejic.85@gmail.com
- * @version 1.8.36
+ * @version 1.8.37
 *
 */

@@ -104,6 +104,7 @@ const image = {
    lobby: '../images/lobby.png',
    email: '../images/email.png',
    chatgpt: '../images/chatgpt.png',
+    deepSeek: '../images/deepSeek.png',
    all: '../images/all.png',
    forbidden: '../images/forbidden.png',
    broadcasting: '../images/broadcasting.png',
@@ -267,6 +268,7 @@ class RoomClient {
            screen_cant_share: false,
            chat_cant_privately: false,
            chat_cant_chatgpt: false,
+            chat_cant_deep_seek: false,
            media_cant_sharing: false,
        };

@@ -330,6 +332,7 @@ class RoomClient {

        this.pollSelectedOptions = {};
        this.chatGPTContext = [];
+        this.deepSeekContext = [];
        this.chatMessages = [];
        this.leftMsgAvatar = null;
        this.rightMsgAvatar = null;
@@ -4773,7 +4776,7 @@ class RoomClient {
    }

    sendMessage() {
-        if (!this.thereAreParticipants() && !isChatGPTOn) {
+        if (!this.thereAreParticipants() && !isChatGPTOn && !isDeepSeekOn) {
            this.cleanMessage();
            isChatPasteTxt = false;
            return this.userLog('info', 'No participants in the room', 'top-end');
@@ -4825,12 +4828,14 @@ class RoomClient {
            peer_name: this.peer_name,
            peer_avatar: this.peer_avatar,
            peer_id: this.peer_id,
-            to_peer_id: 'ChatGPT',
-            to_peer_name: 'ChatGPT',
+            to_peer_id: '',
+            to_peer_name: '',
            peer_msg: peer_msg,
        };

        if (isChatGPTOn) {
+            data.to_peer_id = 'ChatGPT';
+            data.to_peer_name = 'ChatGPT';
            console.log('Send message:', data);
            this.socket.emit('message', data);
            this.setMsgAvatar('left', this.peer_name, this.peer_avatar);
@@ -4869,7 +4874,60 @@ class RoomClient {
                .catch((err) => {
                    console.log('ChatGPT error:', err);
                });
-        } else {
+        }
+
+        if (isDeepSeekOn) {
+            data.to_peer_id = 'deepSeek';
+            data.to_peer_name = 'deepSeek';
+            console.log('Send message:', data);
+            this.socket.emit('message', data);
+            this.setMsgAvatar('left', this.peer_name, this.peer_avatar);
+            this.appendMessage(
+                'left',
+                this.leftMsgAvatar,
+                this.peer_name,
+                this.peer_id,
+                peer_msg,
+                data.to_peer_id,
+                data.to_peer_name,
+            );
+            this.cleanMessage();
+
+            this.socket
+                .request('getDeepSeek', {
+                    time: getDataTimeString(),
+                    room: this.room_id,
+                    name: this.peer_name,
+                    prompt: peer_msg,
+                    context: this.deepSeekContext,
+                })
+                .then((completion) => {
+                    if (!completion) return;
+                    const { message, context } = completion;
+                    this.deepSeekContext = context ? context : [];
+                    console.log('Receive message:', message);
+                    this.setMsgAvatar('right', 'DeepSeek');
+                    this.appendMessage(
+                        'right',
+                        image.deepSeek,
+                        'DeepSeek',
+                        this.peer_id,
+                        message,
+                        'DeepSeek',
+                        'DeepSeek',
+                    );
+                    this.cleanMessage();
+                    this.streamingTask(message);
+                    this.speechInMessages && !VideoAI.active
+                        ? this.speechMessage(true, 'DeepSeek', message)
+                        : this.sound('message');
+                })
+                .catch((err) => {
+                    console.log('DeepSeek error:', err);
+                });
+        }
+
+        if (!isChatGPTOn || !isDeepSeekOn) {
            const participantsList = this.getId('participantsList');
            const participantsListItems = participantsList.getElementsByTagName('li');
            for (let i = 0; i < participantsListItems.length; i++) {
@@ -4980,7 +5038,7 @@ class RoomClient {
            // INCOMING PRIVATE MESSAGE
            if (li.id === data.peer_id && data.to_peer_id != 'all') {
                li.classList.add('pulsate');
-                if (!['all', 'ChatGPT'].includes(data.to_peer_id)) {
+                if (!['all', 'ChatGPT', 'DeepSeek'].includes(data.to_peer_id)) {
                    this.getId(`${data.peer_id}-unread-msg`).classList.remove('hidden');
                }
            }
@@ -5069,6 +5127,9 @@ class RoomClient {
            case 'ChatGPT':
                chatGPTMessages.insertAdjacentHTML('beforeend', newMessageHTML);
                break;
+            case 'DeepSeek':
+                deepSeekMessages.insertAdjacentHTML('beforeend', newMessageHTML);
+                break;
            case 'all':
                chatPublicMessages.insertAdjacentHTML('beforeend', newMessageHTML);
                break;
@@ -5079,8 +5140,8 @@ class RoomClient {

        const message = getId(`message-${chatMessagesId}`);
        if (message) {
-            if (getFromName === 'ChatGPT') {
-                // Stream the message for ChatGPT
+            if (['ChatGPT', 'DeepSeek'].includes(getFromName)) {
+                // Stream the message for ChatGPT or DeepSeek
                this.streamMessage(message, getMsg, 100);
            } else {
                // Process the message for other senders
@@ -5372,10 +5433,12 @@ class RoomClient {
                }
                // Remove child nodes from different message containers
                removeAllChildNodes(chatGPTMessages);
+                removeAllChildNodes(deepSeekMessages);
                removeAllChildNodes(chatPublicMessages);
                removeAllChildNodes(chatPrivateMessages);
                this.chatMessages = [];
                this.chatGPTContext = [];
+                this.deepSeekContext = [];
                this.sound('delete');
            }
        });
@@ -7401,6 +7464,13 @@ class RoomClient {
                    'top-end',
                );
                break;
+            case 'chat_cant_deep_seek':
+                this.userLog(
+                    'info',
+                    `${icons.moderator} Moderator: everyone can't chat with DeepSeek ${status}`,
+                    'top-end',
+                );
+                break;
            case 'media_cant_sharing':
                this.userLog('info', `${icons.moderator} Moderator: everyone can't share media ${status}`, 'top-end');
                break;
@@ -8784,7 +8854,7 @@ class RoomClient {
        const avatarImg = getParticipantAvatar(peer_name, peer_avatar);

        const generateChatAboutHTML = (imgSrc, title, status = 'online', participants = '') => {
-            const isSensitiveChat = !['all', 'ChatGPT'].includes(peer_id) && title.length > 15;
+            const isSensitiveChat = !['all', 'ChatGPT', 'DeepSeek'].includes(peer_id) && title.length > 15;
            const truncatedTitle = isSensitiveChat ? `${title.substring(0, 10)}*****` : title;
            return `
                <img class="all-participants-img" 
@@ -8810,7 +8880,7 @@ class RoomClient {
        for (let i = 0; i < participantsListItems.length; i++) {
            participantsListItems[i].classList.remove('active');
            participantsListItems[i].classList.remove('pulsate'); // private new message to read
-            if (!['all', 'ChatGPT'].includes(peer_id)) {
+            if (!['all', 'ChatGPT', 'DeepSeek'].includes(peer_id)) {
                // icon private new message to read
                this.getId(`${peer_id}-unread-msg`).classList.add('hidden');
            }
@@ -8818,6 +8888,8 @@ class RoomClient {
        participant.classList.add('active');

        isChatGPTOn = false;
+        isDeepSeekOn = false;
+
        console.log('Display messages', peer_id);

        switch (peer_id) {
@@ -8829,6 +8901,19 @@ class RoomClient {
                chatAbout.innerHTML = generateChatAboutHTML(image.chatgpt, 'ChatGPT');
                this.getId('chatGPTMessages').style.display = 'block';
                break;
+            case 'DeepSeek':
+                if (this._moderator.chat_cant_deep_seek) {
+                    return userLog(
+                        'warning',
+                        'The moderator does not allow you to chat with DeepSeek',
+                        'top-end',
+                        6000,
+                    );
+                }
+                isDeepSeekOn = true;
+                chatAbout.innerHTML = generateChatAboutHTML(image.deepSeek, 'DeepSeek');
+                this.getId('deepSeekMessages').style.display = 'block';
+                break;
            case 'all':
                chatAbout.innerHTML = generateChatAboutHTML(image.all, 'Public chat', 'online', participantsCount);
                this.getId('chatPublicMessages').style.display = 'block';
@@ -8861,6 +8946,7 @@ class RoomClient {

    hidePeerMessages() {
        elemDisplay('chatGPTMessages', false);
+        elemDisplay('deepSeekMessages', false);
        elemDisplay('chatPublicMessages', false);
        elemDisplay('chatPrivateMessages', false);
    }
--- a/public/js/Rules.js
+++ b/public/js/Rules.js
@@ -94,6 +94,7 @@ let BUTTONS = {
        chatMarkdownButton: true,
        chatSpeechStartButton: true,
        chatGPT: true,
+        deepSeek: true,
    },
    poll: {
        pollPinButton: true,
@@ -184,6 +185,7 @@ function handleRules(isPresenter) {
        switchEveryoneCantShareScreen.checked = localStorageSettings.moderator_screen_cant_share;
        switchEveryoneCantChatPrivately.checked = localStorageSettings.moderator_chat_cant_privately;
        switchEveryoneCantChatChatGPT.checked = localStorageSettings.moderator_chat_cant_chatgpt;
+        switchEveryoneCantChatDeepSeek.checked = localStorageSettings.moderator_chat_cant_deep_seek;
        switchEveryoneCantMediaSharing.checked = localStorageSettings.moderator_media_cant_sharing;
        switchDisconnectAllOnLeave.checked = localStorageSettings.moderator_disconnect_all_on_leave;

@@ -197,6 +199,7 @@ function handleRules(isPresenter) {
            screen_cant_share: switchEveryoneCantShareScreen.checked,
            chat_cant_privately: switchEveryoneCantChatPrivately.checked,
            chat_cant_chatgpt: switchEveryoneCantChatChatGPT.checked,
+            chat_cant_deep_seek: switchEveryoneCantChatDeepSeek.checked,
            media_cant_sharing: switchEveryoneCantMediaSharing.checked,
        };
        console.log('Rules moderator data ---->', moderatorData);
--- a/public/views/Room.html
+++ b/public/views/Room.html
@@ -887,7 +887,25 @@ access to use this app.
                                    </div>
                                </td>
                            </tr>
-                            <tr id="everyoneCantChatGPTBtn">
+                            <tr id="everyoneCantChatDeepSeek">
+                                <td>
+                                    <div class="title">
+                                        <i class="fa-solid fa-robot red"></i>
+                                        <p>Disable DeepSeek Access</p>
+                                    </div>
+                                </td>
+                                <td>
+                                    <div class="form-check form-switch form-switch-md">
+                                        <input
+                                            id="switchEveryoneCantChatDeepSeek"
+                                            class="form-check-input"
+                                            type="checkbox"
+                                            checked
+                                        />
+                                    </div>
+                                </td>
+                            </tr>
+                            <tr id="everyoneCantMediaSharingBtn">
                                <td>
                                    <div class="title">
                                        <i class="fab fa-youtube red"></i>
@@ -1627,6 +1645,7 @@ access to use this app.
                    <div id="chatHistory" class="chat-history">
                        <!-- CHAT MESSAGES -->
                        <ul id="chatGPTMessages" class="mb-0"></ul>
+                        <ul id="deepSeekMessages" class="mb-0"></ul>
                        <ul id="chatPublicMessages" class="mb-0"></ul>
                        <ul id="chatPrivateMessages" class="mb-0"></ul>