Adding coffee level graph to realtime-analytics view

modules/distribution/src/core/samples/connectedcup/component/analytics/src/main/resources/carbonapps/coffee_level/artifacts.xml

@@ -23,5 +23,6 @@
 		<dependency artifact="coffee_level_store" version="1.0.0" include="true" serverRole="DataAnalyticsServer"/>
 		<dependency artifact="coffee_level_receiver" version="1.0.0" include="true" serverRole="DataAnalyticsServer"/>
 		<dependency artifact="coffee_level_script" version="1.0.0" include="true" serverRole="DataAnalyticsServer"/>
+		<dependency artifact="coffee_level_publisher" version="1.0.0" include="true" serverRole="DataAnalyticsServer"/>
     </artifact>
 </artifacts>

modules/distribution/src/core/samples/connectedcup/component/analytics/src/main/resources/carbonapps/coffee_level/coffee_level_publisher/artifact.xml

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+  ~ 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.
+  -->
+
+<artifact name="coffee_level_publisher" version="1.0.0" type="event/publisher" serverRole="DataAnalyticsServer">
+    <file>coffee_level_publisher.xml</file>
+</artifact>

modules/distribution/src/core/samples/connectedcup/component/analytics/src/main/resources/carbonapps/coffee_level/coffee_level_publisher/coffee_level_publisher.xml

@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+  ~ 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.
+  -->
+
+<eventPublisher name="coffee_level_publisher" statistics="disable" trace="disable" xmlns="http://wso2.org/carbon/eventpublisher">
+    <from streamName="org.wso2.iot.devices.coffeelevel" version="1.0.0"/>
+    <mapping customMapping="disable" type="wso2event"/>
+    <to eventAdapterType="secured-websocket"/>
+</eventPublisher>
+

modules/distribution/src/core/samples/connectedcup/component/ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.connectedcup.realtime.analytics-view/analytics-view.hbs

@@ -17,7 +17,7 @@
 }}
 {{unit "cdmf.unit.lib.rickshaw-graph"}}
 
-<div id="div-chart" data-websocketurl="{{websocketEndpoint}}">
+<div id="div-chart" data-websocketurl="{{websocketEndpoint1}}" data-sensorType="temperature">
     <div class="chartWrapper" id="chartWrapper">
         <div id="y_axis" class="custom_y_axis" style="margin-top: -20px;">Temperature</div>
         <div class="legend_container">
@@ -28,6 +28,19 @@
         <div class="custom_x_axis">Time</div>
     </div>
 </div>
+
+<div id="div-chart2" data-websocketurl="{{websocketEndpoint2}}" data-sensorType="coffeelevel">
+    <div class="chartWrapper" id="chartWrapper">
+        <div id="y_axis2" class="custom_y_axis" style="margin-top: -20px;">Coffee Level</div>
+        <div class="legend_container">
+            <div id="smoother" title="Smoothing"></div>
+            <div id="legend2"></div>
+        </div>
+        <div id="chart2" 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">

modules/distribution/src/core/samples/connectedcup/component/ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.connectedcup.realtime.analytics-view/analytics-view.js

@@ -35,10 +35,16 @@ function onRequest(context) {
         if (tokenPair) {
             token = tokenPair.accessToken;
         }
-        websocketEndpoint = websocketEndpoint + "/secured-websocket/org.wso2.iot.devices.temperature/1.0.0?"
+        websocketEndpoint1 = websocketEndpoint + "/secured-websocket/org.wso2.iot.devices.temperature/1.0.0?"
+            + "deviceId=" + device.deviceIdentifier + "&deviceType=" + device.type+ "&websocketToken=" + token;
+        websocketEndpoint2 = websocketEndpoint + "/secured-websocket/org.wso2.iot.devices.coffeelevel/1.0.0?"
             + "deviceId=" + device.deviceIdentifier + "&deviceType=" + device.type+ "&websocketToken=" + token;
         var websocketToken= {'name':'websocket-token','value': token, 'path':'/', "maxAge":18000};
         response.addCookie(websocketToken);
     }
