WIP: Location tracking using foreground service

890

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,22 @@
+---
+name: Bug report
+about: Create a report to help improve HA Client
+title: ''
+labels: ''
+assignees: ''
+
+---
+
+**HA Client version:** [Main menu -> About HA Client]
+
+**Home Assistant version:**
+
+**Device name:**
+
+**Android version:**
+
+**Description**
+[Replace with description]
+
+**Screenshots**
+[Replace with screenshots]

.github/ISSUE_TEMPLATE/entity-support-request.md

@@ -0,0 +1,12 @@
+---
+name: Entity support request
+about: Suggest to add support of any entity type
+title: ''
+labels: ENTITY, feature/improvement
+assignees: ''
+
+---
+
+**Entity type:**
+
+**Link to documentation:**

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,17 @@
+---
+name: Feature request
+about: Suggest an idea for HA Client if it is not a card or entity support
+title: ''
+labels: feature/improvement
+assignees: ''
+
+---
+
+**Is your feature request related to a problem? Please describe.**
+A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+
+**Describe the solution you'd like**
+A clear and concise description of what you want to happen.
+
+**Additional context**
+Add any other context or screenshots about the feature request here.

.github/ISSUE_TEMPLATE/lovelace-card-support-request.md

@@ -0,0 +1,12 @@
+---
+name: Lovelace Card support request
+about: Suggest to add any Lovelace card support
+title: ''
+labels: CARD, feature/improvement
+assignees: ''
+
+---
+
+**Card name:**
+
+**Link to card repository or web page:**

.github/no-response.yml

@@ -0,0 +1,11 @@
+# Configuration for probot-no-response - https://github.com/probot/no-response
+
+# Number of days of inactivity before an Issue is closed for lack of response
+daysUntilClose: 14
+# Label requiring a response
+responseRequiredLabel: more info needed
+# Comment to post when closing an Issue for lack of response. Set to `false` to disable
+closeComment: >
+  This issue has been automatically closed because there has been no response
+  to our request for more information from the original author. If the issue still relevant
+  feel free to reopen this issue and add more information, or report a new one. 

.gitignore

@@ -9,6 +9,15 @@ build/
 .flutter-plugins
 
 .idea/
+.vscode/
+.theia/
+.project/
+.settings/
+
+flutter_export_environment.sh
+.flutter-plugins-dependencies
 
 key.properties
+.secrets.dart
 pubspec.lock
+google-services.json

.gitpod.dockerfile

@@ -0,0 +1,8 @@
+FROM gitpod/workspace-full:latest
+
+ENV ANDROID_HOME=/workspace/android-sdk \
+    FLUTTER_ROOT=/workspace/flutter \
+    FLUTTER_HOME=/workspace/flutter
+
+RUN bash -c ". /home/gitpod/.sdkman/bin/sdkman-init.sh \
+             && sdk install java 8.0.242.j9-adpt"

.gitpod.yml

@@ -0,0 +1,26 @@
+image:
+  file: .gitpod.dockerfile
+
+tasks:
+- before: |
+    export PATH=$FLUTTER_HOME/bin:$FLUTTER_HOME/bin/cache/dart-sdk/bin:$ANDROID_HOME/bin:$ANDROID_HOME/platform-tools:$PATH
+    mkdir -p /home/gitpod/.android
+    touch /home/gitpod/.android/repositories.cfg
+  init: |
+    echo "Installing Flutter SDK..."
+    cd /workspace && wget -qO flutter_sdk.tar.xz https://storage.googleapis.com/flutter_infra/releases/stable/linux/flutter_linux_v1.12.13+hotfix.7-stable.tar.xz && tar -xf flutter_sdk.tar.xz && rm -f flutter_sdk.tar.xz
+    echo "Installing Android SDK..."
+    mkdir -p /workspace/android-sdk && cd /workspace/android-sdk && wget https://dl.google.com/android/repository/sdk-tools-linux-4333796.zip && unzip sdk-tools-linux-4333796.zip && rm -f sdk-tools-linux-4333796.zip
+    /workspace/android-sdk/tools/bin/sdkmanager "platform-tools" "platforms;android-28" "build-tools;28.0.3"
+    echo "Init Flutter..."
+    cd /workspace/ha_client
+    flutter upgrade
+    flutter doctor --android-licenses
+    flutter pub get
+  command: |
+    echo "Ready to go!"
+    flutter doctor
+vscode:
+  extensions:
+    - Dart-Code.dart-code@3.5.0-beta.1:Wg2nTABftVR/Dry4tqeY1w==
+    - Dart-Code.flutter@3.5.0:/kOacEWdiDRLyN/idUiM4A==

README.md

