diff --git a/onos-byon-gui/pom.xml b/onos-byon-gui/pom.xml
new file mode 100644
index 0000000..956bed8
--- /dev/null
+++ b/onos-byon-gui/pom.xml
@@ -0,0 +1,140 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+  ~ Copyright 2015 Open Networking Laboratory
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~     http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+<project xmlns="http://maven.apache.org/POM/4.0.0"
+         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
+    <modelVersion>4.0.0</modelVersion>
+
+    <groupId>org.onos.byon</groupId>
+    <artifactId>byon-gui</artifactId>
+    <version>1.0-SNAPSHOT</version>
+    <packaging>bundle</packaging>
+
+    <description>Build Your Own Network App GUI</description>
+    <url>http://onosproject.org</url>
+
+    <properties>
+        <onos.version>1.4.0-SNAPSHOT</onos.version>
+        <onos.app.name>org.onos.byon-gui</onos.app.name>
+        <onos.app.requires>org.onos.byon</onos.app.requires>
+        <onos.app.origin>Apps-R-Us LLC, Inc. GmbH</onos.app.origin>
+    </properties>
+
+    <dependencies>
+        <dependency>
+            <groupId>org.onos.byon</groupId>
+            <artifactId>byon</artifactId>
+            <version>${project.version}</version>
+            <scope>provided</scope>
+        </dependency>
+
+        <dependency>
+            <groupId>org.onosproject</groupId>
+            <artifactId>onos-api</artifactId>
+            <version>${onos.version}</version>
+        </dependency>
+
+        <dependency>
+            <groupId>org.onosproject</groupId>
+            <artifactId>onlab-osgi</artifactId>
+            <version>${onos.version}</version>
+        </dependency>
+
+        <dependency>
+            <groupId>junit</groupId>
+            <artifactId>junit</artifactId>
+            <version>4.11</version>
+            <scope>test</scope>
+        </dependency>
+
+        <dependency>
+            <groupId>org.onosproject</groupId>
+            <artifactId>onos-api</artifactId>
+            <version>${onos.version}</version>
+            <scope>test</scope>
+            <classifier>tests</classifier>
+        </dependency>
+
+        <dependency>
+            <groupId>org.apache.felix</groupId>
+            <artifactId>org.apache.felix.scr.annotations</artifactId>
+            <version>1.9.8</version>
+            <scope>provided</scope>
+        </dependency>
+    </dependencies>
+
+    <build>
+        <plugins>
+            <plugin>
+                <groupId>org.apache.felix</groupId>
+                <artifactId>maven-bundle-plugin</artifactId>
+                <version>2.5.3</version>
+                <extensions>true</extensions>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.maven.plugins</groupId>
+                <artifactId>maven-compiler-plugin</artifactId>
+                <version>2.5.1</version>
+                <configuration>
+                    <source>1.8</source>
+                    <target>1.8</target>
+                </configuration>
+            </plugin>
+            <plugin>
+                <groupId>org.apache.felix</groupId>
+                <artifactId>maven-scr-plugin</artifactId>
+                <version>1.20.0</version>
+                <executions>
+                    <execution>
+                        <id>generate-scr-srcdescriptor</id>
+                        <goals>
+                            <goal>scr</goal>
+                        </goals>
+                    </execution>
+                </executions>
+                <configuration>
+                    <supportedProjectTypes>
+                        <supportedProjectType>bundle</supportedProjectType>
+                        <supportedProjectType>war</supportedProjectType>
+                    </supportedProjectTypes>
+                </configuration>
+            </plugin>
+            <plugin>
+                <groupId>org.onosproject</groupId>
+                <artifactId>onos-maven-plugin</artifactId>
+                <version>1.4</version>
+                <executions>
+                    <execution>
+                        <id>cfg</id>
+                        <phase>generate-resources</phase>
+                        <goals>
+                            <goal>cfg</goal>
+                        </goals>
+                    </execution>
+                    <execution>
+                        <id>app</id>
+                        <phase>package</phase>
+                        <goals>
+                            <goal>app</goal>
+                        </goals>
+                    </execution>
+                </executions>
+            </plugin>
+        </plugins>
+    </build>
+
+</project>
diff --git a/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkOverlayMessageHandler.java b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkOverlayMessageHandler.java
new file mode 100644
index 0000000..c0d2154
--- /dev/null
+++ b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkOverlayMessageHandler.java
@@ -0,0 +1,100 @@
+/*
+ * Copyright 2014-2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package org.onosproject.byon.gui;
+
+import com.fasterxml.jackson.databind.node.ArrayNode;
+import com.fasterxml.jackson.databind.node.ObjectNode;
+import com.google.common.base.Strings;
+import com.google.common.collect.ImmutableSet;
+import org.onlab.osgi.ServiceDirectory;
+import org.onos.byon.NetworkService;
+import org.onosproject.net.Device;
+import org.onosproject.net.DeviceId;
+import org.onosproject.net.Host;
+import org.onosproject.net.HostId;
+import org.onosproject.net.Link;
+import org.onosproject.net.device.DeviceService;
+import org.onosproject.net.host.HostService;
+import org.onosproject.net.link.LinkService;
+import org.onosproject.ui.RequestHandler;
+import org.onosproject.ui.UiConnection;
+import org.onosproject.ui.UiMessageHandler;
+import org.onosproject.ui.topo.DeviceHighlight;
+import org.onosproject.ui.topo.Highlights;
+import org.onosproject.ui.topo.NodeBadge;
+import org.onosproject.ui.topo.TopoJson;
+
+import java.util.Collection;
+import java.util.HashSet;
+import java.util.Set;
+import java.util.TimerTask;
+
+/**
+ * Message handler for Network topology overlay events.
+ */
+public class NetworkOverlayMessageHandler extends UiMessageHandler {
+
+    private static final String BYON_FETCH_NETWORKS_REQ = "byonFetchNetworksRequest";
+    private static final String BYON_FETCH_NETWORKS_RESP = "byonFetchNetworksResponse";
+
+    private static final String NETWORKS = "networks";
+
+    private NetworkService networkService;
+    private HostService hostService1;
+
+    @Override
+    public void init(UiConnection connection, ServiceDirectory directory) {
+        super.init(connection, directory);
+        networkService = directory.get(NetworkService.class);
+        hostService1 = get(HostService.class);
+    }
+
+    @Override
+    protected Collection<RequestHandler> createRequestHandlers() {
+        return ImmutableSet.of(
+                new FetchNetworksHandler()
+        );
+    }
+
+    // === -------------------------
+    // === Handler classes
+
+    private class FetchNetworksHandler extends RequestHandler {
+        public FetchNetworksHandler() {
+            super(BYON_FETCH_NETWORKS_REQ);
+        }
+
+        @Override
+        public void process(long sid, ObjectNode payload) {
+            ObjectNode rootNode = objectNode();
+            ArrayNode networks = arrayNode();
+            rootNode.set(NETWORKS, networks);
+
+            for (String name : networkService.getNetworks()) {
+                networks.add(networkData(name));
+            }
+            sendMessage(BYON_FETCH_NETWORKS_RESP, 0, rootNode);
+        }
+
+        private ObjectNode networkData(String name) {
+            return objectNode()
+                    .put("name", name)
+                    .put("hostCount", networkService.getHosts(name).size());
+        }
+
+    }
+}
diff --git a/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkTableViewMessageHandler.java b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkTableViewMessageHandler.java
new file mode 100644
index 0000000..31f17cf
--- /dev/null
+++ b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkTableViewMessageHandler.java
@@ -0,0 +1,130 @@
+/*
+ * Copyright 2014-2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package org.onosproject.byon.gui;
+
+import com.fasterxml.jackson.databind.node.ArrayNode;
+import com.fasterxml.jackson.databind.node.ObjectNode;
+import com.google.common.collect.ImmutableSet;
+import org.onos.byon.NetworkService;
+import org.onosproject.net.Host;
+import org.onosproject.net.HostId;
+import org.onosproject.net.host.HostService;
+import org.onosproject.ui.RequestHandler;
+import org.onosproject.ui.UiMessageHandler;
+import org.onosproject.ui.table.TableModel;
+import org.onosproject.ui.table.TableRequestHandler;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+
+import java.util.ArrayList;
+import java.util.Collection;
+import java.util.List;
+
+/**
+ * Message handler for UI Ref table-view.
+ */
+public class NetworkTableViewMessageHandler extends UiMessageHandler {
+
+    private static final String BYON_NETWORKS_DATA_REQ = "byonNetworkDataRequest";
+    private static final String BYON_NETWORKS_DATA_RESP = "byonNetworkDataResponse";
+    private static final String BYON_NETWORKS = "byonNetworks";
+
+    private static final String BYON_NETWORKS_DETAIL_REQ = "byonNetworkDetailsRequest";
+    private static final String BYON_NETWORKS_DETAIL_RESP = "byonNetworkDetailsResponse";
+    private static final String DETAILS = "details";
+
+    private static final String ID = "id";
+    private static final String HOST_COUNT = "hostCount";
+
+    private static final String[] COLUMN_IDS = {ID, HOST_COUNT};
+
+    private final Logger log = LoggerFactory.getLogger(getClass());
+
+
+    @Override
+    protected Collection<RequestHandler> createRequestHandlers() {
+        return ImmutableSet.of(
+                new ByonNetworkDataRequestHandler(),
+                new ByonNetworkDetailRequestHandler()
+        );
+    }
+
+    // handler for table view data requests
+    private final class ByonNetworkDataRequestHandler extends TableRequestHandler {
+
+        private ByonNetworkDataRequestHandler() {
+            super(BYON_NETWORKS_DATA_REQ, BYON_NETWORKS_DATA_RESP, BYON_NETWORKS);
+        }
+
+        @Override
+        protected String[] getColumnIds() {
+            return COLUMN_IDS;
+        }
+
+        @Override
+        protected void populateTable(TableModel tm, ObjectNode payload) {
+            NetworkService service = get(NetworkService.class);
+            for (String name: service.getNetworks()) {
+                int hostCount = service.getHosts(name).size();
+                populateRow(tm.addRow(), name, hostCount);
+            }
+        }
+
+        private void populateRow(TableModel.Row row, String name, int hostCount) {
+            row.cell(ID, name)
+                    .cell(HOST_COUNT, hostCount);
+        }
+    }
+
+    // handler for table view item details requests
+    private final class ByonNetworkDetailRequestHandler extends RequestHandler {
+
+        public static final String HOSTS = "hosts";
+
+        private ByonNetworkDetailRequestHandler() {
+            super(BYON_NETWORKS_DETAIL_REQ);
+        }
+
+        @Override
+        public void process(long sid, ObjectNode payload) {
+            String name = string(payload, ID, "(none)");
+
+            NetworkService networkService = get(NetworkService.class);
+            HostService hostService = get(HostService.class);
+            ObjectNode rootNode = objectNode();
+            ObjectNode data = objectNode();
+            rootNode.set(DETAILS, data);
+
+            ArrayNode hosts = arrayNode();
+            data.set(HOSTS, hosts);
+            data.put(ID, name);
+
+            for (HostId hostId : networkService.getHosts(name)) {
+                hosts.add(hostData(hostService.getHost(hostId)));
+            }
+            sendMessage(BYON_NETWORKS_DETAIL_RESP, 0, rootNode);
+        }
+
+        private ObjectNode hostData(Host host) {
+            return objectNode()
+                    .put("mac", host.mac().toString())
+                    .put("ip", host.ipAddresses().toString())
+                    .put("loc", host.location().toString());
+        }
+    }
+
+}
diff --git a/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkTopoOverlay.java b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkTopoOverlay.java
new file mode 100644
index 0000000..42b582f
--- /dev/null
+++ b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkTopoOverlay.java
@@ -0,0 +1,67 @@
+/*
+ * Copyright 2014-2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package org.onosproject.byon.gui;
+
+import org.onosproject.ui.UiTopoOverlay;
+
+/**
+ * Network Topology Overlay hooks.
+ */
+public class NetworkTopoOverlay extends UiTopoOverlay {
+    // NOTE: this must match the ID defined in uiRefTopov.js
+    private static final String OVERLAY_ID = "byon-overlay";
+
+//    private static final String MY_TITLE = "My App Rocks!";
+//    private static final String MY_VERSION = "Beta-1.0.0042";
+//    private static final String MY_DEVICE_TITLE = "I changed the title";
+//
+//    private static final ButtonId FOO_BUTTON = new ButtonId("foo");
+//    private static final ButtonId BAR_BUTTON = new ButtonId("bar");
+
+    public NetworkTopoOverlay() {
+        super(OVERLAY_ID);
+    }
+
+/*
+    @Override
+    public void modifySummary(PropertyPanel pp) {
+        pp.title(MY_TITLE)
+                .typeId(TopoConstants.Glyphs.CROWN)
+                .removeProps(
+                        TOPOLOGY_SSCS,
+                        INTENTS,
+                        TUNNELS,
+                        FLOWS,
+                        VERSION
+                )
+                .addProp(VERSION, MY_VERSION);
+    }
+
+    @Override
+    public void modifyDeviceDetails(PropertyPanel pp, DeviceId deviceId) {
+        pp.title(MY_DEVICE_TITLE);
+        pp.removeProps(LATITUDE, LONGITUDE);
+
+        pp.addButton(FOO_BUTTON)
+                .addButton(BAR_BUTTON);
+
+        pp.removeButtons(TopoConstants.CoreButtons.SHOW_PORT_VIEW)
+                .removeButtons(TopoConstants.CoreButtons.SHOW_GROUP_VIEW);
+    }
+*/
+
+}
diff --git a/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkUiComponent.java b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkUiComponent.java
new file mode 100644
index 0000000..9c939a1
--- /dev/null
+++ b/onos-byon-gui/src/main/java/org/onosproject/byon/gui/NetworkUiComponent.java
@@ -0,0 +1,97 @@
+/*
+ * Copyright 2014-2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package org.onosproject.byon.gui;
+
+import com.google.common.collect.ImmutableList;
+import org.apache.felix.scr.annotations.Activate;
+import org.apache.felix.scr.annotations.Component;
+import org.apache.felix.scr.annotations.Deactivate;
+import org.apache.felix.scr.annotations.Reference;
+import org.apache.felix.scr.annotations.ReferenceCardinality;
+import org.onosproject.ui.UiExtension;
+import org.onosproject.ui.UiExtensionService;
+import org.onosproject.ui.UiMessageHandlerFactory;
+import org.onosproject.ui.UiTopoOverlayFactory;
+import org.onosproject.ui.UiView;
+import org.onosproject.ui.UiViewHidden;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+
+import java.util.List;
+
+/**
+ * BYON GUI component. When activated, registers a {@link UiExtension} with
+ * the {@link UiExtensionService}, so that new content is injected into the
+ * ONOS Web UI. This example injects one new view as well as providing a
+ * topology view overlay.
+ */
+@Component(immediate = true)
+public class NetworkUiComponent {
+
+    private static final ClassLoader CL = NetworkUiComponent.class.getClassLoader();
+
+    // There should be matching directory names under ~/resources/app/view/
+    private static final String TABLE_VIEW_ID = "byonNetworks";
+    private static final String TOPOV_VIEW_ID = "byonTopov";
+
+    // Text to appear in the UI navigation pane
+    private static final String TABLE_VIEW_TEXT = "BYON Networks";
+
+    private final Logger log = LoggerFactory.getLogger(getClass());
+
+    @Reference(cardinality = ReferenceCardinality.MANDATORY_UNARY)
+    protected UiExtensionService uiExtensionService;
+
+    // List of application views
+    private final List<UiView> uiViews = ImmutableList.of(
+            new UiView(UiView.Category.OTHER, TABLE_VIEW_ID, TABLE_VIEW_TEXT),
+            new UiViewHidden(TOPOV_VIEW_ID)
+    );
+
+    // Factory for message handlers
+    private final UiMessageHandlerFactory messageHandlerFactory =
+            () -> ImmutableList.of(
+                    new NetworkTableViewMessageHandler(),
+                    new NetworkOverlayMessageHandler()
+            );
+
+    // Factory for topology overlays
+    private final UiTopoOverlayFactory topoOverlayFactory =
+            () -> ImmutableList.of(
+                    new NetworkTopoOverlay()
+            );
+
+    // Build our UI extension definition
+    private UiExtension extension =
+            new UiExtension.Builder(CL, uiViews)
+                    .messageHandlerFactory(messageHandlerFactory)
+                    .topoOverlayFactory(topoOverlayFactory)
+                    .build();
+
+    @Activate
+    protected void activate() {
+        uiExtensionService.register(extension);
+        log.info("Started");
+    }
+
+    @Deactivate
+    protected void deactivate() {
+        uiExtensionService.unregister(extension);
+        log.info("Stopped");
+    }
+
+}
diff --git a/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.css b/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.css
new file mode 100644
index 0000000..4657ebe
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.css
@@ -0,0 +1,35 @@
+/* css for UI Reference App table view */
+
+#ov-byon-networks h2 {
+    display: inline-block;
+}
+
+/* Panel Styling */
+#ov-byon-networks-item-details-panel.floatpanel {
+    position: absolute;
+    top: 115px;
+}
+
+.light #ov-byon-networks-item-details-panel.floatpanel {
+    background-color: rgb(229, 234, 237);
+}
+.dark #ov-byon-networks-item-details-panel.floatpanel {
+    background-color: #3A4042;
+}
+
+#ov-byon-networks-item-details-panel h3 {
+    margin: 0;
+    font-size: large;
+}
+
+#ov-byon-networks-item-details-panel h4 {
+    margin: 0;
+}
+
+#ov-byon-networks-item-details-panel td {
+    padding: 5px;
+}
+#ov-byon-networks-item-details-panel td.label {
+    font-style: italic;
+    opacity: 0.8;
+}
diff --git a/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.html b/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.html
new file mode 100644
index 0000000..dc21076
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.html
@@ -0,0 +1,44 @@
+<!-- partial HTML -->
+<div id="ov-byon-networks">
+    <div class="tabular-header">
+        <h2>Items ({{tableData.length}} total)</h2>
+        <div class="ctrl-btns">
+            <div class="refresh" ng-class="{active: autoRefresh}"
+                 icon icon-id="refresh" icon-size="36"
+                 tooltip tt-msg="autoRefreshTip"
+                 ng-click="toggleRefresh()"></div>
+        </div>
+    </div>
+
+    <div class="summary-list" onos-table-resize>
+
+        <div class="table-header" onos-sortable-header>
+            <table>
+                <tr>
+                    <td colId="id" sortable>Item ID </td>
+                    <td colId="hostCount" sortable>Host Count </td>
+                </tr>
+            </table>
+        </div>
+
+        <div class="table-body">
+            <table>
+                <tr ng-if="!tableData.length" class="no-data">
+                    <td colspan="2">
+                        No Items found
+                    </td>
+                </tr>
+
+                <tr ng-repeat="network in tableData track by $index"
+                    ng-click="selectCallback($event, network)"
+                    ng-class="{selected: network.id === selId}">
+                    <td>{{network.id}}</td>
+                    <td>{{network.hostCount}}</td>
+                </tr>
+            </table>
+        </div>
+
+    </div>
+
+    <ov-byon-networks-details-panel></ov-byon-networks-details-panel>
+</div>
diff --git a/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.js b/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.js
new file mode 100644
index 0000000..e38fd8c
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/app/view/byonNetworks/byonNetworks.js
@@ -0,0 +1,146 @@
+// js for UI Reference App table view
+(function () {
+    'use strict';
+
+    // injected refs
+    var $log, $scope, fs, wss;
+
+    // constants
+    var detailsReq = 'byonNetworkDetailsRequest',
+        detailsResp = 'byonNetworkDetailsResponse',
+        pName = 'ov-byon-networks-details-panel',
+
+        propOrder = ['id', 'hostCount'],
+        friendlyProps = ['Network', 'Host Count'];
+
+
+    function addProp(tbody, index, value) {
+        var tr = tbody.append('tr');
+
+        function addCell(cls, txt) {
+            tr.append('td').attr('class', cls).html(txt);
+        }
+
+        addCell('label', friendlyProps[index] + ' :');
+        addCell('value', value);
+    }
+
+    function addHost(tbody, host) {
+        var tr = tbody.append('tr');
+        tr.append('td').html(host.mac)
+            .append('td').html(host.ip)
+            .append('td').html(host.loc);
+    }
+
+    function populatePanel(panel) {
+        var title = panel.append('h3'),
+            tbody = panel.append('table').append('tbody');
+
+        title.text('Network ' + $scope.panelDetails.id);
+        $scope.panelDetails.hosts.forEach(function (host, i) {
+            addHost(tbody, host);
+        });
+    }
+
+    function respDetailsCb(data) {
+        $scope.panelDetails = data.details;
+        $scope.$apply();
+    }
+
+    angular.module('ovByonNetworks', [])
+        .controller('OvByonNetworksCtrl',
+            ['$log', '$scope', 'TableBuilderService',
+                'FnService', 'WebSocketService',
+
+                function (_$log_, _$scope_, tbs, _fs_, _wss_) {
+                    $log = _$log_;
+                    $scope = _$scope_;
+                    fs = _fs_;
+                    wss = _wss_;
+
+                    var handlers = {};
+                    $scope.panelDetails = {};
+
+                    // details response handler
+                    handlers[detailsResp] = respDetailsCb;
+                    wss.bindHandlers(handlers);
+
+                    // custom selection callback
+                    function selCb($event, row) {
+                        if ($scope.selId) {
+                            wss.sendEvent(detailsReq, {id: row.id});
+                        } else {
+                            $scope.hidePanel();
+                        }
+                        $log.debug('Got a click on:', row);
+                    }
+
+                    // TableBuilderService creating a table for us
+                    tbs.buildTable({
+                        scope: $scope,
+                        tag: 'byonNetwork',
+                        selCb: selCb
+                    });
+
+                    // cleanup
+                    $scope.$on('$destroy', function () {
+                        wss.unbindHandlers(handlers);
+                        $log.log('OvByonNetworksCtrl has been destroyed');
+                    });
+
+                    $log.log('OvByonNetworksCtrl has been created');
+                }])
+
+        .directive('ovByonNetworksDetailsPanel', ['PanelService', 'KeyService',
+            function (ps, ks) {
+                return {
+                    restrict: 'E',
+                    link: function (scope, element, attrs) {
+                        // insert details panel with PanelService
+                        // create the panel
+                        var panel = ps.createPanel(pName, {
+                            width: 200,
+                            margin: 20,
+                            hideMargin: 0
+                        });
+                        panel.hide();
+                        scope.hidePanel = function () {
+                            panel.hide();
+                        };
+
+                        function closePanel() {
+                            if (panel.isVisible()) {
+                                $scope.selId = null;
+                                panel.hide();
+                                return true;
+                            }
+                            return false;
+                        }
+
+                        // create key bindings to handle panel
+                        ks.keyBindings({
+                            esc: [closePanel, 'Close the details panel'],
+                            _helpFormat: ['esc']
+                        });
+                        ks.gestureNotes([
+                            ['click', 'Select a row to show item details']
+                        ]);
+
+                        // update the panel's contents when the data is changed
+                        scope.$watch('panelDetails', function () {
+                            if (!fs.isEmptyObject(scope.panelDetails)) {
+                                panel.empty();
+                                populatePanel(panel);
+                                panel.show();
+                            }
+                        });
+
+                        // cleanup on destroyed scope
+                        scope.$on('$destroy', function () {
+                            ks.unbindKeys();
+                            ps.destroyPanel(pName);
+                        });
+                    }
+                };
+            }]);
+}());
diff --git a/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopov.css b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopov.css
new file mode 100644
index 0000000..2c4e8a5
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopov.css
@@ -0,0 +1,7 @@
+/* css for UI Reference App topology overlay */
+
+#topo-p-dialog .my-content-class div p {
+    color: #373;
+    font-size: 9pt;
+    padding-left: 12px;
+}
diff --git a/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopov.html b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopov.html
new file mode 100644
index 0000000..03421d4
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopov.html
@@ -0,0 +1,20 @@
+<!--
+  ~ Copyright 2014-2015 Open Networking Laboratory
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~     http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+
+<!-- partial HTML -->
+<div id="ov-byon-topov">
+    <p>This is a hidden view .. just a placeholder to house the javascript</p>
+</div>
diff --git a/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopovOverlay.js b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopovOverlay.js
new file mode 100644
index 0000000..341a322
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopovOverlay.js
@@ -0,0 +1,81 @@
+/*
+ * Copyright 2014-2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// UI Reference App - topology overlay - client side
+//
+// This is the glue that binds our business logic (in uiRefTopovDemo.js)
+// to the overlay framework.
+
+(function () {
+    'use strict';
+
+    // injected refs
+    var $log, tov, byon;
+
+    // internal state should be kept in the service module (not here)
+
+    // our overlay definition
+    var overlay = {
+        // NOTE: this must match the ID defined in ByonTopoOverlay
+        overlayId: 'byon-overlay',
+        glyphId: 'topo',
+        tooltip: 'Virtual Networks Overlay',
+
+        activate: function () {
+            $log.debug("BYON topology overlay ACTIVATED");
+            byon.start();
+        },
+        deactivate: function () {
+            $log.debug("BYON topology overlay DEACTIVATED");
+            byon.stop();
+        },
+
+        // Key bindings for traffic overlay buttons
+        // NOTE: fully qual. button ID is derived from overlay-id and key-name
+        keyBindings: {
+            G: {
+                cb: function () { byon.openNetworkList(); },
+                tt: 'Open Networks list',
+                gid: 'details'
+            },
+
+            _keyOrder: [
+                'G'
+            ]
+        },
+
+        hooks: {
+            // hook for handling escape key
+            // Must return true to consume ESC, false otherwise.
+            escape: function () {
+                // Must return true to consume ESC, false otherwise.
+                return byon.handleEscape();
+            }
+        }
+    };
+
+    // invoke code to register with the overlay service
+    angular.module('ovByonTopov')
+        .run(['$log', 'TopoOverlayService', 'ByonTopovService',
+
+            function (_$log_, _tov_, _demo_) {
+                $log = _$log_;
+                tov = _tov_;
+                byon = _demo_;
+                tov.register(overlay);
+            }]);
+
+}());
diff --git a/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopovService.js b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopovService.js
new file mode 100644
index 0000000..3b6723c
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/app/view/byonTopov/byonTopovService.js
@@ -0,0 +1,124 @@
+/*
+ * Copyright 2014-2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/*
+ Sample Demo module. This contains the "business logic" for the topology
+ overlay that we are implementing.
+ */
+
+(function () {
+    'use strict';
+
+    // injected refs
+    var $log, fs, flash, wss, tss, tds;
+
+    // constants
+    var dataRequest = 'byonFetchNetworksRequest',
+        dataResponse = 'byonFetchNetworksResponse';
+
+    // internal state
+    var networks,
+        handlers = {};
+
+
+    // === ---------------------------
+    // === Helper functions
+
+    function sendDisplayStop() {
+        wss.sendEvent(displayStop);
+    }
+
+    function createListContent() {
+        var content = tds.createDiv('my-content-class'),
+            items;
+        items = content.append('div');
+        networks.forEach(function (d) {
+            items.append('p').text(d.name + ' (' + d.hostCount + ')');
+        });
+        return content;
+    }
+
+    function dClose() {
+        $log.debug('Dialog OK button pressed');
+    }
+
+    function processResponse(data) {
+        networks = data.networks;
+        tds.openDialog()
+            .setTitle('Virtual Networks')
+            .addContent(createListContent())
+            .addButton('Close', dClose);
+    }
+
+    function registerHandlers() {
+        handlers[dataResponse] = processResponse;
+        wss.bindHandlers(handlers);
+    }
+
+    function unregisterHandlers() {
+        wss.unbindHandlers(handlers);
+    }
+
+    // === ---------------------------
+    // === Main API functions
+
+    // this example dialog invoked from the toolbar
+    function start() {
+        $log.debug('BYON start');
+        registerHandlers();
+        openNetworkList();
+    }
+
+    // this example dialog invoked from the toolbar
+    function stop() {
+        $log.debug('BYON stop');
+        unregisterHandlers();
+    }
+
+    function openNetworkList() {
+        wss.sendEvent(dataRequest);
+    }
+
+    function handleEscape() {
+        // TODO: close the dialog
+        $log.debug("BYON escape");
+        return false;
+    }
+
+    // === ---------------------------
+    // === Module Factory Definition
+
+    angular.module('ovByonTopov', [])
+        .factory('ByonTopovService',
+        ['$log', 'FnService', 'FlashService', 'WebSocketService',
+            'TopoSelectService', 'TopoDialogService',
+
+            function (_$log_, _fs_, _flash_, _wss_, _tss_, _tds_) {
+                $log = _$log_;
+                fs = _fs_;
+                flash = _flash_;
+                wss = _wss_;
+                tss = _tss_;
+                tds = _tds_;
+
+                return {
+                    start: start,
+                    stop: stop,
+                    openNetworkList: openNetworkList,
+                    handleEscape: handleEscape
+                };
+            }]);
+}());
diff --git a/onos-byon-gui/src/main/resources/css.html b/onos-byon-gui/src/main/resources/css.html
new file mode 100644
index 0000000..e9c28cd
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/css.html
@@ -0,0 +1,2 @@
+<link rel="stylesheet" href="app/view/byonNetworks/byonNetworks.css">
+<link rel="stylesheet" href="app/view/byonTopov/byonTopov.css">
diff --git a/onos-byon-gui/src/main/resources/js.html b/onos-byon-gui/src/main/resources/js.html
new file mode 100644
index 0000000..2d74ecf
--- /dev/null
+++ b/onos-byon-gui/src/main/resources/js.html
@@ -0,0 +1,3 @@
+<script src="app/view/byonNetworks/byonNetworks.js"></script>
+<script src="app/view/byonTopov/byonTopovService.js"></script>
+<script src="app/view/byonTopov/byonTopovOverlay.js"></script>