New FHEM Tablet UI

[JoJota]

Hierfür einfach das Attribute im head der Html Seite setzen.

Code Auswählen Erweitern


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


Habe ich gemacht, zusätzlich auch Pfadangaben zu den Stylesheets korrigiert. Wird auch alles richtig angezeigt bis auf die Daten. Javascript Konsole sagt folgendes:

Code Auswählen Erweitern


XMLHttpRequest cannot load https://<LinkZurFhemInstallation>:8083/fhem/?XHR=1&inform=type%3Draw%3Bfilter%3D.*&_=1449139800065. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://<MeineDomain>.de' is therefore not allowed access. The response had HTTP status code 401.

HTTP 401 weißt wohl darauf hin, dass die Authentifizierung fehlgeschlagen ist. Bei fhemweb_url habe ich den Link aber vollständig mit Benutzername und Passwort angegeben:

Code Auswählen Erweitern

<meta name="fhemweb_url" content="https://<benutzername>:<passwort>@<MeineDomain>:8083/fhem/"/>

Die Links sind auch alle über das Internet (mit Authentifizierung) zu erreichen. Es scheint, als ob die Authentifizierungsdaten vor dem HTTP Request rausgefiltert werden. Am HTTPS liegt es nicht, bekomme den gleichen Fehler auch ohne.

Edit: attr WEB CORS 1 hat das 'Access-Control-Allow-Origin' Problem gelöst. "401 (Authorization Required)" bleibt aber weiterhin bestehen. Ist es nicht möglich, eine Verbindung in Kombination mit dem basicAuth von FHEM herzustellen?

[drhirn]

Edit: attr WEB CORS 1 hat das 'Access-Control-Allow-Origin' Problem gelöst. "401 (Authorization Required)" bleibt aber weiterhin bestehen. Ist es nicht möglich, eine Verbindung in Kombination mit dem basicAuth von FHEM herzustellen?

Naja, wenn's "sicher" sein soll, könntest du ein neues FHEMWEB auf einem anderen Port erstellen (ohne basicAuth) und mittels allowfrom die IP-Adressen einschränken, die darauf zugreifen dürfen.

[Stril]

Hallo!

Gibt es irgendeine Alternative zu Pagetab, um abhängig von einem Sensor-Wert oder Dummy auf eine andere URL zu gehen?
Mit Pagetab komme ich einfach nicht weiter.

Code Auswählen Erweitern


<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet" data-get-off="0" data-get-on="1"></div>


Hier wird nur auch bei "0" weitergeleitet. Kann man das irgendwie vielleicht direkt mit Java-Script löse? Ich brauche auch nicht unbedingt einen Button - eher einen Automatismus, der im Hintergrund ein Device überwacht und dann weiterleitet.

Danke und Grüße
Phil

[xxsteffenxx]

Hallo zusammen, da meine besser Hälfte nun so langsam mit meinem FTUI warm wird kommen die ersten Verbesserungsvorschläge.

Da auf dem Smartphone öfters durch das wischen die Temperatur am Thermostat verändert wird bzw. Es relativ schnell ausersehen geht stellt sich die Frage ob ich das Irgendwie über einen Button "entsperren" kann bevor die Änderungen funktionieren.

Also erst Button drücken dann kann man die Temperatur einstellen. Wurde glaub irgendwo hier schonmal gefragt als Art Code-Schloss.

Wenn jemand hier einen Tipp hat würde ich mich freuen

Danke

Gesendet von meinem GT-I9295 mit Tapatalk

[uniqueck]

@setstate danke fürs update, symbol widget klappt soweit.

[setstate]

Hallo zusammen,
endlich komme ich auch mal wieder dazu mein Tablet UI zu erweitern.
Ich möchte gerne die Bewegung meiner Webcam über das UI steuern, bislang habe ich hier im Forum die Lösung gefunden das mittel eines Circle-Menues und Push Buttons zu realisieren.
Wenn ich das richtig sehe, brauche ich einen Knopf um die Bewegung zu starten und einen weiteren um die Bewegung wieder zu stoppen. Soweit so gut, wäre es auch möglich die Bewegung nur auszuführen solange ich den Knpof gedrückt halte? Dazu müsste ich beim drücken Kommando 1 senden und beim loslassen Kommando 2.
Leider scheint das PUSH-Widget aber nur die Möglichkeit zu haben, ein Kommande beim drücken zu senden, es fehlt etwas wie ein data-set-off.

Hat jemand eine Idee ob sich so etwas jetzt schon relisieren lässt?

Vielen Dank im Voraus
Gruß
Gerald

Das ist ein interessanter Punkt, beim Push getrennte Kommandos zu senden bei Down und bei Up. Das geht jetzt so nicht, wäre aber realisierbar. Eine Hürde gibt es aber.Ich habe das Senden aktuell auf das Up-Event gelegt und eine Logik zwischen Down und Up gelegt, die erkennen soll, ob es tatsächlich ein gewollter Drücker ist, oder nur ein Scroll (Mobil-Telefon), bei dem der Finger nur zufällig auf den Push-Button gelandet ist. Dabei will man kein Kommando an FHEM senden. Diese Logik müsste man dann ausschaltbar machen und stattdessen beide Events (up und down) zum Senden Nutzbar machen.

[setstate]

Hallo!

