Neuer Style: flex. Flexibel für alle Geräte

[xanker]

Was mir nur generell aufgefallen ist, ist die Tatsache, dass nach dem Page-Load die Elemente noch wieder "refreshed" werden. Die Flex-Boxen  hüpfen sichtbar hin und her. Das hat nichts mit dem neuen Feature zu tun. Falls das früher auch schon so war, dann ist es mir nur noch nie aufgefallen.

Habe an ein paar Stellen an der Performance geschraubt. Wenn "Tabellen Verhalten beibehalten" deaktiviert ist, sieht man jetzt kein "Hüpfen" mehr, mal abgesehen vom Slider Handle (aber das liegt an fhemweb.js). Wenn die Option aktiviert ist, sieht man noch ein kurzes Hüpfen, das kann ich aber nicht vermeiden, es muss nämlich zwischen beiden Verhalten hin und her gesprungen werden um zu überprüfen welches Verhalten gültig ist.

Aufgefallen ist es mir bei l4fill. Daraufhin habe ich noch mit höheren Indizes getestet, ich meine 5-7 habe ich ausprobiert und konnte es reproduzieren. Bei den niedrigeren bin ich mir nicht sicher, da ich dort wenn überhaupt nur die Farbtöne leicht verändert habe und das dann beim Gradienten nicht besonders auffallen würde.

Wenn ich in der svg_defs.svg den Gradienten gr4 anpasse, wird der Wert für den offset="100%" im Plot berücksichtigt. Der für 0 % hat allerdings keine für mich erkennbare Wirkung.

Ich schaue mir das gleich mal an. Evtl. füge ich die defs einfach direkt per Javascript ein, das würde auch Probleme verhindern wenn ein Nutzer die svg_defs.svg "falsch" modifiziert hat (z.B. andere IDs der Gradienten). Beim CSS Code mache ich das schon, sprich das Modifizieren von svg_style.css hat keinerlei Auswirkung.

[xanker]

heute ist mir aufgefallen, dass in der Anrufliste ca. 1/3 der älteren Anrufe nicht angezeigt werden, der Rahmen bzw. Platz dafür ist aber vorgesehen, aber komplett einfarbig leer.

Ich habe nochmal ein wenig getestet ob ich das nachstellen kann. Und ich bin fündig geworden. Das Problem tritt bei mir auf, wenn ich die Callist in einer Gruppe mit anderen Geräten habe. Das komische daran: Auf dem PC mit Chrome wird alles korrekt angezeigt, auf Android mit Chrome tritt dann das von dir beschriebene Problem auf. Ich schaue mal wie ich das gelöst bekomme.

Edit: Problem sollte gelöst sein, zumindest bei mir.

[Gisbert]

Hallo xanker,

heute ist mir aufgefallen, dass in der Anrufliste ca. 1/3 der älteren Anrufe nicht angezeigt werden, der Rahmen bzw. Platz dafür ist aber vorgesehen, aber komplett einfarbig leer.
Ein Bild kann ich wegen der Vertraulichkeit der Daten nicht anhängen.

Ein list meines Devices:

Code Auswählen Erweitern

defmod Anrufliste FB_CALLLIST Callmonitor
attr Anrufliste expire-calls-after 7 days
attr Anrufliste language de
attr Anrufliste number-of-calls 40
attr Anrufliste room Network
attr Anrufliste show-icons 1
attr Anrufliste sortby 29
attr Anrufliste time-format-string %a, %d.%m.%Y %H:%M:%S
attr Anrufliste visible-columns state,timestamp,name,number,duration,internal,external,connection



Mein letztes update ist von gestern abend (5.8.2019, 22:00).

Da brauche ich irgendwie mehr Informationen, am besten den HTML Code, gerne auch per PN - die Nummern/Namen kannst du ja händisch löschen. Ich habe eine calllist mit "number-of-calls 15" und die werden auch alle angezeigt.
Ich nutze das Modul zwar nicht, aber ich kann mir vorstellen, dass das noch nie ging. Problem: Das Modul fügt dem Raum "AlarmRoom" eine weitere Tabelle mit der CSS-Klasse "roomoverview" hinzu. Diese Tabelle existiert normal nur einmal innerhalb eines Raumes, zumindest bin ich davon ausgegangen und habe den Javascript Code darauf ausgelegt. Wenn du mir mal den HTML Code mit dem f18 Style und mit dem flex Style schicken könntest, dann kann ich mal schauen was sich machen lässt.

Ein list des devices, mit anonymisierten Adressdaten:

Code Auswählen Erweitern

