FHEM Forum

FHEM => Frontends => TabletUI => Thema gestartet von: setstate am 23 Januar 2017, 22:25:41

Titel: FTUI 2.5
Beitrag von: setstate am 23 Januar 2017, 22:25:41
Bei der aktuellen, per Update verteilten Version gab es am 23.01.17 ein Upgrade im größeren Umfang.
Folgende Änderungen sind dabei:

- dynamisches Laden der Main-CSS Files und Standard-JS-Libs.

Es muss dadurch nicht mehr jedes benutze Icon-Set extra als CSS eingebunden werden. Wenn eines der inkludierten Icons benutzt wird, wird beim Start das benötigte CSS automatisch in den Header geladen.

Das gleiche gilt auch für die Gridster und Toast Libs.

Damit sieht ein HTML-Header minimal nur noch so aus


<!DOCTYPE html>
<html>

<head>

    <link rel="icon" href="favicon.ico" type="image/x-icon" />

    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="css/fhem-tablet-ui-user.css" / -->

    <script src="js/fhem-tablet-ui.js" defer></script>

    <title>FHEM-Tablet-UI</title>
</head>


- dynamisches Berechnen der Gridster Kachel-Größen anhand der Bildschirmgröße und definierten Reihen und Spalten

Wenn man nicht möchte, dass die Anzahl der Spalten und Zeilen automatisch erkannt wird, kann man auch die Gridster Spalten und Reihen fest vorgeben


<meta name="gridster_cols" content="12">
<meta name="gridster_rows" content="9">


Keine automatische Anpassung an die Bildschirmgröße erfolgt, wenn man die Basis-Größen fest vorgibt


<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">


- verbessertes Laden von Templates

Damit sollte es nicht mehr vorkommen, dass bei Benutzung von Client-Side-Templates Symbole und Switches sporadisch fehlen.

- text/html content für push, symbol, switch, pagetab

<div data-type="symbol" data-device="dummy2" data-background-icon="fa-circle" data-on-background-color="green" data-off-background-color="red" data-color="#222" data-icon="">MS</div>

- Push Widget kann nun auch auf Inputs reagieren

Somit kann man bei Push-Widgets innerhalb eines Circlemenus den aktuell eingestellten Wert anzeigen


<div data-type="circlemenu" class="">
    <ul>
        <li>
            <div data-type="push" data-icon=""><div data-type="label" data-device="AvReceiver" data-get="subwoofer-temporary-level" class="small"></div></div>
        </li>
        <li>
            <div data-type="push" data-device="AvReceiver" data-set-on="subwoofer-temporary-level -15" data-get="subwoofer-temporary-level" data-get-on="-15" data-icon=""><div class="small">-15</div></div>
        </li>
        <li>
            <div data-type="push" data-device="AvReceiver" data-set-on="subwoofer-temporary-level -10" data-get="subwoofer-temporary-level" data-get-on="-10" data-icon=""><div class="small">-10</div></div>
        </li>
        <li>
            <div data-type="push" data-device="AvReceiver" data-set-on="subwoofer-temporary-level -5" data-get="subwoofer-temporary-level" data-get-on="-5"  data-icon=""><div class="small">-5</div></div>
        </li>
        <li>
            <div data-type="push" data-device="AvReceiver" data-set-on="subwoofer-temporary-level 0" data-get="subwoofer-temporary-level" data-get-on="0"  data-icon=""><div class="small">0</div></div>
        </li>
        <li>
            <div data-type="push" data-device="AvReceiver" data-set-on="subwoofer-temporary-level 5" data-get="subwoofer-temporary-level" data-get-on="5"  data-icon=""><div class="small">5</div></div>
        </li>
        <li>
            <div data-type="push" data-device="AvReceiver" data-set-on="subwoofer-temporary-level 10" data-get="subwoofer-temporary-level" data-get-on="10"  data-icon=""><div class="small">10</div></div>
        </li>
        <li>
            <div data-type="push" data-device="AvReceiver" data-set-on="subwoofer-temporary-level 12" data-get="subwoofer-temporary-level" data-get-on="12"  data-icon=""><div class="small">12</div></div>
        </li>
    </ul>
</div>


- Angeglichene Größen für Symbol/Switch und Label

- mini         : 50%
- tiny          : 60%
- small        : 80%
- normal      : 100%
- large        : 125%
- big           : 150%
- bigger      : 200%
- tall           : 350%
- grande      : 600%
- gigantic     : 144px

Durch die neuen Größen kann es bei bestehenden UIs zu Verschiebungen oder anderer Darstellung der Switches/Symbole kommen. Diese müssen angepasst werden.

- Push widgets kann jetzt zwei Status senden: off und on
Damit kann man Pfeiltasten für eine Camera-Steuerung bauen


<li data-row="3" data-col="3" data-sizey="2" data-sizex="2">
    <header>Joystick</header>
    <div class="vbox">
        <div class="hbox">
            <div data-type="push" data-device="dummy1" data-set-on="up" data-set-off="stop" data-icon="fa-arrow-up"></div>
        </div>
        <div class="hbox items-space-around">
            <div data-type="push" data-device="dummy1" data-set-on="left" data-set-off="stop" data-icon="fa-arrow-left"></div>
            <div data-type="label" data-device="dummy1"></div>
            <div data-type="push" data-device="dummy1" data-set-on="right" data-set-off="stop" data-icon="fa-arrow-right"></div>
        </div>
        <div class="hbox">
            <div data-type="push" data-device="dummy1" data-set-on="down" data-set-off="stop" data-icon="fa-arrow-down"></div>
        </div>
    </div>
</li>


- Departure: Auto refresh nach Popup öffnen oder Seitenwechsel mit Pagebutton

- Fade für Link + Pagebutton

Zitatdata-fade-duration   : time in millisecondes or 'slow'/'fast' to fade to next page (default 'slow')

- user language setting

<meta name='lang' content='de'>

- Slider/Level Widget: Timer zum Interpolieren von Zwischenschritten

Zum Beispiel bei einer Song-Vortschrittsanzeige, die nur aller 10 Sekunden ein Update bekommt, kann mit data-timer-step="1" und data-timer-interval="1000" (Default-Werte) die Anzeige automatisch weiterlaufen lassen. Aber nur, wenn das data-timer-state Reading einen gültigen Status zum Laufenlassen des Timers hat. Entsprechend zu den data-timer-on und data-timer-off Definitionen.


<div data-type="level" data-device="MPD1" data-get="elapsed" data-max="Time" data-width="280" data-timer-state="MPD1:STATE" data-timer-state-on="play" data-timer-state-off="!on" data-margin="15px"  class="horizontal"></div>


- neues Layout Schema: Sheet > Row > Cell

Ein Tabellen ähnliches Layout um Widgets sehr einfach vertikal und horizontal zentrieren zu können


<li data-row="1" data-col="3" data-sizey="2" data-sizex="2">
    <header>Sheet > Row > Cell</header>
    <div class="sheet">
        <div class="row">
            <div class="cell" data-type="symbol" data-device="dummy1"></div>
            <div class="cell" data-type="symbol" data-device="dummy2"></div>
        </div>
        <div class="row">
            <div class="cell" data-type="symbol" data-device="dummy3"></div>
            <div class="cell" data-type="symbol" data-device="dummy4"></div>
        </div>
    </div>
</li>


Alignment: left-align, right-align, top-align, bottom-align


<li data-row="3" data-col="3" data-sizey="2" data-sizex="2">
    <header>Sheet > Row > Cell *-Align</header>
    <div class="sheet">
        <div class="row">
            <div class="cell left-align" data-type="symbol" data-device="dummy1"></div>
            <div class="cell right-align" data-type="symbol" data-device="dummy2"></div>
        </div>
        <div class="row">
            <div class="cell top-align" data-type="symbol" data-device="dummy3"></div>
            <div class="cell bottom-align" data-type="symbol" data-device="dummy4"></div>
        </div>
    </div>
</li>


- Slider und Thermostat können sich bei Berührung vergrößern

Für den Slider-Knopf
Zitat- **data-handle-diameter** : size for the handle (default 20)
- **data-touch-diameter** : size for the handle on movement (default: the normal size)

Für den Thermostat
Zitat
- **data-touch-height**  : vertical size of the widget  during changes (default: the normal size - 100)
- **data-touch-width**   : horizontal size of the widget during changes (default the normal size - 100)

- Änderung bei data-hidel

Einheitlich zu "lock", "warn" und "reachable" ist jetzt auch bei "hide" die Definition folgendermaßen :

data-hide        -  Das Reading (Default: STATE des data-device)
data-hide-on   -  Der Wert, den das Reading haben muss, damit es versteckt wird (Default: 'true|1|on')
data-hide-off   -  Der Wert, den das Reading haben muss, damit es wieder sichtbar wird (Default '!on' <- bedeutet: Gegenteil von data-hide-on )

- eigene jQuery - Version 3.* -

Wenn FTUI beim Starten kein jQuery findet (nicht bereits im Header eingebunden), dann nimmt er das aus dem lib Folder.
Wenn man also die neuste jQuery nutzen will, muss man im Header auf die eigene im lib Folder verweisen, oder den Verweis im Header ganz weglassen.
Titel: Antw:FTUI 2.5
Beitrag von: gloob am 24 Januar 2017, 08:19:35
Kommt das Update auf 2.5 über das normale Update?
Titel: Antw:FTUI 2.5
Beitrag von: Tobias am 24 Januar 2017, 08:21:04
Puhh, ich bin erschlagen von den Neuerungen :)
Respekt!
Allerdings habe ich Angst/Bedenken das viele der neuen und alten Features einfach untergehen, nicht benutzt werden oder in Vergessenheit für die breite Masse geraten weil das ReadMe auf der GitHub Seite nicht aktuell oder zu oberflächlich ist. Die Fhem Wiki Seite ist sowiso permanent veraltet :(

Ich selbst habe aber auch keine Idee wie ich/wir setstate dabei unterstützen können....
Titel: Antw:FTUI 2.5
Beitrag von: scooty am 24 Januar 2017, 08:51:27
Erst einmal danke für die tollen neuen Erweiterungen!
:)
Hier eine Rückmeldung auf die Schnelle:

select-widget:
Nur der Auswahlpfeil reagiert auf Grössenänderungen in class, der Text der Select-items und der Rahmen bleiben klein (s. Bild)

<div data-type="select"
data-device="XXDG_MTW"
data-set="desiredTemperature"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="tall centered top-narrow-2x">
</div>


symbol widget:
Widget wird trotz validem data-lock Wert angezeigt
Das data-warn Symbol (roter Kreis) wird nicht angezeigt

<div data-device="MUELL_Bio_Tage"
data-type="symbol"
data-states='["^[01]$",".*"]'
data-colors='["brown","brown"]'       
data-icons='["fa-trash-o warn fa-spin","fa-trash-o warn"]'
data-hide ='99'>
</div>


Oder vielleicht ist das ja auch nur bei mir so?

Vielen Dank nochmal,
Andreas

Edit:
PS: data-lock bei slider Widgest funktioniert nun hervorragend!
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 24 Januar 2017, 09:18:28
Cool! Vielen Dank!

Die Änderungen sind wirklich sehr umfangreich. Werd ich später Mal im Detail ausprobieren.
Ich muss nur zunächst mein Layout anpassen, da das Update dieses komplett "zerschossen" hat...
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 24 Januar 2017, 09:35:35
Sorry, wenn es jetzt bei einigen die Anzeige durcheinander bringt, aber ich musste bei einigen Widgets alte billige Workarounds ausbauen, die mit festen Margins hantieren, nur damit es einigermaßen platziert aussah. Wenn man aber jetzt ein Layout benutzt, was alles ordentlich positioniert und zentriert, stört so etwas.
Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 24 Januar 2017, 09:53:01
Wer kann denn alles die Wiki Seite bearbeiten?

Kann man das nicht in irgend einer Weise so einrichten das jeder was dazu beitragen kann es aber dann noch freigegeben werden muss?!
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 24 Januar 2017, 10:00:00
Zitat von: setstate am 24 Januar 2017, 09:35:35
Sorry, wenn es jetzt bei einigen die Anzeige durcheinander bringt, aber ich musste bei einigen Widgets alte billige Workarounds ausbauen, die mit festen Margins hantieren, nur damit es einigermaßen platziert aussah. Wenn man aber jetzt ein Layout benutzt, was alles ordentlich positioniert und zentriert, stört so etwas.

Never mind. Obwohl ich nun erst mal wieder mit den neuen Position-Tags spielen muss ein erstes Statement: GEIL!
sheet, row und cell sind ein wahrer Gewinn. Das Pagebutton-Fading ist sehr "wertig" und eine Testseite mit den selbstanpassenden Gridster-Elementen begeistert mich.
Vielen Dank setstate!
Titel: Antw:FTUI 2.5
Beitrag von: cotecmania am 24 Januar 2017, 10:29:51
Ups.
Meine Seite ist nun auch komplett "zerschossen"  :'(

- Thermostat, SimpleChart und Range sind nun immer doppelt untereinander vorhanden ?
- Charts erscheinen gar nicht mehr
- Beim Abfall-Symbol fehlen die kleinen Zahlen im roten Kreis bis zur nächsten Leerung
- Switch und Pagebutton sind farblich nicht mehr zu erkennen, d.h. selbe Farbe wie Hintergrund
- ...
- ...

Gruss
Titel: Antw:FTUI 2.5
Beitrag von: eazy_isi am 24 Januar 2017, 11:24:26
Meine Seite sieht auch ein wenig "verbogen" aus, nach dem Update  :'(
Aber nachdem ich die Symbole angepasst habe, sieht es schon wieder ganz ordentlich aus.

Ansonsten das gleiche Probleme wie bei @cotecmania

- Beim Abfall-Symbol fehlen die kleinen Zahlen im roten Kreis bis zur nächsten Leerung

- neues Layout Schema: Sheet > Row > Cell  Super ! Habe ich schon kurz angetestet, komme allerdings nicht ganz klar,
wie ich ein Label für das Icon passend darunter platziere.

Gruß
Thomas
Titel: Antw:FTUI 2.5
Beitrag von: roadghost am 24 Januar 2017, 11:32:27
Hey Leute,

wenn ich vom 1.er FTUI auf die nun aktuelle Version wechseln möchte, welchen Aufwand muss ich denn dazu betreiben ??

Muss ich jede einzelne Seite (in meinem Fall gute 22 Stück) überarbeiten, oder was muss ich ersetzen bzw. anpassen ??

Die kleinen roten Zahlen an den Mülltonnen-Icons fehlen bei mir auch, der Rest sieht erstmal, bis auf größenveränderungen (bigger/bigplus) gut aus.

Grüße
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 24 Januar 2017, 11:56:59
Innerhalb einer "cell" -> untereinander
Neue cell -> neben der anderen cell


                <div class="sheet">
                    <div class="row">
                        <div class="cell">
                            <div data-type="symbol" data-device="dummy1"></div>
                            <div data-type="label" class="small narrow darker">Status</div>
                        </div>
                    </div>
                </div>


Das mit dem Warn-Kreis muss ich mir anschauen. Habe ich nicht explizit getestet 
Titel: Antw:FTUI 2.5
Beitrag von: Eisix am 24 Januar 2017, 12:33:53
Hallo,

Warnkreise sind bei mir da.
Bei den meisten Seiten hat das rausnehmen von cell die Ordnung einigermaßen wieder hergestellt.

Gruß
Eisix
Titel: Antw:FTUI 2.5
Beitrag von: fhainz am 24 Januar 2017, 14:17:42
Zitat von: SamNitro am 24 Januar 2017, 09:53:01
Wer kann denn alles die Wiki Seite bearbeiten?

Kann man das nicht in irgend einer Weise so einrichten das jeder was dazu beitragen kann es aber dann noch freigegeben werden muss?!
Jeder kann das Wiki bearbeiten. Account besorgen und schon gehts los.

Grüße
Titel: Antw:FTUI 2.5
Beitrag von: eazy_isi am 24 Januar 2017, 15:41:03
Danke für die Hilfe.

So funktioniert es jetzt wie gewünscht:
<header class="semitransparentheader">@Home</header>

   <div class="sheet">
        <div class="row">
            <div class="cell top-align">
    <div data-type="symbol"
data-device="Handy_Chefin"
data-icon="fa-user"
class="big"
data-on-color="orange"
          data-get-on="present"
          data-get-off="absent"></div>
    <div data-type="label" class="small narrow darker">Chefin</div>           
        </div>
            <div class="row">
            <div class="cell left-align">
    <div data-type="symbol"
data-device="Handy_Chef"
data-icon="fa-user"
class="big"
data-on-color="orange"
          data-get-on="present"
          data-get-off="absent"></div>
    <div data-type="label" class="small narrow darker">Chef</div>
    </div>
</li>


Allerdings nur mit top-align

Versuche ich es so:
<header class="semitransparentheader">@Home</header>

   <div class="sheet">
        <div class="row">
            <div class="cell left-align">
    <div data-type="symbol"
data-device="Handy_Chefin"
data-icon="fa-user"
class="big"
data-on-color="orange"
          data-get-on="present"
          data-get-off="absent"></div>
    <div data-type="label" class="small narrow darker">Chefin</div>           
        </div>
            <div class="row">
            <div class="cell right-align">
    <div data-type="symbol"
data-device="Handy_Chef"
data-icon="fa-user"
class="big"
data-on-color="orange"
          data-get-on="present"
          data-get-off="absent"></div>
    <div data-type="label" class="small narrow darker">Chef</div>
    </div>
</li>


oder mit bottom-align Sind die Symbole in der Höhe versetzt.
Siehe Bild




Zitat von: setstate am 24 Januar 2017, 11:56:59
Innerhalb einer "cell" -> untereinander
Neue cell -> neben der anderen cell


                <div class="sheet">
                    <div class="row">
                        <div class="cell">
                            <div data-type="symbol" data-device="dummy1"></div>
                            <div data-type="label" class="small narrow darker">Status</div>
                        </div>
                    </div>
                </div>


Das mit dem Warn-Kreis muss ich mir anschauen. Habe ich nicht explizit getestet


Titel: Antw:FTUI 2.5
Beitrag von: h3llsp4wn am 24 Januar 2017, 15:53:13
@setstate: man sollte Dich zum Mega Hero Member promoten :)

Sehr geil! ... und ja - ich kotze jetzt schon, weil ich dann wohl demnächst alles Seiten/Features einbauen/umbauen werde ... das gibt wieder Ärger zu Hause,
ich hatte gerade die 2.4 kpl. durch und war mit neuen Featurerequest unterwegs ... gibt schlimmeres ...
Titel: Antw:FTUI 2.5
Beitrag von: choetzu am 24 Januar 2017, 16:43:52
Mega!!! Endlich hab ich wieder was zu tun... ;) Herzlichen Dank für deine Supermühe...


Frage: was hat dies für einen Einfluss auf die Mobile Seiten? Kann ich hier den selben Header nutzen?


Titel: Antw:FTUI 2.5
Beitrag von: Tabularasa am 24 Januar 2017, 17:03:43
Für einen Anfänger wie mich ist das gerade wieder ne extreme Herausforderung :-\ hatte nämlich schon ganz schön Mühe mir das alte hinzubasteln. Aber war jetzt schon langweilig weil ich am Sonntag fertig geworden bin ;) Dann mal los...
Titel: Antw:FTUI 2.5
Beitrag von: rvideobaer am 24 Januar 2017, 17:41:23
Hallo,

schön gemacht, das Umstellen war relativ schnell erledigt da nur wenig geändert werden musste. Aber ich habe ein problem das ich ein paar Steckdosen in meiner Anordnung durch Horizontale linen getrennt habe.
<li data-row="1" data-col="8" data-sizex="3" data-sizey="7">
        <header>Steckdosen</header>
<!-- ============ Steckdose Balkon ============= -->       
<div class="vbox ">
<div class="hbox">

        <div data-type="switch" data-device="HM_4Fach_Sw_01"
              data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
              data-set-off="on" class="big"></div>
        <div data-type="switch" data-device="HM_4Fach_Sw_01"
              data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
              data-set-on="off" class="big"></div>
       
      <div data-type="popup" data-height="150px" data-width="360px" >
       
        <div data-type="switch"
        data-device="T_HM_4Fach_Sw_01"
        data-icon="fa-clock-o"
        data-background-color-off="orange"
        data-set-on=""
        data-set-off=""
        data-get-on="!off"
        data-get-off="inactive"
        class="top-space-2x"></div>
       
    <div class="dialog" style="overflow:hidden">
      <header>Startzeit-Endzeit</header>
      <div class="vbox">
      <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">An&nbsp;</div>
   
            <div data-type="datetimepicker" data-device="T_HM_4Fach_Sw_01"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
              <div data-type="checkbox" data-device='T_HM_4Fach_Sw_01'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
              </div>
             
              <div class="hbox top-narrow">
    <span style="color:#ffa30d; font-size:25px">Aus</span>
   
                <div data-type="datetimepicker" data-device="T_HM_4Fach_Sw_01_aus"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
             
              <div data-type="checkbox" data-device='T_HM_4Fach_Sw_01_aus'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
               </div></div></div></div></div>
                <div class="hbox items-space-around">
        <div class="orange2 inline">Balkon</div><div class="orange2 inline">Timer</div>
        </div>
        <div class="orange2 top-narrow"></div><hr>
<!-- ============ Steckdose Wohnzimmer links ============= -->
<div class="hbox">

        <div data-type="switch" data-device="HM_4Fach_Sw_02"
              data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
              data-set-off="on" class="big"></div>
        <div data-type="switch" data-device="HM_4Fach_Sw_02"
              data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
              data-set-on="off" class="big"></div>
       
      <div data-type="popup" data-height="150px" data-width="360px">
     
        <div data-type="switch"
        data-device="timer_4_2"
        data-icon="fa-clock-o"
        data-background-color-off="orange"
        data-set-on=""
        data-set-off=""
        data-get-on="!off"
        data-get-off="inactive"
        class="top-space-2x"></div>
       
    <div class="dialog" style="overflow:hidden">
      <header>Startzeit-Endzeit</header>
      <div class="vbox">
      <div class="hbox top-narrow">
      <div style="color:#ffa30d; font-size:25px">An&nbsp;</div>
     
            <div data-type="datetimepicker" data-device="T_HM_4Fach_Sw_02"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
              </div>
              <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">Aus</div>
   
                <div data-type="datetimepicker" data-device="T_HM_4Fach_Sw_02_aus"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
             
              <div data-type="checkbox" data-device='timer_4_2'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
               </div></div></div></div></div>
        <div class="hbox items-space-around left-space-2x">
        <div class="orange2 inline">Wohnzimmer links</div><div class="orange2 inline">Timer</div>
        </div>
        <div class="orange2 top-narrow"></div><hr>
<!-- ============ Steckdose Wohnzimmer rechts ============= -->
       
       
       
    <div class="hbox">
   
        <div data-type="switch" data-device="HM_4Fach_Sw_03"
              data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
              data-set-off="on" class="big"></div>
        <div data-type="switch" data-device="HM_4Fach_Sw_03"
              data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
              data-set-on="off" class="big"></div>
             
      <div data-type="popup" data-height="150px" data-width="360px">
     
        <div data-type="switch"
        data-device="timer_4_3"
        data-icon="fa-clock-o"
        data-background-color-off="orange"
        data-set-on=""
        data-set-off=""
        data-get-on="!off"
        data-get-off="inactive"
        class="top-space-2x"></div>
       
        <div class="dialog" style="overflow:hidden">
      <header>Startzeit-Endzeit</header>
      <div class="vbox">
      <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">An&nbsp;</div>
   
            <div data-type="datetimepicker" data-device="T_HM_4Fach_Sw_03"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
              </div>
             
              <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">Aus</div>
   
                <div data-type="datetimepicker" data-device="T_HM_4Fach_Sw_03_aus"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
             
              <div data-type="checkbox" data-device='timer_4_3'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
                </div></div></div></div></div>
        <div class="hbox items-space-around left-space-2x">
        <div class="orange2 inline">Wohnzimmer rechts</div><div class="orange2 inline">Timer</div>
        </div>
        <div class="orange2 top-narrow"></div><hr>
<!-- ============ Steckdose Kueche ============= -->     
   
    <div class="hbox">
       
        <div data-type="switch" data-device="HM_S_Kueche"
              data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
              data-set-off="on" class="big"></div>
        <div data-type="switch" data-device="HM_S_Kueche"
              data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
              data-set-on="off" class="big"></div>
     
      <div data-type="popup" data-height="150px" data-width="360px">
     
        <div data-type="switch"
        data-device="timer_Kueche"
        data-icon="fa-clock-o"
        data-background-color-off="orange"
        data-set-on=""
        data-set-off=""
        data-get-on="!off"
        data-get-off="inactive"
        class="top-space-2x"></div>
       
    <div class="dialog" style="overflow:hidden">
      <header>Startzeit-Endzeit</header>
      <div class="vbox">
      <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">An&nbsp;</div>
   
            <div data-type="datetimepicker" data-device="timer_Kueche_01"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
              <div data-type="checkbox" data-device='timer_Kueche'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
                </div>
               
                <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">Aus</div>
   
                <div data-type="datetimepicker" data-device="timer_Kueche_01_aus"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
              <div data-type="checkbox" data-device='timer_Kueche_01_aus'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
                </div></div></div></div></div>
               
        <div class="hbox items-space-around left-space-2x">
        <div class="orange2 inline">K&uuml;che</div><div class="orange2 inline">Timer</div>
        </div>
        <div class="orange2 top-narrow"></div><hr>
<!-- ============ Steckdose Schlafzimmer ============= -->       
       
        <div class="hbox ">
        <div data-type="switch" data-device="PW_Stecker_02_Sw"
              data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
              data-set-on="on" class="big"></div>
        <div data-type="switch" data-device="PW_Stecker_02_Sw"
              data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
              data-set-on="off" class="big"></div>
       
      <div data-type="popup" data-height="150px" data-width="360px">
     
        <div data-type="switch"
        data-device="timer_PW_02"
        data-icon="fa-clock-o"
        data-background-color-off="orange"
        data-set-on=""
        data-set-off=""
        data-get-on="!off"
        data-get-off="inactive"
        class="top-space-2x"></div>
       
    <div class="dialog" style="overflow:hidden">
      <header>Startzeit-Endzeit</header>
      <div class="vbox">
      <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">An&nbsp;</div>
   
            <div data-type="datetimepicker" data-device="T_PW_Stecker_02"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
              <div data-type="checkbox" data-device='timer_PW_02'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
                </div>
                <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">Aus</div>
   
                <div data-type="datetimepicker" data-device="T_PW_Stecker_02_aus"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange left-space right-space"></div>
           
              <div data-type="checkbox" data-device='T_PW_Stecker_02_aus'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
                </div></div></div></div></div>
               
        <div class="hbox items-space-around left-space-2x">
        <div class="orange2 inline">Schlafzimmer</div><div class="orange2 inline">Timer</div>
        </div>
        <div class="orange2 top-narrow"></div><hr>

<!-- ============ Steckdose Zwischenstecker ============= -->

<div class="hbox">
        <div data-type="switch" data-device="Zw_Stecker_01"
              data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
              data-set-off="on"
              class="big"></div>
    <div data-type="switch" data-device="Zw_Stecker_01"
              data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
              data-set-on="off"
              class="big"></div>
                   
      <div data-type="popup" data-height="150px" data-width="360px">
     
        <div data-type="switch"
        data-device="timer_T_Zw_Stecker_01"
        data-icon="fa-clock-o"
        data-background-color-off="orange"
        data-set-on=""
        data-set-off=""
        data-get-on="!off"
        data-get-off="inactive"
        class="top-space-2x"></div>

<div class="dialog" style="overflow:hidden">
      <header>Startzeit-Endzeit</header>
      <div class="vbox">
      <div class="hbox top-narrow">
    <div style="color:#ffa30d; font-size:25px">An&nbsp;</div>
       
        <div data-type="datetimepicker" data-device="T_Zw_Stecker_01"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange  left-space right-space">
              </div>
              <div data-type="checkbox" data-device='timer_T_Zw_Stecker_01'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive">
                </div>
                </div>
               
                <div class="hbox top-narrow">
              <div style="color:#ffa30d; font-size:25px">Aus</div>
              <div data-type="datetimepicker" data-device="T_Zw_Stecker_01_aus"
              data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
              data-step="15"
              data-datepicker="false" data-format="H:i"
              class="big orange  left-space right-space"></div>
              <div data-type="checkbox" data-device='T_Zw_Stecker_01_aus'
                data-get-on="!off" data-get-off="inactive"
                data-set-on="active" data-set-off="inactive"></div>
                </div>
        </div></div></div></div>
       
        <div class="hbox items-space-around left-space-2x">
        <div class="orange2 inline">Zwischenstecker</div><div class="orange2 inline">Timer</div>
        </div>
        <div class="orange2 top-narrow"></div><hr>
</div>       
</li>

jetzt ist es so das Safari die Linien anzeigt aber zb. Chrome oder Firefox nicht mehr korrekt.

Wer hat einen Tip für mich, oder kann man das auch anders als mit <hr> lösen?

Gruß Rolf
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 24 Januar 2017, 17:54:49
Wenn ich mich jetzt nicht verguckt habe, sind
verschwunden?

Zitat von: setstate am 23 Januar 2017, 22:25:41
- mini         : 50%
- tiny          : 60%
- small        : 80%
- normal      : 100%
- large        : 125%
- big           : 150%
- bigger      : 200%
- tall           : 350%
- grande      : 600%
- gigantic     : 144px
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 24 Januar 2017, 23:50:22
Ich hoffe mal nichts überlesen zu haben - bei mir verhält sich Pagetab etwas anders:
- auf der Index-/Startseite ist wie bisher der zuständige Button aktiv
- beim Aufrufen einer anderen Seite wird der zugehörige Button aktiv - der Button der Index-/Startseite bleibt weiterhin aktiv und lässt sich nicht mehr auswählen

Wie bereits oben erwähnt fehlt auch bei mir der Warn-Kringel...

Gruß Ralf
Titel: Antw:FTUI 2.5
Beitrag von: ih-sqeezer am 25 Januar 2017, 00:05:39
Hallo,

zunächst mal möchte ich mich bei den kreativen Köpfen hier bedanken. Ihr leistet wirklich tolle Arbeit mit der Umsetzung neuer Ideen.
Ich habe gestern ebenfalls auf die v2.5 gewechselt. Ich bin jedoch wöchentlich mit Updates dabei und komme daher immer ganz gut mit ;-)
Für die neue Version musste ich ein paar Dinge nachziehen, lief aber fast alles problemlos.

Jedoch erscheinen bei mir images nicht mehr, welche vorher ohne jegliche Probleme angezeigt wurden. Mit der neuen Version erscheint nun immer nur "img".

Hier der code dazu:
<div class="top-space">
<div data-type="image"
data-size="25%"
data-url="./images/HEM_logo.jpg"
class="">
</div>
<div data-type="label"
data-device="HEM"
data-get="Super"
data-unit="€"
class="big">
</div>
</div>


Weiterhin bekomme ich ebenfalls keine Warn-Kringel mehr angezeigt :-(

Grüße,
Ingo
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 25 Januar 2017, 02:31:10
Oh je bei mir ist auch alles durcheinander.. ich weiß jetzt gar nicht mehr wo ich anfangen soll.
Alles was horizontal war wie die Abfallanzeige ist jetzt senkrecht..:! Die roten Warnmeldungen sind an allen Icons weg
Titel: Antw:FTUI 2.5
Beitrag von: alpha1974 am 25 Januar 2017, 06:35:51
Danke für das Update!

Bislang hatte ich nach diesem Beispiel  (https://wiki.fhem.de/wiki/FHEM_Tablet_UI/FAQ#Wie_baue_ich_ein_Men.C3.BC_mit_dem_Pagetab_Widget_auf.3F)ein Menu aufgebaut. In der menu.html war ein Popup-Widget definiert, das sich auch ordnungsgemäß öffnete, egal, welcher Pagetab gerade aktiviert war.

Seit dem Update ist das Menu hinter die Pagetabs verrutscht. Abhilfe nur dadurch,dass man das Popup-Widget aus menu.html entfernt. Ist das eine ungewollte oder gewollte Änderung mit dem Update?

Gruß
alpha
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 25 Januar 2017, 07:17:29
Switch mit Warn habe ich gerade bei mir getestet. Geht auf Anhieb. Da müsst ihr mir mal den Code geben (bis hoch zum Gridster-<li>)
Vielleicht liegt es an bestimmten CSS Klassen, die verbaut sind.
Titel: Antw:FTUI 2.5
Beitrag von: markukug am 25 Januar 2017, 07:31:08
Es tut mir leid, wenn ich das hier so schreiben muss, da sicher gute Absicht und eine Menge Aufwand in dem Update steckt, aber bei mir sieht alles unbrauchbar aus. Da steckt jetzt mindestens ein Tag Arbeit drin, um wieder eine halbwegs brauchbare Anzeige über Tablet UI hinzubekommen. Bis ich mir diesen Tag nehmen kann, sind alle Terminals, die ich mühsam konfiguriert habe, unbrauchbar.

In so einem Fall wäre eine Vorwarnung bzw. evtl. sogar eine eine eigene Tablet UI 2.5 ohne die bestehende Version anzugreifen, hiflreich. Das würde einem auch die zeit geben, um mit der neuen Version zu testen.

:'(
Titel: Antw:FTUI 2.5
Beitrag von: Tobias am 25 Januar 2017, 07:39:50
Zitat von: markukug am 25 Januar 2017, 07:31:08
Es tut mir leid, wenn ich das hier so schreiben muss, da sicher gute Absicht und eine Menge Aufwand in dem Update steckt, aber bei mir sieht alles unbrauchbar aus. Da steckt jetzt mindestens ein Tag Arbeit drin, um wieder eine halbwegs brauchbare Anzeige über Tablet UI hinzubekommen. Bis ich mir diesen Tag nehmen kann, sind alle Terminals, die ich mühsam konfiguriert habe, unbrauchbar.

In so einem Fall wäre eine Vorwarnung bzw. evtl. sogar eine eine eigene Tablet UI 2.5 ohne die bestehende Version anzugreifen, hiflreich. Das würde einem auch die zeit geben, um mit der neuen Version zu testen.

:'(
Hi setstate, da wäre es besser wenn du in deinem Repo für jede Revision einen eigenen Zweig anlegst. So kann jeder USer selbst entscheiden, wann er sein TabletUI auf eine neue Version umbiegt. Einfach die controls.txt anpassen - ein update - und schon hat man auf die neue Version umgestellt
Titel: Antw:FTUI 2.5
Beitrag von: fhainz am 25 Januar 2017, 07:50:59
Oder einfach die datein aus dem backup zurückspielen?
Titel: Antw:FTUI 2.5
Beitrag von: eazy_isi am 25 Januar 2017, 07:52:10
Hatte dasselbe Problem mit dem Abfallkalender,
so funkioniert es jetzt wieder, horizontal und mit Warnkreisen

<li class="semitransparent3d" data-row="7" data-col="1" data-sizex="6" data-sizey="2">
<header class="semitransparentheader">Abfall</header>
<div class="cell">
<div data-type="symbol"
data-background-icon="fa-circle-thin"
data-device="myAbfall"
data-get="Restmuellgefaess_tage"
data-off-color="#000000"
data-fhem-cmd="setreading myAbfall Restmuellgefaess_tage off"
data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
data-icons='["fa-trash warn","fa-trash warn fa-spin","fa-trahs warn blink","fa-trash warn"]'
data-on-colors='["#000000","#000000","#000000","#000000"]'
class="big">
</div>
<div data-type="symbol"
data-background-icon="fa-circle-thin"
data-device="myAbfall"
data-get="GelberSack_tage"
data-off-color="yellow"
data-fhem-cmd="setreading myAbfall GelberSack_tage off"
data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn blink","fs-bag warn"]'
data-on-colors='["gold","gold","gold","gold"]'
class="big">
</div>
<div data-type="symbol"
data-background-icon="fa-circle-thin"
data-device="myAbfall"
data-get="Papiertonne_tage"
data-off-color="#0088CC"
data-fhem-cmd="setreading myAbfall Papiertonne_tage off"
data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
data-icons='["fa-trash warn","fa-trash warn fa-spin","fa-trahs warn blink","fa-trash warn"]'
data-on-colors='["#0088CC","#0088CC","#0088CC","#0088CC"]'
class="big">
</div>
<div data-type="symbol"
data-background-icon="fa-circle-thin"
data-device="myAbfall"
data-get="Gruengutbuendelsammlung_tage"
data-off-color="#00cc0a"
data-fhem-cmd="setreading myAbfall Gruengutbuendelsammlung_tage off"
data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn blink","fs-bag warn"]'
data-on-colors='["#00cc0a","#00cc0a","#00cc0a","#00cc0a"]'
class="big">
</div>
</div>
</li>



Zitat von: moonsorrox am 25 Januar 2017, 02:31:10
Oh je bei mir ist auch alles durcheinander.. ich weiß jetzt gar nicht mehr wo ich anfangen soll.
Alles was horizontal war wie die Abfallanzeige ist jetzt senkrecht..:! Die roten Warnmeldungen sind an allen Icons weg
Titel: Antw:FTUI 2.5
Beitrag von: gloob am 25 Januar 2017, 07:59:12
Zitat von: eazy_isi am 25 Januar 2017, 07:52:10
Hatte dasselbe Problem mit dem Abfallkalender,
so funkioniert es jetzt wieder, horizontal und mit Warnkreisen

<li class="semitransparent3d" data-row="7" data-col="1" data-sizex="6" data-sizey="2">
               <header class="semitransparentheader">Abfall</header>
               <div class="cell">
                  <div data-type="symbol"
                      data-background-icon="fa-circle-thin"
                      data-device="myAbfall"
                      data-get="Restmuellgefaess_tage"
                      data-off-color="#000000"
                      data-fhem-cmd="setreading myAbfall Restmuellgefaess_tage off"
                      data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
                      data-icons='["fa-trash warn","fa-trash warn fa-spin","fa-trahs warn blink","fa-trash warn"]'
                      data-on-colors='["#000000","#000000","#000000","#000000"]'
                      class="big">
                  <>
                  <div data-type="symbol"
                      data-background-icon="fa-circle-thin"
                      data-device="myAbfall"
                      data-get="GelberSack_tage"
                      data-off-color="yellow"
                      data-fhem-cmd="setreading myAbfall GelberSack_tage off"
                      data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
                      data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn blink","fs-bag warn"]'
                      data-on-colors='["gold","gold","gold","gold"]'
                      class="big">
                  <>
                  <div data-type="symbol"
                      data-background-icon="fa-circle-thin"
                      data-device="myAbfall"
                      data-get="Papiertonne_tage"
                      data-off-color="#0088CC"
                      data-fhem-cmd="setreading myAbfall Papiertonne_tage off"
                      data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
                      data-icons='["fa-trash warn","fa-trash warn fa-spin","fa-trahs warn blink","fa-trash warn"]'
                      data-on-colors='["#0088CC","#0088CC","#0088CC","#0088CC"]'
                      class="big">
                  <>
                  <div data-type="symbol"
                      data-background-icon="fa-circle-thin"
                      data-device="myAbfall"
                      data-get="Gruengutbuendelsammlung_tage"
                      data-off-color="#00cc0a"
                      data-fhem-cmd="setreading myAbfall Gruengutbuendelsammlung_tage off"
                      data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
                      data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn blink","fs-bag warn"]'
                      data-on-colors='["#00cc0a","#00cc0a","#00cc0a","#00cc0a"]'
                      class="big">
                  <>
               <>
                        </li>


Was musstest du denn ändern, damit es wieder geht?


Ich habe meine so definiert:



<li data-row="1" data-col="1" data-sizex="4" data-sizey="2" class="semitransparent">
<div class="hbox items-space-around">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="large"/>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_GelberSack" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-recycle warn","fa-recycle warn blink","fa-recycle warn"]' data-on-colors='["gold", "gold", "gold"]' class="large"/>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_Biomuell" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["green","green","green"]' class="large"/>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_Papier" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["blue","blue","blue"]' class="large"/>
<>
</li>



und bekomme keine Kreise mit den Resttagen.
Titel: Antw:FTUI 2.5
Beitrag von: markukug am 25 Januar 2017, 08:45:46
Zitat von: fhainz am 25 Januar 2017, 07:50:59
Oder einfach die datein aus dem backup zurückspielen?

Danke, das habe ich jetzt auch gemacht und alles sieht wieder aus wie früher. Trotzdem wäre es super, wenn man eine Testumgebung mit der neuen Version haben könnte, um das Layout zu testen und aufzusetzen.

Die neue Version scheint ja sehr durchdacht und nach der Umstellung auch einfacher zu administrieren.
Titel: Antw:FTUI 2.5
Beitrag von: eazy_isi am 25 Januar 2017, 10:35:14
Scheint nichts mit meiner Änderung zu tun zu haben,
da deine Code geändert auf meine Devices bei mir problemlos läuft.
Allerdings verwende ich das Modul Abfall für die Abholtermine und so wie ich das sehe
befüllst du über die 99_MyUtils.pm einen Dummy oder ?
Evtl. liegt hier das Problem ?

Zitat von: gloob am 25 Januar 2017, 07:59:12
Was musstest du denn ändern, damit es wieder geht?


Ich habe meine so definiert:



<li data-row="1" data-col="1" data-sizex="4" data-sizey="2" class="semitransparent">
<div class="hbox items-space-around">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="large"/>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_GelberSack" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-recycle warn","fa-recycle warn blink","fa-recycle warn"]' data-on-colors='["gold", "gold", "gold"]' class="large"/>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_Biomuell" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["green","green","green"]' class="large"/>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="abfall_Papier" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["blue","blue","blue"]' class="large"/>
<>
</li>



