[FTUI3] CalView

[mr_petz]

Edit:

Jetzt habe ich mal Zeit den neuen "einfachen" calview für FTUI3 vorzustellen.
Optisch sieht er dann so aus wie im Anhang von meinem html-code von unten.
Das lasse ich erstmal auch so stehen. Vielleicht will einer doch sich eine Kalenderanzeige selber erstellen.

Jetzt zum FTUI3 Calview.
Er greift auf die selben Daten wie der von FTUI2.x zu.
Der calview ist jetzt bereit zum testen.

OdfFhem und ich haben diesen für euch entwickelt.
Vielen dank nochmal an die Unterstützung von OdfFhem.

hier die Settings:
    device="Kalender-Device"
    headers="Datum,Zeit,Zusammenfassung" (Standard wenn nichts angegeben)(optional)
    details="bdate,btime,summary" (Standard wenn nichts angegeben)(optional)
    detailwidth="25,20,55" (Standardspaltenbreite wenn nichts angegeben)(optional)
    daysleft="4:red1:red1:blink:blink bold,10:orange:white:bold,14:green:white" (Beispielsetting)(Farben können auch als Hex-RGB angegeben werden)
    width="100%" (Standard)
    height="100%" (Standard)
    top="" (optional in px)
    max="5" (Standard)
    class="" (optional)
   
und extra Attribute:
    round (optional runde Ecken)
    wday_date (optional Datum wird auf Bsp: Fr, 01.10. gekürzt)
    date_wday (optional Datum wird auf Bsp: 01.10. Fr gekürzt)
    blinkoutside (optional Blinkt nur Aussen und/oder die Schrift wenn angegeben)
    noheader (optional kein header im calview bei Standardsettings)
    flat (optional flaches Design)
    sourcecolor (optional Farben vom Reading)
    today (optional nur Heute vom Reading)
    tomorrow (optional Heute und Morgen vom Reading)
    header-left (headertext left)
    line-left (Texte left ohne Zeilenumbruch)
    line-justify (Texte left und mit Zeilenumbruch am letzten white-space, wenn letzter white-space außerhalb von der Spalte ist, wird das letzte Wort wieder gekürzt (bei timeshort nur left mit break))
    line-break (Texte left und mit Zeilenumbruch am letzten white-space, wenn letzter white-space außerhalb von der Spalte ist, wird das letzte Wort wieder gekürzt)
    list-scroll (Liste wird bei Überlänge scrollbar ohne sichtbare Scrollbar, so kann man auf kleiner Höhe mehr Events darstellen lassen)

Jetzt zu Erklärung der daysleft.
daysleft="1:2:3:4:5"
1 -> Resttage
2 -> Farbe des Hintergrund
3 -> Farbe der Schrift
4 -> optionale FTUI3 Klassen wzB.: bold, size-x, blink (blinkt der Background), (Attribute getrennt durch Leerzeichen setzen)
5 -> optionale FTUI3 Klassen wzB.: bold, size-x; bei gesetzten Attribute blinkoutside und hier blink, blinkt die Schrift mit , (Attribute  getrennt durch Leerzeichen setzen)

Besonderheit blinkoutside:
Bsp1 mit blinkoutside:

Code Auswählen Erweitern


daysleft="4:red1:red1:blink:blink bold"
blinkoutside

hier wird die Schrift und die Aussenseiten (links/rechts) rot nach erreichen von 4 Resttagen und blinken in fetter Schrift

Bsp2 ohne blinkoutsite:

Code Auswählen Erweitern


daysleft="4:red1:white:blink bold"

hier ist der Hintergrund rot, die Schrift weiß und nach erreichen von 4 Resttagen blinkt alles in fetter Schrift


Beispielconfig:

Code Auswählen Erweitern


