- √ - [Smartphone] Anordnung Gruppen

[XueSheng]

Testweise habe ich mal das aktuelle develop aus dem git gezogen. Dabei ist mir aufgefallen, dass die Anordnung von Groups auf dem Smartphone nicht mehr so will wie bisher. Bin mir auch nicht sicher, ob das Smartphone als Mobil erkannt wird und habe deshalb auch mal den Parameter "forceDevice=mobile" getestet, jedoch ohne Erfolg.

Anbei die beiden Screenshots und die entsprechende config. Im Vergleich das alte svn mit rev2339 und das aktuelle git:develop mit rev5103.

Mein Ziel ist, dass die Groups1-4 abhängig von der verfügbaren Screenbreite entweder nebeneinander oder eben untereinander angezeigt werden. So wie es eigentlich bislang auch funktioniert hat. Hat jemand eine Idee wo ich hier ansetzen kann?

[Chris M.]

Es kann durchaus sein, dass die aktuelle Code-Umstellung hier etwas zerstört hat.

Um die Ursache zu finden, wäre es super, wenn Du das generierte HTML der beiden Versionen vergleichen könntest.
(Bisher ist es immer dadurch schief gelaufen, dass irgendwo "width:auto" steht wo eigentlich "width:100%" o.ä. stehen sollte)

[XueSheng]

Um die Ursache zu finden, wäre es super, wenn Du das generierte HTML der beiden Versionen vergleichen könntest.

Danke für den Denkanstoß! Ich habe mal versucht das im debug Modus des Firefox nachzuvollziehen.

Folgender Auszug scheint mir relevant zu sein (visu aus git:develop rev5103):

<div class="widget clearfix group ">
<div class="clearfix">
<h2 style="text-align:left;">Status (Übersicht)</h2>
<div style="width: 50%;" class="widget_container " id="id_0_0" [COLOR=Red][B]data-type="group"[/B][/COLOR]>
<div class="clearfix group">
<div class="clearfix">
<h2>Group1</h2>
<div style="width: 16.6667%;" class="widget_container " id="id_0_0_0" [B][COLOR=Red]data-type="text"[/COLOR][/B]>
<div class="widget clearfix text " style="">
<div [B][COLOR=Red]class=""[/COLOR][/B]>Test</div>
</div>
</div>
<div style="width: 16.6667%;" class="widget_container " id="id_0_0_1" [B][COLOR=Red]data-type="text"[/COLOR][/B]>
<div class="widget clearfix text " style="">
<div [B][COLOR=Red]class="[/COLOR][COLOR=Red]"[/COLOR][/B]>Test</div>
</div>
</div>

Die Angaben zu "data-type" und die leeren "class" Elemente gibt es in der alten Visu nicht! Die "width" Angaben sind alle identisch! Ich hab jetzt keine Möglichkeit gefunden den html code im Firefox "live" ändern zu können, um das zu testen...
Könnte dieser Unterschied schon dafür verantwortlich sein?

[Chris M.]

Das data-type ist harmlos und bewusst in der neuen Version drinnen.

Was mich aktuell wundert, ist wo das class herkommt - im Code selbst sehe ich spontan nicht die Stelle wo das reinkommt...
Aber: war dieses class früher befüllt?

Falls nein, dann kann das auch nicht die Ursache sein.

Falls ja: heiße Spur!

[XueSheng]

Was mich aktuell wundert, ist wo das class herkommt - im Code selbst sehe ich spontan nicht die Stelle wo das reinkommt...
Aber: war dieses class früher befüllt?

Das class gab es früher nicht! Ich habe jetzt noch mal die komplette html Seite gespeichert und mit vimdiff verglichen. Es sind tatsächlich nur data-type und class, die sich unterscheiden!

Das Problem existiert natürlich nicht nur auf dem Smartphone. Da ist es mir halt aufgefallen. Anbei mal die beiden Screenshots mit Firefox auf dem Desktop (Fenster so weit verkleinert, dass die Groups auch schön gestaucht werden).

[XueSheng]

Es sind tatsächlich nur data-type und class, die sich unterscheiden!

Wobei, stimmt auch nicht ganz: class mit clearfix Angabe unterscheidet sich durch ein zusätzliches Leerzeichen im git. Kann das eine Rolle spielen? Das waren aber dann wirklich alle Unterschiede! Habe mal die beiden html Seiten angefügt, die Firefox debug ausspuckt.

rev2339:

class="widget clearfix text"

rev5103:

class="widget clearfix text "

[XueSheng]

@Chris: Hast Du noch eine Idee? Komme hier irgendwie nicht weiter.

[Chris M.]

Ich schau's mir mal an.

[dombn]

Wobei, stimmt auch nicht ganz: class mit clearfix Angabe unterscheidet sich durch ein zusätzliches Leerzeichen im git. Kann das eine Rolle spielen? Das waren aber dann wirklich alle Unterschiede! […]

Das Leerzeichen im class Attribut spielt keine Rolle (außer es wäre ein sehr seltsamer Browserbug, wäre mir aber derzeit nicht bekannt).

[peuter]

Der Fehler wird vermutlich eher im Javascript Code als im CSS zu finden sein. Die Neuanordnung der Spalten hast Du in Deiner config mit enable_column_adjustment aktiviert, die sollte für das gewünschte Verhalten sorgen. Hab erst heute abend zeit mir das genauer anzugucken, wenn es bis dahin noch niemand gelöst hat schau ich auch mal drüber.

[peuter]

Nach erneutem Kampf mit Git, sollte das Problem durch Pull-request #30 behoben sein. Die Änderungen sind überschaubar (1 Zeile):

https://github.com/peuter/CometVisu/...c0eb1b84194a89

[XueSheng]

Danke peuter, Problem gelöst!!!