99 أسطر
4.0 KiB
HTML
99 أسطر
4.0 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
<!-- Title and Icon -->
|
|
|
|
<title id="title">MiroTalk RTMP Streamer</title>
|
|
<link id="icon" rel="shortcut icon" href="../images/logo.svg" />
|
|
<link id="appleTouchIcon" rel="apple-touch-icon" href="../images/logo.svg" />
|
|
|
|
<!-- Meta Information -->
|
|
|
|
<meta charset="utf-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
|
|
<meta
|
|
id="description"
|
|
name="description"
|
|
content="MiroTalk SFU powered by WebRTC and mediasoup, Real-time Simple Secure Fast video calls, messaging and screen sharing capabilities in the browser."
|
|
/>
|
|
<meta
|
|
id="keywords"
|
|
name="keywords"
|
|
content="webrtc, miro, mediasoup, mediasoup-client, self hosted, voip, sip, real-time communications, chat, messaging, meet, webrtc stun, webrtc turn, webrtc p2p, webrtc sfu, video meeting, video chat, video conference, multi video chat, multi video conference, peer to peer, p2p, sfu, rtc, alternative to, zoom, microsoft teams, google meet, jitsi, meeting"
|
|
/>
|
|
|
|
<!-- https://ogp.me -->
|
|
|
|
<meta id="ogType" property="og:type" content="app-webrtc" />
|
|
<meta id="ogSiteName" property="og:site_name" content="MiroTalk SFU" />
|
|
<meta id="ogTitle" property="og:title" content="Click the link to make a call." />
|
|
<meta
|
|
id="ogDescription"
|
|
property="og:description"
|
|
content="MiroTalk SFU calling provides real-time video calls, messaging and screen sharing."
|
|
/>
|
|
<meta id="ogImage" property="og:image" content="https://sfu.mirotalk.com/images/mirotalksfu.png" />
|
|
<meta id="ogUrl" property="og:url" content="https://sfu.mirotalk.com" />
|
|
|
|
<!-- StyleSheet -->
|
|
|
|
<link rel="stylesheet" href="../css/Root.css" />
|
|
<link rel="stylesheet" href="../css/RtmpStreamer.css" />
|
|
|
|
<!-- Axios -->
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
|
|
|
|
<script defer src="https://cdn.jsdelivr.net/npm/xss/dist/xss.min.js"></script>
|
|
|
|
<!-- JS scripts -->
|
|
<script defer src="../js/Brand.js"></script>
|
|
<script defer src="../js/RtmpStreamer.js"></script>
|
|
</head>
|
|
<body>
|
|
<div id="popup" class="popup hidden">
|
|
<span id="popupMessage"></span>
|
|
<button id="closePopup">X</button>
|
|
</div>
|
|
<div class="container">
|
|
<h1>MiroTalk RTMP Streamer</h1>
|
|
<div class="input-group-inline">
|
|
<input
|
|
id="apiSecret"
|
|
type="password"
|
|
value="mirotalkRtmpApiSecret"
|
|
placeholder="API Secret"
|
|
title="Enter the API secret here"
|
|
/>
|
|
</div>
|
|
<div class="input-group-inline">
|
|
<input
|
|
id="rtmp"
|
|
type="text"
|
|
value=""
|
|
placeholder="rtmp://server:port/app/streamKey"
|
|
readonly
|
|
title="This is your RTMP live URL. It cannot be edited."
|
|
/>
|
|
<button id="copy" title="Click to copy the RTMP URL">Copy</button>
|
|
</div>
|
|
|
|
<video id="video" width="640" height="480"></video>
|
|
|
|
<div class="button-group">
|
|
<button id="startCamera" title="Click to start camera streaming">Start Camera Streaming</button>
|
|
<button id="startScreen" title="Click to start screen streaming">Start Screen Streaming</button>
|
|
<button id="stop" disabled title="Click to stop streaming">Stop Streaming</button>
|
|
</div>
|
|
</div>
|
|
<footer>
|
|
<p>© 2024 MiroTalk SFU, all rights reserved</p>
|
|
</footer>
|
|
</body>
|
|
</html>
|