Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1219)

Side by Side Diff: chrome/test/data/webrtc/manual/peerconnection.html

Issue 368043004: Tidied up some divs and css classes + improved usability (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: nit Created 6 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | chrome/test/data/webrtc/manual/peerconnection_manual.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> 1 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
2 <html> 2 <html>
3 <head> 3 <head>
4 <title>WebRTC PeerConnection Manual Test</title> 4 <title>WebRTC PeerConnection Manual Test</title>
5 <!-- Load the polyfill to switch-hit between Chrome and Firefox --> 5 <!-- Load the polyfill to switch-hit between Chrome and Firefox -->
6 <script src="../adapter.js"></script> 6 <script src="../adapter.js"></script>
7 <script src="peerconnection_manual.js"></script> 7 <script src="peerconnection_manual.js"></script>
8 <link rel="StyleSheet" href="stylesheet.css"> 8 <link rel="StyleSheet" href="stylesheet.css">
9 <meta charset="utf-8"> 9 <meta charset="utf-8">
10 </head> 10 </head>
11 <body> 11 <body>
12 12
13 <div id="wrapper"> 13 <div id="wrapper">
14 <div id="getusermedia-input"> 14 <div id="header">
15 GetUserMedia <a href="http://goo.gl/V7cZg">MediaStreamConstraints</a>: 15 GetUserMedia <a href="http://goo.gl/V7cZg">MediaStreamConstraints</a>:
16 <input type="text" id="getusermedia-constraints"> 16 <input type="text" id="getusermedia-constraints" wrap="soft">
17 Audio<input type="checkbox" id="audio" checked 17 Audio<input type="checkbox" id="audio" checked
18 onclick="updateGetUserMediaConstraints();"/> 18 onclick="updateGetUserMediaConstraints();"/>
19 Video<input type="checkbox" id="video" checked 19 Video<input type="checkbox" id="video" checked
20 onclick="updateGetUserMediaConstraints();"/> 20 onclick="updateGetUserMediaConstraints();"/>
21 Screen capture<input type="checkbox" id="screencapture" 21 Screen capture<input type="checkbox" id="screencapture"
22 onclick="updateGetUserMediaConstraints();"/> 22 onclick="updateGetUserMediaConstraints();"/>
23 <button id="re-request" onclick="getUserMediaFromHere();"> 23 <button class="button-green" id="re-request"
24 Request GetUserMedia</button><br/> 24 onclick="getUserMediaFromHere();">Request GetUserMedia</button><br/>
25 Audio source <select class="drop-down" id="audiosrc" 25 Audio source <select class="drop-down" id="audiosrc"
26 onchange="updateGetUserMediaConstraints();"></select> 26 onchange="updateGetUserMediaConstraints();"></select>
27 Video source <select class="drop-down" id="videosrc" 27 Video source <select class="drop-down" id="videosrc"
28 onchange="updateGetUserMediaConstraints();"></select> 28 onchange="updateGetUserMediaConstraints();"></select>
29 Optional min size<input type="text" id="video-width" value="1280" size="5px" 29 Optional min size <input type="text" id="video-width" value="1280"
30 onblur="updateGetUserMediaConstraints();">x<input type="text" 30 size="5px" onblur="updateGetUserMediaConstraints();">
31 id="video-height" value="720" size="5px" 31 x <input type="text" id="video-height" value="720" size="5px"
32 onblur="updateGetUserMediaConstraints();"> 32 onblur="updateGetUserMediaConstraints();">
33 <button id="get-devices" onclick="getDevices();"> 33 <button id="get-devices" onclick="getDevices();">
34 Get devices</button> 34 Get devices</button>
35 Onload<input type="checkbox" id="get-devices-onload"> 35 Onload<input type="checkbox" id="get-devices-onload">
36 You can also use <a href="constraints.html">constraints.html</a>&nbsp;&nbsp; 36 You can also use <a href="constraints.html">constraints.html</a>&nbsp;&nbsp;
37 <a href="peerconnection-help.html" target="_blank">Help</a> 37 <a href="peerconnection-help.html" target="_blank">Help</a>
38 <br/> 38 <br/>
39 </div> 39 </div>
40 40
41 <div id="container"> 41 <div id="container">
42 42 <div class="left">
43 <div id="left-half">
44
45 <div> 43 <div>
46 <h2>Local Preview</h2> 44 <h2>Local Preview</h2>
47 <video width="320" height="240" id="local-view" autoplay="autoplay" 45 <video width="320" height="240" id="local-view" autoplay="autoplay"
48 muted class="video-area"></video><br/> 46 muted></video><br/>
49 </div> 47 </div>
50
51 <div> 48 <div>
52 <div> 49 <div>
53 Size: <div id="local-view-size" class="inline-contents"></div> 50 Size: <div id="local-view-size" class="inline-contents"></div>
54 <div id="local-view-stream-size" class="inline-contents">(stream 51 <div id="local-view-stream-size" class="inline-contents">(stream
55 size: N/A)</div><br/> 52 size: N/A)</div><br/>
56 </div> 53 </div>
57 <div> 54 <div>
58 Resize: <button onclick="updateVideoTagSize('local-view')"> To 55 Resize: <button onclick="updateVideoTagSize('local-view')"> To
59 stream size</button> 56 stream size</button>
60 <button onclick="updateVideoTagSize('local-view', 320, 240);"> 57 <button onclick="updateVideoTagSize('local-view', 320, 240);">
61 320x240</button> 58 320x240</button>
62 <button onclick="updateVideoTagSize('local-view', 640, 480);"> 59 <button onclick="updateVideoTagSize('local-view', 640, 480);">
63 640x480</button> 60 640x480</button>
64 </div> 61 </div>
65 </div> 62 </div>
66 63
67 <h2>Send on data channel</h2> 64 <h2>Send on data channel</h2>
68 <input type="text" id="data-channel-send" size="10" /> 65 <input type="text" id="data-channel-send" size="10" />
69 <button onclick="sendDataFromHere();">Send data</button><br> 66 <button onclick="sendDataFromHere();">Send data</button><br>
70 67
71 <h2>Settings</h2> 68 <h2>Settings</h2>
72 Server [<a href="" onclick="showServerHelp();">?</a>]: 69 Server [<a href="" onclick="showServerHelp();">?</a>]:
73 <input type="text" id="pc-server" size="30" 70 <input type="text" id="pc-server" size="30"
74 value="http://localhost:8888"/> 71 value="http://localhost:8888"/>
75 Peer ID: <input type="text" id="peer-id" size="10" /> 72 Peer ID: <input type="text" id="peer-id" size="10" />
76 <button id="connect" onclick="connectFromHere();">Connect</button><br/> 73 <button class="button-green" id="connect" onclick="connectFromHere();">
74 Connect</button><br/>
75
77 PeerConnection Constraints: 76 PeerConnection Constraints:
78 CPU overuse <input type="checkbox" id="cpuoveruse-detection" 77 CPU overuse <input type="checkbox" id="cpuoveruse-detection"
79 onclick="setPeerConnectionConstraints();" checked="true"/> 78 onclick="setPeerConnectionConstraints();" checked="true"/>
80 RTP <input type="checkbox" id="data-channel-type-rtp" 79 RTP <input type="checkbox" id="data-channel-type-rtp"
81 onclick="setPeerConnectionConstraints();"><br/> 80 onclick="setPeerConnectionConstraints();"><br/>
82 <input type="text" id="pc-constraints" size="80" value="{}"><br/> 81 <input class="width-100" type="text" id="pc-constraints" value="{}" ><br/>
83 PeerConnection <a href="http://goo.gl/xVi12"> 82 PeerConnection <a href="http://goo.gl/xVi12">
84 createOffer MediaConstraints:</a><br/> 83 createOffer MediaConstraints:</a><br/>
85 <input type="text" id="pc-createoffer-constraints" rows="7" cols="40" 84 <input type="text" class="width-100" id="pc-createoffer-constraints"
86 value="{}"/><br/> 85 value="{}"/><br/>
87 PeerConnection <a href="http://goo.gl/0TjfX"> 86 PeerConnection <a href="http://goo.gl/0TjfX">
88 createAnswer MediaConstraints:</a><br/> 87 createAnswer MediaConstraints:</a><br/>
89 <input type="text" id="pc-createanswer-constraints" rows="7" cols="40" 88 <input type="text" class="width-100" id="pc-createanswer-constraints"
90 value="{}"/><br/> 89 value="{}"/><br/>
91 90
92 Call: 91 Call:
93 <button onclick="negotiateCallFromHere();">Negotiate</button> 92 <button class="button-green" onclick="negotiateCallFromHere();">Negotiate
94 <button onclick="hangUpFromHere();">Hang up</button><br/> 93 </button>
94 <button class="button-red" onclick="hangUpFromHere();">Hang up</button>
95 <br/>
96
95 Local Stream: 97 Local Stream:
96 <button onclick="addLocalStreamFromHere();">Add</button> 98 <button class="button-green" onclick="addLocalStreamFromHere();">Add
97 <button onclick="removeLocalStreamFromHere();">Remove</button> 99 </button>
98 <button onclick="stopLocalFromHere();">Stop</button> 100 <button class="button-red" onclick="removeLocalStreamFromHere();">Remove
101 </button>
102 <button class="button-red" onclick="stopLocalFromHere();">Stop</button>
99 <button onclick="toggleLocalVideoFromHere();">Toggle Video</button> 103 <button onclick="toggleLocalVideoFromHere();">Toggle Video</button>
100 <button onclick="toggleLocalAudioFromHere();">Toggle Audio</button><br/> 104 <button onclick="toggleLocalAudioFromHere();">Toggle Audio</button><br/>
105
101 Remote Stream: 106 Remote Stream:
102 <button onclick="toggleRemoteVideoFromHere();">Toggle Video</button> 107 <button onclick="toggleRemoteVideoFromHere();">Toggle Video</button>
103 <button onclick="toggleRemoteAudioFromHere();">Toggle Audio</button><br/> 108 <button onclick="toggleRemoteAudioFromHere();">Toggle Audio</button><br/>
109
104 Data Channel: 110 Data Channel:
105 <button onclick="createDataChannelFromHere();">Create</button> 111 <button onclick="createDataChannelFromHere();">Create</button>
106 <button onclick="closeDataChannelFromHere();">Close</button> 112 <button onclick="closeDataChannelFromHere();">Close</button>
107 status: 113 status:
108 <input type="text" id="data-channel-status" size="10" value="not created" 114 <input type="text" id="data-channel-status" size="10" value="not created"
109 disabled="true" /><br/> 115 disabled="true" /><br/>
116
110 DTMF Sender: 117 DTMF Sender:
111 <button onclick="createDtmfSenderFromHere();">Create</button> 118 <button onclick="createDtmfSenderFromHere();">Create</button>
112 tones: 119 tones:
113 <input type="text" id="dtmf-tones" size="10" value="123,abc" /> 120 <input type="text" id="dtmf-tones" size="10" value="123,abc" />
114 duration(ms): 121 duration(ms):
115 <input type="text" id="dtmf-tones-duration" size="10" value="100" /> 122 <input type="text" id="dtmf-tones-duration" size="10" value="100" />
116 gap(ms): 123 gap(ms):
117 <input type="text" id="dtmf-tones-gap" size="10" value="50" /> 124 <input type="text" id="dtmf-tones-gap" size="10" value="50" />
118 <button onclick="insertDtmfFromHere();">Send</button><br/> 125 <button onclick="insertDtmfFromHere();">Send</button><br/>
126
119 Options: 127 Options:
120 <input type="checkbox" id="force-isac" onclick="forceIsacChanged();"/> 128 <input type="checkbox" id="force-isac" onclick="forceIsacChanged();"/>
121 Force iSAC in Outgoing SDP<br/> 129 Force iSAC in Outgoing SDP<br/>
122 <button onclick="clearLog();">Clear Logs</button> 130 <button onclick="clearLog();">Clear Logs</button>
123
124 <h2>Messages</h2>
125 <pre id="messages"></pre>
126 </div> 131 </div>
127 132
128 <div id="right-half"> 133 <div class="right">
129
130 <div> 134 <div>
131 <h2>Remote Video</h2> 135 <h2>Remote Video</h2>
132 <video width="320" height="240" id="remote-view" autoplay="autoplay" 136 <video width="320" height="240" id="remote-view" autoplay="autoplay">
133 class="video-area"></video><br/> 137 </video><br/>
134 </div> 138 </div>
135
136 <div> 139 <div>
137 <div> 140 <div>
138 Size: <div id="remote-view-size" class="inline-contents"></div> 141 Size: <div id="remote-view-size" class="inline-contents"></div>
139 <div id="remote-view-stream-size" class="inline-contents">(stream size 142 <div id="remote-view-stream-size" class="inline-contents">(stream size
140 :N/A)</div><br/> 143 :N/A)</div><br/>
141 </div> 144 </div>
142 <div> 145 <div>
143 Resize: <button onclick="updateVideoTagSize('remote-view')"> To 146 Resize: <button onclick="updateVideoTagSize('remote-view')"> To
144 stream size</button> 147 stream size</button>
145 <button onclick="updateVideoTagSize('remote-view', 320, 240);"> 148 <button onclick="updateVideoTagSize('remote-view', 320, 240);">
146 320x240</button> 149 320x240</button>
147 <button onclick="updateVideoTagSize('remote-view', 640, 480);"> 150 <button onclick="updateVideoTagSize('remote-view', 640, 480);">
148 640x480</button> 151 640x480</button>
149 </div> 152 </div>
150 </div> 153 </div>
151 154
152 <h2>Received on data channel</h2> 155 <h2>Received on data channel</h2>
153 <textarea id="data-channel-receive" rows="7" cols="40" disabled="true"> 156 <textarea id="data-channel-receive" rows="7" cols="40" disabled="true">
154 </textarea> 157 </textarea>
155 158
156 <h2>Sent DTMF tones</h2> 159 <h2>Sent DTMF tones</h2>
157 <textarea id="dtmf-tones-sent" rows="7" cols="40" disabled="true"> 160 <textarea id="dtmf-tones-sent" rows="7" cols="40" disabled="true">
158 </textarea> 161 </textarea>
162 </div>
159 163
160 <h2>Debug</h2> 164 <div id="footer">
161 <pre id="debug"></pre> 165 <div class="left">
166 <h2>Messages</h2>
167 <pre id="messages"></pre>
168 </div>
169
170 <div class="right">
171 <h2>Debug</h2>
172 <pre id="debug"></pre>
173 </div>
162 </div> 174 </div>
163 </div> 175 </div>
164 </div> 176 </div>
165
166 </body> 177 </body>
167 </html> 178 </html>
OLDNEW
« no previous file with comments | « no previous file | chrome/test/data/webrtc/manual/peerconnection_manual.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698