<ftui-calview
  device="GeburtstagView"
  width="98%"
  top="15px"
  headers="Tage,Datum,Name,Alter"
  details="daysleftLong,bdate,summary,age"
  daysleft="4:red1:red1:blink:blink bold,10:orange:white:bold,14:green:white:white"
  max="6"
  detailwidth="28,24,30,15"
  class="size-2"
  round
  wday_date
  blinkoutside>
</ftui-calview>


Runterladen zum testen könnt ihr den euch von hier:
Ist jetzt hier zu finden https://github.com/mr-petz/ftui/tree/addons

Code Auswählen Erweitern


update calview.component.js https://raw.githubusercontent.com/mr-petz/ftui/addons/controls_ftui_addons.txt
update calview.component.css https://raw.githubusercontent.com/mr-petz/ftui/addons/controls_ftui_addons.txt


Wenn ich was vergessen habe zu erwähnen, sagt bitte Bescheid.
Viel Spaß damit...
LG mr_petz



Hi.
Ich würde gern einen einfachen Kalender für FTUI3 haben wollen um den Einstieg für andere User zu erleichtern in FTUI3 rein zukommen...
Der bereits vorhandene ist mir persönlich zu üppig und man kann ihn nicht als einfachen Kalender wie unten zu sehen nutzen und anpassen.
Dazu habe ich OdfFhem im FTUI3 Thread gebeten sich der Sache anzunehmen, weil er beim "alten" calview_widget für FTUI2 mitgeproggt hat.

Ich würde mal für den Anfang beide Definitionen der FTUI2 und 3 hier posten um einen Anhaltspunkt zu haben/geben.
Das Device in fhem ist das gleiche für beide Versionen. (Calendar und CalView-Modul)

FTUI2:

Code Auswählen Erweitern


                <div class=""
data-type="calview"
data-device="GeburtstagView"
data-class-usage="row"
data-daysleft-values='[3,10,20]'
data-daysleft-classes='["blink","",""]'
data-detail='["weekdayname","bdate","summary","age"]'
data-detailwidth='["15","25","40","20"]'
data-get="all"
data-header='["Tag","Datum","Name","Alter"]'
data-max="6"
data-dateformat="short"
data-dayformat="short"
data-oneline="yes"
data-showempty="Derzeit keine Geburtstage">
</div>


und die jetzige Lösung in FTUI3 (ist eigentlich in einem content-file):

Code Auswählen Erweitern


<ftui-grid-tile row="1" col="2.5" height="4" width="9" shape="round">
<header><ftui-label class="size-1">Geburtstage</ftui-label></header>
<!-- Zeile1 --> <ftui-column>
<ftui-row height="10%" margin="0px" color="dark" shape="round" fweight="fett" class="lift">
<ftui-column>
<ftui-label class="size-1">
Tage
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1">
Datum
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1">
Name
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1">
Alter
</ftui-label>
</ftui-column>
</ftui-row>
<!-- Zeile2 -->
<ftui-row height="10%" margin="0px" [color]="GeburtstagView:t_001_daysleft | map('0:red,7:green,14:dark')" [class-name]="GeburtstagView:t_001_daysleft | map('0: blink,6:``')" shape="round">
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_001_daysleftLong">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_001_bdate | toDate() | format('DD.MM.')">
<ftui-label class="size-1"
[text]="GeburtstagView:t_001_weekdayname | function(x){return x.substr(0, 2)+ ', '}">
</ftui-label>
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_001_summary">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_001_age">
</ftui-label>
</ftui-column>

