few changes in android agent and added android sense realtime graphs

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.agent/app/src/main/java/org/wso2/carbon/iot/android/sense/data/publisher/DataPublisherService.java

@@ -70,34 +70,39 @@ public class DataPublisherService extends Service {
                     for (SensorData sensorData : sensorDataMap) {
                         Event event = new Event();
                         event.setTimestamp(sensorData.getTimestamp());
-
                         switch (sensorData.getSensorType()) {
                             case Sensor.TYPE_ACCELEROMETER:
                                 event.setAccelerometer(sensorData.getSensorValues());
+                                events.add(event);
                                 break;
                             case Sensor.TYPE_MAGNETIC_FIELD:
                                 event.setMagnetic(sensorData.getSensorValues());
+                                events.add(event);
                                 break;
                             case Sensor.TYPE_GYROSCOPE:
                                 event.setGyroscope(sensorData.getSensorValues());
+                                events.add(event);
                                 break;
                             case Sensor.TYPE_LIGHT:
                                 event.setLight(sensorData.getSensorValues()[0]);
                                 break;
                             case Sensor.TYPE_PRESSURE:
                                 event.setPressure(sensorData.getSensorValues()[0]);
+                                events.add(event);
                                 break;
                             case Sensor.TYPE_PROXIMITY:
                                 event.setProximity(sensorData.getSensorValues()[0]);
+                                events.add(event);
                                 break;
                             case Sensor.TYPE_GRAVITY:
                                 event.setGravity(sensorData.getSensorValues());
+                                events.add(event);
                                 break;
-                            case Sensor.TYPE_ROTATION_VECTOR:
+                            case Sensor.TYPE_GAME_ROTATION_VECTOR:
-                                event.setGravity(sensorData.getSensorValues());
+                                event.setRotation(sensorData.getSensorValues());
+                                events.add(event);
                                 break;
                         }
-                        events.add(event);
                     }
                     SenseDataHolder.resetSensorDataHolder();
 

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.agent/app/src/main/java/org/wso2/carbon/iot/android/sense/event/streams/Sensor/SensorDataReader.java

@@ -70,7 +70,6 @@ public class SensorDataReader extends DataReader implements SensorEventListener
             } catch (Throwable e) {
                 Log.d(TAG, "error on sensors");
             }
-
         }
         mSensorManager.unregisterListener(this);
     }

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.analytics/src/main/resources/carbonapps/Android_Sense/EventExecution_AndroidSense_1.0.0/EventExecution_AndroidSense.siddhiql

@@ -2,7 +2,7 @@
 @Plan:name('android_sense_execution')
 
 /* Enter a unique description for ExecutionPlan */
--- @Plan:description('ExecutionPlan')
+-- @Plan:description('android_sense_execution')
 
 /* define streams/tables and write queries here ... */
 

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android_sense.device-view/device-view.hbs

@@ -14,7 +14,7 @@
         Operations
     </div>
     <div class="add-margin-top-4x">
-        {{unit "iot.unit.device.operation-bar" device=device backendApiUri=backendApiUri}}
+        {{unit "iot.unit.device.operation-bar" device=device backendApiUri=backendApiUri autoCompleteParams=autoCompleteParams}}
     </div>
 {{/zone}}
 
@@ -38,7 +38,7 @@
                 <div class="panel panel-default tab-pane active"
                      id="device_statistics" role="tabpanel" aria-labelledby="device_statistics">
                     <div class="panel-heading">Device Statistics</div>
-                    {{unit "iot.unit.device.stats" device=device}}
+                    {{unit "cdmf.unit.device.type.android_sense.realtime.analytics-view" device=device}}
                 </div>
                 <div class="panel panel-default tab-pane" id="device_location" role="tabpanel"
                      aria-labelledby="device_location">

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android_sense.device-view/device-view.js