und bekomme keine Kreise mit den Resttagen.
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 25 Januar 2017, 10:43:48
ich muss jetzt hier mal fragen..!
1. wird es bei jedem Update diese Probleme geben, dass alles durcheinander gewürfelt wird..?
2. wo sehe ich welche Grundkonfiguration eigentlich gebraucht wird..? damit meine ich welche css Dateien (außer meiner eigenen) zwingend da sein müssen..?

Ich bekomme sonst gar nichts geregelt, da ich momentan nicht weiß wo ich anfangen soll, mein Layout wieder zu ordnen.
Da ich nun noch absolut am Anfang bin, werde ich jetzt aber mit der 2.5 arbeiten und komplett Neu anfangen, deshalb also die Frage 2.

Die index habe ich vorerst mal so genommen wie hier beschrieben... diese sieht nun so aus, da ist jetzt nichts falsch dran, oder..?
<!DOCTYPE html>
<html>
<head>
<title>FHEM-Tablet-UI</title>
<meta name="widget_base_width" content="82">
<meta name="widget_base_height" content="71">
<meta name="widget_margin" content="4">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<link rel="icon" href="favicon.ico" type="image/x-icon" />

    <!-- define your personal style here, it wont be overwritten  -->
    <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
    <script src="js/fhem-tablet-ui.js" defer></script>
</head>
<body>

<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="Tab_menu.html" class="halbTransparent"></li>

</ul>
</div>
</body>
</html>


Was ich noch feststellen muss das es mit der Größenanpassung der Seite nicht mehr hinhaut, diese ist etwas größer geworden und das kann ich leider auch nicht mehr mit den widget_base_xxx Angaben hin bekommen...

Deshalb also nun der komplette Neu Anfang... :-\
Titel: Antw:FTUI 2.5
Beitrag von: cotecmania am 25 Januar 2017, 11:05:30
Hallo,

als negative Auswirkung finde ich, dass beim Laden der Seite zu Beginn ein weisser Hintergrund mit schwarzen Texten ziemlich lange dargestellt wird.
Erst spät erscheint die eigentliche Formatierung und Farbgebung.
Das war seither nicht so und finde ich sehr negativ, wenn Seiten länger brauchen zum Laden.

Gruss
Titel: Antw:FTUI 2.5
Beitrag von: klausw am 25 Januar 2017, 12:28:16
Bei mir läuft FTUI auf einem Apache Server
Es werden 2 FHEM Instanzen bedient
Die Unterseiten der jeweiligen Instanz sind in separaten Unterverzeichnissen abgelegt.

wwwroot
|___ ftui
|___ pgm2
|___ tablet
| |___ css
| |___ fonts
| |___ js
| |___ lib
|___ index.php
|___ indexinstanz2.php
|___ sub1
| |___ sub1.html
| |___ sub2.php
|___ sub2
|___ sub1.php
|___ sub2.html


Ich muss im Header nach wie vor die Zeile
<script src="pgm2/jquery.min.js" defer></script>
Da diese Datei sonst nicht gefunden wird.
Wo müsste sie abgelegt sein, das es ohne funktioniert?
      

Dann habe ich noch eine Frage zum Slider.
Seit dem Update auf 2.5 hat sich an der Höhe was geändert. Die Section ist kleiner als der Slider (siehe Anhang)

Quelltext:
<!DOCTYPE html>
<html>
<head></head>
<body>
<div class="page" id="content2">
<section>
<div class="large col-1-2 left-align">Bild</div>
<div data-type="switch" data-device="Bild" class="thin col-1-2 right-align"></div>
</section>
<section>
<div class="center">
<div class="large col-1-2 left-align">Regal</div>
<div data-type="slider" data-device='Regal' data-max="100" class="col-1-2 horizontal value" ></div>
</div>
</section>
<section>
<div class="large col-1-2 left-align">Regal</div>
<div data-type="slider" data-device='Regal' data-max="100" class="col-1-2 horizontal value" ></div>
</section>
<section>
<div class="large col-1-2 left-align">Sofaregal</div>
<div data-type="switch" data-device="Sofaregal" class="thin col-1-2 right-align"></div>
</section>
<section>
<div data-type="label" data-device="FBDECT_16" data-get="alias" class="large col-1-2 left-align">FBDECT_16</div>
<div data-type="switch" data-device="FBDECT_16" class="thin col-1-2 right-align"></div>
</section>
</div>
</body>
</html>

Titel: Antw:FTUI 2.5
Beitrag von: setstate am 25 Januar 2017, 12:51:04
Bei Slider kann man jetzt mit data-margin die benutzte Höhe flexibel ändern.
Titel: Antw:FTUI 2.5
Beitrag von: rvideobaer am 25 Januar 2017, 13:05:16
Hallo,

Es sind ja jetz einige Schriftgrössen geändert worden, wobei die sehr große n gleichzeitig auch als Thin formatiert werden. Könnte man nicht alle normal lassen, und thin als zusätzliches Attribut nehmen?

Gruß Rolf
Titel: Antw:FTUI 2.5
Beitrag von: klausw am 25 Januar 2017, 13:07:45
Zitat von: setstate am 25 Januar 2017, 12:51:04
Bei Slider kann man jetzt mit data-margin die benutzte Höhe flexibel ändern.

super, danke das klappt schonmal

Aber die Horizontale Ausrichtung ist immer noch nicht gegeben  :o

<section>
<div class="center">
<div class="large col-1-2 left-align">Regal</div>
<div data-type="slider" data-device='Regal' data-max="100" data-margin="20px" class="col-1-2 horizontal value" ></div>
</div>
</section>
<section>
<div class="large col-1-2 left-align">Regal</div>
<div data-type="slider" data-device='Regal' data-max="100" data-margin="20px" class="col-1-2 horizontal value" ></div>
</section>
Titel: Antw:FTUI 2.5
Beitrag von: cotecmania am 25 Januar 2017, 14:02:24
Wie kann man die Zeilenabstaende in einem sheet>row>cell verkleinern ?
padding-bottom hat nicht funktioniert ...

<li data-row="2" data-col="7" data-sizex="1" data-sizey="1">
  <header>SONNE</header>
  <div class="sheet" style="padding-left:3px;padding-right:8px">
    <div class="row">
      <div class="cell left-align tiny" data-type="symbol" data-icon="oa-weather_sunrise" data-off-color="yellow"></div>
      <div class="cell right-align" data-type="label" data-device="D_Sonnenaufgang" data-get="STATE" ></div>
    </div>
    <div class="row">
      <div class="cell left-align tiny" data-type="symbol" data-icon="oa-weather_sunset" data-off-color="red"></div>
      <div class="cell right-align" data-type="label" data-device="D_Sonnenuntergang" data-get="STATE"></div>
    </div>
    <div class="row">
      <div class="cell left-align tiny" data-type="symbol" data-icon="oa-fts_shutter_30" data-off-color="white"></div>
      <div class="cell right-align" data-type="label" data-device="DI_Rolladen" data-get="timer_03_c02" data-part="2"></div>
    </div>
  </div>
</li>
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 25 Januar 2017, 14:10:19
ich habe mir irgendwie alles zerlegt, bei mir lädt er jetzt nichts mehr noch nicht mal mehr meine index.html.

Es gibt wohl einige Probleme, ich habe den FTUI Bereich mal komplett neu installiert somit ist in /tablet alles neu.
Nun habe ich meine Dateien wieder eingespielt, aber ich bekomme nicht mal die index.html geladen

Meine Seite kommt nur wenn ich die index.html auch mit angebe..!  :-\

Ich muss also zwingend es so eingeben sonst kommt nichts
http://10.0.0.50:8083/fhem/ftui/

Jetzt meine Fragen:

1. Wie muss die TABLETUI aussehen..?
das habe ich im DEF
ftui/ ./www/tablet/ Tablet-UI


Edit:// habe ich mittlerweile gefunden aus der index-example.html
2. Frage
Wie muss im <head></head> Bereich eine vernünftige index.html aussehen..?
Titel: Antw:FTUI 2.5
Beitrag von: grossmaggul am 25 Januar 2017, 15:14:05
ZitatJedoch erscheinen bei mir images nicht mehr,
Ja, hier selbes Problem, Bilder die über einen lokalen Pfad geladen werden sollen, werden nicht angezeigt, Bilder die über eine URL geladen werden sind nicht betroffen.

Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 25 Januar 2017, 16:54:53
also meine lokalen Bilder werden angezeigt:

<div data-type="image"
           data-size="60px"
           data-url="./images/sleep.jpg"
           data-fhem-cmd='set sz_lampe on; set rollo_sz pct 25'
           onclick='ftui.toast("set sz_lampe on; set rollo_sz pct 25")'
           class="" >
</div>
Titel: Antw:FTUI 2.5
Beitrag von: grossmaggul am 25 Januar 2017, 17:20:36
Bei mir nicht, obwohl ich das genauso habe wie Du.
Wenn ich mir die Bild URL kopiere, sieht die so aus: http://xxx.xxx.xxx.xxx:8083/fhem/ftui/images/guest_wifi_config1.png?_=1485360984048
Wenn ich die mit einem Browser aufrufe, kommt ein "File not found", mache ich die "?_=1485360984048" weg, dann wird mir das Bild im Browser angezeigt, wer oder was hängt da die Zahl dran?
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 25 Januar 2017, 18:44:21
Zitat von: reb am 24 Januar 2017, 23:50:22
Wie bereits oben erwähnt fehlt auch bei mir der Warn-Kringel...

Habe gerade etwas probiert und jetzt geht auch der Warn-Kringel wieder - vorher:
<li data-row="2" data-col="1" data-sizex="4" data-sizey="1">
    <header><div class="large orange">RESTM&Uuml;LL</div></header>
    <div class="sheet">
        <div class="row">
            <div class="col-1-4 bigger"
                data-type="symbol"
                data-device="sys_var_Muelltermine"
                data-get="daysRestAbfall"
                data-icons='["fs-dustbin warn fa-spin bold","fs-dustbin warn bold"]'
                data-on-colors='["darkgrey","darkgrey"]'
                data-get-on='["0","1"]'
                data-on-background-color="#505050"
                data-background-icon="">
            </div>
            <div class="col-3-4 bigger bold"
                data-type="label"
                data-device="sys_var_Muelltermine"
                data-get="hintRestAbfall"
                data-color="sys_var_Muelltermine:colorRestAbfall">
            </div>
        </div>
    </div>
</li>

und hinterher:
<li data-row="2" data-col="1" data-sizex="4" data-sizey="1">
    <header><div class="large orange">RESTM&Uuml;LL</div></header>
    <div class="sheet">
        <div class="row">
            <div class="col-1-4 bigger"
                data-type="symbol"
                data-device="sys_var_Muelltermine"
                data-get="daysRestAbfall"
                data-warn="daysRestAbfall"
                data-icons='["fs-dustbin warn fa-spin bold","fs-dustbin warn bold"]'
                data-on-colors='["darkgrey","darkgrey"]'
                data-get-on='["0","1"]'
                data-on-background-color="#505050"
                data-background-icon="">
            </div>
            <div class="col-3-4 bigger bold"
                data-type="label"
                data-device="sys_var_Muelltermine"
                data-get="hintRestAbfall"
                data-color="sys_var_Muelltermine:colorRestAbfall">
            </div>
        </div>
    </div>
</li>


Bei mir hat es gereicht zusätzlich das Attribute data-warn="daysRestAbfall" einzufügen. Wurde vorher ggf. automatisch data-get verwendet, wenn data-warn nicht definiert war?

Gruß Ralf
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 25 Januar 2017, 19:05:10
Zitat von: reb am 25 Januar 2017, 18:44:21
Bei mir hat es gereicht zusätzlich das Attribute data-warn="daysRestAbfall" einzufügen. Wurde vorher ggf. automatisch data-get verwendet, wenn data-warn nicht definiert war?

Etwas zu schnell geschossen: mit data-warn="daysRestAbfall" ist der Warn-Kringel immer da. 'warn' hat weiter keine Funktion...

Ralf
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 25 Januar 2017, 19:10:22
ich habe nach wie vor keine Warnkringel... aber das ist ja nicht das einzige. Ich kämpfe nach wie vor mit allen Anzeigen alles ist verrutscht

bei mir sieht es so aus bei den Abfall Symbolen:
<div class="cell"
data-type="symbol"
data-device="myAbfall"
data-get-warn="(\d+)"
data-get="Restmuell_tage"
data-icons='["fs-dustbin warn","fs-dustbin warn fa-spin","fs-dustbin warn"]'
data-on-colors='["#778899","#778899","#778899"]'
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]'
data-on-background-color="#7A7A7A"
data-off-background-color="#A6BF17"
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A"
class="top-space">
</div>


ich habe jetzt keinen Bock... mehr es nervt einfach nur zumal ich nicht mehr durchsehe  :-\ :-\
Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 25 Januar 2017, 19:16:29
Zitat von: grossmaggul am 25 Januar 2017, 17:20:36
Bei mir nicht, obwohl ich das genauso habe wie Du.
Wenn ich mir die Bild URL kopiere, sieht die so aus: http://xxx.xxx.xxx.xxx:8083/fhem/ftui/images/guest_wifi_config1.png?_=1485360984048
Wenn ich die mit einem Browser aufrufe, kommt ein "File not found", mache ich die "?_=1485360984048" weg, dann wird mir das Bild im Browser angezeigt, wer oder was hängt da die Zahl dran?

Ist die link Angabe auch indirekt?
Habe bei mir festgestellt wenn ich die direkt anwähle funktioniert es auch nicht.
Titel: Antw:FTUI 2.5
Beitrag von: olindner am 25 Januar 2017, 19:29:21
@SamNitro ... habe bei image-url erstmal den absoluten path genommen, bei mir so data-url="/fhem/tablet/images/hem.pngdann hat es erstmal funktioniert, bei relativen path bin ich auch gescheitert!

@moonsorrox ... versuche es mal so <div class="cell"
data-type="symbol"
data-device="myAbfall"
data-warn="Restmuell_tage"
data-icons='["fs-dustbin warn","fs-dustbin warn fa-spin","fs-dustbin warn"]'
data-on-colors='["#778899","#778899","#778899"]'
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]'
data-on-background-color="#7A7A7A"
data-off-background-color="#A6BF17"
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A"
class="top-space">
</div>
vg Olaf
Titel: Antw:FTUI 2.5
Beitrag von: grossmaggul am 25 Januar 2017, 19:40:34
ZitatIst die link Angabe auch indirekt?
Was meinst Du mit indirekt.

Ich habe jetzt auch mal den absoluten Pfad genommen, damit geht's, relativer Pfad geht nicht.
Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 25 Januar 2017, 20:08:31
Zitat von: grossmaggul am 25 Januar 2017, 19:40:34
Was meinst Du mit indirekt.

Ich habe jetzt auch mal den absoluten Pfad genommen, damit geht's, relativer Pfad geht nicht.

absoluter Pfad: domainname/bilder/beispiel
relativer Pfad: ./bilder/beispiel

mit indirekt meinte ich relativ...
Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 25 Januar 2017, 20:19:13
Warn Kringel läuft bei mir hiermit:

<div data-type="button"
    data-url="status.html"
    data-device="Update.Counter"
    data-get="ALL"
    data-background-icon="fs-system_fhem"
    data-on-background-color="#505050"
    data-off-background-color="#505050"
    data-icon="warn"
    class="readonly warn">
</div>
Titel: Antw:FTUI 2.5
Beitrag von: eazy_isi am 25 Januar 2017, 20:42:24
Bei mir läuft der Warnkringel
<div data-type="button"
data-background-icon="none"
data-device="myAbfall"
data-warn="GelberSack_tage"
data-off-color="yellow"
data-fhem-cmd="setreading myAbfall GelberSack_tage off"
data-get-on='["off","0","1","[2-9]{1}|[0-9]{2}"]'
data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn blink","fs-bag warn"]'
data-on-colors='["gold","gold","gold","gold"]'
class="big">
</div>

und so
<div data-type="symbol"
data-background-icon="none"
data-device="myAbfall"
data-get="Papiertonne_tage"
data-icon="warn"
class="readonly warn">
</div>


Anzeige Abfall korrigieren von vertikal auf hoizontal:

<div class="cell">  ändern auf <div class="hbox narrow">
Titel: Antw:FTUI 2.5
Beitrag von: octek0815 am 25 Januar 2017, 21:03:59
Hallo,

mit dem 2.5 Update geht meine Verschachtelung von push und symbol auch nicht mehr richtig.
<div data-type="push"
data-set-on="-"
data-icon=""
data-device="dFTUIdummy"
data-warn="dFenster_Gesamtstatus:openWindowsCount"
style="font-size:160%; margin-top:3px; margin-right:-8px"
class="thin">
<div data-type="symbol"
data-device="dFenster_Gesamtstatus"
data-get-on='["closed","open"]'
data-icons='["oa-fts_window_1w","oa-fts_window_1w blink"]'
data-on-colors='["lightgrey","#FF0101"]'
class="thin"></div>
                </div>


Beim Refresh der Seite sieht es mal richtig aus und mal verschoben...

Grüße
Olli
Titel: Antw:FTUI 2.5
Beitrag von: scooty am 25 Januar 2017, 22:27:53
Danke für den Hinweis zu data-warn, um den "Kringel" wieder zu bekommen.

Hat jemand ggf. auch noch einen Hinweis, warum bei einem symbol Widget das data-hide nicht mehr funktioniert?

<div data-type="symbol"
data-device="WETTER_Regen"
data-get-on="ja"
data-get-off="nein"
data-on-color="green"
data-icon="oa-weather_rain blink"
data-hide="nein"
class="tall">
</div>

"WETTER_Regen" ist bei mir ein Dummy mit dem state/STATE "nein", das Icon dürfte also nicht auf der FTUI Oberfläche erscheinen, tut es aber leider doch.

Vielen Dank für jeglichen Hinweis,
Andreas
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 25 Januar 2017, 22:44:10
Das Problem mit dem Warn-Symbol habe ich gefixed.

Noch kurze Erklärung zu Benutzung

Entweder man benutzt die Warn-Klasse im Icon-Status-Array. Damit erfolgt die Anzeige einfach über das data-get Reading und den data-get-on (bzw. data-states) Vergleich.


<div data-type="symbol" data-device="ftuitest" data-get="STATE" data-icons='["fa-trash warn fa-spin","fa-trash warn","fa-trash"]' data-on-colors='["red","yellow","#333333"]' data-get-on='["(0|1)","(2|3|4|5|6)","(7|8|9|10|11|12|13|14|15|16|17|18|19|20|21|22|23|24|25|26|27|28|29|30|31)"]' class="big inline">



Oder man schaltet das Warn-Symbol über ein data-warn Reading direkt zu. Mit data-warn-on und data-warn-off stellt man ein, wann es angezeigt wird bzw. verschwindet. default für data-warn-on ist 'true|on|[1-9]{1}[0-9]*'). Für data-warn-off ist der default 'false|off|0'

<div data-type="symbol" data-device="ftuitest" data-get="STATE" data-warn="countWarnings" data-icon="fa-trash" data-on-colors="yellow" data-get-on="(0|1)" >

Aber nicht beides gemixt. Also warn zu den Icons oder als data-warn.
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 26 Januar 2017, 00:28:44
Gibt es mittlerweile aktuellere Examples auf Github?

https://github.com/knowthelist/fhem-tablet-ui/tree/master/examples (https://github.com/knowthelist/fhem-tablet-ui/tree/master/examples)

Oder auf welcher Basis soll eine neue Seite erstellt werden?
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 26 Januar 2017, 01:53:31
Zitat von: octek0815 am 25 Januar 2017, 21:03:59

mit dem 2.5 Update geht meine Verschachtelung von push und symbol auch nicht mehr richtig.


Die Verschachteln wäre jetzt mehr nötig. Push kann jetzt auch auf Inputs reagieren. Also data-get und data-get-on an Push anfügen.

Die Vertchachtlung passt aber auch wieder, wenn man class="mini" an das Symbol setzt.
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 26 Januar 2017, 02:03:52
@setstate

also ich bin hier echt am verzweifeln, ich bin dabei mein Layout wieder etwas anzupassen was mir rein von der Formatierung per css so gar nicht gelingt. (ich möchte aber die aktuelle Version 2.5 nutzen)
Ich habe hier mal ein Beispiel evtl. kannst du mal drauf schauen, ich weiß sonst nicht wie ich weiter machen soll.
Es sind die 4 Abfallarten die ich bisher nebeneinander abgebildet hatte mit den entsprechenden Warnicons.

Was ich bisher geschafft habe, ist diese wieder nebeneinander darzustellen..! Ist das alles richtig was ich mir da gebaut habe, oder ist das jetzt nur ein Zufall das es wieder von der Ansicht passt.?

Was gar nicht geht ist, das mit den Warnicons - auch mit deinen beiden Varianten aus #54 die ich ausprobiert habe kommt kein WarnIcon..!
Oder muss ich dazu ein Update machen.?

Dieser Code ist einem kleinem Fenster welches mir eben nur den Abfall darstellt ohne jegliche Schrift dazu, ein sogenanntes Statusfenster welches ich an jeder Stelle auf meiner Seite einsetzen könnte

<div class="sheet">
<div class="row">
<div class="cell normal" 
data-type="symbol"
data-device="myAbfall"
data-get-warn="(\d+)"
data-get="Restmuell_tage"
data-icons='["fs-dustbin warn","fs-dustbin warn fa-spin","fs-dustbin warn"]'
data-on-colors='["#778899","#778899","#778899"]'
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]'
data-on-background-color="#7A7A7A"
data-off-background-color="#A6BF17"
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A">
</div>

<div class="cell normal"
data-type="symbol"
data-device="myAbfall"
data-get-warn="(\d+)"
data-get="GelberSackLeichtverpackungen_tage"
data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn"]'
data-on-colors='["yellow","yellow","yellow"]'
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]'
data-on-background-color="#7A7A7A"
data-off-background-color="#A6BF17"
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A">
</div>
   
<div class="cell normal"
data-type="symbol"
        data-device="myAbfall"
data-get-warn="(\d+)"
        data-get="PapierAbfall_tage"
        data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn"]'
        data-on-colors='["royalblue","royalblue","royalblue"]'
        data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]'
data-on-background-color="#7A7A7A"
data-off-background-color="#A6BF17"
data-background-icon="fa-circle-thin"
data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A">
</div>
   
<div class="cell normal"
data-type="symbol"
        data-device="myAbfall"
data-get-warn="(\d+)"
        data-get="BioabfallGruengut_tage"
        data-icons='["fs-bag warn","fs-bag warn fa-spin","fs-bag warn"]'
        data-on-colors='["limegreen","limegreen","limegreen"]'
        data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]'
data-on-background-color="#7A7A7A"
data-off-background-color="#A6BF17"
data-background-icon="fa-circle-thin"
        data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A">
</div>
    </div>
</div>
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 26 Januar 2017, 02:14:34
Zitat von: scooty am 25 Januar 2017, 22:27:53

Hat jemand ggf. auch noch einen Hinweis, warum bei einem symbol Widget das data-hide nicht mehr funktioniert?

<div data-type="symbol"
data-device="WETTER_Regen"
data-get-on="ja"
data-get-off="nein"
data-on-color="green"
data-icon="oa-weather_rain blink"
data-hide="nein"
class="tall">
</div>



Mit data-hide-on="nein" geht es.
data-hide zeigt auf das Reading, anhand dessen versteckt wird. data-hide-off und data-hide-on sind die Werte, auf die reagiert werden.

Das ist jetzt einheitlich zu lock, reachable und warn
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 26 Januar 2017, 02:33:36
so nach einem Update werden jetzt erst einmal wieder die Warnicons angezeigt...!
Eine Baustelle beseitigt...! Morgen gehts weiter, jetzt geht nix mehr  :-\
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 26 Januar 2017, 02:43:08
@moonsorrox: Die Darstellung sieht doch gut aus. Wenn es bei dir passt, ist das so okay.

Warn sollte nach einem Update wieder funktionieren
Titel: Antw:FTUI 2.5
Beitrag von: scooty am 26 Januar 2017, 07:50:07
Zitat von: setstate am 26 Januar 2017, 02:14:34
Mit data-hide-on="nein" geht es.
data-hide zeigt auf das Reading, anhand dessen versteckt wird. data-hide-off und data-hide-on sind die Werte, auf die reagiert werden.

Das ist jetzt einheitlich zu lock, reachable und warn
Danke für den Hinweis, ist ja auch wirklich logisch und durchgängig, aber man muss erst einmal darauf kommen.
;)
Vielen Dank,
Andreas
Titel: Antw:FTUI 2.5
Beitrag von: torte am 26 Januar 2017, 11:08:14
Hallo,

hab jetzt auch ein Problem mit einem ICONset welches ich so einbinde:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css" />

Genutzt hab ich die ICONs dann z.b im PUSH Widget
div data-type="push" data-device="Gong.Kids" data-set-on="on" data-icon="zmdi zmdi-notifications-active zmdi-hc-2x" data-background-icon="none" class="inline"></div>

Mit 2.4 sah es so aus wie im ersten Bild. Mit 2.5 bekomme ich jetzt ein ganz anderes Symbol. Irgendwie drängen sich die FontAwesome davor. Wenn ich im Seitenquellcode in der Class des PUSH Widget das "FA" entferne dann wird wieder das richtige Symbol angezeigt. Wie kann ich das aber jetzt richtig lösen?

Grüße
Torte
Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 26 Januar 2017, 11:56:50
Ich finde es total toll, wie FTUI sich in weiter entwickelt hat und bin ein großer Fan. Allerdings würde ich mir wünschen, dass auch die Doku der Widgets weiterhin genau gepflegt wird. Es ist schwer mit dem ganzen updates hinterher zu kommen und auch das richtige zu finden. Das Wiki ist inzwischen sehr inaktuell und die Githubseite hilft leider auch nicht immer. @setstate es wäre daher toll, wenn du in nächster Zeit mal dort mehr Zeit investierst. Das könnte uns allen helfen. Insbesondere die Demoseite sollte viele Beispiel haben, da es hier am ehesten klar wird das FTUI überhaupt alles tolles kann.

Ansonsten bin ich sehr begeistert und finde, dass es ein super Frontend ist :)
Titel: Antw:FTUI 2.5
Beitrag von: Dummbatz am 26 Januar 2017, 12:14:19
Moin Moin,

Ich kann mich meinen Vorrednern nur anschließen.

Tolle Software und Riesen Respekt vor Deiner Arbeit @Setstate.

Wie kann ich eigentlich feststellen welche Version ich am laufen habe ??

Ich frage deshalb weil einige ja geklagt hatten das es Probleme mit dem Abfall Modul gab.

Ich hatte keins, alles läuft so wie immer aber ich bin noch bei den Basics, habe also noch nicht so viel am laufen.

Evtl. habe ich die Version 2.5 ja noch gar nicht ^^

Und es wäre wirklich Super wenn die Wiki mal nachgeführt werden könnte.

Vielen Dank und weiter so.

Grüße

Dummbatz

PS so mal als Überlegung wegen der Versionen.

evtl. wäre es ja möglich die Versionsnummer im Pfad mit einzubauen ??





Titel: Antw:FTUI 2.5
Beitrag von: zap am 26 Januar 2017, 12:18:00
Ich bin schon lange dazu übergegangen, wenn irgendwie möglich eigene CSS Klassen zu verwenden. Das vermeidet Frust beim nächsten Update. Diesmal ist es allerdings besonders schlimm mit den Änderungen.

Doku: ich schaue mir den Sourcecode der Widgets an um raus zubekommen, welche Attribute es gibt. Wiki und GitHub sind veraltet.

Bin mit der Situation bei TabletUI nicht wirklich zufrieden.

Auch von mir der Wunsch: erst mal keine neuen Features. Doku und Beispiele aktualisieren
Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 26 Januar 2017, 12:20:05
Wiki sehe ich nicht als Pflicht beim Maintainer. Dieser sollte sich auf eine Quelle konzentrieren in diesem Fall das Github. Das Wiki kann dann von dort die Dinge übernehmen. Ich bin selbst im Wiki aktiv und es ist aktuell sehr schwer den Wiki Artikel auf Aktualität zu bringen, weil die Informationen alle im Forum verstreut sind bisher leider nicht gebündelt.
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 26 Januar 2017, 12:34:26
Zitat von: Dummbatz am 26 Januar 2017, 12:14:19
Wie kann ich eigentlich feststellen welche Version ich am laufen habe ??

ich habe z.B. in der aktuellen index-example.html gesehen das in dem auskommentierten die 2.5 drin steht, schau mal in diese Datei die kommt ja mit dem Update jedesmal Neu
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 26 Januar 2017, 12:57:58
Zitat von: Amenophis86 am 26 Januar 2017, 11:56:50
die Githubseite hilft leider auch nicht immer. @setstate es wäre daher toll, wenn du in nächster Zeit mal dort mehr Zeit investierst.
meinst du diese hier..?
https://github.com/knowthelist/fhem-tablet-ui/blob/master/README.md#donation
Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 26 Januar 2017, 13:25:54
Ja, hier ist schon vieles aufgelistet aber habe in letzter Zeit auch nicht immer alles gefunden was ich gesucht hatte, daher schien es mir teilweise inaktuell. Besonders gut finde ich die Seite mit den Beispiel Widgets, aber auch hier sind leider nicht alle drinnen. Gerade für Neue sind die Beispiel Widgets recht gut, da man manchmal keine Vorstellung hat, wie das Widget wirklich aufgebaut ist bzw. was es kann.
Titel: Antw:FTUI 2.5
Beitrag von: fhem-challenge am 26 Januar 2017, 14:31:46
Großer Aufwand, aber nun ja ... es ist nun geschafft und 8 Stunden weiter (durcharbeiten meiner 131 Seiten) sieht FTUI wieder so aus wie vorher.


Ein Problem habe ich noch:

Es werden eine ganze Reihe ICONS nach dem Update vom 23.1 nicht mehr angezeigt. An den IconFonts gab es keine Änderungen.


Auszug aus meiner index.html
<!-- Font Icons -->
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fm-fonts.css" />
<link rel="stylesheet" href="/fhem/tablet/customfonts/fhem.fonts/style.css" />


Nicht angezeigt werden  bei mir u.A. :

fm-exit
fm-camera   
fm-tv
fm-printer

Was kann das sein ?

Viele Grüße!

Andreas
Titel: Antw:FTUI 2.5
Beitrag von: grossmaggul am 26 Januar 2017, 14:49:10
Zitatdurcharbeiten meiner 131 Seiten
Respekt, da bekommt der Nickname fhem-challenge eine ganz besondere Bedeutung.;-D

SCNR
Titel: Antw:FTUI 2.5
Beitrag von: fhem-challenge am 26 Januar 2017, 14:56:50
Zitat von: grossmaggul am 26 Januar 2017, 14:49:10
Respekt, da bekommt der Nickname fhem-challenge eine ganz besondere Bedeutung.;-D

SCNR

So ist es und dank "RegEx" und "sed" geht Einiges dann automatisiert.
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 26 Januar 2017, 15:12:03
Tja da sind wir wohl alle am kämpfen...! :-\ Aber es lohnt sich ja...!

Ich habe auch ein Problem mit der Anzeige der Icons.
Hier werden die verpassten Anrufe gezählt und lassen sich dann auch löschen, das funktioniert auch.. Nur es wird das Icon vom Powerbutton angezeigt nicht der Telefonhörer.
Die Variante soll ja jetzt bei der Version 2.5 funktionieren hatte mir setstate vor kurzem in einem Thread den Code eingestellt.

Wo muss ich stellen  :-\ weiß das hier jemand