Gibt es irgendeine Alternative zu Pagetab, um abhängig von einem Sensor-Wert oder Dummy auf eine andere URL zu gehen?
Mit Pagetab komme ich einfach nicht weiter.

Code Auswählen Erweitern


<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet" data-get-off="0" data-get-on="1"></div>


Hier wird nur auch bei "0" weitergeleitet. Kann man das irgendwie vielleicht direkt mit Java-Script löse? Ich brauche auch nicht unbedingt einen Button - eher einen Automatismus, der im Hintergrund ein Device überwacht und dann weiterleitet.

Danke und Grüße
Phil

Geduld, ich bin schon beim Forschen bzgl. Pagetab ...

[Stril]

Geduld, ich bin schon beim Forschen bzgl. Pagetab ...

Das freut mich sehr! Vielen Dank!!!

Noch ein anderer Punkt, der leider seit heute Probleme macht: Die Icons bei "data-rype=button" funktionieren bei mir seit dem letzten Update nicht mehr:

Code Auswählen Erweitern

<div data-type="button" data-url="og.html" data-icon="fa-bed"></div>

--> nur ein orangener Kringel...

Grüße und danke für eure Hilfe!

[setstate]

Das freut mich sehr! Vielen Dank!!!

Noch ein anderer Punkt, der leider seit heute Probleme macht: Die Icons bei "data-rype=button" funktionieren bei mir seit dem letzten Update nicht mehr:

Code Auswählen Erweitern

<div data-type="button" data-url="og.html" data-icon="fa-bed"></div>

--> nur ein orangener Kringel...

Grüße und danke für eure Hilfe!

Setz mal data-type="pagebutton"

[setstate]

Hallo!

Gibt es irgendeine Alternative zu Pagetab, um abhängig von einem Sensor-Wert oder Dummy auf eine andere URL zu gehen?
Mit Pagetab komme ich einfach nicht weiter.

Code Auswählen Erweitern


<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet" data-get-off="0" data-get-on="1"></div>


Hier wird nur auch bei "0" weitergeleitet. Kann man das irgendwie vielleicht direkt mit Java-Script löse? Ich brauche auch nicht unbedingt einen Button - eher einen Automatismus, der im Hintergrund ein Device überwacht und dann weiterleitet.

Danke und Grüße
Phil

Voraussetzung: Die Seiten sind nach Anleitung gebaut!

Dann bitte für fhem-tablet-ui.js / fhem-tablet-ui.min.js die Version von heute nehmen und noch einmal probieren.
Ein weiteres Activate dürfte jetzt nur passieren, wenn der Zustand wieder auf 0 zurück und danach auf 1 gegangen ist.

[Stril]

Setz mal data-type="pagebutton"

Hallo!

Pagebutton funktioniert!

[Stril]

Voraussetzung: Die Seiten sind nach Anleitung gebaut!

Dann bitte für fhem-tablet-ui.js / fhem-tablet-ui.min.js die Version von heute nehmen und noch einmal probieren.
Ein weiteres Activate dürfte jetzt nur passieren, wenn der Zustand wieder auf 0 zurück und danach auf 1 gegangen ist.

Hallo!

Ich hatte gehofft, ich muss für die Weiterleitung nicht alles umbauen, aber das war jetzt wohl ein guter Anlass

Mit Pagetab in "durchgängiger" Nutzung funktioniert auch die "sensorabhängige" Weiterleitung. Noch zeigt Firefox meine Seite nicht mehr an, aber da gehe ich jetzt mal auf die Fehlersuche...

Gruß
Phil

[setstate]

Würde das CircleMenu auch gerne mit Eckigen Buttons und Horizontal haben.
hat da jemand schon nen Ansatz wie das funktioniert? meine hier irgendwo mal nen Screenshot gesehen zu haben aber ich finde das nicht wieder hier im Forum.

mit fa-square als background icon werden die ecken abgerundet.

Die neuste Version vom Circlemenu kann das jetzt mit data-border="square"

Code Auswählen Erweitern


    <div data-type="circlemenu" data-border="square" data-item-width="50" data-item-height="50" class="circlemenu keepopen top-space">
        <ul>
          <li><div data-type="push" data-background-icon="fa-square-o" data-icon="fa-wrench"></div></li>
          <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level -6" data-background-icon="fa-square-o" data-icon="">-6</div></li>
          <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level -2" data-background-icon="fa-square-o" data-icon="">-2</div></li>
          <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level 0"  data-background-icon="fa-square-o" data-icon="">0</div></li>
          <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level +3" data-background-icon="fa-square-o" data-icon="">2</div></li>
          <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level +9" data-background-icon="fa-square-o" data-icon="">9</div></li>
          <li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level +C" data-background-icon="fa-square-o" data-icon="">12</div></li>
        </ul>
    </div>


siehe Demo

[remet]

vielen Dank setstate für die Arbeit. Sieht in der Demo richtig gut aus.
leider kann ich das bei mir noch nicht umsetzten. Die eckigen Buttons werden leider immer noch von kreisen abgeschnitten.

habe ein Update bereits gemacht.

Gruß remet

[setstate]

Hi remet,

danke für die Rückmeldung, ich habe tatsächlich die geänderte jquery.circlemenu.js Lib vergessen hochzuladen.

thx, setsate