Merge branch 'develop'

README.md

@@ -385,6 +385,57 @@ Example:
 }
 ```
 
+### Line Chart
+
+![Crouton-chart-line](https://raw.githubusercontent.com/edfungus/Crouton/master/public/common/images/crouton-chart-line.png)
+
+</br> A simple line chart with multiple lines available. The *labels* corresponds to the x axis values and the *series* corresponds to the y axis values. Multiple sets of (x,y) values can be passed at once as long as the array length of labels and series are matched. The reason why series is multidimensional is so that multiple lines can be drawn where each array in series corresponds to a line. The *update* parameter is expected on update and holds a copy of *values* with the new *labels* and *series* within. *Max* refers to the maximum number of data points based on the x axis is shown. *low* and *high* refers to the maximum y values expected.
+
+*It is suggested that labels and series be prepopulated with one set of (x,y) value for each line*
+
+```json
+Device -> Crouton
+Name: crouton-chart-line
+
+Example:
+"temperature": {
+    "values": {
+        "labels": [1],  [required]
+        "series": [[60]],  [required]
+        "update": null  [required]  
+    },
+    "max": 11, [required]
+    "low": 58,  [required]
+    "high": 73,  [required]
+    "card-type": "crouton-chart-line",  [required]
+    "title": "Temperature (F)" [optional]
+}
+
+3 lines and 1 value:
+"values": {
+    "labels": [1],
+    "series": [[60],[2],[543]],
+    "update": null  
+}
+
+3 lines and 2 values:
+"values": {
+    "labels": [1,2],
+    "series": [[60,62],[2,4],[543,545]],
+    "update": null  
+}
+
+To update temperature:
+"values": {
+    "labels": null,
+    "series": null,
+    "update": {
+      "labels" : [2],
+      "series": [[62]]
+    }
+}
+```
+
 
 ## Advanced cards
 

bower.json

@@ -23,7 +23,7 @@
     "paper-header-panel": "PolymerElements/paper-header-panel#~1.0.5",
     "paper-input": "PolymerElements/paper-input#~1.0.15",
     "paper-button": "PolymerElements/paper-button#~1.0.8",
-    "paper-styles": "PolymerElements/paper-styles#~1.0.11",
+    "paper-styles": "PolymerElements/paper-styles#~1.1.4",
     "iron-form": "PolymerElements/iron-form#~1.0.9",
     "paper-toast": "PolymerElements/paper-toast#~1.0.0",
     "packery": "~1.4.3",

public/app/dashboard-elements/crouton-chart-donut/crouton-chart-donut.jade

@@ -62,9 +62,9 @@ dom-module(id="crouton-chart-donut")
             }
           });
           //Reupdate chart so that it will fit correctly
-          // this.async(function(){
-          //   that.chart.update();
-          // },100);
+          this.async(function(){
+            that.chart.update();
+          },200);
         },
         newValues: function(changeRecord){
           if(this.endPointJson.centerSum && Array.isArray(this.endPointJson.values.series)){

public/app/dashboard-elements/crouton-simple-toggle/crouton-simple-toggle.less

@@ -22,8 +22,9 @@ crouton-simple-toggle{
     --paper-toggle-button-checked-button-color:  @button-normal;
 
     .toggle-container.paper-toggle-button {
-      margin-left: auto;
-      margin-right: auto;
+      margin-left: auto !important;
+      margin-right: auto !important;
+      padding-left: 2px;
     }
   }
 

public/app/documentation/documentation.md

@@ -383,6 +383,57 @@ Example:
 }
 ```
 
+### Line Chart
+
+![Crouton-chart-line](/static/common/images/crouton-chart-line.png)
+
+</br> A simple line chart with multiple lines available. The *labels* corresponds to the x axis values and the *series* corresponds to the y axis values. Multiple sets of (x,y) values can be passed at once as long as the array length of labels and series are matched. The reason why series is multidimensional is so that multiple lines can be drawn where each array in series corresponds to a line. The *update* parameter is expected on update and holds a copy of *values* with the new *labels* and *series* within. *Max* refers to the maximum number of data points based on the x axis is shown. *low* and *high* refers to the maximum y values expected.
+
+*It is suggested that labels and series be prepopulated with one set of (x,y) value for each line* 
+
+```json
+Device -> Crouton
+Name: crouton-chart-line
+
+Example:
+"temperature": {
+    "values": {
+        "labels": [1],  [required]
+        "series": [[60]],  [required]
+        "update": null  [required]  
+    },
+    "max": 11, [required]
+    "low": 58,  [required]
+    "high": 73,  [required]
+    "card-type": "crouton-chart-line",  [required]
+    "title": "Temperature (F)" [optional]
+}
+
+3 lines and 1 value:
+"values": {
+    "labels": [1],
+    "series": [[60],[2],[543]],
+    "update": null  
+}
+
+3 lines and 2 values:
+"values": {
+    "labels": [1,2],
+    "series": [[60,62],[2,4],[543,545]],
+    "update": null  
+}
+
+To update temperature:
+"values": {
+    "labels": null,
+    "series": null,
+    "update": {
+      "labels" : [2],
+      "series": [[62]]
+    }
+}
+```
+
 
 ## Advanced cards