<div class="cell"
data-type="push"
data-warn="STATE"
data-device="VerpassteAnrufe"
data-set-on="clear"
data-background-icon="none"
data-icons='["fa-phone","fa-phone warn","fa-phone warn"]'
data-colors='["silver","orange","orange"]'
style="margin-top:+5px;">
</div>
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 26 Januar 2017, 15:19:24
Per default verhält sich der Push wie vorher passiv ohne Update von außen. Du muss data-get festlegen, damit er auf Updates reagiert.
Titel: Antw:FTUI 2.5
Beitrag von: octek0815 am 26 Januar 2017, 15:31:08
Zitat von: setstate am 26 Januar 2017, 01:53:31
Die Verschachteln wäre jetzt mehr nötig. Push kann jetzt auch auf Inputs reagieren. Also data-get und data-get-on an Push anfügen.

Die Vertchachtlung passt aber auch wieder, wenn man class="mini" an das Symbol setzt.

Hast du ein Beispiel wie ich das jetzt nur mit push hin bekomme?
Ziel ist es, das das Icon in der Mitte den Status zwischen "Weiß" und "Rot" wechselt aufgrund eines Device-Readings.
Push drumherum ist für die Optik (Fadeeffekt) des Kreises und für den Warn (Anzahl offener Fenster aus einem anderen Reading) und zum auslösen des Dialogs.

Mit 2.4 klappte das mit meiner Verschachtelung wunderbar. Ich habe die Formatierung so wie du es beschrieben hast hinbekommen, jedoch wenn ich zwei solcher Widgets in der Anzeige habe, stimmt irgendwas mit dem zweiten Widget nicht. Eigentlich sollte beim Drücken des Push´s nur der äußere Kreis den Fade ausführen und der Dialog geht dann auf, aber leider wird sowohl der äußere Kreis als auch das Icon in der Mitte Orange. Beim ersten der Beiden Widgets funktioniert es wiederum wie gewünscht.
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 26 Januar 2017, 17:31:56
Zitat von: setstate am 25 Januar 2017, 22:44:10
Das Problem mit dem Warn-Symbol habe ich gefixed.

Gibt da vielleicht noch 4 Stellen:
- widget_button.js
- widget_dimmer.js
- widget_mutistatebutton.js
- widget_pagebutton.js

Zumindest in 'widget_pagebutton.js' fehlte mir noch der Warn-Kringel und ich habe einfach Deine Änderung aus widget_symbol.js temporär übernommen:
#190: if (elem.hasClass('warn') || elem.children().find('#fg').hasClass('warn'))

Zitat von: setstate am 25 Januar 2017, 22:44:10
Noch kurze Erklärung zu Benutzung

Entweder man benutzt die Warn-Klasse im Icon-Status-Array. Damit erfolgt die Anzeige einfach über das data-get Reading und den data-get-on (bzw. data-states) Vergleich.

Danke! Das fehlte mir noch...

Gruß Ralf
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 26 Januar 2017, 17:52:25
Ein abweichendes Verhalten habe ich noch und ad hoc keine Idee wie das zu lösen ist:

Ich verwende ein kleines Menü mit 4 Pagetab-Widgets für "Home", "Wetter", "Müll" und "Heizung" (wird als Template eingebunden):

<!DOCTYPE html>
<html>
<body>
    <header><div class="large orange">MENÜ</div></header>
    <div class="sheet">
        <div class="row">
            <div class="cell big"
                data-type="pagetab" data-return-time="60" data-url="index.html" data-icon="fa-home" data-background-icon="fa-square-o"
                data-on-color="white" data-off-color="#505050" data-on-background-color="#aa6900" data-off-background-color="#505050">
            </div>
            <div class="cell big"
                data-type="pagetab" data-url="wetter.html" data-icon="fa-cloud" data-background-icon="fa-square-o"
                data-on-color="white" data-off-color="#505050" data-on-background-color="#aa6900" data-off-background-color="#505050">
            </div>
            <div class="cell big"
                data-type="pagetab" data-url="muell.html" data-device="sys_var_Muelltermine" data-get="NextEvent"
                data-get-on='["0","1"]' data-icons='["fs-dustbin warn fa-spin","fs-dustbin"]'
                data-on-color="white" data-off-color="#505050"
                data-background-icon="fa-square-o" data-on-background-color="#aa6900" data-off-background-color="#505050">
            </div>
            <div class="cell big readonly"
                data-type="pagetab" data-url="heizung.html" data-icon="oa-sani_heating" data-background-icon="fa-square-o"
                data-on-color="white" data-off-color="#505050" data-on-background-color="#aa6900" data-off-background-color="#505050">
            </div>
        </div>
    </div>
</body>
</html>


Auf dem Android-Tablet wird jetzt bei Auswahl von "Wetter", "Müll" oder "Heizung" neben dem gewählten Pagetab auch der erste Pagetab "Home" als aktiv gezeigt und lässt sich nicht mehr bedienen. Dieses trifft auch nur auf "Home" zu.

Unter Firefox (uf Windows) verhält sich das Menü dagegen wie bisher bzw. erwartet ?!?
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 26 Januar 2017, 18:39:23
Zitat von: reb am 26 Januar 2017, 17:52:25
Auf dem Android-Tablet wird jetzt bei Auswahl von "Wetter", "Müll" oder "Heizung" neben dem gewählten Pagetab auch der erste Pagetab "Home" als aktiv gezeigt und lässt sich nicht mehr bedienen. Dieses trifft auch nur auf "Home" zu.

Unter Firefox (uf Windows) verhält sich das Menü dagegen wie bisher bzw. erwartet ?!?

Hat sich wohl gelöst: dieses Verhalten tritt auf, wenn FTUI initial mit der URL /fhem/ftui/index.html anstelle /fhem/ftui/#index.html aufgerufen wird. Ob das jetzt mit dem Update zusammenhängt oder vorher auch schon so war kann ich nicht mehr nachvollziehen...
Titel: Antw:FTUI 2.5
Beitrag von: ujaudio am 26 Januar 2017, 19:50:23
Zitat von: Tabularasa am 24 Januar 2017, 17:03:43
Für einen Anfänger wie mich ist das gerade wieder ne extreme Herausforderung :-\ hatte nämlich schon ganz schön Mühe mir das alte hinzubasteln. Aber war jetzt schon langweilig weil ich am Sonntag fertig geworden bin ;) Dann mal los...

Ja so ging es mir auch: ich war gestern gerade fertig, wollte alle Updates fahren und ins Bett gehen. Erst Frust, heute doch wieder Spaß und: setstate macht einen Klasse Job!!! Ganz vielen Dank.
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 26 Januar 2017, 21:13:09
Ich bin mit der Umstellung so in den letzten Züge und hänge hier noch an 2 Dingen:

Einmal am Weather-Widget - da will es mir nicht gelingen die Größe der Weather-Icons zu skalieren. Egal was ich in class eintrage bekomme ich immer die gleiche Größe des Icons. Diese skaliert auch mit der Größe des Bildschirms während das bei anderen Widgets nicht passiert.

Weiterhin bekomme ich das Link-Widget nicht richtig skaliert. Letztendlich versuche ich in einer Row zwei größere Links/Buttons mit Icon und Text darzustellen. Hier ist entweder nur das Icon zentriert und der Text rechts daneben oder die umgebende Box ist zu klein oder zu groß oder mit Angabe einer Breite ragt der Text rechts heraus.

Hat jemand einen Tip wie man das Link-Widget richtig verwendet?

Danke
Ralf
Titel: Antw:FTUI 2.5
Beitrag von: delight am 26 Januar 2017, 22:06:55
Im Rahmen des Updates habe ich mich auf diverse Herausforderungen bezüglich des Layouts eingestellt - stattdessen habe ich größere Probleme.

