New FHEM Tablet UI

[roman1528]

Code Auswählen Erweitern


http://fhem:8083/fhem/ftui

die Seite eine angeknabberte Version meiner Standard-Oberfläche anzeigt (s. Screenshot). Beim Aufruf über

Code Auswählen Erweitern


http://fhem:8083/fhem/ftui/index.html

sieht alles wie gewünscht aus.

Code Auswählen Erweitern

http://fhem:8083/fhem/ftui/
reicht schon^^ der / am ende ist wichtig...

[PatrickR]

Hi!

Code Auswählen Erweitern

http://fhem:8083/fhem/ftui/
reicht schon^^ der / am ende ist wichtig...

Ich unterdrücke mal den starken Drang, die Beweggründe dieses subtilen Features durchschauen zu wollen.

Patrick

[uniqueck]

Ich habe einen Pullrequest #125 für das widget_calview.js eingestellt.

[roman1528]

Hi!Ich unterdrücke mal den starken Drang, die Beweggründe dieses subtilen Features durchschauen zu wollen.

Gute Idee   

[viegener]

Hi!Ich unterdrücke mal den starken Drang, die Beweggründe dieses subtilen Features durchschauen zu wollen.

Patrick

Das lässt sich wunderbar umgehen durch einfügen des folgenden Scripts:

Code Auswählen Erweitern

  <script language="javascript">
    if ( document.location.pathname == "/fhem/ftui" ) {
      var href = document.location.protocol + "//" + document.location.host + document.location.pathname + "/" + document.location.hash ;
      document.location.replace( href );
    }
  </script>


Wens interessiert, ich erklärs trotzdem: Wenn man den URL

Code Auswählen Erweitern

http://fhem:8083/fhem/ftui aufruft befindet man sich eigentlich im Verzeichnis /fhem damit wird aus einem Aufruf der index.html plötzlich

Code Auswählen Erweitern

http://fhem:8083/fhem/index.html (also ohne ftui). Das hat alles eigentlich gar nichts mit FHEM zu tun, sondern einfach mit Pfadnamen wie sie im Web oder auch für lokale Dateien sonstwo verwendet werden. Ohne den abschliessenden / ruft man nur ein Objekt im fhem-Verzeichnis auf und nicht in fhem/ftui.

Für relative Pfadnamen, wie andere Seiten macht es einen grossen Unterschied. Ausserdem gehören nur die Dateien unter ftui/ zum Tablet UI alles andere gehört zu FHEMweb.

Und nun habe ich genug lehrmeisterhaftes von mir gegeben 

[setstate]

Ich habe einen Pullrequest #125 für das widget_calview.js eingestellt.

Merged.
Danke

[PatrickR]

Hi!

Das hat alles eigentlich gar nichts mit FHEM zu tun, sondern einfach mit Pfadnamen wie sie im Web oder auch für lokale Dateien sonstwo verwendet werden. Ohne den abschliessenden / ruft man nur ein Objekt im fhem-Verzeichnis auf und nicht in fhem/ftui.

Danke für die Erklärung.

Auf die Gefahr hin, zu weit vom Thema abzukommen: Dass das im Web so üblich ist, ist an mir aber die letzten 20 Jahre vorübergegangen. Weder der Apache macht einen Unterschied, ob ich einen Slash anfüge noch tat es der Internet Intrusion Server als ich ihn noch benutzen durfte. Da die Dateisysteme ohnehin in einem Verzeichnis nur entweder ein Unterverzeichnis oder eine Datei pro Namen zulassen, sehe ich auch nicht wirklich einen Grund.

Patrick

[danieljo]

Neues Widget   Checkbox

Dieses Control ist nutzbar wie ein Switch, aber rein optisch eher für Setting-Einstellungen nützlich.

Code Auswählen Erweitern


<div data-type="checkbox" data-device='myAT'
        data-get-on="!off"    data-get-off="inactive"
        data-set-on="active" data-set-off="inactive"
        class="green">
</div>


Nachtrag: gestern habe ich es noch hinbekommen, das Control per "Slide to Change" ändern zu können. Das ist auf Touchdisplays intuitiver zu bedienen.

Vielen Dank für dieses Widget!

[viegener]

Hi!

Danke für die Erklärung.

Auf die Gefahr hin, zu weit vom Thema abzukommen: Dass das im Web so üblich ist, ist an mir aber die letzten 20 Jahre vorübergegangen. Weder der Apache macht einen Unterschied, ob ich einen Slash anfüge noch tat es der Internet Intrusion Server als ich ihn noch benutzen durfte. Da die Dateisysteme ohnehin in einem Verzeichnis nur entweder ein Unterverzeichnis oder eine Datei pro Namen zulassen, sehe ich auch nicht wirklich einen Grund.

Patrick

Führt echt zu weit ab aber vielleicht noch ein einfaches Beispiel. Es geht darum, dass ja immer wieder "relative" Pfade zu anderen Dateien angegeben werden wie zum Beispiel "index.html" oder "image/x.png" und da spielt es eine Rolle von wo aus diese Dateien aufgerufen werden (Dafür wurde mal das base tag in html erfunden)

