Initial sketch of the GUI web-socket mechanics.

Change-Id: I5f481886fd45ce058be4aaf07fba466e702ae7ad

@@ -119,6 +119,7 @@
              description="ONOS GUI console components">
         <feature>onos-api</feature>
         <feature>onos-thirdparty-web</feature>
+        <bundle>mvn:org.eclipse.jetty/jetty-websocket/8.1.15.v20140411</bundle>
         <bundle>mvn:org.onlab.onos/onos-gui/1.0.0-SNAPSHOT</bundle>
     </feature>
 

@@ -35,4 +35,16 @@
         <web.context>/onos/ui</web.context>
     </properties>
 
+    <dependencies>
+        <dependency>
+            <groupId>org.eclipse.jetty</groupId>
+            <artifactId>jetty-websocket</artifactId>
+            <version>8.1.15.v20140411</version>
+        </dependency>
+        <dependency>
+            <groupId>javax.servlet</groupId>
+            <artifactId>servlet-api</artifactId>
+            <version>2.5</version>
+        </dependency>
+    </dependencies>
 </project>

+/*
+ * 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);
+    }
+
+}

+/*
+ * 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());
+    }
+}
+

@@ -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

@@ -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) {

+<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>

@@ -131,6 +131,7 @@
                             com.fasterxml.jackson.databind,
                             com.fasterxml.jackson.databind.node,
                             com.google.common.base.*,
+                            org.eclipse.jetty.websocket.*,
                             org.onlab.api.*,
                             org.onlab.osgi.*,
                             org.onlab.packet.*,