FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: namor am 22 Oktober 2016, 08:18:48

Titel: [gelöst] Frage zu Pagebutton und Untermenü (Circlemenu)
Beitrag von: namor am 22 Oktober 2016, 08:18:48
Hallo zusammen,

ich versuche mich an einer Möglichkeit bei dem Pagebuttonmenü (aus @setstates Eval Beispiel Menü links) irgendwie Unterseiten mit einzubauen.
Entweder über ein Circlemenu um einzelne Seiten je Zimmer darzustellen.
Oder wen möglich in der Unterseite "Zimmer" ein zusätzliches Auswahlmenü für die einzelnen Zimmer (deren Seiten)zu bauen.

Habe mich schon an beidem versucht, das Circlemenu wird zwar angezeigt aber beim anklicken der Unterpunkte wechselt nix auf die Unterseite der einzelnen Zimmer :(

Spekulativ habe ich vermutet das mein Pagebuttenmenü die Unterseite ja nicht kennt wie hier https://forum.fhem.de/index.php/topic,56529.msg481128.html#msg481128 (https://forum.fhem.de/index.php/topic,56529.msg481128.html#msg481128) erwähnt.
Jegliche Versuche )try & Error) haben nix gebracht.

Hat mir da jemand einen Tip
Titel: Antw:Frage zu Pagebutton und Untermenü
Beitrag von: Gollum2 am 22 Oktober 2016, 10:24:46
Meinst du sowas?


<div data-type="circlemenu" class="cell">
      <ul class="">
            <li><div data-type="push" data-icon="fa-wrench"></div></li>
              <li><div data-type="pagetab" data-url="#" data-icon="fa-home" class="cell"></div></li>
              <li><div data-type="pagetab" data-url="eg.html"  data-icon="oa-control_building_modern_s_okg_eg" class="cell"></div></li>
              <lli><div data-type="pagetab" data-url="og.html"  data-icon="oa-control_building_modern_s_okg_og" class="cell"></div></li>
              <li><div data-type="pagetab" data-url="dg.html"  data-icon="oa-control_building_modern_s_okg_dg" class="cell"></div></li>
              <li><div data-type="pagetab" data-url="ab.html"  data-icon="oa-control_building_outside" class="cell"></div></li>
     <li><div data-type="pagetab" data-url="info.html"  data-icon="fa-info" class="cell"></div></li>
    </ul>
</div>
<div data-type="label" class="narrow darker">Men&uuml;</div>
Titel: Antw:Frage zu Pagebutton und Untermenü
Beitrag von: Gollum2 am 22 Oktober 2016, 10:28:47
Oder soll aus dem ersten menu noch ein weiters aufpoppen?

Also Klick auf Menü...dann kommt OG , UG usw...dann klick auf OG und dann z.b. Schafzimmer, Bad....
Titel: Antw:Frage zu Pagebutton und Untermenü
Beitrag von: namor am 23 Oktober 2016, 08:08:27
Hallo Gollum2

die zweite Variante ist mein Ziel.
Danke für den Schubs, bin nun ein Stück weiter.
Buttons funktionieren nun.

Problem ist nun noch der Platz, wenn das Menü im Kreis auf macht, verschwindet der 4te Button (es sind 4 Stockwerke, UG,EG,OG,DG)links aus dem Bildschirm.

Bin weiter am versuchen.

Danke
Titel: Antw:Frage zu Pagebutton und Untermenü
Beitrag von: namor am 23 Oktober 2016, 09:33:43
Geschafft!

Hier meine Lösung:

Wer das Pagebutton -Menü aus @setstates Eval Beispiel Menü- links verwendet, kann einen Circlemenue, welches auf weitere Seiten verlinkt folgendermaßen aufbauen.

1. Die weiteren Seiten benötigen die selbe Deklaration des "content" wie die anderen (direkten Pagebutton-Seiten im Menü) auch.
2. Nun das Circlemenu einbauen.

Die Reihenfolge und die Icons muss ich noch anpassen...

<div data-type="circlemenu" data-border="round"
          data-item-width="1" data-item-height="1"
          data-circle-radius="60"
          data-direction="vertical"
          class="circlemenu top-space right-space-3x ">
        <ul class="menu">
   
            <li><div data-type="push" data-off-background-color="transparent" data-off-color="#56728f" data-on-background-color="transparent" data-on-color="#cceeff" data-icon="fa-sign-in"></div></li>
             
               <li><div data-type="pagebutton" data-url="#content_zimmer_ug.html" data-load="#content9"   data-off-background-color="transparent" data-off-color="#56728f" data-on-background-color="#56728f" data-on-color="#cceeff" data-active-pattern=".*#content_zimmer_ug.html" data-icon="oa-control_building_kg"  class="cell"></div></li>
             <li><div data-type="pagebutton" data-url="#content_zimmer_og.html" data-load="#content10"  data-off-background-color="transparent" data-off-color="#56728f" data-on-background-color="#56728f" data-on-color="#cceeff" data-active-pattern=".*#content_zimmer_og.html"  data-icon="oa-control_building_modern_s_okg_eg"  class="cell"></div></li>
               <li><div data-type="pagebutton" data-url="#content_zimmer_eg.html" data-load="#content11"  data-off-background-color="transparent" data-off-color="#56728f" data-on-background-color="#56728f" data-on-color="#cceeff" data-active-pattern=".*#content_zimmer_eg.html"  data-icon="oa-control_building_modern_s_okg_eg"  class="cell"></div></li>
                 <li><div data-type="pagebutton" data-url="#content_zimmer_dg.html" data-load="#content12"  data-off-background-color="transparent" data-off-color="#56728f" data-on-background-color="#56728f" data-on-color="#cceeff" data-active-pattern=".*#content_zimmer_dg.html"  data-icon="oa-control_building_modern_s_okg_eg"  class="cell"></div></li>
     
      </ul>
      </div>


@Gollum2

Vielen Dank nochmal für Deine Unterstützung