Added sample switch data, and augmented selection logic to fetch the detail data from the server.
Also used styled table for displaying properties.
diff --git a/web/gui/src/main/webapp/json/network.json b/web/gui/src/main/webapp/json/network.json
new file mode 100644
index 0000000..eacb01c
--- /dev/null
+++ b/web/gui/src/main/webapp/json/network.json
@@ -0,0 +1,163 @@
+{
+    "meta": {
+        "comments": [
+            "This is sample data for developing the ONOS UI (network view)",
+            " in a standalone mode (no server required).",
+            " Eventually, we will wire this up to live data",
+            " from the server, via a websocket.",
+            "",
+            "Note that this is just a first-draft of the data --",
+            " additional fields will be added when they are needed."
+        ],
+        "otherMetaData": "can go here..."
+    },
+    "devices": [
+        {
+            "id": "of:0000000000000001",
+            "labels": ["00:00:00:00:00:00:00:01", "SFO-W10", "opt-1"],
+            "type": "roadm"
+        },
+        {
+            "id": "of:0000000000000002",
+            "labels": ["00:00:00:00:00:00:00:02", "SJC-W10", "opt-2"],
+            "type": "roadm"
+        },
+        {
+            "id": "of:0000000000000003",
+            "labels": ["00:00:00:00:00:00:00:03", "LAX-W10", "opt-3"],
+            "type": "roadm"
+        },
+        {
+            "id": "of:0000000000000004",
+            "labels": ["00:00:00:00:00:00:00:04", "SDG-W10", "opt-4"],
+            "type": "roadm"
+        },
+        {
+            "id": "of:0000000000000011",
+            "labels": ["00:00:00:00:00:00:00:11", "SFO-pkt", "pkt-11"],
+            "type": "switch"
+        },
+        {
+            "id": "of:0000000000000012",
+            "labels": ["00:00:00:00:00:00:00:12", "SJC-pkt", "pkt-12"],
+            "type": "switch"
+        },
+        {
+            "id": "of:0000000000000013",
+            "labels": ["00:00:00:00:00:00:00:13", "LAX-pkt", "pkt-13"],
+            "type": "switch"
+        }
+    ],
+    "linkNotes": [
+        "even though we have 'directionality' (src/dst), each link is",
+        " considered to be bi-directional. Note that links between hosts",
+        " and edge switches are inferred from host information, and not",
+        " explicitly represented here."
+    ],
+    "links": [
+        {
+            "src": "of:0000000000000001",
+            "dst": "of:0000000000000002",
+            "type": "optical",
+            "linkWidth": 1.5
+        },
+        {
+            "src": "of:0000000000000001",
+            "dst": "of:0000000000000003",
+            "type": "optical",
+            "linkWidth": 1.5
+        },
+        {
+            "src": "of:0000000000000001",
+            "dst": "of:0000000000000004",
+            "type": "optical",
+            "linkWidth": 1.5
+        },
+        {
+            "src": "of:0000000000000002",
+            "dst": "of:0000000000000003",
+            "type": "optical",
+            "linkWidth": 1.5
+        },
+        {
+            "src": "of:0000000000000002",
+            "dst": "of:0000000000000004",
+            "type": "optical",
+            "linkWidth": 1.5
+        },
+        {
+            "src": "of:0000000000000003",
+            "dst": "of:0000000000000004",
+            "type": "optical",
+            "linkWidth": 1.5
+        },
+        {
+            "src": "of:0000000000000013",
+            "dst": "of:0000000000000003",
+            "type": "direct",
+            "linkWidth": 1.0
+        },
+        {
+            "src": "of:0000000000000012",
+            "dst": "of:0000000000000002",
+            "type": "direct",
+            "linkWidth": 1.0
+        },
+        {
+            "src": "of:0000000000000011",
+            "dst": "of:0000000000000001",
+            "type": "direct",
+            "linkWidth": 1.0
+        }
+    ],
+    "hosts": [
+        {
+            "id": "00:60:d3:00:11:01/7",
+            "labels": ["00:60:d3:00:11:01/7", "Host-11-A"],
+            "cp" : {
+                "device": "of:0000000000000011",
+                "port": 6
+            }
+        },
+        {
+            "id": "00:60:d3:00:11:02/7",
+            "labels": ["00:60:d3:00:11:02/7", "Host-11-B"],
+            "cp" : {
+                "device": "of:0000000000000011",
+                "port": 8
+            }
+        },
+        {
+            "id": "00:60:d3:00:12:01/4",
+            "labels": ["00:60:d3:00:12:01/4", "Host-12-C"],
+            "cp" : {
+                "device": "of:0000000000000012",
+                "port": 12
+            }
+        },
+        {
+            "id": "00:60:d3:00:12:02/4",
+            "labels": ["00:60:d3:00:12:02/4", "Host-12-D"],
+            "cp" : {
+                "device": "of:0000000000000012",
+                "port": 13
+            }
+        },
+        {
+            "id": "00:60:d3:00:13:01/19",
+            "labels": ["00:60:d3:00:13:01/19", "Host-13-E"],
+            "cp" : {
+                "device": "of:0000000000000013",
+                "port": 7
+            }
+        },
+        {
+            "id": "00:60:d3:00:13:02/19",
+            "labels": ["00:60:d3:00:13:02/19", "Host-13-F"],
+            "cp" : {
+                "device": "of:0000000000000013",
+                "port": 8
+            }
+        }
+    ]
+}
diff --git a/web/gui/src/main/webapp/json/of_0000000000000001.json b/web/gui/src/main/webapp/json/of_0000000000000001.json
new file mode 100644
index 0000000..c484812
--- /dev/null
+++ b/web/gui/src/main/webapp/json/of_0000000000000001.json
@@ -0,0 +1,13 @@
+{
+    "comment": "sample device properties",
+    "id": "of:0000000000000001",
+    "propOrder": [ "name", "type", "dpid", "latitude", "longitude", "allowed" ],
+    "props": {
+        "allowed": true,
+        "latitude": 37.6,
+        "longitude": 122.3,
+        "name": "SFO-W10",
+        "dpid": "00:00:00:00:00:00:00:01",
+        "type": "Roadm"
+    }
+}
diff --git a/web/gui/src/main/webapp/json/of_0000000000000002.json b/web/gui/src/main/webapp/json/of_0000000000000002.json
new file mode 100644
index 0000000..049329d
--- /dev/null
+++ b/web/gui/src/main/webapp/json/of_0000000000000002.json
@@ -0,0 +1,13 @@
+{
+    "comment": "sample device properties",
+    "id": "of:0000000000000002",
+    "propOrder": [ "name", "type", "dpid", "latitude", "longitude", "allowed" ],
+    "props": {
+        "allowed": true,
+        "latitude": 37.3,
+        "longitude": 121.9,
+        "name": "SJC-W10",
+        "dpid": "00:00:00:00:00:00:00:02",
+        "type": "Roadm"
+    }
+}
diff --git a/web/gui/src/main/webapp/json/of_0000000000000003.json b/web/gui/src/main/webapp/json/of_0000000000000003.json
new file mode 100644
index 0000000..8561cf4
--- /dev/null
+++ b/web/gui/src/main/webapp/json/of_0000000000000003.json
@@ -0,0 +1,13 @@
+{
+    "comment": "sample device properties",
+    "id": "of:0000000000000003",
+    "propOrder": [ "name", "type", "dpid", "latitude", "longitude", "allowed" ],
+    "props": {
+        "allowed": true,
+        "latitude": 33.9,
+        "longitude": 118.4,
+        "name": "LAX-W10",
+        "dpid": "00:00:00:00:00:00:00:03",
+        "type": "Roadm"
+    }
+}
diff --git a/web/gui/src/main/webapp/json/of_0000000000000004.json b/web/gui/src/main/webapp/json/of_0000000000000004.json
new file mode 100644
index 0000000..eb03114
--- /dev/null
+++ b/web/gui/src/main/webapp/json/of_0000000000000004.json
@@ -0,0 +1,13 @@
+{
+    "comment": "sample device properties",
+    "id": "of:0000000000000004",
+    "propOrder": [ "name", "type", "dpid", "latitude", "longitude", "allowed" ],
+    "props": {
+        "allowed": true,
+        "latitude": 32.8,
+        "longitude": 117.1,
+        "name": "SDG-W10",
+        "dpid": "00:00:00:00:00:00:00:04",
+        "type": "Roadm"
+    }
+}
diff --git a/web/gui/src/main/webapp/json/of_0000000000000011.json b/web/gui/src/main/webapp/json/of_0000000000000011.json
new file mode 100644
index 0000000..0e73a57
--- /dev/null
+++ b/web/gui/src/main/webapp/json/of_0000000000000011.json
@@ -0,0 +1,11 @@
+{
+    "comment": "sample device properties",
+    "id": "of:0000000000000011",
+    "propOrder": [ "name", "type", "dpid", "optLink" ],
+    "props": {
+        "name": "SFO-pkt",
+        "dpid": "00:00:00:00:00:00:00:11",
+        "type": "SwitchX",
+        "optLink": "SFO-W10"
+    }
+}
diff --git a/web/gui/src/main/webapp/json/of_0000000000000012.json b/web/gui/src/main/webapp/json/of_0000000000000012.json
new file mode 100644
index 0000000..2a00e0c
--- /dev/null
+++ b/web/gui/src/main/webapp/json/of_0000000000000012.json
@@ -0,0 +1,11 @@
+{
+    "comment": "sample device properties",
+    "id": "of:0000000000000012",
+    "propOrder": [ "name", "type", "dpid", "optLink" ],
+    "props": {
+        "name": "SJC-pkt",
+        "dpid": "00:00:00:00:00:00:00:12",
+        "type": "SwitchX",
+        "optLink": "SJC-W10"
+    }
+}
diff --git a/web/gui/src/main/webapp/json/of_0000000000000013.json b/web/gui/src/main/webapp/json/of_0000000000000013.json
new file mode 100644
index 0000000..b71738a
--- /dev/null
+++ b/web/gui/src/main/webapp/json/of_0000000000000013.json
@@ -0,0 +1,11 @@
+{
+    "comment": "sample device properties",
+    "id": "of:0000000000000013",
+    "propOrder": [ "name", "type", "dpid", "optLink" ],
+    "props": {
+        "name": "LAX-pkt",
+        "dpid": "00:00:00:00:00:00:00:13",
+        "type": "SwitchX",
+        "optLink": "LAX-W10"
+    }
+}