@smartrep/video-widget
Version:
Client side library to load the video widget
85 lines (79 loc) • 2.22 kB
HTML
<html>
<head>
<title>VideoChat - Dev</title>
<link rel="icon" type="image/x-icon" href="cropped-chatbot-32x32 (1).png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
body,
html {
height: 100%;
margin: 0;
font-family: Arial, Helvetica, sans-serif;
}
* {
box-sizing: border-box;
}
.bg-image {
background-color: darkgrey;
height: 100%;
/* Center and scale the image nicely */
background-position: left top;
background-repeat: round;
background-size: cover;
}
/* Position text in the middle of the page/image */
.bg-text {
background-color: rgb(0, 0, 0);
/* Fallback color */
background-color: rgba(0, 0, 0, 0.4);
/* Black w/opacity/see-through */
color: white;
font-weight: bold;
border: 3px solid #f1f1f1;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 2;
width: 80%;
padding: 20px;
text-align: center;
}
</style>
</head>
<body>
<script src="./sr-vw.js" type="module" defer></script>
<!-- Example on how to change the font style of buttons -->
<!-- <style>
/* Change the first button font */
#sr-list-choices li:first-child {
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
</style> -->
<script>
window.addEventListener('load', function () {
var SOCKET_URL = 'nextgen-dev.smartrep.gr:11505';
var SOCKET_PATH = '/socket.io';
window.SRVideoWidget.init({
socket: {
url: SOCKET_URL,
path: SOCKET_PATH,
},
choicesDelay: 2000,
welcomeText: 'Click here',
freetextPlaceholder: 'Please type your inquiry',
controls: {
show: {
home: true,
download: true,
arrows: true,
replay: true,
volume: true,
},
},
});
});
</script>
</body>
</html>