First commit

sites/all/modules/civicrm/ang/crmStatusPage/SnoozeOptions.html

@@ -0,0 +1,11 @@
+<div ng-if="!status.is_visible">
+  <button ng-click="setPref(status, '', 1)" type="button" >{{ts('Unhide')}}</button>
+</div>
+<div ng-if="status.is_visible && status.severity_id >= 2">
+  <button type="button" class="hush-menu-button">{{ts('Hide')}}</button>
+  <ul style="display:none;">
+    <li ng-click="setPref(status, 'now + 1 week', 0)">{{ts('Remind me again in a week')}}</li>
+    <li ng-click="setPref(status, 'now + 1 month', 0)">{{ts('Remind me again in a month')}}</li>
+    <li ng-click="setPref(status, '', 0)">{{ts('Never remind me again')}}</li>
+  </ul>
+</div>

sites/all/modules/civicrm/ang/crmStatusPage/StatusPage.html

@@ -0,0 +1,39 @@
+<div crm-ui-debug="statuses"></div>
+
+<h1 crm-page-title crm-document-title="ts('CiviCRM System Status') + ' (' + countVisible(1) + ')'">
+  {{ts('CiviCRM System Status')}}
+</h1>
+
+<div id="crm-status-list" crm-ui-tab-set>
+  <div crm-ui-tab
+    ng-repeat="tab in [{is_visible: 1, icon: 'fa-bell'}, {is_visible: 0, icon: 'fa-bell-slash-o'}]"
+    id="tab-status-visible-{{tab.is_visible}}"
+    count="{{countVisible(tab.is_visible)}}"
+    crm-title="tab.is_visible ? ts('Active') : ts('Hidden')"
+    crm-icon="{{tab.icon}}"
+    >
+    <div class="crm-status-item" ng-repeat="status in statuses | filter:{is_visible: tab.is_visible}" >
+      <h3 class="crm-severity-{{status.severity}}">
+        <i ng-if="status.icon" class="crm-i {{status.icon}}"></i>
+        {{status.title}}
+        <div statuspage-popup-menu class="hush-menu css_right"></div>
+        <div ng-if="!status.is_visible" class="hidden-until css_right">
+          ({{status.hidden_until ? ts('Hidden until %1', {1: formatDate(status.hidden_until)}) : ts('Hidden permanently')}})
+        </div>
+      </h3>
+      <div class="crm-block crm-status-message-body">
+        <span ng-bind-html="status.message | trusted"></span>
+        <a
+          ng-if="status.help"
+          class="helpicon"
+          ng-click="help(status.title, status.help);"
+          href="javascript:void(0)"
+          >
+        </a>
+        <div ng-if="status.actions" class="crm-status-item-actions">
+          <button ng-repeat="action in status.actions" ng-click="doAction(action)">{{ action.title }}</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

sites/all/modules/civicrm/ang/crmStatusPage/StatusPageCtrl.js

@@ -0,0 +1,74 @@
+(function(angular, $, _) {
+
+  angular.module('statuspage').controller('statuspageStatusPage',
+    function($scope, crmApi, crmStatus, statusData) {
+      $scope.ts = CRM.ts();
+      $scope.help = CRM.help;
+      $scope.formatDate = CRM.utils.formatDate;
+      $scope.statuses = statusData.values;
+
+      // Refresh the list. Optionally execute api calls first.
+      function refresh(apiCalls, title) {
+        title = title || 'Untitled operation';
+        apiCalls = (apiCalls || []).concat([['System', 'check', {sequential: 1}]]);
+        $('#crm-status-list').block();
+        crmApi(apiCalls, true)
+          .then(function(results) {
+            $scope.statuses = results[results.length - 1].values;
+            results.forEach(function(result) {
+              if (result.is_error) {
+                var error_message = ts(result.error_message);
+                if (typeof(result.debug_information) !== 'undefined') {
+                  error_message += '<div class="status-debug-information">' +
+                      '<b>' + ts('Debug information') + ':</b><br>' +
+                      result.debug_information + '</div>';
+                }
+                CRM.alert(error_message, ts('Operation failed: ' + title), 'error');
+                }
+              });
+            $('#crm-status-list').unblock();
+          });
+      }
+
+      // updates a status preference and refreshes status data
+      $scope.setPref = function(status, until, visible) {
+        refresh([
+          ['StatusPreference', 'create', {
+            name: status.name,
+            ignore_severity: visible ? 0 : status.severity,
+            hush_until: until
+          }]
+        ], 'Set preference');
+      };
+      
+      $scope.countVisible = function(visibility) {
+        return _.filter($scope.statuses, function(s) {
+          return s.is_visible == visibility && s.severity_id >= 2;
+        }).length;
+      };
+
+      $scope.doAction = function(action) {
+        function run() {
+          switch (action.type) {
+            case 'href':
+              window.location = CRM.url(action.params.path, action.params.query, action.params.mode);
+              break;
+
+            case 'api3':
+              refresh([action.params], action.title);
+              break;
+          }
+        }
+
+        if (action.confirm) {
+          CRM.confirm({
+            title: action.title,
+            message: action.confirm
+          }).on('crmConfirm:yes', run);
+        } else {
+          run();
+        }
+      };
+    });
+
+})(angular, CRM.$, CRM._);

sites/all/modules/civicrm/ang/crmStatusPage/StatusPageServices.js

@@ -0,0 +1,31 @@
+(function(angular, $, _) {
+
+  angular.module('statuspage')
+    .filter('trusted', function($sce){ return $sce.trustAsHtml; })
+
+    // Todo: abstract this into a generic crmUi directive?
+    .directive('statuspagePopupMenu', function($timeout) {
+      return {
+        templateUrl: '~/statuspage/SnoozeOptions.html',
+        transclude: true,
+
+        link: function(scope, element, attr) {
+          element.on('click', '.hush-menu-button', function() {
+            $timeout(function() {
+              $('ul', element).show().menu();
+              element.closest('h3').addClass('menuopen');
+              $('body').one('click', function() {
+                $('ul', element).menu('destroy').hide();
+                element.closest('h3').removeClass('menuopen');
+              });
+            });
+          });
+          // TODO: Is there a more "Angular" way to do this animation?
+          element.on('click', 'button:not(.hush-menu-button), li', function() {
+            $(this).closest('div.crm-status-item').slideUp();
+          });
+        }
+      };
+    });
+
+})(angular, CRM.$, CRM._);