Ich bekomme beim Seitenaufruf diverse Meldungen über fehlende Klammern ("missing ) after argument list) u.a. in widget_switch.js (Zeile 23), widget_famultibutton.js (Zeile 439) und widget_button.js (Zeile 46).
Alle Buttons und Switches werden folglich nicht dargestellt.

Der Source-Code sieht an den entsprechenden Stellen nicht auffällig aus; sonstige Änderungen habe ich an FTUI und FHEM nicht vorgenommen.

Hat jemand eine Idee, warum ich den Wald vor lauter Bäumen nicht sehe?

Edit sagt: index-example.html ist auch betroffen .. es muss also global etwas im Argen liegen.

Danke und Gruß
Michael

Titel: Antw:FTUI 2.5
Beitrag von: pjakobs am 26 Januar 2017, 22:27:07
örgs, es wäre vielleicht gut, wenn so gravierende Änderungen nicht einfach mit einem "normalen" Update kämen.
Ich habe ein ein paar Räumen Lichtschalter, die ausschließlich über ftui zu bedienen sind, und das sind sie jetzt nicht mehr, scheinbar weil class="small col-1-4" nicht mehr funktioniert.

Zum Glück wohnt hier (derzeit zumindest) keine Frau, das wäre für den WAF ganz übel.

pj
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 26 Januar 2017, 22:32:20
Zitat von: reb am 26 Januar 2017, 17:31:56
Gibt da vielleicht noch 4 Stellen:
- widget_button.js
- widget_dimmer.js
- widget_mutistatebutton.js
- widget_pagebutton.js

Danke, das ist ja schlimm. So viel vergessen ...
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 26 Januar 2017, 23:26:59
Zitat von: setstate am 26 Januar 2017, 15:19:24
Per default verhält sich der Push wie vorher passiv ohne Update von außen. Du muss data-get festlegen, damit er auf Updates reagiert.
Bedenke ich bin noch ganz am Anfang was FTUI betrifft
da brauche ich noch etwas mehr Info, dass mag für dich einfach sein... ich weiß damit leider nichts anzufangen... bin zufrieden wenn ich mein Layout überhaupt richtig hinbekomme  :-\
Zitat von: octek0815 am 26 Januar 2017, 15:31:08
Hast du ein Beispiel wie ich das jetzt nur mit push hin bekomme?
hast du das schon hinbekommen..? ich nicht
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 26 Januar 2017, 23:47:54
Sowas? Nur der Hörer, Warn wenn vorhanden und "clear" beim Drücken


<div class="large"
     data-type="push"
     data-warn="STATE"
     data-device="dummy1"
     data-set-on="clear"
     data-background-icon="none"
     data-icon="fa-phone">
</div>
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 00:15:03
Zitat von: torte am 26 Januar 2017, 11:08:14
hab jetzt auch ein Problem mit einem ICONset welches ich so einbinde:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css" />

Genutzt hab ich die ICONs dann z.b im PUSH Widget
div data-type="push" data-device="Gong.Kids" data-set-on="on" data-icon="zmdi zmdi-notifications-active zmdi-hc-2x" data-background-icon="none" class="inline"></div>


Die Google Material Icons sind bei FTUI schon mit dabei

<div data-type="push" data-device="Gong.Kids" data-set-on="on" data-icon="mi-notifications_active" data-background-icon="none" class="big"></div>


https://material.io/icons/#ic_notifications_active

Prefix "mi-" plus die Namen mit Unterstrich verbunden
Titel: Antw:FTUI 2.5
Beitrag von: octek0815 am 27 Januar 2017, 06:16:25
Zitat von: moonsorrox am 26 Januar 2017, 23:26:59
Bedenke ich bin noch ganz am Anfang was FTUI betrifft
da brauche ich noch etwas mehr Info, dass mag für dich einfach sein... ich weiß damit leider nichts anzufangen... bin zufrieden wenn ich mein Layout überhaupt richtig hinbekomme  :-\hast du das schon hinbekommen..? ich nicht

Leider nein, hoffe auf setstate.
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 07:13:10
Zitat von: reb am 26 Januar 2017, 21:13:09

Einmal am Weather-Widget - da will es mir nicht gelingen die Größe der Weather-Icons zu skalieren. Egal was ich in class eintrage bekomme ich immer die gleiche Größe des Icons. Diese skaliert auch mit der Größe des Bildschirms während das bei anderen Widgets nicht passiert.



<li data-row="1" data-col="10" data-sizex="3" data-sizey="4">
    <header>WEATHER</header>
    <div class="vbox">
        <div data-type="weather" data-device="AgroWeather" data-get="fc2_weatherDay" class="big"></div>
        <div data-type="weather" data-device="AgroWeather" data-get="fc2_weatherDay" class="bigger"></div>
        <div data-type="weather" data-device="AgroWeather" data-get="fc2_weatherDay" class="tall"></div>
    </div>
</li>
Titel: Antw:FTUI 2.5
Beitrag von: torte am 27 Januar 2017, 07:15:46
Hallo Setstate,

danke für Deine Antwort, das ist aber nicht der MaterialIcons Font von Google sondern dieser hier:
http://zavoloklom.github.io/material-design-iconic-font/icons.html


Zitat von: setstate am 27 Januar 2017, 00:15:03
Die Google Material Icons sind bei FTUI schon mit dabei

<div data-type="push" data-device="Gong.Kids" data-set-on="on" data-icon="mi-notifications_active" data-background-icon="none" class="big"></div>


https://material.io/icons/#ic_notifications_active

Prefix "mi-" plus die Namen mit Unterstrich verbunden

Habe mittlerweile gemerkt das ICONs richtig dargestellt werden, die es nur in dem Iconic ICONS Font vorhanden sind.
Beim laden der FTUI Seite wird eigentlich immer das von mir gewünschte Iconics Icon kurz angezeigt, nach 2-3 Sekunden
wenn die FTUI Seite durchgeladen ist wird es aber "überschrieben"
Muss ich das laden des Iconics FONT CSS an einer anderen stelle machen?

Viele Grüße
Torte
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 07:19:53
Zitat von: torte am 27 Januar 2017, 07:15:46

... das ist aber nicht der MaterialIcons Font von Google sondern dieser hier:
http://zavoloklom.github.io/material-design-iconic-font/icons.html


ich lese das:
"Created by Sergey Kupletsky"
Material Design Iconic Font is a full suite of official material design icons (created and maintained by Google), with additional community-designed icons and brands icons for easy scalable vector graphics on websites or desktop.
Titel: Antw:FTUI 2.5
Beitrag von: torte am 27 Januar 2017, 07:24:02
Also geht ein einbinden von anderen ICON Fonts nicht mehr?

Grüße
Torte
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 07:31:09
Die Prioritäten werden über  die Reihenfolge der CSS Files im Header bestimmt

Probiere mal die die CSS im Header fest vorzugeben.


    <link rel="stylesheet" href="lib/font-awesome.min.css" />
    <link rel="stylesheet" href="lib/material-icons.min.css" />
    <link rel="stylesheet" href="meinCSSfile.css" />


Dann fügt die Automatik auch nix weiter hinzu, wenn schon alles da ist
Titel: Antw:FTUI 2.5
Beitrag von: torte am 27 Januar 2017, 07:46:45
Hi setstate

so gehts perfekt!!!

Danke!

Grüße
Torte

BTW: Weiß jetzt auch wieder warum ich den Iconic Font brauchte, wegen der Waschmaschine die hat der GoogleFont nicht  ;D

Titel: Antw:FTUI 2.5
Beitrag von: delight am 27 Januar 2017, 08:19:37
Ich habe in der Zwischenzeit herausgefunden, warum ich diverse Fehler mit widget_switch.js, widget_famultibutton.js und widget_pagebutton.js habe: Es scheint mit der Auslieferung der Seiten durch nginx zusammenzuhängen.
Wenn ich auf den FHEM-eigenen Webserver zurückgehe und die angepassten Header verwende, sind die Probleme gelöst.

Gilt es nur noch rauszufinden, warum es mit einem externen Webserver nach dem Update auf 2.5 Schwierigkeiten gibt..
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 08:24:52
Ihr müsst die Header nicht leeren. Ihr könnt alles so lassen. Ist sogar sicherer und Millisekunden schneller, wenn die Abhängigkeiten im Header gleich mitkommen.
Ich habe die Automatik nur eingebaut, damit es für Beginner einfacher und übersichtlicher wird.

Titel: Antw:FTUI 2.5
Beitrag von: accessburn am 27 Januar 2017, 08:51:49
Kurzer Tipp bitte wie ich wieder zwei Symbole nebeneinander bekomme, die wollen nur noch untereinander sein die Schweine :-D
Titel: Antw:FTUI 2.5
Beitrag von: Stumpf am 27 Januar 2017, 09:01:37
Hallo zusammen,

hat jemand Probleme mit den I-Frames bemerkt?

Ich habe zwei I-Frames eingebunden und diese zeigen nun nur ein trauriges Gesicht.  :(

Hier der Code der vorher ging:

     <li data-row="4" data-col="5" data-sizex="4" data-sizey="2" class="semitransparent" onclick="window.open('http://www.wetterdienst.de/Maps/Europa/');">
        <header>Regen Radar</header>
        <table width="100%">
           <tr>
              <td>
                 <div data-type="iframe"
                      data-src="WetterRadarFrameDeutschland.html"
                      data-height="300"
                      data-width="230">
                 </div>
              </td>
              <td>
                 <div data-type="iframe"
                      data-src="WetterRadarFrameBayern.html"
                      data-height="300"
                      data-width="228">
                 </div>
              </td>

           </tr>
        </table>
     </li>


Und hier das was eingefügt wird.

<html>
   <head>
      <meta http-equiv="expires" content="0">
      <meta http-equiv="pragma" content="no-cache">
      <meta http-equiv="refresh" content="300">
   </head>
   <body>
      <img name="dyn_bild_de" src="http://images2.wetterdienst.de/maps/radar/Radarfilm_Deutschland.gif?1424183428" width="220">
   </body>
</html>


Titel: Antw:FTUI 2.5
Beitrag von: delight am 27 Januar 2017, 09:08:10
Exakt die Frage nach den Iframes wollte ich auch gerade stellen.
Ich binde eine aktuelle Verkehrssituation von GoogleMaps per Iframe ein - die externe Seite selbst wird per direktem Aufruf korrekt geladen.

Versuche ich die Integration via Iframe gibt's auf der Konsole einen 405, der - meine ich - unter 2.4 nicht aufgetreten ist.

Der Code sah und sieht so aus:


<div class="dialog">
     <div data-type="iframe"
      data-fill="yes"
      data-src="googleTrafficMaps.html">
</div>


Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 09:10:25
Beide in eine hbox packen oder in ein normales div und beiden inline mitgeben

1.
div class="hbox"
    div symbol
    div symbol

2.
div
    div class="inline" symbol
    div class="inline" symbol


der Platz Platz muss natürlich reichen, für beide nebeneinander. Manchmal sind unbedachte *-space oder "cell" ( ohne sheet>row>cell) die Ursache für Platzprobleme.
Titel: Antw:FTUI 2.5
Beitrag von: accessburn am 27 Januar 2017, 09:14:45
hbox ... Treffer  :-*
Titel: Antw:FTUI 2.5
Beitrag von: ih-sqeezer am 27 Januar 2017, 09:24:54
Hallo,

die Einbindung mit den lokalen Bildern habe ich mittels des Hinweises eines absoluten Pfades hinbekommen. Danke für den Hinweis!
Wobei es nicht wirklich absolut ist, sondern bezogen auf FHEM ein absoluter Pfad, warum auch immer. Es funktioniert.

Jedoch habe ich derzeit noch mit dem "pagetab" meine Probleme. Bei diesen hatte ich ebenfalls Warn-Kringel integriert. Ich könnte dieses nun in ein "symbol" umschreiben, was auch wieder funktioniert. Jedoch verliere ich damit meine push Aktionen, dient ja zum page wechseln. Kann mir jemand sagen, wie ich dies wieder mit beiden Funktionen zum Laufen bekomme?

Danke und Grüße,
Ingo
Titel: Antw:FTUI 2.5
Beitrag von: Tedious am 27 Januar 2017, 09:26:30
Eine kleine Bitte hätte ich - ich finde es wirklich (!) toll dass hier so gute Entwicklungsarbeit geleistet wird, definitiv. Aber *könnte* man bei einem solchen Versionssprung die Stränge nicht trennen. Eine Tablet-UI brauche ich für den WAF, damit Frauchen den Krempel auch steuern kann. Wenns mir bei jedem Versionssprung die Hälfte der Darstellung zerbaselt ist das suboptimal, zumindest wenn man keine Zeit hat das alles direkt wieder zu fixen. Klar, ich kann die Updates ausschließen, das habe ich auch gemacht - ist aber ja auch nicht Sinn der Sache. Bei einem neuen Strang könnte man das Verzeichnis duplizieren, Pfade anpassen und das erst mal parallel testen bevor man migriert.

Ich rede nicht von kleinen Updates, aber wenn am CSS, den Defs, etc geschraubt wird ist das ja eher ein Major denn ein Minor-Release...
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 09:38:44
Warn bei Pagetab sollte nach einen weiteren Update (von gestern Abend) wieder gehen.
Titel: Antw:FTUI 2.5
Beitrag von: Stumpf am 27 Januar 2017, 09:50:03

Leider kein Erfolg!  :(

ich hab nun "hbox" probiert, auch sheet und auch inline!
Auch habe ich das ganze reduziert..... um sonstiges auszuschließen.

Vielleicht kann das ja mal einer probieren.


    <div class="hbox">
       <div class="inline"
            data-type="iframe"
            data-src="http://images2.wetterdienst.de/maps/radar/Radarfilm_Deutschland.gif?1424183428"
            data-height="20"
            data-width="20">
       </div>
    </div>
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 10:11:33
Womit keinen Erfolg? hbox und inline sind Formatierungsklassen. Hast du Probleme mit der Ausrichtung?

IFrame Widget muss ich mir ansehen, was da wieder schiefgelaufen ist, wenn das nicht mehr läuft.
Titel: Antw:FTUI 2.5
Beitrag von: Stumpf am 27 Januar 2017, 10:19:10
Anscheinend schlägt die Prüfung des Inhaltes fehl.
Kann das sein?

Wenn ich den Link in den Browser eingebe, wir das Bild aber sauber geladen.
Hab nun auch eine eigene Testseite gemacht, damit ich genug Platz habe.

Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 10:22:30
Ich kann das erst heute Abend wieder testen.
Titel: Antw:FTUI 2.5
Beitrag von: Stumpf am 27 Januar 2017, 10:53:59
Kein Prob.

Danke für deine Arbeit!!
Titel: Antw:FTUI 2.5
Beitrag von: Tobias am 27 Januar 2017, 13:29:39
Nachdem ich auf V2.5 bin, habe ich Probleme im Fully Browser. Die Seite wurd nicht mehr richtig geladen und wenn er sie dann mal geladen hat, fehlt jede menge CSS, es ist viel weiß, alles durcheinander gewürfelt und auf tastdrücke wird auch nicht mehr korrekt reagiert
Auf meinem Laptop ist aber alles ok.

Ich habe das Gefühl das es an der index.html liegt. GIbt es allgemeine Hinweise ob da etwas umgebaut werden muss?
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 27 Januar 2017, 13:36:29
Zitat von: Tobias am 27 Januar 2017, 13:29:39
Ich habe das Gefühl das es an der index.html liegt. GIbt es allgemeine Hinweise ob da etwas umgebaut werden muss?
Das Gefühl habe ich auch...
Denn ich habe diese angepasst nach dem neuen Muster hier...
Bei mir läd er einige Icons nicht richtig, drücke ich dan nF5 kommen Sie zögerlich und oft fehlt in einem Feld der Inhalt so z.B. Mal das Wetter in Kurzform oder auch mal die Uhr. Ich aktualisiere manchmal 3x
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 13:45:59
Habt ihr die Header leergemacht (bis auf die fhem-tablet-ui.js) oder so gelassen, wie vorher?

Beides ist valide. Ich versuche nur eine mögliche Ursache zu erahnen.
Titel: Antw:FTUI 2.5
Beitrag von: chris1284 am 27 Januar 2017, 13:50:31
Ich wäre mal für eine saubere releasestrategie wie bei 2.4 gewesen  ;)

update einstellen und dann auf zerschossenen UIs und ggf nicht dazu passenden widgets zu warten finde ich nicht optimal.

wäre toll wenn du ca 1-2 wochen vorher einen "da kommt was" post machen könntest so das man ggf vorbereitet ist (und nicht einfach ein update macht ode tui excluded) und eventuelle fehler vorher schon melden kann.

ansonsten gings bis auf die zerissene ansicht und neusetzen einiger classes recht reibungslos. das uwz-widget muss ich aber noch anpassen
Titel: Antw:FTUI 2.5
Beitrag von: Tobias am 27 Januar 2017, 14:00:26
ich habe in dex.html alles so gelassen, nichts geändert
bisher musste ich nur bigger classes auf big ändern weil die Icons sich vergrößert haben

Das ist mein header der  Index.html
<!DOCTYPE html>
<html>
<head>
    <!--
     /* FHEM tablet ui */
     /*
     * Just another dashboard for FHEM
     *
     * Version: 1.4.4
     * Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="widget_base_width" content="132">  <!-- 9 cols -->
    <meta name="widget_base_height" content="114"> <!-- 7 rows -->
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="gridster_disable" content="1">
    <meta name="widget_margin" content="4">
    <meta name="widget_min_cols" content="13">
    <meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
    <meta name="debug" content="0"> <!-- 1=output to console;0=no output -->

    <link rel="stylesheet" href="lib/jquery.gridster.min.css" />
    <link rel="stylesheet" href="css/fhem-tablet-ui.css" />
    <link rel="stylesheet" href="lib/font-awesome.min.css" />
    <link rel="stylesheet" href="lib/jquery.toast.min.css" />
    <link rel="stylesheet" href="lib/openautomation.css" />
    <link rel="stylesheet" href="lib/material-icons.min.css" />
    <link rel="stylesheet" href="lib/fhemSVG.css" />

    <!-- define your personal style here, it wont be overwritten  -->
    <!-- <link rel="stylesheet" href="/fhem/tablet/css/fhem-green-ui.css" /> -->
    <!-- <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" /> -->

    <link rel="stylesheet" href="css/ftui_myself.css" />

    <script src="../pgm2/jquery.min.js" defer></script>
    <script src="lib/jquery.toast.min.js" defer></script>
    <script src="lib/jquery.gridster.min.js" defer></script>
    <script src="js/fhem-tablet-ui.js" defer></script>
    <script src="js/fhem-tablet-ui.js" defer></script>

    <!-- Remove this line to enable for usage with WebViewControl -->
    <!-- <script defer>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script> -->
    <!-- <script src="../pgm2/cordova-2.3.0.js" defer></script> -->
    <!-- <script src="../pgm2/webviewcontrol.js" defer></script> -->
    <!-- End for WebViewControl -->

    <title>FHEM-Tablet-UI Dev</title>
</head>
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 27 Januar 2017, 14:34:53
Zitat von: setstate am 27 Januar 2017, 13:45:59
Habt ihr die Header leergemacht (bis auf die fhem-tablet-ui.js) oder so gelassen, wie vorher?

Beides ist valide. Ich versuche nur eine mögliche Ursache zu erahnen.
ja ich habe die von dir vorgeschlagene minimalistische Header Struktur gemacht... hie rmein Header
<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.5.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2017 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define TABLETUI HTTPSRV ftui ./www/tablet Tablet' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
    <link rel="icon" href="favicon.ico" type="image/x-icon" />

<meta name="widget_base_width" content="83">
<meta name="widget_base_height" content="71">
<meta name="widget_margin" content="4">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<!--<meta name="fhemweb_url" content="http://resse.my-wan.de:8083/fhem">-->


    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="css/fhem-green-ui.css" / -->
    <link rel="stylesheet" href="css/fhem-tablet-ui-user.css" />

    <script src="js/fhem-tablet-ui.js" defer></script>

    <!-- Remove this line to enable for usage with WebViewControl
    <script defer>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
    <script src="../pgm2/cordova-2.3.0.js" defer></script>
    <script src="../pgm2/webviewcontrol.js" defer></script>
    <!-- End for WebViewControl -->

    <title>FHEM-Tablet-UI</title>
</head>
Titel: Antw:FTUI 2.5
Beitrag von: Tedious am 27 Januar 2017, 15:42:26
Zitat von: chris1284 am 27 Januar 2017, 13:50:31
Ich wäre mal für eine saubere releasestrategie wie bei 2.4 gewesen  ;)

update einstellen und dann auf zerschossenen UIs und ggf nicht dazu passenden widgets zu warten finde ich nicht optimal.

wäre toll wenn du ca 1-2 wochen vorher einen "da kommt was" post machen könntest so das man ggf vorbereitet ist (und nicht einfach ein update macht ode tui excluded) und eventuelle fehler vorher schon melden kann.

ansonsten gings bis auf die zerissene ansicht und neusetzen einiger classes recht reibungslos. das uwz-widget muss ich aber noch anpassen

Das war ja das was ich auch meinte ;)

ZitatEine kleine Bitte hätte ich - ich finde es wirklich (!) toll dass hier so gute Entwicklungsarbeit geleistet wird, definitiv. Aber *könnte* man bei einem solchen Versionssprung die Stränge nicht trennen. Eine Tablet-UI brauche ich für den WAF, damit Frauchen den Krempel auch steuern kann. Wenns mir bei jedem Versionssprung die Hälfte der Darstellung zerbaselt ist das suboptimal, zumindest wenn man keine Zeit hat das alles direkt wieder zu fixen. Klar, ich kann die Updates ausschließen, das habe ich auch gemacht - ist aber ja auch nicht Sinn der Sache. Bei einem neuen Strang könnte man das Verzeichnis duplizieren, Pfade anpassen und das erst mal parallel testen bevor man migriert.

Ich rede nicht von kleinen Updates, aber wenn am CSS, den Defs, etc geschraubt wird ist das ja eher ein Major denn ein Minor-Release...
Titel: Antw:FTUI 2.5
Beitrag von: Thomas X am 27 Januar 2017, 15:58:51
Seit dem Update auf 2.5 wird in Fully und Chrome der Thermostat auf Android nicht mehr korrekt angezeigt. Die eingestellte Temperatur fehlt. Ist scheinbar ein Problem beim Android WebView, da Firefox noch funktioniert?

Hat jemand eine Lösung?

Viele Grüße
Titel: Antw:FTUI 2.5
Beitrag von: Markus. am 27 Januar 2017, 16:31:01
Hallo Zusammen,

gibt es bezüglich des "class="col-1-4 Problems", gibt es da schon eine Lösung nach dem Update auf 2.5?
Nach dem Update sind bei mir in dem Container die drei Objekte verschoben und nicht mehr nebeneinander.



<header>Beleuchtung</header>
     <div class="row container round bg-gray padding margin">
        <div data-type="switch"
data-device='LED_Controller'
data-on-background-color="LED_Controller:RGB"
data-get-on="dim.*|on"
data-set-on="on"
data-icon="fa-lightbulb-o"
class="col-1-4"></div>
        <div class="col-1-2">LED Nano</div>
        <div data-type="symbol" id="starter1"
data-device='LED_Controller'
data-get=""
data-off-color="LED_Controller:RGB"
data-off-background-color="LED_Controller:RGB"
data-icon="fa-ellipsis-h"
data-background-icon="fa-circle-thin"
class="small"></div>


Gruß

Markus
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 16:46:31
Das "symbol" data-device='LED_Controller hat gar kein class="col-1-4"
Dann kann es auch nicht in Linie mit den anderen Cols sein.
Titel: Antw:FTUI 2.5
Beitrag von: Markus. am 27 Januar 2017, 16:57:34
ach mist hab ne Zeile vergessen....


  <div class="row container round bg-gray padding margin">
        <div data-type="switch"
data-device='LED_Controller'
data-on-background-color="LED_Controller:RGB"
data-get-on="dim.*|on"
data-set-on="on"
data-icon="fa-lightbulb-o"
class="col-1-4"></div>
        <div class="col-1-2">LED Nano</div>
        <div data-type="symbol" id="starter1"
data-device='LED_Controller'
data-get=""
data-off-color="LED_Controller:RGB"
data-off-background-color="LED_Controller:RGB"
data-icon="fa-ellipsis-h"
data-background-icon="fa-circle-thin"
class="small"></div>
    </div>
<div data-type="popup"
         data-height="640px" data-width="340px" data-mode="animate" data-starter="#starter1" class="col-1-6">


Das ist das Popup mit ID starter1 Class col-1-6.
Vor dem Update war alles in einer Reihe...:-(

Gruß
Markus
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 27 Januar 2017, 17:19:35
Zitat von: setstate am 27 Januar 2017, 07:13:10

<li data-row="1" data-col="10" data-sizex="3" data-sizey="4">
    <header>WEATHER</header>
    <div class="vbox">
        <div data-type="weather" data-device="AgroWeather" data-get="fc2_weatherDay" class="big"></div>
        <div data-type="weather" data-device="AgroWeather" data-get="fc2_weatherDay" class="bigger"></div>
        <div data-type="weather" data-device="AgroWeather" data-get="fc2_weatherDay" class="tall"></div>
    </div>
</li>


So wie in Deinem Bespiel geht es und die Icons lassen sich gut skalieren. Ich habe es eben erst bemerkt: mit data-imageset="kleinklima" lassen sich die Icons nicht skalieren.

Ralf

Titel: Antw:FTUI 2.5
Beitrag von: Paul.baumann am 27 Januar 2017, 17:30:01
Ich habe auf IOS-Geräten (auch im Chrome-Browser mit IPAD-Modus) aktuell wieder den Fehler in der powerange.min.js, wenn ich ein Slider-Widget verwende.

Uncaught TypeError: e.preventDefault is not a function
    at Vertical.onmousemove (powerange.js:1851)
    at Vertical.onmousedown (powerange.js:1838)
    at HTMLDivElement.cb (powerange.js:457)


Der Slider ist als Template eingebunden:
<header>var_Name</header>
<div class="sheet">
<div class="row-3-4">
<div class="top-space darker big" data-type="label" data-device='var_Device' data-get="pct" data-unit=" %">&nbsp</div>
<div class="top-space value" data-type="slider" data-device='var_Device' data-min="0" data-max="100" data-set="pct" data-get="pct"></div>
</div>
<div class="row-1-4">
<div class="col-1-3" data-type="push" data-device="var_Device" data-set-on="on" data-icon="fa-angle-up" data-background-icon="fa-square-o"></div>
<div class="col-1-3" data-type="push" data-device="var_Device" data-set-on="stop" data-icon="fa-square-o" data-background-icon="fa-square-o"></div>
<div class="col-1-3" data-type="push" data-device="var_Device" data-set-on="off" data-icon="fa-angle-down" data-background-icon="fa-square-o"></div>
</div>
</div>


Kann dies noch jemand reproduzieren?

Paul
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 27 Januar 2017, 19:22:22
Hallo,

habe gerade erst aktualisiert, aber ich bin echt froh, ein update zu haben  :o
Bei mir hat's mal gerade komplett alles zerschossen. Das einzige, was ich noch sehe, ist das clock-widget. Und das auch nur in miniklein  ;D ;D
Mit toast=1 bekomme ich erstmal nur folgende Fehlermeldung:

widget_pagebutton.js:232
ReferenceError: Modul_famultibutton is not defined

Ich taste mich mal langsam ran, werde aber wohl vorerst mal wieder downgraden. Das scheint etwas aufwändiger zu werden  :(

schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: pjakobs am 27 Januar 2017, 23:16:05
Zitat von: Jojo11 am 27 Januar 2017, 19:22:22

Ich taste mich mal langsam ran, werde aber wohl vorerst mal wieder downgraden. Das scheint etwas aufwändiger zu werden  :(

schöne Grüße
Jo

nachdem ich  leider vor allem meine Beleuchtung nicht mehr bedienen kann - kanns Du mir verraten, wie ich gezielt auf die letzte Verson vor 2.5 downgraden kann?

grüße

pj
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 27 Januar 2017, 23:45:12
Zitat von: Paul.baumann am 27 Januar 2017, 17:30:01
Ich habe auf IOS-Geräten (auch im Chrome-Browser mit IPAD-Modus) aktuell wieder den Fehler in der powerange.min.js, wenn ich ein Slider-Widget verwende.

Uncaught TypeError: e.preventDefault is not a function
    at Vertical.onmousemove (powerange.js:1851)
    at Vertical.onmousedown (powerange.js:1838)
    at HTMLDivElement.cb (powerange.js:457)



Das ist ein Fehler, der schon vorher da war. Habe ich jetzt auch gefixed.
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 02:57:26
Zitat von: pjakobs am 27 Januar 2017, 23:16:05
nachdem ich  leider vor allem meine Beleuchtung nicht mehr bedienen kann - kanns Du mir verraten, wie ich gezielt auf die letzte Verson vor 2.5 downgraden kann?

grüße

pj

.www/tablet aus dem restoreDir von FHEM zurück kopieren
Titel: Antw:FTUI 2.5
Beitrag von: chris1284 am 28 Januar 2017, 09:30:10
wie kann man in einem dialog (popup) mit fester breite und höhe in einer hbox 2 elementen den selben platz geben?

sprich popup -> hbox -> element 1 50% breite des popups; element 2 50% breite des popups

wobei elemtent 1 zb eine weitere hbox ist. element 2 ein image class cell
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 28 Januar 2017, 09:35:10
Hallo,

nachdem bei mir nach dem update nichts mehr ging, habe ich ein Testsystem komplett neu aufgesetzt. Folgendes Minimalbeispiel zeigt eine leere Seite und produziert eine Fehlermeldung (die kommt 2x):

<!DOCTYPE html>
<html>
<head>
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <script src="/tablet/js/fhem-tablet-ui.js" defer></script>
    <title>Titel</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
  <div data-type="switch" data-device="Lampe1"></div>
  <div data-type="symbol" data-icon="fa-bars"></div>
</li>
</ul>
</div>
</body>
</html>



widget_switch.js:23
SyntaxError: missing ) after argument list


Es wird kein icon angezeigt. Einziger Unterschied bei mir ist, dass ich die Seiten mit dem lighttpd Webserver ausliefere (Seiten liegen unter /opt/fhem/www/tablet). Das hat allerdings bisher hervorragend funktioniert.
Die .js-Datei scheint gefunden zu werden, ebenfalls die css-Dateien (Hintergrund ist dunkel).

Die demo_ftui.html zeigt auch keinerlei icons an, aber die gleiche Fehlermeldung.

Wo kann ich jetzt anfangen, den Fehler zu suchen??

schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 09:49:51
Komisch, komisch.

Was passiert, wenn die Main CSS mit im Header ist?

    <link rel="stylesheet" href="css/fhem-tablet-ui.css" />
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 28 Januar 2017, 09:53:26
Das macht irgendwie keinen sichtbaren Unterschied. Gibts vielleicht irgendwo absolute Links, die in meinem Fall dann nicht mehr passen?

schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 09:56:39
Der Suchpfad wird benutzt. Default ist "/fhem/"

Setze mal im Header passend zu deinem Pfad.

<meta name='fhemweb_url' content='/fhem/'>
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 28 Januar 2017, 09:57:56
Keine Änderung.
In Lighttpd habe ich als root "/opt/fhem/www"

Hatte das bisher so angegeben:

<meta name="fhemweb_url" content="http://xxx.xxx.xxx.xxx:8083/fhem">

Und das hat funktioniert, macht jetzt aber auch keinen Unterschied.

schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 10:01:23
dann setze mal <meta name="debug" content="3"> und schaue in der Webconsole, was passiert
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 28 Januar 2017, 10:04:21

Die Zeichenkodierung des HTML-Dokuments wurde nicht deklariert. Das Dokument wird in manchen Browser-Konfigurationen mit verstümmeltem Text dargestellt, wenn das Dokument Zeichen außerhalb des US-ASCII-Bereichs enthält. Die Zeichenkodierung der Seite muss im Dokument oder Transferprotokoll deklariert werden.  tablet
Plugin dir: /tablet/js  fhem-tablet-ui.js:1411:13
Filename:   fhem-tablet-ui.js:1411:13
"FHEM dir: http://xxx.xxx.xxx.xxx:8083/fhem"  fhem-tablet-ui.js:1411:13
dynamic load file:/tablet/js/../lib/jquery.toast.min.js / async:false  fhem-tablet-ui.js:1411:13
initPage: Timer gestartetfhem-tablet-ui.js:522
initPage - area=  fhem-tablet-ui.js:1411:13
dynamic load file:/tablet/js/../lib/jquery.gridster.min.js / async:false  fhem-tablet-ui.js:1411:13
Object { modules: Array[0], addModule: plugins.addModule(), removeArea: plugins.removeArea(), updateParameters: plugins.updateParameters(), load: plugins.load(), update: plugins.update() }  fhem-tablet-ui.js:1411:13
Object { modules: Array[0], addModule: plugins.addModule(), removeArea: plugins.removeArea(), updateParameters: plugins.updateParameters(), load: plugins.load(), update: plugins.update() }  fhem-tablet-ui.js:1411:13
initWidgets - area=  fhem-tablet-ui.js:1411:13
Load widget : switch  fhem-tablet-ui.js:1411:13
Create widget : switch  fhem-tablet-ui.js:1411:13
dynamic load file:/tablet/js/widget_switch.js / async:true  fhem-tablet-ui.js:1411:13
Load widget : symbol  fhem-tablet-ui.js:1411:13
Create widget : symbol  fhem-tablet-ui.js:1411:13
dynamic load file:/tablet/js/widget_symbol.js / async:true  fhem-tablet-ui.js:1411:13
init templates - Done  fhem-tablet-ui.js:1411:13
dynamic load done:/tablet/js/../lib/jquery.toast.min.js  fhem-tablet-ui.js:1411:13
dynamic load done:/tablet/js/../lib/jquery.gridster.min.js  fhem-tablet-ui.js:1411:13
dynamic load done:/tablet/js/widget_switch.js  fhem-tablet-ui.js:1411:13
function depends_switch not found (maybe ok)  fhem-tablet-ui.js:1411:13
Failed to create widget: switch  fhem-tablet-ui.js:1411:13
dynamic load done:/tablet/js/widget_symbol.js  fhem-tablet-ui.js:1411:13
function depends_symbol not found (maybe ok)  fhem-tablet-ui.js:1411:13
Failed to create widget: symbol  fhem-tablet-ui.js:1411:13
initWidgets - Done  fhem-tablet-ui.js:1411:13
initPage: 191.8msfhem-tablet-ui.js:577
start shortpoll in (ms):500  fhem-tablet-ui.js:1411:13
SyntaxError: missing ) after argument list[Weitere Informationen]  widget_switch.js:23:63
SyntaxError: missing ) after argument list[Weitere Informationen]  widget_symbol.js:23:62
start shortpoll  fhem-tablet-ui.js:1411:13
get jsonlist2: Timer gestartetfhem-tablet-ui.js:636
start shortpoll in (ms):30000  fhem-tablet-ui.js:1411:13
get jsonlist2: 3097.8msfhem-tablet-ui.js:647
read jsonlist2: Timer gestartetfhem-tablet-ui.js:648
fhemJSON: 0=Arg 1=Results  fhem-tablet-ui.js:1411:13
shortpoll: fhemJSON.Results.length=1139  fhem-tablet-ui.js:1411:13
shortPoll - Done  fhem-tablet-ui.js:1411:13
document triggered updateDone  fhem-tablet-ui.js:1411:13
initLongpoll: 1  fhem-tablet-ui.js:1411:13
read jsonlist2: 233.41msfhem-tablet-ui.js:722
Longpoll started  fhem-tablet-ui.js:1411:13



Schaue mir das im Laufe des Tages noch mal an.

schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 10:24:34
Mit der VerzeichnisAngabe kann es noch Probleme geben. Ich glaube das wird schon benutzt, wenn es noch garnicht initialisiert ist. Das muss ich noch ändern.

Also bei Auslieferung der Seiten mit Extra-Webserver, gibt es aktuell  Probleme durch falsche Pfade.
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 28 Januar 2017, 11:31:32
Vielen Dank! Gut zu wissen - dann ist mein Code vielleicht doch nicht komplett daneben  ;D

schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 28 Januar 2017, 11:48:52
Ja hier ist irgend was noch total im Argen, wenn ich den Cache komplett leere erscheint bei mir auch nichts wie nur der Hintergrund... Dann drücke ich Strg F5 und so ganz zögerlich baut sich etwas auf aber fast alles ohne Icons nur die Circle sind da.... Dann wieder F5 und langsam kommt dann etwas von der Seite, nach erneutem F5 habe ich dann so langsam meine Seite....

Das vorher anders, da hat sich nichts so träge aufgebaut.... Habe mal die alte Index.html wieder eingebaut, aber das bringt auch nichts Verhalten bleibt...

Die Fehlermeldungen nur am Anfang, kann ich nicht deuten da sie zu schnell weg sind... Tja aber ich gebe noch nicht auf weil meine Seiten nun bis auf die Wetter Seite wieder fast hergestellt sind, ansonsten war ich ja sowieso noch nicht fertig, also arbeite ich weiter mit der 2.5
Titel: Antw:FTUI 2.5
Beitrag von: delight am 28 Januar 2017, 14:22:20
Die Auslieferungsprobleme mit einem externen Webserver (in meinem Fall nginx) hatte ich ja auch schon berichtet und bin daher hilfsweise auf den eingebauten Server zurückgegangen.
Bis auf die iFrame-Thematik scheint bei meinem begrenzten Einsatzzweck erstmal alles wieder zu passen.

Nochmals vielen Dank an setstate für die tolle Leistung und den großartigen Support!
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 28 Januar 2017, 14:23:12
Hi setstate,

beim Push-Widget fehlt noch eine Kleinigkeit - es fehlt der Default für data-get und muss aktuell explizit angegeben werden:
elem.initData('get', '');

Gruß Ralf

Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 14:26:56
Zitat von: reb am 28 Januar 2017, 14:23:12
Hi setstate,

beim Push-Widget fehlt noch eine Kleinigkeit - es fehlt der Default für data-get und muss aktuell explizit angegeben werden:
elem.initData('get', '');

Gruß Ralf

Das habe ich mit Absicht gemacht. Ich denke immer noch ein Push soll primär Senden, nicht Symbolisieren. Von daher ist data-get ein Opt-In Feature.
Titel: Antw:FTUI 2.5
Beitrag von: knopf_piano am 28 Januar 2017, 14:33:25
Heute umgestellt,
bisher keine Auffälligkeit!
Top sache!!!
Titel: Antw:FTUI 2.5
Beitrag von: octek0815 am 28 Januar 2017, 14:54:38
Zitat von: octek0815 am 26 Januar 2017, 15:31:08
Hast du ein Beispiel wie ich das jetzt nur mit push hin bekomme?
Ziel ist es, das das Icon in der Mitte den Status zwischen "Weiß" und "Rot" wechselt aufgrund eines Device-Readings.
Push drumherum ist für die Optik (Fadeeffekt) des Kreises und für den Warn (Anzahl offener Fenster aus einem anderen Reading) und zum auslösen des Dialogs.

Mit 2.4 klappte das mit meiner Verschachtelung wunderbar. Ich habe die Formatierung so wie du es beschrieben hast hinbekommen, jedoch wenn ich zwei solcher Widgets in der Anzeige habe, stimmt irgendwas mit dem zweiten Widget nicht. Eigentlich sollte beim Drücken des Push´s nur der äußere Kreis den Fade ausführen und der Dialog geht dann auf, aber leider wird sowohl der äußere Kreis als auch das Icon in der Mitte Orange. Beim ersten der Beiden Widgets funktioniert es wiederum wie gewünscht.

push...
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 28 Januar 2017, 15:21:58
Zitat von: setstate am 28 Januar 2017, 14:26:56
Das habe ich mit Absicht gemacht. Ich denke immer noch ein Push soll primär Senden, nicht Symbolisieren. Von daher ist data-get ein Opt-In Feature.
Ja, kann man so machen - wäre dann die Ausnahme gegenüber allen anderen Widgets. Ich war aufgrund der aktuellen Doku davon ausgegangen es ist auch beim Push-Widget der Default.

Gruß Ralf
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 22:07:35
Update: mit 2.5.1 klappt jetzt wieder die Auslieferung der FTUI Seiten von einem anderen Web-Server.

Solche Seiten müssen lediglich den Hinweis bekommen, wo FHEM gefunden werden kann

<meta name='fhemweb_url' content='http://fhemserver.local:8083/fhem/'>

Ansonsten kommt der Fehler "ShortPoll Request Failed, will retry in 3s"

Hinweis für Widget-Entwickler: ftui.config.dir gibt es nicht mehr und darf nicht mehr benutzt werden. Die Pfadangaben für zusätzliche CSS Files sind jetzt immer relativ zum Seiten-Root-Pfad
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 28 Januar 2017, 22:12:25
Super vielen Dank für die schnelle Hilfe!

Schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: Aeroschmelz am 28 Januar 2017, 22:25:57
Hallo,

gibt es irgendeinen Grund warum bei einigen Gridster Elementen die Header von oben herunter gezogen werden, siehe angehängtes Bild!

Grüsse
Marcus

Titel: Antw:FTUI 2.5
Beitrag von: setstate am 28 Januar 2017, 22:28:08
Wie sieht der code dazu aus? Irgend welche Extra-Klassen dran?
Titel: Antw:FTUI 2.5
Beitrag von: Aeroschmelz am 28 Januar 2017, 22:30:13
Hier mal der Code. Er wird aus einer index.html über das Einbinden eines Templates aufgerufen. Ich sehe da nichts außergewöhnliches, bin vielleicht aber auch betriebsblind ;-)

Aufruf:

<!-- ========= rechtes Wettermenü  =========  -->
<!-- =======================================  -->
<li data-row="2" data-col="8" data-sizex="1" data-sizey="4" data-template="menu_right_weather.html"></li>


Template:

<header>Wetter-Menü</header>

        <div data-type="pagebutton" data-color="#aa6900" data-url="index_weather.html" data-icon="oa-weather_cloudy" class="normal"></div>
        <div class="cell darker">Vorhersage</div>

        <div data-type="pagebutton" data-color="#aa6900" data-url="index_pollen.html" data-icon="oa-weather_pollen" class="normal"></div>
        <div class="cell darker">Pollen</div>
       
        <div data-type="pagebutton" data-color="#aa6900" data-url="index_weatherstatistik.html" data-icon="oa-weather_station" class="normal"></div>
        <div class="cell darker">Statistiken</div>
       
        <div data-type="popup" data-height="360px" data-width="890px" class="">
        <div data-type="switch" class="normal" data-icon="fa-line-chart"></div>
          <div class="dialog phone-width">
            <div class="center">
              <div id="container" data-type="meteogram" data-title="" data-location="XXXXXXX" data-device="dummy" style="width: 720px; height: 279px; margin: 0 0"></div>     
            </div>
          </div>
        </div>
        <div class="cell darker">Meteogram</div>
       
        <div data-type="popup" data-height="600px" data-width="800px" class="">
          <div data-type="symbol"
            data-device="Unwetterzentrale"
            data-get="WarnCount"
            data-icons='["mi-warning","mi-warning warn"]'
            data-on-colors='["#2A2A2A0","#aa6900"]'
            data-get-on='["0","1"]'
            data-on-background-color="#505050"
            data-background-icon="fa-circle"
            class="normal">
          </div>                                   
          <div class="dialog phone-width">
     <div class="top-space">
                 <div class="cell big">Unwetterwarnungen</div>
                 <div data-type="label" data-device="unwetterText" data-get="STATE" class="cell"></div>
       </div>
          </div>
        </div>
        <div class="cell darker">Warnungen</div>


Sehe gerade, dass es auch bei einem weiteren Gridster Element passiert.
Titel: Antw:FTUI 2.5
Beitrag von: paul79 am 28 Januar 2017, 23:25:43
Hallo,

jetzt geht bei mir nichts mehr, kein widget wird mehr gefunden.

Gruß Paul
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 29 Januar 2017, 00:09:40
ich traue mich gar nicht das Update zu machen, wenn ich das hier so sehe.... :-\

Zitat von: Aeroschmelz am 28 Januar 2017, 22:25:57
Hallo,

gibt es irgendeinen Grund warum bei einigen Gridster Elementen die Header von oben herunter gezogen werden, siehe angehängtes Bild!

Grüsse
Marcus
das war bei mir auch, ich hatte eine Warnmeldung und auch noch eine zweite auf einer anderen Seite, bei einer war der header herunter gezogen....
Ich weiß leider nicht mehr woran es lag, da ich einfach meinen anderen genommen habe und damit ging das..

Aber ich sehe du hast dort ein Popup drin, nimm mal die class raus so z.B. das center an der einen Stelle, denn bei mir war das auch in einem Zusammenhang mit einem Popup...
Zur Not schicke ich dir mal mein Popup und du vergleichst mal...
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 29 Januar 2017, 02:00:57
Zitat von: octek0815 am 26 Januar 2017, 15:31:08
Hast du ein Beispiel wie ich das jetzt nur mit push hin bekomme?
Ziel ist es, das das Icon in der Mitte den Status zwischen "Weiß" und "Rot" wechselt aufgrund eines Device-Readings.
Push drumherum ist für die Optik (Fadeeffekt) des Kreises und für den Warn (Anzahl offener Fenster aus einem anderen Reading) und zum auslösen des Dialogs.

Mit 2.4 klappte das mit meiner Verschachtelung wunderbar. Ich habe die Formatierung so wie du es beschrieben hast hinbekommen, jedoch wenn ich zwei solcher Widgets in der Anzeige habe, stimmt irgendwas mit dem zweiten Widget nicht. Eigentlich sollte beim Drücken des Push´s nur der äußere Kreis den Fade ausführen und der Dialog geht dann auf, aber leider wird sowohl der äußere Kreis als auch das Icon in der Mitte Orange. Beim ersten der Beiden Widgets funktioniert es wiederum wie gewünscht.

Nach Update sollte die Verschachteln nun wieder größentechnisch und für den Status passen


<div class="vbox">
    <div data-type="push" data-device="dummy1" data-set-on="up" data-set-off="stop" data-icon="">
        <div data-type="symbol" data-device="dummy2" data-on-color="red" data-off-color="white" data-icon="fa-rss"></div>
    </div>
     <div data-type="label" data-device="dummy2"></div>
</div>

Titel: Antw:FTUI 2.5
Beitrag von: Aeroschmelz am 29 Januar 2017, 07:44:04
Hi Moonsorrox,

danke für deine Info. Das Center hat es behoben, jetzt habe ich nur noch einen Header, der nicht oben verbleibt. Da verwende ich einen swiper allerdings ohne center ;-)

Zitat von: moonsorrox am 29 Januar 2017, 00:09:40
Aber ich sehe du hast dort ein Popup drin, nimm mal die class raus so z.B. das center an der einen Stelle, denn bei mir war das auch in einem Zusammenhang mit einem Popup...
Zur Not schicke ich dir mal mein Popup und du vergleichst mal...


<header>Wetterdaten</header>
<div class="normal"></div>
<div data-type="swiper" data-height="390px" data-width="720px" class="hashnav nopagination">
    <ul>
        <li data-hash="chart1"> 
            <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog","myDbLog"]'
            data-logfile='["HISTORY","HISTORY"]'
            data-columnspec='["Balkon:temperature","Balkon:humidity"]'
            data-style='["ftui l1","ftui l5fill"]'
            data-ptype='["lines","lines"]'
            data-uaxis='["primary","secondary"]'
            data-legend='["Temperatur","Luftfeuchte"]'
            data-yunit=" &deg;C"
            data-yunit_sec=" %"
                data-ytext="Temperatur"
                data-ytext_sec="Luftfeuchte"
            data-minvalue="auto"
            data-maxvalue="auto"
            data-minvalue_sec="auto"
                data-maxvalue_sec="auto"
                data-y_margin="5"
                data-yticks="auto"
            data-xticks="auto"
            data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>       
        </li>
        <li data-hash="chart2" class="noswipe">
            <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog","myDbLog"]'
            data-logfile='["HISTORY","HISTORY"]'
            data-columnspec='["Luminosity:luminosity","Luminosity:IR"]'
            data-style='["ftui l1","ftui l5fill"]'
            data-ptype='["lines","lines"]'
            data-uaxis='["primary","secondary"]'
            data-legend='["Lichtst&auml;rke VIS","Lichtst&auml;rke IR"]'
            data-yunit=" lx"
            data-yunit_sec=" lx"
                data-ytext="Lichtst&auml;rke VIS"
                data-ytext_sec="Lichtst&auml;rke IR"
            data-minvalue="auto"
            data-maxvalue="auto"
            data-y_margin="5"
                data-minvalue_sec="0"
                data-maxvalue_sec="100"
                data-y_margin_sec="5"
                data-yticks="auto"
            data-yticks_sec="auto"
                data-xticks="auto"
            data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>       
        </li>
        <li data-hash="chart3" class="noswipe">
            <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog"]'
            data-logfile='["HISTORY"]'
            data-columnspec='["Pressure:pressure-nn"]'
            data-style='["ftui l6fill"]'
            data-ptype='["histeps"]'
            data-uaxis='["primary"]'
            data-legend='["Luftdruck"]'
            data-yunit=" mbar"
                data-ytext="Luftdruck"
            data-minvalue="auto"
            data-maxvalue="auto"
                data-y_margin="10"
                data-yticks="auto"
            data-xticks="auto"
            data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>       
        </li>
        <li data-hash="chart4" class="noswipe">             
             <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog","myDbLog"]'
            data-logfile='["HISTORY","HISTORY"]'
            data-columnspec='["YahooWetter:wind_speed",""]'
            data-style='["ftui l1fill","ftui l5fill"]'
            data-ptype='["cubic","steps"]'
            data-uaxis='["primary","secondary"]'
            data-legend='["Wind",""]'
            data-yunit=" km/h"
            data-yunit_sec=" &deg;"
                data-ytext="Wind"
                data-ytext_sec="Windgeschwindigkeit"
            data-minvalue="0"
            data-maxvalue="auto"
            data-minvalue_sec="0"
                data-maxvalue_sec="auto"
                data-yticks="auto"
            data-xticks="auto"
            data-yticks_sec="auto"
                data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>
         </li>               
          <li data-hash="chart5" class="noswipe">
            <div class="noswipe container center"
               data-type="chart"
               data-logdevice='["lp","lp","lp","lp"]'
           data-logfile=="CURRENT"
               data-columnspec='["Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22rain_\\x22,$from,$to,0,\\x22day\\x22)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22chOfRain_\\x22,$from,$to,0,\\x22day\\x22)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22cloud_\\x22,$from,$to,0,\\x22day\\x22)","ConstY:0"]'
               data-style='["ftui l6fill","ftui l5fill","ftui l1fill","ftui l2fill"]'
               data-ptype='["steps","quadraticSmooth","quadratic","lines"]'
               data-uaxis='["primary","secondary","secondary","secondary"]'
               data-legend='["Regen","Regenwahr.","Wolkenbed.",""]'
               data-yunit="mm"
               data-ytext="Regen"
               data-minvalue="auto"
               data-maxvalue="auto"
               data-yunit_sec="%"
               data-ytext_sec="Wolkenbed. / Regenwahr."
               data-yticks="auto"
               data-minvalue_sec="0"
               data-maxvalue_sec="110"
          data-nofulldays="true"
               data-daysago_start = "0"
           data-daysago_end = "-4"
               data-crosshair="true"
               data-cursorgroup="1"
               data-scrollgroup="1"
               data-showlegend="true"
           data-xticks="auto"
               data-height="95%"
                data-width="98%">
            </div>                 
        </li>     
        <li data-hash="chart6" class="noswipe">
            <div class="noswipe container center"
               data-type="chart"
               data-logdevice='["lp","lp","lp","lp"]'
           data-logfile=="CURRENT"
               data-columnspec='["Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22rad\\x22,$from,$to,12)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22rad\\x22,$from,$to,12)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22sun\\x22,$from,$to,12)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22evapor\\x22,$from,$to,0,\\x22day\\x22)"]'
               data-style='["ftui l6","ftui l3","ftui l0fill","ftui l5fill","ftui l6"]'
               data-ptype='["quadraticSmooth","points","bars","steps"]'
               data-uaxis='["primary","primary","secondary","primary"]'
               data-legend='["UV-Index","","Sonnenein.","Verd."]'
               data-yunit=""
               data-ytext="Verdunstung / UV"
               data-yunit_sec="%"
               data-ytext_sec="Sonnenein."
               data-yticks="auto"
               data-minvalue="0"
               data-maxvalue="10"
               data-minvalue_sec="0"
               data-maxvalue_sec="110"
          data-nofulldays="true"
               data-daysago_start = "0"
           data-daysago_end = "-4"
               data-crosshair="true"
               data-cursorgroup="1"
               data-scrollgroup="1"
               data-showlegend="true"
           data-xticks="auto"
               data-height="95%"
                data-width="98%">
            </div>                 
        </li>       
     </ul>
</div>
<table width="100%">
<tr>
<td>
  <div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-thermometer-half"
        data-get-on="Temp"
        class="swipertab">
      </div>
        <div class="darker">Temperatur</div>
      </div>
</td>
<td>
<div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-lightbulb-o"
        data-get-on="Light"
        class="swipertab">
      </div>
      <div class="darker">Helligkeit</div>
     </div>
</td>
<td>
<div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-bar-chart"
        data-get-on="Druck"
        class="swipertab">
      </div>
      <div class="darker">Luftdruck</div>
      </div>
</td>
<td>
<div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="oa-weather_wind"
        data-get-on="Wind"
        class="swipertab">
      </div>
      <div class="darker">Wind</div>
     </div>
</td>
<td>
  <div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="oa-weather_rain_gauge"
        data-get-on="Regen"
        class="swipertab">
      </div>
      <div class="darker">Regen</div>
      </div>
</td>
<td>
  <div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-sun-o"
        data-get-on="Sonne"
        class="swipertab">
      </div>
      <div class="darker">Sonne</div>
      </div>
</td>
</tr>
</table>


Da scheint es irgendein Problem mit der Tabelle unten zu geben. Allerdings bekomme ich es das Layout mit einer hbox nicht hin, siehe Anhang.

Grüsse
Marcus


Titel: Abstand zwischen Grids verkleinern ?
Beitrag von: Simon74 am 29 Januar 2017, 11:21:08
Ich möchte den Abstand zwischen den einzelnen Grids verkleinern, laut Suche macht man dies direkt in der html Seite mit:
<meta name="widget_margin" content="1">
Das funktioniert zwar aber die ganze Seite bekommt Scrollbalken.

Kann bzw. Muss das in der aktuellen Version anders gelöst werden ?
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 29 Januar 2017, 12:36:01
dann mußt die diese höhe und auch weite anpassen: entweder weniger oder mehr je anch dem wie du die Seite aufbaust
<li data-row="3" data-col="3" data-sizex="8" data-sizey="5">
Ich z.B. nutze 14col und 10row
das sieht bei mir dann bei meinem 10" Tablet so aus
<meta name="widget_base_width" content="83">
<meta name="widget_base_height" content="72">
<meta name="widget_margin" content="4">

Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 29 Januar 2017, 13:30:12
@Aeroschmelz

Dein Layout sieht Hammer gut aus mit den Swipern, deshalb habe ich es mir mal vorgenommen und auch den Fehler gefunden... Ich glaube soetwas baue ich mir auch gefällt mir gut..  ;) :D

Also du mußt oben etwas raus nehmen und auch einbauen. Hier mal der komplette Code kannst ja mal drauf schauen ob du siehst was ich gemacht habe.
Ich habe nichts verändert an deinen Daten sollte also genauso funktionieren...!
(gib mit mal die zugehörigen dummys da brauche ich nicht lange herum basteln, anpassen muss ich es ja sowieso)


<header>Wetterdaten</header>
<div class="sheet">
<div class="row">
<div data-type="swiper" data-height="390px" data-width="720px" class="hashnav nopagination">
    <ul>
        <li data-hash="chart1">
            <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog","myDbLog"]'
            data-logfile='["HISTORY","HISTORY"]'
            data-columnspec='["Balkon:temperature","Balkon:humidity"]'
            data-style='["ftui l1","ftui l5fill"]'
            data-ptype='["lines","lines"]'
            data-uaxis='["primary","secondary"]'
            data-legend='["Temperatur","Luftfeuchte"]'
            data-yunit=" &deg;C"
            data-yunit_sec=" %"
                data-ytext="Temperatur"
                data-ytext_sec="Luftfeuchte"
            data-minvalue="auto"
            data-maxvalue="auto"
            data-minvalue_sec="auto"
                data-maxvalue_sec="auto"
                data-y_margin="5"
                data-yticks="auto"
            data-xticks="auto"
            data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>       
        </li>
        <li data-hash="chart2" class="noswipe">
            <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog","myDbLog"]'
            data-logfile='["HISTORY","HISTORY"]'
            data-columnspec='["Luminosity:luminosity","Luminosity:IR"]'
            data-style='["ftui l1","ftui l5fill"]'
            data-ptype='["lines","lines"]'
            data-uaxis='["primary","secondary"]'
            data-legend='["Lichtst&auml;rke VIS","Lichtst&auml;rke IR"]'
            data-yunit=" lx"
            data-yunit_sec=" lx"
                data-ytext="Lichtst&auml;rke VIS"
                data-ytext_sec="Lichtst&auml;rke IR"
            data-minvalue="auto"
            data-maxvalue="auto"
            data-y_margin="5"
                data-minvalue_sec="0"
                data-maxvalue_sec="100"
                data-y_margin_sec="5"
                data-yticks="auto"
            data-yticks_sec="auto"
                data-xticks="auto"
            data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>       
        </li>
        <li data-hash="chart3" class="noswipe">
            <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog"]'
            data-logfile='["HISTORY"]'
            data-columnspec='["Pressure:pressure-nn"]'
            data-style='["ftui l6fill"]'
            data-ptype='["histeps"]'
            data-uaxis='["primary"]'
            data-legend='["Luftdruck"]'
            data-yunit=" mbar"
                data-ytext="Luftdruck"
            data-minvalue="auto"
            data-maxvalue="auto"
                data-y_margin="10"
                data-yticks="auto"
            data-xticks="auto"
            data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>       
        </li>
        <li data-hash="chart4" class="noswipe">             
             <div class="noswipe container center"
                data-type="chart"
            data-device="myDbLog"
            data-logdevice='["myDbLog","myDbLog"]'
            data-logfile='["HISTORY","HISTORY"]'
            data-columnspec='["YahooWetter:wind_speed",""]'
            data-style='["ftui l1fill","ftui l5fill"]'
            data-ptype='["cubic","steps"]'
            data-uaxis='["primary","secondary"]'
            data-legend='["Wind",""]'
            data-yunit=" km/h"
            data-yunit_sec=" &deg;"
                data-ytext="Wind"
                data-ytext_sec="Windgeschwindigkeit"
            data-minvalue="0"
            data-maxvalue="auto"
            data-minvalue_sec="0"
                data-maxvalue_sec="auto"
                data-yticks="auto"
            data-xticks="auto"
            data-yticks_sec="auto"
                data-daysago_start="1"
            data-daysago_end="-1"
            data-crosshair="true"
            data-cursorgroup="1"
            data-scrollgroup="1"
            data-showlegend="true"
                data-xticks="auto"
                data-height="95%"
                data-width="98%">
            </div>
         </li>               
          <li data-hash="chart5" class="noswipe">
            <div class="noswipe container center"
               data-type="chart"
               data-logdevice='["lp","lp","lp","lp"]'
           data-logfile=="CURRENT"
               data-columnspec='["Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22rain_\\x22,$from,$to,0,\\x22day\\x22)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22chOfRain_\\x22,$from,$to,0,\\x22day\\x22)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22cloud_\\x22,$from,$to,0,\\x22day\\x22)","ConstY:0"]'
               data-style='["ftui l6fill","ftui l5fill","ftui l1fill","ftui l2fill"]'
               data-ptype='["steps","quadraticSmooth","quadratic","lines"]'
               data-uaxis='["primary","secondary","secondary","secondary"]'
               data-legend='["Regen","Regenwahr.","Wolkenbed.",""]'
               data-yunit="mm"
               data-ytext="Regen"
               data-minvalue="auto"
               data-maxvalue="auto"
               data-yunit_sec="%"
               data-ytext_sec="Wolkenbed. / Regenwahr."
               data-yticks="auto"
               data-minvalue_sec="0"
               data-maxvalue_sec="110"
          data-nofulldays="true"
               data-daysago_start = "0"
           data-daysago_end = "-4"
               data-crosshair="true"
               data-cursorgroup="1"
               data-scrollgroup="1"
               data-showlegend="true"
           data-xticks="auto"
               data-height="95%"
                data-width="98%">
            </div>                 
        </li>     
        <li data-hash="chart6" class="noswipe">
            <div class="noswipe container center"
               data-type="chart"
               data-logdevice='["lp","lp","lp","lp"]'
           data-logfile=="CURRENT"
               data-columnspec='["Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22rad\\x22,$from,$to,12)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22rad\\x22,$from,$to,12)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22sun\\x22,$from,$to,12)","Func:logProxy_proplanta2Plot(\\x22AgroWeather\\x22,\\x22evapor\\x22,$from,$to,0,\\x22day\\x22)"]'
               data-style='["ftui l6","ftui l3","ftui l0fill","ftui l5fill","ftui l6"]'
               data-ptype='["quadraticSmooth","points","bars","steps"]'
               data-uaxis='["primary","primary","secondary","primary"]'
               data-legend='["UV-Index","","Sonnenein.","Verd."]'
               data-yunit=""
               data-ytext="Verdunstung / UV"
               data-yunit_sec="%"
               data-ytext_sec="Sonnenein."
               data-yticks="auto"
               data-minvalue="0"
               data-maxvalue="10"
               data-minvalue_sec="0"
               data-maxvalue_sec="110"
          data-nofulldays="true"
               data-daysago_start = "0"
           data-daysago_end = "-4"
               data-crosshair="true"
               data-cursorgroup="1"
               data-scrollgroup="1"
               data-showlegend="true"
           data-xticks="auto"
               data-height="95%"
                data-width="98%">
            </div>                 
        </li>       
     </ul>
</div>
<table width="100%">
<tr>
<td>
  <div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-thermometer-half"
        data-get-on="Temp"
        class="swipertab">
      </div>
        <div class="darker">Temperatur</div>
      </div>
</td>
<td>
<div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-lightbulb-o"
        data-get-on="Light"
        class="swipertab">
      </div>
      <div class="darker">Helligkeit</div>
     </div>
</td>
<td>
<div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-bar-chart"
        data-get-on="Druck"
        class="swipertab">
      </div>
      <div class="darker">Luftdruck</div>
      </div>
</td>
<td>
<div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="oa-weather_wind"
        data-get-on="Wind"
        class="swipertab">
      </div>
      <div class="darker">Wind</div>
     </div>
</td>
<td>
  <div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="oa-weather_rain_gauge"
        data-get-on="Regen"
        class="swipertab">
      </div>
      <div class="darker">Regen</div>
      </div>
</td>
<td>
  <div class="vbox top-space">
      <div data-type="switch"
        data-device="WetterChartDummy"
        data-get-off="!on"
        data-set-off=""
        data-icon="fa-sun-o"
        data-get-on="Sonne"
        class="swipertab">
      </div>
      <div class="darker">Sonne</div>
      </div>
</td>
</tr>
</table>

</div>
</div>
Titel: Antw:FTUI 2.5
Beitrag von: Aeroschmelz am 29 Januar 2017, 14:44:37
Super, das funktioniert. danke. Hier der Dummy


define WetterChartDummy dummy
attr WetterChartDummy room System
attr WetterChartDummy webCmd Temp:Light:Druck:Wind:Regen:Sonne
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 29 Januar 2017, 14:54:02
bei mir meckert er immer rum das er die jeweiligen Charts nicht findet in der Form... muss ich da noch etwas beachten, die Charts werden doch angelegt und meine Werte sind auch drin..!
:-\

z.B so oder es steht eben auch drin chart2, chart6 usw.
Error
jquery.min.js:2
Error: Syntax error, unrecognized expression: File not found: ./www/tablet//chart3
Titel: Antw:FTUI 2.5
Beitrag von: Aeroschmelz am 29 Januar 2017, 15:44:00
Ne leider nicht. Ich suche noch mal. Kanne es eventuell am data-hash liegen?


<li data-hash="chart1">
Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 29 Januar 2017, 15:56:31
Hey, wenn ich früher auf meinem iPad meine FTUI seite auf dem Homescreen abgelegt habe, hat er mir die beim öffnen quasi nicht im browser geöffnet sondern im full screen.

Seit dem Update öffnet er allerdings automatisch Safari. Kann ich das wieder umschalten?
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 29 Januar 2017, 16:06:29
Wie gesagt, ihr müsst nicht alles aus dem Header schmeißen, nur weil ich geschrieben habe, so könnte eine Minimalvariante als Header aussehen.

Für die Homescreen-Fullscreen-App-Funktionialität bedarf es bestimmt dieses Hinweises im Header

<meta name="apple-mobile-web-app-capable" content="yes">
Titel: Antw:FTUI 2.5
Beitrag von: cotecmania am 29 Januar 2017, 16:56:52
Hi nochmals,

Wie kann man die Zeilenabstaende in einem sheet>row>cell verkleinern ?

https://forum.fhem.de/index.php/topic,65604.msg569158.html#msg569158 (https://forum.fhem.de/index.php/topic,65604.msg569158.html#msg569158)

Gruss
Joe

Titel: Antw:FTUI 2.5 Bug ?
Beitrag von: Simon74 am 29 Januar 2017, 17:09:17
Ist noch niemandem aufgefallen das das laden in Fully-Browser bzw. Webviewcontrol oft nur mit der URL zu tun hat (abschliessender Slash) ?

Hier bekomme ich nur einen weissen Bilschirminhalten mit allen Überschriften der Grids angezeigt.
<a href="/fhem/ftui">Tablet-UI<br></a>

So wird die Seite vollständig geladen:
<a href="/fhem/ftui/">Tablet-UI<br></a>

:o
Titel: Antw:FTUI 2.5
Beitrag von: Ralf.E am 29 Januar 2017, 17:25:08
Beim Anpassen einer Seite ist mir gerade aufgefallen, dass der folgende Header:

<li data-row="4" data-col="3" data-sizex="2" data-sizey="1">
    <header class="large orange">ARBEITSZIMMER</header>
</li>


mit einer kleineren Schriftgröße im Vergleich zu:

<li data-row="2" data-col="3" data-sizex="2" data-sizey="1">
    <header class="orange" style="font-size:125%">WOHNZIMMER ANGI</header>
</li>


dargestellt wird. "large" ist als

.large {
    font-size: 125%;
}


definiert. Kann mir jemand erläutern was hier den Unterschied bedingt?

Gruß Ralf

Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 29 Januar 2017, 17:55:01
Zitat von: setstate am 29 Januar 2017, 16:06:29
Wie gesagt, ihr müsst nicht alles aus dem Header schmeißen, nur weil ich geschrieben habe, so könnte eine Minimalvariante als Header aussehen.

Für die Homescreen-Fullscreen-App-Funktionialität bedarf es bestimmt dieses Hinweises im Header

<meta name="apple-mobile-web-app-capable" content="yes">

Funktioniert leider nicht, vorher hatte ich da auch nix anderes drin...
da war es dann "it's not a bug it's a feature"
Titel: Antw:FTUI 2.5
Beitrag von: Wiesel am 29 Januar 2017, 17:58:50
Hallo,

ich habe zwei Tablet-UI's definiert. einmal für das Tablet und für das Smartphone.
Ich habe bei der Seite für das Smartphone auf die Ordner css, fonts, js und lib  vom Tablet verlinkt, da nur diese geupdated werden.

Mit dem dynamic load funktioniert das ganze nun nicht mehr. Es wird im Ordner des Smartphone UI gesucht, aber dort befinden sich diese nicht.

Wie kann ich das denn nun wieder "umstellen" ?

So sieht meine Index.html aus


<meta name='lang' content='de'>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="widget_base_width" content="74">
    <meta name="widget_base_height" content="71">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="gridster_disable" content="1">
    <meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
    <meta name="debug" content="6"> <!-- verbose level 1-6 = output to console;0 = not output -->
    <meta http-equiv="Cache-Control" content="no-store" />
<meta name='toast' content='1'>
<meta name="fhemweb_url" content="/fhem">
<meta name="widget_dir" content="../tablet/js">

    <link rel="stylesheet" href="../tablet/lib/jquery.gridster.min.css" />
    <link rel="stylesheet" href="../tablet/css/fhem-tablet-ui.css" />
    <link rel="stylesheet" href="../tablet/css/fhem-mobil-ui.css" />
    <link rel="stylesheet" href="../tablet/lib/font-awesome.min.css" />
    <link rel="stylesheet" href="../tablet/lib/jquery.toast.min.css" />

    <!-- define your personal style here, it wont be overwritten  -->
<link rel="stylesheet" href="../tablet/css/fhem-tablet-ui-user.css" />
<link rel="stylesheet" href="../tablet/lib/openautomation.css" />
<link rel="stylesheet" href="../tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="../tablet/lib/material-icons.min.css" />


    <script src="../pgm2/jquery.min.js"></script>
<script src="../pgm2/jquery-ui.min.js"></script>
    <script src="../tablet/lib/jquery.toast.min.js"></script>
    <script src="../tablet/lib/jquery.gridster.min.js"></script>
<script src="../tablet/lib/jquery.knob.mod.min.js"></script>
<script src="../tablet/lib/jquery.circlemenu.js"></script>
<script src="../tablet/lib/powerange.min.js"></script>
<script src="../tablet/lib/fa-multi-button.min.js"></script>
    <script src="../tablet/js/fhem-tablet-ui.js"></script>


Und hier die Consolenausgabe

Filename:
fhem-tablet-ui.js:1406 FHEM dir: /fhem
fhem-tablet-ui.js:1406 dynamic load file:lib/jquery.toast.min.js / async:false
fhem-tablet-ui.js:1406 initPage - area=
fhem-tablet-ui.js:1406 Object {modules: Array[0]}
fhem-tablet-ui.js:1406 Object {modules: Array[0]}
fhem-tablet-ui.js:1406 initWidgets - area=
fhem-tablet-ui.js:1406 Load widget : link
fhem-tablet-ui.js:1406 Create widget : link
fhem-tablet-ui.js:1406 dynamic load file:js/widget_link.js / async:true
fhem-tablet-ui.js:1406 Load widget : slideout
fhem-tablet-ui.js:1406 Create widget : slideout
fhem-tablet-ui.js:1406 dynamic load file:js/widget_slideout.js / async:true
fhem-tablet-ui.js:1406 Load widget : clock
fhem-tablet-ui.js:1406 Create widget : clock
fhem-tablet-ui.js:1406 dynamic load file:js/widget_clock.js / async:true
fhem-tablet-ui.js:1406 init templates - Done
widget_link.js:1 Uncaught SyntaxError: Unexpected identifier
fhem-tablet-ui.js:1406 dynamic load done:js/widget_link.js
fhem-tablet-ui.js:1406 function depends_link not found (maybe ok)
fhem-tablet-ui.js:1406 Failed to create widget: link
widget_slideout.js:1 Uncaught SyntaxError: Unexpected identifier
fhem-tablet-ui.js:1406 dynamic load done:js/widget_slideout.js
fhem-tablet-ui.js:1406 function depends_slideout not found (maybe ok)
fhem-tablet-ui.js:1406 Failed to create widget: slideout
widget_clock.js:1 Uncaught SyntaxError: Unexpected identifier
fhem-tablet-ui.js:1406 dynamic load done:js/widget_clock.js
fhem-tablet-ui.js:1406 function depends_clock not found (maybe ok)
fhem-tablet-ui.js:1406 Failed to create widget: clock
fhem-tablet-ui.js:1406 initWidgets - Done
fhem-tablet-ui.js:580 initPage: 180.883ms
fhem-tablet-ui.js:1406 start shortpoll in (ms):500
jquery.toast.min.js:1 Uncaught SyntaxError: Unexpected identifier



Grüße
Wiesel
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 29 Januar 2017, 18:09:28
Zitat von: Ralf.E am 29 Januar 2017, 17:25:08
Beim Anpassen einer Seite ist mir gerade aufgefallen, dass der folgende Header:

<li data-row="4" data-col="3" data-sizex="2" data-sizey="1">
    <header class="large orange">ARBEITSZIMMER</header>
</li>


mit einer kleineren Schriftgröße im Vergleich zu:

<li data-row="2" data-col="3" data-sizex="2" data-sizey="1">
    <header class="orange" style="font-size:125%">WOHNZIMMER ANGI</header>
</li>


dargestellt wird. "large" ist als

.large {
    font-size: 125%;
}


definiert. Kann mir jemand erläutern was hier den Unterschied bedingt?

Gruß Ralf

Wenn man in die Entwicklertools schaut, sieht man, dass das ".gridster li header" höhere Priorität bekommt, als das ".large". Das liegt an der höheren Anzahl von Elementen im Selector. ".gridster li header" ist eine genauere, bestimmtere Angabe als die ".large". Deshalb siegt der Wert aus der Header Definition. Der Wert von .large ist durchgestrichen, wird nicht benutzt.
Man müsste der ".large" Definition ein "!important" hinten dran stellen, damit es gewinnt. Ein direktes style Attribute gewinnt auch immer.

Ich werde jetzt alle FTUI Größen auf !important setzen.
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 29 Januar 2017, 18:20:28
Zitat von: Wiesel am 29 Januar 2017, 17:58:50
Hallo,

ich habe zwei Tablet-UI's definiert. einmal für das Tablet und für das Smartphone.
Ich habe bei der Seite für das Smartphone auf die Ordner css, fonts, js und lib  vom Tablet verlinkt, da nur diese geupdated werden.

Mit dem dynamic load funktioniert das ganze nun nicht mehr. Es wird im Ordner des Smartphone UI gesucht, aber dort befinden sich diese nicht.

Wie kann ich das denn nun wieder "umstellen" ?

So sieht meine Index.html aus


Ich würde die Links zu den originalen js und css Ordnern im Filesystem per symbolischen Link machen (ln -s)

Im Header dann immer nur relativ zur aufgerufenen HTML Datei: <script src="js/fhem-tablet-ui.js" defer></script>
Titel: Antw:FTUI 2.5
Beitrag von: Wiesel am 29 Januar 2017, 19:12:11
Zitat von: setstate am 29 Januar 2017, 18:20:28
Ich würde die Links zu den originalen js und css Ordnern im Filesystem per symbolischen Link machen (ln -s)

Im Header dann immer nur relativ zur aufgerufenen HTML Datei: <script src="js/fhem-tablet-ui.js" defer></script>
Die Antwort ist oft so einfach. Ich probiere es direkt aus und gebe dann Rückmeldung.


EDIT:
Hat Funktioniert. Vielen Dank nochmal. Du machst hier echt eine Top Arbeit :-)

Grüße
Wiesel
Titel: Antw:FTUI 2.5
Beitrag von: Jojo11 am 29 Januar 2017, 19:24:43
Hallo,

das Meiste läuft jetzt wieder  ::)
Bei der mobilen Version mit slide-out links habe ich jetzt ewig viel Platz links neben dem icon (und icons/Text sind kleiner). Wie/wo kann ich darauf denn Einfluss nehmen? Die 256 px Breite des slide-outs habe ich schon mal gefunden...

[edit]
Ein left-space in den links hat schon mal geholfen - auch wenn man das Gegenteil erwarten würde  ???

schöne Grüße
Jo
Titel: Antw:FTUI 2.5
Beitrag von: Garbsen am 29 Januar 2017, 21:50:09
Wenn ich die Rückmeldungen zu 2.5 lese, möchte ich natürlich einerseits gerne updaten, andererseits, mir aber meine mühsam geschaffene Oberfläche nicht zerschießen. Ich würde für notwendige Anpassungen wohl eine Weile brauchen, da ich nur unregelmäßig und insgesamt zu wenig Zeit habe.
Kann mir jemand sagen, welche Dateien / Ordner ich vor dem Update sichern muss?
Meine Überlegung ist, die neuen Versionen dann umzubenennen und die alten zunächst zurück zu sichern, um mit den neuen Versionen Dann parallel zu arbeiten
Titel: Antw:FTUI 2.5
Beitrag von: h3llsp4wn am 29 Januar 2017, 22:06:23
Habe meine Tablet-Oberfläche jetzt umgestellt, dabei auch mit der mobilen angefangen. Jetzt habe ich aber ein komisches Problem festgestellt. Buttons sind quasi überall klickbar, d.h. nicht nur der Button selbst, sondern auch das Elternelement (d.h. der DIV in dem der Button ist oder die Tabellenzelle). Das ist ziemlich nervig, da so ziemlich jeder "klick" ins leere eine Aktion triggert?

Was muss ich tun, um dieses Verhalten abzustellen? So kann ich nicht auf die 2.5 ... fällt natürlich nicht auf, wenn man immer auf die Buttons klickt, aber wenn man z.B. zwei Zellen nebeneinander hat - mit abstand und in die freie Mitte klickt, dann wir auch ausgelöst ....

Habe mal eine Screenshot angehängt ... der ganze Balken ist "klickbar" ... ich fürchte hier werden die klickbaren Bereicht direkt mit skaliert ....
Titel: Antw:FTUI 2.5
Beitrag von: PatrickR am 29 Januar 2017, 23:36:32
Mahlzeit!

Jetzt hat es mich wieder erwischt. Seit dem Update heute sind die Checkboxen verschwunden:


      <div class="row left-space right-space top-space" style="height: 35px">
        <div data-type="label" class="big inline left bottom">Eiswürfelmaschine</div>
        <div
          data-type="checkbox"
          data-device="OG.KU.Eiswuerfelmaschine"
          data-get = "ice"
          class="inline right"
        ></div>
      </div>


Patrick
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 30 Januar 2017, 01:02:14
Zitat von: h3llsp4wn am 29 Januar 2017, 22:06:23
Habe meine Tablet-Oberfläche jetzt umgestellt, dabei auch mit der mobilen angefangen. Jetzt habe ich aber ein komisches Problem festgestellt. Buttons sind quasi überall klickbar, d.h. nicht nur der Button selbst, sondern auch das Elternelement (d.h. der DIV in dem der Button ist oder die Tabellenzelle). Das ist ziemlich nervig, da so ziemlich jeder "klick" ins leere eine Aktion triggert?

Was muss ich tun, um dieses Verhalten abzustellen? So kann ich nicht auf die 2.5 ... fällt natürlich nicht auf, wenn man immer auf die Buttons klickt, aber wenn man z.B. zwei Zellen nebeneinander hat - mit abstand und in die freie Mitte klickt, dann wir auch ausgelöst ....

Habe mal eine Screenshot angehängt ... der ganze Balken ist "klickbar" ... ich fürchte hier werden die klickbaren Bereicht direkt mit skaliert ....

Das ist ein sehr guter Hinweis. Das musste noch angepasst werden. Update ist erfolgt
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 30 Januar 2017, 02:03:28
Zitat von: Garbsen am 29 Januar 2017, 21:50:09
Wenn ich die Rückmeldungen zu 2.5 lese, möchte ich natürlich einerseits gerne updaten, andererseits, mir aber meine mühsam geschaffene Oberfläche nicht zerschießen. Ich würde für notwendige Anpassungen wohl eine Weile brauchen, da ich nur unregelmäßig und insgesamt zu wenig Zeit habe.
Kann mir jemand sagen, welche Dateien / Ordner ich vor dem Update sichern muss?
Meine Überlegung ist, die neuen Versionen dann umzubenennen und die alten zunächst zurück zu sichern, um mit den neuen Versionen Dann parallel zu arbeiten

du brauchst nur deinen Ordner /tablet umzubennen /tablet_meiner und den gleichen als /tablet nehmen, dann macht er das Update ja immer in /tablet.
So nutze ich immer mal zum probieren mehrer Ordner die ich einfach nur umbenenne
/tablet_x
/tablet_y

usw.
Titel: FTUI 2.5 & PageTab
Beitrag von: stauraum am 30 Januar 2017, 09:24:01
Hallo zusammen,

nachdem letzte Woche das FTUI auf 2.5 angehoben wurde, habe ich mich entschlossen, nochmal komplett neu aufzubauen.

Mit PageTab habe ich allerdings ein optisches Problem. Auf der ersten Seite wird das Menu noch ordentlich angezeigt. Schalte ich aber auf die zweite Seite, zieht er das Menü ewig in die Breite. Mit den zusätzlichen Metas hab ich es schon versucht, aber irgendwie greift das nicht. Steht das Menu alleine auf einer Seite, nimmt es gar die gesamte Seite in Anspruch. Vllt. habt ihr einen Tip, wo genau ich was falsch mache bzw. wie ich das Menu auf eine Feste breite einstelle?

Danke & VG
stauraum

Menu:

<html>
<body>
    <header>MENU</header>
    <div class="cell">
        <div data-type="pagetab" data-url="./ksc/sub1.html"  data-icon="fa-home" class="top-space"></div>
        <div data-type="pagetab" data-url="./ksc/sub2.html"  data-icon="fa-film" class="top-space"></div>
        <div data-type="pagetab" data-url="./ksc/sub3.html"  data-icon="fa-cutlery" class="top-space"></div>
        <div data-type="pagetab" data-url="./ksc/sub4.html"  data-icon="fa-bed" class="top-space"></div>
        <div data-type="pagetab" data-url="./ksc/sub5.html"  data-icon="fa-line-chart" class="top-space"></div>
        <!-- <div data-type="clock" data-format="H:i"></div> -->
</div>
</body>
</html>


sub1.html

<!DOCTYPE html>
<html>

<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.5.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2017 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define TABLETUI HTTPSRV ftui ./www/tablet Tablet' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <meta name="gridster_cols" content="12">
    <meta name="gridster_rows" content="9">
    <meta name="widget_base_width" content="116">
    <meta name="widget_base_height" content="131">


    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="css/fhem-green-ui.css" / -->
    <!-- link rel="stylesheet" href="css/fhem-tablet-ui-user.css" / -->

    <script src="js/fhem-tablet-ui.js" defer></script>

    <title>FHEM-Tablet-UI</title>
</head>

<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="9" data-template="./ksc/menu.html"></li>
<!-- ANWESENHEIT -->
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">


sub2.html

<!DOCTYPE html>
<html>

<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.5.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2017 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define TABLETUI HTTPSRV ftui ./www/tablet Tablet' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <meta name="gridster_cols" content="12">
    <meta name="gridster_rows" content="9">
    <meta name="widget_base_width" content="116">
    <meta name="widget_base_height" content="131">


    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="css/fhem-green-ui.css" / -->
    <!-- link rel="stylesheet" href="css/fhem-tablet-ui-user.css" / -->

    <script src="js/fhem-tablet-ui.js" defer></script>

    <title>FHEM-Tablet-UI</title>
</head>

<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="9" data-template="./ksc/menu.html"></li>
<!-- WOHNZIMMER -->
Titel: Antw:FTUI 2.5
Beitrag von: Garbsen am 30 Januar 2017, 10:15:43
Zitat von: moonsorrox am 30 Januar 2017, 02:03:28
du brauchst nur deinen Ordner /tablet umzubennen /tablet_meiner und den gleichen als /tablet nehmen, dann macht er das Update ja immer in /tablet.
So nutze ich immer mal zum probieren mehrer Ordner die ich einfach nur umbenenne
/tablet_x
/tablet_y

usw.

Danke, dachte es mir so, war aber nicht sicher, ob noch andere Dateien außerhalb dieses Ordners betroffen sind
Titel: Antw:FTUI 2.5
Beitrag von: Thyraz am 30 Januar 2017, 12:18:40
Nachdem mein automatisches FTUI Update irgendwie nicht mehr funktioniert hat,
hab ich gestern von 2.2 auf 2.5 geupdated.

Bis auf die runden Ecken, welche ich den Gridster Boxen gegeben hatte, sieht alles noch aus wie vorher. :)

Danke für deine andauernden Bemühungen FTUI zu verbessern setstate.
Die Aktualisierung der Daten ist schon seit längerem super stabil geworden und FTUI ein echter Gewinn für die eigene Smarthome Installation.
Titel: Antw:FTUI 2.5
Beitrag von: Garbsen am 30 Januar 2017, 14:17:40
Auch von mir kurzes Feedback, war nach ein paar Fehlermeldungen hier zu 2.5 etwas zurückhaltend, habe dann heute nach Sicherung des Tablet Ordners das Update gefahren: alles problemlos, sieht alles so aus wie zuvor.
Werde dann mal in einer Testumgebung die vielfältigen Änderungen ausprobieren.
Danke an die Entwickler hier, die für stetige Verbesserungen sorgen.
Titel: Antw:FTUI 2.5
Beitrag von: Animal64 am 30 Januar 2017, 15:24:21
Hi Setstate,

Many thanks for your FTUI work. I recently started migrating my pgm2 site to FTUI and it starts looking much more modern and crisp. I ran also into a few things I cannot directly solve.
1) I 'd like to have the labels under my switch widgets a bit closer to the icon. I tried to use compressed but then my icon is not centered anymore and the background icon still is.
2) I 'd like to change the color of the plot lines in my charts. I tried to do this in my fhem-tablet-ui-user.css but these changes get overwritten by ftui_chart.css, how can I do this (other then editing ftui_chart).
3) related to above if I do change plotline color (in ftui_chart) the fill style remains the same. Is there an option to change fillcolor based on plotline color.

Many thanks,
Rene
BTW you can answer in German (I can read not write) for the benefit of the others in the forum here.
Titel: Antw:FTUI 2.5
Beitrag von: h3llsp4wn am 30 Januar 2017, 15:46:44
ZitatDas ist ein sehr guter Hinweis. Das musste noch angepasst werden. Update ist erfolgt

@setstate: Danke für den schnellen Fix - soweit ok - nur beim widget_button ist das Problem nach Update noch immer vorhanden, d.h. zu großer "klickbarer" Bereich.
Titel: Antw:FTUI 2.5
Beitrag von: C0mmanda am 30 Januar 2017, 17:05:56
Moinsen,

Wenn ich für das Thermostat die Vergrößerung definiere wird das Thermostat leider durch benachbarte Felder verdeckt.
Dei Anzeige der Temperatur welche ich gerade einstelle wandert auch von oben links nach unten links und wird dann natürlich von der Hand verdeckt.

Kann man da was machen?

Ansonsten: Tolle Arbeit! Vielen Dank dafür.

grtz
Titel: Antw:FTUI 2.5
Beitrag von: sinus61 am 30 Januar 2017, 18:17:00
Zitat von: Animal64 am 30 Januar 2017, 15:24:21
1) I 'd like to have the labels under my switch widgets a bit closer to the icon.

You may try class="top-narrow" for the label.
Titel: Antw:FTUI 2.5
Beitrag von: Animal64 am 30 Januar 2017, 19:38:15
Thanks,
I tried the suggested top-narrow but then the top widget overlaps with header and somehow the other widgets are not evenly distributed in the column. Also, I wanted the labels closer to the widget under which they are placed not closer to the following widget. But you got me thinking and I tried bottom-narrow but that didn't do anything, height-narrow improved the situation already quite a bit but not enough. Is this jquery or ftui or can I specify it in css?
Rene
Titel: Antw:FTUI 2.5
Beitrag von: PatrickR am 30 Januar 2017, 20:25:30
Mahlzeit!

Kurze Info an die Mitstreiter. Seit dem heutigen Update scheint FTUI die JavaScripts (und ggf. weitere Dateien) unterhalb des Ordners zu erwarten, in dem auch die entsprechenden HTML-Dateien liegen, unabhängig davon, ob die Skripte explizit mit korrekten Pfaden eingebunden wurden.

/Edit:
Habe das Problem durch zwei Symlinks gelöst:

js -> ../tablet/js
lib -> ../tablet/lib/
fonts -> ../tablet/fonts/

Dafür sind meine Checkboxen wieder da. 8)

Nun kann ich mich einer Problematik zuwenden, die schon seit 2.4 auftaucht. Ich hole auf.

Patrick
Titel: Antw:FTUI 2.5
Beitrag von: h3llsp4wn am 30 Januar 2017, 20:59:59
erledigt.
Titel: Antw:FTUI 2.5
Beitrag von: zap am 30 Januar 2017, 21:28:26
Zitat von: PatrickR am 30 Januar 2017, 20:25:30
Mahlzeit!

Kurze Info an die Mitstreiter. Seit dem heutigen Update scheint FTUI die JavaScripts (und ggf. weitere Dateien) unterhalb des Ordners zu erwarten, in dem auch die entsprechenden HTML-Dateien liegen, unabhängig davon, ob die Skripte explizit mit korrekten Pfaden eingebunden wurden.

/Edit:
Habe das Problem durch zwei Symlinks gelöst:

js -> ../tablet/js
lib -> ../tablet/lib/
fonts -> ../tablet/fonts/

Dafür sind meine Checkboxen wieder da. 8)

Nun kann ich mich einer Problematik zuwenden, die schon seit 2.4 auftaucht. Ich hole auf.

Patrick

Und das wo ich die Trümmer vom letzten Update noch nicht beseitigt habe. Es wird Zeit für Alternativen. Hab keine Lust mehr auf das Gebastel
Titel: Antw:FTUI 2.5
Beitrag von: PatrickR am 30 Januar 2017, 21:30:31
Mahlzeit!

Noch ein kleines Problem mit circlemenu seit Version 2.5:

<div style="margin-left: -5px;">
  <div data-type="circlemenu" class="circlemenu noshade">
    <ul class="menu">
      <li><div data-type="push" data-icon="fa-wrench"></div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="statusRequest" data-icon="fa-info">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="cleanHouse" data-icon="fa-recycle">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="cleanSpot 250 250" data-icon="fa-circle">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="cleanStop" data-icon="fa-hand-stop-o">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="idle" data-icon="fa-hourglass">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="playSound 3" data-icon="fa-bell">
      </div></li>
    </ul>
  </div>
</div>
</li>


Danke im voraus.

Patrick
Titel: Antw:FTUI 2.5
Beitrag von: ih-sqeezer am 30 Januar 2017, 21:57:10
Hallo,

seit v2.5 besteht noch ein Problem mit dem "HeatingControl" bzw dem "wdtimer":

<div data-type="classchanger"
    data-device="HeatingControlStateWork"
    data-get="state"
    data-get-on="on"
    data-off-class="hide"
    data-on-class="" >
<div id="wdtimer_ftui"
data-type="wdtimer"
data-device="WohnzimmerHeatingControlWork"   
data-style="round"
data-theme="custom"
data-width="800"
data-height="600"
data-title="Wohnzimmer - Heizzeiten"
data-savecfg="true"
data-cmdlist='{"4.5°C off":"off","15°C Eco":"eco","18°C":"18.0","20°C":"20.0","22°C Komfort":"comfort"}'>
<div data-type="push"
data-off-color="#808080"
data-off-background-color="#3D4C66"
data-icon="fa-wrench"
class="big">
</div>
<div class="">Programm
</div>
</div>
</div>


Titel: Antw:FTUI 2.5
Beitrag von: setstate am 30 Januar 2017, 22:18:00
Zitat von: PatrickR am 30 Januar 2017, 21:30:31
Mahlzeit!

Noch ein kleines Problem mit circlemenu seit Version 2.5:

<div style="margin-left: -5px;">
  <div data-type="circlemenu" class="circlemenu noshade">
    <ul class="menu">
      <li><div data-type="push" data-icon="fa-wrench"></div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="statusRequest" data-icon="fa-info">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="cleanHouse" data-icon="fa-recycle">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="cleanSpot 250 250" data-icon="fa-circle">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="cleanStop" data-icon="fa-hand-stop-o">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="idle" data-icon="fa-hourglass">
      </div></li>
      <li><div data-type="push" data-device="OG.WO.VR100"
        data-set-on="playSound 3" data-icon="fa-bell">
      </div></li>
    </ul>
  </div>
</div>
</li>


Danke im voraus.

Patrick

<ul class="menu"> ist alter Style.

Es muss ohne class sein
<ul>
Titel: Antw:FTUI 2.5
Beitrag von: ih-sqeezer am 30 Januar 2017, 22:31:27
Hallo noch mal,
leider gibt es wohl auch noch ein Problem mit der "www/mobile" Variante. Diese habe ich parallel zu "www/tablet/" drauf. Lief bisher immer ohne Probleme. Jedoch ab v2.5 mit dem neusten Update nicht mehr  :(
Ich habe auch schon auf das tablet Verzeichnis in den jeweiligen html Dateien der mobile Version verwiesen, leider ohne Erfolg. Weiterhin hat auch cie SoftLink-Variante nichts gebracht.

Folgende Fehler bekomme ich in der Konsole:

SyntaxError: missing ; before statement[Weitere Informationen]  jquery.toast.min.js:1:5
SyntaxError: missing ; before statement[Weitere Informationen]  widget_pagetab.js:1:5

Es wird lediglich der Hintergrund angezeigt, sonst kein einziges widget.

Danke schon mal im Voraus.

Grüße,
Ingo
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 30 Januar 2017, 23:22:07
Zitat von: PatrickR am 30 Januar 2017, 21:30:31
Mahlzeit!

Noch ein kleines Problem mit circlemenu seit Version 2.5:

das hatte ich auch ganz kurz habe dann meine Circlemenü neu gemacht und schon war es weg, ich hänge dir mal meines ran,kannst ja mal anpassen und schauen ob es weg ist.
<div class="cell narrow circlemenu"
data-type="circlemenu"
data-circle-radius="60"
data-direction="left-half"
data-colors="lightgray">
<ul>
<li>
<div data-type="symbol"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="fa-server">
                    </div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_server.html" data-icon="oa-it_server"></div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_batterien.html" data-icon="oa-measure_battery_100"></div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_netzwerk.html" data-icon="oa-it_network"></div>
</li>
</ul>
</div>
<div class="cell medium silver top-align" data-type="label">System</div>
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 31 Januar 2017, 07:09:39
Zitat von: zap am 30 Januar 2017, 21:28:26
Und das wo ich die Trümmer vom letzten Update noch nicht beseitigt habe. Es wird Zeit für Alternativen. Hab keine Lust mehr auf das Gebastel

Dann könntest du aber auch gleich komplett wechseln: Wie wäre es mit OpenHab2 oder HomeAssistant?  8)
Titel: Antw:FTUI 2.5
Beitrag von: fhainz am 31 Januar 2017, 07:21:35
Zitat von: zap am 30 Januar 2017, 21:28:26
Und das wo ich die Trümmer vom letzten Update noch nicht beseitigt habe. Es wird Zeit für Alternativen. Hab keine Lust mehr auf das Gebastel
Wer zwingt sich sofort auf eine neue version upzudaten?
Ich lege zb 2 tablet ui Verzeichnisse an, ein neues, ein altes. So kann ich schauen was noch nicht funktioniert und es fixen wenn ich mal Zeit habe und die andere ui läuft normal im Hintergrund weiter.

Just my 0,02€
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 31 Januar 2017, 07:26:26
Meine FHEM Version ist vom 20.12.2016  ;D
Titel: Antw:FTUI 2.5
Beitrag von: Garbsen am 31 Januar 2017, 07:57:43
Zitat von: PatrickR am 30 Januar 2017, 20:25:30
Mahlzeit!

Kurze Info an die Mitstreiter. Seit dem heutigen Update scheint FTUI die JavaScripts (und ggf. weitere Dateien) unterhalb des Ordners zu erwarten, in dem auch die entsprechenden HTML-Dateien liegen, unabhängig davon, ob die Skripte explizit mit korrekten Pfaden eingebunden wurden.

/Edit:
Habe das Problem durch zwei Symlinks gelöst:

js -> ../tablet/js
lib -> ../tablet/lib/
fonts -> ../tablet/fonts/

Dafür sind meine Checkboxen wieder da. 8)

Nun kann ich mich einer Problematik zuwenden, die schon seit 2.4 auftaucht. Ich hole auf.

Patrick

2 Fragen:
A) ist diese Änderungsnotwendigkeit bestätigt
B) wo genau füge ich dies ein? In jede html oder nur in die Start.html?

Danke für Aufklärung von Leuten mit Halbwissen wie mir  8)
Titel: Antw:FTUI 2.5
Beitrag von: C0mmanda am 31 Januar 2017, 08:06:24
Zitat von: cotecmania am 29 Januar 2017, 16:56:52
Hi nochmals,

Wie kann man die Zeilenabstaende in einem sheet>row>cell verkleinern ?

https://forum.fhem.de/index.php/topic,65604.msg569158.html#msg569158 (https://forum.fhem.de/index.php/topic,65604.msg569158.html#msg569158)

Gruss
Joe

Das würde mich auch brennend interessieren!

grtz
CmdA
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 31 Januar 2017, 08:11:44
Wenn man eine Standardinstallation hat, mit den Verzeichnissangaben wie in der Readme ist das nicht notwendig. Wenn man von einem anderen Server ausliefern lässt oder parallele Installationen benutzt, wird man sehr speziell und es wird schwer, von der Ferne Ursachen zu erraten.
Titel: Antw:FTUI 2.5
Beitrag von: Stril am 31 Januar 2017, 10:06:06
Hallo!

Gibt es irgendeine Neuerung bei "doublebox-h"?
Bei mir wird das einfach ignoriert.

Danke!!


Grüße
Phil
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 31 Januar 2017, 10:23:45
Das ist auch so ein Relikt aus der Anfangszeit. Habe ich nicht getestet aber auch nix dran gemacht. Gib mal ein Beispiel, wie du nutzt. Besonders mit den benutzen Containern. Diese vererben meist ihre Eigenschaften an ihren Inhalt.
Titel: Antw:FTUI 2.5
Beitrag von: Stril am 31 Januar 2017, 10:25:14
Hallo!

Hier ein Beispiel:


<div class="cell small">
    <div class="doublebox-h">
        <div data-type="push" data-device="aJs_OG_Ankleide_FensterGarten|aJs_OG_Ankleide_FensterOben"
             data-icon="fa-angle-up" data-background-icon="fa-square-o"
             data-set-on="up">
        </div>
        <div data-type="push" data-device="aJs_OG_Ankleide_FensterGarten|aJs_OG_Ankleide_FensterOben"
             data-icon="fa-angle-down" data-background-icon="fa-square-o"
             data-set-on="down">
        </div>
    </div>
</div>



Danke für Deine Hilfe!!
Titel: Antw:FTUI 2.5
Beitrag von: SamNitro am 31 Januar 2017, 10:36:02
Zitat von: ih-sqeezer am 30 Januar 2017, 21:57:10
Hallo,

seit v2.5 besteht noch ein Problem mit dem "HeatingControl" bzw dem "wdtimer":

<div data-type="classchanger"
    data-device="HeatingControlStateWork"
    data-get="state"
    data-get-on="on"
    data-off-class="hide"
    data-on-class="" >
<div id="wdtimer_ftui"
data-type="wdtimer"
data-device="WohnzimmerHeatingControlWork"   
data-style="round"
data-theme="custom"
data-width="800"
data-height="600"
data-title="Wohnzimmer - Heizzeiten"
data-savecfg="true"
data-cmdlist='{"4.5°C off":"off","15°C Eco":"eco","18°C":"18.0","20°C":"20.0","22°C Komfort":"comfort"}'>
<div data-type="push"
data-off-color="#808080"
data-off-background-color="#3D4C66"
data-icon="fa-wrench"
class="big">
</div>
<div class="">Programm
</div>
</div>
</div>



Nimm mal die CSS aus meinem Beitrag dann sollten zumindest die Icon stimmen:

https://forum.fhem.de/index.php/topic,48106.msg570888.html#msg570888
Titel: Antw:FTUI 2.5
Beitrag von: ih-sqeezer am 31 Januar 2017, 12:23:34
Hallo Patrick,

danke für den Tip, probier ich heute Abend gleich mal aus.

Jedoch wird beim nächsten Update von setstate die css wieder überbügelt :(

Grüße,
Ingo
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 31 Januar 2017, 12:50:38
Zitat von: ih-sqeezer am 31 Januar 2017, 12:23:34
Jedoch wird beim nächsten Update von setstate die css wieder überbügelt :(

wenn du eine eigene user.css hast natürlich nicht, dann wird alles durch deine eigen überschreiben und alles ist so wie war  ;)
Titel: Antw:FTUI 2.5
Beitrag von: klausw am 31 Januar 2017, 12:58:48
Hallo Setsate

Zitat von: setstate am 31 Januar 2017, 08:11:44
Wenn man eine Standardinstallation hat, mit den Verzeichnissangaben wie in der Readme ist das nicht notwendig. Wenn man von einem anderen Server ausliefern lässt oder parallele Installationen benutzt, wird man sehr speziell und es wird schwer, von der Ferne Ursachen zu erraten.
wäre es möglich, alternativ den Pfad anzugeben, wo sich die css/js/lib Unterverzeichnisse befinden?

Das würde es für Nutzer alternativer Server etwas einfacher machen.
Titel: Antw:FTUI 2.5
Beitrag von: drhirn am 31 Januar 2017, 13:39:44
Zitat von: setstate am 31 Januar 2017, 07:26:26
Meine FHEM Version ist vom 20.12.2016  ;D

Feig :D
Meine vom 30.01.2017 und es funktioniert alles wunderbarst und schöner als je zuvor ;)
Titel: Antw:FTUI 2.5
Beitrag von: klausw am 31 Januar 2017, 13:54:38
Bug bei Push -> data-countdown ?

Hallo, ich habe ein seltsames Verhalten mit dem Timer Kringel. Obwohl nur bei einer push Instanz definiert, wird bei anklicken derselben ein Kringel an alle Push Instanzen der Seite angefügt (siehe Screenshot)


<div class="col-1-3">
<div data-type="push" data-fhem-cmd="set VCCU hmPairForSec 120" data-countdown="120"
data-icon="fs-cul" data-background-icon="" class="blue"></div>
<div data-type="label" class="narrow darker small">pair HM</div>
</div>
<div class="col-1-3">
<div data-type="push" data-fhem-cmd="set ZWDongle_0 addNode onNw"
data-icon="fs-cul_usb" data-background-icon="" class="blue"></div>
<div data-type="label" class="narrow darker small">pair ZWave</div>
</div>
<div class="col-1-3">
<div data-type="push" data-fhem-cmd="set ZWDongle_0 addNode off"
data-icon="fs-cul_usb" data-background-icon="" class="blue"></div>
<div data-type="label" class="narrow darker small">pair ZWave off</div>
</div>


Titel: Antw:FTUI 2.5
Beitrag von: PatrickR am 31 Januar 2017, 19:34:15
Mahlzeit!

Zitat von: setstate am 31 Januar 2017, 07:09:39
Dann könntest du aber auch gleich komplett wechseln: Wie wäre es mit OpenHab2 oder HomeAssistant?  8)
Das würde unterstellen, dass die Entwicklung von FHEM oder der Mehrzahl der FHEM-Module in gleicher Weise mit Abwärtskompatibilität umgeht wie Tablet UI.

Ich gebe es ehrlich zu. Ich bin hin- und hergerissen. Ich kann sowohl Dein Anliegen verstehen, alte Zöpfe abzuschneiden als auch die meines Erachtens durchaus nicht böse gemeinten Hinweise hier im Thread zu Optimierungsbedarf im Bereich Release- und Informationspolitik (vgl. z. B. #102 von Tedious). Tablet UI ist schick, funktionell und hochflexibel - wie FHEM. Es hat eine breite Userbasis; Einzelne haben sicherlich im hohen zweistelligen Stundenbereich Zeit in ihre Oberfläche investiert und vielleicht zusätzlich auf DRY verzichtet. Da ist das Schritthalten schwierig und man spürt sehr schnell den Unmut der User wenn man zu viele Brücken zu schnell hinter sich abbrennt. Auch "works for me" wie im aktuellen Fall der hartcodierten Pfade heizt da die Stimmung an. Insofern kann ich zaps Kommentar ein bisschen nachvollziehen.

Und nein: Auf Updates zu verzichten ist keine Option. Damit würde man nur die Anpassungen an den eigenen Oberflächen so lange herauszögern bis man aus welchem Grund auch immer doch upgraden und auf Grund der Vielzahl der notwendigen Anpassungen zwangsläufig bei Null beginnen muss.

Nichts für ungut
Patrick

/Edit: Nachdem ich den Thread nochmal gelesen habe hat der "works for me"-Punkt nicht mehr 100% gepasst.
Titel: Antw:FTUI 2.5
Beitrag von: zap am 31 Januar 2017, 21:03:36
Zitat von: setstate am 31 Januar 2017, 07:09:39
Dann könntest du aber auch gleich komplett wechseln: Wie wäre es mit OpenHab2 oder HomeAssistant?  8)

Nein, ich will es ja nicht noch schlimmer machen. Ich habe sowieso den Großteil meiner Geräte in der CCU angelernt. Ich denke eher über professionelle Lösungen wie Indigo oder ipsymcon nach. Kosten zwar Geld, aber wenn amn bedenkt, was ich schon in Smarthome investiert habe, kann man das vernachlässigen.

Habe jetzt mal auf meinem Mac indigo installiert und morgen kommt ipsymcon auf den Pi. Dann schau mer mal.
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 31 Januar 2017, 23:44:06
Zitat von: cotecmania am 25 Januar 2017, 14:02:24
Wie kann man die Zeilenabstaende in einem sheet>row>cell verkleinern ?

Die Row-Abstände werden mehr oder weniger durch die Größe deiner Icons + "Default-Abstand" vorgegeben. Eventuell hilft aber ein compressed innerhalb der class-Definition der Symbol-Widgets.
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 01 Februar 2017, 09:34:36
Zitat von: klausw am 31 Januar 2017, 13:54:38
Bug bei Push -> data-countdown ?

Hallo, ich habe ein seltsames Verhalten mit dem Timer Kringel. Obwohl nur bei einer push Instanz definiert, wird bei anklicken derselben ein Kringel an alle Push Instanzen der Seite angefügt (siehe Screenshot)


<div class="col-1-3">
<div data-type="push" data-fhem-cmd="set VCCU hmPairForSec 120" data-countdown="120"
data-icon="fs-cul" data-background-icon="" class="blue"></div>
<div data-type="label" class="narrow darker small">pair HM</div>
</div>
<div class="col-1-3">
<div data-type="push" data-fhem-cmd="set ZWDongle_0 addNode onNw"
data-icon="fs-cul_usb" data-background-icon="" class="blue"></div>
<div data-type="label" class="narrow darker small">pair ZWave</div>
</div>
<div class="col-1-3">
<div data-type="push" data-fhem-cmd="set ZWDongle_0 addNode off"
data-icon="fs-cul_usb" data-background-icon="" class="blue"></div>
<div data-type="label" class="narrow darker small">pair ZWave off</div>
</div>


Habe ich schon gesagt, dass das gefixed ist? Seit gestern Abend  ;)
Titel: Antw:FTUI 2.5
Beitrag von: PatrickR am 01 Februar 2017, 10:35:38
Hi!

Zu der Symlinkgeschichte:
Zitat von: Garbsen am 31 Januar 2017, 07:57:43
2 Fragen:
A) ist diese Änderungsnotwendigkeit bestätigt
Wenn die Seite nach dem Update vollständig und richtig angezeigt wird kannst Du Ruhe bewahren und musst/solltest nicht aktiv werden. Das ist vor allem der Fall, wenn Du Dich an die Standardinstallation hältst. Die Änderungen betreffen eher speziellere Setups.

Patrick
Titel: Antw:FTUI 2.5
Beitrag von: SirMarco am 01 Februar 2017, 12:57:09
Kurze Frage am Rande:

Kennt jemand eine schöne Seite wo ich lernen kann mit <div> <li> und class umzugehen?

Grüsse
Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 01 Februar 2017, 13:04:02
https://wiki.selfhtml.org/ zB
Titel: Antw:FTUI 2.5
Beitrag von: Wiesel am 01 Februar 2017, 13:13:53
www.sololearn.com
Gibt's auch als app

Gesendet von meinem SM-G920F mit Tapatalk

Titel: Antw:FTUI 2.5
Beitrag von: stefan-dd am 01 Februar 2017, 16:43:28
Ich habe eine Mobile Seite und eine Tablet Seite eingerichtet. In der Vorversion in getrennten Ordnern, die ich in Fhem auch getrennt aufrufen konnte. In der index.html waren die Ordner angepasst. Somit war der Speicherort egal. War schön und übersichtlich.
define TABLETMOBIL HTTPSRV mobil/ ./www/mobil MOBIL
define DISPLAY HTTPSRV display/ ./www/display DISPLAY

Nun funktioniert dies bekanntermaßen nicht mehr.
Was gibt es nun für eine Lösung für diesen Fall?
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 01 Februar 2017, 17:00:09
Beide Ordner müssen alle js, lib und css (usw.) Ordner haben

Und dann nur in der jeweiligen *.html Datei ein relativer Link auf die FTUI-js


    <script src="js/fhem-tablet-ui.js" defer></script>
Titel: Antw:FTUI 2.5
Beitrag von: octek0815 am 01 Februar 2017, 19:35:34
Wie kann man mit der 2.5 die "Toast Messages" abschalten?
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 01 Februar 2017, 19:43:37
Im Header muss man folgerndes angeben, um Toastmessages abzuschalten.


<meta name='toast' content='0'>


Ansonsten kann man mit der Zahl die Anzahl der gleichzeitig angezeigten Messages einstellen.
Titel: Antw:FTUI 2.5
Beitrag von: octek0815 am 01 Februar 2017, 19:50:06
Das klappt, vielen Dank für die rasche Antwort!

Hätte ja auch hier selber finden können: https://github.com/knowthelist/fhem-tablet-ui.

Titel: Antw:FTUI 2.5
Beitrag von: Wiesel am 01 Februar 2017, 20:31:46
Hallo Zusammen,

mir ist aufgefallen, dass auf der Wiki Seite https://wiki.fhem.de/wiki/FHEM_Tablet_UI#Widgets_--_Beispiele (https://wiki.fhem.de/wiki/FHEM_Tablet_UI#Widgets_--_Beispiele)  bei dem Dimmer Beispiel ein ">" hinter nach data-set="pct" fehlt. Kenn mich mit dem Wiki leider nicht aus, aber vielleicht hat ja jemand Muse das zu ändern :-)



Dimmer
Dimmer Widget Beispiel für Philips Hue

Minimalvariante


<div data-type="dimmer" data-device="HUEDevice1"
        data-get-on="!off" data-get-off="off"
        data-set="pct"</div>


Lg Wiesel
Titel: Antw:FTUI 2.5
Beitrag von: Hauswart am 02 Februar 2017, 11:55:04
Zitat von: Wiesel am 01 Februar 2017, 20:31:46
Hallo Zusammen,

mir ist aufgefallen, dass auf der Wiki Seite https://wiki.fhem.de/wiki/FHEM_Tablet_UI#Widgets_--_Beispiele (https://wiki.fhem.de/wiki/FHEM_Tablet_UI#Widgets_--_Beispiele)  bei dem Dimmer Beispiel ein ">" hinter nach data-set="pct" fehlt. Kenn mich mit dem Wiki leider nicht aus, aber vielleicht hat ja jemand Muse das zu ändern :-)



Dimmer
Dimmer Widget Beispiel für Philips Hue

Minimalvariante


<div data-type="dimmer" data-device="HUEDevice1"
        data-get-on="!off" data-get-off="off"
        data-set="pct"</div>


Lg Wiesel
Korrigiert.
Titel: Antw:FTUI 2.5
Beitrag von: All-Ex am 02 Februar 2017, 21:19:56
Seit 2.5 habe ich ein Problem mit dem Layout meiner Dimmer-Widgets. Für Homematic-Dimmer habe ich die wie folgt definiert:

<div class="cell"
data-type="dimmer"
data-device="dim.eg.ez.sw"
data-get-on="!off"
data-get-off="off"
data-dim="pct"
data-set-on="on"></div>


Sowohl bei iOS/Safari als auch bei Windows 10/Chrome+Edge bleibt das ganze Widget nach dem "hochschieben" zum hochdimmen bzw. "runterschieben" zum runterdimmen oben bzw. unten hängen. D.h. das Widget kehrt nach dem loslassen nicht wie bisher zur Ausgangsstellung in die Mitte zurück, siehe Screenshots:
1. Ausgangsstellung (ist so OK)
2. nach dem Hochdimmen (zu weit oben)
3. nach dem Runterdimmen (zu weit unten)

Die Funktion des Widgets ist einwandfrei.

Hat das noch jemand?
Titel: Antw:FTUI 2.5
Beitrag von: willibutz am 02 Februar 2017, 21:46:41
ist bei mir auch so. auch LOCK funktioniert mit dem Dimmer nicht mehr :-(
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 03 Februar 2017, 01:05:15
was ist eigentlich wieder passiert, dass ich mindestens 3x F5 drücken muss bis sich die Seite von FTUI komplett zeigt..?
Damit meine ich aber jede Seite, egal wo und wann ich auf eine Seite gehen möchte, es zeigt sich erst einmal nichts...!, wechsel ich die Seite das gleiche Spielchen...!

Ich muss dazu sagen...
Ich habe ein Update von Fhem und auch von Tablet UI gemacht und es geht hier gar nichts mehr..! :-\

Aber es wäre ja schlimm wenn ich das nicht mehr machen dürfte...!
Titel: select widget
Beitrag von: scooty am 03 Februar 2017, 08:11:33
Hallo,

ich versuche, innerhalb eines select widgets eine größere Schrift darzustellen.
Zumindest bei mir reagiert das select Widget nicht mehr auf Größenänderungen wie ich es erwarten würde.
Das einzige, was sich ändert, ist der kleine Auswahlpfeil rechts in der select Box.
Übersehe ich da vielleicht etwas?
<div class="vbox">
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="">Test1
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="wider">Test2
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="w1x">Test3
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="w2x">Test4
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="w3x">Test5
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="big">Test6
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="bigger">Test7
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual"]'
class="tall">Test8
</div>
<div data-type="select"
data-device="XXDG_MTW"
data-get="mode"
data-cmd="set"
data-items='["eco","auto","comfort","boost","off","on","manual","nurdamitesbreiterwird"]'
class="">Test9
</div>
</div>


Bin für jeglichen Hinweis dankbar.

Andreas
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 03 Februar 2017, 08:19:44
Das mit de Schriftgrösse beim Select könnte sein. Ich habe um viele Widgets jetzt ein Extra-DIV platziert, damit die Positionierung besser klappt. Kann sein, das die Klasse nicht beim richtigen Element ankommt.
Schaue ich mir an.   
Titel: Antw:FTUI 2.5
Beitrag von: Dummbatz am 03 Februar 2017, 10:11:07
Kurze Frage,

Ich möchte auf meiner Startseite einen Platz freihalten wo später mal ein Live Kamera Bild rein soll.

Wie mache ich das am besten ??

Thx

LG Dummbatz
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 03 Februar 2017, 10:18:46
Einfach eine ganze gridster <li> leer lassen, oder? Die Größe dem zukünftigen Bild entsprechend.
Titel: Antw:FTUI 2.5
Beitrag von: Garbsen am 03 Februar 2017, 15:28:55
Zitat- neues Layout Schema: Sheet > Row > Cell

Ein Tabellen ähnliches Layout um Widgets sehr einfach vertikal und horizontal zentrieren zu können

Code: [Auswählen]
<li data-row="1" data-col="3" data-sizey="2" data-sizex="2">
    <header>Sheet > Row > Cell</header>
    <div class="sheet">
        <div class="row">
            <div class="cell" data-type="symbol" data-device="dummy1"></div>
            <div class="cell" data-type="symbol" data-device="dummy2"></div>
        </div>
        <div class="row">
            <div class="cell" data-type="symbol" data-device="dummy3"></div>
            <div class="cell" data-type="symbol" data-device="dummy4"></div>
        </div>
    </div>
</li>

Alignment: left-align, right-align, top-align, bottom-align

2 Fragen:

Kann man ähnlich wie bei table mit "colspan" auch hier 2 Zellen zusammenfassen?

Kann man auch "umgekehrt" aufbauen? D.h.
<div class="cell">
<div class="row">
....

Wäre manchmal einfacher
Titel: Antw:FTUI 2.5
Beitrag von: drhirn am 03 Februar 2017, 15:41:05
Zitat von: Garbsen am 03 Februar 2017, 15:28:55
Kann man ähnlich wie bei table mit "colspan" auch hier 2 Zellen zusammenfassen?

Nein, geht leider nicht.

Zitat
Kann man auch "umgekehrt" aufbauen? D.h.
<div class="cell">
<div class="row">

Kann nicht gehen. Was willst du erreichen?
Titel: Antw:FTUI 2.5
Beitrag von: Mario67 am 03 Februar 2017, 16:30:52
Ich habe versuchsweise den Übergang auf 2.5 gemacht und dabei relativ wenig Problem gehabt.
Allerdings sieht es bei mir so aus, als ob die Styles aus einer separaten CSS-Datei nicht wirksam werden. Bei der Inspektion mit den Entwicklertools ist von den Definitionen aus meiner custom.css
z.B. .switch.on{background-color:#E6FF57 !important;}
.switch.off{color:#A6BF17 !important; background-color:#505050 !important;}

nichts zu sehen.

Gruß,
Mario

GELÖST: siehe https://forum.fhem.de/index.php/topic,66403.msg576897.html#msg576897 (https://forum.fhem.de/index.php/topic,66403.msg576897.html#msg576897)

Der Header der index.html:
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="widget_base_width" content="29"/>            <!-- 116 -->
<meta name="widget_base_height" content="32"/>           <!-- 131 -->
<meta name="widget_margin" content="3">
<meta name="mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="longpoll" content="1"/>        <!-- 1=longpoll; 0=shortpoll every 30sec -->
<meta name="debug" content="3"/>           <!-- 1=output to console; 0=not output -->

        <link rel="icon" href="favicon.ico" type="image/x-icon" />

<script type="text/javascript" src="./js/fhem-tablet-ui.js" defer></script>

<link rel="stylesheet" href="./fonts/nesges/style.css"/>
<link rel="stylesheet" href="./fonts/Traffic/style.css"/>

        <!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="./css/custom.css"/>
Titel: Antw:FTUI 2.5
Beitrag von: Garbsen am 03 Februar 2017, 16:33:37
Zitat von: drhirn am 03 Februar 2017, 15:41:05
Nein, geht leider nicht.

Schade, das erschwert das vernünftige formatieren, kann das noch eingebaut werden?


Zitat von: drhirn am 03 Februar 2017, 15:41:05
Kann nicht gehen. Was willst du erreichen?
Nicht so dramatisch, wäre nur manchmal beim Bauen von Tabellen einfacher, wenn man spaltenweise vorgehen könnte, statt zeilenweise, ist aber letztlich nicht wesentlich
Titel: Antw:FTUI 2.5
Beitrag von: Standarduser am 03 Februar 2017, 16:43:45
Ich würde meine FTUI gerne so hinbasteln, dass ich nur durch den Austausch einer CSS die Farbe verändern kann. Ähnlich, wie wenn man die css/fhem-green-ui.css einbindet.
Allerdings bleiben die Buttons davon total unbeeindruckt, was bestimmt daran liegt, dass, sollten keine Attribute angegeben sein, die hart-codierten Farben aus der .js verwendet werden.
Wäre es vielleicht möglich, diese festen Farbvorgaben aus dem CSS zu holen?

Ich meine damit zum Beispiel das hier:
        // if data-colors isn't set, try using data-on-color, data-off-color or #505050 instead
        if (typeof colors == 'undefined') {
            colors = new Array(elem.data('on-color') || elem.data('off-color') || '#505050');


Statt #505050 könnte man doch symbol.on verwenden. Oder gibt es vielleicht einen anderen Grund?
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 03 Februar 2017, 17:13:25
Zitat von: Mario67 am 03 Februar 2017, 16:30:52
Ich habe versuchsweise den Übergang auf 2.5 gemacht und dabei relativ wenig Problem gehabt.
Allerdings sieht es bei mir so aus, als ob die Styles aus einer separaten CSS-Datei nicht wirksam werden. Bei der Inspektion mit den Entwicklertools ist von den Definitionen aus meiner custom.css
z.B. .switch.on{background-color:#E6FF57 !important;}
.switch.off{color:#A6BF17 !important; background-color:#505050 !important;}

nichts zu sehen.

Gruß,
Mario

Der Header der index.html:
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="widget_base_width" content="29"/>            <!-- 116 -->
<meta name="widget_base_height" content="32"/>           <!-- 131 -->
<meta name="widget_margin" content="3">
<meta name="mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="longpoll" content="1"/>        <!-- 1=longpoll; 0=shortpoll every 30sec -->
<meta name="debug" content="3"/>           <!-- 1=output to console; 0=not output -->

        <link rel="icon" href="favicon.ico" type="image/x-icon" />

<script type="text/javascript" src="./js/fhem-tablet-ui.js" defer></script>

<link rel="stylesheet" href="./fonts/nesges/style.css"/>
<link rel="stylesheet" href="./fonts/Traffic/style.css"/>

        <!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="./css/custom.css"/>


Nimm mal aus deiner Farbdefinition die importants raus. Dieser Teil wird nicht wirklich als CSS benutzt.
Ich lese das beim Start mit einer js Funktion aus und initiiere die Buttons damit.
Titel: Antw:FTUI 2.5
Beitrag von: tekniker-69 am 03 Februar 2017, 22:27:40
Kann es sein, das sich beim Label-Widget was geändert hat ?
Ich habe eine Label in Label Konstruktion, die nur noch zur Hälfte funktioniert.

siehe hier:
https://forum.fhem.de/index.php/topic,59637.0.html (https://forum.fhem.de/index.php/topic,59637.0.html)
Titel: Antw:FTUI 2.5
Beitrag von: SirMarco am 03 Februar 2017, 22:52:03
Gibt es die Möglichkeit Sheets nebeneinander darzustellen? Ich habe es mit Inline probiert aber es will nicht so ganz. Ist das korrekkt das die Inline Class vor dem sheet kommen muss?


<section>
<div style="width: 30%">
<div class="inline">
  <div class="sheet" class="inline">
          <div class="row left-align">
            <div class="cell" data-type="symbol" data-device="dummy1"></div>
            <div class="cell" data-type="symbol" data-device="dummy2"></div>
        </div>
        <div class="row right-align">
            <div class="cell" data-type="symbol" data-device="dummy3"></div>
            <div class="cell" data-type="symbol" data-device="dummy4"></div>
        </div>
    </div>
</div>
</div>
<div style="width: 30%">
<div class="inline">
<div class="sheet">
     <div class="row left-align">
            <div class="cell" data-type="symbol" data-device="dummy1"></div>
            <div class="cell" data-type="symbol" data-device="dummy2"></div>
        </div>
        <div class="row right-align">
            <div class="cell" data-type="symbol" data-device="dummy3"></div>
            <div class="cell" data-type="symbol" data-device="dummy4"></div>
        </div>
    </div>
</div>
</div>
</section>


Gruss
Titel: Antw:FTUI 2.5
Beitrag von: ih-sqeezer am 03 Februar 2017, 23:59:31
Hallo,

ich habe möglicherweise einen Fehler im data-type="wdtimer" gefunden.
Und zwar verwende ich diesen um den Heizungsthermostaten unterschiedliche Heizprofile mitzuteilen. Diese sind über den wdtimer anpassbar.
Jedoch wird bei einer Änderung die komplette DEF durcheinander gewürfelt, sodass der wdtimer keinen Fehler bringt, aber auch nichts mehr schaltet.

Vor einer Editierung über FTUI:
WohnzimmerHeatingControlWork Heating_Control WohnzimmerWandthermostat de 12345|17:30|comfort 12340|22:00|eco 60|08:00|comfort 56|22:30|eco (ReadingsVal("WohnzimmerWandthermostat", "state", "") ne "off")

Nach einer Editierung über FTUI:
WohnzimmerHeatingControlWork de 12345|17:30|comfort 12340|22:00|eco 60|08:00|comfort 56|22:30|eco 0|00:00|18.0 Heating_Control WohnzimmerWandthermostat ne (ReadingsVal("WohnzimmerWandthermostat", "state", "") "off")

Dabei wurde der Eintrag "0|00:00|18.0" testweise hinzugefügt.

Vielleicht bin ich hier auch im falschen Thema gelandet. Bitte um Nachsicht.
Eventuell kann dies an die korrekte Stelle verschoben werden.

Danke und Grüße,
Ingo
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 04 Februar 2017, 13:07:08
ich muss hier nochmals nachfragen wegen der Verschiebung in einem Circlemenü, ich habe zwei davon und in beiden ist das Icon nach rechts verschoben.
Ich habe es schon ohne jegliche class="" probiert aber es tut sich nichts es beliebt verschoben, muss ich das evtl. in eine andere class packen damit das mittig ist..? momentan habe ich class=top-space" drin
Beispiel von einem Circlemenü im Screenshot, das andere hatte ich hier schon mal irgendwo. Setze ich da ein normales Icon rein mit code geht das.

<div class="top-space"
data-type="circlemenu"
data-circle-radius="60"
data-direction="left-half"
data-colors="lightgray">
<ul>
<li>
<div data-type="symbol"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="fa-server">
                </div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_server.html" data-icon="oa-it_server"></div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_batterien.html" data-icon="oa-measure_battery_100"></div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_netzwerk.html" data-icon="oa-it_network"></div>
</li>
</ul>
</div>
<div class="medium" data-type="label">System</div>
Titel: Antw:FTUI 2.5
Beitrag von: ulli am 04 Februar 2017, 14:15:27
Eine Frage: ist damit die Nutzung der Page Funktion (index_page_demo) nicht mehr notwendig für ein schnelles wechseln von Seiten?
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 04 Februar 2017, 15:44:57
Zum Circlemenu: Das Circlemenu selbst ist unschuldig, das positioniert sich mittig. Die Frage ist: wie sieht der übergeordneten Container aus? Was positioniert die anderen Schalter?
Titel: Antw:FTUI 2.5
Beitrag von: ulli am 04 Februar 2017, 16:16:57
Habe das update auf 2.5 gerade gemacht und ärgere mich jetzt schon 3 std damit herum....alles ist verschoben, größen passen nicht mehr und ich bekomme in 90% der Browser refreshs folgende Meldung
fhem-tablet-ui.js:891
InvalidAccessError: A parameter or an operation is not supported by the underlying object
Titel: Antw:FTUI 2.5
Beitrag von: Familienpapi am 04 Februar 2017, 18:03:02
habe soeben auf 2.5 upgedatet und danach meine HTMLs neu formatiert.
Wie es beschrieben wurde, war klar, dass man neu formatieren muss, somit wusste ich, auf was ich mich einlasse.
Jetzt nach einem Samstag (geschätzte 6h) sieht alles wieder gut, vieles sogar deutlich besser, aus.

Ich liebe die UI. Man kann einfach alles sauber darstellen und selbst meine Frau ist entzückt.

Wann wird das Wiki auf den aktuellen Stand gebracht?
Titel: Antw:FTUI 2.5
Beitrag von: Eisix am 04 Februar 2017, 18:17:36
Hallo setstate,

nochmal Danke für die Arbeit die du dir machst!

Habe heute mal versucht

- Slider/Level Widget: Timer zum Interpolieren von Zwischenschritten

Zum Beispiel bei einer Song-Vortschrittsanzeige, die nur aller 10 Sekunden ein Update bekommt, kann mit data-timer-step="1" und data-timer-interval="1000" (Default-Werte) die Anzeige automatisch weiterlaufen lassen. Aber nur, wenn das data-timer-state Reading einen gültigen Status zum Laufenlassen des Timers hat. Entsprechend zu den data-timer-on und data-timer-off Definitionen.


<div data-type="level" data-device="MPD1" data-get="elapsed" data-max="Time" data-width="280" data-timer-state="MPD1:STATE" data-timer-state-on="play" data-timer-state-off="!on" data-margin="15px"  class="horizontal"></div>

umzusetzen. Hat mich immer schon gestört das ich nur alle 30s ein update hatte.

Das ganze auf mein Bose System umgesetzt sollte dann meiner Meinung nach so passen.

<div data-type="level" data-device="BOSE" data-get="time" data-max="timeTotal" data-timer-state="BOSE:STATE" data-timer-state-on="playing" data-timer-step="1" data-timer-interval="3000" data-width="200" class="horizontal inline middle"></div>

Funktioniert aber nicht. Habe ich da was falsch verstanden? Wenn ich dann ein Reload der Page mache kriege ich folgenden error.


widget_slider.js:35
TypeError: Cannot read property 'options' of undefined


Gruß
Eisix
Titel: Antw:FTUI 2.5
Beitrag von: Grimm80 am 04 Februar 2017, 18:57:05
Die Darstellung auf meine Galaxy-Tab 4 mit Maxthon Browser ist nicht wirklich prickelnd.
Die Schrift ist unscharf und das Hintergrundbild wurde abgeschnitten, als würde die Auflösung nicht mehr passen.

Gibt es da eine Lösung für?
Titel: Antw:FTUI 2.5
Beitrag von: Familienpapi am 04 Februar 2017, 21:39:24
Zitat von: Grimm80 am 04 Februar 2017, 18:57:05
Die Darstellung auf meine Galaxy-Tab 4 mit Maxthon Browser ist nicht wirklich prickelnd.
Die Schrift ist unscharf und das Hintergrundbild wurde abgeschnitten, als würde die Auflösung nicht mehr passen.

Gibt es da eine Lösung für?
Wie sieht denn Dein Header Code aus?

gesendet von meinem Note via Tapatalk

Titel: Antw:FTUI 2.5
Beitrag von: Grimm80 am 04 Februar 2017, 21:47:32
Folgendes hab ich im HEAD stehen:


<head>
    <!--
     /* FHEM tablet ui */
     /*
     * UI builder framework for FHEM
     *
     * Version: 2.5.*
     * URL: https://github.com/knowthelist/fhem-tablet-ui
     *
     * Copyright (c) 2015-2017 Mario Stephan <mstephan@shared-files.de>
     * Under MIT License (http://www.opensource.org/licenses/mit-license.php)
     *
     * - create a new folder named 'tablet' in /<fhem-path>/www
     * - copy all files incl. sub folders into /<fhem-path>/www/tablet
     * - add 'define TABLETUI HTTPSRV ftui ./www/tablet Tablet' in fhem.cfg
     * - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
     */
    -->
    <link rel="icon" href="favicon.ico" type="image/x-icon" />
    <meta name="widget_base_width" content="71">
    <meta name="widget_base_height" content="71">
<link rel="stylesheet" href="css/fhem-tablet-ui-user.css" />

    <script src="js/fhem-tablet-ui.js" defer></script>

    <title>Zentrale</title>
</head>
Titel: Antw:FTUI 2.5
Beitrag von: Grimm80 am 04 Februar 2017, 21:59:54
Ich hab mal zwei Bilder ran.
Klein:   das ist die akteulle Auflösung auf dem Tab mit dem neuen FTUI

Normal:  das sollte das eigentliche Bild sein, aber ist es leider nicht. Wenn ich das auf der größe anpasse dann ist es auf dem TAB zu groß und ich muss scrollen

Aktuell: So ist es bei mir aktuell in Betrieb. Nach dem Update war alles futsch....hatte zum Glück noch ein Backup  :P
Titel: Antw:FTUI 2.5
Beitrag von: Familienpapi am 04 Februar 2017, 23:11:42
bei mir steht im Head deutlich mehr:
<html>
<head>
  <meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <meta name="widget_base_width" content="75">
  <meta name="widget_base_height" content="79">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="gridster_disable" content="1">
  <meta name="longpoll" content="1">
  <meta name="debug" content="3">
  <meta name="lang" content="de">
...

Vielleicht möchtest Du das Fehlende ergänzen und dann versuchen. Vor allem die erste Zeile "viewport" ist der Knackpunkt bei mir gewesen.

gesendet von meinem Note via Tapatalk

Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 05 Februar 2017, 01:06:28
@setstate
EDITH:// mach dir keine Gedanken mehr ich habe den Fehler jetzt endlich gefunden, ich hatte in meiner ****user-ui.css ein Teil drin der so aussah und es liegt am inline-block, den ich jetzt auskommentiert habe.

.circlemenu {
    min-height: 52px;
    min-width: 52px;
    margin-bottom: -3px;
    /*display: inline-block;*/
}


Ich denke ich brauche das gar nicht mehr in meiner css Datei, also kann es wohl raus

Zitat von: setstate am 04 Februar 2017, 15:44:57
Zum Circlemenu: Das Circlemenu selbst ist unschuldig, das positioniert sich mittig. Die Frage ist: wie sieht der übergeordneten Container aus? Was positioniert die anderen Schalter?

hier mal der komplette Code mit den anderen Schalter:
<header style="border-top-left-radius:8px;border-top-right-radius:8px;">App - Men&uuml;</header>

<!-- ========= Charts ===================== -->
<!-- ====================================== -->
<div class="top-space"
data-type="pagetab"
data-url="Tab_index_wetter1.html"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="oa-temp_temperature">
</div>
<div class="medium silver" data-type="label">Hausklima</div>


<!-- ========= Wetter ===================== -->
<!-- ====================================== -->
<div class="top-space"
data-type="pagetab"
data-url="Tab_index_wetter.html"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="oa-weather_sunrise">
</div>
<div class="medium silver" data-type="label">Wetter</div>


<!-- ========= System ===================== -->
<!-- ====================================== -->
<div class="top-space"
data-type="circlemenu"
data-circle-radius="60"
data-direction="left-half"
data-colors="lightgray">
<ul>
<li>
<div data-type="symbol"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="fa-server">
                </div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_server.html" data-icon="oa-it_server"></div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_batterien.html" data-icon="oa-measure_battery_100"></div>
</li>
<li><div data-type="pagetab" data-on-color="#DC143C" data-url="Tab_index_netzwerk.html" data-icon="oa-it_network"></div>
</li>
</ul>
</div>
<div class="medium silver" data-type="label">System</div>


<!-- ========= Anrufe  ==================== -->
<!-- ====================================== -->
<div class="top-space"
data-type="pagetab"
data-url="Tab_index_anrufe.html"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="fa-phone">
</div>
<div class="medium narrower silver" data-type="label">Anrufe</div>


<!-- ========= Logitech =================== -->
<!-- ====================================== -->
<div class="top-space"
data-type="pagetab"
data-url="Tab_index_logitech.html"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="oa-audio_sound">
</div>
<div class="medium silver" data-type="label">SqueezeBoxen</div>


<!-- ============== Wetter 2 ============== -->
<!-- ====================================== -->
<div class="top-space"
data-type="pagetab"
data-url="Tab_index_wetter2.html"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="oa-weather_sunrise">
</div>
<div class="medium silver" data-type="label">Wetter 2</div>


<!-- =============== Kamera =============== -->
<!-- ====================================== -->
<div class="top-space"
data-type="pagetab"
data-url="Tab_index_kamera.html"
data-background-icon="fa-circle-thin" data-off-background-color="#4169e1" data-off-color="#C0C0C0" data-on-background-color="#DC143C" data-on-color="#DC143C"
data-icon="oa-it_camera">
</div>
<div class="medium silver" data-type="label">Kamera</div>
Titel: Antw:FTUI 2.5
Beitrag von: Grimm80 am 05 Februar 2017, 09:40:26
@Familienpapi: Danke! Lag wirklich daran.

Ich dachte bei dem neuen ist das normal das da so wenig drin ist weil alles autom. geladen wird.

Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 05 Februar 2017, 12:16:47
Zitat von: Familienpapi am 04 Februar 2017, 18:03:02
Wann wird das Wiki auf den aktuellen Stand gebracht?

Account beantragen und selbst aktiv dran mitarbeiten ;)
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 05 Februar 2017, 19:17:36
Ich habe einen Ordner /opt/fhem/www/tablet/mobile. Darin liegt eine index.html.

Jedoch wird bei mir in der html nichts angezeigt.

Wie muss der header der Datei aussehen?
Titel: Antw:FTUI 2.5
Beitrag von: Familienpapi am 05 Februar 2017, 19:49:22
Vermutlich müsste man im Header den einzelnen Einträgen vollständige Pfadangaben mitgeben. z.B.
<script src="/fhem/ftui/js/fhem-tablet-ui.js" defer></script>
Ist ungetestet, einfach mal versuchen, jeden einzelnen Headereintrag in Deiner index.html entsprechend Deiner Installation abzuändern.

gesendet von meinem Note via Tapatalk

Titel: Antw:FTUI 2.5
Beitrag von: Familienpapi am 05 Februar 2017, 19:51:31
Zitat von: Amenophis86 am 05 Februar 2017, 12:16:47
Account beantragen und selbst aktiv dran mitarbeiten ;)
Ich sehe mich bei der Tablet UI noch als lernender Anfänger.
Unterstütze aber gerne und werde mich da kommende Woche mal dran machen.

