Ankündigung

Einklappen
Keine Ankündigung bisher.

block content akzeptiert kein "height:auto" oder 100%

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    block content akzeptiert kein "height:auto" oder 100%

    Hallo
    ich versuche seit gut einer Woche meine Kameras Dahua ipc-hdw5231r-z in smartvisu zu integrieren. Das Problem war die digest auth. Das Multimediawidget kann kein auth.
    Mittlerweile habe ich ein php script welches mir Bilder von der Kamera holt. Dieses wollte ich in einem block einbinden. Außer iframe gab es meineserachtens keine andere Möglichkeit.
    Das Bild wird angezeigt ich bekomme aber die scrollbalken rechts nicht weg. ich muss für height einen festen Wert vorgeben um die Höhe zu ändern.
    Gibt es eine Möglichkeit diese automatische Höhe in den Blocks zu ändern?
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="refresh" content="3">
    <title>Garten</title>
    </head>
    <body>
    <style>
    .image-wrapper{
    max-width:90%;
    height:auto;
    position: relative;
    display:block;
    margin:0 auto;
    }
    .image-wrapper img{
    width:100% !important;
    height:auto !important;
    display:block;
    }
    </style>
    <div class="image-wrapper">


    <?php
    $P_titel = "Garten";
    $login = 'admin';
    $password = 'vergessen';
    $url = 'http://192.168.178.xxx/cgi-bin/snapshot.cgi';
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL,$url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
    curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_ANY);
    curl_setopt($ch, CURLOPT_USERPWD, "$login:$password");
    $result = curl_exec($ch);
    curl_close($ch);
    $im = imagecreatefromstring($result);
    $now = date("d-m-Y-H:i");
    $newnew = imagecreatetruecolor(960,540);
    imagecopyresized($newnew, $im, 0, 0, 0, 0, 960, 540, 1920, 1080);
    $newnewfile = "images/garten/$now-r.jpg";
    imagejpeg($newnew, $newnewfile);
    imagedestroy($im);
    imagedestroy($newnew);
    echo "<img src="images/garten/$now-r.jpg" >";
    ?>
    </div>
    </body>
    </html>
    eingebunden ist es so
    <div class="block" style="width:100%">
    <div class="ui-bar-c ui-li-divider ui-corner-top">Garten</div>
    <div class="image">
    <iframe src="http://192.168.178.9/bild_garten.php" width="100%" height="100%" scrolling="auto" frameborder="0"></iframe>
    </div>
    </div>
    es muss doch eine Möglichkeit geben die Höhe zu automatisieren, bin total auf dem Holzweg

    #2
    kannst du nicht mit php direkt ein image generieren und das dann einbinden? also in einem img tag.. iframes sind böse.. aber ich wiederhole mich

    http://php.net/manual/de/image.examples-png.php

    Kommentar


      #3
      noch nicht,
      du meinst mit <img...?
      anstatt imagejpeg könnte ich imagepng nehmen,
      ich habe leider keine Ahnung wie ich ein php script beim Aufruf einer Seite starte bzw einbinde, bekomme immer Fehler.
      Dann müßte sich das <img....png> auch immer automatisch aktualisieren.
      bräuchte ein Beispiel oder einen Tip
      Das mit den iframes wusse ich, hab mich aber einfach gefreut, das ich endlich ein Bild in meiner smartvisu hatte.
      ich habe auch noch mehrere iframes in meiner visu,
      alle meine grafana Graphen habe ich mit iframes eingebunden. Da fehlt mir auch eine Alternative.

      also das png hätte ich

      <head>
      <meta http-equiv="refresh" content="3">
      <title>Eingang-png</title>
      </head>
      <body>
      <?php
      $P_titel = "Eingang";
      $login = 'admin';
      $password = 'trallala';
      $url = 'http://192.168.178.xxx/cgi-bin/snapshot.cgi';
      $ch = curl_init();
      curl_setopt($ch, CURLOPT_URL,$url);
      curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
      curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_ANY);
      curl_setopt($ch, CURLOPT_USERPWD, "$login:$password");
      $result = curl_exec($ch);
      curl_close($ch);
      $im = imagecreatefromstring($result);
      $newnew = imagecreatetruecolor(960,540);
      imagecopyresampled($newnew, $im, 0, 0, 0, 0, 960, 540, 1920, 1080);
      $newnewfile = "images/eingang/now.png";
      imagepng($newnew, $newnewfile);
      imagedestroy($im);
      imagedestroy($newnew);
      echo "<img src="images/eingang/now.png" >";
      ?>
      </body>
      </html>
      Zuletzt geändert von element; 14.09.2018, 18:45.

      Kommentar


        #4
        <img src="http://..../meinbild.php"/> ? also im php das bild erstellen und als bild ausgeben! ich kapiere aber immer noch nicht, wieso du das bild nicht einfach von der kamera einbindest?! wegen der basic auth? das geht im img tag doch wunderbar, darfst halt kein widget nehmen (macht hier sowieso keinen sinn)...

        ich binde so sogar den videostream ein

        siehe auch einige threads weiter unten: https://knx-user-forum.de/forum/supp...dung-smartvisu
        Zuletzt geändert von psilo; 15.09.2018, 04:58.

        Kommentar


          #5
          Nein, kein basic auth sondern digest auth, das ist ja das eigentliche Problem. Deshalb kann ich kein multimedia.image widget nutzen, was mich übrigens sehr freuen würde wenn es irgendwann mal mit digest auth möglich ware.
          Das php script habe ich nach durchsuchen von gefühlt hundert Webseiten gefunden passend umgebaut und zum laufen gebracht. Zuerst zeigte es vertikal und horizontal Scrollbalken. Nach dem ich den javascript Teil eingebaut habe ließ es sich vertikal komprimieren, hatte aber nur noch eine Höhe von der in der block content Vorlage vorgegebenen Höhe mit Scrollbalken rechts. und genau das bekomme ich nicht weg, auch wenn ich im iframe width und heigth in alles mögliche was mir einfällt ändere. img funktioniert leider nicht.

          Kommentar


            #6
            1. Was psilo meint: Anstatt per PHP ein HTML auszugeben und dieses dann per IFrame einzubinden, kannst du auch einfach per PHP das Bild rausschreiben und dieses PHP-Script als src in multimedia.image angeben.

            2. Macht es wirklich Sinn, das Bild per PHP zu skalieren? Ich würde das dem Browser überlassen.

            Das PHP-Script würde dann etwa so aussehen:
            PHP-Code:
            <?php
            $login 
            'admin';
            $password 'trallala';
            $url 'http://192.168.178.xxx/cgi-bin/snapshot.cgi';
            $ch curl_init();
            curl_setopt($chCURLOPT_URL,$url);
            curl_setopt($chCURLOPT_RETURNTRANSFER,1);
            curl_setopt($chCURLOPT_HTTPAUTHCURLAUTH_ANY);
            curl_setopt($chCURLOPT_USERPWD"$login:$password");
            $result curl_exec($ch);
            curl_close($ch);
            header("Content-Type: image/jpeg");
            print(
            $result);
            ?>

            3. Ich denke, die Ursache liegt nicht in Digest anstatt Basic Authentication sondern ist eher ein Cross Origin Problem.

            4. Anstatt mit diesem Proxy Script in PHP könntest du das auch mit einem echten Proxy wie NGINX umgehen. psilo hat dazu ein schönes Tutorial geschrieben.
            psilo vielleicht könntest du das Tutorial um diesen Anwendungsfall mit einer Kamera erweitern, dieses Problem kommt ja immer wieder auf.

            5. Soweit ich weiss, unterstützen die verbreiteten Browser und damit auch multimedia.image die Digest Authentication per User/Passwort in der URL grundsätzlich (nur eben mit Vorbehalten bei Cross Origin). Und falls nicht, kann ich daran in multimedia.image auch nichts ändern.

            6. Anstatt QUOTE solltest du im Forum CODE oder in diesem Fall noch besser PHP verwenden.

            Kommentar


              #7
              Danke Danke Danke
              ich wußte nicht das es ohne speichern funktioniert, klar, so im nachhinein macht es auch Sinn.
              Das script funktioniert im multimedia.image widget und aktualisiert sich nach Vorgabe und das Bild lässt sich beliebig vergrößern und verkleinern..
              als <img funktioniert es nicht mit refresh, dann kommt kein Bild, ich denke der refresh war die ganze Zeit das Problem, das kein Bild beim <img kam.
              Das script läuft so auch um einiges schneller, klasse
              ich freu mich

              Kommentar

              Lädt...
              X