ghaymah_dev/codepill-sfu
2
0
نسخ 0
الشفرة المشكلات طلبات السحب Actions Packages المشاريع الإصدارات الويكي النشاط

more css fixed, removed unusued buttons + remove other bg images:

تصفح المصدر
هذا الالتزام موجود في:
Your Name
2025-11-24 09:03:40 +00:00
الأصل 53b4b146e4
التزام 8c9dd84bae
4 ملفات معدلة مع 116 إضافات و69 حذوفات
تنزيل ملف التصحيح تنزيل ملف الاختلاف توسيع جميع الملفات طي جميع الملفات

55
public/css/Room.css
عرض الملف

@@ -430,6 +430,61 @@ body {
color: red;
}
#toggleExtraButton i {
color: red;
}
#startAudioButton i {
color: red;
}
#stopAudioButton i {
color: red;
}
#startVideoButton i {
color: red;
}
#stopVideoButton i {
color: red;
}
#swapCameraButton i {
color: red;
}
#startScreenButton i {
color: red;
}
#stopScreenButton i {
color: red;
}
#raiseHandButton i {
color: red;
}
#lowerHandButton i {
color: red;
}
#chatButton i {
color: red;
}
#settingsButton i {
color: red;
}
#exitButton i {
color: red;
}
#toggleExtraButton {
color: #66beff;
}

86
public/js/Room.js
عرض الملف