gesendet von meinem Note via Tapatalk

Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 05 Februar 2017, 20:45:57
Zitat von: Familienpapi am 05 Februar 2017, 19:49:22
Vermutlich müsste man im Header den einzelnen Einträgen vollständige Pfadangaben mitgeben. z.B.
<script src="/fhem/ftui/js/fhem-tablet-ui.js" defer></script>
Ist ungetestet, einfach mal versuchen, jeden einzelnen Headereintrag in Deiner index.html entsprechend Deiner Installation abzuändern.

gesendet von meinem Note via Tapatalk

Hatte ich alles schon getestet, ohne Erfolg.
Titel: Antw:FTUI 2.5
Beitrag von: Wiesel am 05 Februar 2017, 21:30:34
Zitat von: setstate am 29 Januar 2017, 18:20:28
Ich würde die Links zu den originalen js und css Ordnern im Filesystem per symbolischen Link machen (ln -s)

Im Header dann immer nur relativ zur aufgerufenen HTML Datei: <script src="js/fhem-tablet-ui.js" defer></script>
Hast du das schon mal probiert?
Hatte mein Problem mit den zwei UI's gelöst.
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 05 Februar 2017, 22:06:11
Zitat von: Wiesel am 05 Februar 2017, 21:30:34
Ich würde die Links zu den originalen js und css Ordnern im Filesystem per symbolischen Link machen (ln -s)
Was muss ich dazu konfigurieren?
Titel: Antw:FTUI 2.5 - Class Widget CCS-Atributen werden nicht übernommen
Beitrag von: harald654 am 05 Februar 2017, 22:38:20
Hallo,
kann es sein das mit 2.5 des Class Widget die CCS-Atribute (w1x, w2x, w3x) nicht übernimmt?
Bei mir bleibt das Class Widget immer gleich groß/lang, egal ob ich w1x, w2x oder w3x verwende (siehe Bild):
<li data-row="1" data-col="4" data-sizex="3" data-sizey="4">
<div data-type="select" data-device="SB_Badzmr" data-list="FAVSTR_FTUI" data-get="playlists" data-set="favorites" data-cmd="set"></div>
<div class="w1x" data-type="select" data-device="SB_Badzmr" data-list="FAVSTR_FTUI" data-get="playlists" data-set="favorites" data-cmd="set"></div>
<div class="w2x" data-type="select" data-device="SB_Badzmr" data-list="FAVSTR_FTUI" data-get="playlists" data-set="favorites" data-cmd="set"></div>
<div class="w3x" data-type="select" data-device="SB_Badzmr" data-list="FAVSTR_FTUI" data-get="playlists" data-set="favorites" data-cmd="set"></div>
</li>


