FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: Sturi2011 am 01 Juli 2023, 20:40:28

Titel: [FTUI3] Moon component
Beitrag von: Sturi2011 am 01 Juli 2023, 20:40:28
Hallo,

was mit im FTUI3 noch fehlte war eine Komponente für die Mondphasen.
Ich habe das mal umgesetzt. Die Komponente verwendet wenig Script und
arbeitet mit einem maskierten inline SVG. Die Schatten und Weichzeichner
sind Ebenen, die im SVG ein / ausgeblendet werden.

https://github.com/Sturi2011/ftui/tree/addons/www/ftui/components/moon (https://github.com/Sturi2011/ftui/tree/addons/www/ftui/components/moon)

Die Mond Komponente hat folgende Attribute:

      color:      setzt die Farbe des Monds, optional
      value:      setzt den Mondphasenzeitraum akzeptiert 0-100
      hasshadows: gibt an, ob der Mond Schatten / Struktur hat, optional, Standard ohne Schatten
      hasblur:    gibt an, ob der Erdschatten weichgezeichnet wird, optional, Standard ohne Weichzeichnen
      opacity:    gibt die Schattenabdeckung an, akzeptiert 0-100, optional, Standard 100

Einbindung in FTUI3:
<header>Mond</header>
  <ftui-cell>
    <ftui-moon [value]="MyWeather:fc1_moonPhaseDay | scale(0,30,0,100)" hasshadows hasblur opacity="90" class="size-7" ></ftui-moon>
    <ftui-label [text]="MyWeather:fc1_moonPhase | part(1)" size="2" color="white"></ftui-label>
    <ftui-label [text]="MyWeather:fc1_moonPhase | part(2)" size="2" color="white"></ftui-label>
  </ftui-cell>
</ftui-grid-tile>

Viel Spaß beim Testen!

PS: Ja ich weiß, dass es das Astro Modul und die Möglichkeit Mondicons über Icon direkt aus dem Internet einzubinden.
Das Astro Modul ist eine gute Grundlage um aus dem Winkel über scale in 0-100 umzurechnen.
Meine Daten für den Mondtag habe ich aus Loredos Wetter Modul über die wundergroundAPI.

Gruß Andreas
Titel: Aw: [FTUI3] Moon component
Beitrag von: Sturi2011 am 02 Juli 2023, 21:07:45
Hi,

neue Version - etwas verschlankt und 2 Typos behoben.
Der Link im ersten Post passt noch.

Gruß Andreas
Titel: Aw: [FTUI3] Moon component
Beitrag von: andreas_r am 03 Juli 2023, 14:49:49
Hier noch die Variante für das Astro (https://wiki.fhem.de/wiki/Modul_Astro) Modul, falls das jemand verwendet:

      <header>Mondphase</header>
        <ftui-moon [value]="Astro:MoonAge | scale(0,360,0,100)" hasshadows hasblur opacity="90"
          class="size-9"></ftui-moon>
        <ftui-label [text]="Astro:MoonPhaseS"></ftui-label>

VG, Andreas
Titel: Aw: [FTUI3] Moon component
Beitrag von: AyshaHM am 13 Juli 2023, 11:54:15
Hallo ihr beiden,
vielen Dank für eure Arbeit! Das hat mir auch gefehlt.

Gruß Aysha

Titel: Aw: [FTUI3] Moon component
Beitrag von: TheAbalone am 02 August 2023, 21:18:02
Zitat von: Sturi2011 am 01 Juli 2023, 20:40:28Hallo,

was mit im FTUI3 noch fehlte war eine Komponente für die Mondphasen.
Ich habe das mal umgesetzt. Die Komponente verwendet wenig Script und
arbeitet mit einem maskierten inline SVG. Die Schatten und Weichzeichner
sind Ebenen, die im SVG ein / ausgeblendet werden.

https://github.com/Sturi2011/ftui/tree/addons/www/ftui/components/moon (https://github.com/Sturi2011/ftui/tree/addons/www/ftui/components/moon)

Die Mond Komponente hat folgende Attribute:

      color:      setzt die Farbe des Monds, optional
      value:      setzt den Mondphasenzeitraum akzeptiert 0-100
      hasshadows: gibt an, ob der Mond Schatten / Struktur hat, optional, Standard ohne Schatten
      hasblur:    gibt an, ob der Erdschatten weichgezeichnet wird, optional, Standard ohne Weichzeichnen
      opacity:    gibt die Schattenabdeckung an, akzeptiert 0-100, optional, Standard 100

Einbindung in FTUI3:
<header>Mond</header>
  <ftui-cell>
    <ftui-moon [value]="MyWeather:fc1_moonPhaseDay | scale(0,30,0,100)" hasshadows hasblur opacity="90" class="size-7" ></ftui-moon>
    <ftui-label [text]="MyWeather:fc1_moonPhase | part(1)" size="2" color="white"></ftui-label>
    <ftui-label [text]="MyWeather:fc1_moonPhase | part(2)" size="2" color="white"></ftui-label>
  </ftui-cell>
</ftui-grid-tile>

Viel Spaß beim Testen!

PS: Ja ich weiß, dass es das Astro Modul und die Möglichkeit Mondicons über Icon direkt aus dem Internet einzubinden.
Das Astro Modul ist eine gute Grundlage um aus dem Winkel über scale in 0-100 umzurechnen.
Meine Daten für den Mondtag habe ich aus Loredos Wetter Modul über die wundergroundAPI.

Gruß Andreas

Hallo!

Mich irritieren die Bilder von den Monden ein bisschen. So schaut doch kein zunehmender Halbmond aus, sondern eine partielle Mondfinsternis?!
 https://img.fotocommunity.com/zunehmender-halbmond-3-cbfd3f30-bc1a-4d90-be95-39f615c5aa2d.jpg?height=1000 (https://img.fotocommunity.com/zunehmender-halbmond-3-cbfd3f30-bc1a-4d90-be95-39f615c5aa2d.jpg?height=1000)
Titel: Aw: [FTUI3] Moon component
Beitrag von: Kuehnhackel am 26 August 2023, 09:17:57
Hi Andreas,
habe dieses bei mir angepasst und eingefügt, aber es erscheint kein Bild.
Zitat von: andreas_r am 03 Juli 2023, 14:49:49Hier noch die Variante für das Astro (https://wiki.fhem.de/wiki/Modul_Astro) Modul, falls das jemand verwendet:

      <header>Mondphase</header>
        <ftui-moon [value]="Astro:MoonAge | scale(0,360,0,100)" hasshadows hasblur opacity="90"
          class="size-9"></ftui-moon>
        <ftui-label [text]="Astro:MoonPhaseS"></ftui-label>

VG, Andreas

Habe mich an folgendem orientiert: https://wiki.fhem.de/wiki/FTUI_Beispiel_Mondphase

Vielleicht sehe ich ja den berühmten Wald nicht.

LG Ralf
Titel: Aw: [FTUI3] Moon component
Beitrag von: andreas_r am 28 August 2023, 20:44:45
@Autor Kuehnhackel

Wie heisst Dein Astro Device? Wenn Du es wei im WIki benannt hast, müsstest Du die Definition entsprechend so ändern:

      <header>Mondphase</header>
        <ftui-moon [value]="SonneMond:MoonAge | scale(0,360,0,100)" hasshadows hasblur opacity="90"
          class="size-9"></ftui-moon>
        <ftui-label [text]="SonneMond:MoonPhaseS"></ftui-label>