@@ -1,12 +1,18 @@
-[![flutter](https://somegeeky.website/assets/badges/flutter_badge_v3.svg)](https://somegeeky.website/badges/flutter) [![dart](https://somegeeky.website/assets/badges/dart_badge_v3.svg)](https://somegeeky.website/badges/dart)
 # HA Client
 ## Native Android client for Home Assistant
-### With Lovelace UI support
+### With notifications and Lovelace UI support
 
-Visit [homemade.systems](http://ha-client.homemade.systems/) for more info.
+Visit [ha-client.app](http://ha-client.app/) for more info.
 
-Join [Google Group](https://groups.google.com/d/forum/ha-client-alpha-testing) to become an alpha tester
+Download the app from [Google Play](https://play.google.com/apps/testing/com.keyboardcrumbs.haclient)
 
-Download the app from [Google Play](https://play.google.com/apps/testing/com.keyboardcrumbs.haclient) after joining the group
+Discuss it on [Discord](https://discord.gg/u9vq7QE) or at [Home Assistant community](https://community.home-assistant.io/c/mobile-apps/ha-client-android)
 
-Discuss it in [Home Assistant community](https://community.home-assistant.io/t/alpha-testing-ha-client-native-android-client-for-home-assistant/69912)
+[![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/estevez-dev/ha_client) 
+
+#### Stable CI build
+[![Codemagic build status](https://api.codemagic.io/apps/5da8bdab9f20ef798f7c2c65/5eaef46c513b9f9b25eb7f1a/status_badge.svg)](https://codemagic.io/apps/5da8bdab9f20ef798f7c2c65/5eaef46c513b9f9b25eb7f1a/latest_build)
+#### Beta CI build
+[![Codemagic build status](https://api.codemagic.io/apps/5da8bdab9f20ef798f7c2c65/5db1862025dc3f0b0288a57a/status_badge.svg)](https://codemagic.io/apps/5da8bdab9f20ef798f7c2c65/5db1862025dc3f0b0288a57a/latest_build)
+#### Pre-release CI build
+[![Codemagic build status](https://api.codemagic.io/apps/5da8bdab9f20ef798f7c2c65/5da8bdab9f20ef798f7c2c64/status_badge.svg)](https://codemagic.io/apps/5da8bdab9f20ef798f7c2c65/5da8bdab9f20ef798f7c2c64/latest_build)

android/.gitignore

@@ -8,3 +8,4 @@
 /build
 /captures
 GeneratedPluginRegistrant.java
+.project/

android/.project

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<projectDescription>
+	<name>android</name>
+	<comment>Project android created by Buildship.</comment>
+	<projects>
+	</projects>
+	<buildSpec>
+		<buildCommand>
+			<name>org.eclipse.buildship.core.gradleprojectbuilder</name>
+			<arguments>
+			</arguments>
+		</buildCommand>
+	</buildSpec>
+	<natures>
+		<nature>org.eclipse.buildship.core.gradleprojectnature</nature>
+	</natures>
+</projectDescription>

android/app/.classpath

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<classpath>
+	<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-1.8/"/>
+	<classpathentry kind="con" path="org.eclipse.buildship.core.gradleclasspathcontainer"/>
+	<classpathentry kind="output" path="bin/default"/>
+</classpath>

android/app/.project

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<projectDescription>
+	<name>app</name>
+	<comment>Project app created by Buildship.</comment>
+	<projects>
+	</projects>
+	<buildSpec>
+		<buildCommand>
+			<name>org.eclipse.jdt.core.javabuilder</name>
+			<arguments>
+			</arguments>
+		</buildCommand>
+		<buildCommand>
+			<name>org.eclipse.buildship.core.gradleprojectbuilder</name>
+			<arguments>
+			</arguments>
+		</buildCommand>
+	</buildSpec>
+	<natures>
+		<nature>org.eclipse.jdt.core.javanature</nature>
+		<nature>org.eclipse.buildship.core.gradleprojectnature</nature>
+	</natures>
+</projectDescription>

android/app/build.gradle

@@ -50,6 +50,14 @@ android {
     }
 
     signingConfigs {
+        if (!System.getenv()["CI"]) {
+            debug {
+                keyAlias keystoreProperties['debugKeyAlias']
+                keyPassword keystoreProperties['debugKeyPassword']
+                storeFile file(keystoreProperties['debugStoreFile'])
+                storePassword keystoreProperties['debugStorePassword']
+            }
+        }
         release {
             keyAlias keystoreProperties['keyAlias']
             keyPassword keystoreProperties['keyPassword']
@@ -70,10 +78,11 @@ flutter {
 }
 
 dependencies {
-    implementation 'com.google.firebase:firebase-core:16.0.8'
+    implementation 'com.google.firebase:firebase-analytics:17.2.2'
     testImplementation 'junit:junit:4.12'
     androidTestImplementation 'com.android.support.test:runner:1.0.2'
     androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
 }
 
+apply plugin: 'io.fabric'
 apply plugin: 'com.google.gms.google-services'

android/app/google-services.json

@@ -1,42 +0,0 @@
-{
-  "project_info": {
-    "project_number": "441874387819",
-    "firebase_url": "https://ha-client-c73c4.firebaseio.com",
-    "project_id": "ha-client-c73c4",
-    "storage_bucket": "ha-client-c73c4.appspot.com"
-  },
-  "client": [
-    {
-      "client_info": {
-        "mobilesdk_app_id": "1:441874387819:android:92c7efc892dc3d45",
-        "android_client_info": {
-          "package_name": "com.keyboardcrumbs.haclient"
-        }
-      },
-      "oauth_client": [
-        {
-          "client_id": "441874387819-id0hqsfprj3b5kc312faqv3lmdfpm7l8.apps.googleusercontent.com",
-          "client_type": 3
-        }
-      ],
-      "api_key": [
-        {
-          "current_key": "AIzaSyBsl9cjBY633IrdrTyCsLFlO9lfsYJ0OJU"
-        }
-      ],
-      "services": {
-        "analytics_service": {
-          "status": 1
-        },
-        "appinvite_service": {
-          "status": 1,
-          "other_platform_oauth_client": []
-        },
-        "ads_service": {
-          "status": 2
-        }
-      }
-    }
-  ],
-  "configuration_version": "1"
-}

android/app/src/main/AndroidManifest.xml

@@ -1,12 +1,19 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
     package="com.keyboardcrumbs.hassclient">
 
-    <!-- The INTERNET permission is required for development. Specifically,
+    <uses-feature android:name="android.hardware.touchscreen"
-         flutter needs it to communicate with the running application
+        android:required="false" />
-         to allow setting breakpoints, to provide hot reload, etc.
-    -->
     <uses-permission android:name="android.permission.INTERNET"/>
     <uses-permission android:name="android.permission.VIBRATE" />
+    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
+    <uses-permission android:name="android.permission.ACCESS_BACKGROUND_LOCATION" />
+    <uses-permission android:name="android.permission.WAKE_LOCK"/>
+    <uses-permission android:name="android.permission.FOREGROUND_SERVICE"/>
+    <!--
+    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
+    -->
+    <uses-permission android:name="android.permission.WAKE_LOCK"/>
+
 
     <!-- io.flutter.app.FlutterApplication is an android.app.Application that
          calls FlutterMain.startInitialization(this); in its onCreate method.
@@ -17,8 +24,13 @@
         android:name="io.flutter.app.FlutterApplication"
         android:label="HA Client"
         android:icon="@mipmap/ic_launcher"
+        android:roundIcon="@mipmap/ic_launcher_round"
         android:usesCleartextTraffic="true">
 
+        <meta-data
+            android:name="flutterEmbedding"
+            android:value="2" />
+
         <meta-data
             android:name="com.google.firebase.messaging.default_notification_channel_id"
             android:value="ha_notify" />
@@ -30,13 +42,12 @@
             android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density"
             android:hardwareAccelerated="true"
             android:windowSoftInputMode="adjustResize">
-            <!-- This keeps the window background of the activity showing
-                 until Flutter renders its first frame. It can be removed if
-                 there is no splash screen (such as the default splash screen
-                 defined in @style/LaunchTheme).
             <meta-data
-                android:name="io.flutter.app.android.SplashScreenUntilFirstFrame"
+                android:name="io.flutter.embedding.android.SplashScreenDrawable"
-                android:value="true" />-->
+                android:resource="@drawable/launch_background" />
+            <meta-data
+                android:name="io.flutter.embedding.android.NormalTheme"
+                android:resource="@style/NormalTheme" />
             <intent-filter>
                 <action android:name="FLUTTER_NOTIFICATION_CLICK" />
                 <category android:name="android.intent.category.DEFAULT" />
@@ -46,5 +57,32 @@
                 <category android:name="android.intent.category.LAUNCHER"/>
             </intent-filter>
         </activity>
+
+        <receiver android:name="rekab.app.background_locator.LocatorBroadcastReceiver"
+            android:enabled="true"
+            android:exported="true"/>
+        <service android:name="rekab.app.background_locator.LocatorService"
+            android:permission="android.permission.BIND_JOB_SERVICE"
+            android:exported="true"/>
+        <service android:name="rekab.app.background_locator.IsolateHolderService"
+            android:permission="android.permission.FOREGROUND_SERVICE"
+            android:exported="true"/>
+
+        <!-- 
+        <service
+            android:name="io.flutter.plugins.androidalarmmanager.AlarmService"
+            android:permission="android.permission.BIND_JOB_SERVICE"
+            android:exported="false"/>
+        <receiver
+            android:name="io.flutter.plugins.androidalarmmanager.AlarmBroadcastReceiver"
+            android:exported="false"/>
+        <receiver
+            android:name="io.flutter.plugins.androidalarmmanager.RebootBroadcastReceiver"
+            android:enabled="false">
+            <intent-filter>
+                <action android:name="android.intent.action.BOOT_COMPLETED"></action>
+            </intent-filter>
+        </receiver>
+    -->
     </application>
 </manifest>

android/app/src/main/java/com/keyboardcrumbs/hassclient/MainActivity.java

@@ -1,13 +1,15 @@
 package com.keyboardcrumbs.hassclient;
 
-import android.os.Bundle;
+import androidx.annotation.NonNull;
-import io.flutter.app.FlutterActivity;
+import io.flutter.embedding.android.FlutterActivity;
+import io.flutter.embedding.engine.FlutterEngine;
 import io.flutter.plugins.GeneratedPluginRegistrant;
 
 public class MainActivity extends FlutterActivity {
-  @Override
+  
-  protected void onCreate(Bundle savedInstanceState) {
+    @Override
-    super.onCreate(savedInstanceState);
+    public void configureFlutterEngine(@NonNull FlutterEngine flutterEngine) {
-    GeneratedPluginRegistrant.registerWith(this);
+        GeneratedPluginRegistrant.registerWith(flutterEngine);
-  }
+    }
+
 }

android/app/src/main/res/drawable/ic_launcher_foreground.xml

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="108"
+    android:viewportHeight="108">
+
+    <group>
+        <clip-path
+            android:pathData="M 0 0 H 108 V 108 H 0 V 0 Z" />
+        <path
+            android:fillColor="#709ac1"
+            android:fillAlpha="0"
+            android:pathData="M 0 0 H 108 V 108 H 0 V 0 Z" />
+        <path
+            android:fillColor="#000000"
+            android:fillAlpha="0.12"
+            android:pathData="M 70.506 38.389 L 108 72.466 L 108 108 L 77 108 L 35.066 72.466 L 38.373 63.769 L 36.268 50.216 L 43.335 44.523 L 51.841 34.578 L 63.096 42.478 L 68.586 42.478 L 70.506 38.389 Z" />
+        <path
+            android:fillColor="#000000"
+            android:fillAlpha="0.12"
+            android:pathData="M 28.979 53.708 L 47.736 67.31 L 38.373 58.563 L 36.268 51.52 L 28.979 53.708 Z" />
+        <path
+            android:fillColor="#ffffff"
+            android:pathData="M 77.131 54.24 L 72.878 54.24 L 72.878 72.415 L 56.339 72.415 L 56.339 64.85 L 62.931 58.511 L 64.609 58.784 C 67.349 58.784 69.57 56.649 69.57 54.013 C 69.57 51.378 67.349 49.242 64.609 49.242 C 61.868 49.242 59.647 51.378 59.647 54.013 L 59.883 55.626 L 56.339 59.079 L 56.339 46.63 C 57.898 45.812 58.938 44.244 58.938 42.427 C 58.938 39.792 56.717 37.656 53.976 37.656 C 51.236 37.656 49.015 39.792 49.015 42.427 C 49.015 44.244 50.054 45.812 51.614 46.63 L 51.614 59.079 L 48.07 55.626 L 48.306 54.013 C 48.306 51.378 46.084 49.242 43.344 49.242 C 40.604 49.242 38.383 51.378 38.383 54.013 C 38.383 56.648 40.604 58.784 43.344 58.784 L 45.022 58.511 L 51.614 64.85 L 51.614 72.415 L 35.075 72.415 L 35.075 54.24 L 30.94 54.24 C 29.948 54.24 28.979 54.24 28.979 53.763 C 29.003 53.263 29.995 52.309 31.011 51.332 L 51.614 31.522 C 52.393 30.772 53.197 30 53.976 30 C 54.756 30 55.559 30.772 56.339 31.522 L 65.79 40.609 L 65.79 38.338 L 70.515 38.338 L 70.515 45.153 L 77.084 51.469 C 78.029 52.377 78.997 53.309 79.021 53.786 C 79.021 54.24 78.076 54.24 77.131 54.24 Z M 43.344 51.969 C 43.908 51.969 44.449 52.184 44.848 52.567 C 45.247 52.951 45.471 53.471 45.471 54.013 C 45.471 54.555 45.247 55.076 44.848 55.459 C 44.449 55.842 43.908 56.058 43.344 56.058 C 42.78 56.058 42.239 55.842 41.841 55.459 C 41.442 55.076 41.218 54.555 41.218 54.013 C 41.218 53.471 41.442 52.951 41.841 52.567 C 42.239 52.184 42.78 51.969 43.344 51.969 Z M 64.609 51.969 C 65.79 51.969 66.735 52.877 66.735 54.013 C 66.735 55.149 65.79 56.058 64.609 56.058 C 64.045 56.058 63.504 55.842 63.105 55.459 C 62.706 55.076 62.482 54.555 62.482 54.013 C 62.482 53.471 62.706 52.951 63.105 52.567 C 63.504 52.184 64.045 51.969 64.609 51.969 Z M 53.976 40.382 C 55.158 40.382 56.103 41.291 56.103 42.427 C 56.103 43.563 55.158 44.472 53.976 44.472 C 52.795 44.472 51.85 43.563 51.85 42.427 C 51.85 41.291 52.795 40.382 53.976 40.382 Z" />
+    </group>
+</vector>

android/app/src/main/res/drawable/launch_background.xml

@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <!-- Modify this file to customize your launch splash screen -->
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:drawable="@android:color/white" />
+    <item android:drawable="@color/main_color" />
 
     <!-- You can insert your own image assets here -->
     <!-- <item>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/main_color"/>
+    <foreground android:drawable="@drawable/ic_launcher_foreground" />
+</adaptive-icon>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/main_color"/>
+    <foreground android:drawable="@drawable/ic_launcher_foreground" />
+</adaptive-icon>

android/app/src/main/res/values/styles.xml

@@ -1,8 +1,12 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
+    <color name="main_color">#709AC1</color>
     <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
         <!-- Show a splash screen on the activity. Automatically removed when
              Flutter draws its first frame -->
         <item name="android:windowBackground">@drawable/launch_background</item>
     </style>
+    <style name="NormalTheme" parent="@android:style/Theme.Black.NoTitleBar">
+        <item name="android:windowBackground">@drawable/launch_background</item>
+    </style>
 </resources>

android/build.gradle

@@ -2,11 +2,15 @@ buildscript {
     repositories {
         google()
         jcenter()
+        maven {
+            url 'https://maven.fabric.io/public'
+        }
     }
 
     dependencies {
         classpath 'com.android.tools.build:gradle:3.3.2'
-        classpath 'com.google.gms:google-services:4.2.0'
+        classpath 'com.google.gms:google-services:4.3.3'
+        classpath 'io.fabric.tools:gradle:1.26.1'
     }
 }
 
@@ -14,6 +18,9 @@ allprojects {
     repositories {
         google()
         jcenter()
+        maven {
+            url 'https://maven.fabric.io/public'
+        }
     }
 }
 

android/gradle.properties

@@ -3,3 +3,4 @@ org.gradle.daemon=true
 org.gradle.caching=true
 android.useAndroidX=true
 android.enableJetifier=true
+android.enableR8=true

android/settings_aar.gradle

@@ -0,0 +1 @@
+include ':app'

assets/html/cameraLiveView.html

@@ -0,0 +1,61 @@
+<html>
+<head>
+<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
+<style>
+    body {
+        padding: 0;
+        margin: 0;
+        widows: 100%;
+        height: 100%;
+    }
+
+    video {
+        width: 100%;
+    }
+</style>
+<script>
+    var messageChannel = '{{message_channel}}';
+</script>
+</head>
+<body>
+<video id="screen" width="100%" controls></video>
+<script>
+if (Hls.isSupported()) {
+    var video = document.getElementById('screen');
+    var hls = new Hls();
+    hls.on(Hls.Events.ERROR, function (event, data) {
+            if (data.fatal) {
+            switch(data.type) {
+            case Hls.ErrorTypes.NETWORK_ERROR:
+            // try to recover network error
+                console.log("fatal network error encountered, try to recover");
+                hls.startLoad();
+                break;
+            case Hls.ErrorTypes.MEDIA_ERROR:
+                console.log("fatal media error encountered, try to recover");
+                hls.recoverMediaError();
+                break;
+            default:
+            // cannot recover
+                hls.destroy();
+                break;
+            }
+            }
+        });
+    // bind them together
+    hls.attachMedia(video);
+    hls.on(Hls.Events.MEDIA_ATTACHED, function () {
+        console.log("video and hls.js are now bound together !");
+        hls.loadSource("{{stream_url}}");
+        hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) {
+            console.log("manifest loaded, found " + data.levels.length + " quality level");
+            video.play();
+            video.onloadedmetadata = function() {
+                window[messageChannel].postMessage(document.body.clientWidth / video.offsetHeight);
+            };
+        });
+    });
+}
+</script>
+</body>
+</html>

assets/html/cameraView.html

@@ -0,0 +1,28 @@
+<html>
+<head>
+<style>
+    body {
+        padding: 0;
+        margin: 0;
+        widows: 100%;
+        height: 100%;
+    }
+
+    img {
+        width: 100%;
+    }
+</style>
+<script>
+    var messageChannel = '{{message_channel}}';
+    window.onload = function() {
+        var img = document.getElementById('screen');
+        if (img) {
+            window[messageChannel].postMessage(document.body.clientWidth / img.offsetHeight);
+        }
+    };
+</script>
+</head>
+<body>
+<img id="screen" src="{{stream_url}}">
+</body>
+</html>

assets/js/externalAuth.js

@@ -0,0 +1,37 @@
+window.externalApp = {};
+window.externalApp.getExternalAuth = function(options) {
+    console.log("Starting external auth");
+    var options = JSON.parse(options);
+    if (options && options.callback) {
+        var responseData = {
+            access_token: "[token]",
+            expires_in: 1800
+        };
+        console.log("Waiting for callback to be added");
+        setTimeout(function(){
+            console.log("Calling a callback");
+            window[options.callback](true, responseData);
+        }, 900);
+    }
+};
+/*
+window.externalApp.externalBus = function(message) {
+    console.log("External bus message: " + message);
+    var messageObj = JSON.parse(message);
+    if (messageObj.type == "config/get") {
+        var responseData = {
+            id: messageObj.id,
+            type: "result",
+            success: true,
+            result: {
+                hasSettingsScreen: true
+            }
+        };
+        setTimeout(function(){
+            window.externalBus(responseData);
+        }, 500);
+    } else if (messageObj.type == "config_screen/show") {
+        HAClient.postMessage('show-settings');
+    }
+};
+*/

flutter_01.log

@@ -0,0 +1,41 @@
+Flutter crash report; please file at https://github.com/flutter/flutter/issues.
+
+## command
+
+flutter --no-color run --machine --track-widget-creation --device-id=89AY052S4 lib/main.dart
+
+## exception
+
+_InternalLinkedHashMap<String, dynamic>: {code: 105, message: Isolate must be runnable, data: {request: {method: _reloadSources, params: {pause: true, rootLibUri: file:///data/user/0/com.keyboardcrumbs.haclient/code_cache/ha_clientSYJJZI/ha_client/lib/main.dart.incremental.dill, packagesUri: file:///data/user/0/com.keyboardcrumbs.haclient/code_cache/ha_clientSYJJZI/ha_client/.packages, isolateId: isolates/68989666}}, details: Isolate must be runnable before this request is made.}}
+
+```
+null```
+
+## flutter doctor
+
+```
+[✓] Flutter (Channel stable, v1.7.8+hotfix.4, on Linux, locale en_US.UTF-8)
+    • Flutter version 1.7.8+hotfix.4 at /home/estevez/sdk/flutter
+    • Framework revision 20e59316b8 (6 weeks ago), 2019-07-18 20:04:33 -0700
+    • Engine revision fee001c93f
+    • Dart version 2.4.0
+
+[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
+    • Android SDK at /home/estevez/Android/Sdk
+    • Android NDK location not configured (optional; useful for native profiling support)
+    • Platform android-29, build-tools 29.0.2
+    • Java binary at: /home/estevez/bin/android-studio/jre/bin/java
+    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
+    • All Android licenses accepted.
+
+[✓] Android Studio (version 3.5)
+    • Android Studio at /home/estevez/bin/android-studio
+    • Flutter plugin version 38.2.3
+    • Dart plugin version 191.8423
+    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
+
+[✓] Connected device (1 available)
+    • Pixel 3 XL • 89AY052S4 • android-arm64 • Android 9 (API 28)
+
+• No issues found!
+```

flutter_02.log

@@ -0,0 +1,41 @@
+Flutter crash report; please file at https://github.com/flutter/flutter/issues.
+
+## command
+
+flutter --no-color run --machine --track-widget-creation --device-id=89AY052S4 lib/main.dart
+
+## exception
+
+_InternalLinkedHashMap<String, dynamic>: {code: 105, message: Isolate must be runnable, data: {request: {method: _reloadSources, params: {pause: true, rootLibUri: file:///data/user/0/com.keyboardcrumbs.haclient/code_cache/ha_clientWYMXDL/ha_client/lib/main.dart.incremental.dill, packagesUri: file:///data/user/0/com.keyboardcrumbs.haclient/code_cache/ha_clientWYMXDL/ha_client/.packages, isolateId: isolates/289688365}}, details: Isolate must be runnable before this request is made.}}
+
+```
+null```
+
+## flutter doctor
+
+```
+[✓] Flutter (Channel stable, v1.7.8+hotfix.4, on Linux, locale en_US.UTF-8)
+    • Flutter version 1.7.8+hotfix.4 at /home/estevez/sdk/flutter
+    • Framework revision 20e59316b8 (6 weeks ago), 2019-07-18 20:04:33 -0700
+    • Engine revision fee001c93f
+    • Dart version 2.4.0
+
+[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
+    • Android SDK at /home/estevez/Android/Sdk
+    • Android NDK location not configured (optional; useful for native profiling support)
+    • Platform android-29, build-tools 29.0.2
+    • Java binary at: /home/estevez/bin/android-studio/jre/bin/java
+    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
+    • All Android licenses accepted.
+
+[✓] Android Studio (version 3.5)
+    • Android Studio at /home/estevez/bin/android-studio
+    • Flutter plugin version 38.2.3
+    • Dart plugin version 191.8423
+    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
+
+[✓] Connected device (1 available)
+    • Pixel 3 XL • 89AY052S4 • android-arm64 • Android 9 (API 28)
+
+• No issues found!
+```

flutter_03.log

@@ -0,0 +1,41 @@
+Flutter crash report; please file at https://github.com/flutter/flutter/issues.
+
+## command
+
+flutter --no-color run --machine --track-widget-creation --device-id=89AY052S4 lib/main.dart
+
+## exception
+
+_InternalLinkedHashMap<String, dynamic>: {code: 105, message: Isolate must be runnable, data: {request: {method: _reloadSources, params: {pause: true, rootLibUri: file:///data/user/0/com.keyboardcrumbs.haclient/code_cache/ha_clientLNSJAH/ha_client/lib/main.dart.incremental.dill, packagesUri: file:///data/user/0/com.keyboardcrumbs.haclient/code_cache/ha_clientLNSJAH/ha_client/.packages, isolateId: isolates/866521062}}, details: Isolate must be runnable before this request is made.}}
+
+```
+null```
+
+## flutter doctor
+
+```
+[✓] Flutter (Channel stable, v1.7.8+hotfix.4, on Linux, locale en_US.UTF-8)
+    • Flutter version 1.7.8+hotfix.4 at /home/estevez/sdk/flutter
+    • Framework revision 20e59316b8 (6 weeks ago), 2019-07-18 20:04:33 -0700
+    • Engine revision fee001c93f
+    • Dart version 2.4.0
+
+[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
+    • Android SDK at /home/estevez/Android/Sdk
+    • Android NDK location not configured (optional; useful for native profiling support)
+    • Platform android-29, build-tools 29.0.2
+    • Java binary at: /home/estevez/bin/android-studio/jre/bin/java
+    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
+    • All Android licenses accepted.
+
+[✓] Android Studio (version 3.5)
+    • Android Studio at /home/estevez/bin/android-studio
+    • Flutter plugin version 38.2.3
+    • Dart plugin version 191.8423
+    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
+
+[✓] Connected device (1 available)
+    • Pixel 3 XL • 89AY052S4 • android-arm64 • Android 9 (API 28)
+
+• No issues found!
+```

lib/cards/alarm_panel_card.dart

@@ -0,0 +1,62 @@
+part of '../main.dart';
+
+class AlarmPanelCard extends StatelessWidget {
+  final AlarmPanelCardData card;
+
+  const AlarmPanelCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    if (card.entity.entity.statelessType == StatelessEntityType.missed) {
+      return EntityModel(
+        entityWrapper: card.entity,
+        child: MissedEntityWidget(),
+        handleTap: false,
+      );
+    }
+    List<Widget> body = [];
+    body.add(CardHeader(
+      name: card.name ?? "",
+      subtitle: Text("${card.entity.entity.displayState}",
+    ),
+    trailing: Row(
+      mainAxisSize: MainAxisSize.min,
+      mainAxisAlignment: MainAxisAlignment.end,
+      children: [
+        EntityIcon(
+          size: 50.0,
+        ),
+        Container(
+            width: 26.0,
+            child: IconButton(
+                padding: EdgeInsets.all(0.0),
+                alignment: Alignment.centerRight,
+                icon: Icon(MaterialDesignIcons.getIconDataFromIconName(
+                    "mdi:dots-vertical")),
+                onPressed: () => eventBus.fire(new ShowEntityPageEvent(entityId: card.entity.entity.entityId))
+            )
+        )
+      ]
+    ),
+    ));
+    body.add(
+        AlarmControlPanelControlsWidget(
+          extended: true,
+          states: card.states,
+        )
+    );
+    return CardWrapper(
+        child: EntityModel(
+            entityWrapper: card.entity,
+            handleTap: null,
+            child: Column(
+                crossAxisAlignment: CrossAxisAlignment.center,
+                mainAxisSize: MainAxisSize.min,
+                children: body
+            )
+        )
+    );
+  }
+
+  
+}

lib/cards/badges.dart

@@ -0,0 +1,196 @@
+part of '../main.dart';
+
+class Badges extends StatelessWidget {
+  final BadgesData badges;
+
+  const Badges({Key key, this.badges}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    List<EntityWrapper> entitiesToShow = badges.getEntitiesToShow();
+    
+    if (entitiesToShow.isNotEmpty) {
+      if (ConnectionManager().scrollBadges) {
+        return ConstrainedBox(
+          constraints: BoxConstraints.tightFor(height: 112),
+          child: SingleChildScrollView(
+            scrollDirection: Axis.horizontal,
+            child: Row(
+              mainAxisSize: MainAxisSize.min,
+              mainAxisAlignment: MainAxisAlignment.center,
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: entitiesToShow.map((entity) =>
+                EntityModel(
+                  entityWrapper: entity,
+                  child: Padding(
+                    padding: EdgeInsets.fromLTRB(5, 10, 5, 10),
+                    child: BadgeWidget(),
+                  ),
+                  handleTap: true,
+                )).toList()
+            ),
+          )
+        );
+      } else {
+        return Padding(
+          padding: EdgeInsets.fromLTRB(5, 10, 5, 10),
+          child: Wrap(
+            alignment: WrapAlignment.center,
+            spacing: 10.0,
+            runSpacing: 5,
+            children: entitiesToShow.map((entity) =>
+                EntityModel(
+                  entityWrapper: entity,
+                  child: BadgeWidget(),
+                  handleTap: true,
+                )).toList(),
+          )
+        );
+      }
+    }
+    return Container(height: 0.0, width: 0.0,);
+  }
+}
+
+class BadgeWidget extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    final entityModel = EntityModel.of(context);
+    Widget badgeIcon;
+    String onBadgeTextValue;
+    Color iconColor = HAClientTheme().getBadgeColor(entityModel.entityWrapper.entity.domain);
+    switch (entityModel.entityWrapper.entity.domain) {
+      case "sun":
+        {
+          IconData iconData;
+          if (entityModel.entityWrapper.entity.state == "below_horizon") {
+            iconData = MaterialDesignIcons.getIconDataFromIconCode(0xf0dc);
+          } else {
+            iconData = MaterialDesignIcons.getIconDataFromIconCode(0xf5a8);
+          }
+          badgeIcon = Padding(
+            padding: EdgeInsets.all(10),
+            child: Icon(
+              iconData,
+            )
+          );
+          break;
+        }
+      case "camera":
+      case "media_player":
+      case "binary_sensor":
+        {
+          badgeIcon = EntityIcon(
+            imagePadding: EdgeInsets.all(0.0),
+            iconPadding: EdgeInsets.all(10),
+            color: Theme.of(context).textTheme.body2.color
+          );
+          break;
+        }
+      case "device_tracker":
+      case "person":
+        {
+          badgeIcon = EntityIcon(
+            imagePadding: EdgeInsets.all(0.0),
+            iconPadding: EdgeInsets.all(10),
+            color: Theme.of(context).textTheme.body2.color
+          );
+          onBadgeTextValue = entityModel.entityWrapper.entity.displayState;
+          break;
+        }
+      default:
+        {
+          onBadgeTextValue = entityModel.entityWrapper.unitOfMeasurement;
+          badgeIcon = Padding(
+            padding: EdgeInsets.all(4),
+            child: Text(
+              "${entityModel.entityWrapper.entity.displayState}",
+              overflow: TextOverflow.fade,
+              softWrap: false,
+              textAlign: TextAlign.center,
+              style: Theme.of(context).textTheme.body1
+            )
+          );
+          break;
+        }
+    }
+    Widget onBadgeText;
+    if (onBadgeTextValue == null || onBadgeTextValue.length == 0) {
+      onBadgeText = Container(width: 0.0, height: 0.0);
+    } else {
+      onBadgeText = Container(
+        constraints: BoxConstraints(maxWidth: 50),
+        padding: EdgeInsets.fromLTRB(6.0, 2.0, 6.0, 2.0),
+        child: Text("$onBadgeTextValue",
+            style: Theme.of(context).textTheme.overline.copyWith(
+              color: HAClientTheme().getOnBadgeTextColor()
+            ),
+            textAlign: TextAlign.center,
+            softWrap: false,
+            overflow: TextOverflow.ellipsis
+          ),
+        decoration: new BoxDecoration(
+          color: iconColor,
+          borderRadius: BorderRadius.circular(9.0),
+        )
+      );
+    }
+    return GestureDetector(
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: <Widget>[
+            Stack(
+              overflow: Overflow.visible,
+              alignment: Alignment.center,
+              children: <Widget>[
+                Container(
+                  width: 45,
+                  height: 45,
+                  decoration: new BoxDecoration(
+                    // Circle shape
+                    shape: BoxShape.circle,
+                    color: Theme.of(context).cardColor,
+                    // The border you want
+                    border: Border.all(
+                      width: 2.0,
+                      color: iconColor,
+                    ),
+                  ),
+                ),
+                SizedBox(
+                  width: 41,
+                  height: 41,
+                  child: FittedBox(
+                    fit: BoxFit.contain,
+                    alignment: Alignment.center,
+                    child: badgeIcon,
+                  )
+                ),
+                Positioned(
+                  bottom: -6,
+                  child: onBadgeText
+                )
+              ],
+            ),
+            Container(
+              constraints: BoxConstraints(maxWidth: 45),
+              padding: EdgeInsets.only(top: 10),
+              child: Text(
+                "${entityModel.entityWrapper.displayName}",
+                textAlign: TextAlign.center,
+                style: Theme.of(context).textTheme.caption.copyWith(
+                  fontSize: 10
+                ),
+                softWrap: true,
+                maxLines: 3,
+                overflow: TextOverflow.ellipsis,
+              ),
+            )
+          ],
+        ),
+        onTap: () => entityModel.entityWrapper.handleTap(),
+        onDoubleTap: () => entityModel.entityWrapper.handleDoubleTap(),
+        onLongPress: () => entityModel.entityWrapper.handleHold(),
+    );
+  }
+}

lib/cards/card.class.dart

@@ -0,0 +1,622 @@
+part of '../main.dart';
+
+class CardData {
+
+  String type;
+  List<EntityWrapper> entities = [];
+  List conditions;
+  bool showEmpty;
+  List stateFilter;
+  bool stateColor = true;
+
+  EntityWrapper get entity => entities.isNotEmpty ? entities[0] : null;
+
+  factory CardData.parse(rawData) {
+    try {
+      if (rawData['type'] == null) {
+        rawData['type'] = CardType.ENTITIES;
+      } else if (!(rawData['type'] is String)) {
+        return CardData(null);
+      }
+      switch (rawData['type']) {
+          case CardType.ENTITIES:
+          case CardType.HISTORY_GRAPH:
+          case CardType.MAP:
+          case CardType.PICTURE_GLANCE:
+          case CardType.SENSOR:
+          case CardType.ENTITY:
+          case CardType.WEATHER_FORECAST:
+          case CardType.PLANT_STATUS:
+            if (rawData['entity'] != null) {
+              rawData['entities'] = [rawData['entity']];
+            }
+            return EntitiesCardData(rawData);
+            break;
+          case CardType.ALARM_PANEL:
+            return AlarmPanelCardData(rawData);
+            break;
+          case CardType.ENTITY_BUTTON:
+          case CardType.LIGHT:
+          case CardType.BUTTON:
+          case CardType.PICTURE_ENTITY:
+            return ButtonCardData(rawData);
+            break;
+          case CardType.CONDITIONAL:
+            return CardData.parse(rawData['card']);
+            break;
+          case CardType.ENTITY_FILTER:
+            Map cardData = Map.from(rawData);
+            cardData.remove('type');
+            if (rawData.containsKey('card')) {
+              cardData.addAll(rawData['card']);
+            }
+            cardData['type'] ??= CardType.ENTITIES;
+            return CardData.parse(cardData);
+            break;
+          case CardType.GAUGE:
+            return GaugeCardData(rawData);
+            break;
+          case CardType.GLANCE:
+          case CardType.THERMOSTAT:
+            if (rawData['entity'] != null) {
+              rawData['entities'] = [rawData['entity']];
+            }
+            return GlanceCardData(rawData);
+            break;
+          case CardType.HORIZONTAL_STACK:
+            return HorizontalStackCardData(rawData);
+            break;
+          case CardType.VERTICAL_STACK:
+            return VerticalStackCardData(rawData);
+            break;
+          case CardType.MARKDOWN:
+            return MarkdownCardData(rawData);
+            break;
+          case CardType.MEDIA_CONTROL:
+            return MediaControlCardData(rawData);
+            break;
+          case CardType.BADGES:
+            return BadgesData(rawData);
+            break;
+          default:
+            return CardData(null);
+        }
+    } catch (error, stacktrace) {
+      Logger.e('Error parsing card $rawData: $error', stacktrace: stacktrace);
+      return ErrorCardData(rawData);
+    }
+  }
+
+  CardData(rawData) {
+    if (rawData != null && rawData is Map) {
+      type = rawData['type'];
+      conditions = rawData['conditions'] ?? [];
+      showEmpty = rawData['show_empty'] ?? true;
+      stateFilter = rawData['state_filter']  ?? [];
+    } else {
+      type = CardType.UNKNOWN;
+      conditions = [];
+      showEmpty = true;
+      stateFilter = [];
+    }
+  }
+
+  Widget buildCardWidget() {
+    return UnsupportedCard(card: this);
+  }
+
+  List<EntityWrapper> getEntitiesToShow() {
+    return entities.where((entityWrapper) {
+      if (entityWrapper.entity.isHidden) {
+        return false;
+      }
+      List currentStateFilter;
+      if (entityWrapper.stateFilter != null && entityWrapper.stateFilter.isNotEmpty) {
+        currentStateFilter = entityWrapper.stateFilter;
+      } else {
+        currentStateFilter = stateFilter;
+      }
+      bool showByFilter = currentStateFilter.isEmpty;
+      for (var allowedState in currentStateFilter) {
+        if (allowedState is String && allowedState == entityWrapper.entity.state) {
+          showByFilter = true;
+          break;
+        } else if (allowedState is Map) {
+          try {
+            var tmpVal = allowedState['attribute'] != null ? entityWrapper.entity.getAttribute(allowedState['attribute']) : entityWrapper.entity.state;
+            var valToCompareWith = allowedState['value'];
+            var valToCompare;
+            if (valToCompareWith is! String && tmpVal is String) {
+              valToCompare = double.tryParse(tmpVal);
+            } else {
+              valToCompare = tmpVal;
+            }
+            if (valToCompare != null) {
+              bool result;
+              switch (allowedState['operator']) {
+                case '<=': { result = valToCompare <= valToCompareWith;}
+                break;
+                
+                case '<': { result = valToCompare < valToCompareWith;}
+                break;
+
+                case '>=': { result = valToCompare >= valToCompareWith;}
+                break;
+
+                case '>': { result = valToCompare > valToCompareWith;}
+                break;
+
+                case '!=': { result = valToCompare != valToCompareWith;}
+                break;
+
+                case 'regex': {
+                  RegExp regExp = RegExp(valToCompareWith.toString());
+                  result = regExp.hasMatch(valToCompare.toString());
+                }
+                break;
+
+                default: {
+                    result = valToCompare == valToCompareWith;
+                  }
+              }
+              if (result) {
+                showByFilter = true;
+                break;
+              }  
+            }
+          } catch (e, stacktrace) {
+            Logger.e('Error filtering ${entityWrapper.entity.entityId} by $allowedState: $e', stacktrace: stacktrace);
+          }
+        }
+      }
+      return showByFilter;
+    }).toList();
+  }
+
+}
+
+class BadgesData extends CardData {
+
+  String title;
+  String icon;
+  bool showHeaderToggle;
+
+  @override
+  Widget buildCardWidget() {
+    return Badges(badges: this);
+  }
+  
+  BadgesData(rawData) : super(rawData) {
+    if (rawData['badges'] is List) {
+      rawData['badges'].forEach((dynamic rawBadge) {
+        if (rawBadge is String && HomeAssistant().entities.isExist(rawBadge)) {  
+          entities.add(EntityWrapper(entity: HomeAssistant().entities.get(rawBadge)));
+        } else if (rawBadge is Map && rawBadge.containsKey('entity') && HomeAssistant().entities.isExist(rawBadge['entity'])) {
+          entities.add(
+            EntityWrapper(
+              entity: HomeAssistant().entities.get(rawBadge['entity']),
+              overrideName: rawBadge["name"],
+              overrideIcon: rawBadge["icon"],
+            )
+          );
+        } else if (rawBadge is Map && rawBadge.containsKey('entities')) {
+          _parseEntities(rawBadge);
+        }
+      });    
+    }
+  }
+
+  void _parseEntities(rawData) {
+    var rawEntities = rawData['entities'] ?? [];
+    rawEntities.forEach((rawEntity) {
+      if (rawEntity is String) {
+        if (HomeAssistant().entities.isExist(rawEntity)) {
+          entities.add(EntityWrapper(
+            entity: HomeAssistant().entities.get(rawEntity),
+            stateFilter: rawData['state_filter'] ?? [],
+          ));
+        }
+      } else if (HomeAssistant().entities.isExist('${rawEntity['entity']}')) {
+        Entity e = HomeAssistant().entities.get(rawEntity["entity"]);
+        entities.add(
+          EntityWrapper(
+              entity: e,
+              overrideName: rawEntity["name"],
+              overrideIcon: rawEntity["icon"],
+              stateFilter: rawEntity['state_filter'] ?? (rawData['state_filter'] ?? []),
+              uiAction: EntityUIAction(rawEntityData: rawEntity)
+          )
+        );
+      }
+    });
+  }
+
+}
+
+class EntitiesCardData extends CardData {
+
+  String title;
+  String icon;
+  bool showHeaderToggle;
+
+  @override
+  Widget buildCardWidget() {
+    return EntitiesCard(card: this);
+  }
+  
+  EntitiesCardData(rawData) : super(rawData) {
+    //Parsing card data
+    title = rawData['title'];
+    icon = rawData['icon'] is String ? rawData['icon'] : null;
+    stateColor = rawData['state_color'] ?? false;
+    showHeaderToggle = rawData['show_header_toggle'] ?? false;
+    //Parsing entities
+    var rawEntities = rawData['entities'] ?? [];
+    rawEntities.forEach((rawEntity) {
+      if (rawEntity is String) {
+        if (HomeAssistant().entities.isExist(rawEntity)) {
+          entities.add(EntityWrapper(entity: HomeAssistant().entities.get(rawEntity)));
+        } else {
+          entities.add(EntityWrapper(entity: Entity.missed(rawEntity)));
+        }
+      } else {
+        if (rawEntity["type"] == "divider") {
+          entities.add(EntityWrapper(entity: Entity.divider()));
+        } else if (rawEntity["type"] == "section") {
+          entities.add(EntityWrapper(entity: Entity.section(rawEntity["label"] ?? "")));
+        } else if (rawEntity["type"] == "call-service") {
+          Map uiActionData = {
+            "tap_action": {
+              "action": EntityUIAction.callService,
+              "service": rawEntity["service"],
+              "service_data": rawEntity["service_data"]
+            },
+            "hold_action": EntityUIAction.none
+          };
+          entities.add(
+            EntityWrapper(
+              entity: Entity.callService(
+                icon: rawEntity["icon"],
+                name: rawEntity["name"],
+                service: rawEntity["service"],
+                actionName: rawEntity["action_name"]
+              ),
+              stateColor: rawEntity["state_color"] ?? stateColor,
+              uiAction: EntityUIAction(rawEntityData: uiActionData)
+            )
+          );
+        } else if (rawEntity["type"] == "weblink") {
+          Map uiActionData = {
+            "tap_action": {
+              "action": EntityUIAction.navigate,
+              "service": rawEntity["url"]
+            },
+            "hold_action": EntityUIAction.none
+          };
+          entities.add(EntityWrapper(
+              entity: Entity.weblink(
+                  icon: rawEntity["icon"],
+                  name: rawEntity["name"],
+                  url: rawEntity["url"]
+              ),
+              stateColor: rawEntity["state_color"] ?? stateColor,
+              uiAction: EntityUIAction(rawEntityData: uiActionData)
+          )
+          );
+        } else if (HomeAssistant().entities.isExist(rawEntity["entity"])) {
+          Entity e = HomeAssistant().entities.get(rawEntity["entity"]);
+          entities.add(
+            EntityWrapper(
+                entity: e,
+                stateColor: rawEntity["state_color"] ?? stateColor,
+                overrideName: rawEntity["name"],
+                overrideIcon: rawEntity["icon"],
+                stateFilter: rawEntity['state_filter'] ?? [],
+                uiAction: EntityUIAction(rawEntityData: rawEntity)
+            )
+          );
+        } else {
+          entities.add(EntityWrapper(entity: Entity.missed(rawEntity["entity"])));
+        }
+      }
+    });
+  }
+
+}
+
+class AlarmPanelCardData extends CardData {
+
+  String name;
+  List<dynamic> states;
+  
+  @override
+  Widget buildCardWidget() {
+    return AlarmPanelCard(card: this);
+  }
+  
+  AlarmPanelCardData(rawData) : super(rawData) {
+    //Parsing card data
+    name = rawData['name'];
+    states = rawData['states'];
+    //Parsing entity
+    var entitiId = rawData["entity"];
+    if (entitiId != null && entitiId is String) {
+      if (HomeAssistant().entities.isExist(entitiId)) {
+        entities.add(EntityWrapper(
+            entity: HomeAssistant().entities.get(entitiId),
+            stateColor: true,
+            overrideName: name
+        ));
+      } else {
+        entities.add(EntityWrapper(entity: Entity.missed(entitiId)));
+      }
+    }
+    
+  }
+
+}
+
+class ButtonCardData extends CardData {
+
+  String name;
+  String icon;
+  bool showName;
+  bool showIcon;
+  double iconHeightPx = 0;
+  double iconHeightRem = 0;
+  
+  @override
+  Widget buildCardWidget() {
+    return EntityButtonCard(card: this);
+  }
+  
+  ButtonCardData(rawData) : super(rawData) {
+    //Parsing card data
+    name = rawData['name'];
+    icon = rawData['icon'] is String ? rawData['icon'] : null;
+    showName = rawData['show_name'] ?? true;
+    showIcon = rawData['show_icon'] ?? true;
+    stateColor = rawData['state_color'] ?? true;
+    var rawHeight = rawData['icon_height'];
+    if (rawHeight != null && rawHeight is String) {
+      if (rawHeight.contains('px')) {
+        iconHeightPx = double.tryParse(rawHeight.replaceFirst('px', '')) ?? 0;
+      } else if (rawHeight.contains('rem')) {
+        iconHeightRem = double.tryParse(rawHeight.replaceFirst('rem', '')) ?? 0; 
+      } else if (rawHeight.contains('em')) {
+        iconHeightRem = double.tryParse(rawHeight.replaceFirst('em', '')) ?? 0;
+      }
+    }
+    //Parsing entity
+    var entitiId = rawData["entity"];
+    if (entitiId != null && entitiId is String) {
+      if (HomeAssistant().entities.isExist(entitiId)) {
+        entities.add(EntityWrapper(
+            entity: HomeAssistant().entities.get(entitiId),
+            overrideName: name,
+            overrideIcon: icon,
+            stateColor: stateColor,
+            uiAction: EntityUIAction(
+              rawEntityData: rawData
+            )
+        ));
+      } else {
+        entities.add(EntityWrapper(entity: Entity.missed(entitiId)));
+      }
+    } else if (entitiId == null) {
+      entities.add(
+        EntityWrapper(
+          entity: Entity.ghost(
+            name,
+            icon,
+          ),
+          stateColor: stateColor,
+          uiAction: EntityUIAction(
+            rawEntityData: rawData
+          )
+        )
+      );
+    }
+  }
+}
+
+class GaugeCardData extends CardData {
+
+  String name;
+  String unit;
+  double min;
+  double max;
+  Map severity;
+
+  @override
+  Widget buildCardWidget() {
+    return GaugeCard(card: this);
+  }
+  
+  GaugeCardData(rawData) : super(rawData) {
+    //Parsing card data
+    name = rawData['name'];
+    unit = rawData['unit'];
+    if (rawData['min'] is int) {
+      min = rawData['min'].toDouble();  
+    } else if (rawData['min'] is double) {
+      min = rawData['min'];
+    } else {
+      min = 0;
+    }
+    if (rawData['max'] is int) {
+      max = rawData['max'].toDouble();  
+    } else if (rawData['max'] is double) {
+      max = rawData['max'];
+    } else {
+      max = 100;
+    }
+    severity = rawData['severity'];
+    //Parsing entity
+    var entitiId = rawData["entity"] is List ? rawData["entity"][0] : rawData["entity"];
+    if (entitiId != null && entitiId is String) {
+      if (HomeAssistant().entities.isExist(entitiId)) {
+        entities.add(EntityWrapper(
+            entity: HomeAssistant().entities.get(entitiId),
+            overrideName: name
+        ));
+      } else {
+        entities.add(EntityWrapper(entity: Entity.missed(entitiId)));
+      }
+    } else {
+      entities.add(EntityWrapper(entity: Entity.missed('$entitiId')));
+    }
+    
+  }
+
+}
+
+class GlanceCardData extends CardData {
+
+  String title;
+  bool showName;
+  bool showIcon;
+  bool showState;
+  bool stateColor;
+  int columnsCount;
+
+  @override
+  Widget buildCardWidget() {
+    return GlanceCard(card: this);
+  }
+  
+  GlanceCardData(rawData) : super(rawData) {
+    //Parsing card data
+    title = rawData["title"];
+    showName = rawData['show_name'] ?? true;
+    showIcon = rawData['show_icon'] ?? true;
+    showState = rawData['show_state'] ?? true;
+    stateColor = rawData['state_color'] ?? true;
+    columnsCount = rawData['columns'] ?? 4;
+    //Parsing entities
+    var rawEntities = rawData["entities"] ?? [];
+    rawEntities.forEach((rawEntity) {
+      if (rawEntity is String) {
+        if (HomeAssistant().entities.isExist(rawEntity)) {
+          entities.add(EntityWrapper(entity: HomeAssistant().entities.get(rawEntity)));
+        } else {
+          entities.add(EntityWrapper(entity: Entity.missed(rawEntity)));
+        }
+      } else {
+        if (HomeAssistant().entities.isExist(rawEntity["entity"])) {
+          Entity e = HomeAssistant().entities.get(rawEntity["entity"]);
+          entities.add(
+            EntityWrapper(
+                entity: e,
+                stateColor: stateColor,
+                overrideName: rawEntity["name"],
+                overrideIcon: rawEntity["icon"],
+                stateFilter: rawEntity['state_filter'] ?? [],
+                uiAction: EntityUIAction(rawEntityData: rawEntity)
+            )
+          );
+        } else {
+          entities.add(EntityWrapper(entity: Entity.missed(rawEntity["entity"])));
+        }
+      }
+    });
+  }
+
+}
+
+class HorizontalStackCardData extends CardData {
+
+  List<CardData> childCards;
+
+  @override
+  Widget buildCardWidget() {
+    return HorizontalStackCard(card: this);
+  }
+  
+  HorizontalStackCardData(rawData) : super(rawData) {
+    if (rawData.containsKey('cards') && rawData['cards'] is List) {
+      childCards = rawData['cards'].map<CardData>((childCard) {
+        return CardData.parse(childCard);
+      }).toList();
+    } else {
+      childCards = [];
+    }
+  }
+
+}
+
+class VerticalStackCardData extends CardData {
+
+  List<CardData> childCards;
+
+  @override
+  Widget buildCardWidget() {
+    return VerticalStackCard(card: this);
+  }
+  
+  VerticalStackCardData(rawData) : super(rawData) {
+    if (rawData.containsKey('cards') && rawData['cards'] is List) {
+      childCards = rawData['cards'].map<CardData>((childCard) {
+        return CardData.parse(childCard);
+      }).toList();
+    } else {
+      childCards = [];
+    }
+  }
+
+}
+
+class MarkdownCardData extends CardData {
+
+  String title;
+  String content;
+
+  @override
+  Widget buildCardWidget() {
+    return MarkdownCard(card: this);
+  }
+  
+  MarkdownCardData(rawData) : super(rawData) {
+    //Parsing card data
+    title = rawData['title'];
+    content = rawData['content'];
+  }
+
+}
+
+class MediaControlCardData extends CardData {
+
+  @override
+  Widget buildCardWidget() {
+    return MediaControlsCard(card: this);
+  }
+
+  MediaControlCardData(rawData) : super(rawData) {
+    var entitiId = rawData["entity"];
+    if (entitiId != null && entitiId is String) {
+      if (HomeAssistant().entities.isExist(entitiId)) {
+        entities.add(EntityWrapper(
+            entity: HomeAssistant().entities.get(entitiId),
+        ));
+      } else {
+        entities.add(EntityWrapper(entity: Entity.missed(entitiId)));
+      }
+    }
+  }
+
+}
+
+class ErrorCardData extends CardData {
+
+  String cardConfig;
+
+  @override
+  Widget buildCardWidget() {
+    return ErrorCard(card: this);
+  }
+
+  ErrorCardData(rawData) : super(rawData) {
+    cardConfig = '$rawData';
+  }
+
+}

lib/cards/entities_card.dart

@@ -0,0 +1,79 @@
+part of '../main.dart';
+
+class EntitiesCard extends StatelessWidget {
+  final EntitiesCardData card;
+
+  const EntitiesCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    List<EntityWrapper> entitiesToShow = card.getEntitiesToShow();
+    if (entitiesToShow.isEmpty && !card.showEmpty) {
+      return Container(height: 0.0, width: 0.0,);
+    }
+    List<Widget> body = [];
+    Widget headerSwitch;
+    if (card.showHeaderToggle) {
+      bool headerToggleVal = entitiesToShow.any((EntityWrapper en){ return en.entity.state == EntityState.on; });
+      List<String> entitiesToToggle = entitiesToShow.where((EntityWrapper enw) {
+        return <String>["switch", "light", "automation", "input_boolean"].contains(enw.entity.domain);
+      }).map((EntityWrapper en) {
+          return en.entity.entityId;
+      }).toList();
+      headerSwitch = Switch(
+        value: headerToggleVal,
+        onChanged: (val) {
+          if (entitiesToToggle.isNotEmpty) {
+            ConnectionManager().callService(
+              domain: "homeassistant",
+              service: val ? "turn_on" : "turn_off",
+              entityId: entitiesToToggle
+            );
+          }
+        },
+      );
+    }
+    body.add(
+      CardHeader(
+        name: card.title,
+        trailing: headerSwitch,
+        emptyPadding: Sizes.rowPadding,
+        leading: card.icon != null ? Icon(
+          MaterialDesignIcons.getIconDataFromIconName(card.icon),
+          size: Sizes.iconSize,
+          color: Theme.of(context).textTheme.headline.color
+        ) : null,
+      )
+    );
+    body.addAll(
+      entitiesToShow.map((EntityWrapper entity) {
+        return Padding(
+            padding: EdgeInsets.fromLTRB(0.0, 4.0, 0.0, 4.0),
+            child: EntityModel(
+                entityWrapper: entity,
+                handleTap: true,
+                child: entity.entity.buildDefaultWidget(context)
+            ),
+          );
+      })  
+    );
+    return CardWrapper(
+        child: Padding(
+          padding: EdgeInsets.only(
+            right: Sizes.rightWidgetPadding,
+            left: Sizes.leftWidgetPadding,
+            bottom: Sizes.rowPadding,
+          ),
+          child: Center(
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              mainAxisAlignment: MainAxisAlignment.start,
+              children: body
+            )
+          ),
+        )
+    );
+  }
+
+  
+}

lib/cards/entity_button_card.dart

@@ -0,0 +1,96 @@
+part of '../main.dart';
+
+class EntityButtonCard extends StatelessWidget {
+
+  final ButtonCardData card;
+
+  EntityButtonCard({
+    Key key, this.card
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    EntityWrapper entityWrapper = card.entity;
+    if (entityWrapper.entity.statelessType == StatelessEntityType.missed) {
+      return EntityModel(
+        entityWrapper: card.entity,
+        child: MissedEntityWidget(),
+        handleTap: false,
+      );
+    } else if (entityWrapper.entity.statelessType != StatelessEntityType.ghost && entityWrapper.entity.statelessType != StatelessEntityType.none) {
+      return Container(width: 0.0, height: 0.0,);
+    }
+    
+    double iconSize = math.max(card.iconHeightPx, card.iconHeightRem * Theme.of(context).textTheme.body1.fontSize);
+    
+    Widget buttonIcon;
+    if (!card.showIcon) {
+      buttonIcon = Container(height: Sizes.rowPadding, width: 10);
+    } else if (iconSize > 0) {
+      buttonIcon = SizedBox(
+        height: iconSize,
+        child: FractionallySizedBox(
+          widthFactor: 0.5,
+          child: FittedBox(
+            fit: BoxFit.contain,
+            child: EntityIcon(
+              //padding: EdgeInsets.only(top: 6),
+            ),
+          )
+        ),
+      );
+    } else {
+      buttonIcon = AspectRatio(
+        aspectRatio: 2,
+        child: FractionallySizedBox(
+          widthFactor: 0.5,
+          child: FittedBox(
+            fit: BoxFit.fitWidth,
+            child: EntityIcon(
+              //padding: EdgeInsets.only(top: 6),
+            ),
+          )
+        ),
+      );
+    }
+
+    return CardWrapper(
+      child: EntityModel(
+        entityWrapper: card.entity,
+        child: InkWell(
+          onTap: () => entityWrapper.handleTap(),
+          onLongPress: () => entityWrapper.handleHold(),
+          onDoubleTap: () => entityWrapper.handleDoubleTap(),
+          child: Center(
+            child: Padding(
+              padding: EdgeInsets.only(top: 5),
+              child: Column(
+                mainAxisSize: MainAxisSize.min,
+                crossAxisAlignment: CrossAxisAlignment.stretch,
+                children: <Widget>[
+                  buttonIcon,
+                  _buildName(context)
+                ],
+              )
+            )
+          ),
+        ),
+        handleTap: true
+      )
+    );
+  }
+
+  Widget _buildName(BuildContext context) {
+    if (card.showName) {
+      return EntityName(
+        padding: EdgeInsets.fromLTRB(Sizes.buttonPadding, 0.0, Sizes.buttonPadding, Sizes.rowPadding),
+        textOverflow: TextOverflow.ellipsis,
+        maxLines: 3,
+        textStyle: Theme.of(context).textTheme.subhead,
+        wordsWrap: true,
+        textAlign: TextAlign.center
+      );
+    }
+    return Container(width: 0, height: 0);
+  }
+}

lib/cards/error_card.dart

@@ -0,0 +1,38 @@
+part of '../main.dart';
+
+class ErrorCard extends StatelessWidget {
+  final ErrorCardData card;
+
+  const ErrorCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return CardWrapper(
+      child: Padding(
+        padding: EdgeInsets.fromLTRB(Sizes.leftWidgetPadding, Sizes.rowPadding, Sizes.rightWidgetPadding, Sizes.rowPadding),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          crossAxisAlignment: CrossAxisAlignment.center,
+          children: <Widget>[
+            Text(
+              'There was an error rendering card: ${card.type}. Please copy card config to clipboard and report this issue. Thanks!',
+              textAlign: TextAlign.center,
+            ),
+            RaisedButton(
+              onPressed: () {
+                Clipboard.setData(new ClipboardData(text: card.cardConfig));
+              },
+              child: Text('Copy card config'),
+            ),
+            RaisedButton(
+              onPressed: () {
+                Launcher.launchURLInBrowser("https://github.com/estevez-dev/ha_client/issues/new?assignees=&labels=&template=bug_report.md&title=");
+              },
+              child: Text('Report issue'),
+            )
+          ],
+        ),
+      )
+    );
+  }  
+}

lib/cards/gauge_card.dart

@@ -0,0 +1,201 @@
+part of '../main.dart';
+
+class GaugeCard extends StatelessWidget {
+
+  final GaugeCardData card;
+
+  GaugeCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    EntityWrapper entityWrapper = card.entity;
+    if (entityWrapper.entity.statelessType == StatelessEntityType.missed) {
+      return EntityModel(
+        entityWrapper: card.entity,
+        child: MissedEntityWidget(),
+        handleTap: false,
+      );
+    }
+    entityWrapper.overrideName = card.name ??
+        entityWrapper.displayName;
+    entityWrapper.unitOfMeasurementOverride = card.unit ??
+        entityWrapper.unitOfMeasurement;
+    double fixedValue;
+    double value = entityWrapper.entity.doubleState;
+    if (value > card.max) {
+      fixedValue = card.max.toDouble();
+    } else if (value < card.min) {
+      fixedValue = card.min.toDouble();
+    } else {
+      fixedValue = value;
+    }
+    
+    List<GaugeRange> ranges;
+    Color currentColor;
+    if (card.severity != null && card.severity["green"] is int && card.severity["red"] is int && card.severity["yellow"] is int) {
+      List<RangeContainer> rangesList = <RangeContainer>[
+        RangeContainer(card.severity["green"], HAClientTheme().getGreenGaugeColor()),
+        RangeContainer(card.severity["red"], HAClientTheme().getRedGaugeColor()),
+        RangeContainer(card.severity["yellow"], HAClientTheme().getYellowGaugeColor())
+      ];
+      rangesList.sort((current, next) {
+        if (current.startFrom > next.startFrom) {
+          return 1;
+        }
+        if (current.startFrom < next.startFrom) {
+          return -1;
+        }
+        return 0;
+      });
+
+      if (fixedValue < rangesList[1].startFrom) {
+        currentColor = rangesList[0].color;
+      } else if (fixedValue < rangesList[2].startFrom && fixedValue >= rangesList[1].startFrom) {
+        currentColor = rangesList[1].color;
+      } else {
+        currentColor = rangesList[2].color;
+      }
+
+      ranges = [
+        GaugeRange(
+          startValue: rangesList[0].startFrom.toDouble(),
+          endValue: rangesList[1].startFrom.toDouble(),
+          color: rangesList[0].color.withOpacity(0.1),
+          sizeUnit: GaugeSizeUnit.factor,
+          endWidth: 0.3,
+          startWidth: 0.3
+        ),
+        GaugeRange(
+          startValue: rangesList[1].startFrom.toDouble(),
+          endValue: rangesList[2].startFrom.toDouble(),
+          color: rangesList[1].color.withOpacity(0.1),
+          sizeUnit: GaugeSizeUnit.factor,
+          endWidth: 0.3,
+          startWidth: 0.3
+        ),
+        GaugeRange(
+          startValue: rangesList[2].startFrom.toDouble(),
+          endValue: card.max.toDouble(),
+          color: rangesList[2].color.withOpacity(0.1),
+          sizeUnit: GaugeSizeUnit.factor,
+          endWidth: 0.3,
+          startWidth: 0.3
+        )
+      ];
+    }
+    if (ranges == null) {
+      currentColor = Theme.of(context).primaryColorDark;
+      ranges = <GaugeRange>[
+        GaugeRange(
+          startValue: card.min.toDouble(),
+          endValue: card.max.toDouble(),
+          color: Theme.of(context).primaryColorDark.withOpacity(0.1),
+          sizeUnit: GaugeSizeUnit.factor,
+          endWidth: 0.3,
+          startWidth: 0.3,
+        )
+      ];
+    }
+
+    return CardWrapper(
+      padding: EdgeInsets.all(4),
+      child: EntityModel(
+        entityWrapper: entityWrapper,
+        child: InkWell(
+          onTap: () => entityWrapper.handleTap(),
+          onLongPress: () => entityWrapper.handleHold(),
+          onDoubleTap: () => entityWrapper.handleDoubleTap(),
+          child: AspectRatio(
+            aspectRatio: 1.8,
+            child: Stack(
+              alignment: Alignment.bottomCenter,
+              children: <Widget>[
+                IgnorePointer(
+                  ignoring: true,
+                  child: SfRadialGauge(
+                    axes: <RadialAxis>[
+                      RadialAxis(
+                        maximum: card.max.toDouble(),
+                        minimum: card.min.toDouble(),
+                        showLabels: false,
+                        useRangeColorForAxis: true,
+                        showTicks: false,
+                        canScaleToFit: true,
+                        ranges: ranges,
+                        axisLineStyle: AxisLineStyle(
+                          thickness: 0.3,
+                          thicknessUnit: GaugeSizeUnit.factor,
+                          color: Colors.transparent
+                        ),
+                        startAngle: 180,
+                        endAngle: 0,
+                        pointers: <GaugePointer>[
+                          RangePointer(
+                            value: fixedValue,
+                            sizeUnit: GaugeSizeUnit.factor,
+                            width: 0.3,
+                            color: currentColor,
+                            enableAnimation: true,
+                            animationType: AnimationType.bounceOut,
+                          )
+                        ]
+                      )
+                    ],
+                  )
+                ),
+                Column(
+                  mainAxisSize: MainAxisSize.max,
+                  crossAxisAlignment: CrossAxisAlignment.center,
+                  children: <Widget>[
+                    Flexible(
+                      flex: 8,
+                      fit: FlexFit.tight,
+                      child: Container()
+                    ),
+                    Flexible(
+                      flex: 6,
+                      fit: FlexFit.tight,
+                      child: FractionallySizedBox(
+                        widthFactor: 0.4,
+                        child: FittedBox(
+                          fit: BoxFit.contain,
+                          alignment: Alignment.bottomCenter,
+                          child: SimpleEntityState(
+                            padding: EdgeInsets.all(0),
+                            expanded: false,
+                            maxLines: 1,
+                            textAlign: TextAlign.center
+                          ),
+                        )
+                      )
+                    ),
+                    Flexible(
+                      flex: 3,
+                      fit: FlexFit.tight,
+                      child: FittedBox(
+                        fit: BoxFit.contain,
+                        child: EntityName(
+                          padding: EdgeInsets.all(0),
+                          textStyle: Theme.of(context).textTheme.subhead
+                        ),
+                      )
+                    ),  
+                  ],
+                )
+              ],
+            )
+          ),
+        ),
+        handleTap: true
+      )
+    );
+  }
+  
+}
+
+class RangeContainer {
+  final int startFrom;
+  Color color;
+
+  RangeContainer(this.startFrom, this.color);
+}

lib/cards/glance_card.dart

@@ -0,0 +1,126 @@
+part of '../main.dart';
+
+class GlanceCard extends StatelessWidget {
+  final GlanceCardData card;
+
+  const GlanceCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    List<EntityWrapper> entitiesToShow = card.getEntitiesToShow();
+    if (entitiesToShow.isEmpty && !card.showEmpty) {
+      return Container(height: 0.0, width: 0.0,);
+    }
+    int length = entitiesToShow.length;
+    int rowsCount;
+    int columnsCount;
+    if (length == 0) {
+      columnsCount = 0;
+      rowsCount = 0;
+    } else {
+      columnsCount = length >= card.columnsCount ? card.columnsCount : entitiesToShow.length;
+      rowsCount = (length / columnsCount).round();
+    }
+    List<TableRow> rows = [];
+    for (int i = 0; i < rowsCount; i++) {
+      int start = i*columnsCount;
+      int end = start + math.min(columnsCount, length - start);
+      List<Widget> rowChildren = [];
+      rowChildren.addAll(entitiesToShow.sublist(
+          start, end
+        ).map(
+          (EntityWrapper entity){
+            return Padding(
+              padding: EdgeInsets.symmetric(vertical: Sizes.rowPadding),
+              child: EntityModel(
+                entityWrapper: entity,
+                child: _buildEntityContainer(context, entity),
+                handleTap: true
+              )
+            );
+          }
+        ).toList()
+      );
+      while (rowChildren.length < columnsCount) {
+        rowChildren.add(
+          Container()
+        );
+      }
+      rows.add(
+        TableRow(
+          children: rowChildren
+        )
+      );
+    }
+    return CardWrapper(
+      child: Center(
+        child: Padding(
+          padding: EdgeInsets.only(bottom: Sizes.rowPadding),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: <Widget>[
+              CardHeader(
+                name: card.title,
+                emptyPadding: Sizes.rowPadding,
+              ),
+              Table(
+                children: rows
+              )
+            ],
+          )
+        )
+      )
+    );
+  }
+
+  Widget _buildEntityContainer(BuildContext context, EntityWrapper entityWrapper) {
+    if (entityWrapper.entity.statelessType == StatelessEntityType.missed) {
+      return MissedEntityWidget();
+    } else if (entityWrapper.entity.statelessType != StatelessEntityType.none) {
+      return Container(width: 0.0, height: 0.0,);
+    }
+    List<Widget> result = [];
+    if (card.showName) {
+      result.add(_buildName(context));
+    }
+    result.add(
+        EntityIcon(
+          padding: EdgeInsets.all(0.0),
+          size: Sizes.iconSize,
+        )
+    );
+    if (card.showState) {
+      result.add(_buildState());
+    }
+
+    return InkResponse(
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: result,
+      ),
+      onTap: () => entityWrapper.handleTap(),
+      onLongPress: () => entityWrapper.handleHold(),
+      onDoubleTap: () => entityWrapper.handleDoubleTap(),
+    );
+  }
+
+  Widget _buildName(BuildContext context) {
+    return EntityName(
+      padding: EdgeInsets.only(bottom: Sizes.rowPadding),
+      textOverflow: TextOverflow.ellipsis,
+      wordsWrap: false,
+      textAlign: TextAlign.center,
+      textStyle: Theme.of(context).textTheme.body1,
+    );
+  }
+
+  Widget _buildState() {
+    return SimpleEntityState(
+      textAlign: TextAlign.center,
+      expanded: false,
+      maxLines: 1,
+      padding: EdgeInsets.only(top: Sizes.rowPadding),
+    );
+  }
+
+}

lib/cards/horizontal_srack_card.dart

@@ -0,0 +1,30 @@
+part of '../main.dart';
+
+class HorizontalStackCard extends StatelessWidget {
+  final HorizontalStackCardData card;
+
+  const HorizontalStackCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    if (card.childCards.isNotEmpty) {
+      List<Widget> children = [];
+      children = card.childCards.map((childCard) => Flexible(
+          fit: FlexFit.tight,
+          child: childCard.buildCardWidget()
+        )
+      ).toList();
+      return IntrinsicHeight(
+        child: Row(
+          mainAxisSize: MainAxisSize.max,
+          mainAxisAlignment: MainAxisAlignment.center,
+          crossAxisAlignment: CrossAxisAlignment.stretch,
+          children: children,
+        ),
+      );
+    }
+    return Container(height: 0.0, width: 0.0,);
+  }
+
+  
+}

lib/cards/markdown_card.dart

@@ -0,0 +1,33 @@
+part of '../main.dart';
+
+class MarkdownCard extends StatelessWidget {
+  final MarkdownCardData card;
+
+  const MarkdownCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    if (card.content == null) {
+      return Container(height: 0.0, width: 0.0,);
+    } else if (card.content == '***') {
+      return Container(height: Sizes.rowPadding, width: 0.0,);
+    }
+    return CardWrapper(
+        child: Padding(
+          padding: EdgeInsets.fromLTRB(Sizes.leftWidgetPadding, Sizes.rowPadding, Sizes.rightWidgetPadding, Sizes.rowPadding),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            crossAxisAlignment: CrossAxisAlignment.stretch,
+            children: <Widget>[
+              CardHeader(name: card.title),
+              MarkdownBody(
+                data: card.content,
+              )
+            ],
+          ),
+        )
+    );
+  }
+
+  
+}

lib/cards/media_control_card.dart

@@ -0,0 +1,35 @@
+part of '../main.dart';
+
+class MediaControlsCard extends StatelessWidget {
+  final MediaControlCardData card;
+
+  const MediaControlsCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    if (card.entity.entity.statelessType == StatelessEntityType.missed) {
+      return EntityModel(
+        entityWrapper: card.entity,
+        child: MissedEntityWidget(),
+        handleTap: false,
+      );
+    } else if (card.entity.entity.domain == null || card.entity.entity.domain != 'media_player') {
+      return EntityModel(
+        entityWrapper: card.entity,
+        child: ErrorEntityWidget(
+          text: '${card.entity.entity?.entityId} is not a media_player',
+        ),
+        handleTap: false,
+      );
+    }
+    return CardWrapper(
+        child: EntityModel(
+            entityWrapper: card.entity,
+            handleTap: null,
+            child: MediaPlayerWidget()
+        )
+    );
+  }
+
+  
+}

lib/cards/unsupported_card.dart

@@ -0,0 +1,12 @@
+part of '../main.dart';
+
+class UnsupportedCard extends StatelessWidget {
+  final CardData card;
+
+  const UnsupportedCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container();
+  }  
+}

lib/cards/vertical_stack_card.dart

@@ -0,0 +1,23 @@
+part of '../main.dart';
+
+class VerticalStackCard extends StatelessWidget {
+  final VerticalStackCardData card;
+
+  const VerticalStackCard({Key key, this.card}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    if (card.childCards.isNotEmpty) {
+      return Column(
+        mainAxisSize: MainAxisSize.min,
+        mainAxisAlignment: MainAxisAlignment.start,
+        children: card.childCards.map<Widget>(
+          (childCard) => childCard.buildCardWidget()
+        ).toList(),
+      );
+    }
+    return Container(height: 0.0, width: 0.0,);
+  }
+
+  
+}

lib/cards/widgets/card_header.widget.dart

@@ -1,12 +1,14 @@
-part of '../main.dart';
+part of '../../main.dart';
 
-class CardHeaderWidget extends StatelessWidget {
+class CardHeader extends StatelessWidget {
 
   final String name;
   final Widget trailing;
+  final Widget leading;
   final Widget subtitle;
+  final double emptyPadding;
 
-  const CardHeaderWidget({Key key, this.name, this.trailing, this.subtitle}) : super(key: key);
+  const CardHeader({Key key, this.name, this.leading, this.emptyPadding: 0, this.trailing, this.subtitle}) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -14,14 +16,15 @@ class CardHeaderWidget extends StatelessWidget {
     if ((name != null) && (name.trim().length > 0)) {
       result = new ListTile(
         trailing: trailing,
+        leading: leading,
         subtitle: subtitle,
         title: Text("$name",
             textAlign: TextAlign.left,
             overflow: TextOverflow.ellipsis,
-            style: new TextStyle(fontWeight: FontWeight.bold, fontSize: Sizes.largeFontSize)),
+            style: Theme.of(context).textTheme.headline),
       );
     } else {
-      result = new Container(width: 0.0, height: 0.0);
+      result = new Container(width: 0.0, height: emptyPadding);
     }
     return result;
   }

lib/cards/widgets/card_wrapper.widget.dart

@@ -0,0 +1,21 @@
+part of '../../main.dart';
+
+class CardWrapper extends StatelessWidget {
+  
+  final Widget child;
+  final EdgeInsets padding;
+
+  const CardWrapper({Key key, this.child, this.padding: const EdgeInsets.all(0)}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      child: Padding(
+        padding: padding,
+        child: child
+      ),
+    );
+  }
+
+
+}

lib/const.dart

@@ -29,71 +29,59 @@ class EntityState {
   static const ok = 'ok';
   static const problem = 'problem';
   static const active = 'active';
-}
+  static const cleaning = 'cleaning';
-
+  static const docked = 'docked';
-class EntityUIAction {
+  static const returning = 'returning';
-  static const moreInfo = 'more-info';
+  static const error = 'error';
-  static const toggle = 'toggle';
-  static const callService = 'call-service';
-  static const navigate = 'navigate';
-  static const none = 'none';
-
-  String tapAction = EntityUIAction.moreInfo;
-  String tapNavigationPath;
-  String tapService;
-  Map<String, dynamic> tapServiceData;
-  String holdAction = EntityUIAction.none;
-  String holdNavigationPath;
-  String holdService;
-  Map<String, dynamic> holdServiceData;
-
-  EntityUIAction({rawEntityData}) {
-    if (rawEntityData != null) {
-      if (rawEntityData["tap_action"] != null) {
-        if (rawEntityData["tap_action"] is String) {
-          tapAction = rawEntityData["tap_action"];
-        } else {
-          tapAction =
-              rawEntityData["tap_action"]["action"] ?? EntityUIAction.moreInfo;
-          tapNavigationPath = rawEntityData["tap_action"]["navigation_path"];
-          tapService = rawEntityData["tap_action"]["service"];
-          tapServiceData = rawEntityData["tap_action"]["service_data"];
-        }
-      }
-      if (rawEntityData["hold_action"] != null) {
-        if (rawEntityData["hold_action"] is String) {
-          holdAction = rawEntityData["hold_action"];
-        } else {
-          holdAction =
-              rawEntityData["hold_action"]["action"] ?? EntityUIAction.none;
-          holdNavigationPath = rawEntityData["hold_action"]["navigation_path"];
-          holdService = rawEntityData["hold_action"]["service"];
-          holdServiceData = rawEntityData["hold_action"]["service_data"];
-        }
-      }
-    }
-  }
 
 }
 
 class CardType {
-  static const horizontalStack = "horizontal-stack";
+  static const HORIZONTAL_STACK = "horizontal-stack";
-  static const verticalStack = "vertical-stack";
+  static const VERTICAL_STACK = "vertical-stack";
-  static const entities = "entities";
+  static const ENTITIES = "entities";
-  static const glance = "glance";
+  static const GLANCE = "glance";
-  static const mediaControl = "media-control";
+  static const MEDIA_CONTROL = "media-control";
-  static const weatherForecast = "weather-forecast";
+  static const WEATHER_FORECAST = "weather-forecast";
-  static const thermostat = "thermostat";
+  static const THERMOSTAT = "thermostat";
-  static const sensor = "sensor";
+  static const SENSOR = "sensor";
-  static const plantStatus = "plant-status";
+  static const PLANT_STATUS = "plant-status";
-  static const pictureEntity = "picture-entity";
+  static const PICTURE_ENTITY = "picture-entity";
-  static const pictureElements = "picture-elements";
+  static const PICTURE_ELEMENTS = "picture-elements";
-  static const picture = "picture";
+  static const PICTURE = "picture";
-  static const map = "map";
+  static const MAP = "map";
-  static const iframe = "iframe";
+  static const IFRAME = "iframe";
-  static const gauge = "gauge";
+  static const GAUGE = "gauge";
-  static const entityButton = "entity-button";
+  static const ENTITY_BUTTON = "entity-button";
-  static const conditional = "conditional";
+  static const ENTITY = "entity";
-  static const alarmPanel = "alarm-panel";
+  static const BUTTON = "button";
-  static const markdown = "markdown";
+  static const CONDITIONAL = "conditional";
+  static const ALARM_PANEL = "alarm-panel";
+  static const MARKDOWN = "markdown";
+  static const LIGHT = "light";
+  static const ENTITY_FILTER = "entity-filter";
+  static const UNKNOWN = "unknown";
+  static const HISTORY_GRAPH = "history-graph";
+  static const PICTURE_GLANCE = "picture-glance";
+  static const BADGES = "badges";
+}
+
+class Sizes {
+  static const rightWidgetPadding = 10.0;
+  static const leftWidgetPadding = 10.0;
+  static const buttonPadding = 4.0;
+  static const extendedWidgetHeight = 50.0;
+  static const iconSize = 28.0;
+  static const largeIconSize = 46.0;
+  //static const stateFontSize = 15.0;
+  //static const nameFontSize = 15.0;
+  //static const smallFontSize = 14.0;
+  //static const largeFontSize = 24.0;
+  static const inputWidth = 160.0;
+  static const rowPadding = 10.0;
+  static const doubleRowPadding = rowPadding*2;
+  static const minViewColumnWidth = 350;
+  static const entityPageMaxWidth = 400.0;
+  static const mainPageScreenSeparatorWidth = 5.0;
+  static const tabletMinWidth = minViewColumnWidth + entityPageMaxWidth + 5;
 }

lib/entities/alarm_control_panel/widgets/alarm_control_panel_controls.widget.dart

@@ -25,9 +25,12 @@ class _AlarmControlPanelControlsWidgetWidgetState extends State<AlarmControlPane
 
 
   void _callService(AlarmControlPanelEntity entity, String service) {
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-          entity.domain, service, entity.entityId,
+      domain: entity.domain,
-          {"code": "$code"}));
+      service: service,
+      entityId: entity.entityId,
+      data: {"code": "$code"}
+    );
     setState(() {
       code = "";
     });
@@ -58,7 +61,11 @@ class _AlarmControlPanelControlsWidgetWidgetState extends State<AlarmControlPane
             FlatButton(
               child: new Text("Yes"),
               onPressed: () {
-                eventBus.fire(new ServiceCallEvent(entity.domain, "alarm_trigger", entity.entityId, null));
+                ConnectionManager().callService(
+                  domain: entity.domain,
+                  service: "alarm_trigger",
+                  entityId: entity.entityId
+                );
                 Navigator.of(context).pop();
               },
             ),
@@ -241,7 +248,9 @@ class _AlarmControlPanelControlsWidgetWidgetState extends State<AlarmControlPane
         FlatButton(
           child: Text(
             "TRIGGER",
-            style: TextStyle(color: Colors.redAccent)
+            style: Theme.of(context).textTheme.subhead.copyWith(
+              color: Theme.of(context).errorColor
+            )
           ),
           onPressed: () => _askToTrigger(entity),
         )

lib/entities/camera/camera_entity.class.dart

@@ -3,12 +3,16 @@ part of '../../main.dart';
 class CameraEntity extends Entity {
 
   static const SUPPORT_ON_OFF = 1;
+  static const SUPPORT_STREAM = 2;
 
   CameraEntity(Map rawData, String webHost) : super(rawData, webHost);
 
   bool get supportOnOff => ((supportedFeatures &
   CameraEntity.SUPPORT_ON_OFF) ==
       CameraEntity.SUPPORT_ON_OFF);
+  bool get supportStream => ((supportedFeatures &
+  CameraEntity.SUPPORT_STREAM) ==
+      CameraEntity.SUPPORT_STREAM);
 
   @override
   Widget _buildAdditionalControlsForPage(BuildContext context) {

lib/entities/camera/widgets/camera_stream_view.dart

@@ -0,0 +1,190 @@
+part of '../../../main.dart';
+
+class CameraStreamView extends StatefulWidget {
+
+  final bool withControls;
+
+  CameraStreamView({Key key, this.withControls: true}) : super(key: key);
+
+  @override
+  _CameraStreamViewState createState() => _CameraStreamViewState();
+}
+
+class _CameraStreamViewState extends State<CameraStreamView> {
+
+  CameraEntity _entity;
+  String _streamUrl = "";
+  bool _isLoaded = false;
+  double _aspectRatio = 1.33;
+  String _webViewHtml;
+  String _jsMessageChannelName = 'unknown';
+  Completer _loading;
+
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  Future _loadResources() {
+    if (_loading != null && !_loading.isCompleted) {
+      Logger.d("[Camera Player] Resources loading is not finished yet");
+      return _loading.future;  
+    }
+    Logger.d("[Camera Player] Loading resources");
+    _loading = Completer();
+    _entity = EntityModel
+          .of(context)
+          .entityWrapper
+          .entity;
+    if (_entity.supportStream && HomeAssistant().isComponentEnabled('stream')) {
+      HomeAssistant().getCameraStream(_entity.entityId)
+        .then((data) {
+          _jsMessageChannelName = 'HA_${_entity.entityId.replaceAll('.', '_')}';
+            rootBundle.loadString('assets/html/cameraLiveView.html').then((file) {
+              _webViewHtml = Uri.dataFromString(
+                  file.replaceFirst('{{stream_url}}', '${ConnectionManager().httpWebHost}${data["url"]}').replaceFirst('{{message_channel}}', _jsMessageChannelName),
+                  mimeType: 'text/html',
+                  encoding: Encoding.getByName('utf-8')
+              ).toString();
+              _loading.complete();
+            });
+        })
+        .catchError((e) {
+          if (e == 'start_stream_failed') {
+            Logger.e("[Camera Player] Home Assistant failed starting stream. Forcing MJPEG: $e");
+            _loadMJPEG().then((_) {
+              _loading.complete();
+            });
+          } else {
+            _loading.completeError(e);
+            Logger.e("[Camera Player] Error loading stream: $e");
+          }
+        });
+    } else {
+      _loadMJPEG().then((_) {
+        _loading.complete();
+      });
+    }
+    return _loading.future;
+  }
+
+  Future _loadMJPEG() async {
+    _streamUrl = '${ConnectionManager().httpWebHost}/api/camera_proxy_stream/${_entity
+        .entityId}?token=${_entity.attributes['access_token']}';
+    _jsMessageChannelName = 'HA_${_entity.entityId.replaceAll('.', '_')}';
+    var file = await rootBundle.loadString('assets/html/cameraView.html');
+    _webViewHtml = Uri.dataFromString(
+        file.replaceFirst('{{stream_url}}', _streamUrl).replaceFirst('{{message_channel}}', _jsMessageChannelName),
+        mimeType: 'text/html',
+        encoding: Encoding.getByName('utf-8')
+    ).toString();
+  }
+
+  Widget _buildScreen() {
+    Widget screenWidget;
+    if (!_isLoaded) {
+      screenWidget = Center(
+        child: EntityPicture(
+          fit: BoxFit.contain,
+        )
+      );
+    } else {
+      screenWidget = WebView(
+        initialUrl: _webViewHtml,
+        initialMediaPlaybackPolicy: AutoMediaPlaybackPolicy.always_allow,
+        debuggingEnabled: Logger.isInDebugMode,
+        gestureNavigationEnabled: false,
+        javascriptMode: JavascriptMode.unrestricted,
+        javascriptChannels: {
+          JavascriptChannel(
+            name: _jsMessageChannelName,
+            onMessageReceived: ((message) {
+              Logger.d('[Camera Player] Message from page: $message');
+              setState((){
+                _aspectRatio = double.tryParse(message.message) ?? 1.33;
+              });
+            })
+          )
+        }
+      );
+    }
+    return AspectRatio(
+      aspectRatio: _aspectRatio,
+      child: screenWidget
+    );
+  }
+
+  Widget _buildControls() {
+      return Row(
+        mainAxisSize: MainAxisSize.max,
+        crossAxisAlignment: CrossAxisAlignment.center,
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: <Widget>[
+          IconButton(
+            icon: Icon(Icons.refresh),
+            iconSize: 40,
+            color: Theme.of(context).accentColor,
+            onPressed: _isLoaded ? () {
+              setState(() {
+                _isLoaded = false;  
+              });
+            } : null,
+          ),
+          Expanded(
+            child: Container(),
+          ),
+          IconButton(
+            icon: Icon(Icons.fullscreen),
+            iconSize: 40,
+            color: Theme.of(context).accentColor,
+            onPressed: _isLoaded ? () {
+              Navigator.of(context).pushReplacement(
+                MaterialPageRoute(
+                  builder: (conext) => FullScreenPage(
+                    child: EntityModel(
+                      child: CameraStreamView(
+                        withControls: false
+                      ),
+                      handleTap: false,
+                      entityWrapper: EntityWrapper(
+                        entity: _entity
+                      ),
+                    ),
+                  ),
+                  fullscreenDialog: true
+                )
+              ).then((_){
+                eventBus.fire(ShowEntityPageEvent(entityId: _entity.entityId));
+              });
+            } : null,
+          )
+        ],
+      );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    if (!_isLoaded && (_loading == null || _loading.isCompleted)) {
+      _loadResources().then((_) => setState((){ _isLoaded = true; }));
+    }
+    if (widget.withControls) {
+      return Card(
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: <Widget>[
+            _buildScreen(),
+            _buildControls()
+          ],
+        ),
+      );
+    } else {
+      return _buildScreen();
+    }
+    
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+  }
+}

lib/entities/climate/widgets/climate_controls.dart

@@ -10,9 +10,8 @@ class ClimateControlWidget extends StatefulWidget {
 
 class _ClimateControlWidgetState extends State<ClimateControlWidget> {
 
-  bool _showPending = false;
+  bool _temperaturePending = false;
   bool _changedHere = false;
-  Timer _resetTimer;
   Timer _tempThrottleTimer;
   Timer _targetTempThrottleTimer;
   double _tmpTemperature = 0.0;
@@ -27,9 +26,11 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
   bool _tmpAuxHeat = false;
 
   void _resetVars(ClimateEntity entity) {
-    _tmpTemperature = entity.temperature;
+    if (!_temperaturePending) {
-    _tmpTargetHigh = entity.targetHigh;
+      _tmpTemperature = entity.temperature;
-    _tmpTargetLow = entity.targetLow;
+      _tmpTargetHigh = entity.targetHigh;
+      _tmpTargetLow = entity.targetLow;
+    }
     _tmpHVACMode = entity.state;
     _tmpFanMode = entity.fanMode;
     _tmpSwingMode = entity.swingMode;
@@ -38,7 +39,6 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     _tmpAuxHeat = entity.auxHeat;
     _tmpTargetHumidity = entity.targetHumidity;
 
-    _showPending = false;
     _changedHere = false;
   }
 
@@ -73,36 +73,44 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
   }
 
   void _setTemperature(ClimateEntity entity) {
-    if (_tempThrottleTimer!=null) {
+    _tempThrottleTimer?.cancel();
-      _tempThrottleTimer.cancel();
-    }
     setState(() {
       _changedHere = true;
+      _temperaturePending = true;
       _tmpTemperature = double.parse(_tmpTemperature.toStringAsFixed(1));
     });
     _tempThrottleTimer = Timer(Duration(seconds: 2), () {
       setState(() {
         _changedHere = true;
-        eventBus.fire(new ServiceCallEvent(entity.domain, "set_temperature", entity.entityId,{"temperature": "${_tmpTemperature.toStringAsFixed(1)}"}));
+        _temperaturePending = false;
-        _resetStateTimer(entity);
+        ConnectionManager().callService(
+          domain: entity.domain,
+          service: "set_temperature",
+          entityId: entity.entityId,
+          data: {"temperature": "${_tmpTemperature.toStringAsFixed(1)}"}
+        );
       });
     });
   }
 
   void _setTargetTemp(ClimateEntity entity) {
-    if (_targetTempThrottleTimer!=null) {
+    _targetTempThrottleTimer?.cancel();
-      _targetTempThrottleTimer.cancel();
-    }
     setState(() {
       _changedHere = true;
+      _temperaturePending = true;
       _tmpTargetLow = double.parse(_tmpTargetLow.toStringAsFixed(1));
       _tmpTargetHigh = double.parse(_tmpTargetHigh.toStringAsFixed(1));
     });
     _targetTempThrottleTimer = Timer(Duration(seconds: 2), () {
       setState(() {
         _changedHere = true;
-        eventBus.fire(new ServiceCallEvent(entity.domain, "set_temperature", entity.entityId,{"target_temp_high": "${_tmpTargetHigh.toStringAsFixed(1)}", "target_temp_low": "${_tmpTargetLow.toStringAsFixed(1)}"}));
+        _temperaturePending = false;
-        _resetStateTimer(entity);
+        ConnectionManager().callService(
+          domain: entity.domain,
+          service: "set_temperature",
+          entityId: entity.entityId,
+          data: {"target_temp_high": "${_tmpTargetHigh.toStringAsFixed(1)}", "target_temp_low": "${_tmpTargetLow.toStringAsFixed(1)}"}
+        );
       });
     });
   }
@@ -111,8 +119,12 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     setState(() {
       _tmpTargetHumidity = value.roundToDouble();
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_humidity", entity.entityId,{"humidity": "$_tmpTargetHumidity"}));
+      ConnectionManager().callService(
-      _resetStateTimer(entity);
+          domain: entity.domain,
+          service: "set_humidity",
+          entityId: entity.entityId,
+          data: {"humidity": "$_tmpTargetHumidity"}
+        );
     });
   }
 
@@ -120,8 +132,12 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     setState(() {
       _tmpHVACMode = value;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_hvac_mode", entity.entityId,{"hvac_mode": "$_tmpHVACMode"}));
+      ConnectionManager().callService(
-      _resetStateTimer(entity);
+          domain: entity.domain,
+          service: "set_hvac_mode",
+          entityId: entity.entityId,
+          data: {"hvac_mode": "$_tmpHVACMode"}
+        );
     });
   }
 
@@ -129,8 +145,12 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     setState(() {
       _tmpSwingMode = value;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_swing_mode", entity.entityId,{"swing_mode": "$_tmpSwingMode"}));
+      ConnectionManager().callService(
-      _resetStateTimer(entity);
+          domain: entity.domain,
+          service: "set_swing_mode",
+          entityId: entity.entityId,
+          data: {"swing_mode": "$_tmpSwingMode"}
+        );
     });
   }
 
@@ -138,8 +158,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     setState(() {
       _tmpFanMode = value;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_fan_mode", entity.entityId,{"fan_mode": "$_tmpFanMode"}));
+      ConnectionManager().callService(domain: entity.domain, service: "set_fan_mode", entityId: entity.entityId, data: {"fan_mode": "$_tmpFanMode"});
-      _resetStateTimer(entity);
     });
   }
 
@@ -147,8 +166,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     setState(() {
       _tmpPresetMode = value;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_preset_mode", entity.entityId,{"preset_mode": "$_tmpPresetMode"}));
+      ConnectionManager().callService(domain: entity.domain, service: "set_preset_mode", entityId: entity.entityId, data: {"preset_mode": "$_tmpPresetMode"});
-      _resetStateTimer(entity);
     });
   }
 
@@ -165,18 +183,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     setState(() {
       _tmpAuxHeat = value;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_aux_heat", entity.entityId, {"aux_heat": "$_tmpAuxHeat"}));
+      ConnectionManager().callService(domain: entity.domain, service: "set_aux_heat", entityId: entity.entityId, data: {"aux_heat": "$_tmpAuxHeat"});
-      _resetStateTimer(entity);
-    });
-  }
-
-  void _resetStateTimer(ClimateEntity entity) {
-    if (_resetTimer!=null) {
-      _resetTimer.cancel();
-    }
-    _resetTimer = Timer(Duration(seconds: 3), () {
-      setState(() {});
-      _resetVars(entity);
     });
   }
 
@@ -185,10 +192,9 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     final entityModel = EntityModel.of(context);
     final ClimateEntity entity = entityModel.entityWrapper.entity;
     if (_changedHere) {
-      _showPending = (_tmpTemperature != entity.temperature || _tmpTargetHigh != entity.targetHigh || _tmpTargetLow != entity.targetLow);
+      //_showPending = (_tmpTemperature != entity.temperature || _tmpTargetHigh != entity.targetHigh || _tmpTargetLow != entity.targetLow);
       _changedHere = false;
     } else {
-      _resetTimer?.cancel();
       _resetVars(entity);
     }
     return Padding(
@@ -197,20 +203,20 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
         crossAxisAlignment: CrossAxisAlignment.start,
         children: <Widget>[
           //_buildOnOffControl(entity),
-          _buildTemperatureControls(entity),
+          _buildTemperatureControls(entity, context),
-          _buildTargetTemperatureControls(entity),
+          _buildTargetTemperatureControls(entity, context),
-          _buildHumidityControls(entity),
+          _buildHumidityControls(entity, context),
-          _buildOperationControl(entity),
+          _buildOperationControl(entity, context),
-          _buildFanControl(entity),
+          _buildFanControl(entity, context),
-          _buildSwingControl(entity),
+          _buildSwingControl(entity, context),
-          _buildPresetModeControl(entity),
+          _buildPresetModeControl(entity, context),
-          _buildAuxHeatControl(entity)
+          _buildAuxHeatControl(entity, context)
         ],
       ),
     );
   }
 
-  Widget _buildPresetModeControl(ClimateEntity entity) {
+  Widget _buildPresetModeControl(ClimateEntity entity, BuildContext context) {
     if (entity.supportPresetMode) {
       return ModeSelectorWidget(
         options: entity.presetModes,
@@ -235,7 +241,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     }
   }*/
 
-  Widget _buildAuxHeatControl(ClimateEntity entity) {
+  Widget _buildAuxHeatControl(ClimateEntity entity, BuildContext context) {
     if (entity.supportAuxHeat ) {
       return ModeSwitchWidget(
           caption: "Aux heat",
@@ -247,7 +253,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     }
   }
 
-  Widget _buildOperationControl(ClimateEntity entity) {
+  Widget _buildOperationControl(ClimateEntity entity, BuildContext context) {
     if (entity.hvacModes != null) {
       return ModeSelectorWidget(
         onChange: (mode) => _setHVACMode(entity, mode),
@@ -260,7 +266,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     }
   }
 
-  Widget _buildFanControl(ClimateEntity entity) {
+  Widget _buildFanControl(ClimateEntity entity, BuildContext context) {
     if (entity.supportFanMode) {
       return ModeSelectorWidget(
         options: entity.fanModes,
@@ -273,7 +279,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     }
   }
 
-  Widget _buildSwingControl(ClimateEntity entity) {
+  Widget _buildSwingControl(ClimateEntity entity, BuildContext context) {
     if (entity.supportSwingMode) {
       return ModeSelectorWidget(
           onChange: (mode) => _setSwingMode(entity, mode),
@@ -286,17 +292,15 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     }
   }
 
-  Widget _buildTemperatureControls(ClimateEntity entity) {
+  Widget _buildTemperatureControls(ClimateEntity entity, BuildContext context) {
     if ((entity.supportTargetTemperature) && (entity.temperature != null)) {
       return Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: <Widget>[
-          Text("Target temperature", style: TextStyle(
+          Text("Target temperature", style: Theme.of(context).textTheme.body1),
-              fontSize: Sizes.stateFontSize
-          )),
           TemperatureControlWidget(
             value: _tmpTemperature,
-            fontColor: _showPending ? Colors.red : Colors.black,
+            active: _temperaturePending,
             onDec: () => _temperatureDown(entity),
             onInc: () => _temperatureUp(entity),
           )
@@ -307,13 +311,13 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     }
   }
 
-  Widget _buildTargetTemperatureControls(ClimateEntity entity) {
+  Widget _buildTargetTemperatureControls(ClimateEntity entity, BuildContext context) {
     List<Widget> controls = [];
     if ((entity.supportTargetTemperatureRange) && (entity.targetLow != null)) {
       controls.addAll(<Widget>[
         TemperatureControlWidget(
           value: _tmpTargetLow,
-          fontColor: _showPending ? Colors.red : Colors.black,
+          active: _temperaturePending,
           onDec: () => _targetLowDown(entity),
           onInc: () => _targetLowUp(entity),
         ),
@@ -326,7 +330,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
       controls.add(
           TemperatureControlWidget(
             value: _tmpTargetHigh,
-            fontColor: _showPending ? Colors.red : Colors.black,
+            active: _temperaturePending,
             onDec: () => _targetHighDown(entity),
             onInc: () => _targetHighUp(entity),
           )
@@ -336,9 +340,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
       return Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: <Widget>[
-          Text("Target temperature range", style: TextStyle(
+          Text("Target temperature range", style: Theme.of(context).textTheme.body1),
-              fontSize: Sizes.stateFontSize
-          )),
           Row(
             children: controls,
           )
@@ -349,16 +351,20 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
     }
   }
 
-  Widget _buildHumidityControls(ClimateEntity entity) {
+  Widget _buildHumidityControls(ClimateEntity entity, BuildContext context) {
-    List<Widget> result = [];
     if (entity.supportTargetHumidity) {
-      result.addAll(<Widget>[
+      return Column(
-        Text(
+        crossAxisAlignment: CrossAxisAlignment.start,
-          "$_tmpTargetHumidity%",
+        children: <Widget>[
-          style: TextStyle(fontSize: Sizes.largeFontSize),
+          Padding(
-        ),
+            padding: EdgeInsets.only(top: Sizes.rowPadding),
-        Expanded(
+            child: Text("Target humidity", style: Theme.of(context).textTheme.body1),
-          child: Slider(
+          ),
+          UniversalSlider(
+            leading: Text(
+              "$_tmpTargetHumidity%",
+              style: Theme.of(context).textTheme.display1,
+            ),
             value: _tmpTargetHumidity,
             max: entity.maxHumidity,
             min: entity.minHumidity,
@@ -370,24 +376,6 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
             }),
             onChangeEnd: (double v) => _setTargetHumidity(entity, v),
           ),
-        )
-      ]);
-    }
-    if (result.isNotEmpty) {
-      return Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: <Widget>[
-          Padding(
-            padding: EdgeInsets.fromLTRB(
-                0.0, Sizes.rowPadding, 0.0, Sizes.rowPadding),
-            child: Text("Target humidity", style: TextStyle(
-                fontSize: Sizes.stateFontSize
-            )),
-          ),
-          Row(
-            crossAxisAlignment: CrossAxisAlignment.center,
-            children: result,
-          ),
           Container(
             height: Sizes.rowPadding,
           )
@@ -404,57 +392,7 @@ class _ClimateControlWidgetState extends State<ClimateControlWidget> {
 
   @override
   void dispose() {
-    _resetTimer?.cancel();
     super.dispose();
   }
 
 }
-
-class TemperatureControlWidget extends StatelessWidget {
-  final double value;
-  final double fontSize;
-  final Color fontColor;
-  final onInc;
-  final onDec;
-
-  TemperatureControlWidget(
-      {Key key,
-        @required this.value,
-        @required this.onInc,
-        @required this.onDec,
-        this.fontSize,
-        this.fontColor})
-      : super(key: key);
-
-  @override
-  Widget build(BuildContext context) {
-    return Row(
-      crossAxisAlignment: CrossAxisAlignment.center,
-      children: <Widget>[
-        Text(
-          "$value",
-          style: TextStyle(
-              fontSize: fontSize ?? 24.0,
-              color: fontColor ?? Colors.black
-          ),
-        ),
-        Column(
-          children: <Widget>[
-            IconButton(
-              icon: Icon(MaterialDesignIcons.getIconDataFromIconName(
-                  'mdi:chevron-up')),
-              iconSize: 30.0,
-              onPressed: () => onInc(),
-            ),
-            IconButton(
-              icon: Icon(MaterialDesignIcons.getIconDataFromIconName(
-                  'mdi:chevron-down')),
-              iconSize: 30.0,
-              onPressed: () => onDec(),
-            )
-          ],
-        )
-      ],
-    );
-  }
-}

lib/entities/climate/widgets/climate_state.widget.dart

@@ -33,23 +33,16 @@ class ClimateStateWidget extends StatelessWidget {
               children: <Widget>[
                 Text("$displayState",
                     textAlign: TextAlign.right,
-                    style: new TextStyle(
+                    style: Theme.of(context).textTheme.body2),
-                      fontWeight: FontWeight.bold,
-                      fontSize: Sizes.stateFontSize,
-                    )),
                 Text(" $targetTemp",
                     textAlign: TextAlign.right,
-                    style: new TextStyle(
+                    style: Theme.of(context).textTheme.body1)
-                      fontSize: Sizes.stateFontSize,
-                    ))
               ],
             ),
             entity.currentTemperature != null ?
             Text("Currently: ${entity.currentTemperature}",
                 textAlign: TextAlign.right,
-                style: new TextStyle(
+                style: Theme.of(context).textTheme.subtitle
-                    fontSize: Sizes.stateFontSize,
-                    color: Colors.black45)
             ) :
             Container(height: 0.0,)
           ],

lib/entities/climate/widgets/mode_selector.dart

@@ -1,23 +1,19 @@
-part of '../../main.dart';
+part of '../../../main.dart';
 
 class ModeSelectorWidget extends StatelessWidget {
 
   final String caption;
-  final List<String> options;
+  final List options;
   final String value;
-  final double captionFontSize;
-  final double valueFontSize;
   final onChange;
   final EdgeInsets padding;
 
   ModeSelectorWidget({
     Key key,
     @required this.caption,
-    @required this.options,
+    this.options: const [],
     this.value,
     @required this.onChange,
-    this.captionFontSize,
-    this.valueFontSize,
     this.padding: const EdgeInsets.fromLTRB(Sizes.leftWidgetPadding, Sizes.rowPadding, Sizes.rightWidgetPadding, 0.0),
   }) : super(key: key);
 
@@ -28,9 +24,7 @@ class ModeSelectorWidget extends StatelessWidget {
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: <Widget>[
-          Text("$caption", style: TextStyle(
+          Text("$caption", style: Theme.of(context).textTheme.body1),
-              fontSize: captionFontSize ?? Sizes.stateFontSize
-          )),
           Row(
             children: <Widget>[
               Expanded(
@@ -40,15 +34,12 @@ class ModeSelectorWidget extends StatelessWidget {
                     value: value,
                     iconSize: 30.0,
                     isExpanded: true,
-                    style: TextStyle(
+                    style: Theme.of(context).textTheme.title,
-                      fontSize: valueFontSize ?? Sizes.largeFontSize,
-                      color: Colors.black,
-                    ),
                     hint: Text("Select ${caption.toLowerCase()}"),
-                    items: options.map((String value) {
+                    items: options.map((value) {
                       return new DropdownMenuItem<String>(
-                        value: value,
+                        value: '$value',
-                        child: Text(value),
+                        child: Text('$value'),
                       );
                     }).toList(),
                     onChanged: (mode) => onChange(mode),

lib/entities/climate/widgets/mode_swicth.dart

@@ -1,10 +1,9 @@
-part of '../../main.dart';
+part of '../../../main.dart';
 
 class ModeSwitchWidget extends StatelessWidget {
 
   final String caption;
   final onChange;
-  final double captionFontSize;
   final bool value;
   final bool expanded;
   final EdgeInsets padding;
@@ -13,7 +12,6 @@ class ModeSwitchWidget extends StatelessWidget {
     Key key,
     @required this.caption,
     @required this.onChange,
-    this.captionFontSize,
     this.value,
     this.expanded: true,
     this.padding: const EdgeInsets.only(left: Sizes.leftWidgetPadding, right: Sizes.rightWidgetPadding)
@@ -25,7 +23,7 @@ class ModeSwitchWidget extends StatelessWidget {
       padding: this.padding,
       child: Row(
         children: <Widget>[
-          _buildCaption(),
+          _buildCaption(context),
           Switch(
             onChanged: (value) => onChange(value),
             value: value ?? false,
@@ -35,12 +33,10 @@ class ModeSwitchWidget extends StatelessWidget {
     );
   }
 
-  Widget _buildCaption() {
+  Widget _buildCaption(BuildContext context) {
     Widget captionWidget = Text(
       "$caption",
-      style: TextStyle(
+      style: Theme.of(context).textTheme.body1,
-          fontSize: captionFontSize ?? Sizes.stateFontSize
-      ),
     );
     if (expanded) {
       return Expanded(

lib/entities/climate/widgets/temperature_control_widget.dart

@@ -0,0 +1,47 @@
+part of '../../../main.dart';
+
+class TemperatureControlWidget extends StatelessWidget {
+  final double value;
+  final bool active;
+  final onInc;
+  final onDec;
+
+  TemperatureControlWidget(
+      {Key key,
+        @required this.value,
+        @required this.onInc,
+        @required this.onDec,
+        //this.fontSize,
+        this.active: false
+      })
+      : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.center,
+      children: <Widget>[
+        Text(
+          "$value",
+          style: active ? Theme.of(context).textTheme.display2 : Theme.of(context).textTheme.display1,
+        ),
+        Column(
+          children: <Widget>[
+            IconButton(
+              icon: Icon(MaterialDesignIcons.getIconDataFromIconName(
+                  'mdi:chevron-up')),
+              iconSize: 30.0,
+              onPressed: () => onInc(),
+            ),
+            IconButton(
+              icon: Icon(MaterialDesignIcons.getIconDataFromIconName(
+                  'mdi:chevron-down')),
+              iconSize: 30.0,
+              onPressed: () => onDec(),
+            )
+          ],
+        )
+      ],
+    );
+  }
+}

lib/entities/cover/widgets/cover_controls.widget.dart

@@ -18,7 +18,7 @@ class _CoverControlWidgetState extends State<CoverControlWidget> {
     setState(() {
       _tmpPosition = position.roundToDouble();
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_cover_position", entity.entityId,{"position": _tmpPosition.round()}));
+      ConnectionManager().callService(domain: entity.domain, service: "set_cover_position", entityId: entity.entityId, data: {"position": _tmpPosition.round()});
     });
   }
 
@@ -26,7 +26,7 @@ class _CoverControlWidgetState extends State<CoverControlWidget> {
     setState(() {
       _tmpTiltPosition = position.roundToDouble();
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(entity.domain, "set_cover_tilt_position", entity.entityId,{"tilt_position": _tmpTiltPosition.round()}));
+      ConnectionManager().callService(domain: entity.domain, service: "set_cover_tilt_position", entityId: entity.entityId, data: {"tilt_position": _tmpTiltPosition.round()});
     });
   }
 
@@ -62,13 +62,10 @@ class _CoverControlWidgetState extends State<CoverControlWidget> {
         crossAxisAlignment: CrossAxisAlignment.start,
         children: <Widget>[
           Padding(
-            padding: EdgeInsets.fromLTRB(
+            padding: EdgeInsets.only(top: Sizes.rowPadding),
-                0.0, Sizes.rowPadding, 0.0, Sizes.rowPadding),
+            child: Text("Position"),
-            child: Text("Position", style: TextStyle(
-                fontSize: Sizes.stateFontSize
-            )),
           ),
-          Slider(
+          UniversalSlider(
             value: _tmpPosition,
             min: 0.0,
             max: 100.0,
@@ -80,8 +77,7 @@ class _CoverControlWidgetState extends State<CoverControlWidget> {
               });
             },
             onChangeEnd: (double value) => _setNewPosition(entity, value),
-          ),
+          )
-          Container(height: Sizes.rowPadding,)
         ],
       );
     } else {
@@ -98,7 +94,7 @@ class _CoverControlWidgetState extends State<CoverControlWidget> {
     }
     if (entity.supportSetTiltPosition) {
       controls.addAll(<Widget>[
-        Slider(
+        UniversalSlider(
           value: _tmpTiltPosition,
           min: 0.0,
           max: 100.0,
@@ -117,10 +113,8 @@ class _CoverControlWidgetState extends State<CoverControlWidget> {
     if (controls.isNotEmpty) {
       controls.insert(0, Padding(
         padding: EdgeInsets.fromLTRB(
-            0.0, Sizes.rowPadding, 0.0, Sizes.rowPadding),
+            0.0, Sizes.rowPadding, 0.0, 0),
-        child: Text("Tilt position", style: TextStyle(
+        child: Text("Tilt position"),
-            fontSize: Sizes.stateFontSize
-        )),
       ));
       return Column(
         crossAxisAlignment: CrossAxisAlignment.start,
@@ -135,18 +129,18 @@ class _CoverControlWidgetState extends State<CoverControlWidget> {
 
 class CoverTiltControlsWidget extends StatelessWidget {
   void _open(CoverEntity entity) {
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        entity.domain, "open_cover_tilt", entity.entityId, null));
+        domain: entity.domain, service: "open_cover_tilt", entityId: entity.entityId);
   }
 
   void _close(CoverEntity entity) {
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        entity.domain, "close_cover_tilt", entity.entityId, null));
+        domain: entity.domain, service: "close_cover_tilt", entityId: entity.entityId);
   }
 
   void _stop(CoverEntity entity) {
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        entity.domain, "stop_cover_tilt", entity.entityId, null));
+        domain: entity.domain, service: "stop_cover_tilt", entityId: entity.entityId);
   }
 
   @override

lib/entities/cover/widgets/cover_state.dart

@@ -2,18 +2,27 @@ part of '../../../main.dart';
 
 class CoverStateWidget extends StatelessWidget {
   void _open(CoverEntity entity) {
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        entity.domain, "open_cover", entity.entityId, null));
+        domain: entity.domain,
+        service: "open_cover",
+        entityId: entity.entityId
+      );
   }
 
   void _close(CoverEntity entity) {
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        entity.domain, "close_cover", entity.entityId, null));
+        domain: entity.domain,
+        service: "close_cover",
+        entityId: entity.entityId
+      );
   }
 
   void _stop(CoverEntity entity) {
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        entity.domain, "stop_cover", entity.entityId, null));
+        domain: entity.domain,
+        service: "stop_cover",
+        entityId: entity.entityId
+      );
   }
 
   @override

lib/entities/date_time/date_time_entity.class.dart

@@ -35,8 +35,7 @@ class DateTimeEntity extends Entity {
     return formattedState;
   }
 
-  void setNewState(newValue) {
+  void setNewState(Map newValue) {
-    eventBus
+    ConnectionManager().callService(domain: domain, service: "set_datetime", entityId: entityId, data: newValue);
-        .fire(new ServiceCallEvent(domain, "set_datetime", entityId, newValue));
   }
 }

lib/entities/date_time/widgets/date_time_state.dart

@@ -9,10 +9,8 @@ class DateTimeStateWidget extends StatelessWidget {
         padding: EdgeInsets.fromLTRB(0.0, 0.0, Sizes.rightWidgetPadding, 0.0),
         child: GestureDetector(
           child: Text("${entity.formattedState}",
-              textAlign: TextAlign.right,
+              textAlign: TextAlign.right
-              style: new TextStyle(
+            ),
-                fontSize: Sizes.stateFontSize,
-              )),
           onTap: () => _handleStateTap(context, entity),
         ));
   }

lib/entities/default_entity_container.widget.dart

@@ -0,0 +1,72 @@
+part of '../main.dart';
+
+class DefaultEntityContainer extends StatelessWidget {
+  DefaultEntityContainer({
+    Key key,
+    @required this.state
+  }) : super(key: key);
+
+  final Widget state;
+
+  @override
+  Widget build(BuildContext context) {
+    final EntityModel entityModel = EntityModel.of(context);
+    if (entityModel.entityWrapper.entity.statelessType == StatelessEntityType.missed) {
+      return MissedEntityWidget();
+    }
+    if (entityModel.entityWrapper.entity.statelessType == StatelessEntityType.divider) {
+      return Divider();
+    }
+    if (entityModel.entityWrapper.entity.statelessType == StatelessEntityType.section) {
+      return Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        mainAxisSize: MainAxisSize.min,
+        children: <Widget>[
+          Divider(),
+          Text(
+              "${entityModel.entityWrapper.entity.displayName}",
+            style: HAClientTheme().getLinkTextStyle(context).copyWith(
+              decoration: TextDecoration.none
+            )
+          )
+        ],
+      );
+    }
+    Widget result = Row(
+      mainAxisSize: MainAxisSize.max,
+      children: <Widget>[
+        EntityIcon(),
+        Flexible(
+          fit: FlexFit.tight,
+          flex: 3,
+          child: EntityName(
+            padding: EdgeInsets.fromLTRB(10.0, 2.0, 10.0, 2.0),
+          ),
+        ),
+        state
+      ],
+    );
+    if (entityModel.handleTap) {
+      return InkWell(
+        onLongPress: () {
+          if (entityModel.handleTap) {
+            entityModel.entityWrapper.handleHold();
+          }
+        },
+        onTap: () {
+          if (entityModel.handleTap) {
+            entityModel.entityWrapper.handleTap();
+          }
+        },
+        onDoubleTap: () {
+          if (entityModel.handleTap) {
+            entityModel.entityWrapper.handleDoubleTap();
+          }
+        },
+        child: result,
+      );
+    } else {
+      return result;
+    }
+  }
+}

lib/entities/entity.class.dart

@@ -1,13 +1,6 @@
 part of '../main.dart';
 
-class StatelessEntityType {
+enum StatelessEntityType {none, missed, ghost, divider, section, callService, webLink}
-  static const NONE = 0;
-  static const MISSED = 1;
-  static const DIVIDER = 2;
-  static const SECTION = 3;
-  static const CALL_SERVICE = 4;
-  static const WEBLINK = 5;
-}
 
 class Entity {
 
@@ -76,8 +69,8 @@ class Entity {
   String entityPicture;
   String state;
   String displayState;
-  DateTime _lastUpdated;
+  DateTime lastUpdatedTimestamp;
-  int statelessType = 0;
+  StatelessEntityType statelessType = StatelessEntityType.none;
 
   List<Entity> childEntities = [];
   String deviceClass;
@@ -86,7 +79,8 @@ class Entity {
   );
 
   String get displayName =>
-      attributes["friendly_name"] ?? (attributes["name"] ?? entityId.split(".")[1].replaceAll("_", " "));
+      attributes["friendly_name"] ??
+      (attributes["name"] ?? (entityId != null && entityId.contains('.')) ? entityId.split(".")[1].replaceAll("_", " ") : "");
 
   bool get isView =>
       (domain == "group") &&
@@ -120,42 +114,47 @@ class Entity {
   }
 
   Entity.missed(String entityId) {
-    statelessType = StatelessEntityType.MISSED;
+    statelessType = StatelessEntityType.missed;
     attributes = {"hidden": false};
     this.entityId = entityId;
   }
 
   Entity.divider() {
-    statelessType = StatelessEntityType.DIVIDER;
+    statelessType = StatelessEntityType.divider;
     attributes = {"hidden": false};
   }
 
   Entity.section(String label) {
-    statelessType = StatelessEntityType.SECTION;
+    statelessType = StatelessEntityType.section;
     attributes = {"hidden": false, "friendly_name": "$label"};
   }
 
+  Entity.ghost(String name, String icon) {
+    statelessType = StatelessEntityType.ghost;
+    attributes = {"icon": icon, "hidden": false, "friendly_name": name};
+  }
+
   Entity.callService({String icon, String name, String service, String actionName}) {
-    statelessType = StatelessEntityType.CALL_SERVICE;
+    statelessType = StatelessEntityType.callService;
     entityId = service;
     displayState = actionName?.toUpperCase() ?? "RUN";
     attributes = {"hidden": false, "friendly_name": "$name", "icon": "$icon"};
   }
 
   Entity.weblink({String url, String name, String icon}) {
-    statelessType = StatelessEntityType.WEBLINK;
+    statelessType = StatelessEntityType.webLink;
-    entityId = "custom.custom"; //TODO wtf??
+    entityId = "custom.custom";
     attributes = {"hidden": false, "friendly_name": "${name ?? url}", "icon": "${icon ?? 'mdi:link'}"};
   }
 
   void update(Map rawData, String webHost) {
     attributes = rawData["attributes"] ?? {};
-    domain = rawData["entity_id"].split(".")[0];
+    domain = rawData["entity_id"] != null ? rawData["entity_id"].split(".")[0] : null;
     entityId = rawData["entity_id"];
     deviceClass = attributes["device_class"];
-    state = rawData["state"];
+    state = rawData["state"] is bool ? (rawData["state"] ? EntityState.on : EntityState.off) : rawData["state"];
     displayState = Entity.StateByDeviceClass["$deviceClass.$state"] ?? (state.toLowerCase() == 'unknown' ? '-' : state);
-    _lastUpdated = DateTime.tryParse(rawData["last_updated"]);
+    lastUpdatedTimestamp = DateTime.tryParse(rawData["last_updated"]);
     entityPicture = _getEntityPictureUrl(webHost);
   }
 
@@ -211,52 +210,19 @@ class Entity {
     );
   }
 
-  Widget buildEntityPageWidget(BuildContext context) {
-    return EntityModel(
-      entityWrapper: EntityWrapper(entity: this),
-      child: EntityPageContainer(children: <Widget>[
-        Padding(
-          padding: EdgeInsets.only(top: Sizes.rowPadding, left: Sizes.leftWidgetPadding),
-          child: DefaultEntityContainer(state: _buildStatePartForPage(context)),
-        ),
-        LastUpdatedWidget(),
-        Divider(),
-        _buildAdditionalControlsForPage(context),
-        Divider(),
-        buildHistoryWidget(),
-        EntityAttributesList()
-      ]),
-      handleTap: false,
-    );
-  }
-
-  Widget buildHistoryWidget() {
-    return EntityHistoryWidget(
-      config: historyConfig,
-    );
-  }
-
-  Widget buildBadgeWidget(BuildContext context) {
-    return EntityModel(
-      entityWrapper: EntityWrapper(entity: this),
-      child: BadgeWidget(),
-      handleTap: true,
-    );
-  }
-
   String getAttribute(String attributeName) {
     if (attributes != null) {
-      return attributes["$attributeName"];
+      return attributes["$attributeName"].toString();
     }
     return null;
   }
 
   String _getLastUpdatedFormatted() {
-    if (_lastUpdated == null) {
+    if (lastUpdatedTimestamp == null) {
       return "-";
     } else {
       DateTime now = DateTime.now();
-      Duration d = now.difference(_lastUpdated);
+      Duration d = now.difference(lastUpdatedTimestamp);
       String text;
       int v;
       if (d.inDays == 0) {

lib/entities/entity_icon.widget.dart

@@ -0,0 +1,130 @@
+part of '../main.dart';
+
+class EntityIcon extends StatelessWidget {
+
+  final EdgeInsetsGeometry padding;
+  final EdgeInsetsGeometry iconPadding;
+  final EdgeInsetsGeometry imagePadding;
+  final double size;
+  final Color color;
+
+  const EntityIcon({Key key, this.color, this.size: Sizes.iconSize, this.padding: const EdgeInsets.all(0.0), this.iconPadding, this.imagePadding}) : super(key: key);
+
+  int getDefaultIconByEntityId(String entityId, String deviceClass, String state) {
+    if (entityId == null) {
+      return 0;
+    }
+    String domain = entityId.split(".")[0];
+    String iconNameByDomain = MaterialDesignIcons.defaultIconsByDomains["$domain.$state"] ?? MaterialDesignIcons.defaultIconsByDomains["$domain"];
+    String iconNameByDeviceClass;
+    if (deviceClass != null) {
+      iconNameByDeviceClass = MaterialDesignIcons.defaultIconsByDeviceClass["$domain.$deviceClass.$state"] ?? MaterialDesignIcons.defaultIconsByDeviceClass["$domain.$deviceClass"];
+    }
+    String iconName = iconNameByDeviceClass ?? iconNameByDomain;
+    if (iconName != null) {
+      return MaterialDesignIcons.iconsDataMap[iconName] ?? 0;
+    } else {
+      return 0;
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final EntityWrapper entityWrapper = EntityModel.of(context).entityWrapper;
+    Color iconColor;
+    if (color != null) {
+      iconColor = color;
+    } else if (entityWrapper.stateColor) {
+      iconColor = HAClientTheme().getColorByEntityState(entityWrapper.entity.state, context);
+    } else {
+      iconColor = HAClientTheme().getOffStateColor(context);
+    }
+    Widget iconWidget;
+    bool isPicture = false;
+    if (entityWrapper == null) {
+      iconWidget = Container(
+        width: size,
+        height: size,
+      );
+    } else {
+      if (entityWrapper.entityPicture != null) {
+        iconWidget = Container(
+          height: size+12,
+          width: size+12,
+          decoration: BoxDecoration(
+              shape: BoxShape.circle,
+              image: DecorationImage(
+                fit:BoxFit.cover,
+                image: CachedNetworkImageProvider(
+                  "${entityWrapper.entityPicture}"
+                ),
+              )
+          ),
+        );
+        isPicture = true;
+      } else {
+        String iconName = entityWrapper.icon;
+        int iconCode = 0;
+        if (iconName.length > 0) {
+          iconCode = MaterialDesignIcons.getIconCodeByIconName(iconName);
+        } else {
+          iconCode = getDefaultIconByEntityId(entityWrapper.entity.entityId,
+              entityWrapper.entity.deviceClass, entityWrapper.entity.state); //
+        }
+        if (entityWrapper.entity is LightEntity &&
+          (entityWrapper.entity as LightEntity).supportColor &&
+          (entityWrapper.entity as LightEntity).color != null &&
+          (entityWrapper.entity as LightEntity).color.toColor() != Colors.white
+          ) {
+          Color lightColor = (entityWrapper.entity as LightEntity).color.toColor();  
+          iconWidget = Stack(
+            children: <Widget>[
+              Icon(
+                IconData(iconCode, fontFamily: 'Material Design Icons'),
+                size: size,
+                color: iconColor,
+              ),
+              Positioned(
+                bottom: 0,
+                right: 0,
+                child: Container(
+                  width: size / 3,
+                  height: size / 3,
+                  decoration: BoxDecoration(
+                    color: lightColor,
+                    shape: BoxShape.circle,
+                    boxShadow: <BoxShadow>[
+                      BoxShadow(
+                        spreadRadius: 0,
+                        blurRadius: 0,
+                        offset: Offset(0.3, 0.3)
+                      )
+                    ]
+                  ),
+                ),
+              )
+            ],
+          );
+        } else {
+          iconWidget = Icon(
+            IconData(iconCode, fontFamily: 'Material Design Icons'),
+            size: size,
+            color: iconColor,
+          );
+        }
+      }
+    }
+    EdgeInsetsGeometry computedPadding;
+    if (isPicture && imagePadding != null) {
+      computedPadding = imagePadding;
+    } else if (!isPicture && iconPadding != null) {
+      computedPadding = iconPadding;
+    } else {
+      computedPadding = padding;
+    }
+    return Padding(
+      padding: computedPadding,
+      child: iconWidget,
+    );
+  }
+}

lib/entities/entity_model.widget.dart

@@ -12,11 +12,11 @@ class EntityModel extends InheritedWidget {
   final bool handleTap;
 
   static EntityModel of(BuildContext context) {
-    return context.inheritFromWidgetOfExactType(EntityModel);
+    return context.dependOnInheritedWidgetOfExactType<EntityModel>();
   }
 
   @override
-  bool updateShouldNotify(InheritedWidget oldWidget) {
+  bool updateShouldNotify(EntityModel oldWidget) {
-    return true;
+    return entityWrapper.entity.lastUpdatedTimestamp != oldWidget.entityWrapper.entity.lastUpdatedTimestamp;
   }
 }

lib/entities/entity_name.widget.dart

@@ -5,18 +5,24 @@ class EntityName extends StatelessWidget {
   final EdgeInsetsGeometry padding;
   final TextOverflow textOverflow;
   final bool wordsWrap;
-  final double fontSize;
   final TextAlign textAlign;
   final int maxLines;
+  final TextStyle textStyle;
 
-  const EntityName({Key key, this.maxLines, this.padding: const EdgeInsets.only(right: 10.0), this.textOverflow: TextOverflow.ellipsis, this.wordsWrap: true, this.fontSize: Sizes.nameFontSize, this.textAlign: TextAlign.left}) : super(key: key);
+  const EntityName({Key key, this.maxLines, this.padding: const EdgeInsets.only(right: 10.0), this.textOverflow: TextOverflow.ellipsis, this.textStyle, this.wordsWrap: true, this.textAlign: TextAlign.left}) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
     final EntityWrapper entityWrapper = EntityModel.of(context).entityWrapper;
-    TextStyle textStyle = TextStyle(fontSize: fontSize);
+    TextStyle tStyle;
-    if (entityWrapper.entity.statelessType == StatelessEntityType.WEBLINK) {
+    if (textStyle == null) {
-      textStyle = textStyle.apply(color: Colors.blue, decoration: TextDecoration.underline);
+      if (entityWrapper.entity.statelessType == StatelessEntityType.webLink) {
+        tStyle = HAClientTheme().getLinkTextStyle(context);
+      } else {
+        tStyle = Theme.of(context).textTheme.body1;
+      }
+    } else {
+      tStyle = textStyle;
     }
     return Padding(
       padding: padding,
@@ -25,7 +31,7 @@ class EntityName extends StatelessWidget {
         overflow: textOverflow,
         softWrap: wordsWrap,
         maxLines: maxLines,
-        style: textStyle,
+        style: tStyle,
         textAlign: textAlign,
       ),
     );

lib/entities/entity_page_layout.widget.dart

@@ -0,0 +1,37 @@
+part of '../main.dart';
+
+class EntityPageLayout extends StatelessWidget {
+
+  final Entity entity;
+
+  EntityPageLayout({Key key, this.entity}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return EntityModel(
+      entityWrapper: EntityWrapper(entity: entity),
+      child: ListView(
+          padding: EdgeInsets.all(0),
+          children: <Widget>[
+            Padding(
+              padding: EdgeInsets.only(top: Sizes.rowPadding, left: Sizes.leftWidgetPadding),
+              child: DefaultEntityContainer(state: entity._buildStatePartForPage(context)),
+            ),
+            LastUpdatedWidget(),
+            Divider(),
+            entity._buildAdditionalControlsForPage(context),
+            Divider(),
+            SpoilerCard(
+              title: "State history",
+              body: EntityHistoryWidget(),
+            ),
+            SpoilerCard(
+              title: "Attributes",
+              body: EntityAttributesList(),
+            ),
+          ]
+      ),
+      handleTap: false,
+    );
+  }
+}

lib/entities/entity_picture.widget.dart

@@ -1,12 +1,11 @@
 part of '../main.dart';
 
-class EntityIcon extends StatelessWidget {
+class EntityPicture extends StatelessWidget {
 
   final EdgeInsetsGeometry padding;
-  final double size;
+  final BoxFit fit;
-  final Color color;
   
-  const EntityIcon({Key key, this.color, this.size: Sizes.iconSize, this.padding: const EdgeInsets.all(0.0)}) : super(key: key);
+  const EntityPicture({Key key, this.padding: const EdgeInsets.all(0.0), this.fit: BoxFit.cover}) : super(key: key);
 
   int getDefaultIconByEntityId(String entityId, String deviceClass, String state) {
     String domain = entityId.split(".")[0];
@@ -23,25 +22,10 @@ class EntityIcon extends StatelessWidget {
     }
   }
 
-  Widget buildIcon(EntityWrapper data, Color color) {
+  Widget buildIcon(EntityWrapper data, BuildContext context) {
     if (data == null) {
       return null;
     }
-    if (data.entityPicture != null) {
-      return Container(
-        height: size+12,
-        width: size+12,
-        decoration: BoxDecoration(
-            shape: BoxShape.circle,
-            image: DecorationImage(
-              fit:BoxFit.cover,
-              image: CachedNetworkImageProvider(
-                "${data.entityPicture}"
-              ),
-            )
-        ),
-      );
-    }
     String iconName = data.icon;
     int iconCode = 0;
     if (iconName.length > 0) {
@@ -50,14 +34,27 @@ class EntityIcon extends StatelessWidget {
       iconCode = getDefaultIconByEntityId(data.entity.entityId,
           data.entity.deviceClass, data.entity.state); //
     }
-    return Padding(
+    Widget iconPicture = Container(
-        padding: EdgeInsets.fromLTRB(6.0, 6.0, 6.0, 6.0),
+      child: Center(
         child: Icon(
           IconData(iconCode, fontFamily: 'Material Design Icons'),
-          size: size,
+          size: Sizes.largeIconSize,
-          color: color,
+          color: HAClientTheme().getOffStateColor(context),
         )
+      )
     );
+    
+    
+    if (data.entityPicture != null) {
+      return CachedNetworkImage(
+        imageUrl: data.entityPicture,
+        fit: this.fit,
+        errorWidget: (context, _, __) => iconPicture,
+        placeholder: (context, _) => iconPicture,
+      );
+    }
+    
+    return iconPicture;
   }
 
   @override
@@ -67,7 +64,7 @@ class EntityIcon extends StatelessWidget {
       padding: padding,
       child: buildIcon(
           entityWrapper,
-          color ?? EntityColor.stateColor(entityWrapper.entity.state)
+          context
       ),
     );
   }

lib/entities/entity_wrapper.class.dart

@@ -2,25 +2,28 @@ part of '../main.dart';
 
 class EntityWrapper {
 
-  String displayName;
+  String overrideName;
-  String icon;
+  final String overrideIcon;
-  String entityPicture;
+  final bool stateColor;
   EntityUIAction uiAction;
   Entity entity;
+  String unitOfMeasurementOverride;
+  final List stateFilter;
 
+  String get icon => overrideIcon ?? entity.icon;
+  String get entityPicture => entity.entityPicture;
+  String get displayName => overrideName ?? entity.displayName;
+  String get unitOfMeasurement => unitOfMeasurementOverride ?? entity.unitOfMeasurement;
 
   EntityWrapper({
     this.entity,
-    String icon,
+    this.overrideIcon,
-    String displayName,
+    this.overrideName,
-    this.uiAction
+    this.stateColor: true,
+    this.uiAction,
+    this.stateFilter
   }) {
-    if (entity.statelessType == StatelessEntityType.NONE || entity.statelessType == StatelessEntityType.CALL_SERVICE || entity.statelessType == StatelessEntityType.WEBLINK) {
+    if (entity.statelessType == StatelessEntityType.ghost || entity.statelessType == StatelessEntityType.none || entity.statelessType == StatelessEntityType.callService || entity.statelessType == StatelessEntityType.webLink) {
-      this.icon = icon ?? entity.icon;
-      if (icon == null) {
-        entityPicture = entity.entityPicture;
-      }
-      this.displayName = displayName ?? entity.displayName;
       if (uiAction == null) {
         uiAction = EntityUIAction();
       }
@@ -30,17 +33,17 @@ class EntityWrapper {
   void handleTap() {
     switch (uiAction.tapAction) {
       case EntityUIAction.toggle: {
-        eventBus.fire(
+        ConnectionManager().callService(domain: "homeassistant", service: "toggle", entityId: entity.entityId);
-            ServiceCallEvent("homeassistant", "toggle", entity.entityId, null));
         break;
       }
 
       case EntityUIAction.callService: {
         if (uiAction.tapService != null) {
-          eventBus.fire(
+          ConnectionManager().callService(
-              ServiceCallEvent(uiAction.tapService.split(".")[0],
+            domain: uiAction.tapService.split(".")[0],
-                  uiAction.tapService.split(".")[1], null,
+            service: uiAction.tapService.split(".")[1],
-                  uiAction.tapServiceData));
+            data: uiAction.tapServiceData
+          );
         }
         break;
       }
@@ -51,16 +54,16 @@ class EntityWrapper {
 
       case EntityUIAction.moreInfo: {
         eventBus.fire(
-            new ShowEntityPageEvent(entity));
+            new ShowEntityPageEvent(entityId: entity.entityId));
         break;
       }
 
       case EntityUIAction.navigate: {
-        if (uiAction.tapService.startsWith("/")) {
+        if (uiAction.tapService != null && uiAction.tapService.startsWith("/")) {
           //TODO handle local urls
-          Logger.w("Local urls is not supported yet");
+          Launcher.launchURLInBrowser('${ConnectionManager().httpWebHost}${uiAction.tapService}');
         } else {
-          HAUtils.launchURL(uiAction.tapService);
+          Launcher.launchURLInBrowser(uiAction.tapService);
         }
         break;
       }
@@ -74,33 +77,73 @@ class EntityWrapper {
   void handleHold() {
       switch (uiAction.holdAction) {
         case EntityUIAction.toggle: {
-          eventBus.fire(
+          ConnectionManager().callService(domain: "homeassistant", service: "toggle", entityId: entity.entityId);
-              ServiceCallEvent("homeassistant", "toggle", entity.entityId, null));
           break;
         }
 
         case EntityUIAction.callService: {
           if (uiAction.holdService != null) {
-            eventBus.fire(
+            ConnectionManager().callService(
-                ServiceCallEvent(uiAction.holdService.split(".")[0],
+              domain: uiAction.holdService.split(".")[0],
-                    uiAction.holdService.split(".")[1], null,
+              service: uiAction.holdService.split(".")[1],
-                    uiAction.holdServiceData));
+              data: uiAction.holdServiceData
+            );
           }
           break;
         }
 
         case EntityUIAction.moreInfo: {
           eventBus.fire(
-              new ShowEntityPageEvent(entity));
+              new ShowEntityPageEvent(entityId: entity.entityId));
           break;
         }
 
         case EntityUIAction.navigate: {
-          if (uiAction.holdService.startsWith("/")) {
+          if (uiAction.holdService != null && uiAction.holdService.startsWith("/")) {
             //TODO handle local urls
-            Logger.w("Local urls is not supported yet");
+            Launcher.launchURLInBrowser('${ConnectionManager().httpWebHost}${uiAction.holdService}');
           } else {
-            HAUtils.launchURL(uiAction.holdService);
+            Launcher.launchURLInBrowser(uiAction.holdService);
+          }
+          break;
+        }
+
+        default: {
+          break;
+        }
+      }
+  }
+
+  void handleDoubleTap() {
+      switch (uiAction.doubleTapAction) {
+        case EntityUIAction.toggle: {
+          ConnectionManager().callService(domain: "homeassistant", service: "toggle", entityId: entity.entityId);
+          break;
+        }
+
+        case EntityUIAction.callService: {
+          if (uiAction.doubleTapService != null) {
+            ConnectionManager().callService(
+              domain: uiAction.doubleTapService.split(".")[0],
+              service: uiAction.doubleTapService.split(".")[1],
+              data: uiAction.doubleTapServiceData
+            );
+          }
+          break;
+        }
+
+        case EntityUIAction.moreInfo: {
+          eventBus.fire(
+              new ShowEntityPageEvent(entityId: entity.entityId));
+          break;
+        }
+
+        case EntityUIAction.navigate: {
+          if (uiAction.doubleTapService != null && uiAction.doubleTapService.startsWith("/")) {
+            //TODO handle local urls
+            Launcher.launchURLInBrowser('${ConnectionManager().httpWebHost}${uiAction.doubleTapService}');
+          } else {
+            Launcher.launchURLInBrowser(uiAction.doubleTapService);
           }
           break;
         }
@@ -112,3 +155,63 @@ class EntityWrapper {
   }
 
 }
+
+class EntityUIAction {
+  static const moreInfo = 'more-info';
+  static const toggle = 'toggle';
+  static const callService = 'call-service';
+  static const navigate = 'navigate';
+  static const none = 'none';
+
+  String tapAction = EntityUIAction.moreInfo;
+  String tapNavigationPath;
+  String tapService;
+  Map<String, dynamic> tapServiceData;
+  String holdAction = EntityUIAction.moreInfo;
+  String holdNavigationPath;
+  String holdService;
+  Map<String, dynamic> holdServiceData;
+  String doubleTapAction = EntityUIAction.none;
+  String doubleTapNavigationPath;
+  String doubleTapService;
+  Map<String, dynamic> doubleTapServiceData;
+
+  EntityUIAction({rawEntityData}) {
+    if (rawEntityData != null) {
+      if (rawEntityData["tap_action"] != null) {
+        if (rawEntityData["tap_action"] is String) {
+          tapAction = rawEntityData["tap_action"];
+        } else {
+          tapAction =
+              rawEntityData["tap_action"]["action"] ?? EntityUIAction.moreInfo;
+          tapNavigationPath = rawEntityData["tap_action"]["navigation_path"];
+          tapService = rawEntityData["tap_action"]["service"];
+          tapServiceData = rawEntityData["tap_action"]["service_data"];
+        }
+      }
+      if (rawEntityData["hold_action"] != null) {
+        if (rawEntityData["hold_action"] is String) {
+          holdAction = rawEntityData["hold_action"];
+        } else {
+          holdAction =
+              rawEntityData["hold_action"]["action"] ?? EntityUIAction.none;
+          holdNavigationPath = rawEntityData["hold_action"]["navigation_path"];
+          holdService = rawEntityData["hold_action"]["service"];
+          holdServiceData = rawEntityData["hold_action"]["service_data"];
+        }
+      }
+      if (rawEntityData["double_tap_action"] != null) {
+        if (rawEntityData["double_tap_action"] is String) {
+          doubleTapAction = rawEntityData["double_tap_action"];
+        } else {
+          doubleTapAction =
+              rawEntityData["double_tap_action"]["action"] ?? EntityUIAction.none;
+          doubleTapNavigationPath = rawEntityData["double_tap_action"]["navigation_path"];
+          doubleTapService = rawEntityData["double_tap_action"]["service"];
+          doubleTapServiceData = rawEntityData["double_tap_action"]["service_data"];
+        }
+      }
+    }
+  }
+
+}

lib/entities/error_entity_widget.dart

@@ -0,0 +1,23 @@
+part of '../main.dart';
+
+class ErrorEntityWidget extends StatelessWidget {
+  
+  final String text;
+
+  ErrorEntityWidget({
+    Key key, this.text
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final EntityModel entityModel = EntityModel.of(context);
+    String errorText = text ?? "Entity error: ${entityModel.entityWrapper.entity?.entityId}";
+    return Container(
+        child: Padding(
+          padding: EdgeInsets.all(5.0),
+          child: Text(errorText),
+        ),
+        color: Theme.of(context).errorColor,
+    );
+  }
+}

lib/entities/fan/widgets/fan_controls.dart

@@ -24,9 +24,12 @@ class _FanControlsWidgetState extends State<FanControlsWidget> {
     setState(() {
       _tmpOscillate = oscillate;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(
+      ConnectionManager().callService(
-          "fan", "oscillate", entity.entityId,
+          domain: "fan",
-          {"oscillating": oscillate}));
+          service: "oscillate",
+          entityId: entity.entityId,
+          data: {"oscillating": oscillate}
+        );
     });
   }
 
@@ -34,9 +37,12 @@ class _FanControlsWidgetState extends State<FanControlsWidget> {
     setState(() {
       _tmpDirectionForward = forward;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(
+      ConnectionManager().callService(
-          "fan", "set_direction", entity.entityId,
+          domain: "fan",
-          {"direction": forward ? "forward" : "reverse"}));
+          service: "set_direction",
+          entityId: entity.entityId,
+          data: {"direction": forward ? "forward" : "reverse"}
+        );
     });
   }
 
@@ -44,9 +50,12 @@ class _FanControlsWidgetState extends State<FanControlsWidget> {
     setState(() {
       _tmpSpeed = value;
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(
+      ConnectionManager().callService(
-            "fan", "set_speed", entity.entityId,
+            domain: "fan",
-            {"speed": value}));
+            service: "set_speed",
+            entityId: entity.entityId,
+            data: {"speed": value}
+          );
     });
   }
 

lib/entities/flat_service_button.widget.dart

@@ -1,4 +1,4 @@
-part of '../../main.dart';
+part of '../main.dart';
 
 class FlatServiceButton extends StatelessWidget {
 
@@ -6,7 +6,6 @@ class FlatServiceButton extends StatelessWidget {
   final String serviceName;
   final String entityId;
   final String text;
-  final double fontSize;
 
   FlatServiceButton({
     Key key,
@@ -14,17 +13,16 @@ class FlatServiceButton extends StatelessWidget {
     @required this.serviceName,
     @required this.entityId,
     @required this.text,
-    this.fontSize: Sizes.stateFontSize
   }) : super(key: key);
 
   void _setNewState() {
-    eventBus.fire(new ServiceCallEvent(serviceDomain, serviceName, entityId, null));
+    ConnectionManager().callService(domain: serviceDomain, service: serviceName, entityId: entityId);
   }
 
   @override
   Widget build(BuildContext context) {
     return SizedBox(
-        height: fontSize*2.5,
+        height: Theme.of(context).textTheme.subhead.fontSize*2.5,
         child: FlatButton(
           onPressed: (() {
             _setNewState();
@@ -32,8 +30,7 @@ class FlatServiceButton extends StatelessWidget {
           child: Text(
             text,
             textAlign: TextAlign.right,
-            style:
+            style: HAClientTheme().getActionTextStyle(context),
-            new TextStyle(fontSize: fontSize, color: Colors.blue),
           ),
         )
     );

lib/entities/light/widgets/light_color_picker.dart

@@ -1,4 +1,4 @@
-part of '../../main.dart';
+part of '../../../main.dart';
 
 class LightColorPicker extends StatefulWidget {
 
@@ -27,7 +27,6 @@ class LightColorPickerState extends State<LightColorPicker> {
     List<Widget> colorRows = [];
     Border border;
     bool isSomethingSelected = false;
-    Logger.d("Current colotfor picker: [${widget.color.hue}, ${widget.color.saturation}]");
     for (double saturation = 1.0; saturation >= (0.0 + widget.saturationStep); saturation = double.parse((saturation - widget.saturationStep).toStringAsFixed(2))) {
       List<Widget> rowChildren = [];
       //Logger.d("$saturation");

lib/entities/light/widgets/light_controls.dart

@@ -28,9 +28,12 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
     setState(() {
       _tmpBrightness = value.round();
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(
+      ConnectionManager().callService(
-          entity.domain, "turn_on", entity.entityId,
+          domain: entity.domain,
-          {"brightness": _tmpBrightness}));
+          service: "turn_on",
+          entityId: entity.entityId,
+          data: {"brightness": _tmpBrightness}
+        );
     });
   }
 
@@ -38,9 +41,12 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
     setState(() {
       _tmpWhiteValue = value.round();
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(
+      ConnectionManager().callService(
-            entity.domain, "turn_on", entity.entityId,
+            domain: entity.domain,
-            {"white_value": _tmpWhiteValue}));
+            service: "turn_on",
+            entityId: entity.entityId,
+            data: {"white_value": _tmpWhiteValue}
+          );
 
     });
   }
@@ -49,9 +55,12 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
     setState(() {
       _tmpColorTemp = value.round();
       _changedHere = true;
-      eventBus.fire(new ServiceCallEvent(
+      ConnectionManager().callService(
-          entity.domain, "turn_on", entity.entityId,
+          domain: entity.domain,
-          {"color_temp": _tmpColorTemp}));
+          service: "turn_on",
+          entityId: entity.entityId,
+          data: {"color_temp": _tmpColorTemp}
+        );
     });
   }
 
@@ -59,10 +68,12 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
     setState(() {
       _tmpColor = color;
       _changedHere = true;
-      Logger.d( "HS Color: [${color.hue}, ${color.saturation}]");
+      ConnectionManager().callService(
-      eventBus.fire(new ServiceCallEvent(
+        domain: entity.domain,
-        entity.domain, "turn_on", entity.entityId,
+        service: "turn_on",
-          {"hs_color": [color.hue, color.saturation*100]}));
+        entityId: entity.entityId,
+        data: {"hs_color": [color.hue, color.saturation*100]}
+      );
     });
   }
 
@@ -71,9 +82,12 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
       _tmpEffect = value;
       _changedHere = true;
       if (_tmpEffect != null) {
-        eventBus.fire(new ServiceCallEvent(
+        ConnectionManager().callService(
-            entity.domain, "turn_on", entity.entityId,
+            domain: entity.domain,
-            {"effect": "$value"}));
+            service: "turn_on",
+            entityId: entity.entityId,
+            data: {"effect": "$value"}
+          );
       }
     });
   }
@@ -100,7 +114,19 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
   }
 
   Widget _buildBrightnessControl(LightEntity entity) {
-    if ((entity.supportBrightness) && (_tmpBrightness != null)) {
+    if (entity.supportBrightness) {
+      double val;
+      if (_tmpBrightness != null) {
+        if (_tmpBrightness > 255) {
+          val = 255;
+        } else if (_tmpBrightness < 1) {
+          val = 1;
+        } else {
+          val = _tmpBrightness.toDouble();
+        }
+      } else {
+        val = 1;
+      }
       return UniversalSlider(
         onChanged: (value) {
           setState(() {
@@ -111,7 +137,7 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
         min: 1.0,
         max: 255.0,
         onChangeEnd: (value) => _setBrightness(entity, value),
-        value: _tmpBrightness == null ? 1.0 : _tmpBrightness.toDouble(),
+        value: val,
         leading: Icon(Icons.brightness_5),
         title: "Brightness",
       );
@@ -143,10 +169,22 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
 
   Widget _buildColorTempControl(LightEntity entity) {
     if (entity.supportColorTemp) {
+      double val;
+      if (_tmpColorTemp != null) {
+        if (_tmpColorTemp > entity.maxMireds) {
+          val = entity.maxMireds;
+        } else if (_tmpColorTemp < entity.minMireds) {
+          val = entity.minMireds;
+        } else {
+          val = _tmpColorTemp.toDouble();
+        }
+      } else {
+        val = entity.minMireds;
+      }
       return UniversalSlider(
         title: "Color temperature",
-        leading: Text("Cold", style: TextStyle(color: Colors.lightBlue),),
+        leading: Text("Cold", style: Theme.of(context).textTheme.body1.copyWith(color: Colors.lightBlue)),
-        value:  _tmpColorTemp == null ? entity.maxMireds : _tmpColorTemp.toDouble(),
+        value:  val,
         onChangeEnd: (value) => _setColorTemp(entity, value),
         max: entity.maxMireds,
         min: entity.minMireds,
@@ -156,7 +194,7 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
             _tmpColorTemp = value.round();
           });
         },
-        closing: Text("Warm", style: TextStyle(color: Colors.amberAccent),),
+        closing: Text("Warm", style: Theme.of(context).textTheme.body1.copyWith(color: Colors.amberAccent),),
       );
     } else {
       return Container(width: 0.0, height: 0.0);
@@ -186,7 +224,7 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
                 },
               ),
               FlatButton(
-                color: savedColor?.toColor() ?? Colors.transparent,
+                color: savedColor?.toColor() ?? Theme.of(context).backgroundColor,
                 child: Text('Paste color'),
                 onPressed: savedColor == null ? null : () {
                   _setColor(entity, savedColor);
@@ -203,10 +241,14 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
 
   Widget _buildEffectControl(LightEntity entity) {
     if ((entity.supportEffect) && (entity.effectList != null)) {
+      List<String> list = List.from(entity.effectList);
+      if (_tmpEffect!= null && !list.contains(_tmpEffect)) {
+        list.insert(0, _tmpEffect);
+      }
       return ModeSelectorWidget(
           onChange: (effect) => _setEffect(entity, effect),
           caption: "Effect",
-          options: entity.effectList,
+          options: list,
           value: _tmpEffect
       );
     } else {

lib/entities/lock/widgets/lock_state.dart

@@ -7,11 +7,11 @@ class LockStateWidget extends StatelessWidget {
   const LockStateWidget({Key key, this.assumedState: false}) : super(key: key);
 
   void _lock(Entity entity) {
-    eventBus.fire(new ServiceCallEvent("lock", "lock", entity.entityId, null));
+    ConnectionManager().callService(domain: "lock", service: "lock", entityId: entity.entityId);
   }
 
   void _unlock(Entity entity) {
-    eventBus.fire(new ServiceCallEvent("lock", "unlock", entity.entityId, null));
+    ConnectionManager().callService(domain: "lock", service: "unlock", entityId: entity.entityId);
   }
 
   @override
@@ -28,8 +28,7 @@ class LockStateWidget extends StatelessWidget {
           onPressed: () => _unlock(entity),
           child: Text("UNLOCK",
               textAlign: TextAlign.right,
-              style:
+              style: HAClientTheme().getActionTextStyle(context)
-              new TextStyle(fontSize: Sizes.stateFontSize, color: Colors.blue),
             ),
           )
         ),
@@ -39,8 +38,7 @@ class LockStateWidget extends StatelessWidget {
               onPressed: () => _lock(entity),
               child: Text("LOCK",
                 textAlign: TextAlign.right,
-                style:
+                style: HAClientTheme().getActionTextStyle(context),
-                new TextStyle(fontSize: Sizes.stateFontSize, color: Colors.blue),
               ),
             )
         )
@@ -56,8 +54,7 @@ class LockStateWidget extends StatelessWidget {
             child: Text(
               entity.isLocked ? "UNLOCK" : "LOCK",
               textAlign: TextAlign.right,
-              style:
+              style: HAClientTheme().getActionTextStyle(context),
-              new TextStyle(fontSize: Sizes.stateFontSize, color: Colors.blue),
             ),
           )
       );

lib/entities/media_player/media_player_entity.class.dart

@@ -74,10 +74,34 @@ class MediaPlayerEntity extends Entity {
 
   List<String> get soundModeList => getStringListAttributeValue("sound_mode_list");
   List<String> get sourceList => getStringListAttributeValue("source_list");
+  DateTime get positionLastUpdated => DateTime.tryParse("${attributes["media_position_updated_at"]}")?.toLocal();
+  int get durationSeconds => _getIntAttributeValue("media_duration");
+  int get positionSeconds => _getIntAttributeValue("media_position");
 
   @override
   Widget _buildAdditionalControlsForPage(BuildContext context) {
     return MediaPlayerControls();
   }
 
+  bool canCalculateActualPosition() {
+    return positionLastUpdated != null && durationSeconds != null && positionSeconds != null && durationSeconds > 0;
+  }
+
+  double getActualPosition() {
+    double result = 0;
+    Duration durationD;
+    Duration positionD;
+    durationD = Duration(seconds: durationSeconds);
+    positionD = Duration(
+          seconds: positionSeconds);
+    result = positionD.inSeconds.toDouble();
+    int differenceInSeconds = DateTime
+          .now()
+          .difference(positionLastUpdated)
+          .inSeconds;
+    result = ((result + differenceInSeconds) <= durationD.inSeconds) ? (result + differenceInSeconds) : durationD.inSeconds.toDouble();
+    return result;
+
+  }
+
 }

lib/entities/media_player/widgets/media_player_progress_bar.widget.dart

@@ -0,0 +1,46 @@
+part of '../../../main.dart';
+
+class MediaPlayerProgressBar extends StatefulWidget {
+  @override
+  _MediaPlayerProgressBarState createState() => _MediaPlayerProgressBarState();
+}
+
+class _MediaPlayerProgressBarState extends State<MediaPlayerProgressBar> {
+
+  Timer _timer;
+
+  @override
+  initState() {
+    super.initState();
+    _timer = Timer.periodic(Duration(seconds: 1), (_) {
+      setState(() {
+      });
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final EntityModel entityModel = EntityModel.of(context);
+    final MediaPlayerEntity entity = entityModel.entityWrapper.entity;
+    double progress = 0;
+    int currentPosition;
+    if (entity.canCalculateActualPosition()) {
+      currentPosition = entity.getActualPosition().toInt();
+      if (currentPosition > 0) {
+          progress = (currentPosition <= entity.durationSeconds) ? currentPosition / entity.durationSeconds : 100;
+      }
+    }
+    return LinearProgressIndicator(
+      value: progress,
+      backgroundColor: Colors.black45,
+      valueColor: AlwaysStoppedAnimation<Color>(HAClientTheme().getOnStateColor(context)),
+    );
+  }
+
+  @override
+  void dispose() {
+    _timer?.cancel();
+    super.dispose();
+  }
+
+}

lib/entities/media_player/widgets/media_player_seek_bar.widget.dart

@@ -0,0 +1,134 @@
+part of '../../../main.dart';
+
+class MediaPlayerSeekBar extends StatefulWidget {
+  @override
+  _MediaPlayerSeekBarState createState() => _MediaPlayerSeekBarState();
+}
+
+class _MediaPlayerSeekBarState extends State<MediaPlayerSeekBar> {
+
+  Timer _timer;
+  bool _seekStarted = false;
+  bool _changedHere = false;
+  double _currentPosition = 0;
+  int _savedPosition = 0;
+
+  @override
+  initState() {
+    super.initState();
+    _timer = Timer.periodic(Duration(seconds: 1), (_) {
+      if (!_seekStarted && !_changedHere) {
+        setState(() {});
+      }
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final EntityModel entityModel = EntityModel.of(context);
+    final MediaPlayerEntity entity = entityModel.entityWrapper.entity;
+
+    if (entity.canCalculateActualPosition() && entity.state != EntityState.idle) {
+      if (HomeAssistant().sendToPlayerId == entity.entityId  && HomeAssistant().savedPlayerPosition != null) {
+        _savedPosition = HomeAssistant().savedPlayerPosition;
+        HomeAssistant().savedPlayerPosition = null;
+        HomeAssistant().sendToPlayerId = null;
+      }
+      if (entity.state == EntityState.playing && !_seekStarted &&
+          !_changedHere) {
+        _currentPosition = entity.getActualPosition();
+      } else if (entity.state == EntityState.paused) {
+        _currentPosition = entity.positionSeconds.toDouble();
+      } else if (_changedHere) {
+        _changedHere = false;
+      }
+      List<Widget> buttons = [];
+      if (_savedPosition > 0) {
+        buttons.add(
+            RaisedButton(
+              child: Text("Jump to ${Duration(seconds: _savedPosition).toString().split('.')[0]}"),
+              color: Theme.of(context).accentColor,
+              onPressed: () {
+                ConnectionManager().callService(
+                    domain: "media_player",
+                    service: "media_seek",
+                    entityId: entity.entityId,
+                    data: {"seek_position": _savedPosition}
+                );
+                setState(() {
+                  _savedPosition = 0;
+                });
+              },
+            )
+        );
+      }
+      return Padding(
+        padding: EdgeInsets.fromLTRB(Sizes.leftWidgetPadding, 20, Sizes.rightWidgetPadding, 0),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: <Widget>[
+            Row(
+              mainAxisSize: MainAxisSize.max,
+              children: <Widget>[
+                Text("00:00"),
+                Expanded(
+                  child: Text(
+                    "${Duration(seconds: _currentPosition.toInt()).toString().split(".")[0]}",
+                    textAlign: TextAlign.center,
+                    style: Theme.of(context).textTheme.title.copyWith(
+                      color: Colors.blue
+                    )
+                  ),
+                ),
+                Text("${Duration(seconds: entity.durationSeconds).toString().split(".")[0]}")
+              ],
+            ),
+            UniversalSlider(
+              min: 0,
+              activeColor: Theme.of(context).accentColor,
+              max: entity.durationSeconds.toDouble(),
+              value: _currentPosition,
+              onChangeStart: (val) {
+                _seekStarted = true;
+              },
+              onChanged: (val) {
+                setState(() {
+                  _currentPosition = val;
+                });
+              },
+              onChangeEnd: (val) {
+                _seekStarted = false;
+                Timer(Duration(milliseconds: 500), () {
+                  if (!_seekStarted) {
+                    ConnectionManager().callService(
+                        domain: "media_player",
+                        service: "media_seek",
+                        entityId: entity.entityId,
+                        data: {"seek_position": val}
+                    );
+                    setState(() {
+                      _changedHere = true;
+                      _currentPosition = val;
+                    });
+                  }
+                });
+              },
+            ),
+            ButtonBar(
+              children: buttons,
+            )
+          ],
+        ),
+      );
+    } else {
+      return Container(width: 0, height: 0,);
+    }
+  }
+
+  @override
+  void dispose() {
+    _timer?.cancel();
+    super.dispose();
+  }
+
+}

lib/entities/media_player/widgets/media_player_widgets.dart

@@ -12,21 +12,21 @@ class MediaPlayerWidget extends StatelessWidget {
         Stack(
           alignment: AlignmentDirectional.topEnd,
           children: <Widget>[
-            _buildImage(entity),
+            _buildImage(entity, context),
             Positioned(
               bottom: 0.0,
               left: 0.0,
               right: 0.0,
               child: Container(
                 color: Colors.black45,
-                child: _buildState(entity),
+                child: _buildState(entity, context),
               ),
             ),
             Positioned(
                 bottom: 0.0,
                 left: 0.0,
                 right: 0.0,
-                child: MediaPlayerProgressWidget()
+                child: MediaPlayerProgressBar()
             )
           ],
         ),
@@ -35,12 +35,9 @@ class MediaPlayerWidget extends StatelessWidget {
     );
   }
 
-  Widget _buildState(MediaPlayerEntity entity) {
+  Widget _buildState(MediaPlayerEntity entity, BuildContext context) {
-    TextStyle style = TextStyle(
+    TextStyle style = Theme.of(context).textTheme.body1.copyWith(
-        fontSize: 14.0,
+      color: Colors.white
-        color: Colors.white,
-        fontWeight: FontWeight.normal,
-        height: 1.2
     );
     List<Widget> states = [];
     states.add(Text("${entity.displayName}", style: style));
@@ -71,7 +68,7 @@ class MediaPlayerWidget extends StatelessWidget {
     );
   }
 
-  Widget _buildImage(MediaPlayerEntity entity) {
+  Widget _buildImage(MediaPlayerEntity entity, BuildContext context) {
     String state = entity.state;
     if (entity.entityPicture != null && state != EntityState.off && state != EntityState.unavailable && state != EntityState.idle) {
       return Container(
@@ -97,7 +94,7 @@ class MediaPlayerWidget extends StatelessWidget {
           Icon(
             MaterialDesignIcons.getIconDataFromIconName("mdi:movie"),
             size: 150.0,
-            color: EntityColor.stateColor("$state"),
+            color: HAClientTheme().getColorByEntityState("$state", context),
           )
         ],
       );
@@ -118,26 +115,28 @@ class MediaPlayerPlaybackControls extends StatelessWidget {
 
 
   void _setPower(MediaPlayerEntity entity) {
-    if (entity.state != EntityState.unavailable && entity.state != EntityState.unknown) {
       if (entity.state == EntityState.off) {
-        Logger.d("${entity.entityId} turn_on");
+        ConnectionManager().callService(
-        eventBus.fire(new ServiceCallEvent(
+            domain: entity.domain,
-            entity.domain, "turn_on", entity.entityId,
+            service: "turn_on",
-            null));
+            entityId: entity.entityId
+          );
       } else {
-        Logger.d("${entity.entityId} turn_off");
+        ConnectionManager().callService(
-        eventBus.fire(new ServiceCallEvent(
+            domain: entity.domain,
-            entity.domain, "turn_off", entity.entityId,
+            service: "turn_off",
-            null));
+            entityId: entity.entityId
+          );
       }
-    }
   }
 
   void _callAction(MediaPlayerEntity entity, String action) {
     Logger.d("${entity.entityId} $action");
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        entity.domain, "$action", entity.entityId,
+        domain: entity.domain,
-        null));
+        service: "$action",
+        entityId: entity.entityId
+      );
   }
 
   @override
@@ -229,7 +228,7 @@ class MediaPlayerPlaybackControls extends StatelessWidget {
           IconButton(
               icon: Icon(MaterialDesignIcons.getIconDataFromIconName(
                   "mdi:dots-vertical")),
-              onPressed: () => eventBus.fire(new ShowEntityPageEvent(entity))
+              onPressed: () => eventBus.fire(new ShowEntityPageEvent(entityId: entity.entityId))
           )
       );
     } else if (entity.supportStop && entity.state != EntityState.off && entity.state != EntityState.unavailable) {
@@ -264,27 +263,50 @@ class _MediaPlayerControlsState extends State<MediaPlayerControls> {
     setState(() {
       _changedHere = true;
       _newVolumeLevel = value;
-      eventBus.fire(ServiceCallEvent("media_player", "volume_set", entityId, {"volume_level": value}));
+      ConnectionManager().callService(
+        domain: "media_player",
+        service: "volume_set",
+        entityId: entityId,
+        data: {"volume_level": value}
+      );
     });
   }
 
   void _setVolumeMute(bool isMuted, String entityId) {
-    eventBus.fire(ServiceCallEvent("media_player", "volume_mute", entityId, {"is_volume_muted": isMuted}));
+    ConnectionManager().callService(
+      domain: "media_player",
+      service: "volume_mute",
+      entityId: entityId,
+      data: {"is_volume_muted": isMuted}
+    );
   }
 
   void _setVolumeUp(String entityId) {
-    eventBus.fire(ServiceCallEvent("media_player", "volume_up", entityId, null));
+    ConnectionManager().callService(
+      domain: "media_player",
+      service: "volume_up",
+      entityId: entityId
+    );
   }
 
   void _setVolumeDown(String entityId) {
-    eventBus.fire(ServiceCallEvent("media_player", "volume_down", entityId, null));
+    ConnectionManager().callService(
+      domain: "media_player",
+      service: "volume_down",
+      entityId: entityId
+    );
   }
 
   void _setSoundMode(String value, String entityId) {
     setState(() {
       _newSoundMode = value;
       _changedHere = true;
-      eventBus.fire(ServiceCallEvent("media_player", "select_sound_mode", entityId, {"sound_mode": "$value"}));
+      ConnectionManager().callService(
+        domain: "media_player",
+        service: "select_sound_mode",
+        entityId: entityId,
+        data: {"sound_mode": "$value"}
+      );
     });
   }
 
@@ -292,7 +314,12 @@ class _MediaPlayerControlsState extends State<MediaPlayerControls> {
     setState(() {
       _newSource = source;
       _changedHere = true;
-      eventBus.fire(ServiceCallEvent("media_player", "select_source", entityId, {"source": "$source"}));
+      ConnectionManager().callService(
+        domain: "media_player",
+        service: "select_source",
+        entityId: entityId,
+        data: {"source": "$source"}
+      );
     });
   }
 
@@ -305,6 +332,11 @@ class _MediaPlayerControlsState extends State<MediaPlayerControls> {
       )
     ];
     if (entity.state != EntityState.off && entity.state != EntityState.unknown && entity.state != EntityState.unavailable) {
+      if (entity.supportSeek) {
+        children.add(MediaPlayerSeekBar());
+      } else {
+        children.add(MediaPlayerProgressBar());
+      }
       Widget muteWidget;
       Widget volumeStepWidget;
       if (entity.supportVolumeMute  || entity.attributes["is_volume_muted"] != null) {
@@ -321,13 +353,13 @@ class _MediaPlayerControlsState extends State<MediaPlayerControls> {
         volumeStepWidget = Row(
           mainAxisSize: MainAxisSize.min,
           children: <Widget>[
-            IconButton(
-                icon: Icon(MaterialDesignIcons.getIconDataFromIconName("mdi:plus")),
-                onPressed: () => _setVolumeUp(entity.entityId)
-            ),
             IconButton(
                 icon: Icon(MaterialDesignIcons.getIconDataFromIconName("mdi:minus")),
                 onPressed: () => _setVolumeDown(entity.entityId)
+            ),
+            IconButton(
+                icon: Icon(MaterialDesignIcons.getIconDataFromIconName("mdi:plus")),
+                onPressed: () => _setVolumeUp(entity.entityId)
             )
           ],
         );
@@ -398,69 +430,47 @@ class _MediaPlayerControlsState extends State<MediaPlayerControls> {
             )
         );
       }
-
+      if (entity.state == EntityState.playing || entity.state == EntityState.paused) {
+        children.add(
+            ButtonBar(
+              children: <Widget>[
+                RaisedButton(
+                  child: Text("Duplicate to"),
+                  color: Colors.blue,
+                  textColor: Colors.white,
+                  onPressed: () => _duplicateTo(entity),
+                ),
+                RaisedButton(
+                  child: Text("Switch to"),
+                  color: Colors.blue,
+                  textColor: Colors.white,
+                  onPressed: () => _switchTo(entity),
+                )
+              ],
+            )
+        );
+      }
     }
     return Column(
       children: children,
     );
   }
 
-}
+  void _duplicateTo(entity) {
-
+    if (entity.canCalculateActualPosition()) {
-class MediaPlayerProgressWidget extends StatefulWidget {
+        HomeAssistant().savedPlayerPosition = entity.getActualPosition().toInt();
-  @override
+    } else {
-  _MediaPlayerProgressWidgetState createState() => _MediaPlayerProgressWidgetState();
+        HomeAssistant().savedPlayerPosition = 0;
-}
-
-class _MediaPlayerProgressWidgetState extends State<MediaPlayerProgressWidget> {
-
-  Timer _timer;
-
-  @override
-  Widget build(BuildContext context) {
-    final EntityModel entityModel = EntityModel.of(context);
-    final MediaPlayerEntity entity = entityModel.entityWrapper.entity;
-    double progress;
-    try {
-      DateTime lastUpdated = DateTime.parse(
-          entity.attributes["media_position_updated_at"]).toLocal();
-      Duration duration = Duration(seconds: entity._getIntAttributeValue("media_duration") ?? 1);
-      Duration position = Duration(seconds: entity._getIntAttributeValue("media_position") ?? 0);
-      int currentPosition = position.inSeconds;
-      if (entity.state == EntityState.playing) {
-        _timer?.cancel();
-        _timer = Timer(Duration(seconds: 1), () {
-          setState(() {
-          });
-        });
-        int differenceInSeconds = DateTime
-            .now()
-            .difference(lastUpdated)
-            .inSeconds;
-        currentPosition = currentPosition + differenceInSeconds;
-      } else {
-        _timer?.cancel();
-      }
-      progress = currentPosition / duration.inSeconds;
-      return LinearProgressIndicator(
-        value: progress,
-        backgroundColor: Colors.black45,
-        valueColor: AlwaysStoppedAnimation<Color>(EntityColor.stateColor(EntityState.on)),
-      );
-    } catch (e) {
-      _timer?.cancel();
-      progress = 0.0;
     }
-    return LinearProgressIndicator(
+    Navigator.of(context).pushNamed("/play-media", arguments: {
-      value: progress,
+        "url": entity.attributes["media_content_id"],
-      backgroundColor: Colors.black45,
+        "type": entity.attributes["media_content_type"]
-    );
+      });
   }
 
-  @override
+  void _switchTo(entity) {
-  void dispose() {
+    HomeAssistant().sendFromPlayerId = entity.entityId;
-    _timer?.cancel();
+    _duplicateTo(entity);
-    super.dispose();
   }
 
 }

lib/entities/select/widgets/select_state.dart

@@ -11,8 +11,12 @@ class SelectStateWidget extends StatefulWidget {
 class _SelectStateWidgetState extends State<SelectStateWidget> {
 
   void setNewState(domain, entityId, newValue) {
-    eventBus.fire(new ServiceCallEvent(domain, "select_option", entityId,
+    ConnectionManager().callService(
-        {"option": "$newValue"}));
+      domain: domain,
+      service: "select_option",
+      entityId: entityId,
+      data: {"option": "$newValue"}
+    );
   }
 
   @override

lib/entities/simple_state.widget.dart

@@ -1,4 +1,4 @@
-part of '../../main.dart';
+part of '../main.dart';
 
 class SimpleEntityState extends StatelessWidget {
 
@@ -7,8 +7,10 @@ class SimpleEntityState extends StatelessWidget {
   final EdgeInsetsGeometry padding;
   final int maxLines;
   final String customValue;
+  final TextStyle textStyle;
+  //final bool bold;
 
-  const SimpleEntityState({Key key, this.maxLines: 10, this.expanded: true, this.textAlign: TextAlign.right, this.padding: const EdgeInsets.fromLTRB(0.0, 0.0, Sizes.rightWidgetPadding, 0.0), this.customValue}) : super(key: key);
+  const SimpleEntityState({Key key,/*this.bold: false,*/ this.maxLines: 10, this.expanded: true, this.textAlign: TextAlign.right, this.textStyle, this.padding: const EdgeInsets.fromLTRB(0.0, 0.0, Sizes.rightWidgetPadding, 0.0), this.customValue}) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -20,24 +22,31 @@ class SimpleEntityState extends StatelessWidget {
     } else {
       state = customValue;
     }
-    TextStyle textStyle =  TextStyle(
+    TextStyle tStyle;
-      fontSize: Sizes.stateFontSize,
+    if (textStyle != null) {
-    );
+      tStyle = textStyle;
-    if (entityModel.entityWrapper.entity.statelessType == StatelessEntityType.CALL_SERVICE) {
+    } else if (entityModel.entityWrapper.entity.statelessType == StatelessEntityType.callService) {
-      textStyle = textStyle.apply(color: Colors.blue);
+      tStyle = Theme.of(context).textTheme.subhead.copyWith(
+        color: HAClientTheme().getLinkTextStyle(context).color
+      );
+    } else {
+      tStyle = Theme.of(context).textTheme.body1;
     }
+    /*if (this.bold) {
+      textStyle = textStyle.apply(fontWeightDelta: 100);
+    }*/
     while (state.contains("  ")){
       state = state.replaceAll("  ", " ");
     }
     Widget result = Padding(
       padding: padding,
       child: Text(
-        "$state ${entityModel.entityWrapper.entity.unitOfMeasurement}",
+        "$state ${entityModel.entityWrapper.unitOfMeasurement}",
         textAlign: textAlign,
         maxLines: maxLines,
         overflow: TextOverflow.ellipsis,
         softWrap: true,
-        style: textStyle
+        style: tStyle
       )
     );
     if (expanded) {

lib/entities/slider/widgets/slider_controls.dart

@@ -18,8 +18,12 @@ class _SliderControlsWidgetState extends State<SliderControlsWidget> {
       _newValue = newValue;
       _changedHere = true;
     });
-    eventBus.fire(new ServiceCallEvent(domain, "set_value", entityId,
+    ConnectionManager().callService(
-        {"value": "${newValue.toString()}"}));
+      domain: domain,
+      service: "set_value",
+      entityId: entityId,
+      data: {"value": "${newValue.toString()}"}
+    );
   }
 
   @override
@@ -36,7 +40,7 @@ class _SliderControlsWidgetState extends State<SliderControlsWidget> {
     } else {
       _changedHere = false;
     }
-    Widget slider = Slider(
+    Widget slider = UniversalSlider(
       min: entity.minValue * _multiplier,
       max: entity.maxValue * _multiplier,
       value: (_newValue <= entity.maxValue) &&
@@ -58,8 +62,7 @@ class _SliderControlsWidgetState extends State<SliderControlsWidget> {
       children: <Widget>[
         Text(
           "$_newValue",
-          style: TextStyle(
+          style: Theme.of(context).textTheme.display1.copyWith(
-            fontSize: Sizes.largeFontSize,
             color: Colors.blue
           ),
         ),

lib/entities/switch/widget/switch_state.dart

@@ -38,8 +38,11 @@ class _SwitchStateWidgetState extends State<SwitchStateWidget> {
     } else {
       domain = entity.domain;
     }
-    eventBus.fire(new ServiceCallEvent(
+    ConnectionManager().callService(
-        domain, (newValue as bool) ? "turn_on" : "turn_off", entity.entityId, null));
+        domain: domain,
+        service: (newValue as bool) ? "turn_on" : "turn_off",
+        entityId: entity.entityId
+      );
   }
 
   @override