Gruß,
H.
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 05 Februar 2017, 22:47:36
Zitat von: TWART016 am 05 Februar 2017, 22:06:11
Was muss ich dazu konfigurieren?
Nun ja, nicht viel. Einfach einen symbolischen Link anlegen:
http://w3-o.hm.edu/zak/infopool/veranstaltungen/2003-12-linux/node59.html
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 05 Februar 2017, 23:34:05
Wo muss ich das eintragen? Und welche Zeilen?

Sorry, kenne mich in der Materie nicht aus.
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 06 Februar 2017, 00:13:02
Oooch, ein bisschen Selbstgoogelei darf man gelegentlich schon erwarten...

Mal ein Beispiel:
Du loggst Dich per ssh auf Deinen FHEM-Server ein.
Du legst einen Unterordner in /opt/fhem/www/tablet an:

sudo mkdir ftui

Dann wechselst Du in diesen Ordner:

cd ftui

Jetzt legst Du die symbolischen Links an:

sudo ln -s /opt/fhem/www/tablet/js js
sudo ln -s /opt/fhem/www/tablet/css css
sudo ln -s /opt/fhem/www/tablet/lib lib
sudo ln -s /opt/fhem/www/tablet/fonts fonts

Nun erstellst Du Dir eine neue index.html in /ftui und freust dich...

