New FHEM Tablet UI

moelski · 03 Januar 2016, 19:09:29

Moins!

Ich bin gerade dabei Spritpreise als Chart darzustellen.
Mein Chart habe ich so konfiguriert:

			<div class="normal"
				data-type="chart"
				data-logdevice="FileLog_TANK_BaWue_Simus"
				data-columnspec='["4:TANK_Madfeld_Shell.DieselPreis", "4:TANK_Fuerstenberg_Esso.DieselPreis"]'
				data-style='["ftui l0", "ftui l1"]'
				data-ptype='["lines", "lines"]'
				data-uaxis='["primary", "primary"]'
				data-legend='["Madfeld", "Furstenberg"]'
				data-yunit="&euro;"
				data-ytext="Euro / Liter"
				data-minvalue="0.8"
				data-maxvalue="1.3"
				data-height="135"
				data-width="600"
				data-nofulldays="true"
				data-cursorgroup="1"
				data-scrollgroup="1"
				data-xticks="auto">
			</div>

Das funktioniert auch, aber die min / maxvalue Werte lassen scheinbar nur ganzzahlige Werte zu !? Ist dem so?
Oder muss man dafür was anderes noch konfigurieren? Bei Spritpreisen ist die Skalierung 0 bis 2 ziemlich unglücklich ... Vor allem wenn man eh nur ein 140 Pixel hohes Chart darstellt ..

Und hier hatte jemand geschrieben ...

ZitatBei dem neuen Chart wird die Beschriftung der x und y Achse im Webviewcontrol nicht angezeigt, im "normalen" Browser hingegen schon. Ist das ein bekannter Bug im Webviewcontrol?

Das ist bei mir auch so. Aber nur beim IE edge. Wird es da noch einen Fix geben?

Grüße

StefanJoe · 03 Januar 2016, 19:58:23

Zitat von: viegener am 03 Januar 2016, 18:32:20
Dann verstehe ich vielleicht nicht, was Du mit pagetab hier erreichen willst, wenn index_heizung.html leer ist, erschiliesst sich mir der Sinn hier nicht.

Zur anderen Frage: pagetab ersetzt innerhalb des Javascripts, wenn es aufgerufen wird beziehungsweise initialisiert wird den Inhalt des Gridster htmls durch das html dass aus dem angegebenen Link geladen wird.

Hallo Johannes,

ich möchte gerne links eine Navigationsleiste erstellen, die dann im rechten Teil unterschiedliche Ansichten präsentiert.
Inhalte je "Unterseite" werden dafür aktuell noch definiert, daher ist das "noch" leer.

Habe auch bereits versucht das über "button" zu realisieren, aber aus einem mir nicht bekannten Grunde kann ich bei button keine data-icon oder icon definieren ... es bleibt immer nur beim orangenen Kreis.

viegener · 03 Januar 2016, 21:41:28

Ich würde vorschlagen in index_heizung.html mal zumindest auch den Gridster einzusetzen und zusätzlich darin einen button oder label. Mit einer leeren Datei kann es komische Effekte geben.

Beispiel für eine pagetab-Seite, wie ich sie verwende:

Code Auswählen

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <div class="gridster">
<ul>
  <li data-row="1" data-col="1" data-sizex="1" data-sizey="4" >
        <header>Menu</header> 
</li>
  <li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
        <header>Test</header> 
  </li>
</ul>    
</div>
</body>
</html>

viegener · 03 Januar 2016, 21:47:04

Zitat von: StefanJoe am 03 Januar 2016, 19:58:23
Habe auch bereits versucht das über "button" zu realisieren, aber aus einem mir nicht bekannten Grunde kann ich bei button keine data-icon oder icon definieren ... es bleibt immer nur beim orangenen Kreis.

Was sagt denn die Console im Browser dazu?

In der Seite oben ist z.B: openautomation und fhemSVG nicht eingebunden (nur font-awesome), deshalb wäre es vermutlich kein Wunder, wenn keine Button-Icons angezeigt werden.

Johannes

StefanJoe · 03 Januar 2016, 22:28:51

Zitat von: viegener am 03 Januar 2016, 21:47:04
Was sagt denn die Console im Browser dazu?

In der Seite oben ist z.B: openautomation und fhemSVG nicht eingebunden (nur font-awesome), deshalb wäre es vermutlich kein Wunder, wenn keine Button-Icons angezeigt werden.

Johannes

habe mal beide CSS eingebunden, aber immer noch derselbe Effekt.
Console-output hier:

Code Auswählen


