Servus zusammen,
ich richte mir gerade mein Tablet UI ein - in dem soll u.a. auch eine Steuerung für Kodi abgebildet werden.
Ich habe die User-Demos schon durchgeforstet und war auf der Suche nach Ideen - bisher weitestgehend Fernbedienungen oder aber Sonos Sachen gefunden.
Wer möchte kann hier gerne mal Beispiele zeigen wie Ihr Kodi in Fhem eingebunden habt - ich würde mich riesig freuen und es wäre mir (und sicher auch anderen Einsteigern) als "Newbie" auch eine große Hilfe.
Vielen Dank :)
//Das sollte eigentlich in die Rubrik Frontend=> Tablet UI , evtl. kann das ja jemand verschieben.
Würde mich auch interessieren. Will mir das demnächst auch zusammen bauen.
Hi,
Habt ihr mittlerweile etwas erreichen können? Ich habe nur das Widget von Nesges gefunden, welches aber mit der aktuellen tablet UI Version nicht mehr kompatibel zu sein scheint.
gruß
klinki
Ich reihe mich mal mit ein. Mich würde ja erstmal interessieren, wie Beispielsweise direkt die eine oder andere Bibliothek aufrufen kann. Buttons zur Navigation durch die Menüs sind ja keni problem.
Hallo zusammen,
ich habe in der Tat einen Weg gefunden - nicht ganz schön aber es klappt...
Ich habe mir zunächst ein Feld definiert und dort das iFrame direkt eingebunden.
<li data-row="1" data-col="2" data-sizex="9" data-sizey="4">
<iframe width="100%" height="100%" src="http://192.168.178.63:8080" scrolling="auto" frameborder="0" allowfullscreen></iframe>
So habe ich Zugriff auf den Kodi-Webserver und kann nun aus TabletUI heraus diesen relativ komfortabel bedienen.
Ich hoffe das funzt auch bei euch.
Hi zusammen,
das Thema hat mir keine Ruhe mehr gelassen. Ich habe mir mal die Sachen von Nesges angesehen und habe dann einfach die Buttons die ich für Sinnvoll erachte nachgebaut. Außerdem habe ich jetzt auch meinen Receiver und meinen TV mit auf der Testseite.
Das ist bis jetzt Alles nur herum gespielt aber wenn jemand daran interesse hat, dann bitte sehr :
<!DOCTYPE html>
<html>
<head>
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="fonts/roman/style.css" />
<link rel="stylesheet" href="fonts/material/style.css" />
<script src="js/fhem-tablet-ui.js" defer></script>
<title>Test</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="2" data-sizey="3">
<header>KODI REMOTE</header>
<div class="top-space">
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi exec rewind" data-icon="fa-backward" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi pause all" data-icon="fa-pause" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi play all" data-icon="fa-play" data-on-background-color="#FFCC00" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi stop all" data-icon="fa-stop" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi exec fastforward" data-icon="fa-forward" data-on-background-color="rgb(170,105,0)" class="cell"></div>
</div>
<div style="margin-top:18px" class="top-space">
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi back" data-icon="fa-arrow-circle-o-left" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi exec close" data-icon="fa-times" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi up" data-icon="fa-angle-up" data-on-background-color="#2E8AE6" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi showosd" data-icon="fa-bars" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi info" data-icon="fa-info" data-on-background-color="rgb(170,105,0)" class="cell"></div>
</div>
<div class="top-space">
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi left" data-icon="fa-angle-left" data-on-background-color="#2E8AE6" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi select" data-icon="fa-check-circle" data-on-background-color="#0066FF" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi right" data-icon="fa-angle-right" data-on-background-color="#2E8AE6" class="cell"></div>
</div>
<div class="top-space">
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi exec fullscreen" data-icon="fa-desktop" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi down" data-icon="fa-angle-down" data-on-background-color="#2E8AE6" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi exec showsubtitles" data-icon="fa-pencil" data-on-background-color="rgb(170,105,0)" class="cell"></div>
</div>
<div style="margin-top:30px" class="top-space">
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi mute toggle" data-icon="fa-volume-off" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi exec volumedown" data-icon="fa-volume-down" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi exec volumeup" data-icon="fa-volume-up" data-on-background-color="rgb(170,105,0)" class="cell"></div>
</div>
<div style="margin-top:25px" class="top-space">
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi home" data-icon="fa-home" data-on-background-color="#9933FF" class="cell"></div>
<div class="inline" data-type="button" data-fhem-cmd="set Kodi.WoZi reboot" data-icon="fa-repeat" data-on-background-color="#9933FF" class="cell"></div>
</div>
</li>
<li data-row="1" data-col="3" data-sizex="2" data-sizey="3">
<header>PIONEER VSX-930</header>
<div class="top-space">
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="power"
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="fa-power-off"
class="">
</div>
<div class="">Power
</div>
</div>
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="mute"
data-set="mute"
data-states='["on","off"]'
data-icons='["ro-volume-mute2","ro-volume-high"]'
data-colors='["black","#808080"]'
data-background-colors='["cornflowerblue","#3D4C66"]'
class="">
</div>
<div class="">Mute
</div>
</div>
</div>
<div class="top-space">
<div class="inline">
<div
data-type="volume"
data-device='Receiver'
data-min="0"
data-max="92"
data-get="volume"
data-set="volume"
class="" >
</div>
<div class="">Volume
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="Receiver"
data-set-on="volumeDown"
data-off-color="#808080"
data-off-background-color="#3D4C66"
data-icon="ro-volume-decrease"
class="">
</div>
<div data-type="push"
data-device="Receiver"
data-set-on="volumeUp"
data-off-color="#808080"
data-off-background-color="#3D4C66"
data-icon="ro-volume-increase"
class="">
</div>
<div class="">Volume
</div>
</div>
</div>
<div class="top-space">
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="input"
data-set="input"
data-get-on="satCbl"
data-get-off="^(?!satCbl).*"
data-set-on="satCbl"
data-set-off=""
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="ro-tv2"
class="">
</div>
<div class="">SKY
</div>
</div>
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="input"
data-set="input"
data-get-on="pi"
data-get-off="^(?!pi).*"
data-set-on="pi"
data-set-off=""
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="ro-kodi"
class="">
</div>
<div class="">KODI
</div>
</div>
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="input"
data-set="input"
data-get-on="bd"
data-get-off="^(?!bd).*"
data-set-on="bd"
data-set-off=""
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="ro-bluray"
class="">
</div>
<div class="">Blue Ray
</div>
</div>
</div>
<div class="top-space">
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="input"
data-set="input"
data-get-on="favorites"
data-get-off="^(?!favorites).*"
data-set-on="favorites"
data-set-off=""
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="fa-globe"
class="">
</div>
<div class="">Favoriten
</div>
</div>
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="input"
data-set="input"
data-get-on="iPodUsb"
data-get-off="^(?!iPodUsb).*"
data-set-on="iPodUsb"
data-set-off=""
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="fa-usb"
class="">
</div>
<div class="">USB
</div>
</div>
<div class="inline">
<div data-type="switch"
data-device="Receiver"
data-get="input"
data-set="input"
data-get-on="btAudio"
data-get-off="^(?!btAudio).*"
data-set-on="btAudio"
data-set-off=""
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="fa-bluetooth"
class="">
</div>
<div class="">BT
</div>
</div>
</div>
<div class="top-space">
</div>
</li>
<li data-row="1" data-col="5" data-sizex="2" data-sizey="3">
<header>TV</header>
<div class="top-space">
<div class="inline">
<div data-type="switch"
data-device="TV"
data-get="power"
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="fa-power-off"
class="">
</div>
<div class="">Power
</div>
</div>
<div class="inline">
<div data-type="switch"
data-device="TV"
data-get="mute"
data-set="mute"
data-states='["on","off"]'
data-icons='["ro-volume-mute2","ro-volume-high"]'
data-colors='["black","#808080"]'
data-background-colors='["cornflowerblue","#3D4C66"]'
class="">
</div>
<div class="">Mute
</div>
</div>
</div>
<div class="top-space">
<div class="inline">
<div
data-type="volume"
data-device='TV'
data-min="0"
data-max="100"
data-get="volume"
data-set="volume"
class="" >
</div>
</div>
</div>
<div class="top-space">
<div class="inline">
<div data-type="push" data-device="TV" data-set-on="volumeDown" data-off-color="#808080" data-off-background-color="#3D4C66" data-icon="ro-volume-decrease" class="inline">
</div >
<div data-type="push" data-device="TV" data-set-on="volumeUp" data-off-color="#808080" data-off-background-color="#3D4C66" data-icon="ro-volume-increase" class="inline">
</div>
<div class="">Volume
</div>
</div>
</div>
<div class="top-space">
<div class="inline">
<div data-type="switch"
data-device="TV"
data-get="input"
data-set="input"
data-get-on="HDMI_1"
data-get-off="^(?!HDMI_1).*"
data-set-on="HDMI_1"
data-set-off=""
data-on-color="black"
data-off-color="#808080"
data-on-background-color="cornflowerblue"
data-off-background-color="#3D4C66"
data-icon="ro-tv2"
class="">
</div>
<div class="">Receiver
</div>
</div>
</div>
</li>
<li data-row="4" data-col="1" data-sizex="6" data-sizey="1">
<header>Free to Use</header>
</li>
</ul>
</div>
</body>
</html>
Gruß
0ni
Hmm, es gibt doch für FHEM eh ein XMBC Modul. Wenn du das eingerichtet hast, kannst du von FTUI aus ganz einfach mit data-set arbeiten.
z.B.
<div data-type="switch" data-device="Kodi" data-get="playStatus" data-get-on="playing" data-get-off="!on" data-set="play" data-set-on="all" data-set-off=""></code>
Was Play/Pause/Stop etc angeht ja.
Aber direkter Zugriff auf Kodi-Medien (Bibliotheken) ist über das Modul und TabletUI leider nicht möglich.
Grtz
Nein, das natürlich leider nicht.
Zitat von: 0ni am 01 Februar 2017, 00:14:42
....
Das ist bis jetzt Alles nur herum gespielt aber wenn jemand daran interesse hat, dann bitte sehr :
Hab mir Deine Code-Schnipsel kopiert und angepasst. Funktioniert prima.
Danke dafür!