WIP

example/identity/bundle.js

@@ -38,7 +38,8 @@ define([
                     "provides": "identityService",
                     "type": "provider",
                     "depends": [
-                        "dialogService"
+                        "dialogService",
+                        "$q"
                     ]
                 }
             ]

example/identity/src/ExampleIdentityService.js

@@ -55,21 +55,37 @@ define(
          * @implements {IdentityService}
          * @memberof platform/identity
          */
-        function ExampleIdentityProvider(dialogService) {
+        function ExampleIdentityProvider(dialogService, $q) {
-            // Handle rejected dialog messages by treating the
+            this.dialogService = dialogService;
-            // current user as undefined.
+            this.$q = $q;
-            function echo(v) { return v; }
-            function giveUndefined() { return undefined; }
 
-            this.userPromise =
+            this.returnUser = this.returnUser.bind(this);
-                dialogService.getUserInput(DIALOG_STRUCTURE, DEFAULT_IDENTITY)
+            this.returnUndefined = this.returnUndefined.bind(this);
-                    .then(echo, giveUndefined);
         }
 
         ExampleIdentityProvider.prototype.getUser = function () {
-            return this.userPromise;
+            if (this.user) {
+                return this.$q.when(this.user);
+            } else {
+                return this.dialogService.getUserInput(DIALOG_STRUCTURE, DEFAULT_IDENTITY)
+                    .then(this.returnUser, this.returnUndefined);
+            }
         };
 
+        /**
+         * @private
+         */
+        ExampleIdentityProvider.prototype.returnUser = function (user) {
+            return this.user = user;
+        }
+
+        /**
+         * @private
+         */
+        ExampleIdentityProvider.prototype.returnUndefined = function () {
+            return undefined;
+        }
+
         return ExampleIdentityProvider;
     }
 );

example/worker/src/FibonacciIndicator.js

@@ -54,7 +54,7 @@ define(
                     return "icon-object-unknown";
                 },
                 getText: function () {
-                    return latest;
+                    return "" + latest;
                 },
                 getDescription: function () {
                     return "";

platform/commonUI/general/bundle.js

@@ -34,7 +34,6 @@ define([
     "./src/controllers/ContextMenuController",
     "./src/controllers/ClickAwayController",
     "./src/controllers/ViewSwitcherController",
-    "./src/controllers/BottomBarController",
     "./src/controllers/GetterSetterController",
     "./src/controllers/SelectorController",
     "./src/controllers/ObjectInspectorController",
@@ -49,6 +48,7 @@ define([
     "./src/directives/MCTSplitPane",
     "./src/directives/MCTSplitter",
     "./src/directives/MCTTree",
+    "./src/directives/MCTIndicators",
     "./src/filters/ReverseFilter",
     "text!./res/templates/bottombar.html",
     "text!./res/templates/controls/action-button.html",
@@ -84,7 +84,6 @@ define([
     ContextMenuController,
     ClickAwayController,
     ViewSwitcherController,
-    BottomBarController,
     GetterSetterController,
     SelectorController,
     ObjectInspectorController,
@@ -99,6 +98,7 @@ define([
     MCTSplitPane,
     MCTSplitter,
     MCTTree,
+    MCTIndicators,
     ReverseFilter,
     bottombarTemplate,
     actionButtonTemplate,
@@ -275,13 +275,6 @@ define([
                         "$timeout"
                     ]
                 },
-                {
-                    "key": "BottomBarController",
-                    "implementation": BottomBarController,
-                    "depends": [
-                        "indicators[]"
-                    ]
-                },
                 {
                     "key": "GetterSetterController",
                     "implementation": GetterSetterController,
@@ -395,6 +388,11 @@ define([
                     "key": "mctTree",
                     "implementation": MCTTree,
                     "depends": ['gestureService']
+                },
+                {
+                    "key": "mctIndicators",
+                    "implementation": MCTIndicators,
+                    "depends": ['openmct']
                 }
             ],
             "constants": [

platform/commonUI/general/res/templates/bottombar.html

@@ -19,14 +19,9 @@
  this source code distribution or the Licensing information page available
  at runtime from the About dialog for additional information.
 -->
-<div class='abs bottom-bar ue-bottom-bar mobile-disable-select' ng-controller="BottomBarController as bar">
+<div class='abs bottom-bar ue-bottom-bar mobile-disable-select'>
     <div id='status' class='status-holder'>
-        <mct-include ng-repeat="indicator in bar.getIndicators()"
+        <mct-indicators></mct-indicators>
-                     ng-model="indicator.ngModel"
-                     key="indicator.template"
-                     class="status-block-holder"
-                     ng-class='indicator.ngModel.getGlyphClass()'>
-        </mct-include>
     </div>
     <mct-include key="'message-banner'"></mct-include>
     <mct-include key="'about-logo'"></mct-include>

platform/commonUI/general/res/templates/indicator.html

@@ -21,13 +21,11 @@
 -->
 <!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
 <div class='status block'
-	 title="{{ngModel.getDescription()}}"
+	 title="{{ngModel.description()}}"
-	 ng-click='ngModel.configure()'
+	 ng-show="ngModel.text().length > 0">
-	 ng-show="ngModel.getText().length > 0">
+	<span class="status-indicator {{ngModel.cssClass()}}"></span><span class="label"
-	<span class="status-indicator {{ngModel.getCssClass()}}"></span><span class="label"
+		  ng-class='ngModel.textClass()'>
-		  ng-class='ngModel.getTextClass()'>
+		{{ngModel.text()}}
-		{{ngModel.getText()}}
-        <a class="s-button icon-gear" ng-if="ngModel.configure"></a>
 	</span><span class="count">
 	</span>
 </div>

platform/commonUI/general/src/directives/MCTIndicators.js

@@ -23,37 +23,21 @@
 define(
     [],
     function () {
-
+        function MCTIndicators(openmct) {
-        /**
+            return {
-         * Controller for the bottombar template. Exposes
+                restrict: "E",
-         * available indicators (of extension category "indicators")
+                link: function link(scope, element, attrs) {
-         * @memberof platform/commonUI/general
+                    openmct.indicators.displayFunctions().then(function (displayFunctions){
-         * @constructor
+                        displayFunctions.forEach(function (displayFunction){
-         */
+                            var displayElement = displayFunction();
-        function BottomBarController(indicators) {
+                            element.append(displayElement);
-            // Utility function used to make indicators presentable
+                        });
-            // for display.
+                    })
-            function present(Indicator) {
+                }
-                return {
+            };
-                    template: Indicator.template || "indicator",
-                    ngModel: typeof Indicator === 'function' ?
-                            new Indicator() : Indicator
-                };
-            }
-
-            this.indicators = indicators.map(present);
         }
 
-        /**
+        return MCTIndicators;
-         * Get all indicators to display.
-         * @returns {Indicator[]} all indicators
-         *          to display in the bottom bar.
-         * @memberof platform/commonUI/general.BottomBarController#
-         */
-        BottomBarController.prototype.getIndicators = function () {
-            return this.indicators;
-        };
 
-        return BottomBarController;
     }
 );

platform/commonUI/general/test/controllers/BottomBarControllerSpec.js

@@ -1,76 +0,0 @@
-/*****************************************************************************
- * Open MCT, Copyright (c) 2014-2017, United States Government
- * as represented by the Administrator of the National Aeronautics and Space
- * Administration. All rights reserved.
- *
- * Open MCT is 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.
- *
- * Open MCT includes source code licensed under additional open source
- * licenses. See the Open Source Licenses file (LICENSES.md) included with
- * this source code distribution or the Licensing information page available
- * at runtime from the About dialog for additional information.
- *****************************************************************************/
-
-define(
-    ["../../src/controllers/BottomBarController"],
-    function (BottomBarController) {
-
-        describe("The bottom bar controller", function () {
-            var testIndicators,
-                testIndicatorA,
-                testIndicatorB,
-                testIndicatorC,
-                mockIndicator,
-                controller;
-
-            beforeEach(function () {
-                mockIndicator = jasmine.createSpyObj(
-                    "indicator",
-                    ["getGlyph", "getCssClass", "getText"]
-                );
-
-                testIndicatorA = {};
-                testIndicatorB = function () {
-                    return mockIndicator;
-                };
-                testIndicatorC = { template: "someTemplate" };
-
-                testIndicators = [
-                    testIndicatorA,
-                    testIndicatorB,
-                    testIndicatorC
-                ];
-
-                controller = new BottomBarController(testIndicators);
-            });
-
-            it("exposes one indicator description per extension", function () {
-                expect(controller.getIndicators().length)
-                    .toEqual(testIndicators.length);
-            });
-
-            it("uses template field provided, or its own default", function () {
-                // "indicator" is the default;
-                // only testIndicatorC overrides this.
-                var indicators = controller.getIndicators();
-                expect(indicators[0].template).toEqual("indicator");
-                expect(indicators[1].template).toEqual("indicator");
-                expect(indicators[2].template).toEqual("someTemplate");
-            });
-
-            it("instantiates indicators given as constructors", function () {
-                // testIndicatorB constructs to mockIndicator
-                expect(controller.getIndicators()[1].ngModel).toBe(mockIndicator);
-            });
-        });
-    }
-);

platform/features/clock/bundle.js

@@ -55,7 +55,6 @@ define([
     timerTemplate,
     legacyRegistry
 ) {
-
     legacyRegistry.register("platform/features/clock", {
         "name": "Clocks/Timers",
         "descriptions": "Domain objects for displaying current & relative times.",
@@ -86,11 +85,6 @@ define([
                         "CLOCK_INDICATOR_FORMAT"
                     ],
                     "priority": "preferred"
-                },
-                {
-                    "implementation": FollowIndicator,
-                    "depends": ["timerService"],
-                    "priority": "fallback"
                 }
             ],
             "services": [
@@ -305,6 +299,10 @@ define([
                     }
                 }
             ],
+            "runs": [{
+                "implementation": FollowIndicator,
+                "depends": ["openmct", "timerService"]
+            }],
             "licenses": [
                 {
                     "name": "moment-duration-format",

platform/features/clock/src/indicators/FollowIndicator.js

@@ -20,38 +20,29 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-define(
+define([],function () {
-    ['moment'],
-    function (moment) {
-        var NO_TIMER = "No timer being followed";
 
-        /**
+    function setIndicatorStatus(indicator, timer) {
-         * Indicator that displays the active timer, as well as its
+        if (timer !== undefined) {
-         * current state.
+            indicator.cssClass('icon-timer s-status-ok');
-         * @implements {Indicator}
+            indicator.text('Following timer ' + timer.name);
-         * @memberof platform/features/clock
+        } else {
-         */
+            indicator.cssClass('icon-timer');
-        function FollowIndicator(timerService) {
+            indicator.text('No timer being followed.');
-            this.timerService = timerService;
         }
-
-        FollowIndicator.prototype.getGlyphClass = function () {
-            return "";
-        };
-
-        FollowIndicator.prototype.getCssClass = function () {
-            return (this.timerService.getTimer()) ? "icon-timer s-status-ok" : "icon-timer";
-        };
-
-        FollowIndicator.prototype.getText = function () {
-            var timer = this.timerService.getTimer();
-            return (timer) ? 'Following timer ' + timer.getModel().name : NO_TIMER;
-        };
-
-        FollowIndicator.prototype.getDescription = function () {
-            return "";
-        };
-
-        return FollowIndicator;
     }
-);
+
+    /**
+     * Indicator that displays the active timer, as well as its
+     * current state.
+     * @memberof platform/features/clock
+     */
+    return function installFollowIndicator(openmct, timerService) {
+        var indicator = openmct.indicators.create();
+        var timer = timerService.getTimer();
+        var setIndicatorStatusFromTimer = setIndicatorStatus.bind(this, indicator);
+        
+        setIndicatorStatusFromTimer(timer);
+        timerService.on('change', setIndicatorStatusFromTimer);
+    };
+});

platform/features/clock/src/services/TimerService.js

@@ -44,7 +44,7 @@ define(['EventEmitter'], function (EventEmitter) {
      */
     TimerService.prototype.setTimer = function (timer) {
         this.timer = timer;
-        this.emit('change');
+        this.emit('change', timer);
 
         if (this.stopObserving) {
             this.stopObserving();

src/MCT.js

@@ -193,6 +193,15 @@ define([
          * @name telemetry
          */
         this.telemetry = new api.TelemetryAPI(this);
+        
+        /**
+         * An interface for creating new indicators and changing them dynamically.
+         * 
+         * @type {module:openmct.IndicatorAPI}
+         * @memberof module:openmct.MCT#
+         * @name indicators
+         */
+        this.indicators = new api.IndicatorAPI(this);
 
         this.Dialog = api.Dialog;
 

src/api/api.js

@@ -27,7 +27,8 @@ define([
     './types/TypeRegistry',
     './ui/Dialog',
     './ui/GestureAPI',
-    './telemetry/TelemetryAPI'
+    './telemetry/TelemetryAPI',
+    './indicators/IndicatorAPI'
 ], function (
     TimeAPI,
     ObjectAPI,
@@ -35,7 +36,8 @@ define([
     TypeRegistry,
     Dialog,
     GestureAPI,
-    TelemetryAPI
+    TelemetryAPI,
+    IndicatorAPI
 ) {
     return {
         TimeAPI: TimeAPI,
@@ -44,6 +46,7 @@ define([
         Dialog: Dialog,
         TypeRegistry: TypeRegistry,
         GestureAPI: GestureAPI,
-        TelemetryAPI: TelemetryAPI
+        TelemetryAPI: TelemetryAPI,
+        IndicatorAPI: IndicatorAPI
     };
 });

src/api/indicators/Indicator.js

@@ -0,0 +1,111 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is 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.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+define([
+        'text!./res/indicator-template.html'
+    ], function (
+        indicatorTemplate
+    ) {
+
+        function Indicator(openmct) {
+            this.openmct = openmct;
+            this.textValue = '';
+            this.descriptionValue = '';
+            this.cssClassValue = '';
+            this.iconClassValue = '';
+            this.textClassValue = '';
+            this.glyphClassValue = '';
+            this.node = undefined;
+        }
+
+        Indicator.prototype.text = function (text) {
+            if (text !== undefined && text !== this.textValue) {
+                this.textValue = text;
+                Indicator.defaultDisplayFunction.call(this);
+            }
+
+            return this.textValue;
+        }
+
+        Indicator.prototype.description = function (description) {
+            if (description !== undefined && description !== this.descriptionValue) {
+                this.descriptionValue = description;
+                Indicator.defaultDisplayFunction.call(this);
+            }
+
+            return this.descriptionValue;
+        }
+
+        Indicator.prototype.iconClass = function (iconClass) {
+            if (iconClass !== undefined && iconClass !== this.iconClassValue) {
+                this.iconClassValue = iconClass;
+                Indicator.defaultDisplayFunction.call(this);
+            }
+
+            return this.iconClassValue;
+        }
+
+        Indicator.prototype.cssClass = function (cssClass) {
+            if (cssClass !== undefined && cssClass !== this.cssClassValue) {
+                this.cssClassValue = cssClass;
+                Indicator.defaultDisplayFunction.call(this);
+            }
+
+            return this.cssClassValue;
+        }
+
+        Indicator.prototype.glyphClass = function (glyphClass) {
+            if (glyphClass !== undefined && glyphClass !== this.glyphClassValue) {
+                this.glyphClassValue = glyphClass;
+                Indicator.defaultDisplayFunction.call(this);
+            }
+
+            return this.glyphClassValue;
+        }
+
+        Indicator.prototype.textClass = function (textClass) {
+            if (textClass !== undefined && textClass !== this.textClassValue) {
+                this.textClassValue = textClass;
+                Indicator.defaultDisplayFunction.call(this);
+            }
+
+            return this.textClassValue;
+        }
+
+        Indicator.defaultDisplayFunction = function () {
+            var html = indicatorTemplate.replace('{{indicator.text}}', this.text())
+                .replace('{{indicator.textClass}}', this.textClass())
+                .replace('{{indicator.cssClass}}', this.cssClass())
+                .replace('{{indicator.glyphClass}}', this.glyphClass())
+                .replace('{{indicator.description}}', this.description());
+
+            if (!this.node){
+                this.node = document.createElement('div');
+                this.node.className = 'status-block-holder';
+            }
+            this.node.innerHTML = html;
+            
+            return this.node;
+        }
+
+        return Indicator;
+});

src/api/indicators/IndicatorAPI.js

@@ -0,0 +1,85 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is 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.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+define([
+    './Indicator',
+    './LegacyIndicator'
+], function (
+    Indicator,
+    LegacyIndicator
+) {
+
+    function IndicatorAPI(openmct) {
+        this.openmct = openmct;
+        this.indicators = [];
+        this.legacyIndicatorsPromise = new Promise(function (resolve) {
+            this.resolveWithIndicators = resolve;
+            onStartWrapLegacyIndicators.call(this);
+        }.bind(this));
+    }
+
+    IndicatorAPI.prototype.create = function (displayFunction) {
+        if (displayFunction !== undefined) {
+            this.indicators.push(displayFunction);
+        } else {
+            var indicator = new Indicator(this.openmct);
+            this.indicators.push(Indicator.defaultDisplayFunction.bind(indicator));
+            return indicator;
+        }
+    }
+
+    /**
+     * @private
+     */
+    IndicatorAPI.prototype.displayFunctions = function () {
+        return this.legacyIndicatorsPromise.then(function (legacyIndicators) {
+            var wrappedLegacyIndicators = wrapAllLegacyIndicators.call(this, legacyIndicators);
+            return this.indicators.concat(wrappedLegacyIndicators);
+        }.bind(this));
+    }
+
+    function onStartWrapLegacyIndicators() {
+        this.openmct.legacyExtension('runs', {
+            depends: ['indicators[]'],
+            implementation: this.resolveWithIndicators
+        });
+    }
+
+    function wrapAllLegacyIndicators(legacyIndicators) {
+        return legacyIndicators.map(convertToNewIndicator.bind(this));
+    }
+
+    function convertToNewIndicator(legacyIndicatorDef) {
+        var legacyIndicator;
+        if (typeof legacyIndicatorDef === 'function') {
+            legacyIndicator = new legacyIndicatorDef();
+        } else {
+            legacyIndicator = legacyIndicatorDef;
+        }
+        
+        var newStyleIndicator = new LegacyIndicator(this.openmct, legacyIndicator, legacyIndicatorDef.template);
+        return LegacyIndicator.displayFunction.bind(newStyleIndicator);
+    }
+
+    return IndicatorAPI;
+
+});

src/api/indicators/LegacyIndicator.js

@@ -0,0 +1,81 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2017, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is 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.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+define([
+        'zepto',
+        './Indicator'
+    ], function ($, Indicator) {
+
+        var TEMPLATE = 
+            '<mct-include ' +
+            '   ng-model="indicator" ' +
+            '   key="template" ' +
+            '   class="status-block-holder" ' +
+            '   ng-class="indicator.glyphClass()"> ' +
+            ' </mct-include>';
+
+        function LegacyIndicator(openmct, legacyIndicator, template) {   
+            this.openmct = openmct;
+            this.legacyIndicator = legacyIndicator;
+            this.template = template;
+        }
+
+        LegacyIndicator.prototype.display = function () {
+            return legacyDisplayFunction.bind(this);
+        }
+
+        LegacyIndicator.prototype.text = function () {
+            return this.legacyIndicator.getText && 
+            this.legacyIndicator.getText();
+        }
+
+        LegacyIndicator.prototype.description = function () {
+            return this.legacyIndicator.getDescription && 
+                this.legacyIndicator.getDescription();
+        }
+
+        LegacyIndicator.prototype.cssClass = function () {
+            return this.legacyIndicator.getCssClass && 
+                this.legacyIndicator.getCssClass();
+        }
+
+        LegacyIndicator.prototype.glyphClass = function () {
+            return this.legacyIndicator.getGlyphClass && 
+                this.legacyIndicator.getGlyphClass();
+        }
+
+        LegacyIndicator.prototype.textClass = function () {
+            return this.legacyIndicator.getTextClass && 
+                this.legacyIndicator.getTextClass();
+        }
+
+        LegacyIndicator.displayFunction = function () {
+            var $compile = this.openmct.$injector.get('$compile');
+            var $rootScope = this.openmct.$injector.get('$rootScope');
+            var scope = $rootScope.$new(true);
+            scope.indicator = this;
+            scope.template = this.template || 'indicator';
+            return $compile(TEMPLATE)(scope)[0];
+        }
+
+        return LegacyIndicator;
+});

src/api/indicators/res/indicator-template.html

@@ -0,0 +1,7 @@
+<div class="{{indicator.glyphClass}}">
+    <div class="status block" title="{{indicator.description}}" ng-show="ngModel.text().length > 0">
+        <span class="status-indicator {{indicator.cssClass}}"></span><span class="label" class='{{indicator.textClass}}'>
+        {{indicator.text}}
+        </span><span class="count"></span>
+    </div>
+</div>

src/plugins/URLIndicatorPlugin/URLIndicator.js

@@ -21,8 +21,8 @@
  *****************************************************************************/
 
 define(
-    [],
+    ['zepto'],
-    function () {
+    function ($) {
 
         // Set of connection states; changing among these states will be
         // reflected in the indicator's appearance.
@@ -33,65 +33,81 @@ define(
                 glyphClass: "ok"
             },
             PENDING = {
-                glyphClass: 'caution'
+                glyphClass: "caution"
             },
             DISCONNECTED = {
                 glyphClass: "err"
             };
-        function URLIndicator($http, $interval) {
+        function URLIndicator(options, openmct) {
-            var self = this;
+            this.bindMethods();
-            this.cssClass = this.options.cssClass ? this.options.cssClass : "icon-database";
-            this.URLpath = this.options.url;
-            this.label = this.options.label ? this.options.label : this.options.url;
-            this.interval = this.options.interval || 10000;
-            this.state = PENDING;
 
-            function handleError(e) {
+            this.indicator = openmct.indicators.create();
-                self.state = DISCONNECTED;
+            this.setDefaultsFromOptions(options);
-            }
+            this.setIndicatorToState(PENDING);
-            function handleResponse() {
+
-                self.state = CONNECTED;
+            this.fetchUrl();
-            }
+            setInterval(this.fetchUrl, this.interval);
-            function updateIndicator() {
-                $http.get(self.URLpath).then(handleResponse, handleError);
-            }
-            updateIndicator();
-            $interval(updateIndicator, self.interval, 0, false);
         }
 
-        URLIndicator.prototype.getCssClass = function () {
+        URLIndicator.prototype.setIndicatorToState = function (state) {
-            return this.cssClass;
+            switch (state) {
-        };
-        URLIndicator.prototype.getGlyphClass = function () {
-            return this.state.glyphClass;
-        };
-        URLIndicator.prototype.getText = function () {
-            switch (this.state) {
                 case CONNECTED: {
-                    return this.label + " is connected";
+                    this.indicator.text(this.label + " is connected");
+                    this.indicator.description(this.label + " is online, checking status every " + this.interval + " milliseconds.");
+                    break;
                 }
                 case PENDING: {
-                    return "Checking status of " + this.label + " please stand by...";
+                    this.indicator.text("Checking status of " + this.label + " please stand by...");
+                    this.indicator.description("Checking status of " + this.label + " please stand by...");
+                    break;
                 }
                 case DISCONNECTED: {
-                    return this.label + " is offline";
+                    this.indicator.text(this.label + " is offline");
+                    this.indicator.description(this.label + " is offline, checking status every " + this.interval + " milliseconds");
+                    break;
                 }
-            }
+            };
+            this.indicator.glyphClass(state.glyphClass);
         };
-        URLIndicator.prototype.getDescription = function () {
+
-            switch (this.state) {
+        URLIndicator.prototype.fetchUrl = function () {
-                case CONNECTED: {
+            this.get(this.URLpath)
-                    return this.label + " is online, checking status every " +
+                .then(this.handleSuccess)
-                    this.interval + " milliseconds.";
+                .catch(this.handleError);
-                }
-                case PENDING: {
-                    return "Checking status of " + this.label + " please stand by...";
-                }
-                case DISCONNECTED: {
-                    return this.label + " is offline, checking status every " +
-                    this.interval + " milliseconds";
-                }
-            }
         };
+
+        URLIndicator.prototype.get = function (url) {
+            return new Promise(function(resolve, reject){
+                $.ajax({
+                    type: 'GET',
+                    url: url,
+                    success: resolve,
+                    error: reject
+                });
+            }.bind(this));
+        };
+        
+        URLIndicator.prototype.handleError = function (e) {
+            this.setIndicatorToState(DISCONNECTED);
+        };
+
+        URLIndicator.prototype.handleSuccess = function () {
+            this.setIndicatorToState(CONNECTED);
+        }
+
+        URLIndicator.prototype.setDefaultsFromOptions = function (options) {
+            this.URLpath = options.url;
+            this.label = options.label || options.url;
+            this.interval = options.inverval || 10000;
+            this.indicator.cssClass(options.cssClass || 'icon-database');
+        }
+
+        URLIndicator.prototype.bindMethods = function () {
+            this.fetchUrl = this.fetchUrl.bind(this);
+            this.handleSuccess = this.handleSuccess.bind(this);
+            this.handleError = this.handleError.bind(this);
+            this.setIndicatorToState = this.setIndicatorToState.bind(this);
+        }
+
         return URLIndicator;
     });

src/plugins/URLIndicatorPlugin/URLIndicatorPlugin.js

@@ -3,18 +3,10 @@ define(
     './URLIndicator'
   ],
   function URLIndicatorPlugin(URLIndicator) {
+
     return function (opts) {
-        // Wrap the plugin in a function so we can apply the arguments.
-        function URLIndicatorWrapper() {
-            this.options = opts;
-            URLIndicator.apply(this, arguments);
-        }
-        URLIndicatorWrapper.prototype = Object.create(URLIndicator.prototype);
         return function install(openmct) {
-            openmct.legacyExtension('indicators', {
+            return new URLIndicator(opts, openmct);
-                  "implementation": URLIndicatorWrapper,
-                  "depends": ["$http", "$interval"]
-              });
         };
     };
 });

src/plugins/localTimeSystem/plugin.js

@@ -35,6 +35,10 @@ define([
                 key: 'local-format',
                 implementation: LocalTimeFormat
             });
+
+            var indicator = openmct.indicators.create();
+            indicator.cssClass('something');
+            indicator.show(function showIndicator(element) {});
         };
     };
 });

src/plugins/plugins.js

@@ -128,7 +128,7 @@ define([
     plugins.ExampleImagery = ExampleImagery;
     plugins.SummaryWidget = SummaryWidget;
     plugins.TelemetryMean = TelemetryMean;
-    plugins.URLIndicatorPlugin = URLIndicatorPlugin;
+    plugins.URLIndicator = URLIndicatorPlugin;
 
     return plugins;
 });