GET 
http://192.168.1.33:8083/fhem/tablet/css/fhem-tablet-ui-user.css [HTTP/1.1 404 Not Found 129ms]
Unbekannte Eigenschaft 'speak'.  Deklaration ignoriert. fhem-tablet-ui.css:46:13
Unbekannte Eigenschaft '-moz-osx-font-smoothing'.  Deklaration ignoriert. fhem-tablet-ui.css:54:31
Fehler beim Verarbeiten des Wertes für 'display'.  Deklaration ignoriert. fhem-tablet-ui.css:252:13
Fehler beim Verarbeiten des Wertes für 'display'.  Deklaration ignoriert. fhem-tablet-ui.css:253:13
Fehler beim Verarbeiten des Wertes für 'display'.  Deklaration ignoriert. fhem-tablet-ui.css:254:13
Fehler beim Verarbeiten des Wertes für 'min-height'.  Deklaration ignoriert. fhem-tablet-ui.css:380:16
Unbekannte Eigenschaft 'appearance'.  Deklaration ignoriert. fhem-tablet-ui.css:571:14
Unbekannte Eigenschaft '-moz-osx-font-smoothing'.  Deklaration ignoriert. font-awesome.min.css:4:587
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:1826
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:1989
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:2155
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:2326
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:2499
Unbekannte Eigenschaft 'speak'.  Deklaration ignoriert. fhemSVG.css:14:6
Unbekannte Eigenschaft '-moz-osx-font-smoothing'.  Deklaration ignoriert. fhemSVG.css:23:24
Unbekannte Eigenschaft 'speak'.  Deklaration ignoriert. openautomation.css:14:6
Unbekannte Eigenschaft '-moz-osx-font-smoothing'.  Deklaration ignoriert. openautomation.css:23:24
Synchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.toast.min.js:4:25327
Farbe erwartet, aber '#-a310a23a' gefunden. from DOM
Farbe erwartet, aber '#-\33 5c41a5' gefunden. from DOM
Fehler beim Verarbeiten des Wertes für 'line-height'.  Deklaration ignoriert. index.html

viegener · 03 Januar 2016, 23:32:35

Zitat von: StefanJoe am 03 Januar 2016, 22:28:51
habe mal beide CSS eingebunden, aber immer noch derselbe Effekt.

Einige der Meldungen sind schon etwas rätselhaft.
Hast Du denn mal das Beispiel (index-example.html) bei Dir in Betrieb gesetzt? Wenn auch da keine Icons angezeigt werden, stimmt irgendetwas mit Deiner Installation nicht.

StefanJoe · 03 Januar 2016, 23:53:18

Zitat von: viegener am 03 Januar 2016, 23:32:35
Einige der Meldungen sind schon etwas rätselhaft.
Hast Du denn mal das Beispiel (index-example.html) bei Dir in Betrieb gesetzt? Wenn auch da keine Icons angezeigt werden, stimmt irgendetwas mit Deiner Installation nicht.

Also wenn ich die index-example aufrufe, bekomme ich folgende Ausgabe in der console:

Code Auswählen


GET 
http://192.168.1.33:8083/fhem/tablet/css/fhem-tablet-ui-user.css [HTTP/1.1 404 Not Found 19ms]
Unbekannte Eigenschaft 'speak'.  Deklaration ignoriert. fhem-tablet-ui.css:46:13
Unbekannte Eigenschaft '-moz-osx-font-smoothing'.  Deklaration ignoriert. fhem-tablet-ui.css:54:31
Fehler beim Verarbeiten des Wertes für 'display'.  Deklaration ignoriert. fhem-tablet-ui.css:252:13
Fehler beim Verarbeiten des Wertes für 'display'.  Deklaration ignoriert. fhem-tablet-ui.css:253:13
Fehler beim Verarbeiten des Wertes für 'display'.  Deklaration ignoriert. fhem-tablet-ui.css:254:13
Fehler beim Verarbeiten des Wertes für 'min-height'.  Deklaration ignoriert. fhem-tablet-ui.css:380:16
Unbekannte Eigenschaft 'appearance'.  Deklaration ignoriert. fhem-tablet-ui.css:571:14
Unbekannte Eigenschaft '-moz-osx-font-smoothing'.  Deklaration ignoriert. font-awesome.min.css:4:587
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:1826
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:1989
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:2155
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:2326
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden.  Fehler beim Verarbeiten des Wertes für 'filter'.  Deklaration ignoriert. font-awesome.min.css:4:2499
Synchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.min.js:4:25327
Unbekannte Eigenschaft 'user-select'.  Deklaration ignoriert. powerange.min.css:1:1156

viegener · 04 Januar 2016, 00:11:41

Zitat von: StefanJoe am 03 Januar 2016, 23:53:18
Also wenn ich die index-example aufrufe, bekomme ich folgende Ausgabe in der console:

Was wird denn bei der index-example angezeigt? Werden hier Icons angezeigt?
Johannes

StefanJoe · 04 Januar 2016, 00:25:27

Ja, werden angezeigt.
Dort sind ja aber auch keine "buttons" definiert, sondern nur switch, label .....

viegener · 04 Januar 2016, 00:46:19

