forked from community/device-mgt-plugins
revert-dabc3590
ayyoob
9 years ago
parent
3b75a2e9a4
commit
14aac9f4f6
@ -0,0 +1,123 @@
|
||||
/*
|
||||
* Copyright (c) 2015, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* Licensed 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.androidsense.plugin.impl.dao;
|
||||
|
||||
import org.apache.commons.logging.Log;
|
||||
import org.apache.commons.logging.LogFactory;
|
||||
import org.wso2.carbon.device.mgt.iot.androidsense.plugin.exception.AndroidSenseDeviceMgtPluginException;
|
||||
import org.wso2.carbon.device.mgt.iot.androidsense.plugin.constants.AndroidSenseConstants;
|
||||
|
||||
import javax.naming.Context;
|
||||
import javax.naming.InitialContext;
|
||||
import javax.naming.NamingException;
|
||||
import javax.sql.DataSource;
|
||||
import java.sql.Connection;
|
||||
import java.sql.SQLException;
|
||||
|
||||
public class AndroidSenseDAOUtil {
|
||||
|
||||
private static final Log log = LogFactory.getLog(AndroidSenseDAOUtil.class);
|
||||
static DataSource dataSource;
|
||||
private static ThreadLocal<Connection> currentConnection = new ThreadLocal<Connection>();
|
||||
|
||||
public AndroidSenseDAOUtil() {
|
||||
initAndroidDAO();
|
||||
}
|
||||
|
||||
public static void initAndroidDAO() {
|
||||
try {
|
||||
Context ctx = new InitialContext();
|
||||
dataSource = (DataSource) ctx.lookup(AndroidSenseConstants.DATA_SOURCE_NAME);
|
||||
} catch (NamingException e) {
|
||||
log.error("Error while looking up the data source: " + AndroidSenseConstants.DATA_SOURCE_NAME);
|
||||
}
|
||||
}
|
||||
|
||||
public AndroidSenseDAO getDeviceDAO() {
|
||||
return new AndroidSenseDAO();
|
||||
}
|
||||
|
||||
public static void beginTransaction() throws AndroidSenseDeviceMgtPluginException {
|
||||
try {
|
||||
Connection conn = dataSource.getConnection();
|
||||
conn.setAutoCommit(false);
|
||||
currentConnection.set(conn);
|
||||
} catch (SQLException e) {
|
||||
throw new AndroidSenseDeviceMgtPluginException("Error occurred while retrieving datasource connection", e);
|
||||
}
|
||||
}
|
||||
|
||||
public static Connection getConnection() throws AndroidSenseDeviceMgtPluginException {
|
||||
if (currentConnection.get() == null) {
|
||||
try {
|
||||
currentConnection.set(dataSource.getConnection());
|
||||
} catch (SQLException e) {
|
||||
throw new AndroidSenseDeviceMgtPluginException("Error occurred while retrieving data source connection", e);
|
||||
}
|
||||
}
|
||||
return currentConnection.get();
|
||||
}
|
||||
|
||||
public static void commitTransaction() throws AndroidSenseDeviceMgtPluginException {
|
||||
try {
|
||||
Connection conn = currentConnection.get();
|
||||
if (conn != null) {
|
||||
conn.commit();
|
||||
} else {
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Datasource connection associated with the current thread is null, hence commit "
|
||||
+ "has not been attempted");
|
||||
}
|
||||
}
|
||||
} catch (SQLException e) {
|
||||
throw new AndroidSenseDeviceMgtPluginException("Error occurred while committing the transaction", e);
|
||||
} finally {
|
||||
closeConnection();
|
||||
}
|
||||
}
|
||||
|
||||
public static void closeConnection() throws AndroidSenseDeviceMgtPluginException {
|
||||
|
||||
Connection con = currentConnection.get();
|
||||
if (con != null) {
|
||||
try {
|
||||
con.close();
|
||||
} catch (SQLException e) {
|
||||
log.error("Error occurred while close the connection");
|
||||
}
|
||||
}
|
||||
currentConnection.remove();
|
||||
}
|
||||
|
||||
public static void rollbackTransaction() throws AndroidSenseDeviceMgtPluginException {
|
||||
try {
|
||||
Connection conn = currentConnection.get();
|
||||
if (conn != null) {
|
||||
conn.rollback();
|
||||
} else {
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Datasource connection associated with the current thread is null, hence rollback "
|
||||
+ "has not been attempted");
|
||||
}
|
||||
}
|
||||
} catch (SQLException e) {
|
||||
throw new AndroidSenseDeviceMgtPluginException("Error occurred while rollback the transaction", e);
|
||||
} finally {
|
||||
closeConnection();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,198 +0,0 @@
|
||||
/*
|
||||
* Copyright (c) 2016, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* Licensed 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.androidsense.plugin.impl.dao.impl;
|
||||
|
||||
import org.apache.commons.logging.Log;
|
||||
import org.apache.commons.logging.LogFactory;
|
||||
import org.wso2.carbon.device.mgt.common.Device;
|
||||
import org.wso2.carbon.device.mgt.iot.androidsense.plugin.constants.AndroidSenseConstants;
|
||||
import org.wso2.carbon.device.mgt.iot.androidsense.plugin.exception.AndroidSenseDeviceMgtPluginException;
|
||||
import org.wso2.carbon.device.mgt.iot.androidsense.plugin.impl.dao.AndroidSenseDAO;
|
||||
import org.wso2.carbon.device.mgt.iot.androidsense.plugin.impl.dao.util.AndroidSenseUtils;
|
||||
|
||||
import java.sql.Connection;
|
||||
import java.sql.PreparedStatement;
|
||||
import java.sql.ResultSet;
|
||||
import java.sql.SQLException;
|
||||
import java.util.ArrayList;
|
||||
import java.util.List;
|
||||
|
||||
/**
|
||||
* Implements dao impl for android Devices.
|
||||
*/
|
||||
public class AndroidSenseDAOImpl {
|
||||
|
||||
|
||||
private static final Log log = LogFactory.getLog(AndroidSenseDAOImpl.class);
|
||||
|
||||
public Device getDevice(String deviceId) throws AndroidSenseDeviceMgtPluginException {
|
||||
Connection conn = null;
|
||||
PreparedStatement stmt = null;
|
||||
Device device = null;
|
||||
ResultSet resultSet = null;
|
||||
try {
|
||||
conn = AndroidSenseDAO.getConnection();
|
||||
String selectDBQuery =
|
||||
"SELECT ANDROID_DEVICE_ID, DEVICE_NAME" +
|
||||
" FROM ANDROID_SENSE_DEVICE WHERE ANDROID_DEVICE_ID = ?";
|
||||
stmt = conn.prepareStatement(selectDBQuery);
|
||||
stmt.setString(1, deviceId);
|
||||
resultSet = stmt.executeQuery();
|
||||
|
||||
if (resultSet.next()) {
|
||||
device = new Device();
|
||||
device.setName(resultSet.getString(AndroidSenseConstants.DEVICE_PLUGIN_DEVICE_NAME));
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Android device " + deviceId + " data has been fetched from " +
|
||||
"Android database.");
|
||||
}
|
||||
}
|
||||
} catch (SQLException e) {
|
||||
String msg = "Error occurred while fetching Android device : '" + deviceId + "'";
|
||||
log.error(msg, e);
|
||||
throw new AndroidSenseDeviceMgtPluginException(msg, e);
|
||||
} finally {
|
||||
AndroidSenseUtils.cleanupResources(stmt, resultSet);
|
||||
AndroidSenseDAO.closeConnection();
|
||||
}
|
||||
return device;
|
||||
}
|
||||
|
||||
public boolean addDevice(Device device)throws AndroidSenseDeviceMgtPluginException {
|
||||
boolean status = false;
|
||||
Connection conn = null;
|
||||
PreparedStatement stmt = null;
|
||||
try {
|
||||
conn = AndroidSenseDAO.getConnection();
|
||||
String createDBQuery =
|
||||
"INSERT INTO ANDROID_SENSE_DEVICE(ANDROID_DEVICE_ID, DEVICE_NAME) VALUES (?, ?)";
|
||||
|
||||
stmt = conn.prepareStatement(createDBQuery);
|
||||
stmt.setString(1, device.getDeviceIdentifier());
|
||||
stmt.setString(2, device.getName());
|
||||
int rows = stmt.executeUpdate();
|
||||
if (rows > 0) {
|
||||
status = true;
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Android device " + device.getDeviceIdentifier() + " data has been" +
|
||||
" added to the Android database.");
|
||||
}
|
||||
}
|
||||
} catch (SQLException e) {
|
||||
String msg = "Error occurred while adding the Android device '" + device.getDeviceIdentifier()
|
||||
+ "' to the Android db.";
|
||||
log.error(msg, e);
|
||||
throw new AndroidSenseDeviceMgtPluginException(msg, e);
|
||||
} finally {
|
||||
AndroidSenseUtils.cleanupResources(stmt, null);
|
||||
}
|
||||
return status;
|
||||
}
|
||||
|
||||
public boolean updateDevice(Device device) throws AndroidSenseDeviceMgtPluginException {
|
||||
boolean status = false;
|
||||
Connection conn = null;
|
||||
PreparedStatement stmt = null;
|
||||
try {
|
||||
conn = AndroidSenseDAO.getConnection();
|
||||
String updateDBQuery =
|
||||
"UPDATE ANDROID_SENSE_DEVICE SET DEVICE_NAME = ? WHERE ANDROID_DEVICE_ID = ?";
|
||||
|
||||
stmt = conn.prepareStatement(updateDBQuery);
|
||||
stmt.setString(1, device.getName());
|
||||
stmt.setString(2, device.getDeviceIdentifier());
|
||||
int rows = stmt.executeUpdate();
|
||||
if (rows > 0) {
|
||||
status = true;
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Android device " + device.getDeviceIdentifier() + " data has been modified.");
|
||||
}
|
||||
}
|
||||
} catch (SQLException e) {
|
||||
String msg = "Error occurred while modifying the Android device '" +
|
||||
device.getDeviceIdentifier() + "' data.";
|
||||
log.error(msg, e);
|
||||
throw new AndroidSenseDeviceMgtPluginException(msg, e);
|
||||
} finally {
|
||||
AndroidSenseUtils.cleanupResources(stmt, null);
|
||||
}
|
||||
return status;
|
||||
}
|
||||
|
||||
public boolean deleteDevice(String deviceId) throws AndroidSenseDeviceMgtPluginException {
|
||||
boolean status = false;
|
||||
Connection conn = null;
|
||||
PreparedStatement stmt = null;
|
||||
try {
|
||||
conn = AndroidSenseDAO.getConnection();
|
||||
String deleteDBQuery =
|
||||
"DELETE FROM ANDROID_SENSE_DEVICE WHERE ANDROID_DEVICE_ID = ?";
|
||||
stmt = conn.prepareStatement(deleteDBQuery);
|
||||
stmt.setString(1, deviceId);
|
||||
int rows = stmt.executeUpdate();
|
||||
if (rows > 0) {
|
||||
status = true;
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Android device " + deviceId + " data has deleted from the Android database.");
|
||||
}
|
||||
}
|
||||
} catch (SQLException e) {
|
||||
String msg = "Error occurred while deleting Android device " + deviceId;
|
||||
log.error(msg, e);
|
||||
throw new AndroidSenseDeviceMgtPluginException(msg, e);
|
||||
} finally {
|
||||
AndroidSenseUtils.cleanupResources(stmt, null);
|
||||
}
|
||||
return status;
|
||||
}
|
||||
|
||||
public List<Device> getAllDevices() throws AndroidSenseDeviceMgtPluginException {
|
||||
|
||||
Connection conn = null;
|
||||
PreparedStatement stmt = null;
|
||||
ResultSet resultSet = null;
|
||||
Device device;
|
||||
List<Device> iotDevices = new ArrayList<>();
|
||||
|
||||
try {
|
||||
conn = AndroidSenseDAO.getConnection();
|
||||
String selectDBQuery =
|
||||
"SELECT ANDROID_DEVICE_ID, DEVICE_NAME FROM ANDROID_SENSE_DEVICE";
|
||||
stmt = conn.prepareStatement(selectDBQuery);
|
||||
resultSet = stmt.executeQuery();
|
||||
while (resultSet.next()) {
|
||||
device = new Device();
|
||||
device.setDeviceIdentifier(resultSet.getString(AndroidSenseConstants.DEVICE_PLUGIN_DEVICE_ID));
|
||||
device.setName(resultSet.getString(AndroidSenseConstants.DEVICE_PLUGIN_DEVICE_NAME));
|
||||
iotDevices.add(device);
|
||||
}
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("All Android device details have fetched from Android database.");
|
||||
}
|
||||
return iotDevices;
|
||||
} catch (SQLException e) {
|
||||
String msg = "Error occurred while fetching all Android device data'";
|
||||
log.error(msg, e);
|
||||
throw new AndroidSenseDeviceMgtPluginException(msg, e);
|
||||
} finally {
|
||||
AndroidSenseUtils.cleanupResources(stmt, resultSet);
|
||||
AndroidSenseDAO.closeConnection();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
@ -1,35 +0,0 @@
|
||||
/*
|
||||
* Copyright (c) 2015, 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.arduino.service.impl.dto;
|
||||
|
||||
import org.codehaus.jackson.annotate.JsonIgnoreProperties;
|
||||
|
||||
import javax.xml.bind.annotation.XmlElement;
|
||||
import javax.xml.bind.annotation.XmlRootElement;
|
||||
|
||||
@XmlRootElement
|
||||
|
||||
@JsonIgnoreProperties(ignoreUnknown = true)
|
||||
public class DeviceData {
|
||||
@XmlElement(required = true) public String deviceId;
|
||||
@XmlElement(required = true) public String reply;
|
||||
@XmlElement public Long time;
|
||||
@XmlElement public String key;
|
||||
@XmlElement public float value;
|
||||
}
|
||||
@ -0,0 +1,32 @@
|
||||
/*
|
||||
* 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.arduino.service.impl.util;
|
||||
|
||||
import org.wso2.carbon.user.core.Permission;
|
||||
|
||||
/**
|
||||
* This hold the constants related to the device type.
|
||||
*/
|
||||
public class Constants {
|
||||
|
||||
public static final String DEFAULT_PERMISSION_RESOURCE = "/permission/admin/device-mgt/arduino/user";
|
||||
public static final String DEFAULT_ROLE_NAME = "arduino_user";
|
||||
public static final Permission DEFAULT_PERMISSION[] = new Permission[]{new Permission(Constants.DEFAULT_PERMISSION_RESOURCE,
|
||||
"ui.execute")};
|
||||
}
|
||||
@ -0,0 +1,85 @@
|
||||
/*
|
||||
* 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.arduino.service.impl.util;
|
||||
|
||||
import org.wso2.carbon.device.mgt.common.DeviceManagementException;
|
||||
import org.wso2.carbon.device.mgt.iot.controlqueue.mqtt.MqttConfig;
|
||||
import org.wso2.carbon.device.mgt.iot.controlqueue.xmpp.XmppConfig;
|
||||
import org.wso2.carbon.device.mgt.iot.exception.IoTException;
|
||||
import org.wso2.carbon.device.mgt.iot.util.IoTUtil;
|
||||
import org.wso2.carbon.device.mgt.iot.util.IotDeviceManagementUtil;
|
||||
import org.wso2.carbon.device.mgt.iot.util.ZipArchive;
|
||||
import org.wso2.carbon.utils.CarbonUtils;
|
||||
|
||||
import java.io.File;
|
||||
import java.io.IOException;
|
||||
import java.util.HashMap;
|
||||
import java.util.Map;
|
||||
|
||||
/**
|
||||
* This is used to create a zip file that includes the necessary configuration required for the agent.
|
||||
*/
|
||||
public class ZipUtil {
|
||||
|
||||
private static final String HTTPS_PORT_PROPERTY = "httpsPort";
|
||||
private static final String HTTP_PORT_PROPERTY = "httpPort";
|
||||
|
||||
private static final String LOCALHOST = "localhost";
|
||||
private static final String HTTPS_PROTOCOL_APPENDER = "https://";
|
||||
private static final String HTTP_PROTOCOL_APPENDER = "http://";
|
||||
|
||||
public ZipArchive createZipFile(String owner, String tenantDomain, String deviceType,
|
||||
String deviceId, String deviceName, String token,
|
||||
String refreshToken) throws DeviceManagementException {
|
||||
|
||||
String sketchFolder = "repository" + File.separator + "resources" + File.separator + "sketches";
|
||||
String archivesPath = CarbonUtils.getCarbonHome() + File.separator + sketchFolder + File.separator + "archives" +
|
||||
File.separator + deviceId;
|
||||
String templateSketchPath = sketchFolder + File.separator + deviceType;
|
||||
String iotServerIP;
|
||||
|
||||
try {
|
||||
iotServerIP = IoTUtil.getHostName();
|
||||
String httpsServerPort = System.getProperty(HTTPS_PORT_PROPERTY);
|
||||
String httpServerPort = System.getProperty(HTTP_PORT_PROPERTY);
|
||||
String httpsServerEP = HTTPS_PROTOCOL_APPENDER + iotServerIP + ":" + httpsServerPort;
|
||||
String httpServerEP = HTTP_PROTOCOL_APPENDER + iotServerIP + ":" + httpServerPort;
|
||||
String apimEndpoint = httpsServerEP;
|
||||
|
||||
Map<String, String> contextParams = new HashMap<>();
|
||||
contextParams.put("TENANT_DOMAIN", APIUtil.getTenantDomainOftheUser());
|
||||
contextParams.put("DEVICE_OWNER", owner);
|
||||
contextParams.put("DEVICE_ID", deviceId);
|
||||
contextParams.put("DEVICE_NAME", deviceName);
|
||||
contextParams.put("HTTPS_EP", httpsServerEP);
|
||||
contextParams.put("HTTP_EP", httpServerEP);
|
||||
contextParams.put("APIM_EP", apimEndpoint);
|
||||
contextParams.put("DEVICE_TOKEN", token);
|
||||
contextParams.put("DEVICE_REFRESH_TOKEN", refreshToken);
|
||||
|
||||
ZipArchive zipFile;
|
||||
zipFile = IotDeviceManagementUtil.getSketchArchive(archivesPath, templateSketchPath, contextParams);
|
||||
return zipFile;
|
||||
} catch (IoTException e) {
|
||||
throw new DeviceManagementException(e.getMessage());
|
||||
} catch (IOException e) {
|
||||
throw new DeviceManagementException("Zip File Creation Failed", e);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
{{#zone "topCss"}}
|
||||
{{css "css/graph.css"}}
|
||||
{{/zone}}
|
||||
<span id="details" data-devicename="{{device.name}}" data-deviceid="{{device.deviceIdentifier}}"
|
||||
data-appcontext="{{@app.context}}"></span>
|
||||
<div id="div-chart">
|
||||
<div class="chartWrapper" id="chartWrapper">
|
||||
<span id="span-title">Temperature</span>
|
||||
<div id="y_axis" class="custom_y_axis"></div>
|
||||
<div class="legend_container">
|
||||
<div id="smoother" title="Smoothing"></div>
|
||||
<div id="legend"></div>
|
||||
</div>
|
||||
<div id="chart" class="custom_rickshaw_graph" data-backend-api-url = {{backendApiUri}}></div>
|
||||
<div id="x_axis" class="custom_x_axis"></div>
|
||||
<div id="slider" class="custom_slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#zone "bottomJs"}}
|
||||
{{js "js/d3.min.js"}}
|
||||
{{js "js/rickshaw.min.js"}}
|
||||
{{js "js/moment.min.js"}}
|
||||
{{js "js/devicetype-graph.js"}}
|
||||
{{/zone}}
|
||||
@ -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 deviceType = context.uriParams.deviceType;
|
||||
var deviceId = request.getParameter("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"] + "/arduino/device/stats/" + deviceId};
|
||||
} else {
|
||||
response.sendError(404, "Device Id " + deviceId + " of type " + deviceType + " cannot be found!");
|
||||
exit();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
{
|
||||
"version": "1.0.0"
|
||||
}
|
||||
@ -0,0 +1,470 @@
|
||||
/*
|
||||
* 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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,155 @@
|
||||
/*
|
||||
* 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 palette = new Rickshaw.Color.Palette({scheme: "classic9"});
|
||||
|
||||
function drawGraph(from, to) {
|
||||
var backendApiUrl = $("#chart").data("backend-api-url") + "?from=" + from + "&to=" + to;
|
||||
|
||||
var successCallback = function (data) {
|
||||
if (data) {
|
||||
drawLineGraph(JSON.parse(data));
|
||||
}
|
||||
};
|
||||
invokerUtil.get(backendApiUrl, successCallback, function (message) {
|
||||
console.log(message);
|
||||
});
|
||||
}
|
||||
|
||||
function drawLineGraph(data) {
|
||||
var chartWrapperElmId = "#div-chart";
|
||||
var graphWidth = $(chartWrapperElmId).width() - 50;
|
||||
if (data.length == 0 || data.length == undefined) {
|
||||
$("#chart").html("<br/>No data available...");
|
||||
return;
|
||||
}
|
||||
$("#chart").empty();
|
||||
var graphConfig = {
|
||||
element: document.getElementById("chart"),
|
||||
width: graphWidth,
|
||||
height: 400,
|
||||
strokeWidth: 2,
|
||||
renderer: 'line',
|
||||
interpolation: "linear",
|
||||
unstack: true,
|
||||
stack: false,
|
||||
xScale: d3.time.scale(),
|
||||
padding: {top: 0.2, left: 0.02, right: 0.02, bottom: 0.2},
|
||||
series: []
|
||||
};
|
||||
|
||||
var tzOffset = new Date().getTimezoneOffset() * 60;
|
||||
|
||||
var min = Number.MAX_VALUE;
|
||||
var max = Number.MIN_VALUE;
|
||||
var range_min = 99999, range_max = 0;
|
||||
var max_val = parseInt(data[0].values.temperature);
|
||||
var min_val = max_val;
|
||||
var chartData = [];
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
var y_val = parseInt(data[i].values.temperature);
|
||||
if (y_val > max_val) {
|
||||
max_val = y_val;
|
||||
} else if (y_val < min_val) {
|
||||
min_val = y_val;
|
||||
}
|
||||
chartData.push(
|
||||
{
|
||||
x: parseInt(data[i].values.time) - tzOffset,
|
||||
y: y_val
|
||||
}
|
||||
);
|
||||
}
|
||||
if (range_max < max_val) {
|
||||
range_max = max_val;
|
||||
}
|
||||
if (range_min > min_val) {
|
||||
range_min = min_val;
|
||||
}
|
||||
graphConfig['series'].push(
|
||||
{
|
||||
'color': palette.color(),
|
||||
'data': chartData,
|
||||
'name': $("#details").data("devicename"),
|
||||
'scale': d3.scale.linear().domain([Math.min(min, min_val), Math.max(max, max_val)])
|
||||
.nice()
|
||||
}
|
||||
);
|
||||
|
||||
if (graphConfig['series'].length == 0) {
|
||||
$(chartWrapperElmId).html("No data available...");
|
||||
return;
|
||||
}
|
||||
|
||||
var graph = new Rickshaw.Graph(graphConfig);
|
||||
|
||||
graph.render();
|
||||
|
||||
var xAxis = new Rickshaw.Graph.Axis.Time({
|
||||
graph: graph
|
||||
});
|
||||
|
||||
xAxis.render();
|
||||
|
||||
var yAxis = new Rickshaw.Graph.Axis.Y.Scaled({
|
||||
graph: graph,
|
||||
orientation: 'left',
|
||||
element: document.getElementById("y_axis"),
|
||||
width: 40,
|
||||
height: 410,
|
||||
'scale': d3.scale.linear().domain([Math.min(min, range_min), Math.max(max, range_max)]).nice()
|
||||
});
|
||||
|
||||
yAxis.render();
|
||||
|
||||
var slider = new Rickshaw.Graph.RangeSlider.Preview({
|
||||
graph: graph,
|
||||
element: document.getElementById("slider")
|
||||
});
|
||||
|
||||
var legend = new Rickshaw.Graph.Legend({
|
||||
graph: graph,
|
||||
element: document.getElementById('legend')
|
||||
});
|
||||
|
||||
var hoverDetail = new Rickshaw.Graph.HoverDetail({
|
||||
graph: graph,
|
||||
formatter: function (series, x, y) {
|
||||
var date = '<span class="date">' +
|
||||
moment((x + tzOffset) * 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 shelving = new Rickshaw.Graph.Behavior.Series.Toggle({
|
||||
graph: graph,
|
||||
legend: legend
|
||||
});
|
||||
|
||||
var order = new Rickshaw.Graph.Behavior.Series.Order({
|
||||
graph: graph,
|
||||
legend: legend
|
||||
});
|
||||
|
||||
var highlighter = new Rickshaw.Graph.Behavior.Series.Highlight({
|
||||
graph: graph,
|
||||
legend: legend
|
||||
});
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,29 @@
|
||||
{{#zone "topCss"}}
|
||||
{{css "css/graph.css"}}
|
||||
{{/zone}}
|
||||
<div id="div-chart" data-websocketurl="{{websocketEndpoint}}">
|
||||
<div class="chartWrapper" id="chartWrapper">
|
||||
<div id="y_axis" class="custom_y_axis">Temperature</div>
|
||||
<div class="legend_container">
|
||||
<div id="smoother" title="Smoothing"></div>
|
||||
<div id="legend"></div>
|
||||
</div>
|
||||
<div id="chart" 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}}
|
||||
@ -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.devices.temperature/1.0.0?" +
|
||||
"token="+ token +"&deviceId=" + device.deviceIdentifier + "&deviceType=" + device.type;
|
||||
return {"device": device, "websocketEndpoint" : websocketEndpoint};
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
{
|
||||
"version": "1.0.0"
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,107 @@
|
||||
/*
|
||||
* 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 graph;
|
||||
var chartData = [];
|
||||
var palette = new Rickshaw.Color.Palette({scheme: "classic9"});
|
||||
|
||||
$(window).load(function () {
|
||||
var tNow = new Date().getTime() / 1000;
|
||||
for (var i = 0; i < 30; i++) {
|
||||
chartData.push({
|
||||
x: tNow - (30 - i) * 15,
|
||||
y: parseFloat(0)
|
||||
});
|
||||
}
|
||||
|
||||
graph = new Rickshaw.Graph({
|
||||
element: document.getElementById("chart"),
|
||||
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': "Temperature"
|
||||
}]
|
||||
});
|
||||
|
||||
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.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;
|
||||
}
|
||||
});
|
||||
|
||||
var websocketUrl = $("#div-chart").data("websocketurl");
|
||||
connect(websocketUrl)
|
||||
});
|
||||
|
||||
$(window).unload(function () {
|
||||
disconnect();
|
||||
});
|
||||
|
||||
//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);
|
||||
chartData.push({
|
||||
x: parseInt(dataPoint[4]) / 1000,
|
||||
y: parseFloat(dataPoint[5])
|
||||
});
|
||||
chartData.shift();
|
||||
graph.update();
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function disconnect() {
|
||||
if (ws != null) {
|
||||
ws.close();
|
||||
ws = null;
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,100 +0,0 @@
|
||||
/*
|
||||
* 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.util;
|
||||
|
||||
import org.wso2.carbon.device.mgt.common.DeviceManagementException;
|
||||
import org.wso2.carbon.device.mgt.iot.config.server.DeviceManagementConfigurationManager;
|
||||
import org.wso2.carbon.device.mgt.iot.controlqueue.mqtt.MqttConfig;
|
||||
import org.wso2.carbon.device.mgt.iot.controlqueue.xmpp.XmppConfig;
|
||||
import org.wso2.carbon.device.mgt.iot.exception.IoTException;
|
||||
import org.wso2.carbon.utils.CarbonUtils;
|
||||
import java.io.File;
|
||||
import java.io.IOException;
|
||||
import java.util.HashMap;
|
||||
import java.util.Map;
|
||||
|
||||
public class ZipUtil {
|
||||
|
||||
private static final String HTTPS_PORT_PROPERTY = "httpsPort";
|
||||
private static final String HTTP_PORT_PROPERTY = "httpPort";
|
||||
|
||||
private static final String LOCALHOST = "localhost";
|
||||
private static final String HTTPS_PROTOCOL_APPENDER = "https://";
|
||||
private static final String HTTP_PROTOCOL_APPENDER = "http://";
|
||||
|
||||
public ZipArchive createZipFile(String owner, String tenantDomain, String deviceType,
|
||||
String deviceId, String deviceName, String token,
|
||||
String refreshToken)
|
||||
throws DeviceManagementException {
|
||||
|
||||
String sep = File.separator;
|
||||
String sketchFolder = "repository" + sep + "resources" + sep + "sketches";
|
||||
String archivesPath = CarbonUtils.getCarbonHome() + sep + sketchFolder + sep + "archives" + sep + deviceId;
|
||||
String templateSketchPath = sketchFolder + sep + deviceType;
|
||||
String iotServerIP;
|
||||
|
||||
try {
|
||||
iotServerIP = IoTUtil.getHostName();
|
||||
} catch (IoTException e) {
|
||||
throw new DeviceManagementException(e.getMessage());
|
||||
}
|
||||
String httpsServerPort = System.getProperty(HTTPS_PORT_PROPERTY);
|
||||
String httpServerPort = System.getProperty(HTTP_PORT_PROPERTY);
|
||||
|
||||
String httpsServerEP = HTTPS_PROTOCOL_APPENDER + iotServerIP + ":" + httpsServerPort;
|
||||
String httpServerEP = HTTP_PROTOCOL_APPENDER + iotServerIP + ":" + httpServerPort;
|
||||
String apimEndpoint = httpsServerEP;
|
||||
String mqttEndpoint = MqttConfig.getInstance().getMqttQueueEndpoint();
|
||||
if (mqttEndpoint.contains(LOCALHOST)) {
|
||||
mqttEndpoint = mqttEndpoint.replace(LOCALHOST, iotServerIP);
|
||||
}
|
||||
|
||||
String xmppEndpoint = XmppConfig.getInstance().getXmppEndpoint();
|
||||
|
||||
int indexOfChar = xmppEndpoint.lastIndexOf(":");
|
||||
if (indexOfChar != -1) {
|
||||
xmppEndpoint = xmppEndpoint.substring(0, indexOfChar);
|
||||
}
|
||||
|
||||
xmppEndpoint = xmppEndpoint + ":" + XmppConfig.getInstance().getSERVER_CONNECTION_PORT();
|
||||
|
||||
Map<String, String> contextParams = new HashMap<>();
|
||||
//TODO:refactor remove and move to device type impl
|
||||
contextParams.put("SERVER_NAME", "wso2");
|
||||
contextParams.put("DEVICE_OWNER", owner);
|
||||
contextParams.put("DEVICE_ID", deviceId);
|
||||
contextParams.put("DEVICE_NAME", deviceName);
|
||||
contextParams.put("HTTPS_EP", httpsServerEP);
|
||||
contextParams.put("HTTP_EP", httpServerEP);
|
||||
contextParams.put("APIM_EP", apimEndpoint);
|
||||
contextParams.put("MQTT_EP", mqttEndpoint);
|
||||
contextParams.put("XMPP_EP", xmppEndpoint);
|
||||
contextParams.put("DEVICE_TOKEN", token);
|
||||
contextParams.put("DEVICE_REFRESH_TOKEN", refreshToken);
|
||||
|
||||
ZipArchive zipFile;
|
||||
try {
|
||||
zipFile = IotDeviceManagementUtil.getSketchArchive(archivesPath, templateSketchPath, contextParams);
|
||||
} catch (IOException e) {
|
||||
throw new DeviceManagementException("Zip File Creation Failed", e);
|
||||
}
|
||||
|
||||
return zipFile;
|
||||
}
|
||||
}
|
||||
@ -1,36 +0,0 @@
|
||||
/*
|
||||
* Copyright (c) 2015, 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.raspberrypi.service.impl.dto;
|
||||
|
||||
import org.codehaus.jackson.annotate.JsonIgnoreProperties;
|
||||
|
||||
import javax.xml.bind.annotation.XmlElement;
|
||||
import javax.xml.bind.annotation.XmlRootElement;
|
||||
|
||||
@XmlRootElement
|
||||
|
||||
@JsonIgnoreProperties(ignoreUnknown = true)
|
||||
public class DeviceData {
|
||||
@XmlElement(required = true) public String owner;
|
||||
@XmlElement(required = true) public String deviceId;
|
||||
@XmlElement(required = true) public String reply;
|
||||
@XmlElement public Long time;
|
||||
@XmlElement public String key;
|
||||
@XmlElement public float value;
|
||||
}
|
||||
@ -1,44 +0,0 @@
|
||||
package org.wso2.carbon.device.mgt.iot.raspberrypi.service.impl.dto;
|
||||
|
||||
import org.codehaus.jackson.annotate.JsonIgnoreProperties;
|
||||
|
||||
import javax.xml.bind.annotation.XmlElement;
|
||||
import javax.xml.bind.annotation.XmlRootElement;
|
||||
|
||||
@XmlRootElement
|
||||
/**
|
||||
* This stores sensor event data for the device type.
|
||||
*/
|
||||
@JsonIgnoreProperties(ignoreUnknown = true)
|
||||
public class SensorData {
|
||||
|
||||
@XmlElement public Long time;
|
||||
@XmlElement public String key;
|
||||
|
||||
public String getValue() {
|
||||
return value;
|
||||
}
|
||||
|
||||
public void setValue(String value) {
|
||||
this.value = value;
|
||||
}
|
||||
|
||||
public String getKey() {
|
||||
return key;
|
||||
}
|
||||
|
||||
public void setKey(String key) {
|
||||
this.key = key;
|
||||
}
|
||||
|
||||
public Long getTime() {
|
||||
return time;
|
||||
}
|
||||
|
||||
public void setTime(Long time) {
|
||||
this.time = time;
|
||||
}
|
||||
|
||||
@XmlElement public String value;
|
||||
|
||||
}
|
||||
@ -1,226 +0,0 @@
|
||||
/*
|
||||
* Copyright (c) 2015, 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.raspberrypi.service.impl.util;
|
||||
|
||||
import org.apache.commons.logging.Log;
|
||||
import org.apache.commons.logging.LogFactory;
|
||||
import org.apache.http.HttpResponse;
|
||||
import org.apache.http.client.methods.HttpGet;
|
||||
import org.apache.http.concurrent.FutureCallback;
|
||||
import org.apache.http.impl.nio.client.CloseableHttpAsyncClient;
|
||||
import org.apache.http.impl.nio.client.HttpAsyncClients;
|
||||
import org.wso2.carbon.context.PrivilegedCarbonContext;
|
||||
import org.wso2.carbon.device.mgt.analytics.data.publisher.exception.DataPublisherConfigurationException;
|
||||
import org.wso2.carbon.device.mgt.analytics.data.publisher.service.EventsPublisherService;
|
||||
import org.wso2.carbon.device.mgt.common.DeviceManagementException;
|
||||
import org.wso2.carbon.device.mgt.iot.raspberrypi.plugin.constants.RaspberrypiConstants;
|
||||
|
||||
import javax.ws.rs.HttpMethod;
|
||||
import java.io.BufferedReader;
|
||||
import java.io.IOException;
|
||||
import java.io.InputStreamReader;
|
||||
import java.net.HttpURLConnection;
|
||||
import java.net.MalformedURLException;
|
||||
import java.net.ProtocolException;
|
||||
import java.net.URL;
|
||||
import java.util.concurrent.CountDownLatch;
|
||||
import java.util.concurrent.Future;
|
||||
|
||||
public class RaspberrypiServiceUtils {
|
||||
private static final Log log = LogFactory.getLog(RaspberrypiServiceUtils.class);
|
||||
|
||||
private static final String TEMPERATURE_STREAM_DEFINITION = "org.wso2.iot.devices.temperature";
|
||||
|
||||
public static String sendCommandViaHTTP(final String deviceHTTPEndpoint, String urlContext,
|
||||
boolean fireAndForgot) throws DeviceManagementException {
|
||||
|
||||
String responseMsg = "";
|
||||
String urlString = RaspberrypiConstants.URL_PREFIX + deviceHTTPEndpoint + urlContext;
|
||||
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug(urlString);
|
||||
}
|
||||
|
||||
if (!fireAndForgot) {
|
||||
HttpURLConnection httpConnection = getHttpConnection(urlString);
|
||||
|
||||
try {
|
||||
httpConnection.setRequestMethod(HttpMethod.GET);
|
||||
} catch (ProtocolException e) {
|
||||
String errorMsg =
|
||||
"Protocol specific error occurred when trying to set method to GET" +
|
||||
" for:" + urlString;
|
||||
log.error(errorMsg);
|
||||
throw new DeviceManagementException(errorMsg, e);
|
||||
}
|
||||
|
||||
responseMsg = readResponseFromGetRequest(httpConnection);
|
||||
|
||||
} else {
|
||||
CloseableHttpAsyncClient httpclient = null;
|
||||
try {
|
||||
|
||||
httpclient = HttpAsyncClients.createDefault();
|
||||
httpclient.start();
|
||||
HttpGet request = new HttpGet(urlString);
|
||||
final CountDownLatch latch = new CountDownLatch(1);
|
||||
Future<HttpResponse> future = httpclient.execute(
|
||||
request, new FutureCallback<HttpResponse>() {
|
||||
@Override
|
||||
public void completed(HttpResponse httpResponse) {
|
||||
latch.countDown();
|
||||
}
|
||||
|
||||
@Override
|
||||
public void failed(Exception e) {
|
||||
latch.countDown();
|
||||
}
|
||||
|
||||
@Override
|
||||
public void cancelled() {
|
||||
latch.countDown();
|
||||
}
|
||||
});
|
||||
|
||||
latch.await();
|
||||
|
||||
} catch (InterruptedException e) {
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Sync Interrupted");
|
||||
}
|
||||
} finally {
|
||||
try {
|
||||
if (httpclient != null) {
|
||||
httpclient.close();
|
||||
|
||||
}
|
||||
} catch (IOException e) {
|
||||
if (log.isDebugEnabled()) {
|
||||
log.debug("Failed on close");
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return responseMsg;
|
||||
}
|
||||
|
||||
|
||||
/*public static boolean sendCommandViaMQTT(String deviceOwner, String deviceId, String resource,
|
||||
String state) throws DeviceManagementException {
|
||||
|
||||
boolean result;
|
||||
DeviceController deviceController = new DeviceController();
|
||||
|
||||
try {
|
||||
result = deviceController.publishMqttControl(deviceOwner, RaspberrypiConstants.DEVICE_TYPE, deviceId, resource, state);
|
||||
} catch (DeviceControllerException e) {
|
||||
String errorMsg = "Error whilst trying to publish to MQTT Queue";
|
||||
log.error(errorMsg);
|
||||
throw new DeviceManagementException(errorMsg, e);
|
||||
}
|
||||
return result;
|
||||
}*/
|
||||
|
||||
/* ---------------------------------------------------------------------------------------
|
||||
Utility methods relevant to creating and sending http requests
|
||||
--------------------------------------------------------------------------------------- */
|
||||
|
||||
/* This methods creates and returns a http connection object */
|
||||
|
||||
public static HttpURLConnection getHttpConnection(String urlString) throws
|
||||
DeviceManagementException {
|
||||
|
||||
URL connectionUrl = null;
|
||||
HttpURLConnection httpConnection;
|
||||
|
||||
try {
|
||||
connectionUrl = new URL(urlString);
|
||||
httpConnection = (HttpURLConnection) connectionUrl.openConnection();
|
||||
} catch (MalformedURLException e) {
|
||||
String errorMsg =
|
||||
"Error occured whilst trying to form HTTP-URL from string: " + urlString;
|
||||
log.error(errorMsg);
|
||||
throw new DeviceManagementException(errorMsg, e);
|
||||
} catch (IOException e) {
|
||||
String errorMsg = "Error occured whilst trying to open a connection to: " +
|
||||
connectionUrl.toString();
|
||||
log.error(errorMsg);
|
||||
throw new DeviceManagementException(errorMsg, e);
|
||||
}
|
||||
|
||||
return httpConnection;
|
||||
}
|
||||
|
||||
/* This methods reads and returns the response from the connection */
|
||||
|
||||
public static String readResponseFromGetRequest(HttpURLConnection httpConnection)
|
||||
throws DeviceManagementException {
|
||||
BufferedReader bufferedReader;
|
||||
try {
|
||||
bufferedReader = new BufferedReader(new InputStreamReader(
|
||||
httpConnection.getInputStream()));
|
||||
} catch (IOException e) {
|
||||
String errorMsg =
|
||||
"There is an issue with connecting the reader to the input stream at: " +
|
||||
httpConnection.getURL();
|
||||
log.error(errorMsg);
|
||||
throw new DeviceManagementException(errorMsg, e);
|
||||
}
|
||||
|
||||
String responseLine;
|
||||
StringBuilder completeResponse = new StringBuilder();
|
||||
|
||||
try {
|
||||
while ((responseLine = bufferedReader.readLine()) != null) {
|
||||
completeResponse.append(responseLine);
|
||||
}
|
||||
} catch (IOException e) {
|
||||
String errorMsg =
|
||||
"Error occured whilst trying read from the connection stream at: " +
|
||||
httpConnection.getURL();
|
||||
log.error(errorMsg);
|
||||
throw new DeviceManagementException(errorMsg, e);
|
||||
}
|
||||
try {
|
||||
bufferedReader.close();
|
||||
} catch (IOException e) {
|
||||
log.error(
|
||||
"Could not succesfully close the bufferedReader to the connection at: " +
|
||||
httpConnection.getURL());
|
||||
}
|
||||
|
||||
return completeResponse.toString();
|
||||
}
|
||||
|
||||
public static boolean publishToDAS(String deviceId, float temperature) {
|
||||
PrivilegedCarbonContext ctx = PrivilegedCarbonContext.getThreadLocalCarbonContext();
|
||||
EventsPublisherService deviceAnalyticsService = (EventsPublisherService) ctx.getOSGiService(
|
||||
EventsPublisherService.class, null);
|
||||
String owner = PrivilegedCarbonContext.getThreadLocalCarbonContext().getUsername();
|
||||
Object metdaData[] = {owner, RaspberrypiConstants.DEVICE_TYPE, deviceId, System.currentTimeMillis()};
|
||||
Object payloadData[] = {temperature};
|
||||
try {
|
||||
deviceAnalyticsService.publishEvent(TEMPERATURE_STREAM_DEFINITION, "1.0.0", metdaData, new Object[0], payloadData);
|
||||
} catch (DataPublisherConfigurationException e) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,97 @@
|
||||
/*
|
||||
* 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.
|
||||
*/
|
||||
|
||||
package org.wso2.carbon.device.mgt.iot.raspberrypi.service.impl.util;
|
||||
|
||||
import org.wso2.carbon.device.mgt.common.DeviceManagementException;
|
||||
import org.wso2.carbon.device.mgt.iot.controlqueue.mqtt.MqttConfig;
|
||||
import org.wso2.carbon.device.mgt.iot.controlqueue.xmpp.XmppConfig;
|
||||
import org.wso2.carbon.device.mgt.iot.exception.IoTException;
|
||||
import org.wso2.carbon.device.mgt.iot.util.IoTUtil;
|
||||
import org.wso2.carbon.device.mgt.iot.util.IotDeviceManagementUtil;
|
||||
import org.wso2.carbon.device.mgt.iot.util.ZipArchive;
|
||||
import org.wso2.carbon.utils.CarbonUtils;
|
||||
|
||||
import java.io.File;
|
||||
import java.io.IOException;
|
||||
import java.util.HashMap;
|
||||
import java.util.Map;
|
||||
|
||||
/**
|
||||
* This is used to create a zip file that includes the necessary configuration required for the agent.
|
||||
*/
|
||||
public class ZipUtil {
|
||||
|
||||
private static final String HTTPS_PORT_PROPERTY = "httpsPort";
|
||||
private static final String HTTP_PORT_PROPERTY = "httpPort";
|
||||
|
||||
private static final String LOCALHOST = "localhost";
|
||||
private static final String HTTPS_PROTOCOL_APPENDER = "https://";
|
||||
private static final String HTTP_PROTOCOL_APPENDER = "http://";
|
||||
|
||||
public ZipArchive createZipFile(String owner, String tenantDomain, String deviceType,
|
||||
String deviceId, String deviceName, String token,
|
||||
String refreshToken) throws DeviceManagementException {
|
||||
|
||||
String sketchFolder = "repository" + File.separator + "resources" + File.separator + "sketches";
|
||||
String archivesPath = CarbonUtils.getCarbonHome() + File.separator + sketchFolder + File.separator + "archives" +
|
||||
File.separator + deviceId;
|
||||
String templateSketchPath = sketchFolder + File.separator + deviceType;
|
||||
String iotServerIP;
|
||||
|
||||
try {
|
||||
iotServerIP = IoTUtil.getHostName();
|
||||
String httpsServerPort = System.getProperty(HTTPS_PORT_PROPERTY);
|
||||
String httpServerPort = System.getProperty(HTTP_PORT_PROPERTY);
|
||||
String httpsServerEP = HTTPS_PROTOCOL_APPENDER + iotServerIP + ":" + httpsServerPort;
|
||||
String httpServerEP = HTTP_PROTOCOL_APPENDER + iotServerIP + ":" + httpServerPort;
|
||||
String apimEndpoint = httpsServerEP;
|
||||
String mqttEndpoint = MqttConfig.getInstance().getMqttQueueEndpoint();
|
||||
if (mqttEndpoint.contains(LOCALHOST)) {
|
||||
mqttEndpoint = mqttEndpoint.replace(LOCALHOST, iotServerIP);
|
||||
}
|
||||
String xmppEndpoint = XmppConfig.getInstance().getXmppEndpoint();
|
||||
int indexOfChar = xmppEndpoint.lastIndexOf(":");
|
||||
if (indexOfChar != -1) {
|
||||
xmppEndpoint = xmppEndpoint.substring(0, indexOfChar);
|
||||
}
|
||||
xmppEndpoint = xmppEndpoint + ":" + XmppConfig.getInstance().getSERVER_CONNECTION_PORT();
|
||||
|
||||
Map<String, String> contextParams = new HashMap<>();
|
||||
contextParams.put("SERVER_NAME", "wso2/" + APIUtil.getTenantDomainOftheUser());
|
||||
contextParams.put("DEVICE_OWNER", owner);
|
||||
contextParams.put("DEVICE_ID", deviceId);
|
||||
contextParams.put("DEVICE_NAME", deviceName);
|
||||
contextParams.put("HTTPS_EP", httpsServerEP);
|
||||
contextParams.put("HTTP_EP", httpServerEP);
|
||||
contextParams.put("APIM_EP", apimEndpoint);
|
||||
contextParams.put("MQTT_EP", mqttEndpoint);
|
||||
contextParams.put("XMPP_EP", xmppEndpoint);
|
||||
contextParams.put("DEVICE_TOKEN", token);
|
||||
contextParams.put("DEVICE_REFRESH_TOKEN", refreshToken);
|
||||
|
||||
ZipArchive zipFile;
|
||||
zipFile = IotDeviceManagementUtil.getSketchArchive(archivesPath, templateSketchPath, contextParams);
|
||||
return zipFile;
|
||||
} catch (IoTException e) {
|
||||
throw new DeviceManagementException(e.getMessage());
|
||||
} catch (IOException e) {
|
||||
throw new DeviceManagementException("Zip File Creation Failed", e);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
{{#zone "topCss"}}
|
||||
{{css "css/graph.css"}}
|
||||
{{/zone}}
|
||||
<span id="details" data-devicename="{{device.name}}" data-deviceid="{{device.deviceIdentifier}}"
|
||||
data-appcontext="{{@app.context}}"></span>
|
||||
<div id="div-chart">
|
||||
<div class="chartWrapper" id="chartWrapper">
|
||||
<span id="span-title">Temperature</span>
|
||||
<div id="y_axis" class="custom_y_axis"></div>
|
||||
<div class="legend_container">
|
||||
<div id="smoother" title="Smoothing"></div>
|
||||
<div id="legend"></div>
|
||||
</div>
|
||||
<div id="chart" class="custom_rickshaw_graph" data-backend-api-url = {{backendApiUri}}></div>
|
||||
<div id="x_axis" class="custom_x_axis"></div>
|
||||
<div id="slider" class="custom_slider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{#zone "bottomJs"}}
|
||||
{{js "js/d3.min.js"}}
|
||||
{{js "js/rickshaw.min.js"}}
|
||||
{{js "js/moment.min.js"}}
|
||||
{{js "js/devicetype-graph.js"}}
|
||||
{{/zone}}
|
||||
@ -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 deviceType = context.uriParams.deviceType;
|
||||
var deviceId = request.getParameter("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"] + "/raspberrypi/device/stats/" + deviceId};
|
||||
} else {
|
||||
response.sendError(404, "Device Id " + deviceId + " of type " + deviceType + " cannot be found!");
|
||||
exit();
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
{
|
||||
"version": "1.0.0"
|
||||
}
|
||||
@ -0,0 +1,470 @@
|
||||
/*
|
||||
* 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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,155 @@
|
||||
/*
|
||||
* 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 palette = new Rickshaw.Color.Palette({scheme: "classic9"});
|
||||
|
||||
function drawGraph(from, to) {
|
||||
var backendApiUrl = $("#chart").data("backend-api-url") + "?from=" + from + "&to=" + to;
|
||||
|
||||
var successCallback = function (data) {
|
||||
if (data) {
|
||||
drawLineGraph(JSON.parse(data));
|
||||
}
|
||||
};
|
||||
invokerUtil.get(backendApiUrl, successCallback, function (message) {
|
||||
console.log(message);
|
||||
});
|
||||
}
|
||||
|
||||
function drawLineGraph(data) {
|
||||
var chartWrapperElmId = "#div-chart";
|
||||
var graphWidth = $(chartWrapperElmId).width() - 50;
|
||||
if (data.length == 0 || data.length == undefined) {
|
||||
$("#chart").html("<br/>No data available...");
|
||||
return;
|
||||
}
|
||||
$("#chart").empty();
|
||||
var graphConfig = {
|
||||
element: document.getElementById("chart"),
|
||||
width: graphWidth,
|
||||
height: 400,
|
||||
strokeWidth: 2,
|
||||
renderer: 'line',
|
||||
interpolation: "linear",
|
||||
unstack: true,
|
||||
stack: false,
|
||||
xScale: d3.time.scale(),
|
||||
padding: {top: 0.2, left: 0.02, right: 0.02, bottom: 0.2},
|
||||
series: []
|
||||
};
|
||||
|
||||
var tzOffset = new Date().getTimezoneOffset() * 60;
|
||||
|
||||
var min = Number.MAX_VALUE;
|
||||
var max = Number.MIN_VALUE;
|
||||
var range_min = 99999, range_max = 0;
|
||||
var max_val = parseInt(data[0].values.temperature);
|
||||
var min_val = max_val;
|
||||
var chartData = [];
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
var y_val = parseInt(data[i].values.temperature);
|
||||
if (y_val > max_val) {
|
||||
max_val = y_val;
|
||||
} else if (y_val < min_val) {
|
||||
min_val = y_val;
|
||||
}
|
||||
chartData.push(
|
||||
{
|
||||
x: parseInt(data[i].values.time) - tzOffset,
|
||||
y: y_val
|
||||
}
|
||||
);
|
||||
}
|
||||
if (range_max < max_val) {
|
||||
range_max = max_val;
|
||||
}
|
||||
if (range_min > min_val) {
|
||||
range_min = min_val;
|
||||
}
|
||||
graphConfig['series'].push(
|
||||
{
|
||||
'color': palette.color(),
|
||||
'data': chartData,
|
||||
'name': $("#details").data("devicename"),
|
||||
'scale': d3.scale.linear().domain([Math.min(min, min_val), Math.max(max, max_val)])
|
||||
.nice()
|
||||
}
|
||||
);
|
||||
|
||||
if (graphConfig['series'].length == 0) {
|
||||
$(chartWrapperElmId).html("No data available...");
|
||||
return;
|
||||
}
|
||||
|
||||
var graph = new Rickshaw.Graph(graphConfig);
|
||||
|
||||
graph.render();
|
||||
|
||||
var xAxis = new Rickshaw.Graph.Axis.Time({
|
||||
graph: graph
|
||||
});
|
||||
|
||||
xAxis.render();
|
||||
|
||||
var yAxis = new Rickshaw.Graph.Axis.Y.Scaled({
|
||||
graph: graph,
|
||||
orientation: 'left',
|
||||
element: document.getElementById("y_axis"),
|
||||
width: 40,
|
||||
height: 410,
|
||||
'scale': d3.scale.linear().domain([Math.min(min, range_min), Math.max(max, range_max)]).nice()
|
||||
});
|
||||
|
||||
yAxis.render();
|
||||
|
||||
var slider = new Rickshaw.Graph.RangeSlider.Preview({
|
||||
graph: graph,
|
||||
element: document.getElementById("slider")
|
||||
});
|
||||
|
||||
var legend = new Rickshaw.Graph.Legend({
|
||||
graph: graph,
|
||||
element: document.getElementById('legend')
|
||||
});
|
||||
|
||||
var hoverDetail = new Rickshaw.Graph.HoverDetail({
|
||||
graph: graph,
|
||||
formatter: function (series, x, y) {
|
||||
var date = '<span class="date">' +
|
||||
moment((x + tzOffset) * 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 shelving = new Rickshaw.Graph.Behavior.Series.Toggle({
|
||||
graph: graph,
|
||||
legend: legend
|
||||
});
|
||||
|
||||
var order = new Rickshaw.Graph.Behavior.Series.Order({
|
||||
graph: graph,
|
||||
legend: legend
|
||||
});
|
||||
|
||||
var highlighter = new Rickshaw.Graph.Behavior.Series.Highlight({
|
||||
graph: graph,
|
||||
legend: legend
|
||||
});
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,29 @@
|
||||
{{#zone "topCss"}}
|
||||
{{css "css/graph.css"}}
|
||||
{{/zone}}
|
||||
<div id="div-chart" data-websocketurl="{{websocketEndpoint}}">
|
||||
<div class="chartWrapper" id="chartWrapper">
|
||||
<div id="y_axis" class="custom_y_axis">Temperature</div>
|
||||
<div class="legend_container">
|
||||
<div id="smoother" title="Smoothing"></div>
|
||||
<div id="legend"></div>
|
||||
</div>
|
||||
<div id="chart" 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}}
|
||||
@ -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.devices.temperature/1.0.0?" +
|
||||
"token="+ token +"&deviceId=" + device.deviceIdentifier + "&deviceType=" + device.type;
|
||||
return {"device": device, "websocketEndpoint" : websocketEndpoint};
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
{
|
||||
"version": "1.0.0"
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,107 @@
|
||||
/*
|
||||
* 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 graph;
|
||||
var chartData = [];
|
||||
var palette = new Rickshaw.Color.Palette({scheme: "classic9"});
|
||||
|
||||
$(window).load(function () {
|
||||
var tNow = new Date().getTime() / 1000;
|
||||
for (var i = 0; i < 30; i++) {
|
||||
chartData.push({
|
||||
x: tNow - (30 - i) * 15,
|
||||
y: parseFloat(0)
|
||||
});
|
||||
}
|
||||
|
||||
graph = new Rickshaw.Graph({
|
||||
element: document.getElementById("chart"),
|
||||
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': "Temperature"
|
||||
}]
|
||||
});
|
||||
|
||||
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.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;
|
||||
}
|
||||
});
|
||||
|
||||
var websocketUrl = $("#div-chart").data("websocketurl");
|
||||
connect(websocketUrl)
|
||||
});
|
||||
|
||||
$(window).unload(function () {
|
||||
disconnect();
|
||||
});
|
||||
|
||||
//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);
|
||||
chartData.push({
|
||||
x: parseInt(dataPoint[4]) / 1000,
|
||||
y: parseFloat(dataPoint[5])
|
||||
});
|
||||
chartData.shift();
|
||||
graph.update();
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function disconnect() {
|
||||
if (ws != null) {
|
||||
ws.close();
|
||||
ws = null;
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue