Commit 9353c3a3 authored by Oleg Dzhimiev's avatar Oleg Dzhimiev

jp4 preview for humans

parent 0e3f1b4c
...@@ -53,8 +53,13 @@ ...@@ -53,8 +53,13 @@
* for the JavaScript code in this page. * for the JavaScript code in this page.
*/ */
</script> </script>
<script type='text/javascript' src='../js/jquery-3.1.1.js'></script> <script type='text/javascript' src='js/jquery-3.1.1.js'></script>
<!--<script type='text/javascript' src='../js/bootstrap/js/bootstrap.js'></script>--> <!--<script type='text/javascript' src='../js/bootstrap/js/bootstrap.js'></script>-->
<script src="js/elphel.js"></script>
<script src="js/jcanvas.js"></script>
<script src="js/exif.js"></script>
<script src="js/jquery-jp4.js"></script>
<link rel="stylesheet" href="js/bootstrap/css/bootstrap.css"> <link rel="stylesheet" href="js/bootstrap/css/bootstrap.css">
<style> <style>
.port_window{ .port_window{
...@@ -66,6 +71,11 @@ ...@@ -66,6 +71,11 @@
border: 1px solid rgba(210,210,210,1); border: 1px solid rgba(210,210,210,1);
} }
.port_preview{
width:300px;
height:224px;
}
table td { table td {
padding-right:10px; padding-right:10px;
} }
...@@ -101,7 +111,8 @@ ...@@ -101,7 +111,8 @@
$table_contents .= "<td>"; $table_contents .= "<td>";
$table_contents .= "<div class='port_window img_window'>"; $table_contents .= "<div class='port_window img_window'>";
$table_contents .= "<div><a href=\"$href1\"><img class='img_window' src='$href1' style='width:300px'/></a></div>"; //$table_contents .= "<div><a href=\"$href1\"><img class='img_window' src='$href1' style='width:300px'/></a></div>";
$table_contents .= "<div><a href=\"$href1\"><div index='$i' class='port_preview'></div></a></div>";
$table_contents .= "<div style='text-align:center;'>port $i: <a title='single image' href='$href1'>bimg</a>, <a title='multi-part image stream (M-JPEG)' href='$href2'>mimg</a></div>"; $table_contents .= "<div style='text-align:center;'>port $i: <a title='single image' href='$href1'>bimg</a>, <a title='multi-part image stream (M-JPEG)' href='$href2'>mimg</a></div>";
$table_contents .= "</div>"; $table_contents .= "</div>";
$table_contents .= "</td>"; $table_contents .= "</td>";
...@@ -149,6 +160,18 @@ ...@@ -149,6 +160,18 @@
</div> </div>
<script> <script>
$(function(){ $(function(){
init_awb_toggle();
init_jp4_previews();
});
function init_jp4_previews(){
$('.port_preview').each(function(){
index = parseInt($(this).attr("index"));
$(this).jp4({ip:"127.0.0.1",port:2323+index,width:300,fast:true,lowres:4});
});
}
function init_awb_toggle(){
$('.btn-toggle').click(function() { $('.btn-toggle').click(function() {
if ($(this).find('.btn.active').html()=="ON"){ if ($(this).find('.btn.active').html()=="ON"){
...@@ -179,8 +202,9 @@ $(function(){ ...@@ -179,8 +202,9 @@ $(function(){
} }
}); });
}); });
}); }
</script> </script>
<body> <body>
</html> </html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment