Intelligentes Menü und zurück zur Startseite nach Zeit x

[dt2510]

Nachdem ich jetzt ein Paar Tage gebastelt habe und auch Hilfe bei den bisherigen Problemen bekommen habe, hoffe ich auch jetzt auf eure Hilfe...

1) Ich möchte in meinem Menu die ausgewählte Seite farblich hervorheben (s. Screenshot). Hierzu habe ich auf jeder Seite das Menu entsprechend modifiziert. Einfacher wäre es aber das Menu per Include

Code Auswählen Erweitern

<li data-row="2" data-col="1" data-sizex="2" data-sizey="6" data-template="inc_mainmenu.html"></li>
einzubinden und einen Dummy Wert für die Färbung zu verwenden. Den Dummy Wert könnte ich beim Klicken auf den Menüpunkt setzen, hätte dann aber - wenn ich mit mehreren Tablets arbeite - auf jedem Tablet den gleichen Menüpunkt aktiv - unabhängig davon, ob ich auch auf genau dieser Seite bin. Gleiches gilt wenn ich den Browser verlasse und die Hauptseite neu lade. Die letzte gewählte Seite wäre dann aktiv. Wie könnte man das lösen ?

2) Ich möchte nach einer Zeit x wieder zurück zur Startseite, da dort das Kamerabild der Haustür angezeigt wird. Wie kann ich das machen ?

[setstate]

Beim pagebutton kann man data-return-time (in wieviel Sekunden zurück zum ersten Element) und data-active-pattern (RegEx was mit der URL matchen muss, damit der Button als Aktiv gesetzt wird) arbeiten.

[dt2510]

ich hab' mal folgendes versucht:

Code Auswählen Erweitern

<div
  data-type="pagebutton"
  data-url="index.html"
  data-active-pattern="index.html"
  data-icon="fa-home"
  data-on-color="#2a2a2a"
  data-on-background-color="#aa6900"
  data-off-color="#666666"
  data-off-background-color="transparent">
</div>
<div data-type="label" class="small darker">Startseite</div>


Ich bin mal davon ausgegangen, dass das Icon (fa-home) mit data-on-... Farben angezeigt wird, wenn ich mich auf der Seite index.html befinde und hellgrau mit transparentem Hintergrund auf anderen Seiten.
Allerdings wird es immer hellgrau angezeigt. Auch der 2. Button für meine Lichtsteuerung

Code Auswählen Erweitern

...
  data-url="licht.html"
  data-active-pattern="licht.html"
...


bleibt Grau - egal auf welcher Seite.

[Mario67]

Sieh Dir mal das Beispiel \examples\pagebutton\index_page_left_demo.html im Repository an.

Gruß,
Mario

[dt2510]

Ich hab' es an mein Menu angepasst und es scheint zu funktionieren - lediglich data-return-time funktioniert nicht.

Code Auswählen Erweitern

<div
              data-type="pagebutton"
              data-return-time="30"
              data-url="#content_shutters.html"
              data-load="#content_shutters"
              data-off-background-color="transparent"
              data-off-color="#666666"
              data-on-background-color="#aa6900"
              data-on-color="#2a2a2a"
              data-active-pattern=".*#content_shutters.html"
              data-icon="oa-fts_shutter_40"
              class="top-space">
            </div>

Die Startseite wird nie automatisch wider aufgerufen.

[dt2510]

Ich hab' es jetzt so gelöst, durch einen meta Eintrag in der index.html:

Code Auswählen Erweitern

<meta http-equiv="refresh" content="600; URL=index.html">

Dadurch wird alle 10 Minuten wieder die Startseite geladen.