ONOS-6726: UI-Lion: Quick Help.

Change-Id: I4725ae58c3c8fea6b8cb9c50593bd40b51d13e1b

web/gui/src/main/webapp/app/fw/layer/quickhelp.js

@@ -23,7 +23,7 @@
     'use strict';
 
     // injected references
-    var $log, fs, sus;
+    var $log, fs, sus, ls;
 
     // configuration
     var defaultSettings = {
@@ -202,11 +202,13 @@
         fmt.forEach(function (k) {
             var v = map.get(k),
                 a = fs.isA(v),
-                d = (a && a[1]);
+                d = (a && a[1]),
+                dfn = fs.isF(d),
+                dval = (dfn && dfn()) || d;
 
             // '-' marks a separator; d is the description
-            if (k === '-' || d) {
+            if (k === '-' || dval) {
-                b.push([mkKeyDisp(k), d]);
+                b.push([mkKeyDisp(k), dval]);
             }
         });
         return b;
@@ -268,6 +270,10 @@
         addRow(mkArrRow(vgest));
     }
 
+    function qhlion_title() {
+        var lion = ls.bundle('core.fw.QuickHelp');
+        return lion('qh_title');
+    }
 
     function popBind(bindings) {
         pane = svg.append('g')
@@ -280,7 +286,7 @@
             .attr('rx', 8);
 
         pane.append('text')
-            .text('Quick Help')
+            .text(qhlion_title())
             .attr({
                 class: 'title',
                 dy: '1.2em',
@@ -342,12 +348,13 @@
 
     angular.module('onosLayer')
     .factory('QuickHelpService',
-        ['$log', 'FnService', 'SvgUtilService',
+        ['$log', 'FnService', 'SvgUtilService', 'LionService',
 
-        function (_$log_, _fs_, _sus_) {
+        function (_$log_, _fs_, _sus_, _ls_) {
             $log = _$log_;
             fs = _fs_;
             sus = _sus_;
+            ls = _ls_;
 
             function initQuickHelp(opts) {
                 settings = angular.extend({}, defaultSettings, fs.isO(opts));

web/gui/src/main/webapp/app/fw/util/keys.js

@@ -21,7 +21,7 @@
     'use strict';
 
     // references to injected services
-    var $log, $timeout, fs, ts, ns, ee, qhs;
+    var $log, $timeout, fs, ts, ns, ee, qhs, ls;
 
     // internal state
     var enabled = true,
@@ -162,13 +162,30 @@
         }
     }
 
+    // functions to obtain localized strings deferred from the setup of the
+    //  global key data structures.
+    function qhlion() {
+        return ls.bundle('core.fw.QuickHelp');
+    }
+    function qhlion_show_hide() {
+        return qhlion()('qh_hint_show_hide_qh');
+    }
+
+    function qhlion_hint_esc() {
+        return qhlion()('qh_hint_esc');
+    }
+
+    function qhlion_hint_t() {
+        return qhlion()('qh_hint_t');
+    }
+
     function setupGlobalKeys() {
         angular.extend(keyHandler, {
             globalKeys: {
-                backSlash: [quickHelp, 'Show / hide Quick Help'],
+                backSlash: [quickHelp, qhlion_show_hide],
-                slash: [quickHelp, 'Show / hide Quick Help'],
+                slash: [quickHelp, qhlion_show_hide],
-                esc: [escapeKey, 'Dismiss dialog or cancel selections'],
+                esc: [escapeKey, qhlion_hint_esc],
-                T: [toggleTheme, "Toggle theme"]
+                T: [toggleTheme, qhlion_hint_t]
             },
             globalFormat: ['backSlash', 'slash', 'esc', 'T'],
 
@@ -302,15 +319,16 @@
     angular.module('onosUtil')
     .factory('KeyService',
         ['$log', '$timeout', 'FnService', 'ThemeService', 'NavService',
-            'EeService',
+            'EeService', 'LionService',
 
-        function (_$log_, _$timeout_, _fs_, _ts_, _ns_, _ee_) {
+        function (_$log_, _$timeout_, _fs_, _ts_, _ns_, _ee_, _ls_) {
             $log = _$log_;
             $timeout = _$timeout_;
             fs = _fs_;
             ts = _ts_;
             ns = _ns_;
             ee = _ee_;
+            ls = _ls_;
 
             return {
                 bindQhs: function (_qhs_) {

web/gui/src/main/webapp/tests/app/fw/layer/quickhelp-spec.js

@@ -15,7 +15,7 @@
  */
 
 /*
- ONOS GUI -- Layer -- Flash Service - Unit Tests
+ ONOS GUI -- Layer -- Quick Help Service - Unit Tests
  */
 describe('factory: fw/layer/quickhelp.js', function () {
     var $log, fs, qhs, d3Elem,
@@ -39,7 +39,7 @@ describe('factory: fw/layer/quickhelp.js', function () {
         'globalKeys', 'globalFormat', 'viewKeys', 'viewGestures'
     ];
 
-    beforeEach(module('onosUtil', 'onosSvg', 'onosLayer'));
+    beforeEach(module('onosUtil', 'onosSvg', 'onosLayer', 'onosRemote'));
 
     beforeEach(inject(function (_$log_, FnService, QuickHelpService) {
         $log = _$log_;
@@ -115,12 +115,16 @@ describe('factory: fw/layer/quickhelp.js', function () {
         expect($log.warn).toHaveBeenCalledWith(warning, neededBindings);
     });
 
-    it('should not warn if bindings are provided', function () {
+    it('should not warn if bindings are provided (except lion)', function () {
         spyOn($log, 'warn');
         expect(qhs.showQuickHelp(mockBindings)).toBe(undefined);
-        expect($log.warn).not.toHaveBeenCalled();
+        expect($log.warn).toHaveBeenCalledWith(
+            'No lion bundle registered:', 'core.fw.QuickHelp'
+        );
     });
 
+    // TODO: consider testing localization of text
+
     it('should append an svg', function () {
         var svg = d3Elem.select('svg');
         expect(d3Elem.empty()).toBe(false);
@@ -149,7 +153,8 @@ describe('factory: fw/layer/quickhelp.js', function () {
         expect(rect.attr('rx')).toBe('8');
 
         text = g.select('text');
-        expect(text.text()).toBe('Quick Help');
+        // NOTE: we aren't mocking localization, so should get %...% key tag
+        expect(text.text()).toBe('%qh_title%');
         expect(text.classed('title')).toBe(true);
         expect(text.attr('dy')).toBe('1.2em');
         expect(text.attr('transform')).toBeTruthy();