realtime-pluginfree-calls/index.html

﻿<!DOCTYPE html>
<html lang="en">
<head>
<title>WebRTC 1:1 Calls | Muaz Khan</title>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
    
<meta name="description" content="WebRTC One-to-One i.e. 1:1 audio/video/screen calls | Muaz Khan" />
<meta name="keywords" content="WebRTC,Audio,Video,Screen,One-to-One,1:1,Calls" />
    
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<link rel="author" type="text/html" href="https://plus.google.com/+MuazKhan">
<meta name="author" content="Muaz Khan">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<link href='https://fonts.googleapis.com/css?family=Noticia+Text' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="style.css">
</head>

<body>
<div class="alert-box">
	<div class="alert-box-header">
		<div class="icon alert-box-close-button"></div>
		<h2>Alert Box</h2>
	</div>
	<div class="alert-box-content"></div>
</div>

<aside class="tool-box">
	<div class="icon camera-icon" title="audio+video"></div>
	<div class="icon voice-icon" title="audio-only"></div>
	<div class="icon screen-icon" title="only-screen"></div>
</aside>

<section class="call-control-section">
    <div class="icon voice"></div>
    <div class="icon video"></div>
    <div class="icon drop-call"></div>
</section>
	
<section class="center-section">
	
	<div class="main-preview">
		<img id="images-video-container-png" src="https://i.imgur.com/5q1nC6j.png?1">
	</div>
	
	<aside class="chat-section">
		<div class="chat-output"></div>
		<div class="chat-input">
			<input type="text" placeholder="text chat" disabled>
		</div>
	</aside>
</section>

<div class="smaller-preview">
	<img src="images/call-button-bigger.png">
</div>

<audio id="message-sound" src="https://webrtcweb.com/calls/message-tone.mp3"></audio>

<script src="https://www.webrtc-experiment.com/socket.io.js"></script>
<script src="js/PeerConnection.js"></script>
<script src="js/linkify.js"></script>

<!-- larger images can be linked as Data-URIs; no CORS issue here! -->
<script src="https://webrtcweb.com/calls/js/getBackgroundImage.js"></script>

<script src="js/script.js"></script>
</body>
</html>