Internals:
   CFGFN      ./FHEM/FritzboxUniFiAnwesenheit.cfg
   DEF        Callmonitor
   FB         Callmonitor
   FUUID      5c430dc8-f33f-b139-d19f-e85cae902c7380b5
   NAME       Anrufliste
   NOTIFYDEV  global,Callmonitor
   NR         101
   NTFY_ORDER 50-Anrufliste
   STATE      Initialized
   TYPE       FB_CALLLIST
   helper:
     DEFAULT_COLUMN_ORDER row,state,timestamp,name,number,internal,external,connection,duration
     LAST_CALL_ID 1
     LAST_EVENT disconnect
     DATA:
       1564583391.44105:
         call_duration 15
         call_id    0
         direction  incoming
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1564583417.82611
         internal_connection DECT_3
         internal_index 1564583391.44105
         internal_number 02143103913
         last_event disconnect
       1564583541.69254:
         call_duration 1253
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1564584803.68097
         internal_connection DECT_1
         internal_index 1564583541.69254
         internal_number 02143103913
         last_event disconnect
       1564584897.77625:
         call_duration 657
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1564585563.3317
         internal_connection DECT_1
         internal_index 1564584897.77625
         internal_number 02143103913
         last_event disconnect
       1564680304.76482:
         call_duration 215
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1564680525.13746
         internal_connection DECT_1
         internal_index 1564680304.76482
         internal_number 02143103913
         last_event disconnect
       1564730131.81168:
         call_duration 632
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1564730777.81779
         internal_connection DECT_1
         internal_index 1564730131.81168
         internal_number 02143103913
         last_event disconnect
       1564745356.47652:
         call_duration 2
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1564745360.28992
         internal_connection DECT_3
         internal_index 1564745356.47652
         internal_number 02143103913
         last_event disconnect
       1564745385.28334:
         call_duration 185
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1564745573.10951
         internal_connection DECT_3
         internal_index 1564745385.28334
         internal_number 02143103913
         last_event disconnect
       1564752954.78077:
         call_duration 309
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1564753280.29842
         internal_connection DECT_1
         internal_index 1564752954.78077
         internal_number 02143103913
         last_event disconnect
       1564816064.28245:
         call_duration 223
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1564816297.41461
         internal_connection DECT_1
         internal_index 1564816064.28245
         internal_number 02143103913
         last_event disconnect
       1564817652.95643:
         call_duration 382
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1564818050.59189
         internal_connection DECT_1
         internal_index 1564817652.95643
         internal_number 02143103913
         last_event disconnect
       1565009203.98323:
         call_duration 104
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1565009329.62158
         internal_connection DECT_1
         internal_index 1565009203.98323
         internal_number 02143103913
         last_event disconnect
       1565009366.38556:
         call_duration 57
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1565009459.64605
         internal_connection DECT_1
         internal_index 1565009366.38556
         internal_number 02143103913
         last_event disconnect
       1565011938.7703:
         call_duration 76
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1565012019.2793
         internal_connection DECT_3
         internal_index 1565011938.7703
         internal_number 02143103913
         last_event disconnect
       1565071562.29311:
         call_duration 0
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1565071610.20359
         internal_connection DECT_1
         internal_index 1565071562.29311
         internal_number 02143103913
         last_event disconnect
         missed_call 1
       1565071880.79235:
         call_duration 54
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name unknown
         external_number unbekannt
         finished   1565071965.27999
         internal_connection DECT_1
         internal_index 1565071880.79235
         internal_number 02143103913
         last_event disconnect
       1565090602.6602:
         call_duration 469
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1565091083.16921
         internal_connection DECT_1
         internal_index 1565090602.6602
         internal_number 02143103913
         last_event disconnect
       1565160736.57721:
         call_duration 226
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1565160981.1446
         internal_connection DECT_1
         internal_index 1565160736.57721
         internal_number 02143103913
         last_event disconnect
       1565161407.67792:
         call_duration 145
         call_id    0
         direction  incoming
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1565161569.69279
         internal_connection DECT_3
         internal_index 1565161407.67792
         internal_number 02143103913
         last_event disconnect
       1565167283.71841:
         call_duration 8
         call_id    1
         direction  outgoing
         external_connection SIP0
         external_name Unknown
         external_number unbekannt
         finished   1565167309.85522
         internal_connection DECT_1
         internal_index 1565167283.71841
         internal_number 02143103913
         last_event disconnect
     ICON_MAP:
Attributes:
   expire-calls-after 7 days
   language   de
   number-of-calls 40
   room       Network
   show-icons 1
   sortby     29
   time-format-string %a, %d.%m.%Y %H:%M:%S
   visible-columns state,timestamp,name,number,duration,internal,external,connection


