GUI - reworked to allow for event-based topology building, in preparation for web-socket connection to the server.
 - device nodes will enter in a fixed location, if metaUi data is included in the addDevice event.
 - device nodes now adjust their bounds to fit the text (and show an icon).
 - added cycle labels function (press the 'L' key).
 - links now appear with "transition" animation.
 NOTE: this is still WIP.

Change-Id: I3adbe9895e189e482316e86384dd53fd27781cd3
diff --git a/web/gui/src/main/webapp/json/eventTest_1.json b/web/gui/src/main/webapp/json/eventTest_1.json
new file mode 100644
index 0000000..d4c8ddb
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_1.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff08",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff08",
+      "FF:FF:FF:FF:FF:08",
+      "?"
+    ],
+    "metaUi": {
+      "x": 539,
+      "y": 186
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_10.json b/web/gui/src/main/webapp/json/eventTest_10.json
new file mode 100644
index 0000000..9b30b4a
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_10.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff04",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff04",
+      "FF:FF:FF:FF:FF:04",
+      "?"
+    ],
+    "metaUi": {
+      "x": 322,
+      "y": 138
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_11.json b/web/gui/src/main/webapp/json/eventTest_11.json
new file mode 100644
index 0000000..e907444
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_11.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffff000A",
+    "type": "switch",
+    "online": false,
+    "labels": [
+      "0000ffffffff000A",
+      "FF:FF:FF:FF:00:0A",
+      "?"
+    ],
+    "metaUi": {
+      "x": 832,
+      "y": 223
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_12.json b/web/gui/src/main/webapp/json/eventTest_12.json
new file mode 100644
index 0000000..e53a6cd
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_12.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffff0001",
+    "type": "switch",
+    "online": false,
+    "labels": [
+      "0000ffffffff0001",
+      "FF:FF:FF:FF:00:01",
+      "?"
+    ],
+    "metaUi": {
+      "x": 167,
+      "y": 403
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_13.json b/web/gui/src/main/webapp/json/eventTest_13.json
new file mode 100644
index 0000000..6d2341f
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_13.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff01",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff01",
+      "FF:FF:FF:FF:FF:01",
+      "?"
+    ],
+    "metaUi": {
+      "x": 227,
+      "y": 460
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_14.json b/web/gui/src/main/webapp/json/eventTest_14.json
new file mode 100644
index 0000000..e196148
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_14.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffff0004",
+    "type": "switch",
+    "online": false,
+    "labels": [
+      "0000ffffffff0004",
+      "FF:FF:FF:FF:00:04",
+      "?"
+    ],
+    "metaUi": {
+      "x": 317,
+      "y": 73
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_15.json b/web/gui/src/main/webapp/json/eventTest_15.json
new file mode 100644
index 0000000..3622122
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_15.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff0A",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff0A",
+      "FF:FF:FF:FF:FF:0A",
+      "?"
+    ],
+    "metaUi": {
+      "x": 840,
+      "y": 290
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_16.json b/web/gui/src/main/webapp/json/eventTest_16.json
new file mode 100644
index 0000000..274adc1
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_16.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff09",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff09",
+      "FF:FF:FF:FF:FF:09",
+      "?"
+    ],
+    "metaUi": {
+      "x": 1010,
+      "y": 229
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_17.json b/web/gui/src/main/webapp/json/eventTest_17.json
new file mode 100644
index 0000000..e217456
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_17.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff02",
+    "srcPort": "20",
+    "dst": "of:0000ffffffffff05",
+    "dstPort": "10",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "80 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_18.json b/web/gui/src/main/webapp/json/eventTest_18.json
new file mode 100644
index 0000000..5687698
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_18.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffff000A",
+    "srcPort": "2",
+    "dst": "of:0000ffffffffff0A",
+    "dstPort": "1",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "100 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_19.json b/web/gui/src/main/webapp/json/eventTest_19.json
new file mode 100644
index 0000000..24aeb2d
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_19.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff03",
+    "srcPort": "10",
+    "dst": "of:0000ffffffffff02",
+    "dstPort": "10",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_2.json b/web/gui/src/main/webapp/json/eventTest_2.json
new file mode 100644
index 0000000..fd446ba
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_2.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff03",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff03",
+      "FF:FF:FF:FF:FF:03",
+      "?"
+    ],
+    "metaUi": {
+      "x": 95,
+      "y": 225
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_20.json b/web/gui/src/main/webapp/json/eventTest_20.json
new file mode 100644
index 0000000..f42b50e
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_20.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff07",
+    "srcPort": "21",
+    "dst": "of:0000ffffffffff05",
+    "dstPort": "20",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_21.json b/web/gui/src/main/webapp/json/eventTest_21.json
new file mode 100644
index 0000000..5af0ac7
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_21.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffff0001",
+    "srcPort": "2",
+    "dst": "of:0000ffffffffff01",
+    "dstPort": "1",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_22.json b/web/gui/src/main/webapp/json/eventTest_22.json
new file mode 100644
index 0000000..0d4cf2b
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_22.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff09",
+    "srcPort": "20",
+    "dst": "of:0000ffffffffff0A",
+    "dstPort": "20",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_23.json b/web/gui/src/main/webapp/json/eventTest_23.json
new file mode 100644
index 0000000..54383bc
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_23.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff06",
+    "srcPort": "20",
+    "dst": "of:0000ffffffffff05",
+    "dstPort": "30",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_24.json b/web/gui/src/main/webapp/json/eventTest_24.json
new file mode 100644
index 0000000..2287f6c
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_24.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff07",
+    "srcPort": "30",
+    "dst": "of:0000ffffffffff08",
+    "dstPort": "20",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_25.json b/web/gui/src/main/webapp/json/eventTest_25.json
new file mode 100644
index 0000000..adad8a6
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_25.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff03",
+    "srcPort": "20",
+    "dst": "of:0000ffffffffff06",
+    "dstPort": "10",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_26.json b/web/gui/src/main/webapp/json/eventTest_26.json
new file mode 100644
index 0000000..245c823
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_26.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff02",
+    "srcPort": "10",
+    "dst": "of:0000ffffffffff01",
+    "dstPort": "10",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_27.json b/web/gui/src/main/webapp/json/eventTest_27.json
new file mode 100644
index 0000000..b856573
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_27.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff09",
+    "srcPort": "1",
+    "dst": "of:0000ffffffff0009",
+    "dstPort": "2",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_28.json b/web/gui/src/main/webapp/json/eventTest_28.json
new file mode 100644
index 0000000..232dc3b
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_28.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff03",
+    "srcPort": "30",
+    "dst": "of:0000ffffffffff04",
+    "dstPort": "10",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_29.json b/web/gui/src/main/webapp/json/eventTest_29.json
new file mode 100644
index 0000000..1a845ce
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_29.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff07",
+    "srcPort": "20",
+    "dst": "of:0000ffffffffff09",
+    "dstPort": "10",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_3.json b/web/gui/src/main/webapp/json/eventTest_3.json
new file mode 100644
index 0000000..23bf26a
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_3.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffff0007",
+    "type": "switch",
+    "online": false,
+    "labels": [
+      "0000ffffffff0007",
+      "FF:FF:FF:FF:00:07",
+      "?"
+    ],
+    "metaUi": {
+      "x": 890,
+      "y": 375
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_30.json b/web/gui/src/main/webapp/json/eventTest_30.json
new file mode 100644
index 0000000..ae2d4c1
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_30.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff0A",
+    "srcPort": "10",
+    "dst": "of:0000ffffffffff08",
+    "dstPort": "30",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_31.json b/web/gui/src/main/webapp/json/eventTest_31.json
new file mode 100644
index 0000000..438aa1b
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_31.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffff0004",
+    "srcPort": "2",
+    "dst": "of:0000ffffffffff04",
+    "dstPort": "1",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_32.json b/web/gui/src/main/webapp/json/eventTest_32.json
new file mode 100644
index 0000000..c479f01
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_32.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff07",
+    "srcPort": "1",
+    "dst": "of:0000ffffffff0007",
+    "dstPort": "2",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_33.json b/web/gui/src/main/webapp/json/eventTest_33.json
new file mode 100644
index 0000000..2cc3a32
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_33.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffff0003",
+    "srcPort": "2",
+    "dst": "of:0000ffffffffff03",
+    "dstPort": "1",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_34.json b/web/gui/src/main/webapp/json/eventTest_34.json
new file mode 100644
index 0000000..96015b5
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_34.json
@@ -0,0 +1,14 @@
+{
+  "event": "addLink",
+  "payload": {
+    "src": "of:0000ffffffffff06",
+    "srcPort": "30",
+    "dst": "of:0000ffffffffff08",
+    "dstPort": "10",
+    "type": "optical",
+    "linkWidth": 2,
+    "props" : {
+      "BW": "70 G"
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_4.json b/web/gui/src/main/webapp/json/eventTest_4.json
new file mode 100644
index 0000000..c600401
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_4.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffff0009",
+    "type": "switch",
+    "online": false,
+    "labels": [
+      "0000ffffffff0009",
+      "FF:FF:FF:FF:00:09",
+      "?"
+    ],
+    "metaUi": {
+      "x": 1004,
+      "y": 163
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_5.json b/web/gui/src/main/webapp/json/eventTest_5.json
new file mode 100644
index 0000000..af912a7
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_5.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff02",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff02",
+      "FF:FF:FF:FF:FF:02",
+      "?"
+    ],
+    "metaUi": {
+      "x": 211,
+      "y": 307
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_6.json b/web/gui/src/main/webapp/json/eventTest_6.json
new file mode 100644
index 0000000..50273bc
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_6.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffff0003",
+    "type": "switch",
+    "online": false,
+    "labels": [
+      "0000ffffffff0003",
+      "FF:FF:FF:FF:00:03",
+      "?"
+    ],
+    "metaUi": {
+      "x": 114,
+      "y": 158
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_7.json b/web/gui/src/main/webapp/json/eventTest_7.json
new file mode 100644
index 0000000..7cd29b0
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_7.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff07",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff07",
+      "FF:FF:FF:FF:FF:07",
+      "?"
+    ],
+    "metaUi": {
+      "x": 925,
+      "y": 446
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_8.json b/web/gui/src/main/webapp/json/eventTest_8.json
new file mode 100644
index 0000000..a4082d1
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_8.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff06",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff06",
+      "FF:FF:FF:FF:FF:06",
+      "?"
+    ],
+    "metaUi": {
+      "x": 336,
+      "y": 254
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/eventTest_9.json b/web/gui/src/main/webapp/json/eventTest_9.json
new file mode 100644
index 0000000..1e0f427
--- /dev/null
+++ b/web/gui/src/main/webapp/json/eventTest_9.json
@@ -0,0 +1,17 @@
+{
+  "event": "addDevice",
+  "payload": {
+    "id": "of:0000ffffffffff05",
+    "type": "roadm",
+    "online": false,
+    "labels": [
+      "0000ffffffffff05",
+      "FF:FF:FF:FF:FF:05",
+      "?"
+    ],
+    "metaUi": {
+      "x": 539,
+      "y": 524
+    }
+  }
+}
diff --git a/web/gui/src/main/webapp/json/topoTest_1.json b/web/gui/src/main/webapp/json/topoTest_1.json
deleted file mode 100644
index 052e126..0000000
--- a/web/gui/src/main/webapp/json/topoTest_1.json
+++ /dev/null
@@ -1,367 +0,0 @@
-{
-    "comment": [
-        "2 links removed from base",
-        "  ff07 - ff09  ",
-        "  ff01 - 0001  "
-    ],
-    "devices": [
-        {
-            "id": "of:0000ffffffffff08",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff08",
-                "FF:FF:FF:FF:FF:08",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff03",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff03",
-                "FF:FF:FF:FF:FF:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff02",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff02",
-                "FF:FF:FF:FF:FF:02",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0003",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0003",
-                "FF:FF:FF:FF:00:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff07",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff07",
-                "FF:FF:FF:FF:FF:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff06",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff06",
-                "FF:FF:FF:FF:FF:06",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0007",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0007",
-                "FF:FF:FF:FF:00:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff05",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff05",
-                "FF:FF:FF:FF:FF:05",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0009",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0009",
-                "FF:FF:FF:FF:00:09",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff04",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff04",
-                "FF:FF:FF:FF:FF:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff000A",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff000A",
-                "FF:FF:FF:FF:00:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0001",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0001",
-                "FF:FF:FF:FF:00:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff01",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff01",
-                "FF:FF:FF:FF:FF:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0004",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0004",
-                "FF:FF:FF:FF:00:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff0A",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff0A",
-                "FF:FF:FF:FF:FF:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff09",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff09",
-                "FF:FF:FF:FF:FF:09",
-                "?"
-            ]
-        }
-    ],
-    "links": [
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff000A",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff02",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "21",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff06",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0009",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff0A",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0004",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0007",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0003",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff03",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        }
-    ],
-    "hosts": [
-        {
-            "id": "00:00:00:00:00:03/-1",
-            "cp": {
-                "device": "of:0000ffffffff0003",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.3",
-                "00:00:00:00:00:03"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:04/-1",
-            "cp": {
-                "device": "of:0000ffffffff0004",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.4",
-                "00:00:00:00:00:04"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:0A/-1",
-            "cp": {
-                "device": "of:0000ffffffff000A",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.10",
-                "00:00:00:00:00:0A"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:09/-1",
-            "cp": {
-                "device": "of:0000ffffffff0009",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.9",
-                "00:00:00:00:00:09"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:07/-1",
-            "cp": {
-                "device": "of:0000ffffffff0007",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.7",
-                "00:00:00:00:00:07"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:01/-1",
-            "cp": {
-                "device": "of:0000ffffffff0001",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.1",
-                "00:00:00:00:00:01"
-            ]
-        }
-    ]
-}
diff --git a/web/gui/src/main/webapp/json/topoTest_2.json b/web/gui/src/main/webapp/json/topoTest_2.json
deleted file mode 100644
index 0b0802f..0000000
--- a/web/gui/src/main/webapp/json/topoTest_2.json
+++ /dev/null
@@ -1,372 +0,0 @@
-{
-    "comment": [
-        "1 packet switch removed from base",
-        "  0007  "
-    ],
-    "devices": [
-        {
-            "id": "of:0000ffffffffff08",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff08",
-                "FF:FF:FF:FF:FF:08",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff03",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff03",
-                "FF:FF:FF:FF:FF:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff02",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff02",
-                "FF:FF:FF:FF:FF:02",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0003",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0003",
-                "FF:FF:FF:FF:00:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff07",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff07",
-                "FF:FF:FF:FF:FF:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff06",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff06",
-                "FF:FF:FF:FF:FF:06",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff05",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff05",
-                "FF:FF:FF:FF:FF:05",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0009",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0009",
-                "FF:FF:FF:FF:00:09",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff04",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff04",
-                "FF:FF:FF:FF:FF:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff000A",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff000A",
-                "FF:FF:FF:FF:00:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0001",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0001",
-                "FF:FF:FF:FF:00:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff01",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff01",
-                "FF:FF:FF:FF:FF:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0004",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0004",
-                "FF:FF:FF:FF:00:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff0A",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff0A",
-                "FF:FF:FF:FF:FF:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff09",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff09",
-                "FF:FF:FF:FF:FF:09",
-                "?"
-            ]
-        }
-    ],
-    "links": [
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff000A",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff02",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "21",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0001",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff06",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0009",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff09",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff0A",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0004",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0007",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0003",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff03",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        }
-    ],
-    "hosts": [
-        {
-            "id": "00:00:00:00:00:03/-1",
-            "cp": {
-                "device": "of:0000ffffffff0003",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.3",
-                "00:00:00:00:00:03"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:04/-1",
-            "cp": {
-                "device": "of:0000ffffffff0004",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.4",
-                "00:00:00:00:00:04"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:0A/-1",
-            "cp": {
-                "device": "of:0000ffffffff000A",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.10",
-                "00:00:00:00:00:0A"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:09/-1",
-            "cp": {
-                "device": "of:0000ffffffff0009",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.9",
-                "00:00:00:00:00:09"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:07/-1",
-            "cp": {
-                "device": "of:0000ffffffff0007",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.7",
-                "00:00:00:00:00:07"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:01/-1",
-            "cp": {
-                "device": "of:0000ffffffff0001",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.1",
-                "00:00:00:00:00:01"
-            ]
-        }
-    ]
-}
diff --git a/web/gui/src/main/webapp/json/topoTest_3.json b/web/gui/src/main/webapp/json/topoTest_3.json
deleted file mode 100644
index 24fbba7..0000000
--- a/web/gui/src/main/webapp/json/topoTest_3.json
+++ /dev/null
@@ -1,372 +0,0 @@
-{
-    "comment": [
-        "1 optical switch removed from base",
-        "  ff07  "
-    ],
-    "devices": [
-        {
-            "id": "of:0000ffffffffff08",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff08",
-                "FF:FF:FF:FF:FF:08",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff03",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff03",
-                "FF:FF:FF:FF:FF:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff02",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff02",
-                "FF:FF:FF:FF:FF:02",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0003",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0003",
-                "FF:FF:FF:FF:00:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff06",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff06",
-                "FF:FF:FF:FF:FF:06",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0007",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0007",
-                "FF:FF:FF:FF:00:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff05",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff05",
-                "FF:FF:FF:FF:FF:05",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0009",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0009",
-                "FF:FF:FF:FF:00:09",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff04",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff04",
-                "FF:FF:FF:FF:FF:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff000A",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff000A",
-                "FF:FF:FF:FF:00:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0001",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0001",
-                "FF:FF:FF:FF:00:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff01",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff01",
-                "FF:FF:FF:FF:FF:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0004",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0004",
-                "FF:FF:FF:FF:00:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff0A",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff0A",
-                "FF:FF:FF:FF:FF:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff09",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff09",
-                "FF:FF:FF:FF:FF:09",
-                "?"
-            ]
-        }
-    ],
-    "links": [
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff000A",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff02",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "21",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0001",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff06",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0009",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff09",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff0A",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0004",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0007",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0003",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff03",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        }
-    ],
-    "hosts": [
-        {
-            "id": "00:00:00:00:00:03/-1",
-            "cp": {
-                "device": "of:0000ffffffff0003",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.3",
-                "00:00:00:00:00:03"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:04/-1",
-            "cp": {
-                "device": "of:0000ffffffff0004",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.4",
-                "00:00:00:00:00:04"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:0A/-1",
-            "cp": {
-                "device": "of:0000ffffffff000A",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.10",
-                "00:00:00:00:00:0A"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:09/-1",
-            "cp": {
-                "device": "of:0000ffffffff0009",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.9",
-                "00:00:00:00:00:09"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:07/-1",
-            "cp": {
-                "device": "of:0000ffffffff0007",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.7",
-                "00:00:00:00:00:07"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:01/-1",
-            "cp": {
-                "device": "of:0000ffffffff0001",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.1",
-                "00:00:00:00:00:01"
-            ]
-        }
-    ]
-}
diff --git a/web/gui/src/main/webapp/json/topoTest_4.json b/web/gui/src/main/webapp/json/topoTest_4.json
deleted file mode 100644
index 6e5e22f..0000000
--- a/web/gui/src/main/webapp/json/topoTest_4.json
+++ /dev/null
@@ -1,415 +0,0 @@
-{
-    "comment": [
-        "3 hosts added to base",
-        "  2 to 000A, 1 to 0007  "
-    ],
-    "devices": [
-        {
-            "id": "of:0000ffffffffff08",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff08",
-                "FF:FF:FF:FF:FF:08",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff03",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff03",
-                "FF:FF:FF:FF:FF:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff02",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff02",
-                "FF:FF:FF:FF:FF:02",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0003",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0003",
-                "FF:FF:FF:FF:00:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff07",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff07",
-                "FF:FF:FF:FF:FF:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff06",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff06",
-                "FF:FF:FF:FF:FF:06",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0007",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0007",
-                "FF:FF:FF:FF:00:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff05",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff05",
-                "FF:FF:FF:FF:FF:05",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0009",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0009",
-                "FF:FF:FF:FF:00:09",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff04",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff04",
-                "FF:FF:FF:FF:FF:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff000A",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff000A",
-                "FF:FF:FF:FF:00:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0001",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0001",
-                "FF:FF:FF:FF:00:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff01",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff01",
-                "FF:FF:FF:FF:FF:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0004",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0004",
-                "FF:FF:FF:FF:00:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff0A",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff0A",
-                "FF:FF:FF:FF:FF:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff09",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff09",
-                "FF:FF:FF:FF:FF:09",
-                "?"
-            ]
-        }
-    ],
-    "links": [
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff000A",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff02",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "21",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0001",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff06",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0009",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff09",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff0A",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0004",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0007",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0003",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff03",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        }
-    ],
-    "hosts": [
-        {
-            "id": "00:00:00:00:00:03/-1",
-            "cp": {
-                "device": "of:0000ffffffff0003",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.3",
-                "00:00:00:00:00:03"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:04/-1",
-            "cp": {
-                "device": "of:0000ffffffff0004",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.4",
-                "00:00:00:00:00:04"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:0A/-1",
-            "cp": {
-                "device": "of:0000ffffffff000A",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.10",
-                "00:00:00:00:00:0A"
-            ]
-        },
-        {
-            "id": "00:00:00:00:65:0A/-1",
-            "cp": {
-                "device": "of:0000ffffffff000A",
-                "port": 101
-            },
-            "labels": [
-                "10.0.0.101",
-                "00:00:00:00:65:0A"
-            ]
-        },
-        {
-            "id": "00:00:00:00:66:0A/-1",
-            "cp": {
-                "device": "of:0000ffffffff000A",
-                "port": 102
-            },
-            "labels": [
-                "10.0.0.102",
-                "00:00:00:00:66:0A"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:09/-1",
-            "cp": {
-                "device": "of:0000ffffffff0009",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.9",
-                "00:00:00:00:00:09"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:07/-1",
-            "cp": {
-                "device": "of:0000ffffffff0007",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.7",
-                "00:00:00:00:00:07"
-            ]
-        },
-        {
-            "id": "00:00:00:00:67:07/-1",
-            "cp": {
-                "device": "of:0000ffffffff0007",
-                "port": 103
-            },
-            "labels": [
-                "10.0.0.73",
-                "00:00:00:00:67:07"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:01/-1",
-            "cp": {
-                "device": "of:0000ffffffff0001",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.1",
-                "00:00:00:00:00:01"
-            ]
-        }
-    ]
-}
diff --git a/web/gui/src/main/webapp/json/topoTest_base.json b/web/gui/src/main/webapp/json/topoTest_base.json
deleted file mode 100644
index 24f1e6c..0000000
--- a/web/gui/src/main/webapp/json/topoTest_base.json
+++ /dev/null
@@ -1,378 +0,0 @@
-{
-    "devices": [
-        {
-            "id": "of:0000ffffffffff08",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff08",
-                "FF:FF:FF:FF:FF:08",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff03",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff03",
-                "FF:FF:FF:FF:FF:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff02",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff02",
-                "FF:FF:FF:FF:FF:02",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0003",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0003",
-                "FF:FF:FF:FF:00:03",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff07",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff07",
-                "FF:FF:FF:FF:FF:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff06",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff06",
-                "FF:FF:FF:FF:FF:06",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0007",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0007",
-                "FF:FF:FF:FF:00:07",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff05",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff05",
-                "FF:FF:FF:FF:FF:05",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0009",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0009",
-                "FF:FF:FF:FF:00:09",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff04",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff04",
-                "FF:FF:FF:FF:FF:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff000A",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff000A",
-                "FF:FF:FF:FF:00:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0001",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0001",
-                "FF:FF:FF:FF:00:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff01",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff01",
-                "FF:FF:FF:FF:FF:01",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffff0004",
-            "type": "switch",
-            "online": false,
-            "labels": [
-                "0000ffffffff0004",
-                "FF:FF:FF:FF:00:04",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff0A",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff0A",
-                "FF:FF:FF:FF:FF:0A",
-                "?"
-            ]
-        },
-        {
-            "id": "of:0000ffffffffff09",
-            "type": "roadm",
-            "online": false,
-            "labels": [
-                "0000ffffffffff09",
-                "FF:FF:FF:FF:FF:09",
-                "?"
-            ]
-        }
-    ],
-    "links": [
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff000A",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff02",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "21",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0001",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff0A",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff05",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "20",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff06",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff02",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff01",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff09",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0009",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff03",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "20",
-            "dst": "of:0000ffffffffff09",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff0A",
-            "srcPort": "10",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "30",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0004",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff04",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff07",
-            "srcPort": "1",
-            "dst": "of:0000ffffffff0007",
-            "dstPort": "2",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffff0003",
-            "srcPort": "2",
-            "dst": "of:0000ffffffffff03",
-            "dstPort": "1",
-            "type": "optical",
-            "linkWidth": 2
-        },
-        {
-            "src": "of:0000ffffffffff06",
-            "srcPort": "30",
-            "dst": "of:0000ffffffffff08",
-            "dstPort": "10",
-            "type": "optical",
-            "linkWidth": 2
-        }
-    ],
-    "hosts": [
-        {
-            "id": "00:00:00:00:00:03/-1",
-            "cp": {
-                "device": "of:0000ffffffff0003",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.3",
-                "00:00:00:00:00:03"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:04/-1",
-            "cp": {
-                "device": "of:0000ffffffff0004",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.4",
-                "00:00:00:00:00:04"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:0A/-1",
-            "cp": {
-                "device": "of:0000ffffffff000A",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.10",
-                "00:00:00:00:00:0A"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:09/-1",
-            "cp": {
-                "device": "of:0000ffffffff0009",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.9",
-                "00:00:00:00:00:09"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:07/-1",
-            "cp": {
-                "device": "of:0000ffffffff0007",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.7",
-                "00:00:00:00:00:07"
-            ]
-        },
-        {
-            "id": "00:00:00:00:00:01/-1",
-            "cp": {
-                "device": "of:0000ffffffff0001",
-                "port": 1
-            },
-            "labels": [
-                "10.0.0.1",
-                "00:00:00:00:00:01"
-            ]
-        }
-    ]
-}
diff --git a/web/gui/src/main/webapp/onos2.css b/web/gui/src/main/webapp/onos2.css
index f693ecc..983f288 100644
--- a/web/gui/src/main/webapp/onos2.css
+++ b/web/gui/src/main/webapp/onos2.css
@@ -55,19 +55,10 @@
  */
 
 svg .link {
-    fill: none;
-    stroke: #666;
-    stroke-width: 2.0px;
     opacity: .7;
-
-    transition: opacity 250ms;
-    -webkit-transition: opacity 250ms;
-    -moz-transition: opacity 250ms;
 }
 
 svg .link.host {
-    stroke: #666;
-    stroke-width: 1px;
 }
 
 svg g.portLayer rect.port {
@@ -81,10 +72,6 @@
 
 svg .node.device rect {
     stroke-width: 1.5px;
-
-    transition: opacity 250ms;
-    -webkit-transition: opacity 250ms;
-    -moz-transition: opacity 250ms;
 }
 
 svg .node.device.fixed rect {
diff --git a/web/gui/src/main/webapp/topo2.css b/web/gui/src/main/webapp/topo2.css
index eee9244..8293ce4 100644
--- a/web/gui/src/main/webapp/topo2.css
+++ b/web/gui/src/main/webapp/topo2.css
@@ -24,6 +24,34 @@
     opacity: 0.5;
 }
 
-svg .node {
+svg .node.device {
+    stroke: none;
+    stroke-width: 1.5px;
+    cursor: pointer;
+}
+
+svg .node.device.fixed rect {
+    stroke-width: 1.5;
+    stroke: #ccc;
+}
+
+svg .node.device.switch {
+    fill: #17f;
+}
+
+svg .node.device.roadm {
     fill: #03c;
-}
\ No newline at end of file
+}
+
+svg .node text {
+    stroke: none;
+    fill: white;
+    font: 10pt sans-serif;
+    pointer-events: none;
+}
+
+/* for debugging */
+svg .node circle.debug {
+    fill: white;
+    stroke: red;
+}
diff --git a/web/gui/src/main/webapp/topo2.js b/web/gui/src/main/webapp/topo2.js
index 201c99c..bd5a577 100644
--- a/web/gui/src/main/webapp/topo2.js
+++ b/web/gui/src/main/webapp/topo2.js
@@ -25,11 +25,11 @@
 
     // configuration data
     var config = {
-        useLiveData: true,
+        useLiveData: false,
         debugOn: false,
         debug: {
-            showNodeXY: false,
-            showKeyHandler: true
+            showNodeXY: true,
+            showKeyHandler: false
         },
         options: {
             layering: true,
@@ -49,6 +49,24 @@
                 detailSuffix: '.json'
             }
         },
+        labels: {
+            imgPad: 16,
+            padLR: 4,
+            padTB: 3,
+            marginLR: 3,
+            marginTB: 2,
+            port: {
+                gap: 3,
+                width: 18,
+                height: 14
+            }
+        },
+        icons: {
+            w: 28,
+            h: 28,
+            xoff: -12,
+            yoff: -8
+        },
         iconUrl: {
             device: 'img/device.png',
             host: 'img/host.png',
@@ -87,7 +105,9 @@
 
     // key bindings
     var keyDispatch = {
-        Q: getUpdatedNetworkData,
+        space: injectTestEvent,     // TODO: remove (testing only)
+ //       M: testMe,                  // TODO: remove (testing only)
+
         B: toggleBg,
         G: toggleLayout,
         L: cycleLabels,
@@ -96,7 +116,12 @@
     };
 
     // state variables
-    var network = {},
+    var network = {
+            nodes: [],
+            links: [],
+            lookup: {}
+        },
+        labelIdx = 0,
         selected = {},
         highlighted = null,
         hovered = null,
@@ -115,32 +140,51 @@
     // ==============================
     // For Debugging / Development
 
-    var topoPrefix = 'json/topoTest_',
-        lastFlavor = 4,
-        topoBase = true,
-        topoFlavor = 1;
+    var eventPrefix = 'json/eventTest_',
+        eventNumber = 0;
 
-    function nextTopo() {
-        if (topoBase) {
-            topoBase = false;
-        } else {
-            topoBase = true;
-            topoFlavor = (topoFlavor === lastFlavor) ? 1 : topoFlavor + 1
-        }
+    function note(label, msg) {
+        console.log('NOTE: ' + label + ': ' + msg);
     }
 
-    // TODO change this to return the live data URL
-    function getTopoUrl() {
-        var suffix = topoBase ? 'base' : topoFlavor;
-        return topoPrefix + suffix + '.json';
+    function debug(what) {
+        return config.debugOn && config.debug[what];
     }
 
+
     // ==============================
     // Key Callbacks
 
-    function getUpdatedNetworkData(view) {
-        nextTopo();
-        getNetworkData(view);
+    function testMe(view) {
+        svg.append('line')
+            .attr({
+                x1: 100,
+                y1: 100,
+                x2: 500,
+                y2: 400,
+                stroke: '#2f3',
+                'stroke-width': 8
+            })
+            .transition()
+            .duration(1200)
+            .attr({
+                stroke: '#666',
+                'stroke-width': 6
+            });
+    }
+
+    function injectTestEvent(view) {
+        eventNumber++;
+        var eventUrl = eventPrefix + eventNumber + '.json';
+
+        console.log('Fetching JSON: ' + eventUrl);
+        d3.json(eventUrl, function(err, data) {
+            if (err) {
+                view.dataLoadError(err, eventUrl);
+            } else {
+                handleServerEvent(data);
+            }
+        });
     }
 
     function toggleBg() {
@@ -152,8 +196,30 @@
 
     }
 
-    function cycleLabels(view) {
+    function cycleLabels() {
+        labelIdx = (labelIdx === network.deviceLabelCount - 1) ? 0 : labelIdx + 1;
+        network.nodes.forEach(function (d) {
+            var idx = (labelIdx < d.labels.length) ? labelIdx : 0,
+                node = d3.select('#' + safeId(d.id)),
+                box;
 
+            node.select('text')
+                .text(d.labels[idx])
+                .style('opacity', 0)
+                .transition()
+                .style('opacity', 1);
+
+            box = adjustRectToFitText(node);
+
+            node.select('rect')
+                .transition()
+                .attr(box);
+
+            node.select('image')
+                .transition()
+                .attr('x', box.x + config.icons.xoff)
+                .attr('y', box.y + config.icons.yoff);
+        });
     }
 
     function togglePorts(view) {
@@ -191,6 +257,10 @@
     // ==============================
     // Private functions
 
+    function safeId(s) {
+        return s.replace(/[^a-z0-9]/gi, '-');
+    }
+
     // set the size of the given element to that of the view (reduced if padded)
     function setSize(el, view, pad) {
         var padding = pad ? pad * 2 : 0;
@@ -200,127 +270,288 @@
         });
     }
 
-    function getNetworkData(view) {
-        var url = getTopoUrl();
+    function establishWebSocket() {
+        // TODO: establish a real web-socket
+        // NOTE, for now, we are using the 'Q' key to artificially inject
+        //       "events" from the server.
+    }
 
-        console.log('Fetching JSON: ' + url);
-        d3.json(url, function(err, data) {
-            if (err) {
-                view.dataLoadError(err, url);
-            } else {
-                network.data = data;
-                drawNetwork(view);
+    // ==============================
+    // Event handlers for server-pushed events
+
+    var eventDispatch = {
+        addDevice: addDevice,
+        updateDevice: updateDevice,
+        removeDevice: removeDevice,
+        addLink: addLink
+    };
+
+    function addDevice(data) {
+        var device = data.payload,
+            node = createDeviceNode(device);
+        note('addDevice', device.id);
+
+        network.nodes.push(node);
+        network.lookup[node.id] = node;
+        updateNodes();
+        network.force.start();
+    }
+
+    function updateDevice(data) {
+        var device = data.payload;
+        note('updateDevice', device.id);
+
+    }
+
+    function removeDevice(data) {
+        var device = data.payload;
+        note('removeDevice', device.id);
+
+    }
+
+    function addLink(data) {
+        var link = data.payload,
+            lnk = createLink(link);
+
+        if (lnk) {
+            note('addLink', lnk.id);
+
+            network.links.push(lnk);
+            updateLinks();
+            network.force.start();
+        }
+    }
+
+    // ....
+
+    function unknownEvent(data) {
+        // TODO: use dialog, not alert
+        alert('Unknown event type: "' + data.event + '"');
+    }
+
+    function handleServerEvent(data) {
+        var fn = eventDispatch[data.event] || unknownEvent;
+        fn(data);
+    }
+
+    // ==============================
+    // force layout modification functions
+
+    function translate(x, y) {
+        return 'translate(' + x + ',' + y + ')';
+    }
+
+    function createLink(link) {
+        var type = link.type,
+            src = link.src,
+            dst = link.dst,
+            w = link.linkWidth,
+            srcNode = network.lookup[src],
+            dstNode = network.lookup[dst],
+            lnk;
+
+        if (!(srcNode && dstNode)) {
+            alert('nodes not on map');
+            return null;
+        }
+
+        lnk = {
+                id: safeId(src) + '~' + safeId(dst),
+                source: srcNode,
+                target: dstNode,
+                class: 'link',
+                svgClass: type ? 'link ' + type : 'link',
+                x1: srcNode.x,
+                y1: srcNode.y,
+                x2: dstNode.x,
+                y2: dstNode.y,
+                width: w
+            };
+        return lnk;
+    }
+
+    function updateLinks() {
+        link = linkG.selectAll('.link')
+            .data(network.links, function (d) { return d.id; });
+
+        // operate on existing links, if necessary
+        // link .foo() .bar() ...
+
+        // operate on entering links:
+        var entering = link.enter()
+            .append('line')
+            .attr({
+                id: function (d) { return d.id; },
+                class: function (d) { return d.svgClass; },
+                x1: function (d) { return d.x1; },
+                y1: function (d) { return d.y1; },
+                x2: function (d) { return d.x2; },
+                y2: function (d) { return d.y2; },
+                stroke: '#66f',
+                'stroke-width': 10
+            })
+            .transition().duration(1000)
+            .attr({
+                'stroke-width': function (d) { return d.width; },
+                stroke: '#666'      // TODO: remove explicit stroke, rather...
+            });
+
+        // augment links
+        // TODO: add src/dst port labels etc.
+
+    }
+
+    function createDeviceNode(device) {
+        // start with the object as is
+        var node = device,
+            type = device.type;
+
+        // Augment as needed...
+        node.class = 'device';
+        node.svgClass = type ? 'node device ' + type : 'node device';
+        positionNode(node);
+
+        // cache label array length
+        network.deviceLabelCount = device.labels.length;
+
+        return node;
+    }
+
+    function positionNode(node) {
+        var meta = node.metaUi,
+            x = 0,
+            y = 0;
+
+        if (meta) {
+            x = meta.x;
+            y = meta.y;
+        }
+        if (x && y) {
+            node.fixed = true;
+        }
+        node.x = x || network.view.width() / 2;
+        node.y = y || network.view.height() / 2;
+    }
+
+
+    function iconUrl(d) {
+        return 'img/' + d.type + '.png';
+    }
+
+    // returns the newly computed bounding box of the rectangle
+    function adjustRectToFitText(n) {
+        var text = n.select('text'),
+            box = text.node().getBBox(),
+            lab = config.labels;
+
+        text.attr('text-anchor', 'middle')
+            .attr('y', '-0.8em')
+            .attr('x', lab.imgPad/2);
+
+        // translate the bbox so that it is centered on [x,y]
+        box.x = -box.width / 2;
+        box.y = -box.height / 2;
+
+        // add padding
+        box.x -= (lab.padLR + lab.imgPad/2);
+        box.width += lab.padLR * 2 + lab.imgPad;
+        box.y -= lab.padTB;
+        box.height += lab.padTB * 2;
+
+        return box;
+    }
+
+    function updateNodes() {
+        node = nodeG.selectAll('.node')
+            .data(network.nodes, function (d) { return d.id; });
+
+        // operate on existing nodes, if necessary
+        //node .foo() .bar() ...
+
+        // operate on entering nodes:
+        var entering = node.enter()
+            .append('g')
+            .attr({
+                id: function (d) { return safeId(d.id); },
+                class: function (d) { return d.svgClass; },
+                transform: function (d) { return translate(d.x, d.y); },
+                opacity: 0
+            })
+            //.call(network.drag)
+            //.on('mouseover', function (d) {})
+            //.on('mouseover', function (d) {})
+            .transition()
+            .attr('opacity', 1);
+
+        // augment device nodes...
+        entering.filter('.device').each(function (d) {
+            var node = d3.select(this),
+                icon = iconUrl(d),
+                idx = (labelIdx < d.labels.length) ? labelIdx : 0,
+                box;
+
+            node.append('rect')
+                .attr({
+                    'rx': 5,
+                    'ry': 5
+                });
+
+            node.append('text')
+                .text(d.labels[idx])
+                .attr('dy', '1.1em');
+
+            box = adjustRectToFitText(node);
+
+            node.select('rect')
+                .attr(box);
+
+            if (icon) {
+                var cfg = config.icons;
+                node.append('svg:image')
+                    .attr({
+                        x: box.x + config.icons.xoff,
+                        y: box.y + config.icons.yoff,
+                        width: cfg.w,
+                        height: cfg.h,
+                        'xlink:href': icon
+                    });
+            }
+
+            // debug function to show the modelled x,y coordinates of nodes...
+            if (debug('showNodeXY')) {
+                node.select('rect').attr('fill-opacity', 0.5);
+                node.append('circle')
+                    .attr({
+                        class: 'debug',
+                        cx: 0,
+                        cy: 0,
+                        r: '3px'
+                    });
             }
         });
-    }
 
-    function drawNetwork(view) {
-        preprocessData(view);
-        updateLayout(view);
-    }
 
-    function preprocessData(view) {
-        var w = view.width(),
-            h = view.height(),
-            hDevice = h * 0.6,
-            hHost = h * 0.3,
-            data = network.data,
-            deviceLayout = computeInitLayout(w, hDevice, data.devices.length),
-            hostLayout = computeInitLayout(w, hHost, data.hosts.length);
+        // operate on both existing and new nodes, if necessary
+        //node .foo() .bar() ...
 
-        network.lookup = {};
-        network.nodes = [];
-        network.links = [];
-        // we created new arrays, so need to set the refs in the force layout
-        network.force.nodes(network.nodes);
-        network.force.links(network.links);
-
-        // let's just start with the nodes
-
-        // note that both 'devices' and 'hosts' get mapped into the nodes array
-        function makeNode(d, cls, layout) {
-            var node = {
-                    id: d.id,
-                    labels: d.labels,
-                    class: cls,
-                    icon: cls,
-                    type: d.type,
-                    x: layout.x(),
-                    y: layout.y()
-                };
-            network.lookup[d.id] = node;
-            network.nodes.push(node);
-        }
-
-        // first the devices...
-        network.data.devices.forEach(function (d) {
-            makeNode(d, 'device', deviceLayout);
-        });
-
-        // then the hosts...
-        network.data.hosts.forEach(function (d) {
-            makeNode(d, 'host', hostLayout);
-        });
-
-        // TODO: process links
-    }
-
-    function computeInitLayout(w, h, n) {
-        var maxdw = 60,
-            compdw, dw, ox, layout;
-
-        if (n < 2) {
-            layout = { ox: w/2, dw: 0 }
-        } else {
-            compdw = (0.8 * w) / (n - 1);
-            dw = Math.min(maxdw, compdw);
-            ox = w/2 - ((n - 1)/2 * dw);
-            layout = { ox: ox, dw: dw }
-        }
-
-        layout.i = 0;
-
-        layout.x = function () {
-            var x = layout.ox + layout.i*layout.dw;
-            layout.i++;
-            return x;
-        };
-
-        layout.y = function () {
-            return h;
-        };
-
-        return layout;
-    }
-
-    function linkId(d) {
-        return d.source.id + '~' + d.target.id;
-    }
-
-    function nodeId(d) {
-        return d.id;
-    }
-
-    function updateLayout(view) {
-        link = link.data(network.force.links(), linkId);
-        link.enter().append('line')
-            .attr('class', 'link');
-        link.exit().remove();
-
-        node = node.data(network.force.nodes(), nodeId);
-        node.enter().append('circle')
-            .attr('id', function (d) { return 'nodeId-' + d.id; })
-            .attr('class', function (d) { return 'node'; })
-            .attr('r', 12);
-
-        network.force.start();
+        // operate on exiting nodes:
+        // TODO: figure out how to remove the node 'g' AND its children
+        node.exit()
+            .transition()
+            .duration(750)
+            .attr({
+                opacity: 0,
+                cx: 0,
+                cy: 0,
+                r: 0
+            })
+            .remove();
     }
 
 
     function tick() {
         node.attr({
-            cx: function(d) { return d.x; },
-            cy: function(d) { return d.y; }
+            transform: function (d) { return translate(d.x, d.y); }
         });
 
         link.attr({
@@ -371,28 +602,45 @@
         link = linkG.selectAll('.link');
         node = nodeG.selectAll('.node');
 
+        function ldist(d) {
+            return fcfg.linkDistance[d.class] || 150;
+        }
+        function lstrg(d) {
+            return fcfg.linkStrength[d.class] || 1;
+        }
+        function lchrg(d) {
+            return fcfg.charge[d.class] || -200;
+        }
+
         // set up the force layout
         network.force = d3.layout.force()
             .size(forceDim)
             .nodes(network.nodes)
             .links(network.links)
-            .charge(function (d) { return fcfg.charge[d.class]; })
-            .linkDistance(function (d) { return fcfg.linkDistance[d.class]; })
-            .linkStrength(function (d) { return fcfg.linkStrength[d.class]; })
+            .charge(lchrg)
+            .linkDistance(ldist)
+            .linkStrength(lstrg)
             .on('tick', tick);
     }
 
 
     function load(view, ctx) {
+        // cache the view token, so network topo functions can access it
+        network.view = view;
+
+        // set our radio buttons and key bindings
         view.setRadio(btnSet);
         view.setKeys(keyDispatch);
 
-        getNetworkData(view);
+        establishWebSocket();
     }
 
     function resize(view, ctx) {
         setSize(svg, view);
         setSize(bgImg, view);
+
+        // TODO: hook to recompute layout, perhaps? work with zoom/pan code
+        // adjust force layout size
     }