source: py-tcpmultiplexer/htdocs/browser.html@ 321

Last change on this file since 321 was 321, checked in by Rick van der Zwet, 13 years ago

RadioButtons are much nicer!

  • Property svn:mime-type set to text/html
File size: 2.1 KB
RevLine 
[315]1<html>
2<head>
[319]3<title>py-tcpmultiplexer Webcam Control </title>
[315]4<link href="css/style.css" type="text/css" rel="stylesheet"/>
5<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
6<script type="text/javascript" src="js/jquery.jplayer.min.js"></script>
[319]7<script type="text/javascript">
[321]8function changeAudio(wav_uri)
[319]9{
10 $("#jplayer").jPlayer({
11 ready: function () {
[321]12 $(this).jPlayer("stop");
[319]13 $(this).jPlayer("setMedia", { wav: wav_uri }).jPlayer("play");
14 },
15 ended: function (event) {
16 $(this).jPlayer("play");
17 },
18 swfPath: "",
19 supplied: "wav"
20 });
21}
22
23function changeVideo(mjeg_uri)
24{
25 $("#player").attr("src",mjeg_uri);
26 $("#player").attr("alt","Video Feed: " + mjeg_uri);
27}
28</script>
[321]29
[315]30</head>
31<body>
[319]32<h1>py-tcpmultiplexer webcam server</h1>
[315]33
[321]34<div>
35<table>
36<tr><td>Select WebCam:</td><td>
37<input type="radio" name="cam" value="img/logo.png" checked="checked">None</input>
38<input type="radio" name="cam" value="/cam1/video">Cam1</input>
39<input type="radio" name="cam" value="/cam2/video">Cam2</input>
40<input type="radio" name="cam" value="/cam3/video">Cam2</input>
41<input type="radio" name="cam" value="/cam4/video">Cam2</input>
42</td></tr>
43<tr><td>Select Audio:</td><td>
44<input type="radio" name="sound" value="none" checked="checked" >None</input>
45<input type="radio" name="sound" value="/cam1/audio">Cam1</input>
46</td></tr>
47</table>
[315]48
[321]49<script type="text/javascript">
50 $("input[name='cam']").change(function () {
51 changeVideo($("input[name='cam']:checked").val());
52 });
53 $("input[name='sound']").change(function () {
54 changeAudio($("input[name='sound']:checked").val());
55 });
56</script>
57
58<div>
59<img id="player" src="img/logo.png" alt="Video feeds"/><br/>
[315]60</div>
61
[321]62<div id="jplayer" />
[315]63
[319]64
[321]65
[315]66<hr />
[319]67<p>Tested browsers: <a href="http://www.firefox.com">Mozilla Firefox</a>, <a href="http://www.google.com/chrome">Google Chrome</a> (<em>If no video appear below, you are using unsupported browser</em>)<br />
68<small>Source Code at: <a href="http://rickvanderzwet.nl/svn/personal/py-tcpmultiplexer/">http://rickvanderzwet.nl/svn/personal/py-tcpmultiplexer/</a></small>
[315]69
70</body>
71</html>
Note: See TracBrowser for help on using the repository browser.