Ankündigung

Einklappen
Keine Ankündigung bisher.

status.toast mit Kamerabild

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

  • Sipple
    antwortet
    Einen wunderschönen guten Morgen und ein gutes neues Jahr

    Die Größenanpassung über die visu.css klappt schon mal, also mit:

    Code:
    .jq-toast-single {
    width:1000px !important;
    }
    Nur sind halt dann alle Toast Meldungen so breit.

    wvhn, wenn ich versuche die ID des entsprechenden Toasts anzugeben, klappt es nicht. Ich vermute aber, dass meine CSS Kentnisse das eigentliche Problem sind. Wie genau referenziere ich das? Habe es so versucht, ging nicht:

    Code:
    #Klingeltoast {
    width:1000px !important;
    }
    Der Toast schaut so aus:

    Code:
    {{ status.toast('Klingeltoast', 'Klingelmeldung', '', 'Klingelmeldung.Stream_URL', '', 'KLINGELING', '', 'message_bell.svg', 'warning', '', '', '', '', 'false') }}
    Ich schätze, ich muss die ID und die Klasse kombinieren, aber wie?

    Gruß, Martin

    P.S. Die Streaming URL der Kamera, mit allen nötigen Parametern, kann man einfacher auch direkt in den status.toast packen. Paramter hier ist text_content. Dann muss man kein extra item in SHNG anlegen und ständig SHNG neu starten, weil man an dem Item was ändern musste. Also z.B. so:

    Code:
    {{ status.toast('Klingeltoast', 'Klingelmeldung', '', '', '', 'KLINGELING', '<img src="http://admin:xxx@192.168.yyy.yyy/control/faststream.jpg?stream=full&preview&size=1280x480&quality=40&fps=12.0" width="100%" alt="Der Stream geht nicht">', 'message_bell.svg', 'warning', '', '', '', '', 'false') }}
    Zuletzt geändert von Sipple; 02.01.2022, 11:23.

    Einen Kommentar schreiben:


  • Sipple
    antwortet
    Klingt gut, ich komme darauf zurück. Wenn das mit ner ID klappt bin ich glücklich.

    Jetzt erstmal etwas Jahresende feiern. Kann nur besser werden. Obwohl wir das letztes Jahr auch schon gesagt haben.

    Einen Kommentar schreiben:


  • wvhn
    antwortet
    Dazu ist die visu.css da. Gleiche Schreibweise nur ohne die <style> tags.
    Zudem kann man das dort gleich auf die betreffende Seite oder einen bestimmten Toast begrenzen, indem man deren id mit angibt.

    Gruß
    Wolfram
    Zuletzt geändert von wvhn; 31.12.2021, 18:35.

    Einen Kommentar schreiben:


  • AndreK
    antwortet
    Hi Sipple ,

    die Breite des Toasts kannst du mittles CSS in der index.html anpassen, diese Breite gilt aber dann für alle Toasts.
    Die optimale Breite muss mittels Try & Error ermittelt werden.

    Der Code muss innerhalb des Block
    Code:
    {% block sidebar %}
    stehen

    Code:
    <style>
    .jq-toast-single {
    width:700px !important;
    }
    </style>
    eventuell kann man das anpassen der Grösse im Widget selbst einbauen, es gibt ja verschiedene Events.


    Gruss Andre

    Einen Kommentar schreiben:


  • Bonze
    antwortet
    Mhh das ist html, wie sieht es denn mit dem toast und dem bild darin bei dir aus , ich weiss garnicht, aber ich glaube die grösse des toasts kann man anpassen in der toast.css .. müsste da aber auch mal nachguckn

    Einen Kommentar schreiben:


  • Sipple
    antwortet
    Danke schon mal, funktioniert prinzipiell, zumindest mit dem Firefox.
    Das Hauptproblem ist nun, dass der Toast eine feste Breite hat.

    Wenn ich das hier als content definiere:

    Code:
    <img src="http://admin:xxx@192.168.yyy.yyy/control/faststream.jpg?stream=full&preview&size=640x480&quality=40&fps=12.0" width="100%" alt="Der Stream geht nicht">
    Dann passt der Kamerastream in den Toast, ist aber so klein, dass man kaum was erkennt.

    Lasse ich width="100%" weg, bekomme ich den Stream in der Größe angezeigt, wie ich ihn will, aber er ragt natürlich über den rechten Rand des Toasts.
    Ergo: Wie passe ich den Toast an die Breite des Streams an und nicht umgekehrt?

    Gruß, Martin

    Einen Kommentar schreiben:


  • Bonze
    antwortet
    ja ein string

    kannst einfach den striong von oben hernehmen mit dem <img> das sollte passen

    Einen Kommentar schreiben:


  • Sipple
    antwortet
    Also muss ich gar kein content item haben, sondern ich kann die url auch direkt im widget angeben?

    Falls es doch nur per item geht, ist das dann ein str? Oder was anderes (foo, list, dict, irgendwas)?

    Einen Kommentar schreiben:


  • Bonze
    antwortet
    du müsstest dem widget als conent sowas übergeben
    "<img src="http://admin:xxx@192.168.yyy.yyy/control/faststream.jpg?stream=full" width="100%" alt="Der Stream geht nicht">"

    entweder statisch als text oder ein item welches den html code enthält

    Einen Kommentar schreiben:


  • Sipple
    hat ein Thema erstellt status.toast mit Kamerabild.

    status.toast mit Kamerabild

    Moin

    Da ich seit Tagen an der Darstellung des Kamerabildes meiner Mobotix T25 bastele und das nun in allen Browsern recht gut funktioniert, versuche ich mich jetzt an dem status.toast, so wie als Beispiel in der Doku gezeigt. Leider ist das in der Doku ein Fake-Beispiel, da einfach ein PNG gezeigt wird.
    Wie das also wirklich gemacht wird, ist mir nicht klar.
    Da steht was von "item with content". Wie genau soll das gehen? Ein Item mit einem Bild oder gar Stream belegen? Wie sieht das aus? Die URL der Kamera mit Bild oder Stream?
    Kann mir da jemand ein konkretes Beispiel zeigen wie das gedacht ist?

    Danke

    Martin
    Zuletzt geändert von Sipple; 30.12.2021, 09:40.
Lädt...
X