Statistics
| Branch: | Revision:

janus-gateway / html / echotest.html @ 1f44763c

History | View | Annotate | Download (6.1 KB)

1 be35facb meetecho
<!DOCTYPE html>
2
<html xmlns="http://www.w3.org/1999/xhtml">
3
<head>
4
<meta charset="utf-8">
5
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
6
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
7
<title>Janus WebRTC Gateway: Echo Test</title>
8 2c7dab14 joshdickson40
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/webrtc-adapter/3.4.3/adapter.min.js" ></script>
9 5ca69d0d Lorenzo Miniero
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js" ></script>
10
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.blockUI/2.70/jquery.blockUI.min.js" ></script>
11
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.2/js/bootstrap.min.js"></script>
12
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.1.0/bootbox.min.js"></script>
13
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/spin.js/2.3.2/spin.min.js"></script>
14 be35facb meetecho
<script type="text/javascript" src="janus.js" ></script>
15
<script type="text/javascript" src="echotest.js"></script>
16 6d795273 Lorenzo Miniero
<script>
17
        $(function() {
18
                $(".navbar-static-top").load("navbar.html", function() {
19
                        $(".navbar-static-top li.dropdown").addClass("active");
20
                        $(".navbar-static-top a[href='echotest.html']").parent().addClass("active");
21
                });
22
                $(".footer").load("footer.html");
23
        });
24
</script>
25 5ca69d0d Lorenzo Miniero
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/cerulean/bootstrap.min.css" type="text/css"/>
26 be35facb meetecho
<link rel="stylesheet" href="css/demo.css" type="text/css"/>
27 5ca69d0d Lorenzo Miniero
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.2/css/font-awesome.min.css" type="text/css"/>
28 4b12fd8e meetecho
</head>
29 be35facb meetecho
<body>
30
31 ddc1f702 meetecho
<a href="https://github.com/meetecho/janus-gateway"><img style="position: absolute; top: 0; left: 0; border: 0; z-index: 1001;" src="https://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png" alt="Fork me on GitHub"></a>
32 be35facb meetecho
33
<nav class="navbar navbar-default navbar-static-top">
34
</nav>
35
36
<div class="container">
37
        <div class="row">
38
                <div class="col-md-12">
39
                        <div class="page-header">
40
                                <h1>Plugin Demo: Echo Test
41 1c402087 Pierce Lopez
                                        <button class="btn btn-default" autocomplete="off" id="start">Start</button>
42 be35facb meetecho
                                </h1>
43
                        </div>
44 cfd5c0d6 meetecho
                        <div class="container" id="details">
45
                                <div class="row">
46
                                        <div class="col-md-12">
47
                                                <h3>Demo details</h3>
48
                                                <p>This Echo Test demo just blindly sends you back whatever you
49
                                                send to it. You're basically attached to yourself, and so your audio
50
                                                and video you send to the gateway are echoed back to you. The same
51
                                                is done for RTCP packets as well, with the information properly updated.</p>
52
                                                <p>The demo also provides a few controls to manipulate the media
53
                                                before you send them. You can mute audio and video, for instance,
54
                                                which will tell the gateway to drop the frames and not echo them
55
                                                back to you. You can also try and cap the bitrate: such control
56
                                                will tell the gateway to manipulate the RTCP REMB packets passing
57 a6c2572b Lorenzo Miniero
                                                through, in order to simulate a bandwidth limitation.</p>
58 a3d13e20 meetecho
                                                <p>Finally, this demo also includes Data Channels: whatever you
59
                                                write in the text box under your local video, will be sent via
60
                                                Data Channels to the plugins, modified by adding a fixed prefix,
61
                                                and sent back to you in the text area below the remote video.</p>
62 3d95072f Lorenzo Miniero
                                                <div class="alert alert-info">This demo, as all the others, for the
63
                                                sake of simplicity accesses the default devices you have available on
64
                                                your machine. If you're interested in a demo that shows you how you
65
                                                can select specific devices with <code>janus.js</code>, open the
66 9df683d5 Lorenzo Miniero
                                                <a class="alert-link" href="devicetest.html">Devices</a> demo instead.</div>
67 cfd5c0d6 meetecho
                                                <p>Press the <code>Start</code> button above to launch the demo.</p>
68
                                        </div>
69
                                </div>
70
                        </div>
71 be35facb meetecho
                        <div class="container hide" id="videos">
72
                                <div class="row">
73
                                        <div class="col-md-6">
74
                                                <div class="panel panel-default">
75
                                                        <div class="panel-heading">
76 8878e296 meetecho
                                                                <h3 class="panel-title">Local Stream
77 be35facb meetecho
                                                                        <div class="btn-group btn-group-xs pull-right hide">
78 7c527257 meetecho
                                                                                <button class="btn btn-danger" autocomplete="off" id="toggleaudio">Disable audio</button>
79
                                                                                <button class="btn btn-danger" autocomplete="off" id="togglevideo">Disable video</button>
80 be35facb meetecho
                                                                                <div class="btn-group btn-group-xs">
81 7c527257 meetecho
                                                                                        <button id="bitrateset" autocomplete="off" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
82 be35facb meetecho
                                                                                                Bandwidth<span class="caret"></span>
83
                                                                                        </button>
84
                                                                                        <ul id="bitrate" class="dropdown-menu" role="menu">
85
                                                                                                <li><a href="#" id="0">No limit</a></li>
86
                                                                                                <li><a href="#" id="128">Cap to 128kbit</a></li>
87
                                                                                                <li><a href="#" id="256">Cap to 256kbit</a></li>
88
                                                                                                <li><a href="#" id="512">Cap to 512kbit</a></li>
89
                                                                                                <li><a href="#" id="1024">Cap to 1mbit</a></li>
90
                                                                                                <li><a href="#" id="1500">Cap to 1.5mbit</a></li>
91
                                                                                                <li><a href="#" id="2000">Cap to 2mbit</a></li>
92
                                                                                        </ul>
93
                                                                                </div>
94
                                                                        </div>
95
                                                                </h3>
96
                                                        </div>
97
                                                        <div class="panel-body" id="videoleft"></div>
98
                                                </div>
99 a3d13e20 meetecho
                                                <div class="input-group margin-bottom-sm">
100
                                                        <span class="input-group-addon"><i class="fa fa-cloud-upload fa-fw"></i></span>
101 7c527257 meetecho
                                                        <input class="form-control" type="text" placeholder="Write a DataChannel message" autocomplete="off" id="datasend" onkeypress="return checkEnter(event);" disabled></input>
102 a3d13e20 meetecho
                                                </div>
103 be35facb meetecho
                                        </div>
104
                                        <div class="col-md-6">
105
                                                <div class="panel panel-default">
106
                                                        <div class="panel-heading">
107 8878e296 meetecho
                                                                <h3 class="panel-title">Remote Stream <span class="label label-primary hide" id="curres"></span> <span class="label label-info hide" id="curbitrate"></span></h3>
108 be35facb meetecho
                                                        </div>
109
                                                        <div class="panel-body" id="videoright"></div>
110
                                                </div>
111 a3d13e20 meetecho
                                                <div class="input-group margin-bottom-sm">
112
                                                        <span class="input-group-addon"><i class="fa fa-cloud-download fa-fw"></i></span>
113
                                                        <input class="form-control" type="text" id="datarecv" disabled></input>
114
                                                </div>
115 be35facb meetecho
                                        </div>
116
                                </div>
117
                        </div>
118
                </div>
119
        </div>
120
121
        <hr>
122
        <div class="footer">
123
        </div>
124
</div>
125
126
</body>
127
</html>