104 lines
3.0 KiB
Plaintext
104 lines
3.0 KiB
Plaintext
@page "{Transaction_UID}"
|
|
@using System.Text.Json
|
|
@model EnotaryoPH.Web.Pages.Participant.VideoCall.RoomModel
|
|
@{
|
|
Layout = "_Blank";
|
|
}
|
|
|
|
@section Head {
|
|
<style>
|
|
.video-container {
|
|
position: relative;
|
|
padding-bottom: 56.25%; /* 16:9 aspect ratio */
|
|
background: #000;
|
|
border: 2px solid #444;
|
|
|
|
width: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.video-container video {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover; /* This will maintain the video's original aspect ratio and crop if necessary */
|
|
}
|
|
|
|
.video-element {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
}
|
|
|
|
.participant-name {
|
|
position: absolute;
|
|
bottom: 10px;
|
|
left: 10px;
|
|
color: white;
|
|
background: rgba(0,0,0,0.5);
|
|
padding: 2px 8px;
|
|
border-radius: 4px;
|
|
z-index: 1;
|
|
}
|
|
|
|
.controls {
|
|
position: fixed;
|
|
bottom: 20px;
|
|
left: 50%;
|
|
/* transform: translateX(-50%); */
|
|
background: rgba(0,0,0,0.8);
|
|
padding: 10px;
|
|
border-radius: 20px;
|
|
}
|
|
|
|
.participant-col {
|
|
transition: all 0.3s ease;
|
|
|
|
display:flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
</style>
|
|
}
|
|
|
|
<div class="container-fluid py-3" id="videoGrid-container">
|
|
<div class="d-flex mb-1">
|
|
<div>
|
|
<span>32:04</span>
|
|
</div>
|
|
<div class="flex-fill"></div>
|
|
<div>
|
|
<a href="#" id="ViewDocument" class="btn btn-sm btn-secondary">View Document</a>
|
|
<a href="#" id="Approve" class="btn btn-sm btn-success">Approve</a>
|
|
<a href="#" id="Reject" class="btn btn-sm btn-danger">Reject</a>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="row g-2" id="VideoGrid">
|
|
</div>
|
|
</div>
|
|
|
|
<template id="templateVideo">
|
|
<div class="video-container bg-light">
|
|
<div class="participant-name">Participant Name</div>
|
|
</div>
|
|
</template>
|
|
|
|
<input type="hidden" id="Participants" value="@(System.Web.HttpUtility.JavaScriptStringEncode(JsonSerializer.Serialize(Model.Participants)).Replace("\\", ""))" />
|
|
<input type="hidden" id="CommunicationUserToken" value="@Model.CommunicationUserToken" />
|
|
<input type="hidden" id="CommunicationUserId" value="@Model.CommunicationUserId" />
|
|
<input type="hidden" id="CommunicationRoomId" value="@Model.CommunicationRoomId" />
|
|
|
|
<form method="post" asp-page-handler="StartRecording">
|
|
<input type="hidden" asp-for="ServerCallID" />
|
|
<input type="hidden" asp-for="Transaction_UID" />
|
|
</form>
|
|
|
|
@section Scripts {
|
|
<script type="text/javascript" src="/dist/_jfa.js"></script>
|
|
<script src="~/Pages/Participant/VideoCall/Room.cshtml.js" asp-append-version="true"></script>
|
|
}
|