uiref -- minor embellishment to topo dialog example.

Change-Id: Ie1e1811f691afc800a0d768cfbdacf85b6739371
diff --git a/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopov.css b/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopov.css
index e794fc2..2c4e8a5 100644
--- a/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopov.css
+++ b/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopov.css
@@ -1 +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/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovDemo.js b/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovDemo.js
index eae2249..650e942 100644
--- a/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovDemo.js
+++ b/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovDemo.js
@@ -38,10 +38,12 @@
     }
 
     function createDialogContent(devs) {
-        var content = tds.createDiv('my-content-class');
+        var content = tds.createDiv('my-content-class'),
+            items;
         content.append('p').text('Do something to these devices?');
+        items = content.append('div');
         devs.forEach(function (d) {
-            content.append('p').text(d);
+            items.append('p').text(d);
         });
         return content;
     }
@@ -54,6 +56,14 @@
         $log.debug('Dialog OK button pressed');
     }
 
+    function createListContent() {
+        var content = tds.createDiv('my-list-class'),
+            items;
+        // TODO: figure out best way to inject selectable list
+        content.append('p').text('(Selectable list to show here...)');
+        return content;
+    }
+
     // === ---------------------------
     // === Main API functions
 
@@ -83,20 +93,33 @@
         return false;
     }
 
+    // this example dialog invoked from the details panel, when one or more
+    //  devices have been selected
     function deviceDialog() {
         var ctx = tss.selectionContext();
 
-        $log.debug('dialog invoked with context:', ctx);
+        $log.debug('device dialog invoked with context:', ctx);
 
         // only if at least one device was selected
         if (ctx.devices.length) {
             tds.openDialog()
+                .setTitle('Process Devices')
                 .addContent(createDialogContent(ctx.devices))
                 .addButton('Cancel', dCancel)
                 .addButton('OK', dOk);
         }
     }
 
+    // this example dialog invoked from the toolbar
+    function listDialog() {
+        $log.debug('list dialog invoked');
+
+        tds.openDialog()
+            .setTitle('A list of stuff')
+            .addContent(createListContent())
+            .addButton('Gotcha', dOk);
+    }
+
     // === ---------------------------
     // === Module Factory Definition
 
@@ -118,7 +141,8 @@
                     updateDisplay: updateDisplay,
                     stopDisplay: stopDisplay,
 
-                    deviceDialog: deviceDialog
+                    deviceDialog: deviceDialog,
+                    listDialog: listDialog
                 };
             }]);
 }());
diff --git a/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovOverlay.js b/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovOverlay.js
index 1abb1d5..2295fa1 100644
--- a/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovOverlay.js
+++ b/uiref/src/main/resources/app/view/uiRefTopov/uiRefTopovOverlay.js
@@ -78,7 +78,7 @@
                 gid: 'chain'
             },
             G: {
-                cb: buttonCallback,
+                cb: function () { demo.listDialog(); },
                 tt: 'Uses the G key',
                 gid: 'crown'
             },
@@ -120,11 +120,6 @@
         }
     };
 
-
-    function buttonCallback(x) {
-        $log.debug('Toolbar-button callback', x);
-    }
-
     function selectionCallback(x, d) {
         $log.debug('Selection callback', x, d);
     }