@@ -735,9 +735,9 @@ function setupInitButtons() {
initAudioButton.onclick = () => {
handleAudio();
};
initAudioVideoButton.onclick = async (e) => {
await handleAudioVideo(e);
};
// initAudioVideoButton.onclick = async (e) => {
// await handleAudioVideo(e);
// };
// initStartScreenButton.onclick = async () => {
// await toggleScreenSharing();
// };
@@ -1172,7 +1172,7 @@ async function whoAreYou() {
isInitVideoLoaded = true;
elemDisplay('initVideo', false);
elemDisplay('initVideoButton', false);
elemDisplay('initAudioVideoButton', false);
// elemDisplay('initAudioVideoButton', false);
elemDisplay('initVideoAudioRefreshButton', false);
elemDisplay('initVideoSelect', false);
elemDisplay('tabVideoDevicesBtn', false);
@@ -1181,7 +1181,7 @@ async function whoAreYou() {
if (!BUTTONS.main.startAudioButton) {
isAudioAllowed = false;
elemDisplay('initAudioButton', false);
elemDisplay('initAudioVideoButton', false);
// elemDisplay('initAudioVideoButton', false);
elemDisplay('initVideoAudioRefreshButton', false);
elemDisplay('initMicrophoneSelect', false);
elemDisplay('initSpeakerSelect', false);
@@ -1344,14 +1344,14 @@ async function handleAudioVideo() {
lS.setInitConfig(lS.MEDIA_TYPE.audioVideo, isAudioVideoAllowed);
initAudioButton.className = 'fas fa-microphone' + (isAudioVideoAllowed ? '' : '-slash');
initVideoButton.className = 'fas fa-video' + (isAudioVideoAllowed ? '' : '-slash');
initAudioVideoButton.className = 'fas fa-eye' + (isAudioVideoAllowed ? '' : '-slash');
// initAudioVideoButton.className = 'fas fa-eye' + (isAudioVideoAllowed ? '' : '-slash');
if (!isAudioVideoAllowed) {
hide(initAudioButton);
hide(initVideoButton);
hide(initVideoAudioRefreshButton);
}
if (isAudioAllowed && isVideoAllowed && !isMobileDevice) show(initVideoAudioRefreshButton);
setColor(initAudioVideoButton, isAudioVideoAllowed ? 'white' : 'red');
// setColor(initAudioVideoButton, isAudioVideoAllowed ? 'white' : 'red');
setColor(initAudioButton, isAudioAllowed ? 'white' : 'red');
setColor(initVideoButton, isVideoAllowed ? 'white' : 'red');
setColor(startAudioButton, isAudioAllowed ? 'white' : 'red');
@@ -2396,7 +2396,7 @@ function setButtonsInit() {
if (!isMobileDevice) {
setTippy('initAudioButton', 'Toggle the audio', 'top');
setTippy('initVideoButton', 'Toggle the video', 'top');
setTippy('initAudioVideoButton', 'Toggle the audio & video', 'top');
// setTippy('initAudioVideoButton', 'Toggle the audio & video', 'top');
setTippy('initStartScreenButton', 'Toggle screen sharing', 'top');
setTippy('initStopScreenButton', 'Toggle screen sharing', 'top');
setTippy('initVideoMirrorButton', 'Toggle video mirror', 'top');
@@ -2405,7 +2405,7 @@ function setButtonsInit() {
}
if (!isAudioAllowed) hide(initAudioButton);
if (!isVideoAllowed) hide(initVideoButton);
if (!isAudioAllowed || !isVideoAllowed) hide(initAudioVideoButton);
// if (!isAudioAllowed || !isVideoAllowed) hide(initAudioVideoButton);
if ((!isAudioAllowed && !isVideoAllowed) || isMobileDevice) hide(initVideoAudioRefreshButton);
isAudioVideoAllowed = isAudioAllowed && isVideoAllowed;
}
@@ -2667,7 +2667,7 @@ async function toggleScreenSharing() {
hide(initStartScreenButton);
disable(initVideoSelect, true);
disable(initVideoButton, true);
disable(initAudioVideoButton, true);
// disable(initAudioVideoButton, true);
disable(initVideoAudioRefreshButton, true);
disable(initVirtualBackgroundButton, true);
})
@@ -2682,7 +2682,7 @@ async function toggleScreenSharing() {
show(initStartScreenButton);
disable(initVideoSelect, false);
disable(initVideoButton, false);
disable(initAudioVideoButton, false);
// disable(initAudioVideoButton, false);
disable(initVideoAudioRefreshButton, false);
disable(initVirtualBackgroundButton, false);
}
@@ -5414,40 +5414,40 @@ function showImageSelector() {
);
// Handle file upload (common logic for file selection)
function setupFileUploadButton(buttonId, sourceImg, tooltip, handler) {
const imgButton = document.createElement('img');
imgButton.id = buttonId;
imgButton.src = sourceImg;
imgButton.addEventListener('click', handler);
imageGrid.appendChild(imgButton);
setTippy(imgButton.id, tooltip, 'top');
}
// function setupFileUploadButton(buttonId, sourceImg, tooltip, handler) {
// const imgButton = document.createElement('img');
// imgButton.id = buttonId;
// imgButton.src = sourceImg;
// imgButton.addEventListener('click', handler);
// imageGrid.appendChild(imgButton);
// setTippy(imgButton.id, tooltip, 'top');
// }
function handleFileUpload(file) {
if (file && file.type.startsWith('image/')) {
const reader = new FileReader();
reader.onload = async (e) => {
const imgData = e.target.result;
await indexedDBHelper.saveImage(imgData);
addImageToUI(imgData);
};
reader.readAsDataURL(file);
}
}
// function handleFileUpload(file) {
// if (file && file.type.startsWith('image/')) {
// const reader = new FileReader();
// reader.onload = async (e) => {
// const imgData = e.target.result;
// await indexedDBHelper.saveImage(imgData);
// addImageToUI(imgData);
// };
// reader.readAsDataURL(file);
// }
// }
function createUploadImageButton() {
const fileInput = document.createElement('input');
fileInput.type = 'file';
fileInput.accept = 'image/*';
fileInput.style.display = 'none';
fileInput.addEventListener('change', (event) => {
handleFileUpload(event.target.files[0]);
});
// function createUploadImageButton() {
// const fileInput = document.createElement('input');
// fileInput.type = 'file';
// fileInput.accept = 'image/*';
// fileInput.style.display = 'none';
// fileInput.addEventListener('change', (event) => {
// handleFileUpload(event.target.files[0]);
// });
setupFileUploadButton('initUploadImg', image.upload, 'Upload your custom image', () => fileInput.click());
// setupFileUploadButton('initUploadImg', image.upload, 'Upload your custom image', () => fileInput.click());
return fileInput;
}
// return fileInput;
// }
// Function to add an image to UI
function addImageToUI(imgData) {
@@ -5519,10 +5519,10 @@ function showImageSelector() {
});
// Upload from file button
createUploadImageButton();
// createUploadImageButton();
// Upload from URL button
setupFileUploadButton('initLinkImage', image.link, 'Upload Image from URL', askForImageURL);
// setupFileUploadButton('initLinkImage', image.link, 'Upload Image from URL', askForImageURL);
// Load default virtual backgrounds
virtualBackgrounds.forEach((imageUrl, index) => {

11
public/js/RoomClient.js
عرض الملف

@@ -122,16 +122,7 @@ const image = {
upload: '../images/upload.png',
virtualBackground: {
one: '../images/virtual-background/default/background-1.jpg',
two: '../images/virtual-background/default/background-2.webp',
three: '../images/virtual-background/default/background-3.jpg',
four: '../images/virtual-background/default/background-4.jpg',
five: '../images/virtual-background/default/background-5.jpg',
six: '../images/virtual-background/default/background-6.jpg',
seven: '../images/virtual-background/default/background-7.jpg',
eight: '../images/virtual-background/default/background-8.jpg',
nine: '../images/virtual-background/default/background-9.jpg',
ten: '../images/virtual-background/default/background-10.jpg',
eleven: '../images/virtual-background/default/background-11.gif',
two: '../images/virtual-background/default/background-2.webp'
},
};

33
public/views/Room.html
عرض الملف

@@ -174,7 +174,7 @@ access to use this app.
</div>
<div class="initComands">
<button id="initVideoAudioRefreshButton" class="ph ph-arrow-clockwise"></button>
<button id="initAudioVideoButton" class="ph ph-eye"></button>
<!-- <button id="initAudioVideoButton" class="ph ph-eye"></button> -->
<button id="initVideoButton" class="ph ph-video-camera"></button>
<button id="initAudioButton" class="ph ph-microphone"></button>
<button id="initVirtualBackgroundButton" class="ph ph-image hidden"></button>
@@ -225,23 +225,24 @@ access to use this app.
<button id="aboutButton" class="hidden"><i class="ph ph-question"></i></button>
</div>
<div id="bottomButtons" class="fadein">
<div id="bottomButtons" class="fadein" style="display: none;">
<button id="toggleExtraButton" class=""><i class="fas fa-chevron-up meeting-icon toggle-extra-icon"></i></button>
<button id="startAudioButton" class="hidden"><i class="ph ph-microphone-slash meeting-icon audio-icon"></i></button>
<button id="stopAudioButton" class=""><i class="ph ph-microphone meeting-icon audio-icon red-icon"></i></button>
<button id="startVideoButton" class="hidden"><i class="ph ph-video-camera-slash meeting-icon video-icon"></i></button>
<button id="stopVideoButton" class=""><i class="ph ph-video-camera meeting-icon video-icon"></i></button>
<button id="swapCameraButton" class="hidden"><i class="ph ph-camera-rotate meeting-icon camera-rotate-icon"></i></button>
<button id="startScreenButton" class=""><i class="ph ph-monitor meeting-icon screen-share-icon"></i></button>
<button id="stopScreenButton" class="hidden"><i class="ph ph-stop-circle meeting-icon stop-screen-icon"></i></button>
<button id="raiseHandButton" class=""><i class="ph ph-hand meeting-icon hand-icon"></i></button>
<button id="lowerHandButton" class="hidden"><i id="lowerHandIcon" class="ph ph-hand meeting-icon hand-icon"></i></button>
<button id="chatButton" class=""><i class="ph ph-chats meeting-icon chat-icon"></i></button>
<button id="settingsButton" class=""><i class="ph ph-gear meeting-icon settings-icon"></i></button>
<button id="exitButton" class=""><i class="ph ph-phone-slash meeting-icon exit-icon"></i></button>
</div>
<button id="toggleExtraButton" class="hidden"><i class="ph ph-caret-down"></i></button>
<button id="startAudioButton" class="hidden"><i class="ph ph-microphone-slash"></i></button>
<button id="stopAudioButton" class="hidden"><i class="ph ph-microphone"></i></button>
<button id="startVideoButton" class="hidden"><i class="ph ph-video-camera-slash"></i></button>
<button id="stopVideoButton" class="hidden"><i class="ph ph-video-camera"></i></button>
<button id="swapCameraButton" class="hidden"><i class="ph ph-camera-rotate"></i></button>
<button id="startScreenButton" class="hidden"><i class="ph ph-monitor"></i></button>
<button id="stopScreenButton" class="hidden"><i class="ph ph-stop-circle"></i></button>
<button id="raiseHandButton" class="hidden"><i class="ph ph-hand"></i></button>
<button id="lowerHandButton" class="hidden"><i id="lowerHandIcon" class="ph ph-hand"></i></button>
<button id="chatButton" class="hidden"><i class="ph ph-chats"></i></button>
<button id="settingsButton" class="hidden"><i class="ph ph-gear"></i></button>
<button id="exitButton" class="hidden"><i class="ph ph-phone-slash"></i></button>
</div>
<div id="emojiPickerContainer" class="roomEmoji fadein"></div>
<div id="userEmoji" class="userEmoji"></div>