</ftui-row>
<!-- Zeile3 -->
<ftui-row height="10%" margin="0px" [color]="GeburtstagView:t_002_daysleft | map('0:red,7:green,14:dark')" [class-name]="GeburtstagView:t_002_daysleft | map('0: blink,6:``')" shape="round">
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_002_daysleftLong">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_002_bdate | toDate() | format('DD.MM.')">
<ftui-label class="size-1"
[text]="GeburtstagView:t_002_weekdayname | function(x){return x.substr(0, 2)+ ', '}">
</ftui-label></ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_002_summary">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_002_age">
</ftui-label>
</ftui-column>
</ftui-row>
<!-- Zeile4 -->
<ftui-row height="10%" margin="0px" [color]="GeburtstagView:t_003_daysleft | map('0:red,7:green,14:dark')" [class-name]="GeburtstagView:t_003_daysleft | map('0: blink,6:``')" shape="round">
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_003_daysleftLong">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_003_bdate | toDate() | format('DD.MM.')">
<ftui-label class="size-1"
[text]="GeburtstagView:t_003_weekdayname | function(x){return x.substr(0, 2)+ ', '}">
</ftui-label></ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_003_summary">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_003_age">
</ftui-label>
</ftui-column>
</ftui-row>
<!-- Zeile5 -->
<ftui-row height="10%" margin="0px" [color]="GeburtstagView:t_004_daysleft | map('0:red,7:green,14:dark')" [class-name]="GeburtstagView:t_004_daysleft | map('0: blink,6:``')" shape="round">
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_004_daysleftLong">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_004_bdate | toDate() | format('DD.MM.')">
<ftui-label class="size-1"
[text]="GeburtstagView:t_004_weekdayname | function(x){return x.substr(0, 2)+ ', '}">
</ftui-label></ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_004_summary">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_004_age">
</ftui-label>
</ftui-column>
</ftui-row>
<!-- Zeile6 -->
<ftui-row height="10%" margin="0px" [color]="GeburtstagView:t_005_daysleft | map('0:red,7:green,14:dark')" [class-name]="GeburtstagView:t_005_daysleft | map('0: blink,6:``')" shape="round">
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_005_daysleftLong">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_005_bdate | toDate() | format('DD.MM.')">
<ftui-label class="size-1"
[text]="GeburtstagView:t_005_weekdayname | function(x){return x.substr(0, 2)+ ', '}">
</ftui-label></ftui-label>
</ftui-column>
<ftui-column >
<ftui-label class="size-1"
[text]="GeburtstagView:t_005_summary">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_005_age">
</ftui-label>
</ftui-column>
</ftui-row>
<!-- Zeile7 -->
<ftui-row height="10%" margin="0px" [color]="GeburtstagView:t_006_daysleft | map('0:red,7:green,14:dark')" [class-name]="GeburtstagView:t_006_daysleft | map('0: blink,6:``')" shape="round">
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_006_daysleftLong">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_006_bdate | toDate() | format('DD.MM.')">
<ftui-label class="size-1"
[text]="GeburtstagView:t_006_weekdayname | function(x){return x.substr(0, 2)+ ', '}">
</ftui-label></ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_006_summary">
</ftui-label>
</ftui-column>
<ftui-column>
<ftui-label class="size-1"
[text]="GeburtstagView:t_006_age">
</ftui-label>
</ftui-column>
</ftui-row>
</ftui-column>
</ftui-grid-tile>

sieht dann wie im Anhang aus...

Für eine Entwicklung würde ich meinen Teil beitragen und testen...
(Habe ich jetzt )

Danke und Gruß

[yersinia]

Benötigt man dafür ein dediziertes widget? Ich finde, man schafft das mit FTUI3-Standard- sowie HTML-code ganz gut. Ich habe dies mit einer div-tabelle für fünf Einträge umgesetzt:

Code Auswählen Erweitern

      <div style="display:table;width:98%;height:45%;">
        <div ftui-binding="class" [class]="Geburtstage:t_001_daysleft | map('0=`birthday-table-row-today size-3`, 1=`birthday-table-row-almost size-2`, 3=`birthday-table-row-upcoming size-2`, 8=`birthday-table-row size-1`')">
          <div class="birthday-table-cell-date">
            <ftui-label [text]="Geburtstage:t_001_bdate | toDate() | format('DD.MM.')"></ftui-label>
          </div>
          <div class="birthday-table-cell-name">
            <ftui-label [text]="Geburtstage:t_001_summary"></ftui-label>
          </div>
          <div class="birthday-table-cell-age">
            <ftui-label [text]="Geburtstage:t_001_age"></ftui-label>
          </div>
        </div> <!-- /row -->
        <div ftui-binding="class" [class]="Geburtstage:t_002_daysleft | map('0=`birthday-table-row-today size-3`,  1=`birthday-table-row-almost size-2`, 3=`birthday-table-row-upcoming size-2`, 8=`birthday-table-row size-1`')">
          <div class="birthday-table-cell-date">
            <ftui-label [text]="Geburtstage:t_002_bdate | toDate() | format('DD.MM.')"></ftui-label>
          </div>
          <div class="birthday-table-cell-name">
            <ftui-label [text]="Geburtstage:t_002_summary"></ftui-label>
          </div>
          <div class="birthday-table-cell-age">
            <ftui-label [text]="Geburtstage:t_002_age"></ftui-label>
          </div>
        </div> <!-- /row -->
        <div ftui-binding="class" [class]="Geburtstage:t_003_daysleft | map('0=`birthday-table-row-today size-3`,  1=`birthday-table-row-almost size-2`, 3=`birthday-table-row-upcoming size-2`, 8=`birthday-table-row size-1`')">
          <div class="birthday-table-cell-date">
            <ftui-label [text]="Geburtstage:t_003_bdate | toDate() | format('DD.MM.')"></ftui-label>
          </div>
          <div class="birthday-table-cell-name">
            <ftui-label [text]="Geburtstage:t_003_summary"></ftui-label>
          </div>
          <div class="birthday-table-cell-age">
            <ftui-label [text]="Geburtstage:t_003_age"></ftui-label>
          </div>
        </div> <!-- /row -->
        <div ftui-binding="class" [class]="Geburtstage:t_004_daysleft | map('0=`birthday-table-row-today size-3`,  1=`birthday-table-row-almost size-2`, 3=`birthday-table-row-upcoming size-2`, 8=`birthday-table-row size-1`')">
          <div class="birthday-table-cell-date">
            <ftui-label [text]="Geburtstage:t_004_bdate | toDate() | format('DD.MM.')"></ftui-label>
          </div>
          <div class="birthday-table-cell-name">
            <ftui-label [text]="Geburtstage:t_004_summary"></ftui-label>
          </div>
          <div class="birthday-table-cell-age">
            <ftui-label [text]="Geburtstage:t_004_age"></ftui-label>
          </div>
        </div> <!-- /row -->
        <div ftui-binding="class" [class]="Geburtstage:t_005_daysleft | map('0=`birthday-table-row-today size-3`,  1=`birthday-table-row-almost size-2`, 3=`birthday-table-row-upcoming size-2`, 8=`birthday-table-row size-1`')">
          <div class="birthday-table-cell-date">
            <ftui-label [text]="Geburtstage:t_005_bdate | toDate() | format('DD.MM.')"></ftui-label>
          </div>
          <div class="birthday-table-cell-name">
            <ftui-label [text]="Geburtstage:t_005_summary"></ftui-label>
          </div>
          <div class="birthday-table-cell-age">
            <ftui-label [text]="Geburtstage:t_005_age"></ftui-label>
          </div>
        </div> <!-- /row -->
      </div> <!-- /table -->
Wenn es keinen Eintrag gibt, ist die Zeile entsprechend leer. Design-anpassungen kann ich über die CSS-Klassen vornehmen.
Der umschließende div-Container ist als Tabelle über inline-CSS auf eine Breite von 98% und Höhe von 48% der Größe des Elternelements begrenzt, muss ggf angepasst werden.

Die dazugehörige CSS:

Code Auswählen Erweitern

.birthday-table-row,
.birthday-table-row-today,
.birthday-table-row-almost,
.birthday-table-row-upcoming {
  display: table-row;
  border-radius: 5px 5px;
  width:100%;
  margin: 0 0.1rem 0.5rem 0.1rem; /* top right bottom left */
  height: 18%;
}

.birthday-table-row-today {
  background-color: var(--lightered);
  color: var(--danger-contrast-color);
}
.birthday-table-row-almost {
  background-color: var(--warning-color);
  color: var(--warning-contrast-color);
}

.birthday-table-row-upcoming {
  background-color: var(--success-color);
  color: var(--success-contrast-color);
}

.birthday-table-cell-date {
  display: table-cell;
  width: 20%;
  padding-left: 2px;
}

.birthday-table-cell-name {
  display: table-cell;
  width: 75%;
}

.birthday-table-cell-age {
  display: table-cell;
  width: 5%;
  text-align: right;
  padding-right: 2px;
}

[yersinia]

Ist das ftui-label überhaupt nötig hier?

Code Auswählen Erweitern

<ftui-column>
<ftui-label class="size-1">
Tage
</ftui-label>
</ftui-column>

Eigentlich müsste es auch kürzer gehen:

Code Auswählen Erweitern

<ftui-column class="size-1">
Tage
</ftui-column>
oder

Code Auswählen Erweitern

<ftui-column>
<font class="size-1">Tage</font>
</ftui-column>


Meinen Vorschlag könnte man auch in content gießen (ungetestet) - Aufruf:

Code Auswählen Erweitern

      <div style="display:table;width:98%;height:45%;">
        <ftui-content file="[content file]" devicebdaynumber="Geburtstage:t_001"></ftui-content>
        <ftui-content file="[content file]" devicebdaynumber="Geburtstage:t_002"></ftui-content>
        <ftui-content file="[content file]" devicebdaynumber="Geburtstage:t_003"></ftui-content>
        <ftui-content file="[content file]" devicebdaynumber="Geburtstage:t_004"></ftui-content>
        <ftui-content file="[content file]" devicebdaynumber="Geburtstage:t_005"></ftui-content>
      </div> <!-- /table -->
content:

Code Auswählen Erweitern

        <div ftui-binding="class" [class]="{{devicebdaynumber}}_daysleft | map('0=`birthday-table-row-today size-3`, 1=`birthday-table-row-almost size-2`, 3=`birthday-table-row-upcoming size-2`, 8=`birthday-table-row size-1`')">
          <div class="birthday-table-cell-date">
            <ftui-label [text]="{{devicebdaynumber}}_bdate | toDate() | format('DD.MM.')"></ftui-label>
          </div>
          <div class="birthday-table-cell-name">
            <ftui-label [text]="{{devicebdaynumber}}_summary"></ftui-label>
          </div>
          <div class="birthday-table-cell-age">
            <ftui-label [text]="{{devicebdaynumber}}_age"></ftui-label>
          </div>
        </div> <!-- /row -->
wie gesagt, ungetestet

[mr_petz]

@yersinia
Es geht doch darum, um dem "Normalnutzer" es so einfach wie möglich zu machen das in seine Seite zu integrieren und den Programmierauffand so gering wie möglich zu halten. Mein Code hat hier über 100 Zeilen (176 um genau zu sein).
Und das ganze mappen und extra function´s schreiben, denke ich ist für viele ein Mehraufwand und scheitert dann vielleicht auch am Wissen darüber...
Bloß hier nochmal ein Beispiel:

Code Auswählen Erweitern


[text]="GeburtstagView:t_001_weekdayname | function(x){return x.substr(0, 2)+ ', '}"


[yersinia]

Benötige ich dafür aber ein dediziertes Widget? Oder kann ich auch copy&paste bzw suchen&ersetzen erwarten? Gewisse Grundkenntnisse an die Erstellung einer FTUI3 Seite muss man leider schon mitbringen - darunter zählen imho das Einarbeiten in HTML Grundstrukturen, ein grobes Verständnis wie FTUI3 funktioniert und wie man sich selbst eine FTUI3-seite aufbaut. Dann könnte man dem unbedarftem Anwender einfach eine content struktur vorschlagen, vlt auch mit verschiedenen Ausprägungen, welche er/sie/es dann einfach übernimmt.
Dann pack ich den Zeilenaufruf in ein content file