Vorteil: ein Update von FTUI aus FHEM heraus, updatet beide "Instanzen" und die Daten sind nur 1 Mal vorhanden (brauchen also nicht doppelt Platz)
Nachteil: Ich musste dieses HowTo schreiben ;-)
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 06 Februar 2017, 02:07:27
@tomster: Danke für das HowTo  :D

Aber ich werde die automatische Erkennung für das Base-Directory wieder einbauen. Kommt mit der nächsten Version. Dann kann man sich das mit den Links sparen.
Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 06 Februar 2017, 02:21:43
ich habe mal eine Frage zu einer Combobox die ich mir erstellt habe.
Ist es möglich das diese zu jedem Status/Modus ein farbiges Icon darstellt welches über der Combobo angezeigt wird, oder geht das nicht.

Hier mal mein Beispiel:
<!-- =========== Rollladen Modus ======== -->
<li data-row="8" data-col="3" data-sizex="2" data-sizey="2" class="semitransparent3d">
<header>Rollladen - Test</header>
<div data-type="select"
data-device="du_RolloSZmodus"
data-get-on='["FHEM","Nachtschicht","Beschattung","Aus"]'
data-get-off='["FHEM","Nachtschicht","Beschattung","Aus"]'
data-alias='["FHEM","Nachtschicht","Beschattung","Aus"]'
data-icons='["oa-fts_shutter_automatic","oa-fts_shutter_up","fs-fts_shutter_updown","fs-general_aus"]'
data-on-colors='["lightgreen","#DC143C","#4169e1","yellow"]'
class="cell">
</div>
<div class="narrow" data-type="label">Modus</div>
</li>
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 06 Februar 2017, 04:44:17
Zitat von: setstate am 06 Februar 2017, 02:07:27
@tomster: Danke für das HowTo  :D
Ich verwende nun - und es wird wohl nie wieder vorkommen - auch Mal einen norddeutschen Ausruck: dafür nicht!
Zitat von: setstate am 06 Februar 2017, 02:07:27
Aber ich werde die automatische Erkennung für das Base-Directory wieder einbauen. Kommt mit der nächsten Version. Dann kann man sich das mit den Links sparen.
Und dafür auch nicht! Hab ich mir schon wieder, ähhh, nun halt auch mal Arbeit umsonst gemacht...

Apropos umsonst. Damit das so schnell nicht wieder vorkommt, darf ich aus gegebenem Anlass noch einmal darauf verweisen:
https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=PD4C2XM2VTD9A
Titel: Antw:FTUI 2.5
Beitrag von: sinus61 am 06 Februar 2017, 07:52:26
Zitat von: moonsorrox am 06 Februar 2017, 02:21:43
Ist es möglich das diese zu jedem Status/Modus ein farbiges Icon darstellt welches über der Combobo angezeigt wird, oder geht das nicht.

Sowas kann das Select Widget nicht, da musst Du Dir schon ein Symbol Widget dazu bauen.
Titel: Antw:FTUI 2.5
Beitrag von: Thyraz am 06 Februar 2017, 09:07:43
Zitat von: moonsorrox am 06 Februar 2017, 02:21:43
Ist es möglich das diese zu jedem Status/Modus ein farbiges Icon darstellt welches über der Combobo angezeigt wird, oder geht das nicht.

Hm.. mit dem CSS "before" Selektor bekommt man bestimmt ein Icon reingemogelt.
Ist nur die Frage wie man es hinbekommt unterschiedliche Icons pro Eintrag zu erhalten.
Sprich, wie bekomme ich per CSS eine Unterscheidung hin?

Müsste man evt. mal in Chrome mit den Entwicklertools in der Element-Ansicht reinschauen.


edit: before/after funktioniert nicht mit option Elementen in einem Select Element. Schade...
Färben könnte man die einzelnen Zeilen, aber das hilft dir nicht viel denke ich. :p


/* value "1" wäre mit dem Beschriftungstext der jeweiligen Option zu ersetzen */
#my-containing-div option[value="1"] {
  color:#ff0000 !important;
}
Titel: Antw:FTUI 2.5
Beitrag von: viegener am 06 Februar 2017, 09:32:46
Die updates von FTUI sind ja immer etwas heikel. Diesmal habe ich beim update von 2.4.x auf 2.5 aber auch nach einiger Zeit des rumprobierens kein lauffähiges ui hinbekommen. nachwievor erscheint es kurz teilweise und dann wird alles schwarz (auf Chrome und Firefox). Keine Fehler in der Konsole.

Ich hätte ein paar grundsätztliche Vorschläge:

- Inkompatible Veränderungen soweit wie möglich vermeiden! - Beispiel grössen-werte im css anzupassen heisst, dass bei den meisten das Layout zerschossen wird

- Neue Versionen ankündigen und etwaige inkompatibilitäten speziell markieren

- Vielleicht könnte es eine dev-version für Betatester geben und eine Release/stable version - Vor der Freigabe einer Releaseversion könnten dann betatester auch helfen die Änderungen zu dokumentieren

Ich bin gerne bereit dabei zu helfen, aber erstmal müsste ich wieder ein sichtbares FTUI haben ::)

Vielleicht kann man ja auch zusammenarbeiten um dann die Dokumentation zu aktualisieren?
Titel: Antw:FTUI 2.5
Beitrag von: Thyraz am 06 Februar 2017, 11:28:07
Zitat von: moonsorrox am 06 Februar 2017, 02:21:43
ich habe mal eine Frage zu einer Combobox die ich mir erstellt habe.
Ist es möglich das diese zu jedem Status/Modus ein farbiges Icon darstellt welches über der Combobo angezeigt wird, oder geht das nicht.

Also mit JavaScript bekommt man es hin:


<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="css/fhem-tablet-ui.css" />
  <link rel="stylesheet" href="lib/font-awesome.min.css" />
  <link rel="stylesheet" href="lib/jquery.toast.min.css" />

  <script src="lib/jquery.min.js" defer></script>
  <script src="lib/jquery.toast.min.js" defer></script>
  <script src="js/fhem-tablet-ui.min.js" defer></script>

<script>
  setTimeout(
    function() {
      var mySelect = document.getElementById('test').getElementsByTagName('select')[0];
      mySelect.className += " fa";
mySelect.options[0].innerHTML = '<div style="font-family: \'FontAwesome\' !important;"> </div>' + mySelect.options[0].innerHTML;
mySelect.options[1].innerHTML = '<div style="font-family: \'FontAwesome\' !important;"> </div>' + mySelect.options[1].innerHTML;
mySelect.options[2].innerHTML = '<div style="font-family: \'FontAwesome\' !important;"> </div>' + mySelect.options[2].innerHTML;
mySelect.options[3].innerHTML = '<div style="font-family: \'FontAwesome\' !important;"> </div>' + mySelect.options[3].innerHTML;
mySelect.options[4].innerHTML = '<div style="font-family: \'FontAwesome\' !important;"> </div>' + mySelect.options[4].innerHTML;
    }, 2000);
</script>
</head>

<body>
<div id="test" class="fa" style="width: 100px;"
    data-type="select"
    data-device="MyDummy"
    data-get="doif_RGBWController01_01_delay"
    data-items='["1","2","3","4","5"]'
    data-alias='["Eintrag 1","Eintrag 2","Eintrag 3","Eintrag 4","Eintrag 5"]'
    data-cmd="setreading"
    data-set="doif_RGBWController01_01_delay">
</div>
</body>
</html>


Ist nur die Frage wann man das JS Schnippsel ausführen muss.
Beim Laden der Seite ist zu früh, daher 2 Sekunden verzögert im Beispiel.

Evtl. kann an auf Änderungen im Select Widget reagieren?

Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 06 Februar 2017, 13:42:01
Zitat von: viegener am 06 Februar 2017, 09:32:46
Die updates von FTUI sind ja immer etwas heikel. Diesmal habe ich beim update von 2.4.x auf 2.5 aber auch nach einiger Zeit des rumprobierens kein lauffähiges ui hinbekommen. nachwievor erscheint es kurz teilweise und dann wird alles schwarz (auf Chrome und Firefox). Keine Fehler in der Konsole.

Ich hätte ein paar grundsätztliche Vorschläge:

- Inkompatible Veränderungen soweit wie möglich vermeiden! - Beispiel grössen-werte im css anzupassen heisst, dass bei den meisten das Layout zerschossen wird

- Neue Versionen ankündigen und etwaige inkompatibilitäten speziell markieren

- Vielleicht könnte es eine dev-version für Betatester geben und eine Release/stable version - Vor der Freigabe einer Releaseversion könnten dann betatester auch helfen die Änderungen zu dokumentieren

Ich bin gerne bereit dabei zu helfen, aber erstmal müsste ich wieder ein sichtbares FTUI haben ::)

Vielleicht kann man ja auch zusammenarbeiten um dann die Dokumentation zu aktualisieren?

setstate scheint da im Moment etwas eigen zu sein. Unsere Vorschläge diesbezüglich wurden bisher alle unkommentiert ignoriert. Nicht falsch verstehen, ich finde das UI super und bin ein großer Fan davon. Der Support bezüglich Fehler ist auch wunderbar, aber zum o.g. Thema kommt leider kein Kommentar, trotz mehrfacher Hinweise in letzter Zeit. Natürlich kann man jetzt sagen, dass jeder sich vor einem Update informieren sollte, allerdings fallen die Fehler ja auch meist erst hinterher auf, da es keine wirkliche beta Phase der neuen Versionen gibt.
Titel: Antw:FTUI 2.5
Beitrag von: viegener am 06 Februar 2017, 14:00:34
Zitat von: Amenophis86 am 06 Februar 2017, 13:42:01
setstate scheint da im Moment etwas eigen zu sein. Unsere Vorschläge diesbezüglich wurden bisher alle unkommentiert ignoriert. Nicht falsch verstehen, ich finde das UI super und bin ein großer Fan davon. Der Support bezüglich Fehler ist auch wunderbar, aber zum o.g. Thema kommt leider kein Kommentar, trotz mehrfacher Hinweise in letzter Zeit. Natürlich kann man jetzt sagen, dass jeder sich vor einem Update informieren sollte, allerdings fallen die Fehler ja auch meist erst hinterher auf, da es keine wirkliche beta Phase der neuen Versionen gibt.

Ich werte das als Zustimmung und das das Thema schon ein paar mal hier angesprochen wurde auch von mir ist ja kein Grund es zu lassen, ich bin immernoch davon überzeugt, dass wir gemeinsam das Vorgehen verbessern können ohne dabei Kompetenzen oder Entscheidungen jemandem aus der Hand zu nehmen.

Titel: Antw:FTUI 2.5
Beitrag von: Thyraz am 06 Februar 2017, 14:35:00
Setstate ist sicher schon wieder im Entwicklungsfieber für 2.6, da er die FHEM Websockets Unterstützung entdeckt hat.  :P

Kenne das von mir selbst: Neue Features erhalten den Programmiertrieb und die Motivation besser als Doku warten oder Rückwartskompatibilität erhalten.
Die meisten Kommentare zu dem Thema waren ja auch eher wie eure gehalten, aber ein paar waren auch von einer Erwartungshaltung und einem Tonfall geprägt, der sich für ein kostenloses Produkt nicht unbedingt ziemt...

Evtl. würde ich da auch erstmal in den Ignore-Modus schalten. ;)
Zur Kenntnis genommen hat er es ja sicher dennoch, somit gibts ja evtl. bald wieder eine Beta, wie das früher auch schon der Fall war.

Das ändert aber nichts daran, dass nach einer Beta irgendwann wieder eine Stable Version kommt und viele wieder genauso überrascht sein warden,
da sie eben nicht konstant mitlesen.
Meiner Meinung nach dürfen bei einer UI die weiter wachsen soll durchaus auch mal alte Zöpfe abgeschnitten werden.

Übrigens betreffen die Änderungen hauptsächlich die Positionierung und das Grid.
Ich hab meine Seite mit Bootstrap und eigenen Positionsklassen aufgebaut und seit FTUI 1.x Seiten praktisch nie was ändern müssen.

Zum Thema Doku:
Hier gibt es viele Perlen, die noch nicht dokumentiert sind.
Ich glaube selbst die Möglichkeit Tabs über Link Buttons statt PageTab zu realsieren ware nur aufgrund der Doku aktuell nicht möglich.
Evtl. ware ein eigener Thread eine Lösung in der man undokumentierte Features sammelt und dann Dokuschnippsel erstellt (am Besten in Markup Langauge formatiert) die setstate direkt per Copy & Paste in seine Readme.md übernehmen kann.

Das Thema Doku kann man ja problemlos in Zusammenarbeit lösen.


Titel: Antw:FTUI 2.5
Beitrag von: moonsorrox am 06 Februar 2017, 15:00:39
Zitat von: Thyraz am 06 Februar 2017, 14:35:00
Meiner Meinung nach dürfen bei einer UI die weiter wachsen soll durchaus auch mal alte Zöpfe abgeschnitten werden.
da gebe ich dir vollkommen Recht... deshalb habe ich auch manchmal rum gemault und geschluckt, bin aber dabei geblieben (2.5)

Zitat von: Thyraz am 06 Februar 2017, 14:35:00
Übrigens betreffen die Änderungen hauptsächlich die Positionierung und das Grid.
Ich hab meine Seite mit Bootstrap und eigenen Positionsklassen aufgebaut und seit FTUI 1.x Seiten praktisch nie was ändern müssen.
vergiss bitte nicht das es gerade hier in dem stetig wachsendem Segment immer wieder Neulinge gibt die gar nicht, aber auch wirklich gar nichts von dem verstehen was du hier schreibst. Bootstrap kenne ich und habe ich schon mal von meiner Homepage gehört, aber einmal mit beschäftigt weil der Template Bauer mir davon geschrieben hat... usw. ;)

Aber, es ist eben ein schon ständig wachsendes Gebiet gerade css und davon verstehen nur wenige etwas wollen aber ebenso ein FTUI haben, nicht falsch verstehen, aber viele bauen sich doch alles nur aus den hier gebotenem alles zusammen um zum Erfolg zu kommen... und dann geht eben das Geschrei los... wo fange ich am besten an wenn alles verschoben ist.
Ging mir doch auch so, weil eben css das Allerheilmittel ist und ich habe sicher schon viel davon gehört und gebastelt  ;)
Aber ich stoße immer wieder auf Dinge die ich nie gesehen oder gehört habe, gerade eben bei css... und es dauert manchmal schon...

Also was sagt uns dass ruhig belieben und möglichst viel fragen und zusammen arbeiten mit der Unterstützung der Profis...  :D
Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 06 Februar 2017, 15:06:57
Zitat von: Thyraz am 06 Februar 2017, 14:35:00
Zum Thema Doku:
Hier gibt es viele Perlen, die noch nicht dokumentiert sind.
Ich glaube selbst die Möglichkeit Tabs über Link Buttons statt PageTab zu realsieren ware nur aufgrund der Doku aktuell nicht möglich.
Evtl. ware ein eigener Thread eine Lösung in der man undokumentierte Features sammelt und dann Dokuschnippsel erstellt (am Besten in Markup Langauge formatiert) die setstate direkt per Copy & Paste in seine Readme.md übernehmen kann.

Das Thema Doku kann man ja problemlos in Zusammenarbeit lösen.

Zum Thema Doku. Ich würde ungern noch eine dritte Baustelle aufmachen, wo Infos gefunden werden können. Aktuell haben wir das Wiki (mehr schlecht, als recht) und die Seite von setstate (gut, aber auch nicht alles dokumentiert). Mein Vorschlag wäre, dass wir uns auf das Wiki konzentrieren. Hier kann jeder einen Schreibzugang beantragen und mithelfen. Ein zusätzlichen Thread sehe ich als kontraproduktiv, weil es nur eine weitere Quelle wäre.

Zitat
Kenne das von mir selbst: Neue Features erhalten den Programmiertrieb und die Motivation besser als Doku warten oder Rückwartskompatibilität erhalten.
Das steht vollkommen außer Frage und kennt sicher auch jeder. Aber leider hilft die beste Programmierung nichts, wenn die Doku dazu fehlt, lückenhaft oder Schrott ist. Schrott ist sie Gott sei dank nicht, aber lückenhaft und zwar inzwischen sehr lückenhaft, wie ich finde.


Ich denke am besten wäre es, wenn setstate sich mal äußert, wie er sich das weitere Vorgehen vorstellt. Es sind ja einige bereit zu helfen, aber dann muss er sagen wie am besten. Sollte weitere nix kommen, dann sollten wir wirklich auf ein neues Thema ausweichen und uns selbst um die Doku im Wiki kümmern. Dann aber auch so, dass das Thema nur zur Findung hilft und die Doku selbst im Wiki stattfindet.
Titel: Antw:FTUI 2.5
Beitrag von: drhirn am 06 Februar 2017, 15:23:55
Mein Senf zum Thema "Update-Problematik": Es hindert euch eigentlich niemand daran, eine zweite FTUI-Instanz anzulegen, die für Tests verwendet werden kann, oder?
Die Updates wandern in die Test-Instanz und wenn man damit zufrieden ist, kann man die Files dann ja händisch in die Produktiv-Instanz kopieren.

Und dann möchte ich noch daran erinnern, dass setstate das alles in seiner Freizeit macht und sein grandioses Produkt uns allen kostenfrei zur Verfügung stellt. Mal ganz abgesehen davon, dass er sich sehr viel Zeit nimmt, die ganzen Fragen zu beantworten.
Wer dennoch mit seiner Arbeit nicht zufrieden ist, dem steht es frei, entweder mitzuhelfen, oder ein Fork zu machen und das Projekt selbst weiter zu entwickeln. Beides schlauer, als nur zu meckern.
Titel: Antw:FTUI 2.5
Beitrag von: Amenophis86 am 06 Februar 2017, 16:14:45
Ehrlich gesagt sind wir von Meckern weit entfernt, da wir hier einige konstruktive Vorschläge unterbreitet haben und auch mehrfach unsere Hilfe angeboten haben. Das setstate das Ganze kostenlos und in seiner Freizeit macht, wurde zu keinem Zeitpunkt außer Acht gelassen.

Der von dir unterbreitete Vorschlag ist sicher eine Möglichkeit, aber ich denke, dass er mehr Sinn macht, dass der Maintainer in einem Developer Zweig arbeitet und diesen erst nach Tests zum Hauptzweig macht. So, wie es so ziemlich jede Software tut und sich eigentlich bewährt hat :) Auch möchten wir das Produkt nicht selbst weiter entwickeln, sondern lediglich die Doku weiter anstoßen bzw. bei dieser helfen, dass sie der Entwicklung nicht zu weit hinterher rennt. Dies würde nämlich auch den nötigen Support eingrenzen, da viele die Infos schon über die Doku bekommen + das "Beschweren" über plötzliches nicht mehr funktionieren, ohne Ankündigung würde sich reduzieren.
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 06 Februar 2017, 16:23:39
Ich wäre für das FHEM Wiki als Hauptdoku. Jeder der ein Problem lösen konnte und sich fragt, warum steht das nirgends, sollte das gleich im Wiki eintragen. Am besten Unterseiten nach Widget getrennt und ein großer Punkt "get started" mit Hinweisen zu Layout, Positionierung, Farben usw. Viel mit Verlinkungen über Schlagworte und Inhaltsverzeichnisse. Und viele Codesnipsel  - nur mit den minimal notwendigen Attributen und Klassen. Das Erfolgsgeheimnis von Stackoverflow ist ja auch, dass man direkt unter der Frage immer die beste Lösung bekommt, ohne lange zu Scrollen. Meist mit direkt kopierbaren Code Beispiel. Das Github Wiki von nesges finde ich zum Beispiel auch sehr übersichtlich.

Das Github Repo möchte ich gerne zur Sourceverwaltung nutzen, mit beliebigen (vertretbaren) Zwischenständen. Produktive UIs sollten sich nicht direkt davon Updaten. Die Versuch mit dem Eval Zweig letztes Jahr war auch nicht das Gelbe für mich und die Empörung nach dem Merge (was ich ewig vor mir hergeschoben habe) ähnlich groß wie gerade.


Titel: Antw:FTUI 2.5
Beitrag von: drhirn am 06 Februar 2017, 16:50:38
Ja, FHEM-Wiki ist ein guter Plan. Hat aber halt auch den Nachteil, dass man es warten muss ;). Und man bräuchte dann ein ausführliches "Whats New" irgendwo, damit man von den Neuerungen auch erfährt und das Wiki dementsprechend anpassen kann.
Alles in allem wird aber wohl trotzdem ein großer Teil der Dokumentation an dir hängen bleiben, einfach weil du am besten weißt, was geändert wurde. Das werden wir dir wohl nicht ersparen können ;)
Titel: Antw:FTUI 2.5
Beitrag von: viegener am 06 Februar 2017, 17:05:47
Zitat von: setstate am 06 Februar 2017, 16:23:39
Ich wäre für das FHEM Wiki als Hauptdoku. Jeder der ein Problem lösen konnte und sich fragt, warum steht das nirgends, sollte das gleich im Wiki eintragen. Am besten Unterseiten nach Widget getrennt und ein großer Punkt "get started" mit Hinweisen zu Layout, Positionierung, Farben usw. Viel mit Verlinkungen über Schlagworte und Inhaltsverzeichnisse. Und viele Codesnipsel  - nur mit den minimal notwendigen Attributen und Klassen. Das Erfolgsgeheimnis von Stackoverflow ist ja auch, dass man direkt unter der Frage immer die beste Lösung bekommt, ohne lange zu Scrollen. Meist mit direkt kopierbaren Code Beispiel. Das Github Wiki von nesges finde ich zum Beispiel auch sehr übersichtlich.

Das Github Repo möchte ich gerne zur Sourceverwaltung nutzen, mit beliebigen (vertretbaren) Zwischenständen. Produktive UIs sollten sich nicht direkt davon Updaten. Die Versuch mit dem Eval Zweig letztes Jahr war auch nicht das Gelbe für mich und die Empörung nach dem Merge (was ich ewig vor mir hergeschoben habe) ähnlich groß wie gerade.


FHEMWiki und nur eine Hauptdoku finde ich gut - Github mit Zwischenständen finde ich auch richtig. Die Idee mit dem jeder der was findet sollte es ins Wiki bringen kann man bestimmt auch hier einbringen indem man vorsichtig dazu auffordert...

Ich denke es gibt auch genügend Freiwillige um ein Betatestteam aufzustellen, ich mache das häufig auch bei Features in meinen MOdulen, dass Leute, die das haben möchten auch beim Testen helfen. Das FTUI hat soviele Nutzer, dass man das vermutlich auch formaler organisieren könnte ohne dass Du das machen müsstest.

@drhirn: Die Beiträge fand ich sehr konstruktiv und kein Meckern - viele tragen hier auch bei (inkl mir) und nur in ihrer Freizeit also kann ich Deine Kommentare nicht nachvollziehen.



Titel: Antw:FTUI 2.5
Beitrag von: drhirn am 06 Februar 2017, 17:08:45
Zitat von: viegener am 06 Februar 2017, 17:05:47
@drhirn: Die Beiträge fand ich sehr konstruktiv und kein Meckern - viele tragen hier auch bei (inkl mir) und nur in ihrer Freizeit also kann ich Deine Kommentare nicht nachvollziehen.

Hmm, mir war die Grundeinstellung teilweise etwas zu negativ. Ich muss aber dazusagen, dass ich diesen Eindruck v.a. in anderen Threads erhalten habe.
Titel: Antw:FTUI 2.5
Beitrag von: Standarduser am 06 Februar 2017, 17:15:35
Da ich selbst auch an der Doku interessiert bin und auch gerne daran mitarbeiten möchte, würde ich folgenden Vorschlag unterbreiten:

Wer eröffnen ein neues Thema "[FHEM Tablet-UI] Dokumentation (Diskussionsthread)", um das Thema zentral zu bündeln und diesen Thread zu seiner ursprünglichen Bestimmung zurückkehren zu lassen.
Wir erstellen eine Gliederung, ähnlich wie set state geschrieben hat und wer sich daran beteiligen möchte, bekommt ein Widget zugeteilt und erstellt die initiale Doku dazu.
Wenn das geschafft ist, kann man ja in den normalen Wiki-Betrieb übergehen und jeder ist eingeladen, etwas zu verbessern.

Kämen wir so nicht am schnellsten voran?
Titel: Antw:FTUI 2.5
Beitrag von: drhirn am 06 Februar 2017, 17:23:59
Leg los mit dem Thread

Schlage aber vor, die Dokumentation dann gleich im Wiki zu machen. Ohne Umweg über's Forum. Bzw. für Leute, die keinen Wiki-Zugang haben, einfach die erstellte Doku hier im Wiki-Thread (https://forum.fhem.de/index.php/board,80.0.html) mit der Bitte um Einstellung abzulegen.
Titel: Antw:FTUI 2.5
Beitrag von: viegener am 06 Februar 2017, 18:16:10
Zitat von: drhirn am 06 Februar 2017, 17:08:45
Hmm, mir war die Grundeinstellung teilweise etwas zu negativ. Ich muss aber dazusagen, dass ich diesen Eindruck v.a. in anderen Threads erhalten habe.

Schwamm drüber - denn ja ich kenne diese Statements auch

Das mit der Doku geht ja schon gut los :)

Ich versuche noch zuerst herauszufinden warum ich kein tablet ui mehr habe  ;) - heute morgen war nicht genug zeit...

@setstate: Wenn das mit den Zwischenständen, die Du oben erwähnst laufen soll, vielleicht macht es Sinn diese Zwischenstände ins fhem-svn zu verlagern? Oder willst Du lieber Branches in github verwenden?


Titel: Antw:FTUI 2.5
Beitrag von: setstate am 06 Februar 2017, 18:34:25
Oder ein Gremium stimmt ab, welcher Zwischenstand aus dem Github ins FHEM-svn gelangen darf, und ich commite nach Belieben im Github weiter. Stable-Updates dann nur noch aus dem FHEM-svn, Developer-Version aus dem Github
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 06 Februar 2017, 19:15:47
Mit der 2.5 werden die mi-Icons bei mir nicht mehr angezeigt.

Ist das auch die Ursache für das Einrücken der 3 Elemente?


<!DOCTYPE html>
<html>
<head>
  <!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
         * Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM Wohnzimmer</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="76">
<meta name="widget_base_height" content="124">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="gridster_disable" content="1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->

<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<!--
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-pc.css" />
-->

<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/material-icons.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/www/tablet/customfonts/font1/style.css"/>
<link rel="stylesheet" href="/fhem/www/tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="lib/material-icons.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/m_myStyle.css" />
<link rel="stylesheet" href="css/fhem-mobil-ui-dark.css" />



<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
    <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
    <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>

<!-- Enable this lines for usage with WebViewControl --><!-- -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->

<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-costum.css" />


</head>
<body>

    <!-- Demo FTUI 2.1 mobil page with slideout navigation -->

    <nav id="menu" class="bg-gray">
<section>
<div class="hbox">

<div class="vbox grow-3">
<div data-type="link" class="default large" data-icon-left="fa-music" data-active-color="green"
data-load="#t_musik_kueche"
data-url="#tablet/t_musik_kueche.html"
data-color="gray"
data-active-pattern="(.*#t_musik_kueche.html)">
</div>
<div class="tiny gray">Küche
</div>
</div>
<div class="vbox grow-3">
<div data-type="link" class=" large" data-icon-left="fa-music" data-active-color="green"
data-load="#t_musik_bad"
data-url="#tablet/t_musik_bad.html"
data-color="gray"
data-active-pattern="(.*#t_musik_bad.html)">
</div>
<div class="tiny gray">Bad</div>
</div>
<div class="vbox grow-3">
<div data-type="link" class=" large" data-icon-left="fa-music" data-active-color="green"
data-load="#t_musik_wohnzimmer"
data-url="#tablet/t_musik_wohnzimmer.html"
data-color="gray"
data-active-pattern="(.*#t_musik_wohnzimmer.html)">
</div>
<div class="tiny gray"
>Wohnzimmer</div>
</div>
<div class="vbox grow-3">
<div data-type="link" class=" large" data-icon-left="fa-music" data-active-color="green"
data-load="#t_musik_iphone"
data-url="#tablet/t_musik_iphone.html"
data-color="gray"
data-active-pattern="(.*#t_musik_iphone.html)">
</div>
<div class="tiny gray">iPhone</div>
</div>

</div>
</section>


<div data-type="link" class="default top-space large" data-width="150" data-text-align="left" data-active-color="green" data-color="gray"
data-icon-left="fa-dashboard"
data-load="#t_dashboard"
data-url="#tablet/t_dashboard.html"
data-active-pattern="(.*#t_dashboard.html)">Dashboard</div>
<div data-type="link" class="large top-space" data-width="150" data-text-align="left" data-color="gray" data-active-color="green"
data-icon-left="fa-home"
data-load="#t_wohnzimmer"
data-url="#tablet/t_wohnzimmer.html"
data-active-pattern="(.*#t_wohnzimmer.html)">Wohnzimmer</div>
        <div data-type="link" class="large top-space right-narrow" data-width="150" data-text-align="left" data-color="gray" data-active-color="green"
data-icon-left="fa-bed"       
data-load="#t_schlafzimmer"
data-url="#tablet/t_schlafzimmer.html"
data-active-pattern=".*#t_schlafzimmer.html">Schlafzimmer</div>
        <div data-type="link" class="large top-space right-narrow" data-width="150" data-text-align="left" data-color="gray" data-active-color="green"
data-icon-left="mi-kitchen"
data-load="#t_kueche"
data-url="#tablet/t_kueche.html"
data-active-pattern=".*#t_kueche.html">Küche</div>
        <div data-type="link" class="nocache large top-space right-narrow" data-width="150" data-text-align="left" data-color="gray" data-active-color="green"
data-icon-left="fa-bathtub"
data-load="#t_bad"
data-url="#tablet/t_bad.html"
data-active-pattern=".*#t_bad.html">Bad</div>
<div data-type="link" class="large top-space" data-width="150" data-text-align="left" data-active-color="green" data-color="gray"
data-icon-left="mi-child_friendly"
data-load="#t_hobbyzimmer"
data-url="#tablet/t_hobbyzimmer.html"
data-active-pattern="(.*#t_hobbyzimmer.html)">Hobbyzimmer</div>
<div data-type="link" class="large top-space" data-width="150" data-text-align="left" data-active-color="green" data-color="gray"
data-icon-left="fa-cloud"
data-load="#t_wetter"
data-url="#tablet/t_wetter.html"
data-active-pattern="(.*#t_wetter.html)">Wetter</div>
<div data-type="link" class="large top-space" data-width="150" data-text-align="left" data-active-color="green" data-color="gray"
data-icon-left="fa-gears"
data-load="#t_system"
data-url="#tablet/t_system.html"
data-active-pattern="(.*#t_system.html)">System</div>
<div data-type="link" class="large top-space" data-width="150" data-text-align="left" data-active-color="green" data-color="gray"
data-icon-left="fa-music"
data-load="#t_musik"
data-url="#tablet/t_musik.html"
data-active-pattern="(.*#t_musik.html)">Musik</div>
    </nav>



    <main id="panel" class="">
        <header id="header-nav" class="bg-lightgray">
         <div class="hbox">
<div class="vbox items-left left-space">
<div data-type="slideout" data-icon-color="white" class=""></div>
</div>
<div class="vbox grow-9 items-left">
<div id="linkname" class="big center-align middle"></div>
</div>
<div class="vbox grow-2 right-narrow">
<div class="hbox">
<div data-type="clock" data-format="H:i:s" class="cell big right-narrow"></div>
</div>
  </div>
</div>
        </header>


<div class="page" id="t_dashboard"></div>
<div class="page" id="t_wohnzimmer"></div>
<div class="page" id="t_schlafzimmer"></div>
<div class="page" id="t_kueche"></div>
<div class="page" id="t_bad"></div>
<div class="page" id="t_hobbyzimmer"></div>
<div class="page" id="t_wetter"></div>
<div class="page" id="t_system"></div>
<div class="page" id="t_musik_kueche"></div>
<div class="page" id="t_musik_bad"></div>
<div class="page" id="t_musik_wohnzimmer"></div>
<div class="page" id="t_musik_iphone"></div>
<div class="page" id="t_musik_uebersicht"></div>
</main>




</body>
</html>


Eingebunden sind die Icons
<link rel="stylesheet" href="/fhem/tablet/lib/material-icons.min.css" />
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 06 Februar 2017, 22:29:07
Zitat von: TWART016 am 06 Februar 2017, 19:15:47
Mit der 2.5 werden die mi-Icons bei mir nicht mehr angezeigt.

Ist das auch die Ursache für das Einrücken der 3 Elemente?

Nö, der Grund für das Einrücken der 3 Elemente ist die class right-narrow, die Du bei diesen 3 Elementen eingefügt hast.
Die mi-Icons brauchst Du in V2.5 gar nicht separat zu definieren. Auch wenn ich eigentlich kein Freund dieses terminus technicus bin: RTFM

Im ersten Posting dieses Threads hier steht unter dem ersten Indexpunkt "- dynamisches Laden der Main-CSS Files und Standard-JS-Libs." genau wie der Header in V2.5 auszusehen hat. Vergleiche das mal mit Deinem Code und ändere ihn entsprechend ab. Ich trau mir fast wetten, dass die mi-Icons danach wieder funktionieren...

Nothing for ungood, but this must once have said been ;-)
Titel: Antw:FTUI 2.5
Beitrag von: TheUnicornXXL am 06 Februar 2017, 23:06:13
Zitat von: setstate am 06 Februar 2017, 02:07:27
@tomster: Danke für das HowTo  :D

Aber ich werde die automatische Erkennung für das Base-Directory wieder einbauen. Kommt mit der nächsten Version. Dann kann man sich das mit den Links sparen.
Aber bitte optional oder erst nach der Überprüfung ob die notwendigen Dateien im eigenen Base-Directory liegen.
Ich möchte die Kontrolle darüber haben welches Framework benutzt wird.

Grüße

Stefan

P.s.: Einen super Job machst Du. Ist nicht einfach ein solch umfangreiches Framework zu programmieren, geschweige denn zu warten.
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 06 Februar 2017, 23:25:28
Zitat von: tomster am 06 Februar 2017, 22:29:07
Nö, der Grund für das Einrücken der 3 Elemente ist die class right-narrow, die Du bei diesen 3 Elementen eingefügt hast.
stimmt, hatte ich übersehen.

Zitat von: tomster am 06 Februar 2017, 22:29:07
Die mi-Icons brauchst Du in V2.5 gar nicht separat zu definieren. Auch wenn ich eigentlich kein Freund dieses terminus technicus bin: RTFM
Ich wollte auf Nummer sicher gehen und die definieren. Auf meinen anderen Seite funktioniert das nach wie vor auch.
Titel: Antw:FTUI 2.5
Beitrag von: TheUnicornXXL am 06 Februar 2017, 23:27:07
Zitat von: setstate am 06 Februar 2017, 16:23:39
Ich wäre für das FHEM Wiki als Hauptdoku. Jeder der ein Problem lösen konnte und sich fragt, warum steht das nirgends, sollte das gleich im Wiki eintragen. Am besten Unterseiten nach Widget getrennt und ein großer Punkt "get started" mit Hinweisen zu Layout, Positionierung, Farben usw. Viel mit Verlinkungen über Schlagworte und Inhaltsverzeichnisse. Und viele Codesnipsel  - nur mit den minimal notwendigen Attributen und Klassen. Das Erfolgsgeheimnis von Stackoverflow ist ja auch, dass man direkt unter der Frage immer die beste Lösung bekommt, ohne lange zu Scrollen. Meist mit direkt kopierbaren Code Beispiel. Das Github Wiki von nesges finde ich zum Beispiel auch sehr übersichtlich.

