1737 lines
116 KiB
Vue
1737 lines
116 KiB
Vue
<script setup>
|
|
import axios from '@axios';
|
|
import Cropper from 'cropperjs';
|
|
import 'cropperjs/dist/cropper.css';
|
|
import {
|
|
LocalParticipant,
|
|
Room,
|
|
RoomEvent,
|
|
Track,
|
|
VideoPresets,
|
|
facingModeFromLocalTrack
|
|
} from 'livekit-client';
|
|
import { defineEmits, defineProps, nextTick, onBeforeMount, onMounted, onUnmounted, ref } from 'vue';
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
import { useStore } from 'vuex';
|
|
const store = useStore()
|
|
const router = useRouter()
|
|
const route = useRoute()
|
|
const props = defineProps({
|
|
token: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
recording: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
call_type: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
})
|
|
const emit = defineEmits([
|
|
'update:token',
|
|
'update:transcriptData'
|
|
])
|
|
const agentName = ref(null);
|
|
const patientName = ref(null);
|
|
const patientGender = ref(null);
|
|
const patientAge = ref(null);
|
|
const large_video = ref(null)
|
|
const imageSrc = ref('');
|
|
const cropping = ref(false);
|
|
let cropper = null;
|
|
let imageBlob = null;
|
|
const imageSaved = ref(false)
|
|
const image = ref(null);
|
|
const canvas = ref(null);
|
|
const canvasPopup = ref(false)
|
|
const addingToNote = ref(false)
|
|
const note = ref(null)
|
|
// Assuming you have a way to track participant states
|
|
const participantStates = new Map();
|
|
const signalStrength = ref(3); // Initial signal strength (5 bars)
|
|
const signals = ref(0);
|
|
const participantSignals = ref(); // Array representing the signal bars
|
|
// Simulating signal strength changes (you can replace this with your actual signal strength logic)
|
|
let intervalId;
|
|
const isLoadingVisible = ref(false)
|
|
let room = null
|
|
let reconnectionTimer = null;
|
|
const url = "wss://plugnmeet.codelfi.com"
|
|
const userReconnectedPopup = ref(false)
|
|
const userReconnecting = ref(false)
|
|
const participants = ref([])
|
|
const cameras = ref([])
|
|
const cameraDefault = ref()
|
|
const microphones = ref([])
|
|
const microphoneDefault = ref()
|
|
const speakers = ref([])
|
|
const speakerDefault = ref()
|
|
const callStart = ref(false)
|
|
const userRole = localStorage.getItem('user_role'); // Fetch user role from local storage
|
|
const isPatient = computed(() => userRole.toLowerCase() === 'patient');
|
|
const isAgent = computed(() => userRole.toLowerCase() === 'agent');
|
|
const recording = ref(false)
|
|
const recordVid = ref(true)
|
|
const isMobile = ref(window.innerWidth <= 768);
|
|
const transcriptData = ref('')
|
|
const patientMuted = ref(false)
|
|
const patientCamDisabled = ref(false)
|
|
let rtCon = null
|
|
const appointmentId = localStorage.getItem('patient_appiontment_id')
|
|
const strData = JSON.stringify({ some: "data" })
|
|
const encoder = new TextEncoder()
|
|
const decoder = new TextDecoder()
|
|
const patientId = ref(localStorage.getItem('patient_id'))
|
|
const agentId = ref(localStorage.getItem('agent_id'))
|
|
const token = ref(localStorage.getItem('agent_meeting_id'))
|
|
const screenHeight = ref(window.innerHeight);
|
|
const callSectionHeight = ref(0);
|
|
const fullscreenDiv = ref(null);
|
|
const isFullscreen = ref(false);
|
|
const sideBarOpen = ref(true);
|
|
const signalIconColor = computed(() => {
|
|
if (signals.value == 3) return 'green';
|
|
if (signals.value == 2) return 'yellow';
|
|
if (signals.value == 1) return 'red';
|
|
if (signals.value == 0) return 'red';
|
|
|
|
});
|
|
const participantSignalIconColor = computed(() => {
|
|
if (participantSignals.value == 3) return 'green';
|
|
if (participantSignals.value == 2) return 'yellow';
|
|
if (participantSignals.value == 1) return 'red';
|
|
if (participantSignals.value == 0) return 'red';
|
|
|
|
});
|
|
|
|
const isMuted = ref(false);
|
|
const isCamDisabled = ref(false);
|
|
|
|
|
|
const sideIcon = computed(() => {
|
|
return sideBarOpen.value ? 'mdi-chevron-left' : 'mdi-menu';
|
|
});
|
|
const screenIcon = computed(() => {
|
|
return isFullscreen.value ? 'mdi-fullscreen-exit' : 'mdi-fullscreen';
|
|
});
|
|
const muteIcon = computed(() => {
|
|
return isMuted.value ? 'mdi-microphone-off' : 'mdi-microphone';
|
|
});
|
|
const camIcon = computed(() => {
|
|
return isCamDisabled.value ? 'mdi-video-off' : 'mdi-video';
|
|
});
|
|
|
|
const sideIconColor = computed(() => {
|
|
return sideBarOpen.value ? 'red' : 'white';
|
|
});
|
|
const screenIconColor = computed(() => {
|
|
return isFullscreen.value ? 'red' : 'white';
|
|
});
|
|
const muteIconColor = computed(() => {
|
|
return isMuted.value ? 'red' : 'white';
|
|
});
|
|
const camIconColor = computed(() => {
|
|
return isCamDisabled.value ? 'red' : 'white';
|
|
});
|
|
|
|
// Message Box Start
|
|
const isOpen = ref(false);
|
|
const messages = ref([]);
|
|
const newMessage = ref('');
|
|
const bottomOffset = ref(20);
|
|
const showMessage = ref(true)
|
|
const toggleChat = () => {
|
|
isOpen.value = !isOpen.value;
|
|
};
|
|
|
|
const sendMessage = () => {
|
|
if (newMessage.value.trim() !== '') {
|
|
messages.value.push({
|
|
id: messages.value.length + 1,
|
|
text: newMessage.value.trim(),
|
|
sender: 'doctor', // Assuming the user is sending the message
|
|
timestamp: Date.now()
|
|
});
|
|
newMessage.value = '';
|
|
// Scroll to the last message
|
|
const messageContainer = document.querySelector('.message-container');
|
|
messageContainer.scrollTop = messageContainer.scrollHeight;
|
|
}
|
|
};
|
|
|
|
const adjustBottomOffset = () => {
|
|
if (showMessage.value) {
|
|
const windowHeight = window.innerHeight;
|
|
const chatboxHeight = document.querySelector('.chatbox');
|
|
if (chatboxHeight)
|
|
bottomOffset.value = windowHeight - chatboxHeight.offsetHeight - 20;
|
|
}
|
|
|
|
};
|
|
|
|
const updateScreenHeight = () => {
|
|
screenHeight.value = window.innerHeight;
|
|
};
|
|
|
|
const checkMobile = () => {
|
|
isMobile.value = window.innerWidth <= 768; // Adjust the breakpoint as needed
|
|
const navbar = document.querySelector('.layout-navbar');
|
|
|
|
if (navbar) {
|
|
if (!isMobile.value) {
|
|
navbar.style.display = 'none';
|
|
} else {
|
|
navbar.style.display = 'block';
|
|
}
|
|
}
|
|
if (isMobile.value == true)
|
|
showMessage.value = false
|
|
else
|
|
showMessage.value = true
|
|
|
|
|
|
};
|
|
const showMessageBox = () => {
|
|
showMessage.value = true
|
|
isOpen.value = true
|
|
}
|
|
const hideMessageBox = () => {
|
|
showMessage.value = false
|
|
isOpen.value = false
|
|
}
|
|
onBeforeMount(() => {
|
|
|
|
|
|
})
|
|
onMounted(async () => {
|
|
// intervalId = setInterval(() => {
|
|
// signalStrength.value = Math.floor(Math.random() * 6); // Random signal strength between 0 and 5
|
|
// }, 2000);
|
|
// if (isAgent.value) {
|
|
// await patientDetails()
|
|
// }
|
|
if (isAgent.value) {
|
|
await axios.post('/agent/api/agent-profile', {
|
|
headers: {
|
|
'Authorization': `Bearer ${localStorage.getItem('access_token')}`,
|
|
}
|
|
})
|
|
.then(response => {
|
|
console.log('ResponseTest:', response.data);
|
|
if (response.data) {
|
|
let patientData = response.data.ai_switch;
|
|
agentName.value = patientData.name;
|
|
console.log("agentName", agentName.value);
|
|
} else {
|
|
isLoadingVisible.value = false;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
});
|
|
}
|
|
|
|
if (isAgent.value) { localStorage.setItem('call_started', false) }
|
|
const navbar = document.querySelector('.layout-navbar');
|
|
const callDiv = document.querySelector('.layout-page-content');
|
|
const footer = document.querySelector('.layout-footer');
|
|
|
|
if (navbar) {
|
|
if (!isMobile.value) {
|
|
navbar.style.display = 'none';
|
|
} else {
|
|
navbar.style.display = 'block';
|
|
}
|
|
}
|
|
if (callDiv)
|
|
callDiv.style.padding = '0px';
|
|
if (footer)
|
|
footer.style.display = 'none';
|
|
window.addEventListener('resize', checkMobile);
|
|
document.addEventListener('mousemove', handleMouseMove)
|
|
window.addEventListener('resize', updateScreenHeight);
|
|
window.addEventListener('resize', adjustBottomOffset);
|
|
adjustBottomOffset();
|
|
connect();
|
|
if (isAgent.value) { localStorage.setItem('call_started', true) }
|
|
|
|
// if (userType.value == 'agent')
|
|
// getAppointmentDetails();
|
|
if (isMobile.value == true)
|
|
showMessage.value = false
|
|
else
|
|
showMessage.value = true
|
|
|
|
// callSectionHeight.value = document.querySelector('.layout-page-content').clientHeight;
|
|
// console.log('Call Section height:', callSectionHeight.value);
|
|
document.addEventListener('fullscreenchange', exitFullscreen);
|
|
// document.addEventListener('webkitfullscreenchange', toggleFullscreen);
|
|
// document.addEventListener('mozfullscreenchange', toggleFullscreen);
|
|
// document.addEventListener('MSFullscreenChange', toggleFullscreen);
|
|
// document.addEventListener('keydown', (event) => {
|
|
// console.log('esc',event.keyCode)
|
|
// if (event.keyCode === 27) {
|
|
// event.preventDefault(); // Check if the pressed key is ESC (key code 27)
|
|
// toggleFullscreen();
|
|
// }
|
|
// });
|
|
});
|
|
onUnmounted(async () => {
|
|
// room.disconnect();
|
|
clearReconnectionTimer();
|
|
clearInterval(intervalId);
|
|
const navbar = document.querySelector('.layout-navbar');
|
|
const callDiv = document.querySelector('.layout-page-content');
|
|
const footer = document.querySelector('.layout-footer');
|
|
if (navbar)
|
|
navbar.style.display = 'block';
|
|
if (callDiv)
|
|
callDiv.style.padding = '1.5rem';
|
|
if (footer)
|
|
footer.style.display = 'block';
|
|
window.removeEventListener('resize', checkMobile);
|
|
document.removeEventListener('mousemove', handleMouseMove)
|
|
window.removeEventListener('resize', adjustBottomOffset);
|
|
document.removeEventListener('fullscreenchange', exitFullscreen);
|
|
});
|
|
const patientDetails = async () => {
|
|
isLoadingVisible.value = true;
|
|
|
|
await axios.post('/agent/api/patient-profile-details/' + patientId.value, {
|
|
headers: {
|
|
'Authorization': `Bearer ${localStorage.getItem('access_token')}`,
|
|
}
|
|
})
|
|
.then(response => {
|
|
console.log('Patient details:', response.data.patient);
|
|
patientName.value = response.data.patient.first_name + ' ' + response.data.patient.last_name
|
|
patientGender.value = response.data.patient.gender
|
|
patientAge.value = calculateAge(response.data.patient.dob)
|
|
isLoadingVisible.value = false;
|
|
})
|
|
.catch(error => {
|
|
isLoadingVisible.value = false;
|
|
console.error('Error:', error);
|
|
});
|
|
};
|
|
|
|
const x = ref(0)
|
|
const y = ref(10)
|
|
const dragging = ref(false)
|
|
|
|
const rect = ref(null)
|
|
|
|
const style = computed(() => {
|
|
return {
|
|
transform: `translate(${x.value}px, ${y.value}px)`
|
|
}
|
|
})
|
|
|
|
|
|
const handleMouseDown = e => {
|
|
rect.value = e.currentTarget.getBoundingClientRect()
|
|
dragging.value = true
|
|
}
|
|
|
|
const handleMouseMove = e => {
|
|
if (!dragging.value) return
|
|
x.value = Math.min(Math.max(0, e.clientX - rect.value.left), window.innerWidth - rect.value.width) - 25
|
|
y.value = Math.min(Math.max(0, e.clientY - rect.value.top), window.innerHeight - rect.value.height) - 25
|
|
}
|
|
|
|
const handleReconnection = () => {
|
|
// Clear existing timer if any
|
|
clearReconnectionTimer();
|
|
|
|
// Set a new timer
|
|
reconnectionTimer = setTimeout(() => {
|
|
// Code to notify other participants
|
|
notifyParticipants();
|
|
}, 10000); // 50 seconds
|
|
}
|
|
|
|
const clearReconnectionTimer = () => {
|
|
if (reconnectionTimer) {
|
|
clearTimeout(reconnectionTimer);
|
|
reconnectionTimer = null;
|
|
}
|
|
}
|
|
|
|
const notifyParticipants = () => {
|
|
userReconnectedPopup.value = true
|
|
// Emit an event or call a method to show a popup to other participants
|
|
console.log('User has not reconnected after 50 seconds');
|
|
// This could be an event bus, state management dispatch, or direct UI manipulation
|
|
}
|
|
|
|
const connect = async () => {
|
|
isLoadingVisible.value = true
|
|
room = new Room({
|
|
// automatically manage subscribed video quality
|
|
adaptiveStream: true,
|
|
|
|
dynacast: true,
|
|
// default capture settings
|
|
videoCaptureDefaults: {
|
|
resolution: VideoPresets.h720.resolution,
|
|
},
|
|
publishDefaults: {
|
|
videoCodec: 'vp9',
|
|
},
|
|
disconnectOnPageLeave: false,
|
|
reconnectPolicy: {
|
|
nextRetryDelayInMs: (context) => {
|
|
let retryCount = context.retryCount
|
|
if (retryCount > 20) {
|
|
return null
|
|
}
|
|
return context.retryCount * 300;
|
|
},
|
|
// maxAttempts: 18, // 18 attempts
|
|
// initialDelay: 10000, // 10 seconds
|
|
// maxDelay: 30000, // 10 seconds
|
|
// jitter: 1000, // 1-second jitter
|
|
}
|
|
});
|
|
|
|
// pre-warm connection, this can be called as early as your page is loaded
|
|
room.prepareConnection(url, props.token);
|
|
console.log(props.token)
|
|
|
|
// set up event listeners
|
|
room
|
|
.on(RoomEvent.TrackSubscribed, (track, publication, participant) => renderParticipant(participant))
|
|
.on(RoomEvent.TrackUnsubscribed, (track, publication, participant) => renderParticipant(participant, true))
|
|
// .on(RoomEvent.ActiveSpeakersChanged, (speakers) => console.log("handleTrackSubscribed"))
|
|
.on(RoomEvent.Disconnected, () => {
|
|
console.log('>>Disconnected<<')
|
|
renderParticipant(room.localParticipant, true)
|
|
room.participants.forEach((p) => {
|
|
renderParticipant(p, true);
|
|
})
|
|
room = null
|
|
})
|
|
.on(RoomEvent.Reconnecting, () => {
|
|
console.log('Reconnecting to room')
|
|
clearReconnectionTimer();
|
|
userReconnecting.value = true
|
|
})
|
|
.on(RoomEvent.Reconnected, async (participant) => {
|
|
console.log('---Participant Reconnected---', participant)
|
|
clearReconnectionTimer();
|
|
userReconnecting.value = false
|
|
if (!participant.isLocal) {
|
|
userReconnectedPopup.value = false
|
|
}
|
|
console.log(
|
|
'Successfully reconnected. server',
|
|
await room.engine.getConnectedServerAddress(),
|
|
participant
|
|
);
|
|
participant.on('trackMuted', publication => {
|
|
if (publication.kind === 'video') {
|
|
patientCamDisabled.value = true
|
|
}
|
|
if (publication.kind === 'audio') {
|
|
patientMuted.value = true
|
|
}
|
|
console.log(`Track muted: ${publication.trackSid}`, publication);
|
|
});
|
|
|
|
participant.on('trackUnmuted', publication => {
|
|
if (publication.kind === 'video') {
|
|
patientCamDisabled.value = false
|
|
}
|
|
if (publication.kind === 'audio') {
|
|
patientMuted.value = false
|
|
}
|
|
console.log(`Track unmuted: ${publication.trackSid}`, publication);
|
|
});
|
|
})
|
|
.on(RoomEvent.ParticipantConnected, async (participant) => {
|
|
console.log('ParticipantConnected', participant)
|
|
callStart.value = true
|
|
participant.on('trackMuted', publication => {
|
|
if (publication.kind === 'video') {
|
|
patientCamDisabled.value = true
|
|
}
|
|
if (publication.kind === 'audio') {
|
|
patientMuted.value = true
|
|
}
|
|
console.log(`Track muted: ${publication.trackSid}`, publication);
|
|
});
|
|
|
|
participant.on('trackUnmuted', publication => {
|
|
if (publication.kind === 'video') {
|
|
patientCamDisabled.value = false
|
|
}
|
|
if (publication.kind === 'audio') {
|
|
patientMuted.value = false
|
|
}
|
|
console.log(`Track unmuted: ${publication.trackSid}`, publication);
|
|
});
|
|
|
|
})
|
|
.on(RoomEvent.DataReceived, async (payload, participant, kind) => {
|
|
const strData = decoder.decode(payload)
|
|
transcriptData.value = strData
|
|
emit('update:transcriptData', transcriptData.value);
|
|
console.log('strData', strData)
|
|
})
|
|
.on(RoomEvent.ParticipantDisconnected, (participant) => {
|
|
clearReconnectionTimer();
|
|
renderParticipant(participant, true);
|
|
console.log('part length ', room.participants.size, room, participant, participant._connectionQuality)
|
|
|
|
if (participant.isLocal) {
|
|
userReconnecting.value = true
|
|
} else {
|
|
// Check if the remote participant's connection quality is poor or unknown
|
|
if (participant._connectionQuality === 'poor' || participant._connectionQuality === 'unknown' || participant._connectionQuality === 'lost') {
|
|
userReconnectedPopup.value = true
|
|
}
|
|
}
|
|
if (!userReconnectedPopup.value) {
|
|
console.log('>>>Disconnected Here')
|
|
setTimeout(async () => {
|
|
if (room.participants.size == 0) {
|
|
isLoadingVisible.value = true
|
|
console.log('disconnect')
|
|
room.disconnect();
|
|
callStart.value = false
|
|
|
|
if (isAgent.value) {
|
|
if (!sideBarOpen.value) { toggleSideBar(); }
|
|
await axios.post('/agent/api/end-call/' + patientId.value + '/' + localStorage.getItem('patient_appiontment_id'))
|
|
.then(response => {
|
|
console.log('call end', response.data.message)
|
|
})
|
|
.catch(error => {
|
|
console.error('error end call ', error);
|
|
});
|
|
store.dispatch('updateCurrentPage', '/provider/patient-profile')
|
|
store.dispatch('updateFloatingWindow', false)
|
|
store.dispatch('updateCallStarted', false)
|
|
localStorage.removeItem('getCurrentPatient');
|
|
router.push('/provider/patient-profile');
|
|
}
|
|
localStorage.setItem('call_started', true)
|
|
|
|
if (isPatient.value) {
|
|
localStorage.setItem('call-end-message', 'Password Sent to Email Address')
|
|
store.dispatch('updateCurrentPage', '/overview')
|
|
window.close();
|
|
router.push('/overview');
|
|
}
|
|
isLoadingVisible.value = false
|
|
}
|
|
|
|
}, 3000)
|
|
}
|
|
|
|
|
|
})
|
|
.on(RoomEvent.MediaDevicesChanged, async () => {
|
|
console.log('device changed')
|
|
})
|
|
.on(RoomEvent.LocalTrackUnpublished, () => renderParticipant(room.localParticipant))
|
|
.on(RoomEvent.LocalTrackPublished, () => renderParticipant(room.localParticipant))
|
|
.on(RoomEvent.ConnectionQualityChanged, (participant, quality) => {
|
|
console.log('Signal Changed', room.localParticipant.connectionQuality, quality._connectionQuality)
|
|
if (quality._connectionQuality == 'excellent') {
|
|
participantSignals.value = 3
|
|
} else if (quality._connectionQuality == 'good') {
|
|
participantSignals.value = 2
|
|
} else if (quality._connectionQuality == 'poor') {
|
|
participantSignals.value = 1
|
|
} else if (quality._connectionQuality == 'unknown') {
|
|
participantSignals.value = 0
|
|
} else {
|
|
participantSignals.value = 0
|
|
}
|
|
if (room.localParticipant.connectionQuality == 'excellent') {
|
|
signals.value = 3
|
|
} else if (room.localParticipant.connectionQuality == 'good') {
|
|
signals.value = 2
|
|
} else if (room.localParticipant.connectionQuality == 'poor') {
|
|
signals.value = 1
|
|
} else if (room.localParticipant.connectionQuality == 'unknown') {
|
|
signals.value = 1
|
|
} else {
|
|
signals.value = 0
|
|
}
|
|
console.log('Signal Changed value', signals.value)
|
|
});
|
|
|
|
// connect to room
|
|
await room.connect(url, props.token);
|
|
|
|
// get transceivers from local participant's tracks
|
|
// const transceivers = [];
|
|
// room.localParticipant.tracks.forEach(track => {
|
|
// if (track.transceiver) {
|
|
// transceivers.push(track.transceiver);
|
|
// }
|
|
// });
|
|
|
|
// // set preferred codecs for each transceiver
|
|
// transceivers.forEach((transceiver) => {
|
|
// if (transceiver.codec) {
|
|
// const preferredCodecs = ['VP8', 'H264', 'VP9', 'AV1']; // or any other supported codecs
|
|
// transceiver.setCodecPreferences(preferredCodecs);
|
|
// }
|
|
// });
|
|
console.log("connected to room", room.name);
|
|
console.log("Signal", room.localParticipant.connectionQuality)
|
|
if (room.localParticipant.connectionQuality == 'excellent') {
|
|
signals.value = 3
|
|
} else if (room.localParticipant.connectionQuality == 'good') {
|
|
signals.value = 2
|
|
} else if (room.localParticipant.connectionQuality == 'poor') {
|
|
signals.value = 1
|
|
} else if (room.localParticipant.connectionQuality == 'unknown') {
|
|
signals.value = 1
|
|
} else {
|
|
signals.value = 0
|
|
}
|
|
console.log('props.call_type----', props.call_type)
|
|
// publish local camera and mic tracks
|
|
if (props.call_type === 'audio') {
|
|
|
|
await room.localParticipant.setCameraEnabled(false);
|
|
await room.localParticipant.setMicrophoneEnabled(true);
|
|
isCamDisabled.value = true
|
|
}
|
|
|
|
if (props.call_type === 'video') {
|
|
await room.localParticipant.enableCameraAndMicrophone();
|
|
}
|
|
|
|
|
|
callStart.value = true
|
|
// connectSpeach();
|
|
|
|
if (props.recording == true) {
|
|
|
|
await axios.post('/agent/api/start-record/' + localStorage.getItem('patient_appiontment_id'))
|
|
.then(response => {
|
|
console.log('start rec', response.data.message)
|
|
if (response.data.message == 'Success')
|
|
recording.value = response.data.message
|
|
|
|
});
|
|
|
|
}
|
|
room.participants.forEach((participant) => {
|
|
renderParticipant(participant);
|
|
});
|
|
renderParticipant(room.localParticipant);
|
|
window.room = room;
|
|
const videoDevices = await Room.getLocalDevices('videoinput');
|
|
const audioDevices = await Room.getLocalDevices('audioinput');
|
|
const audioOutputs = await Room.getLocalDevices('audiooutput');
|
|
callStart.value = true
|
|
let selectedVideoDevice = videoDevices[0];
|
|
let selectedMicDevice = audioDevices[0];
|
|
let selectedSpeakerDevice = audioOutputs[0];
|
|
|
|
cameras.value = videoDevices;
|
|
microphones.value = audioDevices;
|
|
speakers.value = audioOutputs;
|
|
|
|
console.log('camera ', cameras.value)
|
|
console.log('mic ', microphones.value)
|
|
console.log('speaker ', speakers.value)
|
|
// console.log('Devices ', videoDevices, audioDevices, audioOutputs)
|
|
// if (videoDevices.length > 0) {
|
|
// for (const videoDevice of videoDevices) {
|
|
|
|
// if (videoDevice.deviceId == 'default') {
|
|
// selectedVideoDevice = videoDevice
|
|
// break;
|
|
// }
|
|
// }
|
|
// cameraDefault.value = selectedVideoDevice.deviceId
|
|
// console.log('default video', cameraDefault.value)
|
|
|
|
// await room.switchActiveDevice('videoinput', cameraDefault.value);
|
|
// }
|
|
if (audioDevices.length > 0) {
|
|
for (const audioDevice of audioDevices) {
|
|
|
|
if (audioDevice.deviceId == 'default') {
|
|
selectedMicDevice = audioDevice
|
|
break;
|
|
}
|
|
}
|
|
microphoneDefault.value = selectedMicDevice.deviceId
|
|
console.log('default mic', microphoneDefault.value)
|
|
await room.switchActiveDevice('audioinput', microphoneDefault.value);
|
|
}
|
|
if (audioOutputs.length > 0) {
|
|
for (const audioOutput of audioOutputs) {
|
|
|
|
if (audioOutput.deviceId == 'default') {
|
|
selectedSpeakerDevice = audioOutput
|
|
break;
|
|
}
|
|
}
|
|
speakerDefault.value = selectedSpeakerDevice.deviceId
|
|
console.log('default audio', speakerDefault.value)
|
|
try {
|
|
await room.switchActiveDevice('audiooutput', speakerDefault.value);
|
|
} catch (e) {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
isLoadingVisible.value = false
|
|
return room;
|
|
}
|
|
|
|
const getActiveCamDevice = () => {
|
|
return room.getActiveDevice("videoinput")
|
|
};
|
|
|
|
const getActiveMicDevice = () => {
|
|
return room.getActiveDevice("audioinput")
|
|
};
|
|
|
|
const getActiveSpeakerDevice = () => {
|
|
return room.getActiveDevice("audiooutput")
|
|
};
|
|
|
|
const renderParticipant = async (participant, remove = false) => {
|
|
|
|
let _participant = participants.value.find(part => part.id == participant.identity)
|
|
console.log('----Participant----', _participant)
|
|
if (!_participant) {
|
|
_participant = {
|
|
id: participant.identity,
|
|
type: (participant instanceof LocalParticipant) ? "local" : "remote",
|
|
video: null,
|
|
audio: null,
|
|
};
|
|
participants.value.push(_participant)
|
|
|
|
}
|
|
if (_participant.type == 'remote') {
|
|
|
|
participant.on('trackMuted', publication => {
|
|
if (publication.kind === 'video') {
|
|
patientCamDisabled.value = true
|
|
}
|
|
if (publication.kind === 'audio') {
|
|
patientMuted.value = true
|
|
}
|
|
console.log(`Track muted: ${publication.trackSid}`, publication);
|
|
});
|
|
|
|
participant.on('trackUnmuted', publication => {
|
|
if (publication.kind === 'video') {
|
|
patientCamDisabled.value = false
|
|
}
|
|
if (publication.kind === 'audio') {
|
|
patientMuted.value = false
|
|
}
|
|
console.log(`Track unmuted: ${publication.trackSid}`, publication);
|
|
});
|
|
}
|
|
|
|
if (remove) {
|
|
participants.value.splice(participants.value.indexOf(_participant), 1)
|
|
return;
|
|
}
|
|
|
|
const cameraPub = participant.getTrack(Track.Source.Camera);
|
|
const micPub = participant.getTrack(Track.Source.Microphone);
|
|
|
|
await nextTick()
|
|
// if ((participant instanceof LocalParticipant) && micPub?.track.getProcessor()?.name != "local-processor") {
|
|
// micPub.track.setProcessor(localProcessor);
|
|
// }
|
|
// if (micPub?.getProcessor()?.name != "remote-processor" && !(participant instanceof LocalParticipant)) {
|
|
// micPub.setProcessor(remoteProcessor);
|
|
// }
|
|
if (cameraPub && cameraPub.isSubscribed && !cameraPub.isMuted && participant instanceof LocalParticipant) {
|
|
console.log('Local camera publication:', cameraPub);
|
|
}
|
|
window.r = room
|
|
_participant.video = document.getElementById("video-" + _participant.id)
|
|
_participant.audio = document.getElementById("audio-" + _participant.id)
|
|
console.log('video ', _participant.video)
|
|
|
|
|
|
|
|
|
|
const cameraEnabled = cameraPub && cameraPub.isSubscribed && !cameraPub.isMuted;
|
|
if (cameraEnabled) {
|
|
|
|
cameraPub?.videoTrack?.attach(_participant.video);
|
|
} else {
|
|
if (cameraPub?.videoTrack) {
|
|
// detach manually whenever possible
|
|
cameraPub.videoTrack?.detach(_participant.video);
|
|
} else if (_participant.video) {
|
|
|
|
_participant.video.src = '';
|
|
_participant.video.srcObject = null;
|
|
}
|
|
}
|
|
|
|
|
|
const micEnabled = micPub && micPub.isSubscribed && !micPub.isMuted;
|
|
if (micEnabled) {
|
|
if (!(participant instanceof LocalParticipant)) {
|
|
|
|
|
|
|
|
if (!rtCon) {
|
|
micPub?.audioTrack?.attach(_participant.audio);
|
|
|
|
console.log('audioTrack', _participant.audio)
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
const endCall = async () => {
|
|
isLoadingVisible.value = true
|
|
if (room) room.disconnect()
|
|
callStart.value = false
|
|
if (isAgent.value) {
|
|
if (!sideBarOpen.value) { toggleSideBar(); }
|
|
await axios.post('/agent/api/end-call/' + patientId.value + '/' + localStorage.getItem('patient_appiontment_id'))
|
|
.then(response => {
|
|
console.log('call end', response.data.message)
|
|
})
|
|
.catch(error => {
|
|
console.error('error end call ', error);
|
|
});
|
|
localStorage.setItem('call_started', false)
|
|
localStorage.removeItem('getCurrentPatient');
|
|
store.dispatch('updateFloatingWindow', false)
|
|
store.dispatch('updateCallStarted', false)
|
|
store.dispatch('updateCurrentPage', '/provider/patient-profile')
|
|
router.push('/provider/patient-profile');
|
|
}
|
|
|
|
|
|
if (isPatient.value) {
|
|
localStorage.setItem('call-end-message', 'Password Sent to Email Address')
|
|
store.dispatch('updateCurrentPage', '/overview')
|
|
window.close();
|
|
router.push('/overview');
|
|
}
|
|
isLoadingVisible.value = false
|
|
}
|
|
|
|
const getAppointmentDetails = async () => {
|
|
axios.post('/agent/api/appointment-detail/' + appointmentId)
|
|
.then(r => {
|
|
let appointmentAnalytics = r.data.agent_appointment.analytics
|
|
transcriptData.value = appointmentAnalytics
|
|
console.log('appointmentAnalytics ', transcriptData.value)
|
|
emit('update:transcriptData', transcriptData.value);
|
|
}).catch(error => {
|
|
console.log("Error", error);
|
|
});
|
|
|
|
}
|
|
|
|
|
|
const flipCamera = () => {
|
|
const videoPub = room?.localParticipant.getTrack(Track.Source.Camera);
|
|
console.log('videoPub', videoPub)
|
|
if (!videoPub) {
|
|
return;
|
|
}
|
|
const track = videoPub.track;
|
|
const facingMode = track && facingModeFromLocalTrack(track);
|
|
|
|
const options = {
|
|
resolution: VideoPresets.h720.resolution,
|
|
facingMode: facingMode?.facingMode === 'environment' ? 'user' : 'environment',
|
|
}
|
|
console.log('options', options)
|
|
videoPub.videoTrack?.restartTrack(options)
|
|
|
|
};
|
|
|
|
const selectCamera = async (deviceId) => {
|
|
await room.switchActiveDevice('videoinput', deviceId);
|
|
// cameraDefault.value = deviceId
|
|
console.log('camera selected ', deviceId);
|
|
}
|
|
|
|
const selectMicrophone = async (deviceId) => {
|
|
await room.switchActiveDevice('audioinput', deviceId);
|
|
microphoneDefault.value = deviceId
|
|
console.log('mic selected ', deviceId);
|
|
}
|
|
|
|
const selectSpeaker = async (deviceId) => {
|
|
await room.switchActiveDevice('audiooutput', deviceId);
|
|
speakerDefault.value = deviceId
|
|
console.log('speaker selected ', deviceId);
|
|
};
|
|
|
|
const muteMicrophone = async () => {
|
|
const checkMuted = !room.localParticipant.isMicrophoneEnabled;
|
|
|
|
if (checkMuted) {
|
|
await room.localParticipant.setMicrophoneEnabled(true);
|
|
} else {
|
|
await room.localParticipant.setMicrophoneEnabled(false);
|
|
}
|
|
isMuted.value = !isMuted.value;
|
|
console.log(`Local participant is ${checkMuted ? 'muted' : 'unmuted'}`, isMuted, room.localParticipant);
|
|
};
|
|
const cameraToggle = async () => {
|
|
const checkCam = !room.localParticipant.isCameraEnabled;
|
|
|
|
if (checkCam) {
|
|
await room.localParticipant.setCameraEnabled(true);
|
|
} else {
|
|
await room.localParticipant.setCameraEnabled(false);
|
|
}
|
|
isCamDisabled.value = !isCamDisabled.value;
|
|
console.log(`Local participant is ${checkCam ? 'muted' : 'unmuted'}`, isCamDisabled, room.localParticipant);
|
|
}
|
|
|
|
const toggleFullscreen = () => {
|
|
// callSectionHeight.value = 0
|
|
const elem = document.body;
|
|
if (!document.fullscreenElement) {
|
|
// If the document is not currently in fullscreen mode
|
|
if (elem.requestFullscreen) {
|
|
elem.requestFullscreen();
|
|
} else if (elem.webkitRequestFullscreen) { /* Safari */
|
|
elem.webkitRequestFullscreen();
|
|
} else if (elem.msRequestFullscreen) { /* IE11 */
|
|
elem.msRequestFullscreen();
|
|
}
|
|
} else {
|
|
// If the document is currently in fullscreen mode
|
|
if (document.exitFullscreen) {
|
|
document.exitFullscreen();
|
|
} else if (document.webkitExitFullscreen) { /* Safari */
|
|
document.webkitExitFullscreen();
|
|
} else if (document.msExitFullscreen) { /* IE11 */
|
|
document.msExitFullscreen();
|
|
}
|
|
}
|
|
isFullscreen.value = !isFullscreen.value
|
|
};
|
|
|
|
const exitFullscreen = () => {
|
|
callSectionHeight.value = 0
|
|
const elem = document.body;
|
|
|
|
|
|
// if (!document.fullscreenElement) {
|
|
// // If the document is not currently in fullscreen mode
|
|
// if (elem.requestFullscreen) {
|
|
// elem.requestFullscreen();
|
|
// } else if (elem.webkitRequestFullscreen) { /* Safari */
|
|
// elem.webkitRequestFullscreen();
|
|
// } else if (elem.msRequestFullscreen) { /* IE11 */
|
|
// elem.msRequestFullscreen();
|
|
// }
|
|
// } else {
|
|
// // If the document is currently in fullscreen mode
|
|
// if (document.exitFullscreen) {
|
|
// document.exitFullscreen();
|
|
// } else if (document.webkitExitFullscreen) { /* Safari */
|
|
// document.webkitExitFullscreen();
|
|
// } else if (document.msExitFullscreen) { /* IE11 */
|
|
// document.msExitFullscreen();
|
|
// }
|
|
// }
|
|
|
|
|
|
|
|
// Set height after a delay
|
|
// setTimeout(() => {
|
|
// callSectionHeight.value = document.querySelector('.layout-page-content').clientHeight;
|
|
// console.log('Call Section height:', callSectionHeight.value);
|
|
// }, 500); // You can adjust the delay as needed
|
|
isFullscreen.value = !isFullscreen.value
|
|
};
|
|
|
|
const toggleSideBar = () => {
|
|
const wrapper = document.querySelector('.layout-content-wrapper');
|
|
const sideBar = document.querySelector('.layout-vertical-nav');
|
|
const callContainer = document.querySelector('.draggable-off');
|
|
if (!sideBarOpen.value) {
|
|
sideBarOpen.value = true;
|
|
if (sideBar)
|
|
sideBar.style.display = 'block';
|
|
if (wrapper)
|
|
wrapper.style.paddingInlineStart = '260px'
|
|
if (callContainer) {
|
|
callContainer.style.width = '83%'
|
|
callContainer.style.left = '260px'
|
|
}
|
|
|
|
} else {
|
|
sideBarOpen.value = false;
|
|
if (sideBar)
|
|
sideBar.style.display = 'none';
|
|
if (wrapper)
|
|
wrapper.style.paddingInlineStart = '0px'
|
|
if (callContainer) {
|
|
callContainer.style.width = '100%';
|
|
callContainer.style.left = '0px'
|
|
}
|
|
|
|
}
|
|
console.log(wrapper.style, callContainer.style.width)
|
|
|
|
};
|
|
|
|
|
|
const saveImage = async (blob) => {
|
|
const formData = new FormData();
|
|
formData.append('image', blob, 'profile.png'); // 'file' is the key expected by the server
|
|
|
|
// Use axios to send a POST request
|
|
await axios.post('/agent/api/profile-image-upload/' + patientId.value, formData, {
|
|
headers: {
|
|
'Content-Type': 'multipart/form-data'
|
|
}
|
|
})
|
|
.then(response => {
|
|
console.log('Image uploaded successfully:', response.data);
|
|
})
|
|
.catch(error => {
|
|
console.error('Error uploading image:', error);
|
|
});
|
|
};
|
|
const captureImage = async () => {
|
|
imageSrc.value = null
|
|
console.log('--------->', room)
|
|
const cameraPub = room.participants.entries().next().value[1].getTrack(Track.Source.Camera);
|
|
if (cameraPub && cameraPub.track && cameraPub.track._mediaStreamTrack) {
|
|
let image = new ImageCapture(cameraPub.track._mediaStreamTrack);
|
|
console.log('---Track Image---', image);
|
|
canvasPopup.value = true
|
|
if (image.track.enabled) {
|
|
|
|
try {
|
|
|
|
const imageBitmap = await image.grabFrame()
|
|
const canvas = document.createElement('canvas')
|
|
canvas.width = imageBitmap.width
|
|
canvas.height = imageBitmap.height
|
|
const context = canvas.getContext('2d')
|
|
context.drawImage(imageBitmap, 0, 0)
|
|
imageSrc.value = canvas.toDataURL('image/png')
|
|
canvas.toBlob(async (blob) => {
|
|
// await saveImage(blob)
|
|
imageBlob = blob
|
|
}, 'image/png');
|
|
} catch (error) {
|
|
console.error('Error capturing image:', error)
|
|
}
|
|
} else {
|
|
console.error('Video element is not ready')
|
|
}
|
|
}
|
|
};
|
|
const startCropping = () => {
|
|
if (image.value) {
|
|
cropper = new Cropper(image.value, {
|
|
aspectRatio: 1,
|
|
viewMode: 1
|
|
});
|
|
cropping.value = true;
|
|
}
|
|
};
|
|
|
|
const cropImage = () => {
|
|
if (cropper) {
|
|
cropper.getCroppedCanvas().toBlob(async (blob) => {
|
|
imageBlob = blob;
|
|
try {
|
|
const reader = new FileReader();
|
|
reader.readAsDataURL(blob);
|
|
reader.onloadend = async () => {
|
|
const base64data = reader.result.split(',')[1]; // Get base64 string without the prefix
|
|
|
|
const response = await axios.post('/agent/api/profile-image-upload/' + patientId.value, {
|
|
image: base64data,
|
|
filename: 'profile.png'
|
|
}, {
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
}
|
|
});
|
|
|
|
console.log('Upload successful', response.data);
|
|
imageSrc.value = URL.createObjectURL(blob); // Optionally update imageSrc to the local blob URL
|
|
imageSaved.value = true;
|
|
};
|
|
} catch (error) {
|
|
console.error('Upload failed:', error);
|
|
}
|
|
cropper.destroy(); // Clean up cropper instance
|
|
cropper = null;
|
|
cropping.value = false;
|
|
}, 'image/png');
|
|
|
|
}
|
|
};
|
|
const addToNotes = () => {
|
|
addingToNote.value = true
|
|
};
|
|
const saveAddToNotes = async () => {
|
|
isLoadingVisible.value = true
|
|
try {
|
|
const formData = new FormData();
|
|
formData.append('note', note.value.trim());
|
|
formData.append('note_type', 'Notes');
|
|
|
|
if (imageBlob)
|
|
formData.append('file', imageBlob, 'noteImage.png');
|
|
|
|
const response = await axios.post('/agent/api/add-note/' + patientId.value + '/' + appointmentId, formData, {
|
|
headers: {
|
|
'Content-Type': 'multipart/form-data'
|
|
}
|
|
});
|
|
note.value = null
|
|
addingToNote.value = false
|
|
isLoadingVisible.value = false
|
|
console.log('Note added successful', response.data);
|
|
} catch (error) {
|
|
isLoadingVisible.value = false
|
|
console.error('Upload failed:', error);
|
|
}
|
|
|
|
};
|
|
const calculateAge = (dob) => {
|
|
const birthDate = new Date(dob);
|
|
const today = new Date();
|
|
|
|
let years = today.getFullYear() - birthDate.getFullYear();
|
|
let months = today.getMonth() - birthDate.getMonth();
|
|
let days = today.getDate() - birthDate.getDate();
|
|
|
|
// Adjust the days and months if negative
|
|
if (days < 0) {
|
|
months -= 1;
|
|
let previousMonth = today.getMonth() - 1;
|
|
if (previousMonth < 0) {
|
|
previousMonth = 11; // December
|
|
}
|
|
const daysInPreviousMonth = new Date(today.getFullYear(), previousMonth + 1, 0).getDate();
|
|
days += daysInPreviousMonth;
|
|
}
|
|
|
|
if (months < 0) {
|
|
years -= 1;
|
|
months += 12;
|
|
}
|
|
|
|
// Return the largest unit that is non-zero
|
|
if (years > 0) {
|
|
return `${years} year${years !== 1 ? 's' : ''}`;
|
|
} else if (months > 0) {
|
|
return `${months} month${months !== 1 ? 's' : ''}`;
|
|
} else {
|
|
return `${days} day${days !== 1 ? 's' : ''}`;
|
|
}
|
|
};
|
|
|
|
// Register the navigation guard
|
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
<VDialog v-model="isLoadingVisible" width="110" height="150" color="primary">
|
|
<VCardText class="" style="color: white !important;">
|
|
<div class="demo-space-x">
|
|
<VProgressCircular :size="40" color="primary" indeterminate />
|
|
</div>
|
|
</VCardText>
|
|
</VDialog>
|
|
<VDialog v-model="canvasPopup" refs="canvasDialog" persistent width="500">
|
|
<v-card>
|
|
<v-card-text>
|
|
<div v-if="imageSrc" class="image-container">
|
|
<img :src="imageSrc" ref="image" alt="Captured Image" width="100%" />
|
|
</div>
|
|
<div v-if="imageSrc" class="mt-2">
|
|
<VRow v-if="addingToNote" class="mb-2">
|
|
<VCol cols="12" md="12">
|
|
<VTextField v-model="note" label="Your Note" type="text" />
|
|
<small class="float-right">By {{ agentName }}</small>
|
|
</VCol>
|
|
</VRow>
|
|
<VBtn class="mr-2" @click="startCropping" v-if="!cropping">Set Profile</VBtn>
|
|
<VBtn class="mr-2" @click="cropImage" v-if="cropping">Save Profile</VBtn>
|
|
<VBtn @click="addToNotes" v-if="!addingToNote">Add to Note</VBtn>
|
|
<VBtn @click="saveAddToNotes" v-if="addingToNote" :disabled="isLoadingVisible || !note">Save Note
|
|
</VBtn>
|
|
</div>
|
|
</v-card-text>
|
|
|
|
<v-card-actions>
|
|
<v-spacer></v-spacer>
|
|
<v-btn text="Close" @click="canvasPopup = false"></v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</VDialog>
|
|
<VDialog v-model="userReconnectedPopup" refs="reconnectingDialog" persistent width="500">
|
|
<v-card>
|
|
<v-card-text>
|
|
<p>Reconnecting Failed...</p>
|
|
</v-card-text>
|
|
|
|
<v-card-actions>
|
|
<v-spacer></v-spacer>
|
|
<v-btn text="Close" @click="userReconnectedPopup = false"></v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</VDialog>
|
|
<VCard class="text-center text-sm-start rounded-0 fullscreen-div" ref="fullscreenDiv"
|
|
:class="{ 'fullscreen': isFullscreen }">
|
|
|
|
<div v-if="audioDevices">{{ audioDevices }}</div>
|
|
<div class="livekit-container video-bg" @mouseup="dragging = false" @mouseleave="dragging = false"
|
|
:style="store.getters.getFloatingWindow ? 'min-height: 150px' : 'min-height: 100vh'">
|
|
<!-- <v-card class="pt-info" v-if="isAgent">
|
|
<VRow>
|
|
<VCol md="12">
|
|
<p class="info-container">
|
|
<span class="text-white"><b>Name: </b></span>
|
|
<span class="text-white">{{ patientName }}</span>
|
|
<span class="text-white"><b>Age: </b></span>
|
|
<span class="text-white">{{ patientAge }}</span>
|
|
<span class="text-white"><b>Gender: </b></span>
|
|
<span class="text-white">Male</span>
|
|
</p>
|
|
</VCol>
|
|
</VRow>
|
|
</v-card> -->
|
|
<div class="recording-badge" v-if="recording && !store.getters.getFloatingWindow">Recording</div>
|
|
<div class="call-quality-indicator btn-transparent"
|
|
v-if="participantSignals && !store.getters.getFloatingWindow">
|
|
<!-- <VIcon v-if="signals == 0" :color="signalIconColor" icon="mdi-signal-off"></VIcon>
|
|
<VIcon v-if="signals == 1" :color="signalIconColor" icon="mdi-signal-cellular-1"></VIcon>
|
|
<VIcon v-if="signals == 2" :color="signalIconColor" icon="mdi-signal-cellular-2"></VIcon>
|
|
<VIcon v-if="signals == 3" :color="signalIconColor" icon="mdi-signal-cellular-3"></VIcon> -->
|
|
<svg v-if="participantSignals == 0" xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink" width="25px" height="25px" viewBox="0 0 25 25"
|
|
version="1.1">
|
|
<g id="surface1">
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;"
|
|
d="M 23.902344 0.859375 C 24.089844 1.039062 24.207031 1.1875 24.242188 1.449219 C 24.246094 1.519531 24.246094 1.585938 24.242188 1.65625 C 24.242188 1.710938 24.242188 1.710938 24.246094 1.769531 C 24.246094 1.898438 24.246094 2.027344 24.242188 2.15625 C 24.242188 2.25 24.242188 2.339844 24.246094 2.433594 C 24.246094 2.6875 24.246094 2.941406 24.246094 3.199219 C 24.242188 3.472656 24.246094 3.746094 24.246094 4.023438 C 24.246094 4.5625 24.246094 5.097656 24.246094 5.636719 C 24.246094 6.074219 24.246094 6.511719 24.246094 6.949219 C 24.246094 7.011719 24.246094 7.074219 24.246094 7.140625 C 24.246094 7.265625 24.246094 7.390625 24.246094 7.519531 C 24.246094 8.667969 24.246094 9.820312 24.242188 10.972656 C 24.242188 12.023438 24.242188 13.078125 24.246094 14.128906 C 24.246094 15.308594 24.246094 16.492188 24.246094 17.671875 C 24.246094 17.796875 24.246094 17.925781 24.246094 18.050781 C 24.246094 18.113281 24.246094 18.171875 24.246094 18.238281 C 24.246094 18.675781 24.246094 19.113281 24.246094 19.546875 C 24.246094 20.082031 24.246094 20.613281 24.246094 21.144531 C 24.246094 21.417969 24.242188 21.691406 24.246094 21.960938 C 24.246094 22.210938 24.246094 22.457031 24.242188 22.707031 C 24.242188 22.796875 24.242188 22.886719 24.246094 22.976562 C 24.246094 23.101562 24.246094 23.222656 24.242188 23.34375 C 24.242188 23.378906 24.246094 23.414062 24.246094 23.449219 C 24.242188 23.695312 24.175781 23.835938 24.023438 24.023438 C 23.800781 24.210938 23.648438 24.242188 23.359375 24.242188 C 23.308594 24.246094 23.308594 24.246094 23.253906 24.246094 C 23.136719 24.246094 23.019531 24.246094 22.898438 24.246094 C 22.816406 24.246094 22.734375 24.246094 22.652344 24.246094 C 22.480469 24.246094 22.3125 24.246094 22.140625 24.246094 C 21.917969 24.242188 21.699219 24.242188 21.480469 24.246094 C 21.3125 24.246094 21.140625 24.246094 20.972656 24.246094 C 20.890625 24.246094 20.808594 24.246094 20.730469 24.246094 C 20.617188 24.246094 20.503906 24.246094 20.390625 24.242188 C 20.324219 24.242188 20.261719 24.242188 20.195312 24.242188 C 19.929688 24.207031 19.785156 24.097656 19.621094 23.890625 C 19.519531 23.707031 19.507812 23.601562 19.507812 23.394531 C 19.507812 23.34375 19.507812 23.34375 19.503906 23.292969 C 19.503906 23.183594 19.503906 23.074219 19.507812 22.964844 C 19.507812 22.882812 19.507812 22.804688 19.503906 22.722656 C 19.503906 22.503906 19.503906 22.285156 19.503906 22.066406 C 19.507812 21.828125 19.503906 21.59375 19.503906 21.355469 C 19.503906 20.894531 19.503906 20.429688 19.503906 19.96875 C 19.503906 19.589844 19.503906 19.214844 19.503906 18.839844 C 19.503906 18.785156 19.503906 18.730469 19.503906 18.675781 C 19.503906 18.566406 19.503906 18.457031 19.503906 18.347656 C 19.503906 17.328125 19.503906 16.308594 19.507812 15.289062 C 19.507812 14.414062 19.507812 13.539062 19.503906 12.660156 C 19.503906 11.644531 19.503906 10.628906 19.503906 9.613281 C 19.503906 9.503906 19.503906 9.394531 19.503906 9.285156 C 19.503906 9.234375 19.503906 9.179688 19.503906 9.125 C 19.503906 8.75 19.503906 8.375 19.503906 7.996094 C 19.503906 7.539062 19.503906 7.082031 19.503906 6.625 C 19.503906 6.390625 19.507812 6.15625 19.503906 5.921875 C 19.503906 5.707031 19.503906 5.492188 19.507812 5.28125 C 19.507812 5.203125 19.507812 5.125 19.503906 5.046875 C 19.503906 4.941406 19.503906 4.835938 19.507812 4.730469 C 19.507812 4.671875 19.507812 4.613281 19.507812 4.554688 C 19.546875 4.300781 19.691406 4.121094 19.871094 3.945312 C 19.910156 3.902344 19.910156 3.902344 19.953125 3.863281 C 19.980469 3.832031 20.011719 3.804688 20.042969 3.773438 C 20.074219 3.742188 20.105469 3.710938 20.136719 3.679688 C 20.238281 3.578125 20.339844 3.472656 20.445312 3.371094 C 20.515625 3.300781 20.585938 3.226562 20.660156 3.15625 C 20.808594 3.007812 20.957031 2.855469 21.109375 2.707031 C 21.300781 2.515625 21.492188 2.324219 21.683594 2.132812 C 21.832031 1.984375 21.976562 1.835938 22.125 1.691406 C 22.195312 1.617188 22.265625 1.546875 22.335938 1.476562 C 22.4375 1.378906 22.535156 1.28125 22.632812 1.179688 C 22.664062 1.152344 22.691406 1.121094 22.722656 1.09375 C 23.058594 0.757812 23.449219 0.652344 23.902344 0.859375 Z M 23.902344 0.859375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;"
|
|
d="M 17.652344 7.109375 C 17.890625 7.339844 17.980469 7.476562 17.992188 7.808594 C 17.996094 7.929688 17.996094 8.046875 17.992188 8.167969 C 17.992188 8.234375 17.992188 8.300781 17.996094 8.367188 C 17.996094 8.550781 17.996094 8.734375 17.996094 8.917969 C 17.992188 9.117188 17.996094 9.316406 17.996094 9.515625 C 17.996094 9.902344 17.996094 10.289062 17.996094 10.679688 C 17.996094 10.992188 17.996094 11.308594 17.996094 11.625 C 17.996094 11.667969 17.996094 11.714844 17.996094 11.761719 C 17.996094 11.851562 17.996094 11.941406 17.996094 12.035156 C 17.996094 12.886719 17.996094 13.742188 17.992188 14.597656 C 17.992188 15.332031 17.992188 16.066406 17.996094 16.796875 C 17.996094 17.648438 17.996094 18.5 17.996094 19.355469 C 17.996094 19.445312 17.996094 19.535156 17.996094 19.625 C 17.996094 19.671875 17.996094 19.714844 17.996094 19.761719 C 17.996094 20.078125 17.996094 20.390625 17.996094 20.707031 C 17.996094 21.089844 17.996094 21.472656 17.996094 21.859375 C 17.996094 22.054688 17.992188 22.25 17.996094 22.445312 C 17.996094 22.625 17.996094 22.804688 17.992188 22.984375 C 17.992188 23.078125 17.996094 23.175781 17.996094 23.269531 C 17.988281 23.789062 17.988281 23.789062 17.773438 24.023438 C 17.550781 24.210938 17.398438 24.242188 17.109375 24.242188 C 17.058594 24.246094 17.058594 24.246094 17.003906 24.246094 C 16.886719 24.246094 16.769531 24.246094 16.648438 24.246094 C 16.566406 24.246094 16.484375 24.246094 16.402344 24.246094 C 16.230469 24.246094 16.0625 24.246094 15.890625 24.246094 C 15.667969 24.242188 15.449219 24.242188 15.230469 24.246094 C 15.0625 24.246094 14.890625 24.246094 14.722656 24.246094 C 14.640625 24.246094 14.558594 24.246094 14.480469 24.246094 C 14.367188 24.246094 14.253906 24.246094 14.140625 24.242188 C 14.074219 24.242188 14.011719 24.242188 13.945312 24.242188 C 13.683594 24.207031 13.542969 24.097656 13.371094 23.902344 C 13.246094 23.664062 13.253906 23.464844 13.257812 23.199219 C 13.257812 23.121094 13.257812 23.121094 13.253906 23.039062 C 13.253906 22.859375 13.253906 22.679688 13.257812 22.5 C 13.253906 22.371094 13.253906 22.242188 13.253906 22.113281 C 13.253906 21.800781 13.253906 21.488281 13.253906 21.175781 C 13.253906 20.921875 13.253906 20.667969 13.253906 20.414062 C 13.253906 20.378906 13.253906 20.339844 13.253906 20.304688 C 13.253906 20.230469 13.253906 20.15625 13.253906 20.082031 C 13.253906 19.394531 13.253906 18.703125 13.257812 18.015625 C 13.257812 17.425781 13.257812 16.832031 13.253906 16.242188 C 13.253906 15.554688 13.253906 14.867188 13.253906 14.179688 C 13.253906 14.109375 13.253906 14.035156 13.253906 13.960938 C 13.253906 13.925781 13.253906 13.890625 13.253906 13.851562 C 13.253906 13.597656 13.253906 13.34375 13.253906 13.089844 C 13.253906 12.75 13.253906 12.40625 13.253906 12.066406 C 13.253906 11.9375 13.253906 11.8125 13.253906 11.6875 C 13.253906 11.515625 13.253906 11.347656 13.257812 11.175781 C 13.257812 11.125 13.253906 11.074219 13.253906 11.023438 C 13.257812 10.660156 13.363281 10.453125 13.621094 10.195312 C 13.660156 10.152344 13.660156 10.152344 13.703125 10.113281 C 13.730469 10.082031 13.761719 10.054688 13.792969 10.023438 C 13.824219 9.992188 13.855469 9.960938 13.886719 9.929688 C 13.988281 9.828125 14.089844 9.722656 14.195312 9.621094 C 14.265625 9.550781 14.335938 9.476562 14.410156 9.40625 C 14.558594 9.257812 14.707031 9.105469 14.859375 8.957031 C 15.050781 8.765625 15.242188 8.574219 15.433594 8.382812 C 15.582031 8.234375 15.726562 8.085938 15.875 7.941406 C 15.945312 7.867188 16.015625 7.796875 16.085938 7.726562 C 16.1875 7.628906 16.285156 7.53125 16.382812 7.429688 C 16.414062 7.402344 16.441406 7.371094 16.472656 7.34375 C 16.808594 7.007812 17.199219 6.902344 17.652344 7.109375 Z M 17.652344 7.109375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;"
|
|
d="M 11.402344 13.359375 C 11.59375 13.546875 11.707031 13.691406 11.742188 13.960938 C 11.746094 14.035156 11.746094 14.105469 11.742188 14.179688 C 11.742188 14.222656 11.746094 14.261719 11.746094 14.304688 C 11.746094 14.441406 11.746094 14.578125 11.742188 14.710938 C 11.746094 14.808594 11.746094 14.90625 11.746094 15.003906 C 11.746094 15.269531 11.746094 15.535156 11.746094 15.800781 C 11.746094 16.078125 11.746094 16.355469 11.746094 16.632812 C 11.746094 17.097656 11.746094 17.566406 11.746094 18.03125 C 11.742188 18.570312 11.742188 19.109375 11.746094 19.648438 C 11.746094 20.109375 11.746094 20.574219 11.746094 21.035156 C 11.746094 21.3125 11.746094 21.585938 11.746094 21.863281 C 11.746094 22.125 11.746094 22.382812 11.746094 22.644531 C 11.746094 22.738281 11.746094 22.832031 11.746094 22.929688 C 11.746094 23.058594 11.746094 23.1875 11.742188 23.320312 C 11.742188 23.355469 11.746094 23.394531 11.746094 23.433594 C 11.742188 23.6875 11.683594 23.828125 11.523438 24.023438 C 11.300781 24.210938 11.148438 24.242188 10.859375 24.242188 C 10.824219 24.246094 10.789062 24.246094 10.753906 24.246094 C 10.636719 24.246094 10.519531 24.246094 10.398438 24.246094 C 10.316406 24.246094 10.234375 24.246094 10.152344 24.246094 C 9.980469 24.246094 9.8125 24.246094 9.640625 24.246094 C 9.417969 24.242188 9.199219 24.242188 8.980469 24.246094 C 8.8125 24.246094 8.640625 24.246094 8.472656 24.246094 C 8.390625 24.246094 8.308594 24.246094 8.230469 24.246094 C 8.117188 24.246094 8.003906 24.246094 7.890625 24.242188 C 7.824219 24.242188 7.761719 24.242188 7.695312 24.242188 C 7.429688 24.207031 7.292969 24.09375 7.113281 23.90625 C 6.988281 23.632812 7.003906 23.371094 7.007812 23.074219 C 7.003906 23.007812 7.003906 22.941406 7.003906 22.875 C 7.003906 22.691406 7.003906 22.511719 7.003906 22.328125 C 7.003906 22.140625 7.003906 21.949219 7.003906 21.761719 C 7.003906 21.441406 7.003906 21.121094 7.003906 20.804688 C 7.007812 20.433594 7.007812 20.066406 7.003906 19.699219 C 7.003906 19.382812 7.003906 19.066406 7.003906 18.75 C 7.003906 18.558594 7.003906 18.371094 7.003906 18.183594 C 7.003906 18.003906 7.003906 17.828125 7.003906 17.648438 C 7.007812 17.554688 7.003906 17.457031 7.003906 17.363281 C 7.011719 16.835938 7.011719 16.835938 7.226562 16.601562 C 7.25 16.578125 7.273438 16.550781 7.296875 16.527344 C 7.375 16.441406 7.457031 16.355469 7.542969 16.273438 C 7.574219 16.242188 7.605469 16.210938 7.636719 16.179688 C 7.738281 16.078125 7.839844 15.972656 7.945312 15.871094 C 8.015625 15.800781 8.085938 15.726562 8.160156 15.65625 C 8.308594 15.507812 8.457031 15.355469 8.609375 15.207031 C 8.800781 15.015625 8.992188 14.824219 9.183594 14.632812 C 9.332031 14.484375 9.476562 14.335938 9.625 14.191406 C 9.695312 14.117188 9.765625 14.046875 9.835938 13.976562 C 9.9375 13.878906 10.035156 13.78125 10.132812 13.679688 C 10.164062 13.652344 10.191406 13.621094 10.222656 13.59375 C 10.558594 13.257812 10.949219 13.152344 11.402344 13.359375 Z M 11.402344 13.359375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,0%,0%);fill-opacity:1;"
|
|
d="M 5.152344 19.609375 C 5.335938 19.789062 5.457031 19.933594 5.492188 20.195312 C 5.492188 20.257812 5.492188 20.324219 5.492188 20.390625 C 5.496094 20.425781 5.496094 20.460938 5.496094 20.496094 C 5.496094 20.613281 5.496094 20.730469 5.496094 20.851562 C 5.496094 20.933594 5.496094 21.015625 5.496094 21.097656 C 5.496094 21.269531 5.496094 21.4375 5.496094 21.609375 C 5.492188 21.832031 5.492188 22.050781 5.496094 22.269531 C 5.496094 22.4375 5.496094 22.609375 5.496094 22.777344 C 5.496094 22.859375 5.496094 22.941406 5.496094 23.019531 C 5.496094 23.132812 5.496094 23.246094 5.492188 23.359375 C 5.492188 23.425781 5.492188 23.488281 5.492188 23.554688 C 5.457031 23.824219 5.34375 23.964844 5.136719 24.136719 C 4.949219 24.234375 4.824219 24.242188 4.609375 24.242188 C 4.574219 24.246094 4.539062 24.246094 4.503906 24.246094 C 4.386719 24.246094 4.269531 24.246094 4.148438 24.246094 C 4.066406 24.246094 3.984375 24.246094 3.902344 24.246094 C 3.730469 24.246094 3.5625 24.246094 3.390625 24.246094 C 3.167969 24.242188 2.949219 24.242188 2.730469 24.246094 C 2.5625 24.246094 2.390625 24.246094 2.222656 24.246094 C 2.140625 24.246094 2.058594 24.246094 1.980469 24.246094 C 1.867188 24.246094 1.753906 24.246094 1.640625 24.242188 C 1.574219 24.242188 1.511719 24.242188 1.445312 24.242188 C 1.183594 24.207031 1.039062 24.085938 0.859375 23.902344 C 0.746094 23.65625 0.734375 23.414062 0.78125 23.144531 C 0.921875 22.90625 1.09375 22.71875 1.292969 22.523438 C 1.324219 22.492188 1.355469 22.460938 1.386719 22.429688 C 1.488281 22.328125 1.589844 22.222656 1.695312 22.121094 C 1.765625 22.050781 1.835938 21.976562 1.910156 21.90625 C 2.058594 21.757812 2.207031 21.605469 2.359375 21.457031 C 2.550781 21.265625 2.742188 21.074219 2.933594 20.882812 C 3.082031 20.734375 3.226562 20.585938 3.375 20.441406 C 3.445312 20.367188 3.515625 20.296875 3.585938 20.226562 C 3.6875 20.128906 3.785156 20.03125 3.882812 19.929688 C 3.914062 19.902344 3.941406 19.871094 3.972656 19.84375 C 4.308594 19.507812 4.699219 19.402344 5.152344 19.609375 Z M 5.152344 19.609375 " />
|
|
</g>
|
|
</svg>
|
|
<svg v-if="participantSignals == 1" xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink" width="25px" height="25px" viewBox="0 0 25 25"
|
|
version="1.1">
|
|
<g id="surface1">
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;"
|
|
d="M 23.902344 0.859375 C 24.089844 1.039062 24.207031 1.1875 24.242188 1.449219 C 24.246094 1.519531 24.246094 1.585938 24.242188 1.65625 C 24.242188 1.710938 24.242188 1.710938 24.246094 1.769531 C 24.246094 1.898438 24.246094 2.027344 24.242188 2.15625 C 24.242188 2.25 24.242188 2.339844 24.246094 2.433594 C 24.246094 2.6875 24.246094 2.941406 24.246094 3.199219 C 24.242188 3.472656 24.246094 3.746094 24.246094 4.023438 C 24.246094 4.5625 24.246094 5.097656 24.246094 5.636719 C 24.246094 6.074219 24.246094 6.511719 24.246094 6.949219 C 24.246094 7.011719 24.246094 7.074219 24.246094 7.140625 C 24.246094 7.265625 24.246094 7.390625 24.246094 7.519531 C 24.246094 8.667969 24.246094 9.820312 24.242188 10.972656 C 24.242188 12.023438 24.242188 13.078125 24.246094 14.128906 C 24.246094 15.308594 24.246094 16.492188 24.246094 17.671875 C 24.246094 17.796875 24.246094 17.925781 24.246094 18.050781 C 24.246094 18.113281 24.246094 18.171875 24.246094 18.238281 C 24.246094 18.675781 24.246094 19.113281 24.246094 19.546875 C 24.246094 20.082031 24.246094 20.613281 24.246094 21.144531 C 24.246094 21.417969 24.242188 21.691406 24.246094 21.960938 C 24.246094 22.210938 24.246094 22.457031 24.242188 22.707031 C 24.242188 22.796875 24.242188 22.886719 24.246094 22.976562 C 24.246094 23.101562 24.246094 23.222656 24.242188 23.34375 C 24.242188 23.378906 24.246094 23.414062 24.246094 23.449219 C 24.242188 23.695312 24.175781 23.835938 24.023438 24.023438 C 23.800781 24.210938 23.648438 24.242188 23.359375 24.242188 C 23.308594 24.246094 23.308594 24.246094 23.253906 24.246094 C 23.136719 24.246094 23.019531 24.246094 22.898438 24.246094 C 22.816406 24.246094 22.734375 24.246094 22.652344 24.246094 C 22.480469 24.246094 22.3125 24.246094 22.140625 24.246094 C 21.917969 24.242188 21.699219 24.242188 21.480469 24.246094 C 21.3125 24.246094 21.140625 24.246094 20.972656 24.246094 C 20.890625 24.246094 20.808594 24.246094 20.730469 24.246094 C 20.617188 24.246094 20.503906 24.246094 20.390625 24.242188 C 20.324219 24.242188 20.261719 24.242188 20.195312 24.242188 C 19.929688 24.207031 19.785156 24.097656 19.621094 23.890625 C 19.519531 23.707031 19.507812 23.601562 19.507812 23.394531 C 19.507812 23.34375 19.507812 23.34375 19.503906 23.292969 C 19.503906 23.183594 19.503906 23.074219 19.507812 22.964844 C 19.507812 22.882812 19.507812 22.804688 19.503906 22.722656 C 19.503906 22.503906 19.503906 22.285156 19.503906 22.066406 C 19.507812 21.828125 19.503906 21.59375 19.503906 21.355469 C 19.503906 20.894531 19.503906 20.429688 19.503906 19.96875 C 19.503906 19.589844 19.503906 19.214844 19.503906 18.839844 C 19.503906 18.785156 19.503906 18.730469 19.503906 18.675781 C 19.503906 18.566406 19.503906 18.457031 19.503906 18.347656 C 19.503906 17.328125 19.503906 16.308594 19.507812 15.289062 C 19.507812 14.414062 19.507812 13.539062 19.503906 12.660156 C 19.503906 11.644531 19.503906 10.628906 19.503906 9.613281 C 19.503906 9.503906 19.503906 9.394531 19.503906 9.285156 C 19.503906 9.234375 19.503906 9.179688 19.503906 9.125 C 19.503906 8.75 19.503906 8.375 19.503906 7.996094 C 19.503906 7.539062 19.503906 7.082031 19.503906 6.625 C 19.503906 6.390625 19.507812 6.15625 19.503906 5.921875 C 19.503906 5.707031 19.503906 5.492188 19.507812 5.28125 C 19.507812 5.203125 19.507812 5.125 19.503906 5.046875 C 19.503906 4.941406 19.503906 4.835938 19.507812 4.730469 C 19.507812 4.671875 19.507812 4.613281 19.507812 4.554688 C 19.546875 4.300781 19.691406 4.121094 19.871094 3.945312 C 19.910156 3.902344 19.910156 3.902344 19.953125 3.863281 C 19.980469 3.832031 20.011719 3.804688 20.042969 3.773438 C 20.074219 3.742188 20.105469 3.710938 20.136719 3.679688 C 20.238281 3.578125 20.339844 3.472656 20.445312 3.371094 C 20.515625 3.300781 20.585938 3.226562 20.660156 3.15625 C 20.808594 3.007812 20.957031 2.855469 21.109375 2.707031 C 21.300781 2.515625 21.492188 2.324219 21.683594 2.132812 C 21.832031 1.984375 21.976562 1.835938 22.125 1.691406 C 22.195312 1.617188 22.265625 1.546875 22.335938 1.476562 C 22.4375 1.378906 22.535156 1.28125 22.632812 1.179688 C 22.664062 1.152344 22.691406 1.121094 22.722656 1.09375 C 23.058594 0.757812 23.449219 0.652344 23.902344 0.859375 Z M 23.902344 0.859375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;"
|
|
d="M 17.652344 7.109375 C 17.890625 7.339844 17.980469 7.476562 17.992188 7.808594 C 17.996094 7.929688 17.996094 8.046875 17.992188 8.167969 C 17.992188 8.234375 17.992188 8.300781 17.996094 8.367188 C 17.996094 8.550781 17.996094 8.734375 17.996094 8.917969 C 17.992188 9.117188 17.996094 9.316406 17.996094 9.515625 C 17.996094 9.902344 17.996094 10.289062 17.996094 10.679688 C 17.996094 10.992188 17.996094 11.308594 17.996094 11.625 C 17.996094 11.667969 17.996094 11.714844 17.996094 11.761719 C 17.996094 11.851562 17.996094 11.941406 17.996094 12.035156 C 17.996094 12.886719 17.996094 13.742188 17.992188 14.597656 C 17.992188 15.332031 17.992188 16.066406 17.996094 16.796875 C 17.996094 17.648438 17.996094 18.5 17.996094 19.355469 C 17.996094 19.445312 17.996094 19.535156 17.996094 19.625 C 17.996094 19.671875 17.996094 19.714844 17.996094 19.761719 C 17.996094 20.078125 17.996094 20.390625 17.996094 20.707031 C 17.996094 21.089844 17.996094 21.472656 17.996094 21.859375 C 17.996094 22.054688 17.992188 22.25 17.996094 22.445312 C 17.996094 22.625 17.996094 22.804688 17.992188 22.984375 C 17.992188 23.078125 17.996094 23.175781 17.996094 23.269531 C 17.988281 23.789062 17.988281 23.789062 17.773438 24.023438 C 17.550781 24.210938 17.398438 24.242188 17.109375 24.242188 C 17.058594 24.246094 17.058594 24.246094 17.003906 24.246094 C 16.886719 24.246094 16.769531 24.246094 16.648438 24.246094 C 16.566406 24.246094 16.484375 24.246094 16.402344 24.246094 C 16.230469 24.246094 16.0625 24.246094 15.890625 24.246094 C 15.667969 24.242188 15.449219 24.242188 15.230469 24.246094 C 15.0625 24.246094 14.890625 24.246094 14.722656 24.246094 C 14.640625 24.246094 14.558594 24.246094 14.480469 24.246094 C 14.367188 24.246094 14.253906 24.246094 14.140625 24.242188 C 14.074219 24.242188 14.011719 24.242188 13.945312 24.242188 C 13.683594 24.207031 13.542969 24.097656 13.371094 23.902344 C 13.246094 23.664062 13.253906 23.464844 13.257812 23.199219 C 13.257812 23.121094 13.257812 23.121094 13.253906 23.039062 C 13.253906 22.859375 13.253906 22.679688 13.257812 22.5 C 13.253906 22.371094 13.253906 22.242188 13.253906 22.113281 C 13.253906 21.800781 13.253906 21.488281 13.253906 21.175781 C 13.253906 20.921875 13.253906 20.667969 13.253906 20.414062 C 13.253906 20.378906 13.253906 20.339844 13.253906 20.304688 C 13.253906 20.230469 13.253906 20.15625 13.253906 20.082031 C 13.253906 19.394531 13.253906 18.703125 13.257812 18.015625 C 13.257812 17.425781 13.257812 16.832031 13.253906 16.242188 C 13.253906 15.554688 13.253906 14.867188 13.253906 14.179688 C 13.253906 14.109375 13.253906 14.035156 13.253906 13.960938 C 13.253906 13.925781 13.253906 13.890625 13.253906 13.851562 C 13.253906 13.597656 13.253906 13.34375 13.253906 13.089844 C 13.253906 12.75 13.253906 12.40625 13.253906 12.066406 C 13.253906 11.9375 13.253906 11.8125 13.253906 11.6875 C 13.253906 11.515625 13.253906 11.347656 13.257812 11.175781 C 13.257812 11.125 13.253906 11.074219 13.253906 11.023438 C 13.257812 10.660156 13.363281 10.453125 13.621094 10.195312 C 13.660156 10.152344 13.660156 10.152344 13.703125 10.113281 C 13.730469 10.082031 13.761719 10.054688 13.792969 10.023438 C 13.824219 9.992188 13.855469 9.960938 13.886719 9.929688 C 13.988281 9.828125 14.089844 9.722656 14.195312 9.621094 C 14.265625 9.550781 14.335938 9.476562 14.410156 9.40625 C 14.558594 9.257812 14.707031 9.105469 14.859375 8.957031 C 15.050781 8.765625 15.242188 8.574219 15.433594 8.382812 C 15.582031 8.234375 15.726562 8.085938 15.875 7.941406 C 15.945312 7.867188 16.015625 7.796875 16.085938 7.726562 C 16.1875 7.628906 16.285156 7.53125 16.382812 7.429688 C 16.414062 7.402344 16.441406 7.371094 16.472656 7.34375 C 16.808594 7.007812 17.199219 6.902344 17.652344 7.109375 Z M 17.652344 7.109375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 11.402344 13.359375 C 11.59375 13.546875 11.707031 13.691406 11.742188 13.960938 C 11.746094 14.035156 11.746094 14.105469 11.742188 14.179688 C 11.742188 14.222656 11.746094 14.261719 11.746094 14.304688 C 11.746094 14.441406 11.746094 14.578125 11.742188 14.710938 C 11.746094 14.808594 11.746094 14.90625 11.746094 15.003906 C 11.746094 15.269531 11.746094 15.535156 11.746094 15.800781 C 11.746094 16.078125 11.746094 16.355469 11.746094 16.632812 C 11.746094 17.097656 11.746094 17.566406 11.746094 18.03125 C 11.742188 18.570312 11.742188 19.109375 11.746094 19.648438 C 11.746094 20.109375 11.746094 20.574219 11.746094 21.035156 C 11.746094 21.3125 11.746094 21.585938 11.746094 21.863281 C 11.746094 22.125 11.746094 22.382812 11.746094 22.644531 C 11.746094 22.738281 11.746094 22.832031 11.746094 22.929688 C 11.746094 23.058594 11.746094 23.1875 11.742188 23.320312 C 11.742188 23.355469 11.746094 23.394531 11.746094 23.433594 C 11.742188 23.6875 11.683594 23.828125 11.523438 24.023438 C 11.300781 24.210938 11.148438 24.242188 10.859375 24.242188 C 10.824219 24.246094 10.789062 24.246094 10.753906 24.246094 C 10.636719 24.246094 10.519531 24.246094 10.398438 24.246094 C 10.316406 24.246094 10.234375 24.246094 10.152344 24.246094 C 9.980469 24.246094 9.8125 24.246094 9.640625 24.246094 C 9.417969 24.242188 9.199219 24.242188 8.980469 24.246094 C 8.8125 24.246094 8.640625 24.246094 8.472656 24.246094 C 8.390625 24.246094 8.308594 24.246094 8.230469 24.246094 C 8.117188 24.246094 8.003906 24.246094 7.890625 24.242188 C 7.824219 24.242188 7.761719 24.242188 7.695312 24.242188 C 7.429688 24.207031 7.292969 24.09375 7.113281 23.90625 C 6.988281 23.632812 7.003906 23.371094 7.007812 23.074219 C 7.003906 23.007812 7.003906 22.941406 7.003906 22.875 C 7.003906 22.691406 7.003906 22.511719 7.003906 22.328125 C 7.003906 22.140625 7.003906 21.949219 7.003906 21.761719 C 7.003906 21.441406 7.003906 21.121094 7.003906 20.804688 C 7.007812 20.433594 7.007812 20.066406 7.003906 19.699219 C 7.003906 19.382812 7.003906 19.066406 7.003906 18.75 C 7.003906 18.558594 7.003906 18.371094 7.003906 18.183594 C 7.003906 18.003906 7.003906 17.828125 7.003906 17.648438 C 7.007812 17.554688 7.003906 17.457031 7.003906 17.363281 C 7.011719 16.835938 7.011719 16.835938 7.226562 16.601562 C 7.25 16.578125 7.273438 16.550781 7.296875 16.527344 C 7.375 16.441406 7.457031 16.355469 7.542969 16.273438 C 7.574219 16.242188 7.605469 16.210938 7.636719 16.179688 C 7.738281 16.078125 7.839844 15.972656 7.945312 15.871094 C 8.015625 15.800781 8.085938 15.726562 8.160156 15.65625 C 8.308594 15.507812 8.457031 15.355469 8.609375 15.207031 C 8.800781 15.015625 8.992188 14.824219 9.183594 14.632812 C 9.332031 14.484375 9.476562 14.335938 9.625 14.191406 C 9.695312 14.117188 9.765625 14.046875 9.835938 13.976562 C 9.9375 13.878906 10.035156 13.78125 10.132812 13.679688 C 10.164062 13.652344 10.191406 13.621094 10.222656 13.59375 C 10.558594 13.257812 10.949219 13.152344 11.402344 13.359375 Z M 11.402344 13.359375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 5.152344 19.609375 C 5.335938 19.789062 5.457031 19.933594 5.492188 20.195312 C 5.492188 20.257812 5.492188 20.324219 5.492188 20.390625 C 5.496094 20.425781 5.496094 20.460938 5.496094 20.496094 C 5.496094 20.613281 5.496094 20.730469 5.496094 20.851562 C 5.496094 20.933594 5.496094 21.015625 5.496094 21.097656 C 5.496094 21.269531 5.496094 21.4375 5.496094 21.609375 C 5.492188 21.832031 5.492188 22.050781 5.496094 22.269531 C 5.496094 22.4375 5.496094 22.609375 5.496094 22.777344 C 5.496094 22.859375 5.496094 22.941406 5.496094 23.019531 C 5.496094 23.132812 5.496094 23.246094 5.492188 23.359375 C 5.492188 23.425781 5.492188 23.488281 5.492188 23.554688 C 5.457031 23.824219 5.34375 23.964844 5.136719 24.136719 C 4.949219 24.234375 4.824219 24.242188 4.609375 24.242188 C 4.574219 24.246094 4.539062 24.246094 4.503906 24.246094 C 4.386719 24.246094 4.269531 24.246094 4.148438 24.246094 C 4.066406 24.246094 3.984375 24.246094 3.902344 24.246094 C 3.730469 24.246094 3.5625 24.246094 3.390625 24.246094 C 3.167969 24.242188 2.949219 24.242188 2.730469 24.246094 C 2.5625 24.246094 2.390625 24.246094 2.222656 24.246094 C 2.140625 24.246094 2.058594 24.246094 1.980469 24.246094 C 1.867188 24.246094 1.753906 24.246094 1.640625 24.242188 C 1.574219 24.242188 1.511719 24.242188 1.445312 24.242188 C 1.183594 24.207031 1.039062 24.085938 0.859375 23.902344 C 0.746094 23.65625 0.734375 23.414062 0.78125 23.144531 C 0.921875 22.90625 1.09375 22.71875 1.292969 22.523438 C 1.324219 22.492188 1.355469 22.460938 1.386719 22.429688 C 1.488281 22.328125 1.589844 22.222656 1.695312 22.121094 C 1.765625 22.050781 1.835938 21.976562 1.910156 21.90625 C 2.058594 21.757812 2.207031 21.605469 2.359375 21.457031 C 2.550781 21.265625 2.742188 21.074219 2.933594 20.882812 C 3.082031 20.734375 3.226562 20.585938 3.375 20.441406 C 3.445312 20.367188 3.515625 20.296875 3.585938 20.226562 C 3.6875 20.128906 3.785156 20.03125 3.882812 19.929688 C 3.914062 19.902344 3.941406 19.871094 3.972656 19.84375 C 4.308594 19.507812 4.699219 19.402344 5.152344 19.609375 Z M 5.152344 19.609375 " />
|
|
</g>
|
|
</svg>
|
|
<svg v-if="participantSignals == 2" xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink" width="25px" height="25px" viewBox="0 0 25 25"
|
|
version="1.1">
|
|
<g id="surface1">
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;"
|
|
d="M 23.902344 0.859375 C 24.089844 1.039062 24.207031 1.1875 24.242188 1.449219 C 24.246094 1.519531 24.246094 1.585938 24.242188 1.65625 C 24.242188 1.710938 24.242188 1.710938 24.246094 1.769531 C 24.246094 1.898438 24.246094 2.027344 24.242188 2.15625 C 24.242188 2.25 24.242188 2.339844 24.246094 2.433594 C 24.246094 2.6875 24.246094 2.941406 24.246094 3.199219 C 24.242188 3.472656 24.246094 3.746094 24.246094 4.023438 C 24.246094 4.5625 24.246094 5.097656 24.246094 5.636719 C 24.246094 6.074219 24.246094 6.511719 24.246094 6.949219 C 24.246094 7.011719 24.246094 7.074219 24.246094 7.140625 C 24.246094 7.265625 24.246094 7.390625 24.246094 7.519531 C 24.246094 8.667969 24.246094 9.820312 24.242188 10.972656 C 24.242188 12.023438 24.242188 13.078125 24.246094 14.128906 C 24.246094 15.308594 24.246094 16.492188 24.246094 17.671875 C 24.246094 17.796875 24.246094 17.925781 24.246094 18.050781 C 24.246094 18.113281 24.246094 18.171875 24.246094 18.238281 C 24.246094 18.675781 24.246094 19.113281 24.246094 19.546875 C 24.246094 20.082031 24.246094 20.613281 24.246094 21.144531 C 24.246094 21.417969 24.242188 21.691406 24.246094 21.960938 C 24.246094 22.210938 24.246094 22.457031 24.242188 22.707031 C 24.242188 22.796875 24.242188 22.886719 24.246094 22.976562 C 24.246094 23.101562 24.246094 23.222656 24.242188 23.34375 C 24.242188 23.378906 24.246094 23.414062 24.246094 23.449219 C 24.242188 23.695312 24.175781 23.835938 24.023438 24.023438 C 23.800781 24.210938 23.648438 24.242188 23.359375 24.242188 C 23.308594 24.246094 23.308594 24.246094 23.253906 24.246094 C 23.136719 24.246094 23.019531 24.246094 22.898438 24.246094 C 22.816406 24.246094 22.734375 24.246094 22.652344 24.246094 C 22.480469 24.246094 22.3125 24.246094 22.140625 24.246094 C 21.917969 24.242188 21.699219 24.242188 21.480469 24.246094 C 21.3125 24.246094 21.140625 24.246094 20.972656 24.246094 C 20.890625 24.246094 20.808594 24.246094 20.730469 24.246094 C 20.617188 24.246094 20.503906 24.246094 20.390625 24.242188 C 20.324219 24.242188 20.261719 24.242188 20.195312 24.242188 C 19.929688 24.207031 19.785156 24.097656 19.621094 23.890625 C 19.519531 23.707031 19.507812 23.601562 19.507812 23.394531 C 19.507812 23.34375 19.507812 23.34375 19.503906 23.292969 C 19.503906 23.183594 19.503906 23.074219 19.507812 22.964844 C 19.507812 22.882812 19.507812 22.804688 19.503906 22.722656 C 19.503906 22.503906 19.503906 22.285156 19.503906 22.066406 C 19.507812 21.828125 19.503906 21.59375 19.503906 21.355469 C 19.503906 20.894531 19.503906 20.429688 19.503906 19.96875 C 19.503906 19.589844 19.503906 19.214844 19.503906 18.839844 C 19.503906 18.785156 19.503906 18.730469 19.503906 18.675781 C 19.503906 18.566406 19.503906 18.457031 19.503906 18.347656 C 19.503906 17.328125 19.503906 16.308594 19.507812 15.289062 C 19.507812 14.414062 19.507812 13.539062 19.503906 12.660156 C 19.503906 11.644531 19.503906 10.628906 19.503906 9.613281 C 19.503906 9.503906 19.503906 9.394531 19.503906 9.285156 C 19.503906 9.234375 19.503906 9.179688 19.503906 9.125 C 19.503906 8.75 19.503906 8.375 19.503906 7.996094 C 19.503906 7.539062 19.503906 7.082031 19.503906 6.625 C 19.503906 6.390625 19.507812 6.15625 19.503906 5.921875 C 19.503906 5.707031 19.503906 5.492188 19.507812 5.28125 C 19.507812 5.203125 19.507812 5.125 19.503906 5.046875 C 19.503906 4.941406 19.503906 4.835938 19.507812 4.730469 C 19.507812 4.671875 19.507812 4.613281 19.507812 4.554688 C 19.546875 4.300781 19.691406 4.121094 19.871094 3.945312 C 19.910156 3.902344 19.910156 3.902344 19.953125 3.863281 C 19.980469 3.832031 20.011719 3.804688 20.042969 3.773438 C 20.074219 3.742188 20.105469 3.710938 20.136719 3.679688 C 20.238281 3.578125 20.339844 3.472656 20.445312 3.371094 C 20.515625 3.300781 20.585938 3.226562 20.660156 3.15625 C 20.808594 3.007812 20.957031 2.855469 21.109375 2.707031 C 21.300781 2.515625 21.492188 2.324219 21.683594 2.132812 C 21.832031 1.984375 21.976562 1.835938 22.125 1.691406 C 22.195312 1.617188 22.265625 1.546875 22.335938 1.476562 C 22.4375 1.378906 22.535156 1.28125 22.632812 1.179688 C 22.664062 1.152344 22.691406 1.121094 22.722656 1.09375 C 23.058594 0.757812 23.449219 0.652344 23.902344 0.859375 Z M 23.902344 0.859375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 17.652344 7.109375 C 17.890625 7.339844 17.980469 7.476562 17.992188 7.808594 C 17.996094 7.929688 17.996094 8.046875 17.992188 8.167969 C 17.992188 8.234375 17.992188 8.300781 17.996094 8.367188 C 17.996094 8.550781 17.996094 8.734375 17.996094 8.917969 C 17.992188 9.117188 17.996094 9.316406 17.996094 9.515625 C 17.996094 9.902344 17.996094 10.289062 17.996094 10.679688 C 17.996094 10.992188 17.996094 11.308594 17.996094 11.625 C 17.996094 11.667969 17.996094 11.714844 17.996094 11.761719 C 17.996094 11.851562 17.996094 11.941406 17.996094 12.035156 C 17.996094 12.886719 17.996094 13.742188 17.992188 14.597656 C 17.992188 15.332031 17.992188 16.066406 17.996094 16.796875 C 17.996094 17.648438 17.996094 18.5 17.996094 19.355469 C 17.996094 19.445312 17.996094 19.535156 17.996094 19.625 C 17.996094 19.671875 17.996094 19.714844 17.996094 19.761719 C 17.996094 20.078125 17.996094 20.390625 17.996094 20.707031 C 17.996094 21.089844 17.996094 21.472656 17.996094 21.859375 C 17.996094 22.054688 17.992188 22.25 17.996094 22.445312 C 17.996094 22.625 17.996094 22.804688 17.992188 22.984375 C 17.992188 23.078125 17.996094 23.175781 17.996094 23.269531 C 17.988281 23.789062 17.988281 23.789062 17.773438 24.023438 C 17.550781 24.210938 17.398438 24.242188 17.109375 24.242188 C 17.058594 24.246094 17.058594 24.246094 17.003906 24.246094 C 16.886719 24.246094 16.769531 24.246094 16.648438 24.246094 C 16.566406 24.246094 16.484375 24.246094 16.402344 24.246094 C 16.230469 24.246094 16.0625 24.246094 15.890625 24.246094 C 15.667969 24.242188 15.449219 24.242188 15.230469 24.246094 C 15.0625 24.246094 14.890625 24.246094 14.722656 24.246094 C 14.640625 24.246094 14.558594 24.246094 14.480469 24.246094 C 14.367188 24.246094 14.253906 24.246094 14.140625 24.242188 C 14.074219 24.242188 14.011719 24.242188 13.945312 24.242188 C 13.683594 24.207031 13.542969 24.097656 13.371094 23.902344 C 13.246094 23.664062 13.253906 23.464844 13.257812 23.199219 C 13.257812 23.121094 13.257812 23.121094 13.253906 23.039062 C 13.253906 22.859375 13.253906 22.679688 13.257812 22.5 C 13.253906 22.371094 13.253906 22.242188 13.253906 22.113281 C 13.253906 21.800781 13.253906 21.488281 13.253906 21.175781 C 13.253906 20.921875 13.253906 20.667969 13.253906 20.414062 C 13.253906 20.378906 13.253906 20.339844 13.253906 20.304688 C 13.253906 20.230469 13.253906 20.15625 13.253906 20.082031 C 13.253906 19.394531 13.253906 18.703125 13.257812 18.015625 C 13.257812 17.425781 13.257812 16.832031 13.253906 16.242188 C 13.253906 15.554688 13.253906 14.867188 13.253906 14.179688 C 13.253906 14.109375 13.253906 14.035156 13.253906 13.960938 C 13.253906 13.925781 13.253906 13.890625 13.253906 13.851562 C 13.253906 13.597656 13.253906 13.34375 13.253906 13.089844 C 13.253906 12.75 13.253906 12.40625 13.253906 12.066406 C 13.253906 11.9375 13.253906 11.8125 13.253906 11.6875 C 13.253906 11.515625 13.253906 11.347656 13.257812 11.175781 C 13.257812 11.125 13.253906 11.074219 13.253906 11.023438 C 13.257812 10.660156 13.363281 10.453125 13.621094 10.195312 C 13.660156 10.152344 13.660156 10.152344 13.703125 10.113281 C 13.730469 10.082031 13.761719 10.054688 13.792969 10.023438 C 13.824219 9.992188 13.855469 9.960938 13.886719 9.929688 C 13.988281 9.828125 14.089844 9.722656 14.195312 9.621094 C 14.265625 9.550781 14.335938 9.476562 14.410156 9.40625 C 14.558594 9.257812 14.707031 9.105469 14.859375 8.957031 C 15.050781 8.765625 15.242188 8.574219 15.433594 8.382812 C 15.582031 8.234375 15.726562 8.085938 15.875 7.941406 C 15.945312 7.867188 16.015625 7.796875 16.085938 7.726562 C 16.1875 7.628906 16.285156 7.53125 16.382812 7.429688 C 16.414062 7.402344 16.441406 7.371094 16.472656 7.34375 C 16.808594 7.007812 17.199219 6.902344 17.652344 7.109375 Z M 17.652344 7.109375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 11.402344 13.359375 C 11.59375 13.546875 11.707031 13.691406 11.742188 13.960938 C 11.746094 14.035156 11.746094 14.105469 11.742188 14.179688 C 11.742188 14.222656 11.746094 14.261719 11.746094 14.304688 C 11.746094 14.441406 11.746094 14.578125 11.742188 14.710938 C 11.746094 14.808594 11.746094 14.90625 11.746094 15.003906 C 11.746094 15.269531 11.746094 15.535156 11.746094 15.800781 C 11.746094 16.078125 11.746094 16.355469 11.746094 16.632812 C 11.746094 17.097656 11.746094 17.566406 11.746094 18.03125 C 11.742188 18.570312 11.742188 19.109375 11.746094 19.648438 C 11.746094 20.109375 11.746094 20.574219 11.746094 21.035156 C 11.746094 21.3125 11.746094 21.585938 11.746094 21.863281 C 11.746094 22.125 11.746094 22.382812 11.746094 22.644531 C 11.746094 22.738281 11.746094 22.832031 11.746094 22.929688 C 11.746094 23.058594 11.746094 23.1875 11.742188 23.320312 C 11.742188 23.355469 11.746094 23.394531 11.746094 23.433594 C 11.742188 23.6875 11.683594 23.828125 11.523438 24.023438 C 11.300781 24.210938 11.148438 24.242188 10.859375 24.242188 C 10.824219 24.246094 10.789062 24.246094 10.753906 24.246094 C 10.636719 24.246094 10.519531 24.246094 10.398438 24.246094 C 10.316406 24.246094 10.234375 24.246094 10.152344 24.246094 C 9.980469 24.246094 9.8125 24.246094 9.640625 24.246094 C 9.417969 24.242188 9.199219 24.242188 8.980469 24.246094 C 8.8125 24.246094 8.640625 24.246094 8.472656 24.246094 C 8.390625 24.246094 8.308594 24.246094 8.230469 24.246094 C 8.117188 24.246094 8.003906 24.246094 7.890625 24.242188 C 7.824219 24.242188 7.761719 24.242188 7.695312 24.242188 C 7.429688 24.207031 7.292969 24.09375 7.113281 23.90625 C 6.988281 23.632812 7.003906 23.371094 7.007812 23.074219 C 7.003906 23.007812 7.003906 22.941406 7.003906 22.875 C 7.003906 22.691406 7.003906 22.511719 7.003906 22.328125 C 7.003906 22.140625 7.003906 21.949219 7.003906 21.761719 C 7.003906 21.441406 7.003906 21.121094 7.003906 20.804688 C 7.007812 20.433594 7.007812 20.066406 7.003906 19.699219 C 7.003906 19.382812 7.003906 19.066406 7.003906 18.75 C 7.003906 18.558594 7.003906 18.371094 7.003906 18.183594 C 7.003906 18.003906 7.003906 17.828125 7.003906 17.648438 C 7.007812 17.554688 7.003906 17.457031 7.003906 17.363281 C 7.011719 16.835938 7.011719 16.835938 7.226562 16.601562 C 7.25 16.578125 7.273438 16.550781 7.296875 16.527344 C 7.375 16.441406 7.457031 16.355469 7.542969 16.273438 C 7.574219 16.242188 7.605469 16.210938 7.636719 16.179688 C 7.738281 16.078125 7.839844 15.972656 7.945312 15.871094 C 8.015625 15.800781 8.085938 15.726562 8.160156 15.65625 C 8.308594 15.507812 8.457031 15.355469 8.609375 15.207031 C 8.800781 15.015625 8.992188 14.824219 9.183594 14.632812 C 9.332031 14.484375 9.476562 14.335938 9.625 14.191406 C 9.695312 14.117188 9.765625 14.046875 9.835938 13.976562 C 9.9375 13.878906 10.035156 13.78125 10.132812 13.679688 C 10.164062 13.652344 10.191406 13.621094 10.222656 13.59375 C 10.558594 13.257812 10.949219 13.152344 11.402344 13.359375 Z M 11.402344 13.359375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 5.152344 19.609375 C 5.335938 19.789062 5.457031 19.933594 5.492188 20.195312 C 5.492188 20.257812 5.492188 20.324219 5.492188 20.390625 C 5.496094 20.425781 5.496094 20.460938 5.496094 20.496094 C 5.496094 20.613281 5.496094 20.730469 5.496094 20.851562 C 5.496094 20.933594 5.496094 21.015625 5.496094 21.097656 C 5.496094 21.269531 5.496094 21.4375 5.496094 21.609375 C 5.492188 21.832031 5.492188 22.050781 5.496094 22.269531 C 5.496094 22.4375 5.496094 22.609375 5.496094 22.777344 C 5.496094 22.859375 5.496094 22.941406 5.496094 23.019531 C 5.496094 23.132812 5.496094 23.246094 5.492188 23.359375 C 5.492188 23.425781 5.492188 23.488281 5.492188 23.554688 C 5.457031 23.824219 5.34375 23.964844 5.136719 24.136719 C 4.949219 24.234375 4.824219 24.242188 4.609375 24.242188 C 4.574219 24.246094 4.539062 24.246094 4.503906 24.246094 C 4.386719 24.246094 4.269531 24.246094 4.148438 24.246094 C 4.066406 24.246094 3.984375 24.246094 3.902344 24.246094 C 3.730469 24.246094 3.5625 24.246094 3.390625 24.246094 C 3.167969 24.242188 2.949219 24.242188 2.730469 24.246094 C 2.5625 24.246094 2.390625 24.246094 2.222656 24.246094 C 2.140625 24.246094 2.058594 24.246094 1.980469 24.246094 C 1.867188 24.246094 1.753906 24.246094 1.640625 24.242188 C 1.574219 24.242188 1.511719 24.242188 1.445312 24.242188 C 1.183594 24.207031 1.039062 24.085938 0.859375 23.902344 C 0.746094 23.65625 0.734375 23.414062 0.78125 23.144531 C 0.921875 22.90625 1.09375 22.71875 1.292969 22.523438 C 1.324219 22.492188 1.355469 22.460938 1.386719 22.429688 C 1.488281 22.328125 1.589844 22.222656 1.695312 22.121094 C 1.765625 22.050781 1.835938 21.976562 1.910156 21.90625 C 2.058594 21.757812 2.207031 21.605469 2.359375 21.457031 C 2.550781 21.265625 2.742188 21.074219 2.933594 20.882812 C 3.082031 20.734375 3.226562 20.585938 3.375 20.441406 C 3.445312 20.367188 3.515625 20.296875 3.585938 20.226562 C 3.6875 20.128906 3.785156 20.03125 3.882812 19.929688 C 3.914062 19.902344 3.941406 19.871094 3.972656 19.84375 C 4.308594 19.507812 4.699219 19.402344 5.152344 19.609375 Z M 5.152344 19.609375 " />
|
|
</g>
|
|
</svg>
|
|
<svg v-if="participantSignals == 3" xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink" width="25px" height="25px" viewBox="0 0 25 25"
|
|
version="1.1">
|
|
<g id="surface1">
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 23.902344 0.859375 C 24.089844 1.039062 24.207031 1.1875 24.242188 1.449219 C 24.246094 1.519531 24.246094 1.585938 24.242188 1.65625 C 24.242188 1.710938 24.242188 1.710938 24.246094 1.769531 C 24.246094 1.898438 24.246094 2.027344 24.242188 2.15625 C 24.242188 2.25 24.242188 2.339844 24.246094 2.433594 C 24.246094 2.6875 24.246094 2.941406 24.246094 3.199219 C 24.242188 3.472656 24.246094 3.746094 24.246094 4.023438 C 24.246094 4.5625 24.246094 5.097656 24.246094 5.636719 C 24.246094 6.074219 24.246094 6.511719 24.246094 6.949219 C 24.246094 7.011719 24.246094 7.074219 24.246094 7.140625 C 24.246094 7.265625 24.246094 7.390625 24.246094 7.519531 C 24.246094 8.667969 24.246094 9.820312 24.242188 10.972656 C 24.242188 12.023438 24.242188 13.078125 24.246094 14.128906 C 24.246094 15.308594 24.246094 16.492188 24.246094 17.671875 C 24.246094 17.796875 24.246094 17.925781 24.246094 18.050781 C 24.246094 18.113281 24.246094 18.171875 24.246094 18.238281 C 24.246094 18.675781 24.246094 19.113281 24.246094 19.546875 C 24.246094 20.082031 24.246094 20.613281 24.246094 21.144531 C 24.246094 21.417969 24.242188 21.691406 24.246094 21.960938 C 24.246094 22.210938 24.246094 22.457031 24.242188 22.707031 C 24.242188 22.796875 24.242188 22.886719 24.246094 22.976562 C 24.246094 23.101562 24.246094 23.222656 24.242188 23.34375 C 24.242188 23.378906 24.246094 23.414062 24.246094 23.449219 C 24.242188 23.695312 24.175781 23.835938 24.023438 24.023438 C 23.800781 24.210938 23.648438 24.242188 23.359375 24.242188 C 23.308594 24.246094 23.308594 24.246094 23.253906 24.246094 C 23.136719 24.246094 23.019531 24.246094 22.898438 24.246094 C 22.816406 24.246094 22.734375 24.246094 22.652344 24.246094 C 22.480469 24.246094 22.3125 24.246094 22.140625 24.246094 C 21.917969 24.242188 21.699219 24.242188 21.480469 24.246094 C 21.3125 24.246094 21.140625 24.246094 20.972656 24.246094 C 20.890625 24.246094 20.808594 24.246094 20.730469 24.246094 C 20.617188 24.246094 20.503906 24.246094 20.390625 24.242188 C 20.324219 24.242188 20.261719 24.242188 20.195312 24.242188 C 19.929688 24.207031 19.785156 24.097656 19.621094 23.890625 C 19.519531 23.707031 19.507812 23.601562 19.507812 23.394531 C 19.507812 23.34375 19.507812 23.34375 19.503906 23.292969 C 19.503906 23.183594 19.503906 23.074219 19.507812 22.964844 C 19.507812 22.882812 19.507812 22.804688 19.503906 22.722656 C 19.503906 22.503906 19.503906 22.285156 19.503906 22.066406 C 19.507812 21.828125 19.503906 21.59375 19.503906 21.355469 C 19.503906 20.894531 19.503906 20.429688 19.503906 19.96875 C 19.503906 19.589844 19.503906 19.214844 19.503906 18.839844 C 19.503906 18.785156 19.503906 18.730469 19.503906 18.675781 C 19.503906 18.566406 19.503906 18.457031 19.503906 18.347656 C 19.503906 17.328125 19.503906 16.308594 19.507812 15.289062 C 19.507812 14.414062 19.507812 13.539062 19.503906 12.660156 C 19.503906 11.644531 19.503906 10.628906 19.503906 9.613281 C 19.503906 9.503906 19.503906 9.394531 19.503906 9.285156 C 19.503906 9.234375 19.503906 9.179688 19.503906 9.125 C 19.503906 8.75 19.503906 8.375 19.503906 7.996094 C 19.503906 7.539062 19.503906 7.082031 19.503906 6.625 C 19.503906 6.390625 19.507812 6.15625 19.503906 5.921875 C 19.503906 5.707031 19.503906 5.492188 19.507812 5.28125 C 19.507812 5.203125 19.507812 5.125 19.503906 5.046875 C 19.503906 4.941406 19.503906 4.835938 19.507812 4.730469 C 19.507812 4.671875 19.507812 4.613281 19.507812 4.554688 C 19.546875 4.300781 19.691406 4.121094 19.871094 3.945312 C 19.910156 3.902344 19.910156 3.902344 19.953125 3.863281 C 19.980469 3.832031 20.011719 3.804688 20.042969 3.773438 C 20.074219 3.742188 20.105469 3.710938 20.136719 3.679688 C 20.238281 3.578125 20.339844 3.472656 20.445312 3.371094 C 20.515625 3.300781 20.585938 3.226562 20.660156 3.15625 C 20.808594 3.007812 20.957031 2.855469 21.109375 2.707031 C 21.300781 2.515625 21.492188 2.324219 21.683594 2.132812 C 21.832031 1.984375 21.976562 1.835938 22.125 1.691406 C 22.195312 1.617188 22.265625 1.546875 22.335938 1.476562 C 22.4375 1.378906 22.535156 1.28125 22.632812 1.179688 C 22.664062 1.152344 22.691406 1.121094 22.722656 1.09375 C 23.058594 0.757812 23.449219 0.652344 23.902344 0.859375 Z M 23.902344 0.859375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 17.652344 7.109375 C 17.890625 7.339844 17.980469 7.476562 17.992188 7.808594 C 17.996094 7.929688 17.996094 8.046875 17.992188 8.167969 C 17.992188 8.234375 17.992188 8.300781 17.996094 8.367188 C 17.996094 8.550781 17.996094 8.734375 17.996094 8.917969 C 17.992188 9.117188 17.996094 9.316406 17.996094 9.515625 C 17.996094 9.902344 17.996094 10.289062 17.996094 10.679688 C 17.996094 10.992188 17.996094 11.308594 17.996094 11.625 C 17.996094 11.667969 17.996094 11.714844 17.996094 11.761719 C 17.996094 11.851562 17.996094 11.941406 17.996094 12.035156 C 17.996094 12.886719 17.996094 13.742188 17.992188 14.597656 C 17.992188 15.332031 17.992188 16.066406 17.996094 16.796875 C 17.996094 17.648438 17.996094 18.5 17.996094 19.355469 C 17.996094 19.445312 17.996094 19.535156 17.996094 19.625 C 17.996094 19.671875 17.996094 19.714844 17.996094 19.761719 C 17.996094 20.078125 17.996094 20.390625 17.996094 20.707031 C 17.996094 21.089844 17.996094 21.472656 17.996094 21.859375 C 17.996094 22.054688 17.992188 22.25 17.996094 22.445312 C 17.996094 22.625 17.996094 22.804688 17.992188 22.984375 C 17.992188 23.078125 17.996094 23.175781 17.996094 23.269531 C 17.988281 23.789062 17.988281 23.789062 17.773438 24.023438 C 17.550781 24.210938 17.398438 24.242188 17.109375 24.242188 C 17.058594 24.246094 17.058594 24.246094 17.003906 24.246094 C 16.886719 24.246094 16.769531 24.246094 16.648438 24.246094 C 16.566406 24.246094 16.484375 24.246094 16.402344 24.246094 C 16.230469 24.246094 16.0625 24.246094 15.890625 24.246094 C 15.667969 24.242188 15.449219 24.242188 15.230469 24.246094 C 15.0625 24.246094 14.890625 24.246094 14.722656 24.246094 C 14.640625 24.246094 14.558594 24.246094 14.480469 24.246094 C 14.367188 24.246094 14.253906 24.246094 14.140625 24.242188 C 14.074219 24.242188 14.011719 24.242188 13.945312 24.242188 C 13.683594 24.207031 13.542969 24.097656 13.371094 23.902344 C 13.246094 23.664062 13.253906 23.464844 13.257812 23.199219 C 13.257812 23.121094 13.257812 23.121094 13.253906 23.039062 C 13.253906 22.859375 13.253906 22.679688 13.257812 22.5 C 13.253906 22.371094 13.253906 22.242188 13.253906 22.113281 C 13.253906 21.800781 13.253906 21.488281 13.253906 21.175781 C 13.253906 20.921875 13.253906 20.667969 13.253906 20.414062 C 13.253906 20.378906 13.253906 20.339844 13.253906 20.304688 C 13.253906 20.230469 13.253906 20.15625 13.253906 20.082031 C 13.253906 19.394531 13.253906 18.703125 13.257812 18.015625 C 13.257812 17.425781 13.257812 16.832031 13.253906 16.242188 C 13.253906 15.554688 13.253906 14.867188 13.253906 14.179688 C 13.253906 14.109375 13.253906 14.035156 13.253906 13.960938 C 13.253906 13.925781 13.253906 13.890625 13.253906 13.851562 C 13.253906 13.597656 13.253906 13.34375 13.253906 13.089844 C 13.253906 12.75 13.253906 12.40625 13.253906 12.066406 C 13.253906 11.9375 13.253906 11.8125 13.253906 11.6875 C 13.253906 11.515625 13.253906 11.347656 13.257812 11.175781 C 13.257812 11.125 13.253906 11.074219 13.253906 11.023438 C 13.257812 10.660156 13.363281 10.453125 13.621094 10.195312 C 13.660156 10.152344 13.660156 10.152344 13.703125 10.113281 C 13.730469 10.082031 13.761719 10.054688 13.792969 10.023438 C 13.824219 9.992188 13.855469 9.960938 13.886719 9.929688 C 13.988281 9.828125 14.089844 9.722656 14.195312 9.621094 C 14.265625 9.550781 14.335938 9.476562 14.410156 9.40625 C 14.558594 9.257812 14.707031 9.105469 14.859375 8.957031 C 15.050781 8.765625 15.242188 8.574219 15.433594 8.382812 C 15.582031 8.234375 15.726562 8.085938 15.875 7.941406 C 15.945312 7.867188 16.015625 7.796875 16.085938 7.726562 C 16.1875 7.628906 16.285156 7.53125 16.382812 7.429688 C 16.414062 7.402344 16.441406 7.371094 16.472656 7.34375 C 16.808594 7.007812 17.199219 6.902344 17.652344 7.109375 Z M 17.652344 7.109375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 11.402344 13.359375 C 11.59375 13.546875 11.707031 13.691406 11.742188 13.960938 C 11.746094 14.035156 11.746094 14.105469 11.742188 14.179688 C 11.742188 14.222656 11.746094 14.261719 11.746094 14.304688 C 11.746094 14.441406 11.746094 14.578125 11.742188 14.710938 C 11.746094 14.808594 11.746094 14.90625 11.746094 15.003906 C 11.746094 15.269531 11.746094 15.535156 11.746094 15.800781 C 11.746094 16.078125 11.746094 16.355469 11.746094 16.632812 C 11.746094 17.097656 11.746094 17.566406 11.746094 18.03125 C 11.742188 18.570312 11.742188 19.109375 11.746094 19.648438 C 11.746094 20.109375 11.746094 20.574219 11.746094 21.035156 C 11.746094 21.3125 11.746094 21.585938 11.746094 21.863281 C 11.746094 22.125 11.746094 22.382812 11.746094 22.644531 C 11.746094 22.738281 11.746094 22.832031 11.746094 22.929688 C 11.746094 23.058594 11.746094 23.1875 11.742188 23.320312 C 11.742188 23.355469 11.746094 23.394531 11.746094 23.433594 C 11.742188 23.6875 11.683594 23.828125 11.523438 24.023438 C 11.300781 24.210938 11.148438 24.242188 10.859375 24.242188 C 10.824219 24.246094 10.789062 24.246094 10.753906 24.246094 C 10.636719 24.246094 10.519531 24.246094 10.398438 24.246094 C 10.316406 24.246094 10.234375 24.246094 10.152344 24.246094 C 9.980469 24.246094 9.8125 24.246094 9.640625 24.246094 C 9.417969 24.242188 9.199219 24.242188 8.980469 24.246094 C 8.8125 24.246094 8.640625 24.246094 8.472656 24.246094 C 8.390625 24.246094 8.308594 24.246094 8.230469 24.246094 C 8.117188 24.246094 8.003906 24.246094 7.890625 24.242188 C 7.824219 24.242188 7.761719 24.242188 7.695312 24.242188 C 7.429688 24.207031 7.292969 24.09375 7.113281 23.90625 C 6.988281 23.632812 7.003906 23.371094 7.007812 23.074219 C 7.003906 23.007812 7.003906 22.941406 7.003906 22.875 C 7.003906 22.691406 7.003906 22.511719 7.003906 22.328125 C 7.003906 22.140625 7.003906 21.949219 7.003906 21.761719 C 7.003906 21.441406 7.003906 21.121094 7.003906 20.804688 C 7.007812 20.433594 7.007812 20.066406 7.003906 19.699219 C 7.003906 19.382812 7.003906 19.066406 7.003906 18.75 C 7.003906 18.558594 7.003906 18.371094 7.003906 18.183594 C 7.003906 18.003906 7.003906 17.828125 7.003906 17.648438 C 7.007812 17.554688 7.003906 17.457031 7.003906 17.363281 C 7.011719 16.835938 7.011719 16.835938 7.226562 16.601562 C 7.25 16.578125 7.273438 16.550781 7.296875 16.527344 C 7.375 16.441406 7.457031 16.355469 7.542969 16.273438 C 7.574219 16.242188 7.605469 16.210938 7.636719 16.179688 C 7.738281 16.078125 7.839844 15.972656 7.945312 15.871094 C 8.015625 15.800781 8.085938 15.726562 8.160156 15.65625 C 8.308594 15.507812 8.457031 15.355469 8.609375 15.207031 C 8.800781 15.015625 8.992188 14.824219 9.183594 14.632812 C 9.332031 14.484375 9.476562 14.335938 9.625 14.191406 C 9.695312 14.117188 9.765625 14.046875 9.835938 13.976562 C 9.9375 13.878906 10.035156 13.78125 10.132812 13.679688 C 10.164062 13.652344 10.191406 13.621094 10.222656 13.59375 C 10.558594 13.257812 10.949219 13.152344 11.402344 13.359375 Z M 11.402344 13.359375 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(255%,255%,255%);fill-opacity:1;"
|
|
d="M 5.152344 19.609375 C 5.335938 19.789062 5.457031 19.933594 5.492188 20.195312 C 5.492188 20.257812 5.492188 20.324219 5.492188 20.390625 C 5.496094 20.425781 5.496094 20.460938 5.496094 20.496094 C 5.496094 20.613281 5.496094 20.730469 5.496094 20.851562 C 5.496094 20.933594 5.496094 21.015625 5.496094 21.097656 C 5.496094 21.269531 5.496094 21.4375 5.496094 21.609375 C 5.492188 21.832031 5.492188 22.050781 5.496094 22.269531 C 5.496094 22.4375 5.496094 22.609375 5.496094 22.777344 C 5.496094 22.859375 5.496094 22.941406 5.496094 23.019531 C 5.496094 23.132812 5.496094 23.246094 5.492188 23.359375 C 5.492188 23.425781 5.492188 23.488281 5.492188 23.554688 C 5.457031 23.824219 5.34375 23.964844 5.136719 24.136719 C 4.949219 24.234375 4.824219 24.242188 4.609375 24.242188 C 4.574219 24.246094 4.539062 24.246094 4.503906 24.246094 C 4.386719 24.246094 4.269531 24.246094 4.148438 24.246094 C 4.066406 24.246094 3.984375 24.246094 3.902344 24.246094 C 3.730469 24.246094 3.5625 24.246094 3.390625 24.246094 C 3.167969 24.242188 2.949219 24.242188 2.730469 24.246094 C 2.5625 24.246094 2.390625 24.246094 2.222656 24.246094 C 2.140625 24.246094 2.058594 24.246094 1.980469 24.246094 C 1.867188 24.246094 1.753906 24.246094 1.640625 24.242188 C 1.574219 24.242188 1.511719 24.242188 1.445312 24.242188 C 1.183594 24.207031 1.039062 24.085938 0.859375 23.902344 C 0.746094 23.65625 0.734375 23.414062 0.78125 23.144531 C 0.921875 22.90625 1.09375 22.71875 1.292969 22.523438 C 1.324219 22.492188 1.355469 22.460938 1.386719 22.429688 C 1.488281 22.328125 1.589844 22.222656 1.695312 22.121094 C 1.765625 22.050781 1.835938 21.976562 1.910156 21.90625 C 2.058594 21.757812 2.207031 21.605469 2.359375 21.457031 C 2.550781 21.265625 2.742188 21.074219 2.933594 20.882812 C 3.082031 20.734375 3.226562 20.585938 3.375 20.441406 C 3.445312 20.367188 3.515625 20.296875 3.585938 20.226562 C 3.6875 20.128906 3.785156 20.03125 3.882812 19.929688 C 3.914062 19.902344 3.941406 19.871094 3.972656 19.84375 C 4.308594 19.507812 4.699219 19.402344 5.152344 19.609375 Z M 5.152344 19.609375 " />
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
<!-- <v-card class="draggable-card" width="150px" height="150px" color="light" @mousedown=""></v-card> -->
|
|
|
|
<template v-for="(participant, index) in participants" :key="index" :value="index">
|
|
<div v-if="participant.type == 'local' && props.call_type === 'video'" :style="style"
|
|
@mousedown="handleMouseDown" class="box"
|
|
:class="!store.getters.getFloatingWindow ? '' : 'hide-box'">
|
|
<div
|
|
style="position: absolute; right: 6px; top: 3px; background: #ffffff4f; border-radius: 5px;padding-right: 5px;">
|
|
<!-- <svg v-if="signals == 0" width="45px" height="24px" viewBox="0 0 40 24" style="float:right;"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="8" cy="12" r="3" :fill="signals == 0 ? signalIconColor : 'white'" />
|
|
<circle cx="18" cy="12" r="3" :fill="signals == 0 ? 'white' : ''" />
|
|
<circle cx="28" cy="12" r="3" :fill="signals == 0 ? 'white' : ''" />
|
|
<circle cx="38" cy="12" r="3" :fill="signals == 0 ? 'white' : ''" />
|
|
</svg>
|
|
|
|
<svg v-if="signals == 1" width="45px" height="24px" viewBox="0 0 40 24" style="float:right;"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="8" cy="12" r="3" :fill="signals == 1 ? signalIconColor : 'white'" />
|
|
<circle cx="18" cy="12" r="3" :fill="signals == 1 ? signalIconColor : 'white'" />
|
|
<circle cx="28" cy="12" r="3" :fill="signals == 1 ? 'white' : ''" />
|
|
<circle cx="38" cy="12" r="3" :fill="signals == 1 ? 'white' : ''" />
|
|
</svg>
|
|
|
|
<svg v-if="signals == 2" width="45px" height="24px" viewBox="0 0 40 24" style="float:right;"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="8" cy="12" r="3" :fill="signals == 2 ? signalIconColor : 'white'" />
|
|
<circle cx="18" cy="12" r="3" :fill="signals == 2 ? signalIconColor : 'white'" />
|
|
<circle cx="28" cy="12" r="3" :fill="signals == 2 ? signalIconColor : 'white'" />
|
|
<circle cx="38" cy="12" r="3" :fill="signals == 2 ? 'white' : ''" />
|
|
</svg>
|
|
|
|
<svg v-if="signals == 3" width="45px" height="24px" viewBox="0 0 40 24" style="float:right;"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="8" cy="12" r="3" :fill="signals == 3 ? signalIconColor : 'white'" />
|
|
<circle cx="18" cy="12" r="3" :fill="signals == 3 ? signalIconColor : 'white'" />
|
|
<circle cx="28" cy="12" r="3" :fill="signals == 3 ? signalIconColor : 'white'" />
|
|
<circle cx="38" cy="12" r="3" :fill="signals == 3 ? signalIconColor : 'white'" />
|
|
</svg> -->
|
|
<VIcon :color="camIconColor" :icon="camIcon"></VIcon>
|
|
<VIcon :color="muteIconColor" :icon="muteIcon"></VIcon>
|
|
</div>
|
|
|
|
|
|
<video class="small-video" ref="participant.video" :id="`video-` + participant.id"></video>
|
|
<audio ref="participant.audio" :id="`audio-` + participant.id"></audio>
|
|
</div>
|
|
<div class="remote-box" v-if="participant.type == 'remote'">
|
|
<div v-if="props.call_type === 'audio'" class="audio-call-icon">
|
|
<VIcon color="grey" icon="mdi-account-circle"></VIcon>
|
|
</div>
|
|
<div v-if="props.call_type === 'video' && patientCamDisabled" class="audio-call-icon">
|
|
<VIcon color="grey" icon="mdi-account-circle"></VIcon>
|
|
</div>
|
|
<div v-if="userReconnecting" class="audio-call-icon">
|
|
<VIcon color="grey" icon="mdi-account-circle"></VIcon>
|
|
<div style="font-size: 14px;color: white;">Re-connecting...</div>
|
|
</div>
|
|
<video class="large-video" ref="large_video" :id="`video-` + participant.id"></video>
|
|
<audio ref="participant.audio" :id="`audio-` + participant.id"></audio>
|
|
</div>
|
|
</template>
|
|
<!-- <VRow class="video-bg" v-if="callStart">
|
|
<VCol cols="12" md="12"> -->
|
|
<div class="text-center mb-2 cam-buttons" v-if="callStart && !store.getters.getFloatingWindow"
|
|
:class="isMobile && isAgent ? 'cam-btn-btm' : ''">
|
|
<p><span class="btn-transparent muted-text" v-if="patientCamDisabled && isAgent">
|
|
<VIcon color="red" icon="mdi-video-off"></VIcon> Patient Camera
|
|
Off
|
|
</span></p>
|
|
<p><span class="btn-transparent muted-text" v-if="patientMuted && isAgent">
|
|
<VIcon color="red" icon="mdi-microphone-off"></VIcon> Patient Microphone
|
|
Muted
|
|
</span></p>
|
|
<v-btn v-if="isMobile && props.call_type === 'video'" rounded="xl" class="mr-2 btn-transparent"
|
|
color="white" icon="mdi-camera-flip" @click="flipCamera()"></v-btn>
|
|
<v-btn v-if="!isMobile && isAgent" class="mr-2 btn-transparent float-left ml-10" :color="sideIconColor"
|
|
:icon="sideIcon" @click="toggleSideBar()"></v-btn>
|
|
<v-btn v-if="isMobile" class="mr-2 btn-transparent" color="white" icon="mdi-message"
|
|
@click="showMessageBox()"></v-btn>
|
|
<v-btn v-if="props.call_type === 'video' && !patientCamDisabled && isAgent" class="mr-2 btn-transparent"
|
|
color="white" icon="mdi-camera" @click="captureImage()" title="Take Photo"></v-btn>
|
|
<v-btn v-if="props.call_type === 'video'" class="mr-2"
|
|
:class="isCamDisabled ? 'cam-off' : 'btn-transparent'" :color="camIconColor" :icon="camIcon"
|
|
@click="cameraToggle()" :title="isCamDisabled ? 'Turn on camera' : 'Turn off camera'"></v-btn>
|
|
<v-btn class="mr-2" :class="isMuted ? 'muted' : 'btn-transparent'" :color="muteIconColor"
|
|
:icon="muteIcon" @click="muteMicrophone()"
|
|
:title="isMuted ? 'Turn on mic' : 'Turn off mic'"></v-btn>
|
|
<v-btn-toggle v-if="!isMobile" v-model="toggle" divided rounded="xl" class="mr-2">
|
|
<v-row no-gutters>
|
|
|
|
<v-menu :location="top">
|
|
<template v-slot:activator="{ props }">
|
|
<v-btn class="btn-transparent" color="white" v-bind="props" icon="mdi-dots-vertical"
|
|
title="Devices">
|
|
</v-btn>
|
|
</template>
|
|
<v-list>
|
|
<v-list-item>
|
|
<v-list-item-title v-if="props.call_type === 'video'">
|
|
|
|
<v-menu :location="top">
|
|
<template v-slot:activator="{ props }">
|
|
<v-btn color="white" v-bind="props">Camera
|
|
<VIcon icon="mdi-chevron-up"></VIcon>
|
|
</v-btn>
|
|
</template>
|
|
<v-list>
|
|
<v-list-item v-for="(camera, index) in cameras" :key="index"
|
|
:value="camera.deviceId" @click="selectCamera(camera.deviceId)">
|
|
<v-list-item-title>
|
|
<VIcon color="green" icon="mdi-check"
|
|
v-if="getActiveCamDevice() == camera.deviceId"></VIcon>
|
|
{{ camera.label }}
|
|
</v-list-item-title>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-menu>
|
|
</v-list-item-title>
|
|
<v-list-item-title>
|
|
|
|
<v-menu :location="top">
|
|
<template v-slot:activator="{ props }">
|
|
<v-btn color="white" v-bind="props">Microphone
|
|
<VIcon icon="mdi-chevron-up"></VIcon>
|
|
</v-btn>
|
|
</template>
|
|
<v-list>
|
|
<v-list-item v-for="(microphone, index) in microphones" :key="index"
|
|
:value="microphone.deviceId"
|
|
@click="selectMicrophone(microphone.deviceId)">
|
|
<v-list-item-title>
|
|
<VIcon color="green" icon="mdi-check"
|
|
v-if="getActiveMicDevice() == microphone.deviceId">
|
|
</VIcon>
|
|
{{ microphone.label }}
|
|
</v-list-item-title>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-menu>
|
|
</v-list-item-title>
|
|
<v-list-item-title>
|
|
|
|
<v-menu :location="top">
|
|
<template v-slot:activator="{ props }">
|
|
<v-btn color="white" v-bind="props">Speaker
|
|
<VIcon icon="mdi-chevron-up"></VIcon>
|
|
</v-btn>
|
|
</template>
|
|
<v-list>
|
|
<v-list-item v-for="(speaker, index) in speakers" :key="index"
|
|
:value="speaker.deviceId" @click="selectSpeaker(speaker.deviceId)">
|
|
<v-list-item-title>
|
|
<VIcon color="green" icon="mdi-check"
|
|
v-if="getActiveSpeakerDevice() == speaker.deviceId">
|
|
</VIcon>
|
|
{{ speaker.label }}
|
|
</v-list-item-title>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-menu>
|
|
</v-list-item-title>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-menu>
|
|
</v-row>
|
|
</v-btn-toggle>
|
|
<v-btn rounded="xl" class=" btn-endcall" color="white" icon="mdi-phone-hangup" @click="endCall()"
|
|
title="End Call"></v-btn>
|
|
<v-btn v-if="!isMobile" class="mr-2 btn-transparent" :class="isMobile ? 'ml-2' : 'float-right mr-10'"
|
|
:color="screenIconColor" :icon="screenIcon" @click="toggleFullscreen()"></v-btn>
|
|
</div>
|
|
<!-- </VCol>
|
|
</VRow> -->
|
|
</div>
|
|
|
|
<!-- <div id="jaas-container" >
|
|
</div> -->
|
|
<!-- Show the iframe when countdown reaches 1 -->
|
|
<!-- <iframe v-if="showIframe" ref="myIframe" :src="responseUrl" width="100%" height="400" style="border:0"></iframe>
|
|
<div v-else>
|
|
Loading iframe...
|
|
</div> -->
|
|
</VCard>
|
|
<v-card v-if="showMessage && !store.getters.getFloatingWindow" :class="isMobile ? 'wid-mob' : 'wid-desk'"
|
|
class="chatbox" :style="{ bottom: '0px', right: '24px', overflow: `hidden` }">
|
|
<v-card-title class="headline">
|
|
<small>View Chat </small>
|
|
<a v-if="isMobile" icon @click="hideMessageBox" class="float-right">
|
|
<v-icon>{{ isOpen ? 'mdi-chevron-down' : 'mdi-chevron-up' }}</v-icon>
|
|
</a>
|
|
<a v-if="!isMobile" icon @click="toggleChat" class="float-right">
|
|
<v-icon>{{ isOpen ? 'mdi-chevron-down' : 'mdi-chevron-up' }}</v-icon>
|
|
</a>
|
|
</v-card-title>
|
|
<v-divider></v-divider>
|
|
<div v-if="isOpen" ref="messageContainer">
|
|
<v-card-text style="min-height: 250px;" class="message-container">
|
|
<div v-for="message in messages" :key="message.id"
|
|
:class="message.sender === 'user' ? 'user-message' : 'other-message'" ref="message">
|
|
{{ message.text }}
|
|
</div>
|
|
</v-card-text>
|
|
<v-divider></v-divider>
|
|
<v-card-actions class="pb-2 pt-2" style="display: flex; align-items: center;">
|
|
<v-text-field v-model="newMessage" label="" outlined @keydown.enter.prevent="sendMessage"
|
|
style="flex: 1;"></v-text-field>
|
|
<v-btn @click="sendMessage" size="small" flat class="btn btn-primary"
|
|
style="background-color: #696cff; color: white; height: 55px;">
|
|
<v-icon color="white">{{ 'mdi-send' }}</v-icon>
|
|
</v-btn>
|
|
</v-card-actions>
|
|
</div>
|
|
</v-card>
|
|
</template>
|
|
<style scoped>
|
|
.hide-box {
|
|
display: none;
|
|
}
|
|
|
|
.info-container {
|
|
display: flex;
|
|
align-items: center;
|
|
/* Aligns items vertically center */
|
|
justify-content: start;
|
|
/* Aligns items to the start of the flex container */
|
|
gap: 10px;
|
|
/* Adds space between each item */
|
|
padding-left: 10px;
|
|
margin: 0;
|
|
}
|
|
|
|
.pt-info {
|
|
position: relative;
|
|
/* top: 5px; */
|
|
margin: 0px;
|
|
width: 100%;
|
|
z-index: 99;
|
|
border-radius: 0px;
|
|
background-color: #6d7176;
|
|
}
|
|
|
|
.muted-text {
|
|
padding: 5px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.call-quality-indicator {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
position: fixed;
|
|
margin-top: 10px;
|
|
right: 10px;
|
|
z-index: 999;
|
|
padding: 5px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.signal-bar {
|
|
width: 5px;
|
|
height: 15px;
|
|
margin-right: 2px;
|
|
background-color: #ccc;
|
|
}
|
|
|
|
.signal-bar.active {
|
|
background-color: #4caf50;
|
|
}
|
|
|
|
.audio-call-icon {
|
|
text-align: center;
|
|
margin: 0 auto;
|
|
position: absolute;
|
|
top: calc(35% - 10px);
|
|
width: 100%;
|
|
font-size: 80px;
|
|
}
|
|
|
|
.cam-btn-btm {
|
|
bottom: 85px !important;
|
|
}
|
|
|
|
.wid-mob {
|
|
width: 87%;
|
|
}
|
|
|
|
.wid-desk {
|
|
width: 300px;
|
|
}
|
|
|
|
.chatbox {
|
|
position: fixed;
|
|
max-height: 400px;
|
|
overflow-y: auto;
|
|
z-index: 9999;
|
|
}
|
|
|
|
.message-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.message-container {
|
|
max-height: 250px;
|
|
/* Set maximum height */
|
|
overflow-y: auto;
|
|
/* Enable vertical scrollbar */
|
|
}
|
|
|
|
.user-message {
|
|
align-self: flex-end;
|
|
background-color: #007bff;
|
|
color: #fff;
|
|
padding: 5px 10px;
|
|
border-radius: 10px;
|
|
margin: 5px;
|
|
}
|
|
|
|
.other-message {
|
|
align-self: flex-start;
|
|
background-color: #f0f0f0;
|
|
color: #333;
|
|
padding: 5px 10px;
|
|
border-radius: 10px;
|
|
margin: 5px;
|
|
}
|
|
|
|
.btn-transparent {
|
|
background-color: #00000063 !important;
|
|
color: white !important;
|
|
}
|
|
|
|
.cam-buttons {
|
|
position: absolute;
|
|
bottom: 50px;
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
z-index: 999
|
|
}
|
|
|
|
.fullscreen-div {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #f0f0f0;
|
|
transition: all 0.5s ease;
|
|
}
|
|
|
|
.fullscreen {
|
|
/* position: fixed; */
|
|
/* top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%; */
|
|
}
|
|
|
|
/* Show navbar when not in full screen */
|
|
.layout-navbar:not(.fullscreen) {
|
|
display: block;
|
|
}
|
|
|
|
/* Hide navbar when in full screen */
|
|
.layout-navbar.fullscreen {
|
|
display: none;
|
|
}
|
|
|
|
.cam-off {
|
|
background-color: red;
|
|
color: white
|
|
}
|
|
|
|
.muted {
|
|
background-color: red;
|
|
color: white
|
|
}
|
|
|
|
.btn-endcall {
|
|
background-color: #9702022b !important;
|
|
color: red !important;
|
|
}
|
|
|
|
.recording-badge {
|
|
text-align: right;
|
|
color: white;
|
|
margin-right: 10px;
|
|
background: red;
|
|
min-width: 10%;
|
|
float: right;
|
|
border-radius: 25px;
|
|
padding-right: 3px;
|
|
z-index: 10;
|
|
position: relative;
|
|
}
|
|
|
|
.video-bg {
|
|
background-color: #4d5d67;
|
|
}
|
|
|
|
.small-screen {
|
|
background-color: white;
|
|
min-height: 150px;
|
|
max-width: 24%;
|
|
}
|
|
|
|
.livekit-container {
|
|
/* min-height: 100vh; */
|
|
/* background-color: #303a40; */
|
|
position: relative;
|
|
}
|
|
|
|
.draggable-card {
|
|
cursor: move;
|
|
position: relative;
|
|
}
|
|
|
|
.box {
|
|
position: absolute;
|
|
cursor: move;
|
|
width: 150px;
|
|
height: 150px;
|
|
background: #313131;
|
|
border-radius: 10px;
|
|
margin-left: 10px;
|
|
z-index: 2;
|
|
}
|
|
|
|
.large-video {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
|
|
.small-video {
|
|
max-width: 100%;
|
|
height: 100%;
|
|
max-height: 100%;
|
|
width: auto;
|
|
z-index: 9;
|
|
}
|
|
|
|
.remote-box {
|
|
position: absolute;
|
|
z-index: 1;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style>
|