Code Auswählen Erweitern

[text]="{{devicebdaynumber}}_weekdayname | function(x){return x.substr(0, 2)+ ', '}"
und rufe das über content auf

Code Auswählen Erweitern

<ftui-content file="[...]" devicebdaynumber="GeburtstagView:t_001"></ftui-content>
<ftui-content file="[...]" devicebdaynumber="GeburtstagView:t_002"></ftui-content>
<ftui-content file="[...]" devicebdaynumber="GeburtstagView:t_003"></ftui-content>
So kann man wiederkehrenden Code in eine Contentstruktur auslagern und hat die Wiederholungen nicht.

[mr_petz]

Sehe ich anders. Das sind schon mehr als nur Grundkenntnisse... Für dich und für die die sich damit tiefgründiger befassen mag das Einfach sein, aber andere könnten sich daran die Zähne ausbeissen.
Der eine versteht´s der andere nicht...

[yersinia]

Mir stellt sich vielmehr die Frage, was für einen unbedarften Anwender ein einfacherer Zugang ist:
- Kopieren & konfigurieren eines widgets aus Forum&Wiki/github(?)
- kopieren & konfigurieren von content aus Forum&Wiki/github(?)
In beiden Fällen muss (HTML-)Quelltext bearbeitet und positioniert werden. Im zweiten Fall (content) muss der Anwender zusätzlich das content file irgendwo ablegen und benennen - dies wäre aber mit derzeitigen FTUI3 Boardmitteln möglich. Im ersten Fall müsste ich -stand jetzt- die component/widget noch zusätzlich integrieren - oder woher bekomm' ich das widget. Wenn es irgendwann mal mit FTUI3 ausgeliefert wird, perfekt.

Ich finde beide Ansätze gleich aufwändig, daher die Frage ob es sinnvoll ist ein dediziertes widget bzw component dafür bereitzustellen.
Persönlich tendiere ich zum zweiten, oben genannten Ansatz, aber ja, meine Sichtweise ist hier nicht die eines gerade beginnenden Anwenders.

[mr_petz]

In beiden Fällen muss (HTML-)Quelltext bearbeitet und positioniert werden.

Ja HTML Qelltext. Das sollte auch jeder hinbekommen.
Es geht doch um die "Extra´s" wzB function´s etc...
Im Vergleich zum setzten von wenigen ftui2_widget Variablen/Definitionen und das Erstellen mit ftui3 Boardmitteln (egal ob content oder normal), ist das widget schon simpler und schlanker...

Aber danke für deine hier erläuterte Sichtweise. Bin mal gespannt wie andere User denken. Vielleicht liege ich hier ja falsch...

[grossmaggul]

Just my 2 cents, ich sehe das so wie yersinia, ich bin kein HTML/css-Experte und Javascript kann ich gar nicht, aber ich finde die Bordmittel von FTUI3 gut genug um sich solche Dinge auch selber bauen zu können ohne dafür wieder ein eigenes Widget zu bemühen.

So sieht übrigens meine Geburtstagsüberwachung aus, simpel aber effektiv und wenig Code.

Code Auswählen Erweitern


             <ftui-label
                        [text]="vbirthdays:t_001_bdate"
                        [class-name]="vbirthdays:t_001_daysleft | map('0:blink,1:')">
            </ftui-label>
            <ftui-label [text]="vbirthdays:t_001_summary"
                        [color]="vbirthdays:t_001_daysleft | map('0:red,1:warning,2:gray')"
                        [class-name]="vbirthdays:t_001_daysleft | map('0:blink,1:')">
            </ftui-label>

[mr_petz]

Hi@all, ich habe mal, mit freundlicher Unterstützung von OdfFhem, aus meinen über 100 Zeilen das draus gemacht:

Code Auswählen Erweitern


