MotionPiOS – Kamerakachelübersicht

Wer mehrere Raspberry Kameras sein Eigen nennt, möchte vielleicht alle in einer Kachelübersicht in seinem bevorzugten Browser anschauen.

Der hier dargestellte Code ist ein Beispiel, wie so etwas aussehen könnte.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
  "http://www.w3.org/TR/html4/frameset.dtd">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title>Kamera - Kachelübersicht</title>
	
<style>
    #wrap { width: 780px; height: 450px; padding: 0; overflow: hidden; }
    #frame { width: 1920px; height: 1080px; border: 1px solid black; }
    #frame {
        -ms-zoom: 1.0;
        -moz-transform: scale(0.5);
        -moz-transform-origin: 0 0;
        -o-transform: scale(1.0);
        -o-transform-origin: 0 0;
        -webkit-transform: scale(0.4);
        -webkit-transform-origin: 0 0;
    }
</style>	
	
  </head>

<table>
<tr>
	<td>
		<h3>Kamera 1</h3>
		<div id="wrap">
			<iframe id="frame" src="http://192.168.2.2:8081" allowfullscreen="" frameborder="0"  scrolling="no" align="centre">
			</iframe>                
		</div>
	</td>
	<td>
		<h3>Kamera 2</h3>
		<div id="wrap">
			<iframe id="frame" src="http://192.168.2.3:8081" allowfullscreen="" frameborder="0"  scrolling="no" align="centre">
			</iframe>                
		</div>
	</td>
</tr>
<tr>
	<td>
		<h3>Kamera 3</h3>
		<div id="wrap">
			<iframe id="frame" src="http://192.168.2.3:8081" allowfullscreen="" frameborder="0"  scrolling="no" align="centre">
			</iframe>                
		</div>
	</td>
	<td>
		<h3>&Uuml;bersicht Kameras - View</h3>
		<ul>
			<li>Kamera 1 - 192.168.178.37</li>
			<li>Kamera 2 - 192.168.178.26</li>
			<li>Kamera 3 - 192.168.178.38</li>
		</ul>
		
		<h3>&Uuml;bersicht Kameras - Admin</h3>
		<ul>
			<li>Kamera 1</li>
			<li>Kamera 2</li>
			<li>Kamera 3</li>
		</ul>
	</td>
</tr>
</table>

</html>


Gib mir gerne einen Kaffee ☕ aus!

Wenn dir meine Beiträge gefallen und geholfen haben, dann kannst du mir gerne einen Kaffee ☕ ausgeben.

PayPal Logo


liberapay.com/strobelstefan.org


Kaffee via Bitcoin

bc1qfuz93hw2fhdvfuxf6mlxlk8zdadvnktppkzqzj


Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.