-    return {"device": device, "websocketEndpoint": websocketEndpoint};
+    return {
+        "device": device,
+        "websocketEndpoint1": websocketEndpoint1,
+        "websocketEndpoint2": websocketEndpoint2
+    };
 }

modules/distribution/src/core/samples/connectedcup/component/ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.connectedcup.realtime.analytics-view/public/js/device-stats.js

@@ -16,23 +16,39 @@
  * under the License.
  */
 
-var ws;
-var graph;
-var chartData = [];
+var wsConnection1;
+var wsConnection2;
+var graphForSensorType1;
+var graphForSensorType2;
+var chartDataSensorType1 = [];
+var chartDataSensorType2 = [];
+
 var palette = new Rickshaw.Color.Palette({scheme: "classic9"});
 
 $(window).load(function () {
+    drawGraph(wsConnection1, "#div-chart", "y_axis", "chart", chartDataSensorType1
+        , graphForSensorType1);
+    drawGraph(wsConnection2, "#div-chart2", "y_axis2", "chart2", chartDataSensorType2
+        , graphForSensorType2);
+});
+
+window.onbeforeunload = function() {
+    disconnect(wsConnection1);
+    disconnect(wsConnection2);
+};
+
+function drawGraph(wsConnection, placeHolder, yAxis, chat, chartData, graph) {
     var tNow = new Date().getTime() / 1000;
     for (var i = 0; i < 30; i++) {
         chartData.push({
-                           x: tNow - (30 - i) * 15,
-                           y: parseFloat(0)
-                       });
+           x: tNow - (30 - i) * 15,
+           y: parseFloat(0)
+       });
     }
 
     graph = new Rickshaw.Graph({
-        element: document.getElementById("chart"),
-        width: $("#div-chart").width() - 50,
+        element: document.getElementById(chat),
+        width: $(placeHolder).width() - 50,
         height: 300,
         renderer: "line",
         interpolation: "linear",
@@ -41,7 +57,7 @@ $(window).load(function () {
         series: [{
             'color': palette.color(),
             'data': chartData,
-            'name': "Temperature"
+            'name': "SensorValue"
         }]
     });
 
@@ -58,51 +74,49 @@ $(window).load(function () {
         orientation: 'left',
         height: 300,
         tickFormat: Rickshaw.Fixtures.Number.formatKMBT,
-        element: document.getElementById('y_axis')
+        element: document.getElementById(yAxis)
     });
 
     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 date = '<span class="date">' + moment.unix(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;
         }
     });
 
-    var websocketUrl = $("#div-chart").data("websocketurl");
-    connect(websocketUrl)
-});
+    var sensorType = $(placeHolder).attr("data-sensorType");
+    var websocketUrl = $(placeHolder).attr("data-websocketurl");
+    connect(wsConnection, websocketUrl, chartData, graph, sensorType);
 
-$(window).unload(function () {
-    disconnect();
-});
+}
 
 //websocket connection
-function connect(target) {
+function connect(wsConnection, target, chartData, graph, sensorType) {
     if ('WebSocket' in window) {
-        ws = new WebSocket(target);
+        wsConnection = new WebSocket(target);
     } else if ('MozWebSocket' in window) {
-        ws = new MozWebSocket(target);
+        wsConnection = new MozWebSocket(target);
     } else {
         console.log('WebSocket is not supported by this browser.');
     }
-    if (ws) {
-        ws.onmessage = function (event) {
+    if (wsConnection) {
+        wsConnection.onmessage = function (event) {
             var dataPoint = JSON.parse(event.data);
             chartData.push({
-                               x: parseInt(dataPoint[4]) / 1000,
-                               y: parseFloat(dataPoint[5])
-                           });
+               x: parseInt(dataPoint[4]) / 1000,
+               y: parseFloat(dataPoint[5])
+            });
             chartData.shift();
             graph.update();
         };
     }
 }
 
-function disconnect() {
-    if (ws != null) {
-        ws.close();
-        ws = null;
+function disconnect(wsConnection) {
+    if (wsConnection != null) {
+        wsConnection.close();
+        wsConnection = null;
     }
 }