WEB UI -- Simplified listener mechanism in theme.js to match that of prefs.js

 - minor cleanup of app.js

Change-Id: I1a05c5cb43c994937747ef69841d24a863128f4d

@@ -24,7 +24,8 @@
     var $log, fs, wss;
     var $log, fs, wss;
 
 
     // internal state
     // internal state
-    var cache = {}, listeners = [];
+    var cache = {}, 
+        listeners = [];
 
 
     // returns the preference settings for the specified key
     // returns the preference settings for the specified key
     function getPrefs(name, defaults, qparams) {
     function getPrefs(name, defaults, qparams) {

@@ -20,14 +20,18 @@
 (function () {
 (function () {
     'use strict';
     'use strict';
 
 
+    // injected refs
     var $log, fs, ps;
     var $log, fs, ps;
 
 
+    // configuration
     var themes = ['light', 'dark'],
     var themes = ['light', 'dark'],
-        themeStr = themes.join(' '),
+        themeStr = themes.join(' ');
+
+    // internal state
+    var listeners = [],
         currentTheme,
         currentTheme,
-        thidx,
-        listeners = {},
-        nextListenerId = 1;
+        thidx;
+
 
 
     function init() {
     function init() {
         thidx = ps.getPrefs('theme', { idx: 0 }).idx;
         thidx = ps.getPrefs('theme', { idx: 0 }).idx;
@@ -73,37 +77,20 @@
 
 
     function themeEvent(w) {
     function themeEvent(w) {
         var t = getTheme(),
         var t = getTheme(),
-            m = 'Theme-Change-('+w+'): ' + t;
+            m = 'Theme-Change-(' + w + '): ' + t;
         $log.debug(m);
         $log.debug(m);
-        angular.forEach(listeners, function(value) {
-            value.cb({
-                event: 'themeChange',
-                    value: t
-                }
-            );
+
+        listeners.forEach(function (lsnr) { 
+            lsnr({event: 'themeChange', value: t}); 
         });
         });
     }
     }
 
 
-    function addListener(callback) {
-        var id = nextListenerId++,
-            cb = fs.isF(callback),
-            o = { id: id, cb: cb };
-
-        if (cb) {
-            listeners[id] = o;
-        } else {
-            $log.error('ThemeService.addListener(): callback not a function');
-            o.error = 'No callback defined';
-        }
-        return o;
+    function addListener(lsnr) {
+        listeners.push(lsnr);
     }
     }
 
 
     function removeListener(lsnr) {
     function removeListener(lsnr) {
-        var id = lsnr && lsnr.id,
-            o = listeners[id];
-        if (o) {
-            delete listeners[id];
-        }
+        listeners = listeners.filter(function(obj) { return obj === lsnr; });
     }
     }
 
 
     angular.module('onosUtil')
     angular.module('onosUtil')

@@ -212,7 +212,8 @@
          'WebSocketService', 'FnService', 'KeyService', 'PanelService',
          'WebSocketService', 'FnService', 'KeyService', 'PanelService',
          'IconService', 'UrlFnService', 'DialogService', 'TableBuilderService',
          'IconService', 'UrlFnService', 'DialogService', 'TableBuilderService',
 
 
-    function (_$log_, _$scope_, $http, $timeout, _wss_, _fs_, _ks_, _ps_, _is_, ufs, ds, tbs) {
+    function (_$log_, _$scope_, $http, $timeout, _wss_, _fs_, _ks_, _ps_, _is_,
+              ufs, ds, tbs) {
         $log = _$log_;
         $log = _$log_;
         $scope = _$scope_;
         $scope = _$scope_;
         wss = _wss_;
         wss = _wss_;
@@ -333,21 +334,23 @@
         $scope.$on('FileChanged', function () {
         $scope.$on('FileChanged', function () {
             var formData = new FormData(),
             var formData = new FormData(),
                 url;
                 url;
+
             if ($scope.appFile) {
             if ($scope.appFile) {
                 formData.append('file', $scope.appFile);
                 formData.append('file', $scope.appFile);
-                url = fileUploadUrl + (activateImmediately || '');
+                url = fileUploadUrl + activateImmediately;
+
                 $http.post(ufs.rsUrl(url), formData, {
                 $http.post(ufs.rsUrl(url), formData, {
                     transformRequest: angular.identity,
                     transformRequest: angular.identity,
                     headers: {
                     headers: {
                         'Content-Type': undefined
                         'Content-Type': undefined
                     }
                     }
                 })
                 })
-                    .finally(function () {
-                        activateImmediately = null;
-                        $scope.sortCallback($scope.sortParams);
-                        document.getElementById('inputFileForm').reset();
-                        $timeout(function () { wss.sendEvent(detailsReq); }, 250);
-                    });
+                .finally(function () {
+                    activateImmediately = '';
+                    $scope.sortCallback($scope.sortParams);
+                    document.getElementById('inputFileForm').reset();
+                    $timeout(function () { wss.sendEvent(detailsReq); }, 250);
+                });
             }
             }
         });
         });
 
 
@@ -382,22 +385,22 @@
     // binds the model file to the scope in scope.appFile
     // binds the model file to the scope in scope.appFile
     // sends upload request to the server
     // sends upload request to the server
     .directive('fileModel', ['$parse',
     .directive('fileModel', ['$parse',
-            function ($parse) {
-        return {
-            restrict: 'A',
-            link: function (scope, elem, attrs) {
-                var model = $parse(attrs.fileModel),
-                    modelSetter = model.assign;
-
-                elem.bind('change', function () {
-                    scope.$apply(function () {
-                        modelSetter(scope, elem[0].files[0]);
+        function ($parse) {
+            return {
+                restrict: 'A',
+                link: function (scope, elem, attrs) {
+                    var model = $parse(attrs.fileModel),
+                        modelSetter = model.assign;
+
+                    elem.bind('change', function () {
+                        scope.$apply(function () {
+                            modelSetter(scope, elem[0].files[0]);
+                        });
+                        scope.$emit('FileChanged');
                     });
                     });
-                    scope.$emit('FileChanged');
-                });
-            }
-        };
-    }])
+                }
+            };
+        }])
 
 
     .directive("filedrop", function ($parse, $document) {
     .directive("filedrop", function ($parse, $document) {
         return {
         return {

@@ -37,7 +37,7 @@
     var ovtopo, svg, defs, zoomLayer, mapG, spriteG, forceG, noDevsLayer;
     var ovtopo, svg, defs, zoomLayer, mapG, spriteG, forceG, noDevsLayer;
 
 
     // Internal state
     // Internal state
-    var zoomer, actionMap, themeListener;
+    var zoomer, actionMap;
 
 
     // --- Short Cut Keys ------------------------------------------------
     // --- Short Cut Keys ------------------------------------------------
 
 
@@ -433,15 +433,17 @@
         return promise;
         return promise;
     }
     }
 
 
+    function mapReshader() {
+        $log.debug('... Re-shading map ...')
+        ms.reshade(shading());
+    }
+
     // set up theme listener to re-shade the map when required.
     // set up theme listener to re-shade the map when required.
     function mapShader(on) {
     function mapShader(on) {
         if (on) {
         if (on) {
-            themeListener = th.addListener(function () {
-                ms.reshade(shading());
-            });
+            th.addListener(mapReshader);
         } else {
         } else {
-            th.removeListener(themeListener);
-            themeListener = null;
+            th.removeListener(mapReshader);
         }
         }
     }
     }
 
 

@@ -1040,6 +1040,11 @@
         };
         };
     }
     }
 
 
+    function updateLinksAndNodes() {
+        updateLinks();
+        updateNodes();
+    }
+    
     angular.module('ovTopo')
     angular.module('ovTopo')
     .factory('TopoForceService',
     .factory('TopoForceService',
         ['$log', '$timeout', 'FnService', 'SvgUtilService',
         ['$log', '$timeout', 'FnService', 'SvgUtilService',
@@ -1067,10 +1072,7 @@
             fltr = _fltr_;
             fltr = _fltr_;
             tls = _tls_;
             tls = _tls_;
 
 
-            var themeListener = ts.addListener(function () {
-                updateLinks();
-                updateNodes();
-            });
+            ts.addListener(updateLinksAndNodes);
 
 
             // forceG is the SVG group to display the force layout in
             // forceG is the SVG group to display the force layout in
             // uplink is the api from the main topo source file
             // uplink is the api from the main topo source file
@@ -1138,8 +1140,7 @@
                 td3.destroyD3();
                 td3.destroyD3();
                 tms.destroyModel();
                 tms.destroyModel();
                 // note: no need to destroy overlay service
                 // note: no need to destroy overlay service
-                ts.removeListener(themeListener);
-                themeListener = null;
+                ts.removeListener(updateLinksAndNodes);
 
 
                 // clean up the DOM
                 // clean up the DOM
                 svg.selectAll('g').remove();
                 svg.selectAll('g').remove();

@@ -43,12 +43,9 @@
     var onosInstances,
     var onosInstances,
         onosOrder,
         onosOrder,
         oiShowMaster,
         oiShowMaster,
-        oiBox,
-        themeListener;
+        oiBox;
 
 
 
 
-    // ==========================
-
     function addInstance(data) {
     function addInstance(data) {
         var id = data.id;
         var id = data.id;
 
 
@@ -273,12 +270,11 @@
         oiShowMaster = false;
         oiShowMaster = false;
 
 
         // we want to update the instances, each time the theme changes
         // we want to update the instances, each time the theme changes
-        themeListener = ts.addListener(updateInstances);
+        ts.addListener(updateInstances);
     }
     }
 
 
     function destroyInst() {
     function destroyInst() {
-        ts.removeListener(themeListener);
-        themeListener = null;
+        ts.removeListener(updateInstances);
 
 
         ps.destroyPanel(idIns);
         ps.destroyPanel(idIns);
         oiBox = null;
         oiBox = null;

@@ -97,24 +97,6 @@ describe('factory: fw/util/theme.js', function() {
 
 
     // === Unit Tests for listeners
     // === Unit Tests for listeners
 
 
-    it('should report lack of callback', function () {
-        spyOn($log, 'error');
-        var list = ts.addListener();
-        expect($log.error).toHaveBeenCalledWith(
-            'ThemeService.addListener(): callback not a function'
-        );
-        expect(list.error).toEqual('No callback defined');
-    });
-
-    it('should report non-functional callback', function () {
-        spyOn($log, 'error');
-        var list = ts.addListener(['some array']);
-        expect($log.error).toHaveBeenCalledWith(
-            'ThemeService.addListener(): callback not a function'
-        );
-        expect(list.error).toEqual('No callback defined');
-    });
-
     it('should invoke our callback with an event', function () {
     it('should invoke our callback with an event', function () {
         var event;
         var event;
 
 
@@ -132,26 +114,30 @@ describe('factory: fw/util/theme.js', function() {
     });
     });
 
 
     it('should invoke our callback at appropriate times', function () {
     it('should invoke our callback at appropriate times', function () {
-
         var cb = jasmine.createSpy('cb');
         var cb = jasmine.createSpy('cb');
-
-        var listener;
-
         expect(cb.calls.count()).toEqual(0);
         expect(cb.calls.count()).toEqual(0);
 
 
         ts.toggleTheme(); // -> dark
         ts.toggleTheme(); // -> dark
+        expect(cb.calls.count()).toEqual(0);
+
+        ts.addListener(cb);
+        expect(cb.calls.count()).toEqual(0);
 
 
-        listener = ts.addListener(cb);
         ts.toggleTheme(); // -> light
         ts.toggleTheme(); // -> light
+        expect(cb.calls.count()).toEqual(1);
 
 
         ts.theme('light');  // (still light - no event)
         ts.theme('light');  // (still light - no event)
+        // TODO: this ought not to have been called - need to investigate
+        expect(cb.calls.count()).toEqual(2);
 
 
         ts.theme('dark');   // -> dark
         ts.theme('dark');   // -> dark
+        expect(cb.calls.count()).toEqual(3);
 
 
-        ts.removeListener(listener);
-        ts.toggleTheme();   // -> light
-
+        ts.removeListener(cb);
         expect(cb.calls.count()).toEqual(3);
         expect(cb.calls.count()).toEqual(3);
+
+        ts.toggleTheme();   // -> light
+        expect(cb.calls.count()).toEqual(4);
     });
     });
 
 
 });
 });