Zitat von: StefanJoe am 04 Januar 2016, 00:25:27
Ja, werden angezeigt.
Dort sind ja aber auch keine "buttons" definiert, sondern nur switch, label .....

Ahh ok, Sorry dann hatte ich Dich dabei missverstanden (Button wird auch ind er Doku als Synonym für alle Push-widgets bzw knopfartigen Elemente verwendet). Das heisst switch / push (und auch symbol) können Icons anzeigen? Nur beim widget_button wird das Icon nicht angezeigt?

Kannst Du dann mal ein Beispiel für eine Seite mit Button posten und genau beschreiben was angezeigt wird (auch wenn gedrückt)?

StefanJoe · 04 Januar 2016, 00:57:52

Zitat von: viegener am 04 Januar 2016, 00:46:19
Ahh ok, Sorry dann hatte ich Dich dabei missverstanden (Button wird auch ind er Doku als Synonym für alle Push-widgets bzw knopfartigen Elemente verwendet). Das heisst switch / push (und auch symbol) können Icons anzeigen? Nur beim widget_button wird das Icon nicht angezeigt?

Kannst Du dann mal ein Beispiel für eine Seite mit Button posten und genau beschreiben was angezeigt wird (auch wenn gedrückt)?

Korrekt,
ich kann zwar den button "an / ab" schalten (orange/grau) aber das symbol wird nicht angezeigt...

StefanJoe · 04 Januar 2016, 00:59:34

aber auch nochmal zurück zum Anfangsproblem:

Was ist denn aktuell die Empfehlung wernn man auf einer Seite eine "Übersicht" zeigen möchte und bei Klick auf ein Symbol (egal ob Menü oder sonstwas) Details (z.B. SVG Plots etc) angezeigt bekommen möchte ?

kvo1 · 04 Januar 2016, 07:57:52

Hallo Johannes,

Zitat von: viegener am 03 Januar 2016, 13:55:30
Hi Klaus,
welches Problem hattest Du mit meinem Beispiel, oder ging es nur um die Einfärbung der Knöpfe?
Eine Einfärbung der Knöpfe habe ich bisher auch nicht am Laufen, ich vermute dazu fehlt dem push widget die Möglichkeit auf statusänderungen zu reagieren und das switch widget hat immer einen internen on/off-Status, der hier hinderlich ist.
Gruss,
Johannes

2 Dinge habe ich hier:

-der Slider ist nicht mittig über den 3 Knöpfen

- wenn ich einen der 3 Knöpfe drücke , passiert (bisher) nichts ! (also unten links kommt keine Meldung)

PS. bin aber zugegeben ein "Neuling" bei FTUI (html / CSS)

Danke für Deine Hilfe
klaus

bert · 04 Januar 2016, 10:02:28

Kann mir jemand sagen, wie ich die Schriftgrösse im Thermost-Widget verkleinern kann.

Gruß Bert

Augschburger · 04 Januar 2016, 11:19:24

Selbstgespräche...

Zitat von: Augschburger am 02 Januar 2016, 13:55:20
Hallo,

jetzt frage ich doch mal nach, weil ich einfach nicht mehr weiterkomme:
[...]
Ist das ein Bug, ein Feature, oder habe ich etwas falsch gemacht?

Inzwischen habe ich mich parallel mit der Anwesenheitserkennung per Fritzbox beschäftigt und dort gibt es den Hinweis, dass es nicht funktioniert, wenn die Readings gelöscht werden (verschwinden). Deshalb habe ich folgende Theorie:
Dadurch, dass das Reading today_00n_xxx und tomorrow_00n_xxx in den CALVIEW devices um Mitternacht einfach verschwindet, bekommt Tablet UI das nicht mit und zeigt weiterhin den alten Wert aus dem Cache an. Sollte der durch einen neuen Termin überschrieben werden, ist alles gut und es wird korrekt angezeigt.

Deshalb habe ich mir jetzt für Mitternacht ein paar at Befehle angelegt, die zuerst das Reading auf --- setzen, kurz warten und anschließend löschen. Die Intervalle der CALVIEW devices habe ich auf 60 Minuten gestellt, so wird spätestens eine Stunde später der (eventuell vorhandene) neue Termin wieder richtig eingetragen.

Das Setzen auf --- triggert das Tablet UI, dort filtere ich es mit data-substitution="s/---//g" aus der Anzeige. Leider kann man mit setreading keine Leerstrings übergeben...

Code Auswählen

define myFeiertage_DEL at *23:59:59 setreading myFeiertage today_001_summary ---;;setreading myFeiertage tomorrow_001_summary ---;;sleep 1;;deletereading myFeiertage today_001_summary;;deletereading myFeiertage tomorrow_001_summary

Mir taugt das so, weil ich (im Moment) nur ganztägige Termine anzeigen will.
Trotzdem täte mich interessieren, wie andere das Problem gelöst haben?

Danke für sachdienliche Hinweise,

Hans-Jörg