<ftui-calview
device="GeburtstagView"
        headers="Tage,Datum,Name,Alter"
        details="daysleftLong,bdate,summary,age"
        detailwidth="30,20,40,10"
width="98%"
        daysleftcolors="7:red,14:green"
daysleftblink="5"
max="6"
        round
        today
class="size-1">
</ftui-calview>


Vorteile:

• weniger subscriptions === bessere Performance
• einfache Einrichtung und weniger *.html Code

Ergebnis ist wie im ersten Post von mir.
Es dient erstmal rein als BirthdayView wie oben im Bild zu sehen.
Besteht jetzt Interresse an einer Entwicklung oder doch nicht?
Ich wollte erst noch andere Meinungen hören, aber leider hat sich keiner weiter gemeldet.
OdfFhem hatte auch den Gedanken daraus eine Anrufliste zu erstellen.
Man könnte vielleicht auch ein MultiViewer für solche Listen/Views bauen???
Gruß

[LuGu]

Hi@all, ich habe mal, mit freundlicher Unterstützung von OdfFhem, aus meinen über 100 Zeilen das draus gemacht:

Code Auswählen Erweitern


<ftui-bcalview
device="GeburtstagView"
width="97%"
daysleftcolor="7,14"
daysleftblink="5"
max="6"
class="size-1">
</ftui-bcalview>


Vorteile:

• weniger subscriptions === bessere Performance
• einfache Einrichtung und weniger Code

Ergebnis ist wie im ersten Post von mir.
Es dient erstmal rein als BirthdayView wie oben im Bild zu sehen.
Besteht jetzt Interresse an einer Entwicklung oder doch nicht?
Ich wollte erst noch andere Meinungen hören, aber leider hat sich keiner weiter gemeldet.
OdfFhem hatte auch den Gedanken daraus eine Anrufliste zu erstellen.
Man könnte vielleicht auch ein MultiViewer für solche Listen/Views bauen???
Gruß

@mr_petz:
Na ja, ob der Code wirklich schlanker ist, kann man ja nicht erkennen, das ist ja nur der Aufruf der Komponente.
Für den User wird es aber auf alle Fälle schlanker und übersichtlicher.
Also ich wäre definitiv interessiert. Ihr habt ja im Team bei departure auch schon einen sehr guten Job gemacht.
Ich denke, es kommen kaum Reaktionen, da der Thread doch etwas versteckt liegt. Die meisten, die sich mit Ftui3 beschäftigen, landen wohl im Haupt Thread.

Gruß LuGu

[mr_petz]

@LuGu
Oh sorry mit Code meine ich den *.html Code der Seite.
Bei mir ja über 100 Zeilen... gewesen...

Ich denke, es kommen kaum Reaktionen, da der Thread doch etwas versteckt liegt. Die meisten, die sich mit Ftui3 beschäftigen, landen wohl im Haupt Thread.

Ich denke im Hauptthread würde es erst recht untergehen. Da sind meist viele Standardfragen zum Einrichten. Da wird es auch schnell unübersichtlich, wenn viele ihre "Probleme" beim konfigurieren haben und kundtun.....(nicht Falsch verstehen!)

Danke für dein Interesse..

[mr_petz]

Hi@All.
Update im ersten Beitrag.
CalView für FTUI3 wurde entwickelt.

LG mr_petz

[moonsorrox]

ich sage hier mal Danke, super Arbeit und funktioniert bei mir sehr gut.
Frage zu den blinkenden Seitenteilen kann man die auch etwas schlanker halten, habe mich noch nicht durch den Code gewurschtelt sondern erst einmal nur ein Beispiel eingesetzt um es zu testen.

[mr_petz]

@moonsorrox

Die sind doch schon recht schlank. (siehe Bild oben).
Die wurden ja extra eingebaut dass das "Blinken" nicht so aufdringlich ist und im View nicht so im Vordergrund steht...
Oder ich verstehe jetzt nicht dein Anliegen???
LG

ps. Man muss ja blinkoutside nicht verwenden...