Wenn ich in /fhem/ftui bin und eine datei index.html abrufe kommt /fhem/index.html raus
Wenn ich in /fhem/ftui/ bin und eine datei index.html abrufe kommt /fhem/ftui/index.html raus

Das ganze hat wie gesagt eigentlich nichts mit dem web / URLs zu tun sondern nur mit relativen Pfadangaben und jetzt bin ich still.

[Gallo]

Hey zusammen , irgendwie tue ich mich schwer mit dem Auslagern der Tablet UI , ich finde einfach den Punkt nicht wo ich die IP des FHEm Servers eintragen muss , wenn das UI nicht auf dem FHEM Server läuft . Sorry google schon seit 25 min und denke ihr könnt mir gerade schnell weiter helfen. Vielen Dank !

[viegener]

Eigentlich musst Du nur das Meta-Tag "fhemweb_url" auf den FHEM-Url setzen.

[Gallo]

genau das habe ich getan , mit

Code Auswählen Erweitern

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

Aber danach kriege ich im UI nur noch errors

[viegener]

Was für Fehler?
Welchen hostnamen trägst Du ein?

Wenn Du es selber bereits gefunden hattest, verstehe ich die ursprüngliche Frage nicht 

[setstate]

Hi,Das bezog sich darauf, dass Wifilight beim Farbwechsel im Tablet UI (im Gegensatz zum WEBui) die Helligkeit immer auf 100% zurücksetzt, anstatt sie beizubehalten.
Gibt es dafür schon eine Lösung?
Grüße
Martin

Ich bin an einem neuen Widget dran basierend auf der Farbtastic Lib, da kann man dann den kompletten RBG Raum auswählen und als rbg oder hsl-Wert an FHEM senden.

In der Zwischenzeit habe ich mir mit 3 getrennten Reglern geholfen, um alles reglen zu können. Siehe HTML Code:

Code Auswählen Erweitern


<li data-row="4" data-col="2" data-sizex="6" data-sizey="6">
     <header>PHILIPS</header>
     <div class="top-narrow-2x">
     <div class="centered inline">
      <div data-type="volume" data-device="HUEDevice1" data-min="0" data-max="65353" data-get="hue" data-set="hue" class="hue-tick small top-space-3x" ></div>
      <div data-type="label" class="narrow">Color</div>
      <div data-type="volume" data-device="HUEDevice1" data-min="0" data-max="100" data-get="pct" data-set="pct" data-tickstep='4' class="dim-tick small top-space-3x" ></div>
      <div data-type="label" class="narrow">Helligkeit</div>
      <div data-type="volume" data-device="HUEDevice1" data-min="0" data-max="254" data-get="sat" data-set="sat" data-tickstep='4' class="dim-tick small top-space-3x" ></div>
      <div data-type="label" class="narrow">Sättigung</div>
     </div>
     <div class="right inline top-space-3x">
        <div>
            <div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="44295" data-off-background-color="#3333dd" data-off-color="#3333dd" class="inline" ></div>
            <div data-type="label" class="narrow w2x left-align inline">blau</div>
        </div>
        <div>
            <div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="20695" data-off-background-color="#33dd33" data-off-color="#33dd33" class="inline" ></div>
            <div data-type="label" class="narrow w2x left-align inline">grün</div>
        </div>
        <div>
            <div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="0" data-off-background-color="#dd4444" data-off-color="#dd4444" class="inline" ></div>
            <div data-type="label" class="narrow w2x left-align inline">rot</div>
        </div>
        <div>
            <div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="9800" data-off-background-color="#cccc44" data-off-color="#cccc44" class="inline" ></div>
            <div data-type="label" class="narrow w2x left-align inline">gelb</div>
        </div>
        <div>
            <div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="rgb" data-set-on="666666" data-off-background-color="#666666" data-off-color="#666666" class="inline" ></div>
            <div data-type="label" class="narrow w2x left-align inline">weiß</div>
        </div>
        <div>
            <div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="rgb" data-set-on="aaaaaa" data-off-background-color="#aaaaaa" data-off-color="#aaaaaa" class="inline" ></div>
            <div data-type="label" class="narrow w2x left-align inline">weiß</div>
        </div>
        <div>
            <div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="rgb" data-set-on="ffffff" data-off-background-color="#ffffff" data-off-color="#ffffff" class="inline" ></div>
            <div data-type="label" class="narrow w2x left-align inline">weiß</div>
        </div>
     </div>
     </div>
</li>


[Nobby1805]

Hi setstate,

wie schafft man es mehrere level-wigets ganz eng nebeneinander zu packen? Im Extremfall ohne Abstand ?
und wenn ich gerade schon einen Wunsch für Level habe, dann gleich noch einer: könnte man das Widget so erweitern, dass auch der Anfang des "Balkens" von einem Reading gesteuert wird? Ich würde damit gerne jeweils einen Min- und Max-Wert darstellen