[mirotalksfu] - add editor pin/unpin

هذا الالتزام موجود في:
Miroslav Pejic
2024-08-14 19:44:56 +02:00
الأصل b30b693006
التزام bc3775c051
8 ملفات معدلة مع 92 إضافات و10 حذوفات

عرض الملف

@@ -43,7 +43,7 @@ dependencies: {
* @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.5.57
* @version 1.5.58
*
*/

عرض الملف

@@ -1,6 +1,6 @@
{
"name": "mirotalksfu",
"version": "1.5.57",
"version": "1.5.58",
"description": "WebRTC SFU browser-based video calls",
"main": "Server.js",
"scripts": {

عرض الملف

@@ -2,11 +2,11 @@
z-index: 5;
position: absolute;
padding: 20px;
width: 100%;
height: 100%;
width: var(--editor-container-width);
height: var(--editor-container-height);
border: var(--border);
border-radius: 10px;
background: var(--body-bg);
border: var(--border);
box-shadow: var(--box-shadow);
overflow-x: hidden;
overflow-y: auto;
@@ -29,7 +29,7 @@
}
.editor {
height: 85vh !important;
height: var(--editor-height) !important;
color: white !important;
border-radius: 0px 0px 10px 10px; /* Top-left, top-right, bottom-right, bottom-left */
border: var(--border) !important;

عرض الملف

@@ -48,6 +48,10 @@
--transcription-width: 420px;
--trx-bg: radial-gradient(#393939, #000000);
--editor-container-width: 100%;
--editor-container-height: 100%;
--editor-height: 85vh;
--vmi-wh: 15vw;
/* https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit */
--videoObjFit: cover;

عرض الملف

@@ -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.5.57
* @version 1.5.58
*
*/
@@ -342,6 +342,7 @@ function initClient() {
setTippy('pollCloseBtn', 'Close', 'bottom');
setTippy('editorLockBtn', 'Toggle Lock editor', 'bottom');
setTippy('editorUnlockBtn', 'Toggle Lock editor', 'bottom');
setTippy('editorTogglePin', 'Toggle pin', 'bottom');
setTippy('editorUndoBtn', 'Undo', 'bottom');
setTippy('editorRedoBtn', 'Redo', 'bottom');
setTippy('editorCopyBtn', 'Copy', 'bottom');
@@ -1331,6 +1332,7 @@ function roomIsReady() {
hide(chatMinButton);
rc.pollMaximize();
hide(pollTogglePin);
hide(editorTogglePin);
hide(pollMaxButton);
hide(pollMinButton);
transcription.maximize();
@@ -1341,6 +1343,7 @@ function roomIsReady() {
rc.makeDraggable(emojiPickerContainer, emojiPickerHeader);
rc.makeDraggable(chatRoom, chatHeader);
rc.makeDraggable(pollRoom, pollHeader);
//rc.makeDraggable(editorRoom, editorHeader);
rc.makeDraggable(mySettings, mySettingsHeader);
rc.makeDraggable(whiteboard, whiteboardHeader);
rc.makeDraggable(sendFileDiv, imgShareSend);
@@ -1357,6 +1360,7 @@ function roomIsReady() {
BUTTONS.chat.chatPinButton && show(chatTogglePin);
BUTTONS.chat.chatMaxButton && show(chatMaxButton);
BUTTONS.poll.pollPinButton && show(pollTogglePin);
show(editorTogglePin);
BUTTONS.poll.pollMaxButton && show(pollMaxButton);
BUTTONS.settings.pushToTalk && show(pushToTalkDiv);
BUTTONS.settings.tabRTMPStreamingBtn &&
@@ -1646,6 +1650,9 @@ function handleButtons() {
rc.editorSendAction('close');
}
};
editorTogglePin.onclick = () => {
rc.toggleEditorPin();
};
editorLockBtn.onclick = () => {
rc.toggleLockUnlockEditor();
};
@@ -4437,7 +4444,7 @@ function showAbout() {
imageUrl: image.about,
customClass: { image: 'img-about' },
position: 'center',
title: 'WebRTC SFU v1.5.57',
title: 'WebRTC SFU v1.5.58',
html: `
<br />
<div id="about">

عرض الملف

@@ -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.5.57
* @version 1.5.58
*
*/
@@ -265,6 +265,7 @@ class RoomClient {
this.isPollPinned = false;
this.isEditorOpen = false;
this.isEditorLocked = false;
this.isEditorPinned = false;
this.isSpeechSynthesisSupported = isSpeechSynthesisSupported;
this.speechInMessages = false;
this.showChatOnMessage = true;
@@ -3516,6 +3517,9 @@ class RoomClient {
if (this.isPollPinned) {
this.pollPin();
}
if (this.isEditorPinned) {
this.editorPin();
}
if (this.transcription.isPin()) {
this.transcription.pinned();
}
@@ -3716,6 +3720,9 @@ class RoomClient {
if (this.isPollPinned) {
return userLog('info', 'Please unpin the poll that appears to be currently pinned', 'top-end');
}
if (this.isEditorPinned) {
return userLog('info', 'Please unpin the editor that appears to be currently pinned', 'top-end');
}
this.isChatPinned ? this.chatUnpin() : this.chatPin();
this.sound('click');
}
@@ -4387,6 +4394,9 @@ class RoomClient {
if (this.isChatPinned) {
return userLog('info', 'Please unpin the chat that appears to be currently pinned', 'top-end');
}
if (this.isEditorPinned) {
return userLog('info', 'Please unpin the editor that appears to be currently pinned', 'top-end');
}
this.isPollPinned ? this.pollUnpin() : this.pollPin();
this.sound('click');
}
@@ -4401,7 +4411,7 @@ class RoomClient {
this.isPollPinned = true;
setColor(pollTogglePin, 'lime');
resizeVideoMedia();
chatRoom.style.resize = 'none';
pollRoom.style.resize = 'none';
if (!this.isMobileDevice) this.makeUnDraggable(pollRoom, pollHeader);
}
@@ -4687,9 +4697,11 @@ class RoomClient {
toggleEditor() {
editorRoom.classList.toggle('show');
if (!this.isEditorOpen) {
this.editorCenter();
this.sound('open');
}
this.isEditorOpen = !this.isEditorOpen;
if (this.isEditorPinned) this.editorUnpin();
}
toggleLockUnlockEditor() {
@@ -4719,6 +4731,61 @@ class RoomClient {
editorRoom.style.left = '50%';
}
toggleEditorPin() {
if (transcription.isPin()) {
return userLog('info', 'Please unpin the transcription that appears to be currently pinned', 'top-end');
}
if (this.isPollPinned) {
return userLog('info', 'Please unpin the poll that appears to be currently pinned', 'top-end');
}
if (this.isChatPinned) {
return userLog('info', 'Please unpin the chat that appears to be currently pinned', 'top-end');
}
this.isEditorPinned ? this.editorUnpin() : this.editorPin();
this.sound('click');
}
editorPin() {
if (!this.isVideoPinned) {
this.videoMediaContainer.style.top = 0;
this.videoMediaContainer.style.width = '70%';
this.videoMediaContainer.style.height = '100%';
}
this.editorPinned();
this.isEditorPinned = true;
setColor(editorTogglePin, 'lime');
resizeVideoMedia();
document.documentElement.style.setProperty('--editor-height', '80vh');
//if (!this.isMobileDevice) this.makeUnDraggable(editorRoom, editorHeader);
}
editorUnpin() {
if (!this.isVideoPinned) {
this.videoMediaContainer.style.top = 0;
this.videoMediaContainer.style.right = null;
this.videoMediaContainer.style.width = '100%';
this.videoMediaContainer.style.height = '100%';
}
editorRoom.style.maxWidth = '100%';
editorRoom.style.maxHeight = '100%';
this.pollCenter();
this.isEditorPinned = false;
setColor(editorTogglePin, 'white');
resizeVideoMedia();
document.documentElement.style.setProperty('--editor-height', '85vh');
//if (!this.isMobileDevice) this.makeDraggable(editorRoom, editorHeader);
}
editorPinned() {
editorRoom.style.position = 'absolute';
editorRoom.style.top = 0;
editorRoom.style.right = 0;
editorRoom.style.left = null;
editorRoom.style.transform = null;
editorRoom.style.maxWidth = '30%';
editorRoom.style.maxHeight = '100%';
}
editorUpdate() {
if (this.isEditorOpen && (!isRulesActive || isPresenter)) {
console.log('IsPresenter: update editor content to the participants in the room');

عرض الملف

@@ -285,6 +285,9 @@ class Transcription {
if (rc.isChatPinned) {
return userLog('info', 'Please unpin the chat that appears to be currently pinned', 'top-end');
}
if (rc.isEditorPinned) {
return userLog('info', 'Please unpin the editor that appears to be currently pinned', 'top-end');
}
this.isPinned ? this.unpinned() : this.pinned();
rc.sound('click');
}

عرض الملف

@@ -1544,6 +1544,7 @@ access to use this app.
<section id="editorRoom" class="editor-container fadein hidden">
<div id="editorHeader" class="editor-header">
<div class="editor-header-btns">
<button id="editorTogglePin" class="fas fa-map-pin hidden"></button>
<button id="editorUnlockBtn" class="fa-solid fa-lock-open hidden"></button>
<button id="editorLockBtn" class="fa-solid fa-lock hidden"></button>
<button id="editorUndoBtn" class="fas fa-undo"></button>