Das Problem tritt nicht auf bei: large screen mit Chrome und Firefox, und small screen mit Firefox
Das Problem tritt reproduzierbar an verschiedenen Tagen mit verschiedenem Inhalt auf: nur mit small screen und Chrome - was aber mein bevorzugter Browser auf dem Handy ist.

Ich sollte dir den HTML Code mit dem f18 Style schicken: da gibt es nur ?? ?? auf meiner Stirn - wie mach ich das?

Viele Grüße Gisbert

[xanker]

Ein list des devices, mit anonymisierten Adressdaten:

Du bist ein klein wenig zu spät, das Problem sollte schon gelöst sein, siehe ein Post über deinem 

[xanker]

Aufgefallen ist es mir bei l4fill. Daraufhin habe ich noch mit höheren Indizes getestet, ich meine 5-7 habe ich ausprobiert und konnte es reproduzieren. Bei den niedrigeren bin ich mir nicht sicher, da ich dort wenn überhaupt nur die Farbtöne leicht verändert habe und das dann beim Gradienten nicht besonders auffallen würde.

Also ich habe das nun umgestellt, dass alle defs per Javascript gesetzt werden. Somit wird jetzt für die Gradienten die Farbe direkt gesetzt, anstatt sie per CSS zu modifizieren. Damit ist der Style nun komplett unabhängig von svg_style.css und svg_defs.svg. Zudem habe ich das mit der Farbgebung der Gradienten geändert. Start- und Endfarbe sind nun genau gleich, lediglich die Transparenz wird angepasst: von unten (60%) nach oben (30%). Somit wird der Gradient bei einem hellen Plothintergrund nach oben hin heller und bei einem dunklen Hintergrund entsprechend dunkler. Ich hoffe damit ist jeder einverstanden

[adnan]

seit dem letzten update zeigt der safari (12.1.2) auf dem mac keinen inhalt mehr. die seite bleibt weiß. auf chrome funktioniert ist.

[Pitcher90]

Hallo xanker,
Ich habe ein seltsames Verhalten bei deinem Style festgestellt. Das erste mal ist es mir vor 5-6 Tagen aufgefallen. Erst jetzt bin ich mir sicher, dass es mit deinem Style zusammenhängt.
Und zwar: Wenn ich im Dropdown-Menü eine Option auswähle und danach gleich eine andere, dann wechselt es quasi in Endlosschleife hin und her. Ich habe das auch mal auf Video festgehalten.
https://www.dropbox.com/s/t77199108u3fx6p/VID_20190808_190830.mp4?dl=0

Ansonsten finde ich deinen Style aber super! Ich hoffe du findest eine Lösung für das Problem. Solang muss ich leider wieder f18 benutzen :/

[Gisbert]

Du bist ein klein wenig zu spät, das Problem sollte schon gelöst sein, siehe ein Post über deinem 

Hallo xanker,
sorry, ich hatte das glatt übersehen.
Ich habe gerade ein update gemacht, allerdings ist es auf dem Handy in Chrome immer noch abgeschnitten.
Es werden 12 Telefonate angezeigt, und der 13te ist halb sichtbar, was ich merkwürdig finde.
Beim 13ten Eintrag sind von den üblichen 3 Zeilen 2 sichtbar, die 3. Zeile sowie die nachfolgenden Einträge sind nicht sichtbar, wobei aber der Platz für den fehlenden "Block" in eineitlicher Farbe vorhanden ist.
Die ersten 12 Einträge kann man auf dem Handy antippen, wobei sich die Farbe des Hintergrunds auf dunklegrau ändert.
Bei dem letzten, 13ten Eintrag und folgende kann man diesen größeren "Block" nicht antippen.

Hoffentlich hilft dir mein Geschwurbel weiter, ein Screenshot sagt aber mehr als Tausend Worte.

Viele Grüße Gisbert

[xanker]

seit dem letzten update zeigt der safari (12.1.2) auf dem mac keinen inhalt mehr. die seite bleibt weiß. auf chrome funktioniert ist.

Danke, das werde ich mir gleich mal anschauen.

Hallo xanker,
Ich habe ein seltsames Verhalten bei deinem Style festgestellt. Das erste mal ist es mir vor 5-6 Tagen aufgefallen. Erst jetzt bin ich mir sicher, dass es mit deinem Style zusammenhängt.
Und zwar: Wenn ich im Dropdown-Menü eine Option auswähle und danach gleich eine andere, dann wechselt es quasi in Endlosschleife hin und her. Ich habe das auch mal auf Video festgehalten.
https://www.dropbox.com/s/t77199108u3fx6p/VID_20190808_190830.mp4?dl=0

