Initial sketch of the GUI web-socket mechanics.
Change-Id: I5f481886fd45ce058be4aaf07fba466e702ae7ad
diff --git a/web/gui/src/main/java/org/onlab/onos/gui/GuiWebSocketServlet.java b/web/gui/src/main/java/org/onlab/onos/gui/GuiWebSocketServlet.java
new file mode 100644
index 0000000..02b46ed
--- /dev/null
+++ b/web/gui/src/main/java/org/onlab/onos/gui/GuiWebSocketServlet.java
@@ -0,0 +1,38 @@
+/*
+ * Copyright 2014 Open Networking Laboratory
+ *
+ * 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.onlab.onos.gui;
+
+import org.eclipse.jetty.websocket.WebSocket;
+import org.eclipse.jetty.websocket.WebSocketServlet;
+import org.onlab.osgi.DefaultServiceDirectory;
+import org.onlab.osgi.ServiceDirectory;
+
+import javax.servlet.http.HttpServletRequest;
+
+/**
+ * Web socket servlet capable of creating various sockets for the user interface.
+ */
+public class GuiWebSocketServlet extends WebSocketServlet {
+
+ private ServiceDirectory directory = new DefaultServiceDirectory();
+
+ @Override
+ public WebSocket doWebSocketConnect(HttpServletRequest request, String protocol) {
+
+ return new TopologyWebSocket(directory);
+ }
+
+}
diff --git a/web/gui/src/main/java/org/onlab/onos/gui/TopologyWebSocket.java b/web/gui/src/main/java/org/onlab/onos/gui/TopologyWebSocket.java
new file mode 100644
index 0000000..7828043
--- /dev/null
+++ b/web/gui/src/main/java/org/onlab/onos/gui/TopologyWebSocket.java
@@ -0,0 +1,106 @@
+/*
+ * Copyright 2014 Open Networking Laboratory
+ *
+ * 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.onlab.onos.gui;
+
+import org.eclipse.jetty.websocket.WebSocket;
+import org.onlab.onos.net.device.DeviceService;
+import org.onlab.onos.net.topology.Topology;
+import org.onlab.onos.net.topology.TopologyEdge;
+import org.onlab.onos.net.topology.TopologyEvent;
+import org.onlab.onos.net.topology.TopologyGraph;
+import org.onlab.onos.net.topology.TopologyListener;
+import org.onlab.onos.net.topology.TopologyService;
+import org.onlab.onos.net.topology.TopologyVertex;
+import org.onlab.osgi.ServiceDirectory;
+
+import java.io.IOException;
+
+/**
+ * Web socket capable of interacting with the GUI topology view.
+ */
+public class TopologyWebSocket implements WebSocket.OnTextMessage, TopologyListener {
+
+ private final ServiceDirectory directory;
+ private final TopologyService topologyService;
+ private final DeviceService deviceService;
+
+ private Connection connection;
+
+ /**
+ * Creates a new web-socket for serving data to GUI topology view.
+ *
+ * @param directory service directory
+ */
+ public TopologyWebSocket(ServiceDirectory directory) {
+ this.directory = directory;
+ topologyService = directory.get(TopologyService.class);
+ deviceService = directory.get(DeviceService.class);
+ }
+
+ @Override
+ public void onOpen(Connection connection) {
+ this.connection = connection;
+
+ // Register for topology events...
+ if (topologyService != null && deviceService != null) {
+ topologyService.addListener(this);
+
+ sendMessage("Yo!!!");
+
+ Topology topology = topologyService.currentTopology();
+ TopologyGraph graph = topologyService.getGraph(topology);
+ for (TopologyVertex vertex : graph.getVertexes()) {
+ sendMessage(deviceService.getDevice(vertex.deviceId()).toString());
+ }
+
+ for (TopologyEdge edge : graph.getEdges()) {
+ sendMessage(edge.link().toString());
+ }
+
+ sendMessage("That's what we're starting with...");
+
+ } else {
+ sendMessage("No topology service!!!");
+ }
+ }
+
+ @Override
+ public void onClose(int closeCode, String message) {
+ TopologyService topologyService = directory.get(TopologyService.class);
+ if (topologyService != null) {
+ topologyService.removeListener(this);
+ }
+ }
+
+ @Override
+ public void onMessage(String data) {
+ System.out.println("Received: " + data);
+ }
+
+ public void sendMessage(String data) {
+ try {
+ connection.sendMessage(data);
+ } catch (IOException e) {
+ e.printStackTrace();
+ }
+ }
+
+ @Override
+ public void event(TopologyEvent event) {
+ sendMessage(event.toString());
+ }
+}
+
diff --git a/web/gui/src/main/webapp/WEB-INF/web.xml b/web/gui/src/main/webapp/WEB-INF/web.xml
index c5c6e28..ab7a550 100644
--- a/web/gui/src/main/webapp/WEB-INF/web.xml
+++ b/web/gui/src/main/webapp/WEB-INF/web.xml
@@ -39,4 +39,16 @@
<url-pattern>/rs/*</url-pattern>
</servlet-mapping>
+ <servlet>
+ <servlet-name>Web Socket Service</servlet-name>
+ <servlet-class>org.onlab.onos.gui.GuiWebSocketServlet</servlet-class>
+ <load-on-startup>2</load-on-startup>
+ </servlet>
+
+ <servlet-mapping>
+ <servlet-name>Web Socket Service</servlet-name>
+ <url-pattern>/ws/*</url-pattern>
+ </servlet-mapping>
+
+
</web-app>
\ No newline at end of file
diff --git a/web/gui/src/main/webapp/topo2.js b/web/gui/src/main/webapp/topo2.js
index d345fda..e7444c9 100644
--- a/web/gui/src/main/webapp/topo2.js
+++ b/web/gui/src/main/webapp/topo2.js
@@ -40,6 +40,7 @@
showBackground: true
},
backgroundUrl: 'img/us-map.png',
+ webSockUrl: 'ws/topology',
data: {
live: {
jsonUrl: 'rs/topology/graph',
@@ -130,6 +131,7 @@
links: [],
lookup: {}
},
+ webSock,
labelIdx = 0,
selected = {},
highlighted = null,
@@ -579,6 +581,52 @@
}
// ==============================
+ // Web-Socket for live data
+
+ function webSockUrl() {
+ return document.location.toString()
+ .replace(/\#.*/, '')
+ .replace('http://', 'ws://')
+ .replace('https://', 'wss://')
+ .replace('index2.html', config.webSockUrl);
+ }
+
+ webSock = {
+ ws : null,
+
+ connect : function() {
+ webSock.ws = new WebSocket(webSockUrl());
+
+ webSock.ws.onopen = function() {
+ webSock._send("Hi there!");
+ };
+
+ webSock.ws.onmessage = function(m) {
+ if (m.data) {
+ console.log(m.data);
+ }
+ };
+
+ webSock.ws.onclose = function(m) {
+ webSock.ws = null;
+ };
+ },
+
+ send : function(text) {
+ if (text != null && text.length > 0) {
+ webSock._send(text);
+ }
+ },
+
+ _send : function(message) {
+ if (webSock.ws) {
+ webSock.ws.send(message);
+ }
+ }
+
+ };
+
+ // ==============================
// View life-cycle callbacks
function preload(view, ctx) {
@@ -656,6 +704,7 @@
.on('tick', tick);
network.drag = d3u.createDragBehavior(network.force, selectCb, atDragEnd);
+ webSock.connect();
}
function load(view, ctx) {
diff --git a/web/gui/src/main/webapp/ws.html b/web/gui/src/main/webapp/ws.html
new file mode 100644
index 0000000..cac99b2
--- /dev/null
+++ b/web/gui/src/main/webapp/ws.html
@@ -0,0 +1,54 @@
+<html>
+<head>
+ <title>Web Sockets Demo</title>
+
+ <script src="libs/jquery-2.1.1.min.js"></script>
+
+ <script type='text/javascript'>
+ if (!window.WebSocket)
+ alert("WebSocket not supported by this browser");
+
+ var server = {
+ connect : function() {
+ var location = document.location.toString().replace('http://',
+ 'ws://').replace('https://', 'wss://').replace('ws.html','ws/topology');
+ this.ws = new WebSocket(location);
+
+ this.ws.onopen = function() {
+ server._send("Hi there!");
+ };
+
+ this.ws.onmessage = function(m) {
+ if (m.data) {
+ $('#log').append(m.data).append($('<br/>'));
+ }
+ };
+
+ this.ws.onclose = function(m) {
+ this.ws = null;
+ };
+ },
+
+ _send : function(message) {
+ if (this.ws) {
+ this.ws.send(message);
+ }
+ },
+
+ send : function(text) {
+ if (text != null && text.length > 0) {
+ server._send(text);
+ }
+ }
+ };
+ </script>
+</head>
+<body>
+<pre id='log'></pre>
+
+<script type='text/javascript'>
+ server.connect();
+</script>
+
+</body>
+</html>