RPI-Cam-Web-Interface

**pula** · 11. April 2016

das gefühl hatte ich auch. und wenn man wirklich motion-detection will, gibts da noch motion.
mir erscheint die Weboberfläche auch noch nicht wirklich ausgereift...

**Nea** · 11. April 2016

Ja, Du sagst es. Bleibt die Frage wie ich dem mjpg-streamer ein overlay unterjubel. Mit fswebcam geht das sehr einfach.

Aber das ist jetzt wieder Off Topic.

**dtp** · 11. April 2016

Motion Detection nutze ich auch nicht mit dem RPI-Cam-Web-Interface. Das würde ich eher mit meiner Synology DiskStation erledigen.

Bei mir verrichtet das RPI-Cam-Web-Interface aber seit über einem Jahr recht klaglos seinen Dienst. Man darf nur nicht den Fehler machen, es mit dem Internet Explorer oder Edge konfigurieren zu wollen. Die hängen sich beide sofort auf. Gut läuft es dagegen unter Firefox, Chrome und Safari.

Ich nutze das Interface hauptsächlich wegen der Overlay-Funktion sowie der einfachen Konfigurierbarkeit von Bildgröße, Bildformat, Datenrate und Rotation. Zudem lassen sich die Video-Streams sehr gut in meine HomeMatic unter CCU.IO bzw. DashUI einbinden.

**pula** · 11. April 2016

was meint ihr mit overlay?

irqnet · 11. April 2016

Zitat von pula001

was meint ihr mit overlay?

Overlay meint, du kannst in der Konfiguration von fswebcam angeben, das z.B. transparente PNGs oder Text mit im Bild angezeigt werden, so das du zusätzliche Infos in das ausgegebene Bild bekommst. Das hab ich beim mjpg streamer bisher auch noch vermisst.

Vielleicht hilft uns das hier? habs nicht getestet

**Nea** · 11. April 2016

Hmmm, das liest sich fast zu simpel. Danke aber für den Hinweis, werde ich auf jedenfall ausprobieren.

Ich habe vor sowas in der Art als Overlay zu gestalten. Ihr könnt das Euch mal anschauen:

Brainfuck

#!/bin/bash


#Set the language
export LANG="en_US.UTF-8"
#Load the Pathes
export PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin
 
#set the variables:
LOCATION=GMXX1081
WEATHER=/tmp/weatherforecast.txt
WEATHERBIN=/srv/python-yahoo-weather/weather.py
SENSOR=$(echo "scale=2; $(grep 't=' /sys/bus/w1/devices/w1_bus_master1/28-000004118a7f/w1_slave | awk -F't=' '{print $2}')/1000" | bc -l)
CAMPIC="/tmp/webcam.jpg"
LOGFILE="/var/log/webcamsnapshot.log"


#Remote Webserver (copy the picture via scp to the webserver)
ENABLEWEBSERVER="yes"   # yes or no
WEBSERVER="webserver.domain.de"
USER="root"
WEBHOME="/srv/httpd/vhosts/www.domain.de/htdocs/"


# Fetch the weather
$WEATHERBIN -mlvf2 GMXX1081 | sed 's/^[ \t]*//;s/[ \t]*$//;s/\([0-9]\{1,3\}\)C/\1°C/g' > $WEATHER


CURRENTCOND=$(sed -n '5p' $WEATHER)
DATE1=$(sed -n '8p' $WEATHER | sed 's/[ \t]/./'|awk '{ print $1}')
HIGH1=$(sed -n '9p' $WEATHER | awk -F': ' '{ print $2 }')
LOW1=$(sed -n '10p' $WEATHER | awk -F': ' '{ print $2 }')
COND1=$(sed -n '11p' $WEATHER | awk -F': ' '{ print $2 }')
DATE2=$(sed -n '12p' $WEATHER | sed 's/[ \t]/./'|awk '{ print $1}')
HIGH2=$(sed -n '13p' $WEATHER | awk -F': ' '{ print $2 }')
LOW2=$(sed -n '14p' $WEATHER | awk -F': ' '{ print $2 }')
COND2=$(sed -n '15p' $WEATHER | awk -F': ' '{ print $2 }')


# Weatherforecast text
WEATHERTEXT="$DATE1: H:$HIGH1 L:$LOW1 $COND1  |  $DATE2: H:$HIGH2 L:$LOW2 $COND2"


# Text for the webcam picture
TITLE="Heddesheim: $CURRENTCOND"
SUBTITLE="$WEATHERTEXT"
TIMESTAMP="%Y-%m-%d %H:%M (%Z)"
INFO="current temperature: $SENSOR°C"


# do the things
# make the picture
function takepicture {
        fswebcam -s contrast=55% -D 3 -S 5 -F 20 -r 640x480 -d /dev/video0 -q --title "$TITLE" --subtitle "$SUBTITLE" --timestamp "$TIMESTAMP" --info "$INFO" --jpeg "-1" $CAMPIC > $LOGFILE 2>&1
}
takepicture
while [ -n "$(cat $LOGFILE | grep 'Corrupt JPEG data')" ]; do
        takepicture
done


# copy the picture to Webserver
if [ "$ENABLEWEBSERVER" == "yes" ]; then
        scp -q $CAMPIC $USER@$WEBSERVER:$WEBHOME
fi

Alles anzeigen

irqnet · 11. April 2016

Um nachträglich Infos oder overlays in bereits auf dem Dateisystem erstellte jpgs zur bekommen könnte man sicherlich auch auf die Tools aus dem imagemagick Fundus zurückgreifen. Da wird sicherlich was dabei sein.

Gesendet von meinem Z1 mit Tapatalk

**Nea** · 12. April 2016

Funktioniert überaschend gut das Overlay.

**Joker** · 12. April 2016

Wie hast du das jetzt gemacht, wie in dem obigen Thread beschrieben durch Änderung der HTML-Seite?

**pula** · 12. April 2016

nice

irqnet · 12. April 2016

Zitat von Nea

Funktioniert überaschend gut das Overlay.

Es geht auch in der Tat mit imagemagick. Mein Test via Telegram sieht gerade so aus:

Bash: telegram_snapshot.sh

#!/bin/bash
sudo php /usr/local/etc/DoorPi/tools/take_snapshot_doorpi.php /tmp/doorpi.jpg
composite -gravity NorthWest overlay.png /tmp/doorpi.jpg /tmp/doorpi_ov.jpg
curl -s -k "https://api.telegram.org/_botapicodeHERE_/sendPhoto" -F chat_id=166493223 -F photo="@/tmp/doorpi_ov.jpg" -F caption="Haustürklingel"

Overlay:

Vorher:

Nachher:

**Nea** · 12. April 2016

Ja, sieht sehr gut aus, Du hast hier aber nur einen snapshot mit overlay oder?

Bei mir oben ist es der Video-Stream direkt.

@Joker

Ja ist wirklich ganz simpel:

HTML: stream_simple.html

<html>
      <head>
        <title>MJPG-Streamer - Stream Example</title>
    <style>
    .container { position:relative; }
    .container video {
        position:relative;
        z-index:0;
    }


    .overlay {
        position:absolute;
        top:0;
        left:0;
        z-index:1;
    }
    </style>
      </head>
      <body>
        <div class="container">
            <img src="/?action=stream"/>
        <div class="overlay">
         <div style="position:absolute;width:800px;font-size:200%;font-weight:bold; background-color:lightgray; filter:alpha(opacity=60); opacity:.6;" id="t$
        </div>
    </div>




     <script type='text/javascript'>
    timer();


    function timer(){
     var now = new Date,
         hours = now.getHours(),
         ampm  = hours<=11 ? ' AM' : ' PM'
         minutes = now.getMinutes(),
         seconds = now.getSeconds(),
         t_str = "&nbsp;" + [hours-12,
                  (minutes < 10 ? "0" + minutes : minutes),
                  (seconds < 10 ? "0" + seconds : seconds)]
                     .join(':') + ampm + "&nbsp;&nbsp;&nbsp;&nbsp;Put Your text there";
     document.getElementById('time_span').innerHTML = t_str;
     setTimeout(timer,1000);
    }


    </script>


      </body>
    </html>

Alles anzeigen

**pula** · 12. April 2016

Ist aber "nur" im Browser zu sehen dann, nicht wenn man den Stream direkt mit einem Video-Player betrachtet, oder?

**Nea** · 12. April 2016

Ja, leider. Sollte aber möglich sein da es der Web-Streamer auch kann. Ich denke aber über PHP5 sollte dies lösbar sein.

**pula** · 12. April 2016

ich schau mir grad an, wie das mit ffmpeg geht, sollte statt dem mjpg_streamer eigentlich auch funktionieren....
denke, das wäre für solche Aktionen vernünftiger, weil der mjpg_streamer liefert bei motion (hab ich auf dem "richtigen" server laufen, um die Bilder der raspicam abzugreifen und motion-detection zu machen, sollte aber eigentlich auch direkt am raspi gehen) sehr, sehr oft fehlerhafte bilder... werde berichten, wenn ich weiter bin
bin am installieren, aber das kompilieren am raspi dauert - kann also sein, daß das ein wenig dauert....

**Nea** · 12. April 2016

Bin gespannt ob Du da etwas brauchbares raus bekommst. Wäre echt gut.

**pula** · 12. April 2016

wird evtl ein paar Tage dauern. momentan läuft das make der ersten Komponente und morgen hab ich aus beruflichen Gründen keine Zeit....
Aber ich bin vorsichtig optimistisch. ffmpeg kann auch das video-device direkt abgreifen und sollte ein wenig flexibler sein als mjpg_streamer...
Mal sehen, vielleicht kommt was besseres und flexibleres raus als die Web-Oberfläche (aber halt OHNE web-Oberfläche )

**Nea** · 12. April 2016

Hehe, ja mal sehen. Drücke aber die Daumen.

Wer unbedingt eine Weboberfläche benötigt kann sich ja schnell auf apache was zusammen schustern.

**pula** · 12. April 2016

denke ich auch. mal schauen... compiliert noch immer und ich bin noch nicht mal bei der hälfte....

irqnet · 12. April 2016

Kompiliert ihr immer auf dem raspberry? Kann ja mitunter ewig dauern da wäre cross compiling ggfs einfacher.

Gesendet von meinem Z1 mit Tapatalk

RPI-Cam-Web-Interface

Teilen

Tags