@@ -20,14 +20,19 @@ function onRequest(context) {
     var log = new Log("device-view.js");
     var deviceType = context.uriParams.deviceType;
     var deviceId = request.getParameter("id");
-    var devicemgtProps = require('/app/conf/devicemgt-props.js').config();
+    var autoCompleteParams = [
+        {"name" : "deviceId", "value" : deviceId}
+    ];
 
-    if (deviceType && deviceId) {
+    if (deviceType != null && deviceType != undefined && deviceId != null && deviceId != undefined) {
         var deviceModule = require("/app/modules/device.js").deviceModule;
         var device = deviceModule.viewDevice(deviceType, deviceId);
-
         if (device && device.status != "error") {
-            return {"device": device, "backendApiUri" : devicemgtProps["httpsURL"] + "/android_sense/"};
+            return {
+                "device": device,
+                "backendApiUri": devicemgtProps["httpsURL"] + "/android_sense/",
+                "autoCompleteParams": autoCompleteParams
+            };
         } else {
             response.sendError(404, "Device Id " + deviceId + " of type " + deviceType + " cannot be found!");
             exit();

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android_sense.realtime.analytics-view/analytics-view.hbs

@@ -0,0 +1,106 @@
+
+{{#zone "topCss"}}
+    {{css "css/graph.css"}}
+{{/zone}}
+<span id="details" data-devicetype="{{device.type}}" data-deviceid="{{device.deviceIdentifier}}"
+      data-appcontext="{{@app.context}}"></span>
+<div id="chartWrapper">
+</div>
+<div id="div-chart" data-websocketurl="{{websocketEndpoint}}">
+    <div id="chartWrapper-battery" class="chartWrapper"><div id="y_axis-battery" class="custom_y_axis">Battery</div>
+        <div class="legend_container-battery">
+            <div id="smoother-battery" title="Smoothing"></div>
+            <div id="legend-battery"></div>
+        </div>
+        <div id="chart-battery" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-light" class="chartWrapper"><div id="y_axis-light" class="custom_y_axis">Light</div>
+        <div class="legend_container-light">
+            <div id="smoother-light" title="Smoothing"></div>
+            <div id="legend-light"></div>
+        </div>
+        <div id="chart-light" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-pressure" class="chartWrapper"><div id="y_axis-pressure" class="custom_y_axis">Pressure</div>
+        <div class="legend_container-pressure">
+            <div id="smoother-pressure" title="Smoothing"></div>
+            <div id="legend-pressure"></div>
+        </div>
+        <div id="chart-pressure" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-proximity" class="chartWrapper"><div id="y_axis-proximity" class="custom_y_axis">Proximity</div>
+        <div class="legend_container-proximity">
+            <div id="smoother-proximity" title="Smoothing"></div>
+            <div id="legend-proximity"></div>
+        </div>
+        <div id="chart-proximity" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-accelerometer" class="chartWrapper"><div id="y_axis-accelerometer" class="custom_y_axis">Accelerometer</div>
+        <div class="legend_container-accelerometer">
+            <div id="smoother-accelerometer" title="Smoothing"></div>
+            <div id="legend-accelerometer"></div>
+        </div>
+        <div id="chart-accelerometer" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-magnetic" class="chartWrapper"><div id="y_axis-magnetic" class="custom_y_axis">Magnetic</div>
+        <div class="legend_container-magnetic">
+            <div id="smoother-magnetic" title="Smoothing"></div>
+            <div id="legend-magnetic"></div>
+        </div>
+        <div id="chart-magnetic" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-rotation" class="chartWrapper"><div id="y_axis-rotation" class="custom_y_axis">Rotation</div>
+        <div class="legend_container-rotation">
+            <div id="smoother-rotation" title="Smoothing"></div>
+            <div id="legend-rotation"></div>
+        </div>
+        <div id="chart-rotation" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-gyroscope" class="chartWrapper"><div id="y_axis-gyroscope" class="custom_y_axis">Gyroscope</div>
+        <div class="legend_container-gyroscope">
+            <div id="smoother-gyroscope" title="Smoothing"></div>
+            <div id="legend-gyroscope"></div>
+        </div>
+        <div id="chart-gyroscope" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+    <div id="chartWrapper-gravity" class="chartWrapper"><div id="y_axis-gravity" class="custom_y_axis">Gravity</div>
+        <div class="legend_container-gravity">
+            <div id="smoother-gravity" title="Smoothing"></div>
+            <div id="legend-gravity"></div>
+        </div>
+        <div id="chart-gravity" class="custom_rickshaw_graph"></div>
+        <div class="custom_x_axis">Time</div>
+    </div>
+
+</div>
+<a class="padding-left"
+   href="{{@app.context}}/device/{{device.type}}/analytics?deviceId={{device.deviceIdentifier}}&deviceName={{device.name}}">
+    <span class="fw-stack">
+        <i class="fw fw-ring fw-stack-2x"></i>
+        <i class="fw fw-statistics fw-stack-1x"></i>
+    </span> View Device Analytics
+</a>
+<!-- /statistics -->
+{{#zone "bottomJs"}}
+    {{js "js/d3.min.js"}}
+    {{js "js/rickshaw.min.js"}}
+    {{js "js/moment.min.js"}}
+    {{js "js/socket.io.min.js"}}
+    {{js "js/device-stats.js"}}
+{{/zone}}

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android_sense.realtime.analytics-view/analytics-view.js

@@ -0,0 +1,33 @@
+/*
+ * Copyright (c) 2016, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 Inc. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+function onRequest(context) {
+    var log = new Log("stats.js");
+    var device = context.unit.params.device;
+    var devicemgtProps = require('/app/conf/devicemgt-props.js').config();
+    var constants = require("/app/modules/constants.js");
+    var websocketEndpoint = devicemgtProps["httpsURL"].replace("https", "wss");
+    var tokenPair = session.get(constants.ACCESS_TOKEN_PAIR_IDENTIFIER);
+    var token = ""
+    if (tokenPair) {
+        token =  tokenPair.accessToken;
+    }
+    websocketEndpoint = websocketEndpoint + "/secured-outputui/org.wso2.iot.android.sense/1.0.0?" +
+    "token="+ token +"&deviceId=" + device.deviceIdentifier + "&deviceType=" + device.type;
+    return {"device": device, "websocketEndpoint" : websocketEndpoint};
+}

components/iot-plugins/androidsense-plugin/org.wso2.carbon.device.mgt.iot.androidsense.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android_sense.realtime.analytics-view/public/js/device-stats.js

@@ -0,0 +1,306 @@
+/*
+ * Copyright (c) 2016, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 Inc. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+var ws;
+var typeId = 3;
+var batteryId = 5;
+var gps_latId = 6;
+var gps_longId = 7;
+var accelerometer_xId = 8;
+var accelerometer_yId = 9;
+var accelerometer_zId = 10;
+var magnetic_xId = 11;
+var magnetic_yId = 12;
+var magnetic_zId = 13;
+var gyroscope_xId = 14;
+var gyroscope_yId = 15;
+var gyroscope_zId = 16;
+var lightId = 17;
+var pressureId = 18;
+var proximityId = 19;
+var gravity_xId = 20;
+var gravity_yId = 21;
+var gravity_zId = 22;
+var rotation_xId = 23;
+var rotation_yId = 24;
+var rotation_zId = 25;
+var wordId = 26;
+var word_sessionIdId = 27;
+var word_statusId = 28;
+
+var battery;
+var batteryData = [];
+
+var light;
+var lightData = [];
+
+var pressure;
+var pressureData = [];
+
+var proximity;
+var proximityData = [];
+
+var accelerometer;
+var accelerometer_xData = [];
+var accelerometer_yData = [];
+var accelerometer_zData = [];
+
+var magnetic;
+var magnetic_xData = [];
+var magnetic_yData = [];
+var magnetic_zData = [];
+
+var gyroscope;
+var gyroscope_xData = [];
+var gyroscope_yData = [];
+var gyroscope_zData = [];
+
+var gravity;
+var gravity_xData = [];
+var gravity_yData = [];
+var gravity_zData = [];
+
+var rotation;
+var rotation_xData = [];
+var rotation_yData = [];
+var rotation_zData = [];
+
+var palette = new Rickshaw.Color.Palette({scheme: "classic9"});
+
+$(window).load(function () {
+
+	battery = lineGraph("battery", batteryData);
+	light = lineGraph("light", lightData);
+	pressure = lineGraph("pressure", pressureData);
+	proximity = lineGraph("proximity", proximityData);
+	accelerometer = threeDlineGraph("accelerometer", accelerometer_xData, accelerometer_yData, accelerometer_zData);
+	magnetic = threeDlineGraph("magnetic", magnetic_xData, magnetic_yData, magnetic_zData);
+	gyroscope = threeDlineGraph("gyroscope", gyroscope_xData, gyroscope_yData, gyroscope_zData);
+	gravity = threeDlineGraph("gravity", gravity_xData, gravity_yData, gravity_zData);
+	rotation = threeDlineGraph("rotation", rotation_xData, rotation_yData, rotation_zData);
+
+	var websocketUrl = $("#div-chart").data("websocketurl");
+	connect(websocketUrl)
+});
+
+$(window).unload(function () {
+	disconnect();
+});
+
+function threeDlineGraph(type, xChartData, yChartData, zChartData) {
+	var tNow = new Date().getTime() / 1000;
+	for (var i = 0; i < 30; i++) {
+		xChartData.push({
+			x: tNow - (30 - i) * 15,
+			y: parseFloat(0)
+		});
+		yChartData.push({
+			x: tNow - (30 - i) * 15,
+			y: parseFloat(0)
+		});
+		zChartData.push({
+			x: tNow - (30 - i) * 15,
+			y: parseFloat(0)
+		});
+	}
+
+	var graph = new Rickshaw.Graph({
+		element: document.getElementById("chart-" + type),
+		width: $("#div-chart").width() - 50,
+		height: 300,
+		renderer: "line",
+		padding: {top: 0.2, left: 0.0, right: 0.0, bottom: 0.2},
+		xScale: d3.time.scale(),
+		series: [
+			{'color': palette.color(), 'data': xChartData, 'name': "x - " + type},
+			{'color': palette.color(), 'data': yChartData, 'name': "y - " + type},
+			{'color': palette.color(), 'data': zChartData, 'name': "z - " + type}
+		]
+	});
+
+	graph.render();
+
+	var xAxis = new Rickshaw.Graph.Axis.Time({
+		graph: graph
+	});
+
+	xAxis.render();
+
+	new Rickshaw.Graph.Legend({
+		graph: graph,
+		element: document.getElementById('legend-' + type)
+	});
+
+	var detail = new Rickshaw.Graph.HoverDetail({
+		graph: graph
+	});
+
+	return graph;
+}
+
+function lineGraph(type, chartData) {
+	var tNow = new Date().getTime() / 1000;
+	for (var i = 0; i < 30; i++) {
+		chartData.push({
+			x: tNow - (30 - i) * 15,
+			y: parseFloat(0)
+		});
+	}
+
+	var graph = new Rickshaw.Graph({
+		element: document.getElementById("chart-" + type),
+		width: $("#div-chart").width() - 50,
+		height: 300,
+		renderer: "line",
+		padding: {top: 0.2, left: 0.0, right: 0.0, bottom: 0.2},
+		xScale: d3.time.scale(),
+		series: [{
+			'color': palette.color(),
+			'data': chartData,
+			'name': type
+		}]
+	});
+
+	graph.render();
+
+	var xAxis = new Rickshaw.Graph.Axis.Time({
+		graph: graph
+	});
+
+	xAxis.render();
+
+	new Rickshaw.Graph.Axis.Y({
+		graph: graph,
+		orientation: 'left',
+		height: 300,
+		tickFormat: Rickshaw.Fixtures.Number.formatKMBT,
+		element: document.getElementById('y_axis')
+	});
+
+	new Rickshaw.Graph.Legend({
+		graph: graph,
+		element: document.getElementById('legend-' + type)
+	});
+
+	new Rickshaw.Graph.HoverDetail({
+		graph: graph,
+		formatter: function (series, x, y) {
+			var date = '<span class="date">' + moment(x * 1000).format('Do MMM YYYY h:mm:ss a') + '</span>';
+			var swatch = '<span class="detail_swatch" style="background-color: ' + series.color + '"></span>';
+			return swatch + series.name + ": " + parseInt(y) + '<br>' + date;
+		}
+	});
+
+	return graph;
+}
+
+//websocket connection
+function connect(target) {
+	if ('WebSocket' in window) {
+		ws = new WebSocket(target);
+	} else if ('MozWebSocket' in window) {
+		ws = new MozWebSocket(target);
+	} else {
+		console.log('WebSocket is not supported by this browser.');
+	}
+	if (ws) {
+		ws.onmessage = function (event) {
+			var dataPoint = JSON.parse(event.data);
+			if (dataPoint) {
+				var time = parseInt(dataPoint[4]) / 1000;
+				switch (dataPoint[typeId]) {
+					case "battery":
+						graphUpdate(batteryData, time, dataPoint[batteryId], battery);
+						break;
+
+					case "light":
+						graphUpdate(lightData, time, dataPoint[lightId], light);
+						break;
+
+					case "pressure":
+						graphUpdate(pressureData, time, dataPoint[pressureId], pressure);
+						break;
+
+					case "proximity":
+						graphUpdate(proximityData, time, dataPoint[proximityId], proximity);
+						break;
+
+					case "accelerometer":
+						dataUpdate(accelerometer_xData, time, dataPoint[accelerometer_xId]);
+						dataUpdate(accelerometer_yData, time, dataPoint[accelerometer_yId]);
+						dataUpdate(accelerometer_zData, time, dataPoint[accelerometer_zId]);
+						accelerometer.update();
+						break;
+
+					case "magnetic":
+						dataUpdate(magnetic_xData, time, dataPoint[magnetic_xId]);
+						dataUpdate(magnetic_yData, time, dataPoint[magnetic_yId]);
+						dataUpdate(magnetic_zData, time, dataPoint[magnetic_zId]);
+						magnetic.update();
+						break;
+
+					case "gyroscope":
+						dataUpdate(gyroscope_xData, time, dataPoint[gyroscope_xId]);
+						dataUpdate(gyroscope_yData, time, dataPoint[gyroscope_yId]);
+						dataUpdate(gyroscope_zData, time, dataPoint[gyroscope_zId]);
+						gyroscope.update();
+						break;
+
+					case "rotation":
+						dataUpdate(magnetic_xData, time, dataPoint[rotation_xId]);
+						dataUpdate(magnetic_yData, time, dataPoint[rotation_yId]);
+						dataUpdate(magnetic_zData, time, dataPoint[rotation_zId]);
+						rotation.update();
+						break;
+
+					case "gravity":
+						dataUpdate(gravity_xData, time, dataPoint[gravity_xId]);
+						dataUpdate(gravity_yData, time, dataPoint[gravity_yId]);
+						dataUpdate(gravity_zData, time, dataPoint[gravity_zId]);
+						gravity.update();
+						break;
+				}
+			}
+		};
+	}
+}
+
+function graphUpdate(chartData, xValue, yValue, graph) {
+	chartData.push({
+		x: parseInt(xValue),
+		y: parseFloat(yValue)
+	});
+	chartData.shift();
+	graph.update();
+}
+
+function dataUpdate(chartData, xValue, yValue) {
+	chartData.push({
+		x: parseInt(xValue),
+		y: parseFloat(yValue)
+	});
+	chartData.shift();
+}
+
+
+function disconnect() {
+	if (ws != null) {
+		ws.close();
+		ws = null;
+	}
+}

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Accelerometer/Sparkscripts_1.0.0/Accelerometer_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceAccelerometerData USING CarbonAnalytics OPTIONS(tab
 
 CREATE TEMPORARY TABLE DeviceAccelerometerSummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_ACCELEROMETER_SUMMARY", schema "x FLOAT, y FLOAT, z FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceAccelerometerSummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceAccelerometerData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
+insert into table DeviceAccelerometerSummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceAccelerometerData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
 </Script>
     <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Battery/Sparkscripts_1.0.0/Battery_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceBatteryData USING CarbonAnalytics OPTIONS(tableName
 
       CREATE TEMPORARY TABLE DeviceBatterySummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_BATTERY_SUMMARY", schema "level INT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceBatterySummaryData select level, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceBatteryData group by level, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
+      insert into table DeviceBatterySummaryData select level, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceBatteryData group by level, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
     </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/GPS/Sparkscripts_1.0.0/GPS_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceGPSData USING CarbonAnalytics OPTIONS(tableName "OR
 
     CREATE TEMPORARY TABLE DeviceGPSSummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_GPS_SUMMARY", schema "latitude DOUBLE,longitude DOUBLE, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceGPSSummaryData select latitude, longitude, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceGPSData group by latitude, longitude, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);                         
+    insert into table DeviceGPSSummaryData select latitude, longitude, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceGPSData group by latitude, longitude, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Gravity/Sparkscripts_1.0.0/Gravity_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceGRAVITYData USING CarbonAnalytics OPTIONS(tableName
 
     CREATE TEMPORARY TABLE DeviceGRAVITYSummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_GRAVITY_SUMMARY", schema "x FLOAT, y FLOAT,z FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceGRAVITYSummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceGRAVITYData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
+    insert into table DeviceGRAVITYSummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceGRAVITYData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Gyroscope/Sparkscripts_1.0.0/Gyroscope_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceGYROSCOPEData USING CarbonAnalytics OPTIONS(tableNa
 
     CREATE TEMPORARY TABLE DeviceGYROSCOPESummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_GYROSCOPE_SUMMARY", schema "x FLOAT, y FLOAT, z FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceGYROSCOPESummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceGYROSCOPEData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
+    insert into table DeviceGYROSCOPESummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceGYROSCOPEData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Light/Sparkscripts_1.0.0/Light_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceLightData USING CarbonAnalytics OPTIONS(tableName "
 
     CREATE TEMPORARY TABLE DeviceLightSummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_LIGHT_SUMMARY", schema "light FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceLightSummaryData select light, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceLightData group by light, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);                         
+    insert into table DeviceLightSummaryData select light, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceLightData group by light, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Magnetic/Sparkscripts_1.0.0/Magnetic_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceMagneticData USING CarbonAnalytics OPTIONS(tableNam
 
     CREATE TEMPORARY TABLE DeviceMagneticSummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_MAGNETIC_SUMMARY", schema "x FLOAT, y FLOAT, z FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceMagneticSummaryData select x, y , z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceMagneticData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
+    insert into table DeviceMagneticSummaryData select x, y , z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceMagneticData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Pressure/Sparkscripts_1.0.0/Pressure_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DevicePRESSUREData USING CarbonAnalytics OPTIONS(tableNam
 
     CREATE TEMPORARY TABLE DevicePRESSURESummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_PRESSURE_SUMMARY", schema "pressure FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DevicePRESSURESummaryData select pressure, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DevicePRESSUREData group by pressure, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
+    insert into table DevicePRESSURESummaryData select pressure, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DevicePRESSUREData group by pressure, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Proximity/Sparkscripts_1.0.0/Proximity_Sensor_Script.xml

@@ -24,8 +24,7 @@ CREATE TEMPORARY TABLE DevicePROXIMITYData USING CarbonAnalytics OPTIONS(tableNa
 
     CREATE TEMPORARY TABLE DevicePROXIMITYSummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_PROXIMITY_SUMMARY", schema "proximity FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-                           
+    insert into table DevicePROXIMITYSummaryData select proximity, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DevicePROXIMITYData group by proximity, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
-insert overwrite table DevicePROXIMITYSummaryData select proximity, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DevicePROXIMITYData group by proximity, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/iot-analytics/org.wso2.carbon.device.mgt.iot.analytics/src/main/resources/carbonapps/Rotation/Sparkscripts_1.0.0/Rotation_Sensor_Script.xml

@@ -24,7 +24,7 @@ CREATE TEMPORARY TABLE DeviceROTATIONData USING CarbonAnalytics OPTIONS(tableNam
 
     CREATE TEMPORARY TABLE DeviceROTATIONSummaryData USING CarbonAnalytics OPTIONS (tableName "DEVICE_ROTATION_SUMMARY", schema "x FLOAT, y FLOAT, z FLOAT, deviceType STRING -i, deviceId STRING -i, owner STRING -i, time LONG -i",primaryKeys "deviceType, deviceId, owner, time");
 
-insert overwrite table DeviceROTATIONSummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceROTATIONData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
+    insert into table DeviceROTATIONSummaryData select x, y, z, meta_deviceType as deviceType, meta_deviceId as deviceId, meta_owner as owner, cast(meta_time/1000 as BIGINT)as time from DeviceROTATIONData group by x, y, z, meta_deviceType, meta_deviceId, meta_owner, cast(meta_time/1000 as BIGINT);
   </Script>
   <CronExpression>0 * * * * ?</CronExpression>
 </Analytics>

components/iot-plugins/virtual-fire-alarm-plugin/org.wso2.carbon.device.mgt.iot.virtualfirealarm.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.virtual_firealarm.device-view/device-view.hbs

@@ -40,7 +40,7 @@
                 <div class="panel panel-default tab-pane active"
                      id="device_statistics" role="tabpanel" aria-labelledby="device_statistics">
                     <div class="panel-heading">Device Statistics</div>
-                    {{unit "cdmf.unit.device.type.virtual_firealarm.analytics.realtime" device=device}}
+                    {{unit "cdmf.unit.device.type.virtual_firealarm.realtime.analytics-view" device=device}}
                 </div>
 
                 <div class="panel panel-default tab-pane" id="policies" role="tabpanel"

components/iot-plugins/virtual-fire-alarm-plugin/org.wso2.carbon.device.mgt.iot.virtualfirealarm.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.virtual_firealarm.realtime.analytics-view/analytics-view.json

@@ -0,0 +1,3 @@
+{
+  "version": "1.0.0"
+}

components/iot-plugins/virtual-fire-alarm-plugin/org.wso2.carbon.device.mgt.iot.virtualfirealarm.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.virtual_firealarm.realtime.analytics-view/public/css/graph.css

@@ -0,0 +1,471 @@
+/*
+ * Copyright (c) 2016, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
+ *
+ * WSO2 Inc. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+/* graph */
+
+.rickshaw_graph {
+    position: relative;
+}
+
+.rickshaw_graph svg {
+    display: block;
+    overflow: hidden;
+}
+
+/* ticks */
+
+.rickshaw_graph .x_tick {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    width: 0;
+    border-left: 1px dotted rgba(0, 0, 0, 0.2);
+    pointer-events: none;
+}
+
+.rickshaw_graph .x_tick .title {
+    position: absolute;
+    font-size: 12px;
+    font-family: Arial, sans-serif;
+    opacity: 0.5;
+    white-space: nowrap;
+    margin-left: 3px;
+    bottom: -20px;
+    height: auto;
+    border-bottom: none;
+}
+
+/* annotations */
+
+.rickshaw_annotation_timeline {
+    height: 1px;
+    border-top: 1px solid #e0e0e0;
+    margin-top: 10px;
+    position: relative;
+}
+
+.rickshaw_annotation_timeline .annotation {
+    position: absolute;
+    height: 6px;
+    width: 6px;
+    margin-left: -2px;
+    top: -3px;
+    border-radius: 5px;
+    background-color: rgba(0, 0, 0, 0.25);
+}
+
+.rickshaw_graph .annotation_line {
+    position: absolute;
+    top: 0;
+    bottom: -6px;
+    width: 0;
+    border-left: 2px solid rgba(0, 0, 0, 0.3);
+    display: none;
+}
+
+.rickshaw_graph .annotation_line.active {
+    display: block;
+}
+
+.rickshaw_graph .annotation_range {
+    background: rgba(0, 0, 0, 0.1);
+    display: none;
+    position: absolute;
+    top: 0;
+    bottom: -6px;
+}
+
+.rickshaw_graph .annotation_range.active {
+    display: block;
+}
+
+.rickshaw_graph .annotation_range.active.offscreen {
+    display: none;
+}
+
+.rickshaw_annotation_timeline .annotation .content {
+    background: white;
+    color: black;
+    opacity: 0.9;
+    box-shadow: 0 0 2px rgba(0, 0, 0, 0.8);
+    border-radius: 3px;
+    position: relative;
+    z-index: 20;
+    font-size: 12px;
+    padding: 6px 8px 8px;
+    top: 18px;
+    left: -11px;
+    width: 160px;
+    display: none;
+    cursor: pointer;
+}
+
+.rickshaw_annotation_timeline .annotation .content:before {
+    content: "\25b2";
+    position: absolute;
+    top: -11px;
+    color: white;
+    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.8);
+}
+
+.rickshaw_annotation_timeline .annotation.active,
+.rickshaw_annotation_timeline .annotation:hover {
+    background-color: rgba(0, 0, 0, 0.8);
+    cursor: none;
+}
+
+.rickshaw_annotation_timeline .annotation .content:hover {
+    z-index: 50;
+}
+
+.rickshaw_annotation_timeline .annotation.active .content {
+    display: block;
+}
+
+.rickshaw_annotation_timeline .annotation:hover .content {
+    display: block;
+    z-index: 50;
+}
+
+.rickshaw_graph .y_axis,
+.rickshaw_graph .x_axis_d3 {
+    fill: none;
+}
+
+.rickshaw_graph .y_ticks .tick line,
+.rickshaw_graph .x_ticks_d3 .tick {
+    stroke: rgba(0, 0, 0, 0.16);
+    stroke-width: 2px;
+    shape-rendering: crisp-edges;
+    pointer-events: none;
+}
+
+.rickshaw_graph .y_grid .tick,
+.rickshaw_graph .x_grid_d3 .tick {
+    z-index: -1;
+    stroke: rgba(0, 0, 0, 0.20);
+    stroke-width: 1px;
+    stroke-dasharray: 1 1;
+}
+
+.rickshaw_graph .y_grid .tick[data-y-value="0"] {
+    stroke-dasharray: 1 0;
+}
+
+.rickshaw_graph .y_grid path,
+.rickshaw_graph .x_grid_d3 path {
+    fill: none;
+    stroke: none;
+}
+
+.rickshaw_graph .y_ticks path,
+.rickshaw_graph .x_ticks_d3 path {
+    fill: none;
+    stroke: #808080;
+}
+
+.rickshaw_graph .y_ticks text,
+.rickshaw_graph .x_ticks_d3 text {
+    opacity: 0.5;
+    font-size: 12px;
+    pointer-events: none;
+}
+
+.rickshaw_graph .x_tick.glow .title,
+.rickshaw_graph .y_ticks.glow text {
+    fill: black;
+    color: black;
+    text-shadow: -1px 1px 0 rgba(255, 255, 255, 0.1),
+    1px -1px 0 rgba(255, 255, 255, 0.1),
+    1px 1px 0 rgba(255, 255, 255, 0.1),
+    0 1px 0 rgba(255, 255, 255, 0.1),
+    0 -1px 0 rgba(255, 255, 255, 0.1),
+    1px 0 0 rgba(255, 255, 255, 0.1),
+    -1px 0 0 rgba(255, 255, 255, 0.1),
+    -1px -1px 0 rgba(255, 255, 255, 0.1);
+}
+
+.rickshaw_graph .x_tick.inverse .title,
+.rickshaw_graph .y_ticks.inverse text {
+    fill: white;
+    color: white;
+    text-shadow: -1px 1px 0 rgba(0, 0, 0, 0.8),
+    1px -1px 0 rgba(0, 0, 0, 0.8),
+    1px 1px 0 rgba(0, 0, 0, 0.8),
+    0 1px 0 rgba(0, 0, 0, 0.8),
+    0 -1px 0 rgba(0, 0, 0, 0.8),
+    1px 0 0 rgba(0, 0, 0, 0.8),
+    -1px 0 0 rgba(0, 0, 0, 0.8),
+    -1px -1px 0 rgba(0, 0, 0, 0.8);
+}
+
+.custom_rickshaw_graph {
+    position: relative;
+    left: 40px;
+}
+
+.custom_y_axis {
+    position: absolute;
+    width: 40px;
+    margin-top: -20px;
+}
+
+.custom_slider {
+    left: 40px;
+}
+
+.custom_x_axis {
+    position: relative;
+    left: 40px;
+    height: 30px;
+    width: 97%;
+    top: 20px;
+    text-align: right;
+}
+
+.chartWrapper {
+    padding-top: 50px;
+}
+
+/*detail*/
+
+.rickshaw_graph .detail {
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    z-index: 2;
+    background: rgba(0, 0, 0, 0.1);
+    bottom: 0;
+    width: 1px;
+    transition: opacity 0.25s linear;
+    -moz-transition: opacity 0.25s linear;
+    -o-transition: opacity 0.25s linear;
+    -webkit-transition: opacity 0.25s linear;
+}
+
+.rickshaw_graph .detail.inactive {
+    opacity: 0;
+}
+
+.rickshaw_graph .detail .item.active {
+    opacity: 1;
+}
+
+.rickshaw_graph .detail .x_label {
+    font-family: Arial, sans-serif;
+    border-radius: 3px;
+    padding: 6px;
+    opacity: 0.5;
+    border: 1px solid #e0e0e0;
+    font-size: 12px;
+    position: absolute;
+    background: white;
+    white-space: nowrap;
+}
+
+.rickshaw_graph .detail .x_label.left {
+    left: 0;
+}
+
+.rickshaw_graph .detail .x_label.right {
+    right: 0;
+}
+
+.rickshaw_graph .detail .item {
+    position: absolute;
+    z-index: 2;
+    border-radius: 3px;
+    padding: 0.25em;
+    font-size: 12px;
+    font-family: Arial, sans-serif;
+    opacity: 0;
+    background: rgba(0, 0, 0, 0.4);
+    color: white;
+    border: 1px solid rgba(0, 0, 0, 0.4);
+    margin-left: 1em;
+    margin-right: 1em;
+    margin-top: -1em;
+    white-space: nowrap;
+}
+
+.rickshaw_graph .detail .item.left {
+    left: 0;
+}
+
+.rickshaw_graph .detail .item.right {
+    right: 0;
+}
+
+.rickshaw_graph .detail .item.active {
+    opacity: 1;
+    background: rgba(0, 0, 0, 0.8);
+}
+
+.rickshaw_graph .detail .item:after {
+    position: absolute;
+    display: block;
+    width: 0;
+    height: 0;
+
+    content: "";
+
+    border: 5px solid transparent;
+}
+
+.rickshaw_graph .detail .item.left:after {
+    top: 1em;
+    left: -5px;
+    margin-top: -5px;
+    border-right-color: rgba(0, 0, 0, 0.8);
+    border-left-width: 0;
+}
+
+.rickshaw_graph .detail .item.right:after {
+    top: 1em;
+    right: -5px;
+    margin-top: -5px;
+    border-left-color: rgba(0, 0, 0, 0.8);
+    border-right-width: 0;
+}
+
+.rickshaw_graph .detail .dot {
+    width: 4px;
+    height: 4px;
+    margin-left: -3px;
+    margin-top: -3.5px;
+    border-radius: 5px;
+    position: absolute;
+    box-shadow: 0 0 2px rgba(0, 0, 0, 0.6);
+    box-sizing: content-box;
+    -moz-box-sizing: content-box;
+    background: white;
+    border-width: 2px;
+    border-style: solid;
+    display: none;
+    background-clip: padding-box;
+}
+
+.rickshaw_graph .detail .dot.active {
+    display: block;
+}
+
+/*legend*/
+.rickshaw_legend {
+    font-family: Arial;
+    font-size: 12px;
+    color: white;
+    background: #404040;
+    display: inline-block;
+    padding: 12px 5px;
+    border-radius: 2px;
+    position: relative;
+    float: right;
+}
+
+.rickshaw_legend:hover {
+    z-index: 10;
+}
+
+.rickshaw_legend .swatch {
+    width: 10px;
+    height: 10px;
+    border: 1px solid rgba(0, 0, 0, 0.2);
+}
+
+.rickshaw_legend .line {
+    clear: both;
+    line-height: 140%;
+    padding-right: 15px;
+}
+
+.rickshaw_legend .line .swatch {
+    display: inline-block;
+    margin-right: 3px;
+    border-radius: 2px;
+}
+
+.rickshaw_legend .label {
+    margin: 0;
+    white-space: nowrap;
+    display: inline;
+    font-size: inherit;
+    background-color: transparent;
+    color: inherit;
+    font-weight: normal;
+    line-height: normal;
+    padding: 0;
+    text-shadow: none;
+}
+
+.rickshaw_legend .action:hover {
+    opacity: 0.6;
+}
+
+.rickshaw_legend .action {
+    margin-right: 0.2em;
+    opacity: 0.2;
+    cursor: pointer;
+    font-size: 14px;
+}
+
+.rickshaw_legend .line.disabled {
+    opacity: 0.4;
+}
+
+.rickshaw_legend ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 2px;
+    cursor: pointer;
+}
+
+.rickshaw_legend li {
+    padding: 0 0 0 2px;
+    min-width: 80px;
+    white-space: nowrap;
+}
+
+.rickshaw_legend li:hover {
+    background: rgba(255, 255, 255, 0.08);
+    border-radius: 3px;
+}
+
+.rickshaw_legend li:active {
+    background: rgba(255, 255, 255, 0.2);
+    border-radius: 3px;
+}
+
+.legend {
+    display: inline-block;
+    position: relative;
+    left: 8px;
+}
+
+.legend_container {
+    float: right;
+    padding-right: 10px;
+    width: 0;
+    z-index: 1;
+    position: relative;
+    opacity: 0.7;
+}
+
+.spaced {
+    margin-top: 20px !important;
+}
+