Umfrage
Frage:
Calview Entwicklung für FTUI3
Antwort 1: Ja
Antwort 2: Nein
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:
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:
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:
<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
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:
<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):
<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ß
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:
<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:
.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;
}
Ist das ftui-label überhaupt nötig hier?
<ftui-column>
<ftui-label class="size-1">
Tage
</ftui-label>
</ftui-column>
Eigentlich müsste es auch kürzer gehen:
<ftui-column class="size-1">
Tage
</ftui-column>
oder
<ftui-column>
<font class="size-1">Tage</font>
</ftui-column>
Meinen Vorschlag könnte man auch in content gießen (ungetestet) - Aufruf:
<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:
<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
@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:
[text]="GeburtstagView:t_001_weekdayname | function(x){return x.substr(0, 2)+ ', '}"
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
[text]="{{devicebdaynumber}}_weekdayname | function(x){return x.substr(0, 2)+ ', '}"
und rufe das über content auf
<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.
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...
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.
Zitat von: yersinia am 14 April 2021, 12:36:58
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...
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. ::) ;)
<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>
Hi@all, ich habe mal, mit freundlicher Unterstützung von OdfFhem, aus meinen über 100 Zeilen das draus gemacht:
<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ß
Zitat von: mr_petz am 15 Mai 2021, 12:38:14
Hi@all, ich habe mal, mit freundlicher Unterstützung von OdfFhem, aus meinen über 100 Zeilen das draus gemacht:
<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
@LuGu
Oh sorry mit Code meine ich den *.html Code der Seite.
Bei mir ja über 100 Zeilen... gewesen...
Zitat
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..
Hi@All.
Update im ersten Beitrag.
CalView für FTUI3 wurde entwickelt.
LG mr_petz
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.
@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...
nee, schon richtig verstanden und sehen auf dem Bild oben auch recht schlank aus, bei mir leider etwas fett... ;)
schau mal den Screenshot, egal was drin steht habe es nur für den Test genutzt
Du könntest noch mit den:
detailwidth="28,24,30,15"
spielen.
Gesamtgröße ist eigentlich 100 (hier im Beispiel 97), aber wenn du die streckst oder verringerst ändert sich die Breite von blinkoutside...
mind. 1px Breit ist im Code hinterlegt.
Bsp:
detailwidth="30,24,30,16"
LG
Hallo mr_petz,
ich probiere die Komponente gerade mal für meine Bedürfnisse aus. Ist auch schön einfach anzuwenden. Danke dafür!
Ein Problem habe ich allerdings mit sourcecolor. In meinem Anwendungsfall (wie schon unter FTUI2) brauche ich keine Aufmerksamkeit auf die verbleibende Dauer bis zum Termin, sondern am liebsten die Textfarbe in der Farbe des Kalenders. Deshalb habe ich daysleft rausgelassen und sourcecolor gesetzt. Leider sind im Ergebnis keine Farben.
Leider habe ich hier im Thema zu sourcecolor nichts außer der kurzen Attributbeschreibung gefunden. Kannst Du mir auf die Sprünge helfen?
Mein Codeschnipsel:
<ftui-calview
device="Familienkalender"
width="98%"
top="15px"
details="daysleftLong,summary"
max="7"
detailwidth="28,69"
class="size-4"
noheader
round
sourcecolor>
</ftui-calview>
Viele Grüße
Dieter
Hi. Was für sourcecolor Readings hast du?
green etc? oder RGB?
Kann ich erst heute Abend prüfen.
Lg
Wie "installiert" man dies Modul?
Ein Ordner namens "calview" angelegt in /www./ftui/components/ und darin die 2 Files abgelegt - und dann? :-[
Zitat
Hi. Was für sourcecolor Readings hast du?
green etc? oder RGB?
RGB. Ein Beispiel um sicher zu gehen:
today_001_sourcecolor #8A2BE2
Zitat von: Dracolein am 01 November 2021, 10:31:16
Wie "installiert" man dies Modul?
Ein Ordner namens "calview" angelegt in /www./ftui/components/ und darin die 2 Files abgelegt - und dann? :-[
... und dann einfach verwenden, wie in meinem Beispiel ein paar Posts weiter oben ;)
Das hatte ich erfolglos versucht. Ohne eine Fehlerdiagnose geben zu können, bemerkte ich beim Seitenreload eine sekundenlange Verzögerung, bis mein FTUI sich aufbaute. Also irgendwas wurde beim Laden vergeblich versucht. Ich hatte schon im Hauptthread gepostet und wurde nützlicherweise auf diesem Thread verwiesen.
meine laufende FTUI 2.x Lösung:
<div data-type="calview"
data-device="FamilyCal"
data-get="all"
data-header='["Datum:","Zeit:","Terminbeschreibung:"]'
data-header-color="white"
data-header-class="bold"
data-daysleft-values='[0,5]'
data-daysleft-colors='["#aa6900"]'
class="bigger darker"
data-detail='["bdate","btime","summary"]'
data-detailwidth='["20","10","70"]'
data-showempty="Derzeit keine Termine"
data-oneline="yes"></div>
</div>
Und jetzt abgeleitet auf FTUI 3, dargestellt innerhalb eines Popups (was sich öffnet, aber leer ist bis auf den unteren"Schliessen" Button):
<!-- Popup Kalender -->
<ftui-popup id="popupcalendar" timeout="0">
<header>Familienkalender</header>
<ftui-calview
device="FamilyCal"
width="98%"
top="15px"
details="bdate, btime, summary"
max="7"
detailwidth="20,10, 70"
class="size-4"
noheader
round
sourcecolor>
</ftui-calview>
<ftui-button popup-close color="light">Schliesssen</ftui-button>
</ftui-popup>
Drum hatte ich vermutet, diese Erweiterung falsch in FHEM bzw. FTUI3 eingebaut zu haben
Zitat von: Dracolein am 01 November 2021, 10:31:16
Wie "installiert" man dies Modul?
Ein Ordner namens "calview" angelegt in /www./ftui/components/ und darin die 2 Files abgelegt - und dann? :-[
hast du denn in Fhem ein CalView angelegt, denn daraus zieht er sich ja die Daten...!
Ja natürlich, das obige Codeschnipsel aus FTUI 2.x ist Teil meines derzeit produktiven Systems und funktioniert.
Bei mir funktioniert Dein Code fast. Ich bekomme lediglich "undefined", statt tatsächlicher Daten für die Spalten Datum und Summary. Das liegt an den Leerzeichen
details="bdate, btime, summary"
die müssen raus:
details="bdate,btime,summary"
Ich hab's gerade auch als Popup probiert.
Vielleicht liegt das Problem bei Dir daran, wie du die calview Files abgelegt hast. Als github und Linux Laie war ich gestern am Rätseln, wie ich denn die beiden Files herunterladen kann, da mir kein Herunterladen angeboten wurde.
Letztendlich bin ich dann erst auf oberster Verzeichnisebene (ftui) im github (Download unter dem Button "Code") fündig geworden. Dann habe ich das komplette Paket heruntergeladen, aber letztendlich nur das Verzeichnis "calview" auf dem raspi im richtigen Verzeichnis entpackt.
Ich hab sie via Rechtsklick mit "Ziel speichern unter..." runtergeladen, in das neu angelegte Verzeichnis verschoben und anschließend die Benutzerrechte von neuem Ordner & den beiden Dateien auf den Benutzer "fhem" übertragen, entsprechend allen anderen vorhandenen Strukturen.
Merkwürdig.
Es sieht so aus, als würde das so nicht gehen:
Ich habe gerade mal calview.component.js mit Ziel speichern unter heruntergeladen und mit "meiner" Datei verglichen. Da kommt etwas ganz anderes raus. Du bekommst eine Html-Seite, anstelle JavaScript. Öffne mal Deine Datei und vergleiche sie mit dem Code, den du siehst, wenn du die Datei im github anklickst ;)
sowas in der Art wollte ich auch gerade schreiben, dass du evtl. die Datei nochmals runter lädst vom Github.
Nimm mal meine
Tja Leute, was soll ich sagen... vielen Dank :-*
Das war genau mein Fehler. :-X
@mr_petz
im unteren Screenshot hast die zwei vergangende Termine mit -2 und -3 drin, dass wäre ja evtl. interessant wenn man einen Geburtstag mal vergißt kommt bei mir ab und an vor wenn es jemand nicht gerade aus der Famile ist.
Das geht bei mir aber nicht, ich hatte mir eine Zeile mit -1 gemacht da gestern ein Gebirtstag war, aber das zeigt er mir garnicht an.
Ich denke aber das liegt dann an CalView, hier habe ich aber das attr oldreadings aktiviert.
Wie hast du das gemacht.?
Das habe ich eingetragen
-1:gray:white
@RockFan
zu sourcecolor:
Es werden zur Zeit nur green,yellow,red usw. gesetzt, da diese Farben dann die gleichen Farben wie in FTUI3 sind.
Ich kann aber auch noch HEX-RGB in sourcecolor mit reinnehmen.
@moonsorrox
zu daysleft mit vergangenen Terminen/Geburtstagen:
Du musst im Fhem-Modul CALENDAR das attr :
attr <DEVICE> hideOlderThan 86400s
in z.Bsp.:
attr <DEVICE> hideOlderThan 172800s
ändern.
hier bleiben alle Einträge noch einen Tag länger stehen...
ps. reload vom CALENDAR nicht vergessen...
LG mr_petz
Zitat von: mr_petz am 01 November 2021, 17:38:03
@RockFan
zu sourcecolor:
Es werden zur Zeit nur green,yellow,red usw. gesetzt, da diese Farben dann die gleichen Farben wie in FTUI3 sind.
Ich kann aber auch noch HEX-RGB in sourcecolor mit reinnehmen.
OK das mit der Anzeige habe ich schon hinbekommen, leider zeigt er keine Farbe.
Es sollten doch aber z.B. meine Farben funktionieren da ich die mit @../../reneftui.css eingefügt habe. Denn bei den normalen Einträgen funktioniert es auch.
Aber der -1 Eintrag funktioniert nicht, habe den so eingegeben.
hier mal mit green
daysleft="2:DarkOrange:DarkOrange:blink:blinkoutside bold,7:MediumSpringGreen:DarkOrange:bold,14:DarkOrange:white,-1:green:white"
hex-rgb in sourcecolor hinzugefügt...
hex-rgb wird jetzt in sourcecolor gelesen und gesetzt wenn vorhanden.
Das ist kein extra Attribute...
Zitat von: moonsorrox am 01 November 2021, 17:50:13
OK das mit der Anzeige habe ich schon hinbekommen, leider zeigt er keine Farbe.
Es sollten doch aber z.B. meine Farben funktionieren da ich die mit @../../reneftui.css eingefügt habe. Denn bei den normalen Einträgen funktioniert es auch.
Aber der -1 Eintrag funktioniert nicht, habe den so eingegeben.
hier mal mit green
daysleft="2:DarkOrange:DarkOrange:blink:blinkoutside bold,7:MediumSpringGreen:DarkOrange:bold,14:DarkOrange:white,-1:green:white"
Das -1 geht nur wie ich es dir oben beschrieben habe...
Zitat von: mr_petz am 01 November 2021, 17:58:29
hex-rgb in sourcecolor hinzugefügt...
ich habe jetzt diesen Eintrag an den Anfang gesetzt und nun wird es angezeigt. ;)
daysleft="-1:gray:white,2:DarkOrange:DarkOrange:blink:blinkoutside bold,7:MediumSpringGreen:DarkOrange:bold,14:DarkOrange:white"Wo muss denn dieser Eintrag "hex-rgb" hin
sollte nur heißen, dass jetzt hex-rgb in sourcecolor gelesen und gesetzt wird wenn vorhanden.
Das ist kein extra Attribute...
Zitat von: moonsorrox am 01 November 2021, 18:01:11
ich habe jetzt diesen Eintrag an den Anfang gesetzt und nun wird es angezeigt. ;)
daysleft="-1:gray:white,2:DarkOrange:DarkOrange:blink:blinkoutside bold,7:MediumSpringGreen:DarkOrange:bold,14:DarkOrange:white"
man sollte immer von links nach rechts vorgehen... ;D
Alaska... ;) soll soviel heißen wie alles klar
Danke
Vielen leben Dank für hex-rgb in sourcecolor. Hab's gerade ausprobiert - funktioniert prächtig :)
Hallo mr_petz,
da Terminbeschreibungen unterschiedlich lang sein können, fände ich es noch schick, wenn
- align-left funktionieren würde
- längere Beschreibungen umgebrochen werden könnten (und somit 2-zeilig dargestellt werden würden, anstelle mit "..." abgeschnitten zu werden)
Mit calview in FTUI2 funktioniert das (da werden dann alle Spalten linksbündig und auch alle Spalten ggf. umgebrochen) ;)
Ist das mit FTUI3 einfach realisierbar?
Viele Grüße
Dieter
Zitat von: RockFan am 01 November 2021, 21:39:50
...
da Terminbeschreibungen unterschiedlich lang sein können, fände ich es noch schick, wenn
- align-left funktionieren würde
- längere Beschreibungen umgebrochen werden könnten (und somit 2-zeilig dargestellt werden würden, anstelle mit "..." abgeschnitten zu werden)
...
Hi, spät aber bin dran...
zu 1.
sollen dann alle Spalten left sein oder nur die summary´s?
zu 2.
Wie sollen/waren die summary´s umgebrochen?,bei dem white-space wenn die Spalenbreite erreicht ist oder mitten drin im Text?
Ich hatte es so nie in Benutzung, aber könnte versuchen das einzubauen.
Bild zum veranschaulichen im Anhang:
Hi mr_petz,
ZitatHi, spät aber bin dran...
Keine Hektik. Es ist ja ein Freizeitprojekt! 8)
zu 1.
ich würde sagen alle Spalten; das sollte hoffentlich auch einfacher sein und war unter FTUI2 auch so
zu 2.
Bitte hier auch für alle Spalten! Das war beim white-space, wenn die Spaltenbreite erreicht ist (so wie in Deinem Beispiel)
Danke schon mal :)
Neue Attribute:
header-left (headertext left)
text-left(Texte left ohne Zeilenumbruch)
text-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)
lg mr_petz
Hat noch jemand Interesse an einen unsichtbaren Scrollfeature?
Scrollbar wäre nicht zu sehen und man kann somit den Calview verkleinern im View.
siehe animierte Anhänge
lg mr_petz
Darf ich mal fragen, was Deine Lösung besser oder anders macht als die von Thyraz?
Aber gerne doch. :)
Ich will hier nichts besser,anders oder schöner machen!
Ich möchte auch Thyraz hier nicht auf den Schlips treten!
Aber ich hatte mehrfach Thyraz angeschrieben (im Hauptthread) seine Version meinen Bedürfnissen (Viewansicht) anzupassen, leider gab es nie eine Antwort oder Änderung.
Es soll eine einfache Alternative sein für eine einfache Ansicht.
Es möchte ja hier jeder seinen View individuell haben und bringt immer Vorschläge oder seine Vorstellungen.
Wenn ich das aber nicht so umsetzen kann wie gewünscht, muss ich es halt selber anpacken ;).
Der calview hier ist durch mein Geburtstagsview, wie auf der ersten Seite beschrieben, entstanden.
Es gibt ja hier auch ein paar User die diese Ansicht wie aus FTUI2 haben wollen.
Mir macht es ausserdem Spass ein bisschen zu programmieren und möchte mich hier nur einbringen und was zurück geben :).
Ob das immer so richtig programmiert ist, sei mal dahin gestellt.
Wenn du mir eine Lösung sagen kannst ob der full-calview von Thyraz nach meiner Viewansicht zu erstellen geht, dann zeige mir bitte wie...???
LG mr_petz
Edit:
und keine Angst, ich habe noch keinen Pull request zu setstate gemacht ;)
oder wolltest du jetzt was anderes von mir wissen/hören?
Zitatund keine Angst, ich habe noch keinen Pull request zu setstate gemacht ;)
oder wolltest du jetzt was anderes von mir wissen/hören?
Wenn ich wüsste was ein "Pull request" ist könnte ich Dir sagen ob ich das von Dir hören will oder nicht. ;D
Ich wollte Dir auch nicht auf den Schlips treten, ich finde es ja gut, daß Du das machst!
Ich dachte halt, daß man das zusammenführen könnte, daß Du schon versucht hast Thyraz zu kontaktieren und er nicht antwortet wusste ich nicht.
Also nothing for ungood, wie der Franzose sagt.;o)
OT an
Zitat von: grossmaggul am 11 November 2021, 18:05:24
Wenn ich wüsste was ein "Pull request" ist könnte ich Dir sagen ob ich das von Dir hören will oder nicht. ;D
Alles gut :). Falsch hingeschrieben :(.
zu 1: pull request ist, wenn ich setstate die Dateien rüberschieben möchte. setstate prüft das dann und muss es auch akzeptieren. Erst dann wird es gemerged und ist im Update mit drin.
zu 2. "
oder wolltest du jetzt was anderes von mir wissen/hören" war dann an der Stelle unpassend platziert von mir.
Ich meinte ob du noch andere Infos als das was ich oben geschrieben habe wissen wolltest?
Zitat von: grossmaggul am 11 November 2021, 18:05:24
Ich wollte Dir auch nicht auf den Schlips treten, ich finde es ja gut, daß Du das machst!
Ich dachte halt, daß man das zusammenführen könnte, daß Du schon versucht hast Thyraz zu kontaktieren und er nicht antwortet wusste ich nicht.
Bin nicht beleidigt oderso... ;)
Deine Frage habe ich halt so interpretiert:
Wieso machst du das und wozu...Nichts für ungut, alles gut :)
Ich glaube aber kaum, dass sich beide Module zusammenführen lassen...
ps.:
paar Vorteile hatte ich aber schon in der ersten Seite geschrieben und das es für den User einwenig einfacher wird zum definieren...
Nebenbei erwähnt hat Thyraz seit Dez.20 nichts mehr am calendar gemacht und die meisten "neuen" ftui3 User wissen am Ende garnichts davon weil es irgenwo im ftui3 Thread steht...
Ich möchte hier aber Thyraz nicht dissen, er wird schon seine Gründe haben...Bitte steinigt mich jetzt nicht..., ist wirklich nicht böse gemeint!
OT aus
LG mr_petz
Zitat von: mr_petz am 11 November 2021, 10:29:52
Neue Attribute:
header-left (headertext left)
text-left(Texte left ohne Zeilenumbruch)
text-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)
lg mr_petz
Danke für das schnelle Einbauen :)
Ich habe die neuen Attribute gerade mal durchprobiert:
- Bei text-justify werden alle Zeilen außer der Letzten in Blocksatz formatiert
- Die restlichen Attribute funktionieren wie beschrieben
Es wäre prima, wenn
text-justify noch linksbündig wäre, denn das ist das Attribut, das ich tatsächlich verwenden werde ;)
Viele Grüße
Dieter
Zitat von: RockFan am 12 November 2021, 18:25:22
....
- Bei text-justify werden alle Zeilen außer der Letzten in Blocksatz formatiert
.....
Hi, wie meinst du das mit letzter Zeile?
Letzte Zeile des Events, oder letzte Reihe des View?
Zitat von: mr_petz am 12 November 2021, 19:27:40
Hi, wie meinst du das mit letzter Zeile?
Letzte Zeile des Events, oder letzte Reihe des View?
Stimmt, das ist missverständlich: Ich meine jeweils die letzte Zeile eines Events (wenn er mehrzeilig ist)
Tut mir leid.
Ich kann es nicht nachvollziehen.
Bei mir werden die Zeilen umgebrochen und linksbündig angezeigt.
Ich habe hier nur text-justify gesetzt.
Könntest du ein Event zur Verfügung stellen um es nachzustellen?
Und zeige bitte noch deine Definition...
Danke und Gruß
Da ich unseren Familienkalender hier nicht direkt reinstellen möchte, habe ich das mal ein klein wenig umgebaut.
Der Blocksatz ist nämlich nicht nur in der Summary, sondern in jedem Feld. Den eigentlichen Eventtext (summary) habe ich eben mal durch bdate ersetzt. Sonst ist alles gleich. Bei mir bricht nämlich sogar bewusst die Zeitspanne (timeshort) um, damit die Spalte nicht so breit wird und da kann man das auch wunderbar erkennen.
Meine Definition:
<ftui-calview
device="Familienkalender"
width="98%"
top="15px"
details="daysleftLong,timeshort,bdate"
max="5"
detailwidth="18,20,62"
class="size-8"
text-justify
noheader
round
sourcecolor>
</ftui-calview>
Im Bild unten kann man die Blockformatierung in der zweiten Spalte gut erkennen. Z.B. wird aus 20:00 - 23:00
20:00 -
23:00
Es sollte linksbündig aber eigentlich so aussehen:
20:00 -
23:00
Bei Text in summary ist das dann genauso. Je nach Inhalt fällt das mal weniger auf, aber manchmal auch sehr stark. So könnte z.B. Dein Beispieltext in Post 41 bei etwas breiterer Spalte auch so aussehen:
Die Einladung der
Einladung von der
Einladung
OK. Verstanden.
So...
Jetzt ich nochmal.
Neuerungen:
justify in der letzten Zeile vom summary hinzugefügt. (sieht aber in manchen Texten weit auseinandergezogen aus (siehe Anhang))
justify im timeshort entfernt wenn line-justify definiert ist. Es wird da left mit Zeilenumbruch gesetzt.
text-justify heisst jetzt line-justify.
text-left heisst jetzt line-left.
line-break ist hinzugekommen. hier wird nur links formatiert und bei Zeilenende umgebrochen.
LG mr_petz
Perfekt!
Habe gerade alle Varianten ausprobiert und sie funktionieren, wie beschrieben. Ich werde natürlich line-break verwenden, damit hatte ich Dich ja auch genervt ::)
Vielen vielen Dank für die Mühe!
LG Dieter
Zitat von: RockFan am 12 November 2021, 18:25:22
...
Es wäre prima, wenn text-justify noch linksbündig wäre, denn das ist das Attribut, das ich tatsächlich verwenden werde ;)
Viele Grüße
Dieter
Und ich dachte du wolltest justify ;)
Aber schön das du so zufrieden bist... :D
LG
Zitat von: mr_petz am 08 Januar 2022, 13:22:06
Thermostat: https://forum.fhem.de/index.php/topic,123084.0.html (https://forum.fhem.de/index.php/topic,123084.0.html)
Calview: https://forum.fhem.de/index.php/topic,120379.0.html (https://forum.fhem.de/index.php/topic,120379.0.html)
Volume-Slider: https://forum.fhem.de/index.php/topic,121901.0.html (https://forum.fhem.de/index.php/topic,121901.0.html)
Volume3D Knob: https://forum.fhem.de/index.php/topic,122208.0.html (https://forum.fhem.de/index.php/topic,122208.0.html)
PinPad: https://forum.fhem.de/index.php/topic,120107.0.html (https://forum.fhem.de/index.php/topic,120107.0.html)
TimerSet: https://forum.fhem.de/index.php/topic,115259.msg1185270.html#msg1185270
Departure (wurde schon von @setstate ins git übernommen): https://forum.fhem.de/index.php/topic,120143.0.html (https://forum.fhem.de/index.php/topic,120143.0.html)
Ich muss nochmal fragen, es ging unter. Wie integriere ich das denn?
Ich habe bisher
cat controls.txt
http://fhem.de/fhemupdate/controls_fhem.txt
https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
https://raw.githubusercontent.com/knowthelist/ftui/master/controls_ftui.txt
https://raw.githubusercontent.com/ThorstenPferdekaemper/FHEM-FUIP/master/controls_fuip.txt
https://raw.githubusercontent.com/bismosa/FHEM/master/controls_Blitzer.txt
https://raw.githubusercontent.com/fhem/nina/development/controls_Nina.txt
https://raw.githubusercontent.com/fhem/EPG/pre-release/controls_EPG.txt
https://raw.githubusercontent.com/dominikkarall/fhem_pythonbinding/master/controls_pythonbinding.txt
Da Deins offenbar ein Fork ist - schmeiße ich die erste Zeile (controls_fhemtabletui.txt) raus und packe dafür https://github.com/mr-petz/ftui/blob/master/controls_ftui.txt rein oder wie ist das gedacht?
(Das ist mein Produktivsystem, ich will da nix kaputtmachen.)
Hi.
Nützt dir nichts, da ich die controls_ftui.txt nicht angerührt habe und den fork nicht immer angleiche mit setstate´s master.
Müsstest die Dateien erstmal händisch einfügen.
https://github.com/mr-petz/ftui/tree/calview/www/ftui/components/calview (https://github.com/mr-petz/ftui/tree/calview/www/ftui/components/calview)
Die 2 Dateien kommen dann in den www/ftui/components/calview Ordner. Den Ordner calview müsstest du dann noch vorher anlegen.
Es ist alles noch wie bei setstate im Bau/Entwicklung (aber funktionell und benutzbar ;)).
Wenn die User mit allem zufrieden sind, dann kann man das auch zu setstate schieben. Er hat aber erstmal denke ich anderes zu tun :).
Ich hoffe dass irgendwann setstate das übernimmt. Habe aber auch noch nicht gefragt.
Noch was anderes für dich. Es gibt auch noch ein fullcalview/calender von Thyraz.
Hier ist die Link´s zum calendar und fullcalview:
https://github.com/Thyraz/ftui/tree/master/components/calendar (https://github.com/Thyraz/ftui/tree/master/components/calendar)
https://github.com/Thyraz/ftui/tree/master/modules/fullcalendar (https://github.com/Thyraz/ftui/tree/master/modules/fullcalendar)
Das wissen aber die wenigsten (nur die der ersten Stunde). Er hat aber seit 12.2020 nichts mehr daran gemacht.
Nähere Infos stehen im Hauptthread auf den ersten Seiten ab hier:
https://forum.fhem.de/index.php/topic,115259.msg1102611.html#msg1102611 (https://forum.fhem.de/index.php/topic,115259.msg1102611.html#msg1102611)
@grossmaggul weiss darüber aber mehr Bescheid als ich, und natürlich @Thyraz.
LG mr_petz
Darf ich mit diesem Zitat anfangen um später eine Bitte zu äußern?
Zitat von: mr_petz am 14 April 2021, 10:57:37
Es geht doch darum, um dem "Normalnutzer" es so einfach wie möglich zu machen das in seine Seite zu integrieren
1) Würde es denn gehen, dass Du Deine/Eure Module/Widgets in dem Git-Repo-Dings so baust, dass jede Änderung bei einem FHEM-Update automatisch bei mir ankommt - natürlich unterstellt, dass ich Dein Repo-Dings bei mir aufnehme? Das würde ich als sehr hilfreich ansehen.
2) Dein CalView läuft ohne Zicken bei mir sofort. Allerdings ist
mir da deutlich zu viel BlingBling und ich sehe zudem nicht, wie ich dem Zeilenabstände beibringe. Also habe ich das erstmal mit fltu-col und ftui-row gemacht, übergangsweise wird das tun: Der Kalender ist bei mir auf dem Taktik-Bildschirm und darf die Aufmerksamkeit nicht auf sich ziehen.
Anbei zwei Screenshots. So wie "alt" sollte das aussehen, es wäre toll, wenn das mit Deinem Modul/Widget machbar wäre.
3) OT: Ab und an habe ich den Eindruck, dass ich von manchen als der böse alte Mann wahrgenommen werde. Ok, ich bin nicht mehr 22. Aber ich will niemandem böse. Ich will Eure tollen Werke nutzen!
Vielleicht ist hier ein Unterschied. Obwohl ich aus der Branche komme, bin ich bei FHEM/FTUI primär Nutzer. Nur diese Rolle kann ich ausfüllen.
Zitat von: curt am 11 Januar 2022, 02:37:02
3) OT: Ab und an habe ich den Eindruck, dass ich von manchen als der böse alte Mann wahrgenommen werde. Ok, ich bin nicht mehr 22. Aber ich will niemandem böse. Ich will Eure tollen Werke nutzen!
Vielleicht ist hier ein Unterschied. Obwohl ich aus der Branche komme, bin ich bei FHEM/FTUI primär Nutzer. Nur diese Rolle kann ich ausfüllen.
Solche Eindrücke würde ich aus Deiner Sicht nicht zu ernst nehmen, denn "echte" Anregungen/Kritik/... bzgl. Umsetzungen sind ja in der Regel gern gesehen und evtl. sogar förderlich ... keine Umsetzung ist perfekt, aber im Zweifel schon nahe dran ...
@curt
Du solltest dir mehr Zeit zum lesen und testen nehmen, dann hättest du mitbekommen dass das Attribute flat deine beliebte Ansicht darstellt.
daysleft muss man auch nicht angeben, genauso wie header.
Somit ist kein BlingBling...
Hier für dich dein Beispiel.
<ftui-calview
device="DeinDevice"
details="bdate,summary,age"
width="99%"
max="5"
class="size-1" flat wday_date>
</ftui-calview>
Ergebnis wie im Anhang. ;)
LG mr_petz
ps. Bin auch kein Jungspund mehr;D
@mr_petz
Danke für die Hilfe und die tröstenden Worte. So wie von Dir gezeigt funktioniert das.
Erlaube mir bitte zwei Fragen bzw. Bitten:
1) Wäre das Format details="bdate,weekdayname,summary,age" möglich? Das würde mir persönlich optisch besser gefallen.
2) ich würde gern den Zeilenabstand steuern, bei mir konkret: Verringern. Geht das oder wäre es möglich, dass Du das einbaust?
Und noch eine allgemeine Frage:
Ist bei Deinen Git-Dingens was kaputtgegangen oder bin ich einfach nur vertrottelt? Ich wollte mich nun an volume3d heranwagen und bei https://github.com/mr-petz/ftui/branches/all klicke ich da frohen Mutes drauf - da kommt aber nur der allgemeine Mirror. Gleiches bei calview.
Hi curt.
Zitat von: curt am 19 Januar 2022, 03:03:55
1) Wäre das Format details="bdate,weekdayname,summary,age" möglich? Das würde mir persönlich optisch besser gefallen.
Möchtest du weekdayname als einzelne Spalte gekürzt oder kann ich das auch inkl. bdate per Attribute herumdrehen lassen und kürzen?
wday_date macht es ja wie in meinem Beispiel:
Fr, 01.01.
Ich könnte noch date_wday als Attribute setzen und das so ausgeben lassen:
01.01. Fr
Ist dann so wie bei dir, aber in einer Spalte. OK?
Zitat
2) ich würde gern den Zeilenabstand steuern, bei mir konkret: Verringern. Geht das oder wäre es möglich, dass Du das einbaust?
Habe ich eben eingebaut.
kannst du mit einer user.css setzen (wird dann bei allen ftui-calview gesetzt):
ftui-calview{
--calview-line-margin:-8px;
}
oder in dem du eine id oder ein namen in der Definition vom Calview hinzufügst (wird dann bei jedem einzeln gesetzt). Bsp.:
def:
<ftui-calview
device="DeinDevice"
details="bdate,summary,age"
width="99%"
max="5"
calview1
class="size-1" flat wday_date>
</ftui-calview>
und user.css:
[calview1]{
--calview-line-margin:-5px;
}
oder per style Attribute:
<ftui-calview style="--calview-line-margin:-5px;"
device="DeinDevice"
details="bdate,summary,age"
width="99%"
max="5"
class="size-1" flat wday_date>
</ftui-calview>
Zitat
Und noch eine allgemeine Frage:
Ist bei Deinen Git-Dingens was kaputtgegangen oder bin ich einfach nur vertrottelt? Ich wollte mich nun an volume3d heranwagen und bei https://github.com/mr-petz/ftui/branches/all klicke ich da frohen Mutes drauf - da kommt aber nur der allgemeine Mirror. Gleiches bei calview.
Nein da ist nix kaputt und du bist auch
kein Trottel!
Zur Erklärung. Der Fork ist ja ein Clone vom Master von setstate.
Daraus habe ich einzelne Branches gemacht für jedes eigene Modul und der beinhaltet auch wieder den Clone vom Master.
Das sieht man auch an dem dropdown linke obere Hälfte in welchen Branch man sich befindet. Ungefähr so wäre das zu erklären.
Wenn du dich jetzt im volume3d befindest, dann ist unter components das Modul zu finden. Alle anderen von mir sind da nicht drin. Dafür musst du dann in den entsprechenden Branch wechseln.
Das ist dann der Pfad:
https://github.com/mr-petz/ftui/tree/volume3d/www/ftui/components/volume3d
Nimm es hin... ist halt so...
LG mr_petz
Zitat von: mr_petz am 19 Januar 2022, 11:59:14
Ich könnte noch date_wday als Attribute setzen und das so ausgeben lassen:
01.01. Fr
Ist dann so wie bei dir, aber in einer Spalte. OK?
Ja, das würde völlig reichen.
Zu den anderen Punkten bin ich leider noch nicht gekommen. Trotzdem vorab: Danke!
volume3d funktioniert sofort - weiter im zuständigen Thread.
Zitat von: curt am 20 Januar 2022, 23:42:01
Ja, das würde völlig reichen.
Habe es eingebaut.
Mit date_wday als Attribute ist dann in einer Spalte DD.MM. Tag auf 2 Stellen gekürzt.
Du brauchst dann nur details="bdate,summary,age" angeben.
Teste es bitte.
LG mr_petz
Zitat von: mr_petz am 23 Januar 2022, 13:58:33
Teste es bitte.
Nu isses putt. :-\
Ok, von vorn:
Alte Version war
ls -l components/calview/alteversion/
-rw-r--r-- 1 fhem dialout 1312 Jan 11 00:52 calview.component.css
-rw-r--r-- 1 fhem dialout 13483 Jan 11 00:52 calview.component.js
Neue Version ist
ls -l components/calview/
-rw-r--r-- 1 fhem dialout 1878 Jan 26 01:01 calview.component.css
-rw-r--r-- 1 fhem dialout 13769 Jan 26 01:01 calview.component.js
Neue Version geholt über
wget https://raw.githubusercontent.com/mr-petz/ftui/calview/www/ftui/components/calview/calview.component.css
wget https://raw.githubusercontent.com/mr-petz/ftui/calview/www/ftui/components/calview/calview.component.js
Meine Version ergibt den ersten Screenshot:
<ftui-calview margin ="0 -15px 0 5px"
device="myCalView"
width="98%"
top="5px"
details="bdate,summary,age"
max="5"
detailwidth="22,60,10"
class="size-0 flat wday_date"
line-left>
</ftui-calview>
Deine Version ergibt den zweiten Screenshot:
<ftui-calview style="--calview-line-margin:-5px"
device="myCalView"
width="99%"
details="bdate,summary,age"
max="5"
class="size-1 flat wday_date"
>
</ftui-calview>
BTW: Bei @setstate liegt auch noch eine Version (nicht genommen), das muss ich aber wohl nicht verstehen?
Als erstes. Bei deiner Definition musst du noch was ändern:
<ftui-calview style="--calview-line-margin:-5px"
device="myCalView"
width="99%"
details="bdate,summary,age"
detailwidth="22,63,15"
max="5"
class="size-1"
flat date_wday
>
</ftui-calview>
Hier sind flat wday_date keine Klassen.
Hast du auch wirklich die letzte Version?
Und am besten immer auch cache leeren. Besonders wenn was am css gemacht wurde.
LG mr_petz
Edit:
Zitat
BTW: Bei @setstate liegt auch noch eine Version (nicht genommen), das muss ich aber wohl nicht verstehen?
Da sollte nichts liegen.
Jetzt ist es klar. Du musst detailwidth mit angeben wenn du details oder header angibst.
Es muss bei detailwidth die Summe 100 ergeben!
Da muss ich noch eine Routine einbauen das die detailwidth immer auf Summe 100 rechnet.
Habe es angepasst. Wenn die Summe von detailswidth nicht 100 ist, dann wird der Rest auf die Spalten gleich aufgeteilt.
LG mr_petz
Hallo @mr_petz
das ist fast schon ganz super, ich danke Dir.
Schau mal bitte auf das Komma: Wenn Datum und Wochentag schon in einem Element sein müssen: Kannst Du das Komma bitte durch zwei (!) Leerzeichen ersetzen?
Ok curt, ist erledigt.
LG mr_petz
Danke!
P.S: Ergebnis siehe auch Screenshot 1 im Thread Thermostat.
Unter FTUI3 Calview habe ich wie unter FTUI2 das Problem, dass bei
global->encoding=unicode (siehe dev thread: https://forum.fhem.de/index.php/topic,126088.0.html )
Umlaute im Kalendareintrag zu leeren Einträgen führen.
Im CALVIEW device schaut der Eintrag noch OK aus.
Ich hab auch schon probiert CALVIEW zu patchen, und die "summary" mit
$buf = Encode::encode('UTF-8', $buf) if($unicodeEncoding);
umzukodieren bzw. das selbe auch mal mit "decode" aber erstens stehen dann in FHEM zerschossene Umlaute und zweitens kommt in FTUI auch nichts besseres an (bei "encode" eben die zerschossenen Umlaute, bei "decode" wieder gar nichts).
Jemand eine Idee? Ich weiss dass "unicode" ist aktuell eher noch nicht standard (eher experimentell) ist, aber mein ganzes FHEM läuft eigentlich soweit gut damit - bis eben auf FTUI
Hi.
Erste Frage:
Wie sieht das Reading mit unicode beim ftui-label aus?
2.
Könntest die kommenden verunstalteten Umlaute mit der replace() Funktion versuchen umzustricken.
Ok. Unicode soll bis 2024 Standard werden.
Ich denke da müsste setstate das in FTUI integrieren?
LG mr_petz
Edit: Kommt es da auch auf den verwendeten Font drauf an und wie die Datei codiert wurde?
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
oder
<meta charset=utf-8"/>
wird nichts bringen oder?
Hi,
in ftui-label das selbe Problem. Das text="xxx" fehlt komplett im Vergleich zu readings ohne Umlaute.
Die Umlaute sind ja nicht verunstaltet (das ist nur passiert als ich mit dem CALVIEW code rumgespielt habe). Standardmässig schaut in FHEM alles OK aus.
Naja fast:
2022-05-02 08:31:22 t_004_summary Geburtstag Jörg
2022-05-02 08:31:22 t_004_timeshort ganztägig
Aber das liegt daran, dass das "ä" im CALVIEW source code falsch kodiert ist.
Die meta tags bringen nichts.
Unter FTUI2 habe ich den Effekt, dass im calview bei Umlauten statt dem Text ein leere <binary></binary> gesetzt wird.
Also wohl wirklich ein grundlegendes Problem vom Framework (unter FTUI2 sowie unter FTUI3)
Hi zusammen,
bei mir funktioniert das ganze leider noch nicht. Habe aktuell:
<ftui-calview style="--calview-line-margin:-5px"
device="calv_all"
width="98%"
<!--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="5"
detailwidth="28,22,35,15"
class="size-1"
flat date_wday
>
</ftui-calview>
Die beiden css dateien sind auch entsprechend da. Aber es wird nichts angezeigt.
Hat wer eine Idee was ich falsch mache?
Danke & Gruß,
Tobi
Hi Tobi,
Als erste Frage von mir:
Wieso 2 css Files?
Es müssen diese beiden Dateien im components/calview Ordner liegen:
calview.component.css
calview.component.js
Als Zweite Frage:
Könntest du bitte ein Label erstellen mit folgenden Code und sagen ob was angezeigt wird:
<ftui-label [text]="calv_all:t_001_daysleftLong"></ftui-label>
<ftui-label [text]="calv_all:t_001_bdate"></ftui-label>
<ftui-label [text]="calv_all:t_001_summary"></ftui-label>
<ftui-label [text]="calv_all:t_001_age"></ftui-label>
Da müsen wir erstmal rausbekommen ob die Basis funzt...
LG mr_petz
Hi,
danke für deine Antwort.
Zitat von: mr_petz am 01 Juli 2022, 14:40:51
Wieso 2 css Files?
Es müssen diese beiden Dateien im components/calview Ordner liegen:
calview.component.css
calview.component.js
Korrekt, 2 files nur 1 css, sorry dafür.
Zitat
Als Zweite Frage:
Könntest du bitte ein Label erstellen mit folgenden Code und sagen ob was angezeigt wird:
<ftui-label [text]="calv_all:t_001_daysleftLong"></ftui-label>
<ftui-label [text]="calv_all:t_001_bdate"></ftui-label>
<ftui-label [text]="calv_all:t_001_summary"></ftui-label>
<ftui-label [text]="calv_all:t_001_age"></ftui-label>
Da müsen wir erstmal rausbekommen ob die Basis funzt...
LG mr_petz
Klappt, ich bekomme den 1. Termin angezeigt.
Gruß,
Tobi
Ok, nächste Frage:
Es sollte kurz beim ersten Laden (auch mal refresh mit Cacheleerung vom Browser machen) folgende Meldung kommen:
Daten werden geladen...
kommt diese Meldung?
Bitte testweise diese beiden Sachen raus nehmen:
<!--headers="Tage,Datum,Name,Alter"-->
<!-- daysleft="4:red1:red1:blink:blink bold,10:orange:white:bold,14:green:white:white"-->
und testen.
Die "<!--" und "-->" zerschießen die Definition, da dies kein reiner HTML-Code mehr ist...
LG
Edit: Hier sind auch noch Beispiele zu finden:
https://github.com/mr-petz/ftui/blob/calview/www/ftui/examples/calview.html
Hi,
also ich habe nun nochmals eines deiner Beispiele verwendet. Aber es bleibt dabei, angezeigt wird nichts.
Vllt. Liegt es an den beiden Dateien. Ich habe diese direkt via Konsole und wget geladen, sollte ja eigtl. Kein Problem sein.
Eine Meldung ,,Daten werden geladen..." erhalte ich nicht.
Update: Das war's. Habe die beiden Dateien nochmals als raw abgespeichert und siehe da es geht...
Ich muss da also gestern Abend während den Test was verkehrt (vermutlich nicht als raw oder so) gemacht haben.
Gruß,
Tobi
Sehr schön.
Das nennt man Fehleranalyse ;)
LG mr_petz
Edit: Calview per wget:
wget https://raw.githubusercontent.com/mr-petz/ftui/calview/www/ftui/components/calview/calview.component.css
wget https://raw.githubusercontent.com/mr-petz/ftui/calview/www/ftui/components/calview/calview.component.js
In meinem FHEM-Device (CALVIEW) habe ich mehrere Kalender eingebunden. Gibt es mit CalView eine Möglichkeit, die Farben so ähnlich wie bei "daysleft" für die Termine, auch bei den Kalendern z.B. mittels des Readings "source" zu steuern?
Hi, das Reading sourcecolor gibt ja die Farben schon für den entsprechenden Eintrag vor.
Wie hier in der Demo wird es deklariert mit dem Attribute sourcecolor.
Dann werden die Farben vom Reading sourcecolor genommen.
https://github.com/mr-petz/ftui/blob/calview/www/ftui/examples/calview.html
<ftui-calview width="99%" class="size-1"
device="CalviewDevice"
details="daysleft,bdate,btime,summary"
detailwidth="10,20,15,50"
max="5"
sourcecolor
line-left>
</ftui-calview>
Eine Möglichket die sourcecolor in daysleft einzubringen ist nicht vorgesehen und in meinen Augen auch doppelt gemoppelt...
Oder du sagst/zeigst mal ein konkretes Beispiel.
Die einzelnen Farben kannst du auch in daysleft direkt angeben.
LG mr_petz
Edit: Ach jetzt verstehe ich glaube dein Anliegen. Du willst zwischen den Kalendern springen und/oder sie vermischen?
Wenn ja, geht es nicht.
Du könntest aber mehrere CalViews erstellen und mit hidden steuern.
Da setzt du einfach das hidden (true and false) auf dein source an.
Da wird dann immer nur der angezeigt den du "sichtbar" machst.
Bsp.:
Nehmen wir an dein Hauptkalender heisst Kalender und der nächste Kalender1:
[hidden]="Kalender:t_001_source | map('Kalender1:false,.*:true')"
Hier wird, wenn Kalender1 im Kalender:t_001_source steht, hidden auf false gestellt. Wenn irgendetwas anderes in souce steht, dann zieht bei hidden true.
ps. Ich hätte glaube die Kalender nicht zusammen geführt...
Vielen lieben Dank für den Input. Du hast recht, ich werde dann doch versuchen mittels ftui-row und ftui-column die verschiedenen Kalender-Views einzubinden und doch je Kalender eine View machen. Langsam finde ich Gefallen an CalView und FTUI3. ;-)
Fortsetzung der Diskussion von hier https://forum.fhem.de/index.php/topic,115259.msg1231968.html#msg1231968 (https://forum.fhem.de/index.php/topic,115259.msg1231968.html#msg1231968)
Wie geschrieben, fände ich es toll, wenn bei ganztägigen Ereignissen im calview-widget in der Beginn-Zeit nicht die Anfagszteit (bei mir 00:00) ausgegeben würde, sondern zum Beispiel nichts oder ein String wie zb "ganztags". Dann würde man auf einen Blick sehen, daß es sich um keinen "normalen" Termin handelt.
Bei meinem Kalender-Provider (kopano) steht bei ganztägigen Ereignissen in den readings btime und etime jeweils 00:00, das mag bei anderen Kalender-Providern anders sein.
Dazu hätte ich folgenden Vorschlag für eine kleine Änderung in der calview.component.js:
@@ -180,7 +180,7 @@
this.data['t_'+num+'_bdate'] = (this.hasAttribute('date_wday')?this.data['t_'+num+'_bdate'].split().map(x => x.substr(0,6)+' '+wdayx.substr(0,2)):this.data['t_'+num+'_bdate'].split().map(x => wdayx.substr(0,2)+', '+x.substr(0,6)));
this.data['t_'+num+'_edate'] = this.data['t_'+num+'_edate'].split().map(x => wdayx.substr(0,2)+', '+x.substr(0,6));
}
-
+ if (this.data['t_'+num+'_btime'] == '00:00' && this.data['t_'+num+'_etime'] == '00:00') this.data['t_'+num+'_btime'] = '';
let daysleftIdx = daysleftdata.length-1;
let blinkIdx = daysleftdata.length-1;
let coltxtcolor = '';
Das ist vermutlich weder besonders schön, noch parametrisierbar, aber für mich führt es zum gewünschten Ergebnis. Möglicherweise wäre das auch für andere Nutzer in der einen oder anderen Form interessant.
Cheers,
Pula
Ok. Ich schaue mal was geht.
Man muss auch beachten, wenn btime und etime angezeigt werden sollen was dann passieren soll. Dann müsste ich die beiden Zellen verbinden. Vorausgesetzt die stehen nebeneinander (kann man ja frei wählen).
Mal sehen was andere dazu sagen und wie es umzusetzen wäre.
Als optionales Attribute würde ich es dann einbinden.
LG
Wer Beginn und Ende eines Termins ausgeben möchte, könnte auf timeshort ausweichen; dort steht bei ganztägigen Terminen automatisch "ganztägig" - kann via Attribut fulldaytext aber auch individualisiert werden.
Spannend wird es (höchstwahrscheinlich) bei Terminen mit edate <> bdate ...
Zitat von: OdfFhem am 23 August 2022, 12:17:20
...
Spannend wird es (höchstwahrscheinlich) bei Terminen mit edate <> bdate ...
Das wird spannend, wenn es über mehrere Tage ganztägig ist...
k.A. wie man das löst...
LG
Hallo mr_petz,
ich würde gerne dieses Scrollfeature haben. Leider ist im gesamten Beitrag nichts mehr davon zu lesen.
Kannst du mir den Link für CSS & JS nochmal geben.
Danke vom alten Herrn
lG Aysha
Zitat von: mr_petz am 11 November 2021, 13:45:57
Hat noch jemand Interesse an einen unsichtbaren Scrollfeature?
Scrollbar wäre nicht zu sehen und man kann somit den Calview verkleinern im View.
siehe animierte Anhänge
lg mr_petz
Hi,
hast du den ersten Beitrag richtig durchgelesen?
mit dem Attribut list-scroll wird es aktiv.
download und update via https://github.com/mr-petz/ftui/tree/addons
LG mr_petz
Hallo mr_petz,
wow das ist ja cool!!!!!
Super Arbeit. Und dann bekommt man noch eine ganze Komponenten Sammlung dazu. Lieben Dank dafür. :-)
Leider habe noch Fragen:
1. Wo setze ich das Attribut list-scroll ? In meinem Modul gibt es den Eintrag nicht.
2. Irgendwo habe ich mal gelesen das man die Farben aus dem Google Kalender übernehmen kann. Geht das?
Ach so das andere habe ich wohl überlesen. Sorry.
Lg Aysha
Bsp:
<ftui-calview width="99%" class="size-1"
device="CalviewDevice"
details="daysleft,bdate,btime,summary"
detailwidth="10,20,15,50"
max="5"
sourcecolor
list-scroll>
</ftui-calview>
Beispiele:
https://github.com/mr-petz/ftui/blob/addons/www/ftui/examples/calview.html
sourcecolor liest die Farben aus dem CalviewDevice.
LG
Alles klar!
vielen Dank
:-)
Moin mr_petz,
in dem aktuellen Termin blinken nur rechts und links zwei schmale rote striche. Soll das so sein oder ist hier was falsch?
<ftui-calview width="99%" class="size-3"
device="Termine_V"
headers="Datum,Uhrzeit,Ereignis"
details="bdate,timeshort,summary"
detailwidth="20,20,50"
max="20"
daysleft="-3:#8b0000:black,-2:tomato:black:bold,-1:#cd5c5c:black:bold,0:red::blink:size-3 bold,2:yellow:black"
round
blinkoutside
line-break
header-left
list-scroll>
</ftui-calview>
lg Aysha
Morgen :D
Leider muss ich dich wieder auf den ersten Post dieses Threads verweisen.
Zitat von: mr_petz am 13 April 2021, 21:45:09
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:
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:
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:
<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>
blinkoutside sorgt für nur aussen blinken/leuchten....
LG mr_petz
Sorry Asche auf mein Haupt!
Wenn ein komplett neues FTUI3 aufbaut wird, liest und sucht man sich hier einen Wolf.
- Mülltonnen -
- Termine -
- CallMonotor - ( mach ich zur Zeit mit table, ja ich weiß man soll colum und row nehmen, aber ich bekomme das spalten Format
nicht hin. Wäre doch auch was wie der CalView als Callview :-) )
- usw -
lg Aysha
Zitat von: AyshaHM am 14 Februar 2023, 11:32:57
...
Wenn ein komplett neues FTUI3 aufbaut wird, liest und sucht man sich hier einen Wolf.
....
Aller Anfang ist schwer. Sich einlesen gehört immer dazu bei was neuen.
Die meisten wollen aber immer gleich alles und sofort und am besten die komplette Seite schon fix und fertig mit allen Infos.
Das geht nur wenn alle hier gemeinsam mitwirken, sich einbringen (auch mit Hinweisen, Vorschlägen, wiki erweitern, Codeschnipsel, usw...) und nicht immer nur meckern wenn was nicht geht oder es nicht gefunden wird.
Ist nicht persönlich gemeint :D.
Zitat von: AyshaHM am 14 Februar 2023, 11:32:57
...
- CallMonotor - ( mach ich zur Zeit mit table, ja ich weiß man soll colum und row nehmen, aber ich bekomme das spalten Format
nicht hin. Wäre doch auch was wie der CalView als Callview :-) )
...
Benutze ich nicht, deswegen baue ich es auch nicht... sry
LG mr_petz
Hallo mr_petz,
oh, das war kein Meckern nur eine Frage. Ja, wenn ich genau gelesen hätte, hätte ich sie nicht stelle müssen.
Ich sitze seid 2 Wochen da dran und habe schon vieles selbst hin bekommen. Als Rentner habe ich auch die Zeit dafür und
es macht mir Spaß.
Die Hilfe und die Programmierungen hier sind echt super und ich kann viel lernen!!! Ohne dieses wäre ich schon am Ende.
Danke an alle!
lg Aysha
Hallo @mr_petz
Beim alten Calview für 2.x konnte man ja auch Kalenderansichten für Tag, Woche, Monat anzeigen lassen.
Gibt es da für FTUI3 auch eine Möglichkeit?
einfach nach calendar im hauptthread suchen und hier gibts den:
https://github.com/Thyraz/ftui/tree/master/components/calendar
ps.
ist nicht von mir...
Hi,
benutze ich auch, ist aber scheinbar noch fehlerhaft, siehe Link:
https://forum.fhem.de/index.php?msg=1224663 (https://forum.fhem.de/index.php?msg=1224663)
OdfFhem hatte da schon etwas unterstützt. :)
LG Gerald
Danke für die Antwort, schau es mir morgen in Ruhe an.
Andere Frage:
Kann man in deinem Calview die Einträge auch nach Kalender einfärben?
Ich nutze in Fhem in einem Calview-Device mehrere Kalender und würde die gerne in einer Liste anzeigen und zur besseren Erkennbarkeit die Einträge verschiedener Kalender verschieden einfärben.
Oder geht das nur mit den Tagen
Weis jetzt nicht was du meinst?
Es gibt sourcecolor was man setzen kann wenn du das meinst...
Im Example wird mit dem daysleft-Attribut die Farbe des jeweiligen Eintrags gesetzt. Diese beinhaltet zwar ein Mapping aber keine Angabe eines Readings. Es reagiert fest auf das Reading der ausstehenden Tage.
sourcecolor sagt mir nichts. Wie verhält sich das mit dem daysleft-Attribut.
Wenn man beide nutzt gibt es ja eine Überschneidung.
Hallo,
mal eine ganz blöde Frage, welche Online-Kalender nutzt ihr?
Bei Google gibt es ja nicht die Möglichkeit das Alter anzeigen zulassen.
Ausserdem zeigt mir der Google-Kalender an, wie lange der Geburtstag zurückliegt und nicht wenn er wieder "dran" ist.
LG
Hallo zusammen, dass hat sich erledigt
Zitat von: Kuehnhackel am 25 Oktober 2023, 16:34:51Ausserdem zeigt mir der Google-Kalender an, wie lange der Geburtstag zurückliegt und nicht wenn er wieder "dran" ist.
Nun meine Frage, da in der "Description" bei mir das Geburtsjahr steht, stelle ich mir die Frage ob man das Alter errechnen könnte.
über einen Lösungsansatz würde ich mich freuen.
LG
hi Kuehnhackel,
Wie willst du das Alter darstellen? per ftui-label oder hier in der Komponente?
LG
Zitat von: Kuehnhackel am 07 November 2023, 12:43:02Nun meine Frage, da in der "Description" bei mir das Geburtsjahr steht, stelle ich mir die Frage ob man das Alter errechnen könnte.
über einen Lösungsansatz würde ich mich freuen.
Du hast doch ein CALVIEW device als Quelle, oder?
Das kann das Modul recht automatisch, siehe Referenz (https://fhem.de/commandref_DE.html#CALVIEW):
Zitatisbirthday
0 / nicht gesetzt - keine Altersberechnung (Standard)
1 - aktiviert die Altersberechnung im Modul. Das Alter wird aus der in der Terminbeschreibung (description) angegebenen Jahreszahl (Geburtsjahr) berechnet. (siehe Attribut yobfield)
Zitat von: yersinia am 07 November 2023, 15:50:45Zitat von: Kuehnhackel am 07 November 2023, 12:43:02Nun meine Frage, da in der "Description" bei mir das Geburtsjahr steht, stelle ich mir die Frage ob man das Alter errechnen könnte.
über einen Lösungsansatz würde ich mich freuen.
Du hast doch ein CALVIEW device als Quelle, oder?
Das kann das Modul recht automatisch, siehe Referenz (https://fhem.de/commandref_DE.html#CALVIEW):
Zitatisbirthday
0 / nicht gesetzt - keine Altersberechnung (Standard)
1 - aktiviert die Altersberechnung im Modul. Das Alter wird aus der in der Terminbeschreibung (description) angegebenen Jahreszahl (Geburtsjahr) berechnet. (siehe Attribut yobfield)
Super, danke. Manches kann so einfach sein ;D
Zitat von: mr_petz am 07 November 2023, 15:46:51hi Kuehnhackel,
Wie willst du das Alter darstellen? per ftui-label oder hier in der Komponente?
LG
Als Übersicht 8)
Der Hinweis, wie man das Alter "errechnet" bzw. darstellt, sollte in der Beschreibung noch nit aufgenommen werden.
Danke
Ich hatte den ersten Lösungsansatz so gewählt, ist aber wenig komfortabel:
attr myGeburtstag userReadings Alter_001 {2024- ReadingsVal("myGeburtstag","t_001_description",0)},
Alter_002 {2024- ReadingsVal("myGeburtstag","t_002_description",0)}
Da müßte man jedes Jahr das Kalenderjahr nachpflegen.
LG
Ralf
Was machst du?
Es reicht wenn im Summary (Titel) des Kalenders das (Geburts-)Jahr erscheint, zB
Hanz Müller (1965) (funktioniert nur wenn yobfield richtig gesetzt ist). Dann errechnet dir CALVIEW automatisch das Alter wenn du isbirthday = 1 setzt.
Dann müsste es ein reading
t_nnn_age mit dem aktuellen Alter geben.
Man könnte sich auch (und nur!) diesen Teil ansehen: Geburtstagskalender mit Berechnung des Alters (https://wiki.fhem.de/wiki/FTUI_Widget_Calview#Geburtstagskalender_mit_Berechnung_des_Alters)
Edit sagt, du musst auch yobfield setzen:
Zitatyobfield
_description - (der Standard) Geburtsjahr wird aus der Terminbechreibung gelesen
_location - Geburtsjahr wird aus dem Terminort gelesen
_summary - Geburtsjahr wird aus dem Termintiele gelesen (verwendet wird die erste folge von 4 Ziffern im String))
Zitat von: yersinia am 07 November 2023, 16:06:27Was machst du?
Es reicht wenn im Subject des Kalenders das (Geburts-)Jahr erscheint, zB Hanz Müller (1965). Dann errechnet dir CALVIEW automatisch das Alter wenn du isbirthday = 1 setzt.
Dann müsste es ein reading t_nnn_age mit dem aktuellen Alter geben.
Man könnte sich auch (und nur!) diesen Teil ansehen: Geburtstagskalender mit Berechnung des Alters (https://wiki.fhem.de/wiki/FTUI_Widget_Calview#Geburtstagskalender_mit_Berechnung_des_Alters)
Nun ist mir das auch klar O:-)
Hier in dem Thread hat niemand nachgefragt, wegen dem Alter. Mit der Suche war ich auch nicht fündig geworden, deshalb meine Fragestellung.
Es läuft nun perfekt ;D , so wie ich es haben wollte.
Moin tosammen
Ich habe den Schulkalender unserer Kinder via CalView vorliegen und möchte diesen in das bekannte Stundenplan-Schema staffeln.
Dazu müsste ich irgendwie in der Lage sein das Datum und den Zeitraum der anzuzeigenden Kalendereinträge einzugrenzen.
Kann ich irgendwo diese Eingrenzung vornehmen beispielsweise
bdatemin=2024-10-10
bdatemax=2024-10-10
btimemin=0730
btimemax=0810
Gruß
Sailor
Ich möchte den Kalender in einem PopUp anzeigen. Da klappt auch, nur lässt sich das PopUp nicht durch klicken des Kreuzes schließen. Durch einen Klick rechts außerhalb des Fensters schließt sich das PopUp letztendlich doch. Wie kann das korrigiert werden ?
<ftui-popup id="pop1" timeout="0">
<ftui-calview width="99%" class="size-1"
device="myCalView"
headers="Tage,Datum,Uhrzeit,Ereignis"
details="daysleft,bdate,btime,summary"
detailwidth="10,20,15,50"
max="4"
daysleft="-3:#8b0000:black,-2:tomato:black:bold,-1:#cd5c5c:black:bold,0:red::blink:size-1 bold,2:yellow:black"
round
blinkoutside
line-break
header-left>
</ftui-calview>
</ftui-popup>
Ich konnte es selbst lösen. Anscheinend überlagert die Tabelle die Kopfzeile des PopUps. Ich habe ein leeres Label eingefügt. Damit ist die Tabelle weiter unten. Schon funktioniert es.
<ftui-popup id="pop4" timeout="10" width="900px" height="450px" position="page">
<ftui-label size="2"> </ftui-label>
<ftui-calview width="99%" class="size-1"
Hallo,
bisher hatte der CalView bei mir einwandfrei funktioniert, aber nun nach letztem FTUI3 Update leider nicht mehr.
Vielleicht hängt es mit dem Thema der Spaltenbreite zu tun, wie auch hier diskutiert: https://forum.fhem.de/index.php?topic=140617.15 (https://forum.fhem.de/index.php?topic=140617.15)
Hat jemand dazu schon eine Lösung ?
Gruss
Holger
Hallo Holger,
also bei mir funktioniert calview weiterhin seit dem letzten Update, mir hatte es aber auch die Ansicht verschoben. Es gab ab er gestern Abend ein Update, da wurde wieder vieles geradegerückt.
Wenn das Update bei dir keinen Erfolg bringt müsstest du mal deine Definition posten, ohne ist es arg schwer hier ne Aussage zu treffen.
LG Markus
Hallo Markus, danke für die Info. Hab noch einmal aktualisiert, aber die Kalenderanzeige bleibt weiterhin leer (auch wenn ich <width="99%"> lösche.
Meine Def sieht wie folgt aus:
<ftui-grid-tile row="3" col="2" height="8" width="9" shape="round">
<header>Kalender</header>
<ftui-calview width="99%" class="size-1"
device="MyCalview"
headers="Tage,Datum,Uhrzeit,Ereignis"
details="daysleft,bdate,btime,summary"
detailwidth="20,35,28,50"
max="15"
sourcecolor
line-left>
</ftui-calview>
</ftui-grid-tile>
Hi Holger,
wie du heute den Code gepostet hast und ich diesen mit meinem vergleichen wollte hab ich festgestellt das ich calview gar nicht benutze, ich bau mir meine Anzeige selber zusammen.
Deswegen hab ich hier leider erstmal keine Referenz zu dir, werde aber morgen wenn ich mal Zeit habe calview benutzen und mal schauen.
LG Markus
//edit:
Hab es rausgefunden. Mit dem Attribut " line-left" wird es nun fein linksbündig gemacht. :)
Hallo Zusammen,
die Texte in den Spalten sind zentriert.
Frage. Kann man einzelne Spalten nicht auch linksbündig machen?
In meinem Fall hat der WAF und dessen Monk zugeschlagen, dass dies bei den Namen nicht so gut aussieht.
Danke schon mal. :)
<ftui-calview
device="ViewGeburtstagsKalender"
width="98%"
top="15px"
headers="Tage,Datum,Name,Alter"
details="daysleftLong,bdate,summary,age"
daysleft="1:red:white:blink:bold,3:orange:white:bold,5:green:white:white"
max="6"
detailwidth="28,24,30,15"
class="size-0"
round
flat
wday_date>
</ftui-calview>