Ansonsten finde ich deinen Style aber super! Ich hoffe du findest eine Lösung für das Problem. Solang muss ich leider wieder f18 benutzen :/

Was es nicht alles gibt 
Das scheint ein Harmony Device zu sein? Ich habe das gerade nämlich mal bei mir mit einem Harmony Device getestet, und dort tritt das Problem auch auf, allerdings nicht in der Geschwindigkeit wie bei deinem Video. Das Problem tritt aber auch beim f18 Style auf, somit ist das wohl ein Problem mit dem Harmony Modul. Ich konnte das auch erst durch Ausstecken des Harmony Hubs wieder beenden.

Ich habe das auch mit mehreren anderen Selects (Dropdown-Menüs) getestet, bei keinem anderen tritt dieses Problem auf.

Ich habe gerade ein update gemacht, allerdings ist es auf dem Handy in Chrome immer noch abgeschnitten.

Das könnte noch daran liegen, dass noch was im Cache ist. Mobil kann man den ja nicht so schön löschen wie am PC (STRG+F5). Versuche es mal in einem Inkognito-Tab, der nutzt meines wissen einen anderen Cache.

[schwatter]

Cache auf Mobil geht schnell zu löschen.

Einstellungen-->Apps-->Chrome-->Speicher-->Cache leeren

[Icinger]

Das scheint ein Harmony Device zu sein?

Nein, liegt nicht an Harmony.....Kann ich hier auch nachstellen, mit einem Dummy mit WebCmd und einem Notify, welches darauf triggert.......Das läuft dann in Dauerschleife, sobald ich was auswähle.

lg, Stefan

[xanker]

seit dem letzten update zeigt der safari (12.1.2) auf dem mac keinen inhalt mehr. die seite bleibt weiß. auf chrome funktioniert ist.

Also ich habe kein Mac, nur ein altes iPhone 5s zum testen und dort funktioniert alles 

Cache auf Mobil geht schnell zu löschen.

Einstellungen-->Apps-->Chrome-->Speicher-->Cache leeren

Das bringt nichts, da löscht nur den Cache von der App an sich, aber NICHT den Cache von einzelnen Websites. Diesen kann man nur löschen über:
Chrome Einstellungen -> Webseiten Einstellungen -> Speicher -> Webseite auswählen/suchen -> Löschen & zurücksetzen

Und das finde ich extrem nervig, daher hängt bei mir während der Entwicklung das Smartphone am PC und ich nutze Remote Debugging über Chrome, dann wird bei einem Reload immer automatisch der Cache geleert.

Nein, liegt nicht an Harmony.....Kann ich hier auch nachstellen, mit einem Dummy mit WebCmd und einem Notify, welches darauf triggert.......Das läuft dann in Dauerschleife, sobald ich was auswähle.

Interessant, bei mir passiert das nur beim Harmony Hub
Nutzt ihr Chrome?

[Icinger]

Ja, Chrome auf Linux.

Hier mal schnell zusammengestöpselt zum testen. Hoffe, ich hab keinen Fehler drinnen, ist aus meinem Live-System kopiert und nur die Devicenamen leicht abgeändert.

Code Auswählen Erweitern

defmod dmy_Test dummy
attr dmy_Test DbLogExclude .*
attr dmy_Test readingList Badebetrieb Stefan Petra Nachbarn alle Chemie Menge pH_plus pH_minus Wasser Chlor
attr dmy_Test setList Badebetrieb:select,--,Stefan,Petra,Nachbarn,alle Chemie:select,Wasser,pH_plus,pH_minus,Chlor,Chlortab,Flock Menge:select,--,0.1,0.2,0.3,0.4,0.5,0.6,0.7,0.8,0.9,1,2,3,4,5,6,7,8,9,10,Tablette


defmod di_Test DOIF ([dmy_Test:"Menge:.\d+(\.\d+)?"]) (setreading dmy_Test [dmy_Test:Chemie] {([dmy_Test:Menge]+(ReadingsVal("dmy_Test",ReadingsVal("dmy_Test","Chemie",""),0)));})
(setreading dmy_Test Menge --)
DOELSEIF ([dmy_Test:"Badebetrieb"]) (setreading dmy_Test [dmy_Test:Badebetrieb] {(ReadingsVal("dmy_Test",ReadingsVal("dmy_Test","Badebetrieb",""),0)+1);})
  (setreading dmy_Test Badebetrieb --)
DOELSEIF ([dmy_Test:"Menge:.Tablette"])    (setreading dmy_Test [dmy_Test:Chemie] {(1+(ReadingsVal("dmy_Test",ReadingsVal("dmy_Test","Chemie",""),0)));})
(setreading dmy_Test Menge --)
DOELSE ()
attr di_Test DbLogExclude .*
attr di_Test do always


defmod rg_Pool readingsGroup dmy_Test:,<Badebetrieb>,<>,Badebetrieb,!Stefan,!Petra,!Nachbarn\
dmy_Test:,<Chemie:>,<>,!Wasser,!Chlor,!pH_minus,!pH_plus\
dmy_Test:,<>,<>,!Flock,!Chlortab,<>,<>\
dmy_Test:,<Dosierung>,<>,Chemie@dmy_PoolChemie,Menge
attr rg_Pool commands { 'Chemie' => 'Chemie:','Menge' => 'Menge:',"Badebetrieb" => "Badebetrieb:"}


Beim Auswählen von zB "Chemie --> Chlor" und danach "Menge--> 1" sollte eigentlich das reading nur um 1 erhöht werden.
War bisher auch so.
Seit neuestem (ist mir vorhin erst aufgefallen, nachdem ich das gelesen hatte), zählts in einer Endlosschleife hoch.

[xanker]

Ja, Chrome auf Linux.

Hier mal schnell zusammengestöpselt zum testen. Hoffe, ich hab keinen Fehler drinnen, ist aus meinem Live-System kopiert und nur die Devicenamen leicht abgeändert.

Code Auswählen Erweitern

defmod dmy_Test dummy
attr dmy_Test DbLogExclude .*
attr dmy_Test readingList Badebetrieb Stefan Petra Nachbarn alle Chemie Menge pH_plus pH_minus Wasser Chlor
attr dmy_Test setList Badebetrieb:select,--,Stefan,Petra,Nachbarn,alle Chemie:select,Wasser,pH_plus,pH_minus,Chlor,Chlortab,Flock Menge:select,--,0.1,0.2,0.3,0.4,0.5,0.6,0.7,0.8,0.9,1,2,3,4,5,6,7,8,9,10,Tablette


defmod di_Test DOIF ([dmy_Test:"Menge:.\d+(\.\d+)?"]) (setreading dmy_Test [dmy_Test:Chemie] {([dmy_Test:Menge]+(ReadingsVal("dmy_Test",ReadingsVal("dmy_Test","Chemie",""),0)));})
(setreading dmy_Test Menge --)
DOELSEIF ([dmy_Test:"Badebetrieb"]) (setreading dmy_Test [dmy_Test:Badebetrieb] {(ReadingsVal("dmy_Test",ReadingsVal("dmy_Test","Badebetrieb",""),0)+1);})
  (setreading dmy_Test Badebetrieb --)
DOELSEIF ([dmy_Test:"Menge:.Tablette"])    (setreading dmy_Test [dmy_Test:Chemie] {(1+(ReadingsVal("dmy_Test",ReadingsVal("dmy_Test","Chemie",""),0)));})
(setreading dmy_Test Menge --)
DOELSE ()
attr di_Test DbLogExclude .*
attr di_Test do always


defmod rg_Pool readingsGroup dmy_Test:,<Badebetrieb>,<>,Badebetrieb,!Stefan,!Petra,!Nachbarn\
dmy_Test:,<Chemie:>,<>,!Wasser,!Chlor,!pH_minus,!pH_plus\
dmy_Test:,<>,<>,!Flock,!Chlortab,<>,<>\
dmy_Test:,<Dosierung>,<>,Chemie@dmy_PoolChemie,Menge
attr rg_Pool commands { 'Chemie' => 'Chemie:','Menge' => 'Menge:',"Badebetrieb" => "Badebetrieb:"}


Beim Auswählen von zB "Chemie --> Chlor" und danach "Menge--> 1" sollte eigentlich das reading nur um 1 erhöht werden.
War bisher auch so.
Seit neuestem (ist mir vorhin erst aufgefallen, nachdem ich das gelesen hatte), zählts in einer Endlosschleife hoch.

Danke, damit kann ich es nachstellen. ABER auch mit f18! das ist wohl ein Problem vom letzten fhemweb.js update. Ich ändere mit meinem Style auch absolut nichts an dem Webcmds, mal abgesehen vom Aussehen.

Edit: Echt merkwürdiges Verhalten. das muss man aber auf jeden Fall melden.

[Icinger]

Ok, kann sein, hab keinen anderen Style getestet. Wie gesagt, ist mir grad vorhin erst aufgefallen, nachdem ich oben den Post gelesen hatte (und damit irgendwie ganz automatisch davon ausgegangen bin, dass es flex betrifft)