MigrateRepos/decentralized-video-chat
1
0
Fork 0
mirror of https://github.com/ianramzy/decentralized-video-chat.git synced 2024-11-17 07:39:21 +08:00
Code Issues Releases Wiki Activity

Merge branch 'fixes' of github.com:questo-ai/decentralized-video-chat into fixes

Browse Source
This commit is contained in:
Taichi Kato 2020-06-01 12:31:33 +08:00
commit 22f7edba3e
2 changed files with 26 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
public/css/chat.css vendored
View File

@ -339,6 +339,9 @@ button:hover {
justify-content: center; justify-content: center;
padding: 12px; padding: 12px;
max-width: 100%; max-width: 100%;
border-style: solid;
border-width: 2px;
border-color: var(--bloc-color);
border-radius: 20px 20px 20px 5px; border-radius: 20px 20px 20px 5px;
box-shadow: 6px 6px 12px #030506, -6px -6px 12px #23242a; box-shadow: 6px 6px 12px #030506, -6px -6px 12px #23242a;
} }
@ -347,6 +350,9 @@ button:hover {
#chat-zone .message-item.customer .message-bloc { #chat-zone .message-item.customer .message-bloc {
background-color: rgb(47, 48, 52); background-color: rgb(47, 48, 52);
color: #fff; color: #fff;
border-style: solid;
border-width: 2px;
border-color: var(--bloc-color);
border-radius: 20px 20px 5px 20px; border-radius: 20px 20px 5px 20px;
box-shadow: 6px 6px 12px #030506, -6px -6px 12px #22232a; box-shadow: 6px 6px 12px #030506, -6px -6px 12px #22232a;
} }

24
public/js/chat.js
View File

@ -32,6 +32,7 @@ var dataChannel = new Map();
var VideoChat = { var VideoChat = {
videoEnabled: true, videoEnabled: true,
audioEnabled: true, audioEnabled: true,
borderColor: `hsl(${Math.floor(Math.random() * 360)}, 70%, 80%)`,
connected: new Map(), connected: new Map(),
localICECandidates: {}, localICECandidates: {},
socket: io(), socket: io(),
@ -40,7 +41,7 @@ var VideoChat = {
peerConnections: new Map(), peerConnections: new Map(),
recognition: undefined, recognition: undefined,
borderColor: undefined, borderColor: undefined,
peerColors: {}, peerColors: new Map(),
// Call to getUserMedia (provided by adapter.js for cross browser compatibility) // Call to getUserMedia (provided by adapter.js for cross browser compatibility)
// asking for access to both the video and audio streams. If the request is // asking for access to both the video and audio streams. If the request is
@ -175,6 +176,8 @@ var VideoChat = {
recieveCaptions(cleanedMessage); recieveCaptions(cleanedMessage);
} else if (dataType === "tog:") { } else if (dataType === "tog:") {
toggleSendCaptions(); toggleSendCaptions();
} else if (dataType === "clr:") {
setStreamColor(uuid, cleanedMessage);
} }
}; };
// Called when dataChannel is successfully opened // Called when dataChannel is successfully opened
@ -861,15 +864,28 @@ function uuidToColor(uuid) {
var hash = 0; var hash = 0;
for (var i = 0; i < uuid.length; i++) { for (var i = 0; i < uuid.length; i++) {
hash = uuid.charCodeAt(i) + ((hash << 5) - hash); hash = uuid.charCodeAt(i) + ((hash << 5) - hash);
hash &= hash; // Convert to 32bit integer hash = hash & hash;
} }
return `hsl(${hash % 360},100%,40%)`; var hue = Math.abs(hash % 360);
console.log(hue);
// Ensure color is not similar to other colors
var availColors = Array.from({length: 18}, (x,i) => i*20);
VideoChat.peerColors.forEach(function(value, key, map) {availColors[Math.floor(value/20)] = null});
if (availColors[Math.floor(hue/20)] == null) {
for (var i = 0; i < availColors.length; i++) {
if (availColors[i] != null) {
hue = (hue % 20) + availColors[i];
availColors[i] = null;
break;
}
}
}
return `hsl(${hue},100%,70%)`;
} }
// Sets the border color of uuid's stream // Sets the border color of uuid's stream
function setStreamColor(uuid) { function setStreamColor(uuid) {
const color = uuidToColor(uuid); const color = uuidToColor(uuid);
console.log(color);
document.querySelectorAll(`[uuid="${uuid}"]`)[0].style.border = `3px solid ${color}`; document.querySelectorAll(`[uuid="${uuid}"]`)[0].style.border = `3px solid ${color}`;
VideoChat.peerColors[uuid] = color; VideoChat.peerColors[uuid] = color;
} }