Very cool! a man of his word. This will be most helpful.

well, on second thought then, that would be super!

Thanks, @Jared-Wiltshire. Let me bug you when things appear to be getting out of hand!

yes - that occurred to me - might make things a little more straightforward. Thanks - didn't think about the REST rate issue. Is there anything about using Webpack with mango?

Since angularjs doesn't have ng2's parsers, we cannot encapsulate css inside a component. Assuming several components on a page, and several custom pages in an app, would it be preferable to include (or link) all css on each page, or combined in custom.css? I'm assuming namespacing the css as necessary to appropriately component-scope it. Thanks for your thoughts.

Thanks. I tried that, but obviously suffered pilot error in the process. Good point why bother...

ok, @MattFox... I feel like a post (as in dumb as one). Can you refresh me again as to how to now break out (and where to declare) the component's controller in its own file?

userModule.js

define(['angular', 'require','./push/pushLamp.js'],
  function (angular, require, pushLamp) {
    var userModule = angular.module('userModule', ['maUiApp']);

    userModule.filter('unsafe', ['$sce', function($sce) {
       return $sce.trustAsHtml;
    }]);

    try
    {
      userModule.component('pushLamp',pushLamp);
    }
    catch(e)
    {
      console.log('error: ', e);
    }
    return userModule.js;

});

pushLamp.js:

define(['angular', 'require'], function (angular, require) {

  pushCtrl.$inject = ['$scope','$timeout'];

  function pushCtrl($scope,$timeout) {

    const $ctrl = this;
    $ctrl.$onChanges = function (changes) {
      if (changes.points && Array.isArray($ctrl.points)) {

        $ctrl.point = $ctrl.points.find(p => p.xid === 'DP_ind_' + $ctrl.target);
        $ctrl.switchPoint = $ctrl.points.find(p => p.xid === 'DP_sw_' + $ctrl.target);

        $ctrl.ptCSS = { // point css values for color and blink; ex, ng-class=""
          get color(){
            if ($ctrl.point.color < 10) {
              return 0;
            }
            return Math.floor($ctrl.point.value / 10)},
          get blink(){return 'blink' + $ctrl.point.value % 10},
          get colStyle(){return 'color'+this.color}
        };

        $timeout(function() {
          console.log('color:', $ctrl.ptCSS.colStyle, 'blink:', $ctrl.ptCSS.blink );
        },1000);
      }
    };

    $ctrl.pushed = function() {
      console.log($ctrl.switchPoint.value);
        if ($ctrl.switchPoint) {
            $ctrl.switchPoint.toggleValue();
          console.log('switch ' + $ctrl.target + ' was switched.' );
       }
    };
  }

return {
      templateUrl: '/modules/mangoUI/web/dev/push/push.html',
      bindings: {
        points: '<',
        target: '@'
      },
      controller: pushCtrl
    };

});

so WE did! same problem tho.

lets take this back to chat...

mangoUI/web/dev
▶ cat /opt/mango36/overrides/web/modules/mangoUI/web/dev/userModule.js
define(['angular', 'require','./components/pushLamp.js'],
  function (angular, require, pushLamp) {
    var userModule = angular.module('userModule', ['maUiApp']);

    userModule.filter('unsafe', ['$sce', function($sce) {
       return $sce.trustAsHtml;
    }]);

    try
    {
      userModule.component('pushLamp',pushLamp);
    }
    catch(e)
    {
      console.log('error: ', e);
    }

});

...just checking