diff --git a/homeassistant/components/frontend/version.py b/homeassistant/components/frontend/version.py
index cd7ca59febb52d01a2e92083788868ee1b5ae8aa..1d14bf5120c08e40c950d544fc85951c1e28f02d 100644
--- a/homeassistant/components/frontend/version.py
+++ b/homeassistant/components/frontend/version.py
@@ -1,2 +1,2 @@
""" DO NOT MODIFY. Auto-generated by build_frontend script """
-VERSION = "c164af7349b4750365f03b190e11cc8d"
+VERSION = "d98b2e8d6f35dfd544cbdf10f3054617"
diff --git a/homeassistant/components/frontend/www_static/frontend.html b/homeassistant/components/frontend/www_static/frontend.html
index a2d42c0df711eb028696b179ae4cd7b6f95ccc77..d83496f2fe5b44e852d134621ba66773b8e0c688 100644
--- a/homeassistant/components/frontend/www_static/frontend.html
+++ b/homeassistant/components/frontend/www_static/frontend.html
@@ -6000,7 +6000,7 @@ function(t,e,n){function r(){this._events=this._events||{},this._maxListeners=th
<script>
(function() {
- var DOMAINS_WITH_CARD = ['thermostat', 'configurator', 'scene'];
+ var DOMAINS_WITH_CARD = ['thermostat', 'configurator', 'scene', 'media_player'];
var DOMAINS_WITH_MORE_INFO = [
'light', 'group', 'sun', 'configurator', 'thermostat', 'script'
];
@@ -21647,26 +21647,32 @@ Polymer({
<style>
:host {
line-height: normal;
+ min-width: 150px;
+ white-space: nowrap;
}
state-badge {
float: left;
}
+ .info {
+ margin-left: 60px;
+ }
+
.name {
- text-transform: capitalize;
+ text-transform: capitalize;
font-weight: 300;
font-size: 1.3rem;
- }
-
- .info {
- margin-left: 60px;
+ text-overflow: ellipsis;
+ overflow-x: hidden;
}
.time-ago {
color: darkgrey;
margin-top: -2px;
font-size: 1rem;
+ text-overflow: ellipsis;
+ overflow-x: hidden;
}
</style>
@@ -21682,7 +21688,7 @@ Polymer({
<relative-ha-datetime datetime-obj="[[stateObj.lastChangedAsDate]]"></relative-ha-datetime>
</div>
-
+
</div>
</div>
</template>
@@ -21705,7 +21711,8 @@ Polymer({
},
});
})();
-</script><dom-module id="state-card-display" assetpath="cards/">
+</script>
+<dom-module id="state-card-display" assetpath="cards/">
<style>
.state {
margin-left: 16px;
@@ -22171,7 +22178,62 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
});
})();
-</script><dom-module id="state-card-content" assetpath="cards/">
+</script><dom-module id="state-card-media_player" assetpath="cards/">
+ <style>
+ :host {
+ line-height: normal;
+ }
+
+ .state {
+ margin-left: 16px;
+ text-align: right;
+ }
+
+ .main-text {
+ white-space: nowrap;
+ overflow-x: hidden;
+ text-overflow: ellipsis;
+ text-transform: capitalize;
+ font-weight: 300;
+ font-size: 1.3rem;
+ }
+
+ .secondary-text {
+ color: darkgrey;
+ margin-top: -2px;
+ font-size: 1rem;
+ }
+ </style>
+ <template>
+ <div class="horizontal justified layout">
+ <state-info state-obj="[[stateObj]]"></state-info>
+ <div class="state">
+ <template is="dom-if" if="[[stateObj.attributes.media_title]]">
+ <div class="main-text">[[stateObj.attributes.media_title]]</div>
+ <div class="secondary-text">[[stateObj.stateDisplay]]</div>
+ </template>
+ <template is="dom-if" if="[[!stateObj.attributes.media_title]]">
+ <div class="main-text">[[stateObj.stateDisplay]]</div>
+ </template>
+ </div>
+ </div>
+ </template>
+</dom-module>
+
+<script>
+(function() {
+ Polymer({
+ is: 'state-card-media_player',
+
+ properties: {
+ stateObj: {
+ type: Object,
+ },
+ },
+ });
+})();
+</script>
+<dom-module id="state-card-content" assetpath="cards/">
<style>
:host {
display: block;
diff --git a/homeassistant/components/frontend/www_static/polymer/cards/state-card-content.html b/homeassistant/components/frontend/www_static/polymer/cards/state-card-content.html
index 13960a7037980f99cc18a47962da74e96353328b..0feed86de002d4c12314894a32df50a845c43dba 100644
--- a/homeassistant/components/frontend/www_static/polymer/cards/state-card-content.html
+++ b/homeassistant/components/frontend/www_static/polymer/cards/state-card-content.html
@@ -5,6 +5,7 @@
<link rel="import" href="state-card-thermostat.html">
<link rel="import" href="state-card-configurator.html">
<link rel="import" href="state-card-scene.html">
+<link rel="import" href="state-card-media_player.html">
<dom-module id="state-card-content">
<style>
diff --git a/homeassistant/components/frontend/www_static/polymer/cards/state-card-media_player.html b/homeassistant/components/frontend/www_static/polymer/cards/state-card-media_player.html
new file mode 100644
index 0000000000000000000000000000000000000000..4c405149efee278b11525626807f5d56c245c521
--- /dev/null
+++ b/homeassistant/components/frontend/www_static/polymer/cards/state-card-media_player.html
@@ -0,0 +1,59 @@
+<link rel="import" href="../bower_components/polymer/polymer.html">
+
+<link rel="import" href="../components/state-info.html">
+
+<dom-module id="state-card-media_player">
+ <style>
+ :host {
+ line-height: normal;
+ }
+
+ .state {
+ margin-left: 16px;
+ text-align: right;
+ }
+
+ .main-text {
+ white-space: nowrap;
+ overflow-x: hidden;
+ text-overflow: ellipsis;
+ text-transform: capitalize;
+ font-weight: 300;
+ font-size: 1.3rem;
+ }
+
+ .secondary-text {
+ color: darkgrey;
+ margin-top: -2px;
+ font-size: 1rem;
+ }
+ </style>
+ <template>
+ <div class='horizontal justified layout'>
+ <state-info state-obj="[[stateObj]]"></state-info>
+ <div class='state'>
+ <template is='dom-if' if='[[stateObj.attributes.media_title]]'>
+ <div class='main-text'>[[stateObj.attributes.media_title]]</div>
+ <div class='secondary-text'>[[stateObj.stateDisplay]]</div>
+ </template>
+ <template is='dom-if' if='[[!stateObj.attributes.media_title]]'>
+ <div class='main-text'>[[stateObj.stateDisplay]]</div>
+ </template>
+ </div>
+ </div>
+ </template>
+</dom-module>
+
+<script>
+(function() {
+ Polymer({
+ is: 'state-card-media_player',
+
+ properties: {
+ stateObj: {
+ type: Object,
+ },
+ },
+ });
+})();
+</script>
diff --git a/homeassistant/components/frontend/www_static/polymer/components/state-info.html b/homeassistant/components/frontend/www_static/polymer/components/state-info.html
index 44dceac415b1a4f78b09a30c09fb2505f20921d8..50b10fa91a9b1d6b7b33244142d8b03f9d81e53e 100755
--- a/homeassistant/components/frontend/www_static/polymer/components/state-info.html
+++ b/homeassistant/components/frontend/www_static/polymer/components/state-info.html
@@ -8,26 +8,32 @@
<style>
:host {
line-height: normal;
+ min-width: 150px;
+ white-space: nowrap;
}
state-badge {
float: left;
}
+ .info {
+ margin-left: 60px;
+ }
+
.name {
- text-transform: capitalize;
+ text-transform: capitalize;
font-weight: 300;
font-size: 1.3rem;
- }
-
- .info {
- margin-left: 60px;
+ text-overflow: ellipsis;
+ overflow-x: hidden;
}
.time-ago {
color: darkgrey;
margin-top: -2px;
font-size: 1rem;
+ text-overflow: ellipsis;
+ overflow-x: hidden;
}
</style>
@@ -43,7 +49,7 @@
<relative-ha-datetime datetime-obj='[[stateObj.lastChangedAsDate]]'></relative-ha-datetime>
<!-- </core-tooltip> -->
</div>
-
+
</div>
</div>
</template>
@@ -66,4 +72,4 @@
},
});
})();
-</script>
\ No newline at end of file
+</script>
diff --git a/homeassistant/components/frontend/www_static/polymer/resources/home-assistant-js.html b/homeassistant/components/frontend/www_static/polymer/resources/home-assistant-js.html
index ff00667bdb6316a1a1e196c3e9b54bbb21e44eb1..8d89b702a67ff3424aaea8d0339f741619a80813 100644
--- a/homeassistant/components/frontend/www_static/polymer/resources/home-assistant-js.html
+++ b/homeassistant/components/frontend/www_static/polymer/resources/home-assistant-js.html
@@ -2,7 +2,7 @@
<script>
(function() {
- var DOMAINS_WITH_CARD = ['thermostat', 'configurator', 'scene'];
+ var DOMAINS_WITH_CARD = ['thermostat', 'configurator', 'scene', 'media_player'];
var DOMAINS_WITH_MORE_INFO = [
'light', 'group', 'sun', 'configurator', 'thermostat', 'script'
];