diff --git a/web/gui/src/main/webapp/_dev/show-glyphs.html b/web/gui/src/main/webapp/_dev/show-glyphs.html
new file mode 100644
index 0000000..67e4a66
--- /dev/null
+++ b/web/gui/src/main/webapp/_dev/show-glyphs.html
@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<!--
+  ~ Copyright 2016-present 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.
+  -->
+
+<!--
+  ONOS -- Displaying All core glyphs.
+  -->
+
+<html>
+<head lang="en">
+    <meta charset="UTF-8">
+    <title>ONOS Core Glyphs</title>
+
+    <script type="text/javascript" src="../tp/angular.js"></script>
+    <script type="text/javascript" src="../tp/d3.js"></script>
+
+    <script type="text/javascript" src="../app/fw/util/util.js"></script>
+    <script type="text/javascript" src="../app/fw/util/fn.js"></script>
+
+    <script type="text/javascript" src="../app/fw/svg/svg.js"></script>
+    <script type="text/javascript" src="../app/fw/svg/svgUtil.js"></script>
+    <script type="text/javascript" src="../app/fw/svg/glyph.js"></script>
+    <script type="text/javascript" src="../app/fw/svg/glyphData.js"></script>
+
+    <script type="text/javascript" src="show-glyphs.js"></script>
+
+    <style>
+        html,
+        body {
+            background-color: #ddf;
+            font-family: Arial, Helvetica, sans-serif;
+            font-size: 9pt;
+        }
+
+        #IconLibDefs {
+            display: none;
+        }
+
+        h2 {
+            color: darkred;
+            display: inline-block;
+        }
+
+        h2#tag {
+            float: right;
+            padding-right: 20px;
+            color: midnightblue;
+        }
+
+        svg .glyph {
+            stroke: none;
+            fill: midnightblue;
+            fill-rule: evenodd;
+        }
+
+        svg.embeddedGlyph .glyph rect {
+            fill: #fff
+        }
+
+        #showGlyphs {
+            overflow-y: scroll;
+            width: 400px;
+            border: 1px solid green;
+            display: inline-block;
+            padding-left: 4px;
+            background-color: #bbd;
+        }
+        #zoomed {
+            /*border: 1px solid green;*/
+            display: inline-block;
+        }
+
+        #zoomed svg {
+            background-color: #eef;
+            position: absolute;
+        }
+
+    </style>
+
+</head>
+<body class="light" ng-app="showGlyphs" ng-controller="OvShowGlyphs as ctrl">
+
+    <h2>ONOS Core Glyphs</h2>
+    <h2 id="tag"></h2>
+    <div id="container">
+        <div id="showGlyphs" class="half vscroll"></div>
+        <div id="zoomed" class="half">
+        </div>
+    </div>
+
+    <svg id="IconLibDefs">
+        <defs></defs>
+    </svg>
+</body>
+</html>
\ No newline at end of file
diff --git a/web/gui/src/main/webapp/_dev/show-glyphs.js b/web/gui/src/main/webapp/_dev/show-glyphs.js
new file mode 100644
index 0000000..861cdff
--- /dev/null
+++ b/web/gui/src/main/webapp/_dev/show-glyphs.js
@@ -0,0 +1,177 @@
+/*
+ * Copyright 2016-present 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.
+ */
+
+/*
+ ONOS GUI -- Display ONOS Glyphs (development module)
+ */
+
+(function () {
+    'use strict';
+
+    var $log, $window, fs, gs;
+
+    var vspace = 60;
+
+    // assuming the glyph is a square
+    // div is a D3 selection of the <DIV> element into which icon should load
+    // size is the size of the glyph
+    // id is the symbol id
+    // rer is the rectangle the glyph will be in's rounded corners
+    // svgClass is the class name for your glyph
+    function createGlyph(div, size, id, rer, svgClass) {
+        var dim = size || 20,
+            texty = 30,
+            gid = id || 'unknown',
+            rx = rer || 4,
+            svgCls = svgClass || 'embeddedGlyph',
+            svg, g;
+
+        svg = div.append('svg').attr({
+            'class': svgCls,
+            width: dim,
+            height: dim + texty,
+            viewBox: '0 0 ' + dim + ' ' + dim
+        });
+
+        svg.on('mousemove', function () {
+            showZoomedGlyph(id);
+        });
+
+        g = svg.append('g').attr({
+            'class': 'glyph'
+        });
+
+        g.append('rect').attr({
+            width: dim,
+            height: dim,
+            rx: rx
+        });
+
+        g.append('use').attr({
+            width: dim,
+            height: dim,
+            'class': 'glyph',
+            'xlink:href': '#' + gid
+        });
+
+        g.append('text')
+            .attr({
+                'text-anchor': 'left',
+                y: '1em',
+                x: 0,
+                transform: 'translate(0, ' + dim + ')scale(0.8)'
+            })
+            .style('fill', '#800')
+            .text(id);
+    }
+
+    function showZoomedGlyph(id) {
+        var s = d3.select('#zoomed').select('svg'),
+            zd = zsize();
+
+        s.selectAll('g').remove();
+
+        var g = s.append('g').attr({
+            'class': 'glyph'
+        });
+        g.append('use').attr({
+            width: zd,
+            height: zd,
+            'class': 'glyph',
+            'xlink:href': '#' + id
+        });
+
+        d3.select('#tag').text(id);
+    }
+
+    function boxSize() {
+        return {
+            w: $window.innerWidth,
+            h: $window.innerHeight - vspace
+        };
+    }
+
+    function zsize() {
+            return boxSize().w - 430;
+    }
+
+    function updateLayout() {
+        var box = boxSize(),
+            zdim = box.w - 425,
+            zsdim = zdim - 5;
+
+        $log.debug('updateLayout()', box);
+
+        var c = d3.select('#container')
+            .style('width', box.w + 'px')
+            .style('height', box.h + 'px');
+
+        c.select('#showGlyphs').style('height', (box.h - 4) + 'px');
+        var z = c.select('#zoomed').style('height', (box.h - 4) + 'px')
+            .style('width', zdim + 'px');
+
+        var zsvg = z.select('svg');
+        if (zsvg.empty()) {
+            zsvg = z.append('svg');
+        }
+        zsvg.style({
+            width: zsdim + 'px',
+            height: zsdim + 'px'
+        });
+        zsvg.selectAll('g').remove();
+        d3.select('#tag').text('');
+    }
+
+    function watchWindow() {
+        var w = angular.element($window);
+        w.bind('resize', function () {
+            updateLayout();
+        });
+    }
+
+
+    angular.module('showGlyphs', ['onosUtil', 'onosSvg'])
+        .controller('OvShowGlyphs',
+        ['$log', '$window', 'FnService', 'GlyphService',
+
+        function (_$log_, _$window_, _fs_, _gs_) {
+            var defs = d3.select('defs'),
+                gDiv = d3.select('#showGlyphs'),
+                cols = 6,
+                k = 0;
+
+            $log = _$log_;
+            $window = _$window_;
+            fs = _fs_;
+            gs = _gs_;
+
+            updateLayout();
+            watchWindow();
+
+            gs.init();
+            gs.loadDefs(defs, null, true);
+
+            gs.ids().forEach(function (id) {
+                createGlyph(gDiv, 50, id);
+                k += 1;
+                if (k % cols > 0) {
+                    gDiv.append('span').style('padding-left', '15px');
+                } else {
+                    gDiv.append('br');
+                }
+            });
+        }]);
+}());
diff --git a/web/gui/src/main/webapp/_dev/show-icons-test.js b/web/gui/src/main/webapp/_dev/show-icons-test.js
deleted file mode 100644
index 9553613..0000000
--- a/web/gui/src/main/webapp/_dev/show-icons-test.js
+++ /dev/null
@@ -1,107 +0,0 @@
-/*
- * Copyright 2016-present 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.
- */
-
-/*
- ONOS GUI -- Showing Icons Test Module
- */
-
-(function () {
-    'use strict';
-
-    // assuming the glyph is a square
-    // div is a D3 selection of the <DIV> element into which icon should load
-    // size is the size of the glyph
-    // id is the symbol id
-    // rer is the rectangle the glyph will be in's rounded corners
-    // svgClass is the class name for your glyph
-    function createGlyph(div, size, id, rer, svgClass) {
-        var dim = size || 20,
-            texty = 30,
-            gid = id || 'unknown',
-            rx = rer || 4,
-            svgCls = svgClass || 'embeddedGlyph',
-            svg, g;
-
-        svg = div.append('svg').attr({
-            'class': svgCls,
-            width: dim,
-            height: dim + texty,
-            viewBox: '0 0 ' + dim + ' ' + dim
-        });
-
-        g = svg.append('g').attr({
-            'class': 'glyph'
-        });
-
-        g.append('rect').attr({
-            width: dim,
-            height: dim,
-            rx: rx
-        });
-
-        g.append('use').attr({
-            width: dim,
-            height: dim,
-            'class': 'glyph',
-            'xlink:href': '#' + gid
-        });
-
-        g.append('text')
-            .attr({
-                'text-anchor': 'left',
-                y: '1em',
-                x: 0,
-                transform: 'translate(0, ' + dim + ')scale(0.8)'
-            })
-            .style('fill', '#800')
-            .text(id);
-    }
-
-    angular.module('showIconsTest', ['onosSvg'])
-
-        .controller('OvShowIconsTest', ['$log', 'GlyphService', 'IconService',
-            function ($log, gs, icns) {
-                var self = this;
-
-                gs.init();
-
-                var div = d3.select('#showIcons');
-
-                // show device online and offline icons
-                icns.loadEmbeddedIcon(div, 'active', 50);
-                div.append('span').style('padding-left', '15px');
-                icns.loadEmbeddedIcon(div, 'inactive', 50);
-
-                var defs = d3.select('defs');
-
-                // show all glyphs in glyph library
-                gs.loadDefs(defs, null, true);
-                var list = gs.ids(),
-                    gDiv = d3.select('#showGlyphs'),
-                    ctr = 0;
-                list.forEach(function (id) {
-                    createGlyph(gDiv, 50, id);
-                    ctr += 1;
-                    if (ctr%6 > 0) {
-                        gDiv.append('span').style('padding-left', '15px');
-                    } else {
-                        gDiv.append('br');
-                    }
-                });
-
-                $log.log('OvShowIconsTest has been created');
-            }]);
-}());
diff --git a/web/gui/src/main/webapp/_dev/show-icons.html b/web/gui/src/main/webapp/_dev/show-icons.html
deleted file mode 100644
index c128065..0000000
--- a/web/gui/src/main/webapp/_dev/show-icons.html
+++ /dev/null
@@ -1,92 +0,0 @@
-<!DOCTYPE html>
-<!--
-  ~ Copyright 2016-present 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.
-  -->
-
-<!--
-  ONOS -- Displaying icons with Angular test page
-  -->
-
-<html>
-<head lang="en">
-    <meta charset="UTF-8">
-    <title>Show Icons Angular</title>
-
-    <script type="text/javascript" src="../tp/angular.js"></script>
-    <script type="text/javascript" src="../tp/angular-route.js"></script>
-
-    <script type="text/javascript" src="../tp/d3.js"></script>
-
-    <script type="text/javascript" src="../app/fw/util/util.js"></script>
-    <script type="text/javascript" src="../app/fw/util/fn.js"></script>
-    <script type="text/javascript" src="../app/fw/util/theme.js"></script>
-    <script type="text/javascript" src="../app/fw/util/keys.js"></script>
-
-    <script type="text/javascript" src="../app/fw/svg/svg.js"></script>
-    <script type="text/javascript" src="../app/fw/svg/svgUtil.js"></script>
-    <script type="text/javascript" src="../app/fw/svg/glyph.js"></script>
-    <script type="text/javascript" src="../app/fw/svg/glyphData.js"></script>
-    <script type="text/javascript" src="../app/fw/svg/icon.js"></script>
-    <script type="text/javascript" src="../app/fw/svg/geodata.js"></script>
-    <script type="text/javascript" src="../app/fw/svg/map.js"></script>
-    <script type="text/javascript" src="../app/fw/svg/zoom.js"></script>
-
-    <script type="text/javascript" src="show-icons-test.js"></script>
-
-    <link rel="stylesheet" href="../app/common.css">
-    <link rel="stylesheet" href="../app/fw/svg/icon.css">
-
-    <style>
-        html,
-        body {
-            background-color: #ddf;
-            font-family: Arial, Helvetica, sans-serif;
-            font-size: 9pt;
-        }
-
-        h2 {
-            color: darkred;
-        }
-
-        svg .glyph {
-            stroke: none;
-            fill: #123456;
-            fill-rule: evenodd;
-        }
-
-        svg.embeddedGlyph .glyph rect {
-            fill: #fff
-        }
-
-    </style>
-
-</head>
-<!-- outline for using a controller in Angular -->
-<body class="light" ng-app="showIconsTest" ng-controller="OvShowIconsTest as ctrl">
-    <h2>Displaying Icons and Glyphs with Angular</h2>
-    <div id="showIcons">
-        <p>Show all icons in icon library:<br></p>
-    </div>
-    <hr>
-    <div id="showGlyphs">
-        <p>Show all glyphs in glyph library:</p>
-        <p>(Displays checkMark and xMark too, because icons are built on top
-            of glyphs.)</p>
-    </div>
-
-
-
-</body>
-</html>
\ No newline at end of file