Das Github Repo möchte ich gerne zur Sourceverwaltung nutzen, mit beliebigen (vertretbaren) Zwischenständen. Produktive UIs sollten sich nicht direkt davon Updaten. Die Versuch mit dem Eval Zweig letztes Jahr war auch nicht das Gelbe für mich und die Empörung nach dem Merge (was ich ewig vor mir hergeschoben habe) ähnlich groß wie gerade.
Ich würde die verschiedenen Versionen getrennt lassen.
Das funktioniert bei vielen anderen Programmen. Gibt halt dann keine Updates für ältere Versionen mehr, aber auch kein gemeckere wegen Versionssprüngen. Über Korrekturen von schweren Fehlern kann man sich noch streiten, aber sonst?
Titel: Antw:FTUI 2.5
Beitrag von: TheUnicornXXL am 07 Februar 2017, 00:01:07
Hallo Allerseits,

ich komme gerade mit der Darstellung vom Thermostat nicht zurecht. Das sieht nicht schön aus, da das Thermostat nicht immer zentriert ist.
Ich verstehe vor allem nicht warum beim Schlafzimmer die Darstellung des Thermometers so ist, wie ich sie haben möchte. Hier habe ich zwei Fenster eingefügt deren Darstellungsreihenfolge mir auch nicht ganz so klar ist.
Ich habe schon viel probiert, aber jedes Mal ist die Zellenüberschrift hochgerutscht  >:(

Hat wer hierfür eine Lösung?

Grüße

Stefan


            <li data-row="1" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Wohnzimmer<div data-type="symbol" data-device="Wohnzimmer.Fenster" class="small right"></div></header>
                <div class="container">
                <div data-type="thermostat" data-device="Wohnzimmer.Thermostat_Climate" data-valve="ValvePosition" class="cell"></div>
            </div>
            </li>
            <li data-row="2" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Schlafzimmer<div data-type="symbol" data-device="Schlafzimmer.Fenster.rechts" class="small right"></div>
                    <div data-type="symbol" data-device="Schlafzimmer.Fenster.links" class="small right"></div></header>
                <div class="container">
                <div data-type="thermostat" data-device="Schlafzimmer.Thermostat_Climate" data-valve="ValvePosition" class="cell"></div>
            </div>
            </li>
            <li data-row="3" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Bad<div data-type="symbol" data-device="Bad.Fenster" class="small right"></div></header>
                <div class="container">
                <div data-type="thermostat" data-device="Bad.Heizung_Clima" data-valve="ValvePosition" class="cell"></div>
            </div>
            </li>
            <li data-row="4" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Kueche<div data-type="symbol" data-device="Kueche.Fenster" class="small right"></div></header>
                <div class="container">
                <div data-type="thermostat" data-device="Kueche.Thermostat_Climate" data-valve="ValvePosition" class="cell"></div>
            </div>
            </li>
Titel: Antw:FTUI 2.5
Beitrag von: viegener am 07 Februar 2017, 00:08:27
Zitat von: TheUnicornXXL am 06 Februar 2017, 23:27:07
Ich würde die verschiedenen Versionen getrennt lassen.
Das funktioniert bei vielen anderen Programmen. Gibt halt dann keine Updates für ältere Versionen mehr, aber auch kein gemeckere wegen Versionssprüngen. Über Korrekturen von schweren Fehlern kann man sich noch streiten, aber sonst?

Den Vorschlag verstehe ich nicht? Schlägst Du vor, dass jede neue Version neu installiert werden sollte und bei welchen Programmen gibt es keine Möglichkeit von einer Version auf die andere zu wechseln und wer soll denn bitte alte Versionen warten - das wäre ja eine Erhöhung des Aufwandes für alle - versch. Wartungszweige - versch. Dokumentationen etc



Titel: Antw:FTUI 2.5
Beitrag von: viegener am 07 Februar 2017, 00:18:46
Ich habe noch ein paar Dinge zu 2.5 herausgefunden:

Mein Hauptproblem war:
  <meta name='gridster_starthidden' content='1'>
Das hat bis 2.4.3 funktioniert - jetzt aber wohl nicht mehr - wenn man statt 1 eine 0 einsetzt erscheint wieder ein UI.

Durch die neuen Grössenwerte verschiebt sich einiges, und die Icons / Buttons musste ich tendentiell eher kleiner machen

Zum Slider gibt es folgende Erkenntnisse:
- Im slider gibt es ja die Class "mini" diese beisst sich mit der Fontgrösse für den textwert, der dann auch mini dargestellt wird
(Das war allerdings auch schon bei 2.4.x) so
- Im slider wird der textvalue nicht mehr zentriert (zumindest habe ich das nicht hinbekommen)
@setstate: Soll ich selber eine mögliche Lösung suchen und einen pull request stellen oder willst Du lieber selber korrigieren?


Titel: Antw:FTUI 2.5
Beitrag von: TheUnicornXXL am 07 Februar 2017, 01:02:56
Zitat von: viegener am 07 Februar 2017, 00:08:27
Den Vorschlag verstehe ich nicht? Schlägst Du vor, dass jede neue Version neu installiert werden sollte und bei welchen Programmen gibt es keine Möglichkeit von einer Version auf die andere zu wechseln und wer soll denn bitte alte Versionen warten - das wäre ja eine Erhöhung des Aufwandes für alle - versch. Wartungszweige - versch. Dokumentationen etc

Dafür wäre aber alles erheblich stabiler. Derzeit muss ich meine Installation sichern bzw. in einem anderen Verzeichnis unterbringen um sicher zu gehen, dass ein Update nicht alles zerschießt.
Man müsste ja nur die Installations und Update URL entsprechend anpassen.
Und zum Thema Doku... Hier gäbe es kaum Mehraufwand, für eine neue Version kopiert man den alten Stand ins neue Verzeichnis und passt sie dort an. Die alte Version sollte sich ja nicht ändern.

Wer was neues will soll auf den neuen Zweig aufspringen.
Der alte Versionszweig sollte wirklich nur noch bei wirklich schlimmen Fehlern geändert werden,
Titel: Antw:FTUI 2.5
Beitrag von: viegener am 07 Februar 2017, 01:11:10
Zitat von: TheUnicornXXL am 07 Februar 2017, 01:02:56
Dafür wäre aber alles erheblich stabiler. Derzeit muss ich meine Installation sichern bzw. in einem anderen Verzeichnis unterbringen um sicher zu gehen, dass ein Update nicht alles zerschießt.
Man müsste ja nur die Installations und Update URL entsprechend anpassen.
Und zum Thema Doku... Hier gäbe es kaum Mehraufwand, für eine neue Version kopiert man den alten Stand ins neue Verzeichnis und passt sie dort an. Die alte Version sollte sich ja nicht ändern.

Wer was neues will soll auf den neuen Zweig aufspringen.
Der alte Versionszweig sollte wirklich nur noch bei wirklich schlimmen Fehlern geändert werden,

Das verstehe ich noch weniger, denn wenn Du nicht willst, dass ein Update Deine existierende UI zerschiesst mach einfach kein Update von FTUI???? Wenn Du ein update machst, willst Du doch die neue Version, so ist es doch überall in FHEM (und eigentlich auch generell)

Die alte Version zu sichern mache ich nicht, denn ich habe ja tägliche Backups - Backups sind auch generelll durchaus nicht nur da nützlich ;)
Titel: Antw:FTUI 2.5
Beitrag von: TheUnicornXXL am 07 Februar 2017, 01:19:57
Zitat von: viegener am 07 Februar 2017, 01:11:10
Das verstehe ich noch weniger, denn wenn Du nicht willst, dass ein Update Deine existierende UI zerschiesst mach einfach kein Update von FTUI???? Wenn Du ein update machst, willst Du doch die neue Version, so ist es doch überall in FHEM (und eigentlich auch generell)

Die alte Version zu sichern mache ich nicht, denn ich habe ja tägliche Backups - Backups sind auch generelll durchaus nicht nur da nützlich ;)

Wenn ich mir den Thread anschaue sind Updates auch sinnvoll um Fehlerkorrekturen zu installieren. Nicht nur um neue Versionen einzuspielen.
Beides sollte man trennen.
Titel: Antw:FTUI 2.5
Beitrag von: tomster am 07 Februar 2017, 02:40:55
Zitat
Ich wollte auf Nummer sicher gehen und die definieren. Auf meinen anderen Seite funktioniert das nach wie vor auch.
Das glaube ich Dir. Ähh, nicht. Habe diese "Experiences" auch gelegentlich bei meinem Vater:
Er: "Das Handy geht nicht mehr. Ich habe aber NIIIXXX geändert."
Ich: "Klar... Und was ist das? Das war doch vorher anders!?"
Er: "Ach so das. Hat doch gar nix mit dem zu tun, oder?"
Ich: "Ähh, ja. Nee. Is egal..."

Ich kenne schlichtweg keine 2 vergleichbaren Systeme. Zumindest nicht bei etwas wie FTUI/FHEM, dass minütlich mehrmals den Status zwischen Test-/Produktivbetrieb wechseln kann. Manchmal ist es ein Typo, manchmal ein versehentliches right-narrow. Auch wenn das auf anderen Seiten "nach wie vor" funktioniert, meist sitzt das "Problem" vor dem Bildschirm...

Ich kann nur versuchen zu Erklären, dass ich setstate - den ich weder persönlich kenne, noch mit ihm verwandt oder verschwägert bin - als jemanden einschätze, der sehr wohl überlegt was er tut. Nicht nur codeseitig.

FTUI funktioniert, nach Angabe (so vorhanden... Sorry, setstate;-) ) benutzt, genauso wie gedacht. Es ist ein "Framework", kein RTR-KlickiBunti-GUI.
Quasi wie in einem Open-Source-Selbstausbau-Haus:
Du willst Geld sparen beim Fliesenleger? OK, dann lern Fliesenlegen. Und am Besten: lern gleich so Fliesenlegen, damit Du anderen das Fliesenlegen erklären kannst. Aber gefälligt umsonst!

Is ja bei FHEM an sich auch nicht anders. Eine Community. Es hilft jeder gern.

Aber Angaben wie:"Auf meinen anderen Seite funktioniert das nach wie vor auch." steigern nicht wirklich die Bereitschaft zur Hilfe. Helfen, ja. Sogar gern! Aber erst fragen wobei? Nöö, lass mal. Click ich halt lieber in den nächsten Thread...

Sorry, TWART016, dass gerade Du herhalten musstest. Nix persönliches; es musste nur einfach mal raus.

So, und jetzt bauen wir zusammen eine saubere WiKi-Seite auf, oder?
LG,
Tom
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 07 Februar 2017, 03:14:15
Zitat von: TheUnicornXXL am 06 Februar 2017, 23:06:13
Aber bitte optional oder erst nach der Überprüfung ob die notwendigen Dateien im eigenen Base-Directory liegen.
Ich möchte die Kontrolle darüber haben welches Framework benutzt wird.

Grüße

Stefan

P.s.: Einen super Job machst Du. Ist nicht einfach ein solch umfangreiches Framework zu programmieren, geschweige denn zu warten.

Die Info zum Base-Directory wird aus der src zum fhem-tablet-ui.js geholt.

Html-Files liegen im ./mobile Folder, dann gibt man die Position vom fhem-tablet-ui.js so an:
<script src="../js/fhem-tablet-ui.js" defer></script>
Das Base-Dir ist also ../

<script src="js/fhem-tablet-ui.js" defer></script>
Das Base-Dir ist also "."

<script src="/fhem/tablet_dev/js/fhem-tablet-ui.js" defer></script>
Base dir: /fhem/tablet_dev/

<script src="http://fhemserver.local:8083/fhem/ftui_dev/js/fhem-tablet-ui.js" defer></script>
Base dir: http://fhemserver.local:8083/fhem/ftui_dev/
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 07 Februar 2017, 03:16:58
Zitat von: viegener am 07 Februar 2017, 00:18:46
Ich habe noch ein paar Dinge zu 2.5 herausgefunden:

Mein Hauptproblem war:
  <meta name='gridster_starthidden' content='1'>
Das hat bis 2.4.3 funktioniert - jetzt aber wohl nicht mehr - wenn man statt 1 eine 0 einsetzt erscheint wieder ein UI.

Durch die neuen Grössenwerte verschiebt sich einiges, und die Icons / Buttons musste ich tendentiell eher kleiner machen

Zum Slider gibt es folgende Erkenntnisse:
- Im slider gibt es ja die Class "mini" diese beisst sich mit der Fontgrösse für den textwert, der dann auch mini dargestellt wird
(Das war allerdings auch schon bei 2.4.x) so
- Im slider wird der textvalue nicht mehr zentriert (zumindest habe ich das nicht hinbekommen)
@setstate: Soll ich selber eine mögliche Lösung suchen und einen pull request stellen oder willst Du lieber selber korrigieren?

schaue ich mir an ... Danke für die Info
Titel: Antw:FTUI 2.5
Beitrag von: sinus61 am 07 Februar 2017, 13:01:07
Zitat von: TheUnicornXXL am 07 Februar 2017, 01:19:57
Wenn ich mir den Thread anschaue sind Updates auch sinnvoll um Fehlerkorrekturen zu installieren. Nicht nur um neue Versionen einzuspielen.
Beides sollte man trennen.

Sehe ich nicht so. Sowas mag man vielleicht bei einem kommerziellem Produktivsystem erwarten ist hier aber etwas überzogen. Und auch sonst ist es bei FHEM ja nicht üblich, keiner pflegt doch alte Modulversionen neben neuen Modulversionen. Hier müsste man ja mit der Zeit einen ganzen Haufen alte Versionen mit Fehlerkorrekturen versorgen. Und die Doku passt irgendwann auch nirgends mehr.

Wer das braucht sollte sich doch selber ein Testsystem aufsetzen und nur dort Updates machen und die dann in sein eigenes Produktivsystem übernehmen.
Titel: Antw:FTUI 2.5
Beitrag von: drhirn am 07 Februar 2017, 13:02:56
Zitat von: sinus61 am 07 Februar 2017, 13:01:07
Wer das braucht sollte sich doch selber ein Testsystem aufsetzen und nur dort Updates machen und die dann in sein eigenes Produktivsystem übernehmen.

Wie ich bereits geschrieben habe: Einfach eine zweite FTUI-Instanz anlegen. Einfacher geht's nicht.
Titel: Antw:FTUI 2.5
Beitrag von: Kermit20 am 07 Februar 2017, 16:19:32
Hallo,

ich habe mein FTUI nun fast ganz überarbeitet und neu strukturiert. Aktuell hängt mein Swiper noch. Hat sich hier an den Definitionen was geändert ?

Ich habe folgende Struktur umgesetzt:

Gridster
     Sheet
         Row1
         Row -> Swiper über Datatype definiert und dann mittels ul li und den div "Elementen" gefüllt / wie bisher dokumentiert.

Ging bisher auch immer.... :) nur nach meiner Umstellung auf die neue Struktur  ist scheinbar was schief gelaufen, was ich noch nicht lokalisieren konnte. Wenn sich an der Definition nichts geändert hat.... liegt der Hund wo anders begraben.
Titel: Antw:FTUI 2.5
Beitrag von: Ulm32b am 07 Februar 2017, 18:31:50
Was geht denn beim Swiper im einzelnen nicht? Bereits mit 2.4 und auch mit 2.5 beobachte ich unter Android 5, pagebutton und verschiedenen Browsern folgende Eigentümlichkeit:

Es wird das erste Bild und ein (!) Punkt dargestellt. Auch nach Stunden werden die anderen Seiten nicht angeboten. Wenn ich aber das Tablet um 90 Grad drehe (Lageerkennung aktiv), werden die anderen Seiten des Swipers stets (!) zuverlässig geladen (Punkte erscheinen). Auch nach dem Zurückdrehen des Tablets bleiben sie dann erhalten und der Swiper funktioniert einwandfrei.

Kennt das jemand?
Titel: Antw:FTUI 2.5
Beitrag von: Kermit20 am 07 Februar 2017, 19:07:33
ne soweit kommt es erst gar nicht. Es sind alle Inhalte untereinander dargestellt und der Positionspunkt oben drüber.

Edit:

Ich habe eben noch etwas herumgespielt, es erschien nun folgende Fehler Meldung:

swiper.jquerry.min.js:16 Failed.... siehe Bild.
Titel: Antw:FTUI 2.5
Beitrag von: traveltheworld am 07 Februar 2017, 21:16:36
Mir ist folgendes nach dem Update auf FTUI 2.5 aufgefallen:

- die Ladezeit zum Aufbau der Webseite mit FTUI ist viel länger als vorher. Dauerte es früher gefühlt nur zwei bis drei Sekunden, dauert es jetzt ungefähr 10 Sekunden. Gemessen auf einem Acer Iconia B3-A20 Tablet im Fully Browser.
Auffällig ist, dass sich scheinbar erstmal die Seite mit Hintergrund und diversen Labels aufbaut, dann steht es mehrere Sekunden, bis anschließend alle weiteren Widgets (hauptsächlich Thermostats, Push Buttons und CircleMenus) erscheinen.

- das Symbol Widget "belegt viel mehr Platz". Das ftui-window Icon benötigt einen gewissen Platz, je nach Scaling, aber das ganze Widget benötigt ca. die vierfache Fläche inkl. Hintergrund. Das wird quasi umso schlimmer, je größer man das Scaling einstellt (z.B. grande). Das war schon früher so, aber da konnte man das mit einem Workaround per style Angabe auf nur 1em Breite/Höhe in den Griff bekommen.
Kann sich der Autor des Symbol Widgets dies mal ansehen? Derzeit muß ich das ftui-window Icon kleiner als früher darstellen, weil sonst alles bzgl. Anordnung ausser Band und Rand kommt.

- Noch ein Problem, aber wahrsch. unabhängig von der Version: ich benutze den Push-Button zum Lautstärke regeln (+/-). Wenn man den Button öfters hintereinander antippt, kommt er irgendwie durcheinander und verbleibt anschließend in der "gedrückt" Stellung, d.h. orange (und nicht grau). Weiteres Antippen funktioniert zwar sauber bzgl. auszulösender Ereignisse, aber er bleibt immer in der "gedrückt" Stellung, bis man die Webseite komplett neu lädt.
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 07 Februar 2017, 22:42:07
Zitat von: traveltheworld am 07 Februar 2017, 21:16:36
Mir ist folgendes nach dem Update auf FTUI 2.5 aufgefallen:

- die Ladezeit zum Aufbau der Webseite mit FTUI ist viel länger als vorher. Dauerte es früher gefühlt nur zwei bis drei Sekunden, dauert es jetzt ungefähr 10 Sekunden. Gemessen auf einem Acer Iconia B3-A20 Tablet im Fully Browser.
Auffällig ist, dass sich scheinbar erstmal die Seite mit Hintergrund und diversen Labels aufbaut, dann steht es mehrere Sekunden, bis anschließend alle weiteren Widgets (hauptsächlich Thermostats, Push Buttons und CircleMenus) erscheinen.
kann ich bestätigen. Bei mir braucht es auch über 5 Sekunden.
Titel: Antw:FTUI 2.5
Beitrag von: TWART016 am 07 Februar 2017, 23:27:45
Wie bekomme ich das Icon wieder horizontal zentriert und das "Ok" nach rechts?

Titel: Antw:FTUI 2.5
Beitrag von: TheUnicornXXL am 08 Februar 2017, 01:03:10
Zitat von: TheUnicornXXL am 07 Februar 2017, 00:01:07
Hallo Allerseits,

ich komme gerade mit der Darstellung vom Thermostat nicht zurecht. Das sieht nicht schön aus, da das Thermostat nicht immer zentriert ist.
Ich verstehe vor allem nicht warum beim Schlafzimmer die Darstellung des Thermometers so ist, wie ich sie haben möchte. Hier habe ich zwei Fenster eingefügt deren Darstellungsreihenfolge mir auch nicht ganz so klar ist.
Ich habe schon viel probiert, aber jedes Mal ist die Zellenüberschrift hochgerutscht  >:(

Hat wer hierfür eine Lösung?

Hallo Allerseits,

ich habe es nun hinbekommen indem ich den Code umgestellt habe und mit einer einzelnen Zelle in den Kacheln arbeite.

Mich würde interessieren warum das Schlafzimmer Thermostat auch im container zentriert dargestellt wurde?

Grüße

Stefan


            <li data-row="1" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Wohnzimmer<div data-type="symbol" data-device="Wohnzimmer.Fenster" class="small right"></div></header>
                <div class="sheet">
                    <div class="row">
                        <div data-type="thermostat" data-device="Wohnzimmer.Thermostat_Climate"
                             data-valve="ValvePosition" data-min=5 data-max=40 class="cell"></div>
                    </div>
                </div>
            </li>
            <li data-row="2" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Schlafzimmer<div data-type="symbol" data-device="Schlafzimmer.Fenster.rechts" class="small right"></div>
                        <div data-type="symbol" data-device="Schlafzimmer.Fenster.links" class="small right"></div></header>
                <div class="sheet">
                    <div class="row">
                        <div data-type="thermostat" data-device="Schlafzimmer.Thermostat_Climate"
                             data-valve="ValvePosition" data-min=5 data-max=40 class="cell"></div>
                    </div>
                </div>
            </li>
            <li data-row="3" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Bad<div data-type="symbol" data-device="Bad.Fenster" class="small right"></div></header>
                <div class="sheet">
                    <div class="row">
                        <div data-type="thermostat" data-device="Bad.Heizung_Clima"
                             data-valve="ValvePosition" data-min=5 data-max=40 class="cell"></div>
                    </div>
                </div>
            </li>
            <li data-row="4" data-col="7" data-sizex="1" data-sizey="1">
                <header align=left>Kueche<div data-type="symbol" data-device="Kueche.Fenster" class="small right"></div></header>
                <div class="sheet">
                    <div class="row">
                        <div data-type="thermostat" data-device="Kueche.Thermostat_Climate"
                             data-valve="ValvePosition" data-min=5 data-max=40 class="cell"></div>
                    </div>
                </div>
            </li>

Titel: Antw:FTUI 2.5
Beitrag von: Kermit20 am 08 Februar 2017, 12:34:40
Zitat von: Kermit20 am 07 Februar 2017, 19:07:33
ne soweit kommt es erst gar nicht. Es sind alle Inhalte untereinander dargestellt und der Positionspunkt oben drüber.

Edit:

Ich habe eben noch etwas herumgespielt, es erschien nun folgende Fehler Meldung:

swiper.jquerry.min.js:16 Failed.... siehe Bild.

ich konnte das Problem nun lösen.... Ich habe alles neu aufgesetzt und einheitlich formatiert..... danach lief es. (Vermutlich habe ich beim umbauen mit "nano" was mehrfach übersehen)
Titel: Antw:FTUI 2.5
Beitrag von: Stivmaster am 08 Februar 2017, 21:43:18
Hi,

Bei mir hatte es nach dem Update auch  viel länger gedauert beim aktualisieren. Es war ein nicht abgeschlossenes div dran Schuld.
Anscheinend ist die 2.5 nicht mehr so fehlertollerant.

Gesendet von meinem SM-P600 mit Tapatalk

Titel: Antw:FTUI 2.5
Beitrag von: roman1528 am 10 Februar 2017, 13:00:31
Zitat von: setstate am 23 Januar 2017, 22:25:41
- Änderung bei data-hide

Einheitlich zu "lock", "warn" und "reachable" ist jetzt auch bei "hide" die Definition folgendermaßen :

data-hide        -  Das Reading (Default: STATE des data-device)
data-hide-on   -  Der Wert, den das Reading haben muss, damit es versteckt wird (Default: 'true|1|on')
data-hide-off   -  Der Wert, den das Reading haben muss, damit es wieder sichtbar wird (Default '!on' <- bedeutet: Gegenteil von data-hide-on )

Hey setstate
du hast mal wieder 1A was abgeliefert mit dem Teil  ;D
bekommen wir für das Push-Widget auch noch data-hide? Sieht irgendwie doof aus wenn eine meiner Seiten halb leer ist weil ein Device offline ist, aber die Push-Widgets noch da sind.

Grüße^^
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 10 Februar 2017, 13:12:29
Push geht nicht? Komisch! Wüsste auf Anhieb keinen Grund dafür.
Titel: Antw:FTUI 2.5
Beitrag von: roman1528 am 10 Februar 2017, 15:11:33
Zitat von: setstate am 10 Februar 2017, 13:12:29
Push geht nicht? Komisch! Wüsste auf Anhieb keinen Grund dafür.

Bei mir definitiv nicht... bei symbol, switch, label problemlos

Nutze den push mit onclick ohne device...


<div onclick="var answer = confirm('RaspPi Neustart...\nBitte bestätigen!',''); function delay () { $('#raspi3').removeClass('invalid'); } if (answer) { ftui.setFhemStatus('trigger rpi_reboot_garage'); $.toast({heading:'Neustart!',text:'RaspPi wird neu gestartet...',textAlign:'center',hideAfter:30000,icon:'success',loader:true,loaderBg:'#0088CC'}); } else { $('#raspi3').addClass('invalid'); setTimeout(delay,500); }"
id="raspi3"
data-type="push"
data-icon="ro-raspi"
data-hide="fhem_garage:STATE"
data-hide-on="disconnected"
class="top-space">
</div>


data-hide per DEVICE:READING
funktioniert beim label-Widget tadelos.

Grüße^^
Titel: Antw:FTUI 2.5
Beitrag von: willibutz am 10 Februar 2017, 18:41:16
Hallo FTUI-Fans (bin ich natürlich auch  8)

seit dem Update auf 2.5 funktioniert bei meinem Dimmer der LOCK nicht mehr. Das Widget wird so angezeigt:
       
               <div data-type="dimmer" data-device="HUEGroup1"
data-lock="auto"
data-step="10"
data-set="pct"
data-dim="pct"
class="bigger"
></div>


wenn ich den Typ z.b. auf volume ändere, funktioniert LOCK wieder wie früher.
Ich habe zwar keine Ahnung von js, ab da ja scheinbar kein andere das Problem hat, habe ich einfach mal alle widget-Quellen verglichen und widget_dimmer.js testweise geändert

Original:

        //extra reading for lock
        me.elements.filterDeviceReading('lock', dev, par)
            .each(function (idx) {
                var elem = $(this);
                elem.data('readonly', elem.getReading('lock').val);
});


Fäschung: (geklaut aus fhem-tablet-ui.js)

        //extra reading for lock
        me.elements.filterDeviceReading('lock', dev, par)
            .each(function (idx) {
                var elem = $(this);
                //elem.data('readonly', elem.getReading('lock').val);
var value = elem.getReading('lock').val;
                if (elem.matchingState('lock', value) === 'on') {
                    elem.addClass('lock');
                }
                if (elem.matchingState('lock', value) === 'off') {
                    elem.removeClass('lock');
                }
});


Mit dieser Änderung kann ich auf jeden Fall den Dimmer wieder Locken. Da ich aber wie gesagt eigentlich keine Ahnung von der Materie habe, wäre es schön, wenn sich ein Auskenner das mal anschauen könnte.
Beim Vergleichen der Quellen habe ich auch festgestellt, dann der LINK genauso programmiert ist. Der scheint also im Augenblick auch nicht LOCKbar zu sein.

Danke dem Erfinder und allen anderen für ihre Unterstützung

Gruß willi
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 10 Februar 2017, 20:27:19
Hallo willibutz,

du hast Recht. Ich habe lock beim Dimmer vergessen "zu upzudaten"  ;D

Kommt beim nächsten Update wieder funktionierend mit
Titel: Antw:FTUI 2.5
Beitrag von: Gunther am 11 Februar 2017, 00:31:29
Ich habe mit meiner alten Oberfläche noch Probleme. Meine Startseite ist leer und zeigt folgende Messages:

Zitatjquery.toast.min.js:1
SyntaxError: Unexpected identifier
widget_label.js:1
SyntaxError: Unexpected identifier
widget_pagetab.js:1
SyntaxError: Unexpected identifier

Muss ich noch etwas beachten?
index.html sieht so aus:

<!DOCTYPE html>
<html>
<head>

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="widget_base_width" content="124">
    <meta name="widget_base_height" content="122">
<meta name="widget_margin" content="1">

<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<meta name='gridster_disable' content='1'>
<meta name="longpoll_delay" content="1000">

<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>


<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-wdtimer.css" />

    <!-- define your personal style here, it wont be overwritten  -->
    <!-- link rel="stylesheet" href="/fhem/tablet/css/fhem-green-ui.css" / -->
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/eigenefonts/gk/style.css">
<link rel="stylesheet" href="./css/wopr.css">
<link rel="stylesheet" href="./css/style.css">
<link rel="stylesheet" href="./css/own.css">

<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
    <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
    <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/widget_calview.js"></script>

<!-- Enable this lines for usage with WebViewControl --><!-- -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/pgm2/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'00001': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->

<title>FHEM-Tablet-UI</title>
</head>
<body>
<div class="gridster">

<ul>

<li class="halbTransparent" data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="inc_homebutton.html">
</li>

</ul>
</div>

</body>
</html>
Titel: Antw:FTUI 2.5
Beitrag von: arminius am 11 Februar 2017, 13:26:23
Hallo zusammen,

nach dem heutigen Update von tabletui werden Icons wesentlich größer dargestellt als bei der alten Version.
Somit passen bei mir die Icons, HUE Devices nicht mehr in die Container und ich muss alles anpassen.
Ist die größeren Änderung der Icons gewollt und ich muss jetzt alles anpassen oder ist das ein Bug.

Gruß
Arminius

Titel: Antw:FTUI 2.5
Beitrag von: traveltheworld am 11 Februar 2017, 13:49:59
damit meinst du sicher das Update auf V2.5
Siehe erstes Post in diesem Thread:
Zitat- Angeglichene Größen für Symbol/Switch und Label

- mini         : 50%
- tiny          : 60%
- small        : 80%
- normal      : 100%
- large        : 125%
- big           : 150%
- bigger      : 200%
- tall           : 350%
- grande      : 600%
- gigantic     : 144px

Durch die neuen Größen kann es bei bestehenden UIs zu Verschiebungen oder anderer Darstellung der Switches/Symbole kommen. Diese müssen angepasst werden.
Titel: Antw:FTUI 2.5
Beitrag von: setstate am 11 Februar 2017, 13:51:26
Das ist so gewollt. Eine Aufräumaktion.
Mit der nächsten Version ist die Schrift "bigger thin" dran. Das passt nicht in die Skala. Mit der 2.6 ist "bigger thin" durch "great thin" zu ersetzen, ansonsten wird es kleiner (200%) angezeigt, nicht 450%, wie vorher.
Titel: Antw:FTUI 2.5
Beitrag von: arminius am 11 Februar 2017, 14:11:40
Danke für euer Feedback.

Gruß
Arminius
Titel: Antw:FTUI 2.5
Beitrag von: willibutz am 12 Februar 2017, 15:37:19
Zitat von: setstate am 10 Februar 2017, 20:27:19
Hallo willibutz,

du hast Recht. Ich habe lock beim Dimmer vergessen "zu upzudaten"  ;D

Kommt beim nächsten Update wieder funktionierend mit

danke dir, aber dafür wäre doch keine komplett neue Version 2.6 notwendig gewesen  ;)

Ich habe inzwischen nach meinem anderen Problem gesucht. Seit 2.5 konnte man SELECT nicht mehr in der Größe ändern und ich hoffe, ich kann dir jetzt einen geeigneten "Reparaturhinweis" geben.

Ich habe mit fhem-tablet-ui.css gespielt und wenn ich aus:


select,
input.textinput {
...
    font-size: small;
...
}



select,
input.textinput {
...
    font-size: 100%;
...
}


mache, dann kann man SELECT auch wieder in der Größe anpassen.

Ich hatte zuerst die 80% versucht die ja small enstprechen sollten, aber dabei zeigt der Pfeil nach unten immer etwas aus der Box heraus.

Ich hoffe das hilft,
Gruß willi
Titel: Antw:FTUI 2.5
Beitrag von: lestat.le am 12 Februar 2017, 22:51:37
Hallo,

seit 3 Wochen habe ich mein Wandtablet in Betrieb genommen. War nun endlich so weit mit programmieren fertig. Jetzt hab ich das Update nach einem Fhem Update erhalten.
Nach dem ersten Schreck mit den verschobenen Darstellungen habe ich diese wieder gerade gezogen und dabei festgestellt das die Positionierung der Elemente nun viel einfacher und minimalistischer geht.

Aber nun komm ich nicht weiter.
Ich hab jetzt alle 22 Seiten durchgelesen aber mein Problem wurde noch nicht beschrieben.

Meine Index.html wird nicht mehr aktualisiert. Die Temperaturdaten, Wetterdaten, Symbolwidget jeder Art, Müllkalenderdaten bleiben eingefroren. Interessanter Weise bei jedem Browser mit anderen Werten.
Bei meinen anderen Seiten (wetter.html und rollosettings.html) ist das nicht so. Da funktioniert es wie gewohnt. Die Header sind total gleich in allen drei Seiten. Einige Widgets finden sich auf jeder der Seiten wieder.
Wenn ich auf per Pagetab auf diese anderen Seiten wechsle und dann zur index.html zurückgehe, werden die Widgets dort aktualisert nachgezogen. Dann friert die Darstellung wieder ein.

Ein Beispiel:
Index.html
Am Homestatuswidget schalte ich von "Home" auf "Away". Per Pineingabe entschärfe ich die Alarmanlage und es sollte wieder auf "Home" gesprungen werden. Das passiert aber nicht, es bleibt auf "Away" hängen (in Fhem ist natürlich die Alarmanlage entschärft).
Nun wechsle ich per Pagetap auf wetter.html. Dort zeigt das Homewidget "Home".
Nun wechsle ich zurück auf Index.html. Jetzt ist auch dort der optische Wechsel auf "Home" erfolgt.

Ich spar mir erstmal das posten der Header. Vielleicht gibt es eine ganz banale Erklärung.
Meine Header habe ich noch nicht geändert. Sie beinhalten das Gleiche wie vor 2.5.

Ich bin wirklich am verzweifeln und über jede Hilfe sehr dankbar.

Viele Grüße
Andreas
Titel: Antw:FTUI 2.5
Beitrag von: scooty am 15 Februar 2017, 08:15:05
Hallo setstate,

habe mir erlaubt, zu dem Größenproblem beim select Widget basierend auf dem Fix von willibutz (https://forum.fhem.de/index.php/topic,65604.msg583302.html#msg583302) einen pull request (https://github.com/knowthelist/fhem-tablet-ui/pull/200) zu erstellen.
Dieser Fix funktioniert bei mir hervorragend.
Wäre nett, wenn Du ihn übernehmen könntest.

Vielen Dank und Grüße,
Andreas

Zitat von: willibutz am 12 Februar 2017, 15:37:19
Ich habe inzwischen nach meinem anderen Problem gesucht. Seit 2.5 konnte man SELECT nicht mehr in der Größe ändern und ich hoffe, ich kann dir jetzt einen geeigneten "Reparaturhinweis" geben.

Ich habe mit fhem-tablet-ui.css gespielt und wenn ich aus:


select,
input.textinput {
...
    font-size: small;
...
}



select,
input.textinput {
...
    font-size: 100%;
...
}


mache, dann kann man SELECT auch wieder in der Größe anpassen.

Ich hatte zuerst die 80% versucht die ja small enstprechen sollten, aber dabei zeigt der Pfeil nach unten immer etwas aus der Box heraus.

Ich hoffe das hilft,
Gruß willi

Titel: Antw:FTUI 2.5
Beitrag von: setstate am 15 Februar 2017, 08:30:58
Das habe ich gestern noch fertig gefixed, inkl. der Skalierungseffekte bezüglich Lage

Nur das Rollout habe ich wegen akuter Müdigkeit gestern nicht mehr geschafft. Folgt heute Abend.
Titel: Antw:FTUI 2.5
Beitrag von: scooty am 15 Februar 2017, 09:33:04
Kein Thema, alles gut.
Und erneut vielen herzlichen Dank für Deinen unermüdlichen Einsatz.

Andreas
Titel: Antw:FTUI 2.5
Beitrag von: scooty am 19 Februar 2017, 14:39:06
Zitat von: setstate am 15 Februar 2017, 08:30:58
Das habe ich gestern noch fertig gefixed, inkl. der Skalierungseffekte bezüglich Lage

Nur das Rollout habe ich wegen akuter Müdigkeit gestern nicht mehr geschafft. Folgt heute Abend.

Viele herzlichen Dank, mit heutigem Update ist das Größenproblem beim select Widget beseitigt.
:)

Andreas
PS: Den pull request habe ich geschlossen.