From 83eb223169612a25af72cc961e31015d709c5e4c Mon Sep 17 00:00:00 2001
From: Tom Duijf <tom.duijf@gmail.com>
Date: Tue, 27 Oct 2015 22:08:36 +0000
Subject: [PATCH 1/3] Add color temp slider if ct_color is supported

---
 src/more-infos/more-info-light.html | 12 +++++++++++-
 src/more-infos/more-info-light.js   | 19 ++++++++++++++++++-
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/src/more-infos/more-info-light.html b/src/more-infos/more-info-light.html
index 123eeb5c3f..85025733a5 100644
--- a/src/more-infos/more-info-light.html
+++ b/src/more-infos/more-info-light.html
@@ -40,9 +40,19 @@
           on-change='brightnessSliderChanged' class='flex'>
         </paper-slider>
       </div>
+      <template is="dom-if" if="{{ctSliderValue}}">
+        <div class='brightness center horizontal layout'>
+          <div>Color temperature</div>
+          <paper-slider min="154" max="500"
+            id='ct' value='{{ctSliderValue}}'
+            on-change='ctSliderChanged' class='flex'>
+          </paper-slider>
+        </div>
+      </template>
 
       <ha-color-picker on-colorselected='colorPicked' width='350' height='200'>
-      </color-picker>
+      </ha-color-picker>
+
     </div>
   </template>
 </dom-module>
diff --git a/src/more-infos/more-info-light.js b/src/more-infos/more-info-light.js
index 552be2e7f4..c938c83c2d 100644
--- a/src/more-infos/more-info-light.js
+++ b/src/more-infos/more-info-light.js
@@ -5,7 +5,7 @@ import attributeClassNames from '../util/attribute-class-names';
 
 require('../components/ha-color-picker');
 
-const ATTRIBUTE_CLASSES = ['brightness', 'xy_color'];
+const ATTRIBUTE_CLASSES = ['brightness', 'xy_color', 'ct_color'];
 
 export default new Polymer({
   is: 'more-info-light',
@@ -20,11 +20,17 @@ export default new Polymer({
       type: Number,
       value: 0,
     },
+
+    ctSliderValue: {
+      type: Number,
+      value: 0,
+    },
   },
 
   stateObjChanged(newVal) {
     if (newVal && newVal.state === 'on') {
       this.brightnessSliderValue = newVal.attributes.brightness;
+      this.ctSliderValue = newVal.attributes.ct_color;
     }
 
     this.async(() => this.fire('iron-resize'), 500);
@@ -49,6 +55,17 @@ export default new Polymer({
     }
   },
 
+  ctSliderChanged(ev) {
+    const ct = parseInt(ev.target.value, 10);
+
+    if (isNaN(ct)) return;
+
+    serviceActions.callService('light', 'turn_on', {
+      entity_id: this.stateObj.entityId,
+      ct_color: ct,
+    });
+  },
+
   colorPicked(ev) {
     const color = ev.detail.rgb;
 

From f86f52134c4df7a4362160da551a53598beea3ec Mon Sep 17 00:00:00 2001
From: Tom Duijf <tom.duijf@gmail.com>
Date: Wed, 28 Oct 2015 22:34:39 +0000
Subject: [PATCH 2/3] Renamed to color_temp, fixed css

---
 src/more-infos/more-info-light.html | 28 +++++++++++++++++++---------
 src/more-infos/more-info-light.js   |  6 +++---
 2 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/src/more-infos/more-info-light.html b/src/more-infos/more-info-light.html
index 85025733a5..b8122c4c2f 100644
--- a/src/more-infos/more-info-light.html
+++ b/src/more-infos/more-info-light.html
@@ -13,6 +13,14 @@
       transition: max-height .5s ease-in;
     }
 
+    .color_temp {
+      margin-bottom: 8px;
+
+      max-height: 0px;
+      overflow: hidden;
+      transition: max-height .5s ease-in;
+    }
+
     ha-color-picker {
       display: block;
       width: 350px;
@@ -27,6 +35,10 @@
       max-height: 40px;
     }
 
+    .has-color_temp .color_temp {
+      max-height: 40px;
+    }
+
     .has-xy_color ha-color-picker {
       max-height: 500px;
     }
@@ -40,15 +52,13 @@
           on-change='brightnessSliderChanged' class='flex'>
         </paper-slider>
       </div>
-      <template is="dom-if" if="{{ctSliderValue}}">
-        <div class='brightness center horizontal layout'>
-          <div>Color temperature</div>
-          <paper-slider min="154" max="500"
-            id='ct' value='{{ctSliderValue}}'
-            on-change='ctSliderChanged' class='flex'>
-          </paper-slider>
-        </div>
-      </template>
+      <div class='color_temp center horizontal layout'>
+        <div>Color temperature</div>
+        <paper-slider min="154" max="500"
+          id='color_temp' value='{{ctSliderValue}}'
+          on-change='ctSliderChanged' class='flex'>
+        </paper-slider>
+      </div>
 
       <ha-color-picker on-colorselected='colorPicked' width='350' height='200'>
       </ha-color-picker>
diff --git a/src/more-infos/more-info-light.js b/src/more-infos/more-info-light.js
index c938c83c2d..a37dbaa690 100644
--- a/src/more-infos/more-info-light.js
+++ b/src/more-infos/more-info-light.js
@@ -5,7 +5,7 @@ import attributeClassNames from '../util/attribute-class-names';
 
 require('../components/ha-color-picker');
 
-const ATTRIBUTE_CLASSES = ['brightness', 'xy_color', 'ct_color'];
+const ATTRIBUTE_CLASSES = ['brightness', 'xy_color', 'color_temp'];
 
 export default new Polymer({
   is: 'more-info-light',
@@ -30,7 +30,7 @@ export default new Polymer({
   stateObjChanged(newVal) {
     if (newVal && newVal.state === 'on') {
       this.brightnessSliderValue = newVal.attributes.brightness;
-      this.ctSliderValue = newVal.attributes.ct_color;
+      this.ctSliderValue = newVal.attributes.color_temp;
     }
 
     this.async(() => this.fire('iron-resize'), 500);
@@ -62,7 +62,7 @@ export default new Polymer({
 
     serviceActions.callService('light', 'turn_on', {
       entity_id: this.stateObj.entityId,
-      ct_color: ct,
+      color_temp: ct,
     });
   },
 

From 9e684eaecfa504b52764374cf8166ce003825a52 Mon Sep 17 00:00:00 2001
From: Tom Duijf <tom.duijf@gmail.com>
Date: Wed, 28 Oct 2015 22:39:10 +0000
Subject: [PATCH 3/3] doh, learn to read instructions

---
 src/more-infos/more-info-light.html | 10 +---------
 1 file changed, 1 insertion(+), 9 deletions(-)

diff --git a/src/more-infos/more-info-light.html b/src/more-infos/more-info-light.html
index b8122c4c2f..1af4c7c7b6 100644
--- a/src/more-infos/more-info-light.html
+++ b/src/more-infos/more-info-light.html
@@ -5,15 +5,7 @@
 
 <dom-module id='more-info-light'>
   <style>
-    .brightness {
-      margin-bottom: 8px;
-
-      max-height: 0px;
-      overflow: hidden;
-      transition: max-height .5s ease-in;
-    }
-
-    .color_temp {
+    .brightness, .color_temp {
       margin-bottom: 8px;
 
       max-height: 0px;