Support rich text titles + plain document title

diff --git a/ang/crmStatusPage/StatusPage.html b/ang/crmStatusPage/StatusPage.html
index 218d11767e85b8ac589dba0255ea23a23a681e41..a48f88af80e997bbc777307359dd39f112325509 100644 (file)
--- a/ang/crmStatusPage/StatusPage.html
+++ b/ang/crmStatusPage/StatusPage.html
@@ -3,14 +3,17 @@
 
   <form name="crm-system-status" crm-ui-id-scope>
 
-    <h1 crm-ui-title>{{ts('CiviCRM System Status (%1)', {1: _.where(statuses, {is_visible: 1}).length})}}</h1>
+    <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
+      <div crm-ui-tab
         ng-repeat="tab in [{is_visible: 1, icon: 'fa-bell'}, {is_visible: 0, icon: 'fa-bell-slash-o'}]"
-        crm-ui-tab
         id="tab-status-visible-{{tab.is_visible}}"
-        count="{{_.where(statuses, {is_visible: tab.is_visible}).length}}"
+        count="{{countVisible(tab.is_visible)}}"
         crm-title="tab.is_visible ? ts('Active') : ts('Hidden')"
         crm-icon="{{tab.icon}}"
         >

diff --git a/ang/crmStatusPage/StatusPageCtrl.js b/ang/crmStatusPage/StatusPageCtrl.js
index bb141a84715d547b7535fbad2cc1709032b08fd0..9b89c861857af4e33d100a1e5b39a9e746b869aa 100644 (file)
--- a/ang/crmStatusPage/StatusPageCtrl.js
+++ b/ang/crmStatusPage/StatusPageCtrl.js
@@ -6,7 +6,6 @@
       var ts = $scope.ts = CRM.ts();
       $scope.alert = CRM.alert;
       $scope.statuses = statusData.values;
-      $scope._ = _;
 
       _.each($scope.statuses, function(status) {
         status.severity_id = status.severity;
@@ -24,6 +23,10 @@
             status.is_visible = visible;
           });
       };
+      
+      $scope.countVisible = function(is_visible) {
+        return _.where($scope.statuses, {is_visible: is_visible}).length;
+      };
     });
 
 })(angular, CRM.$, CRM._);

diff --git a/ang/crmUi.js b/ang/crmUi.js
index fdd0cd62193a3606622446ea42ffe4920df4f22e..8540e40dd485906038de05391653abe8a2e0c468 100644 (file)
--- a/ang/crmUi.js
+++ b/ang/crmUi.js
@@ -2,7 +2,8 @@
 (function (angular, $, _) {
 
   var uidCount = 0,
-    pageTitle = 'CiviCRM';
+    pageTitle = 'CiviCRM',
+    documentTitle = 'CiviCRM';
 
   angular.module('crmUi', [])
 
@@ -977,29 +978,34 @@
       };
     })
 
-    // Sets the one and only page title - uses CMS title if available
+    // Sets document title & page title; attempts to override CMS title markup for the latter
     // WARNING: Use only once per route!
-    // Note: Title should be plain-text only
-    // Example: <h1 crm-ui-title>{{ts('Hello')}}</h1>
-    .directive('crmUiTitle', function($timeout) {
+    // Example (same title for both): <h1 crm-page-title>{{ts('Hello')}}</h1>
+    // Example (separate document title): <h1 crm-document-title="ts('Hello')" crm-page-title><i class="crm-i fa-flag"></i>{{ts('Hello')}}</h1>
+    .directive('crmPageTitle', function($timeout) {
       return {
+        scope: {
+          crmDocumentTitle: '='
+        },
         link: function(scope, $el, attrs) {
           function update() {
             $timeout(function() {
-              var newTitle = $el.text();
-              document.title = $('title').text().replace(pageTitle, newTitle);
+              var newPageTitle = _.trim($el.html()),
+                newDocumentTitle = scope.crmDocumentTitle || $el.text();
+              document.title = $('title').text().replace(documentTitle, newDocumentTitle);
               // If the CMS has already added title markup to the page, use it
               $('h1').not('.crm-container h1').each(function() {
-                if (_.trim($(this).text()) === _.trim(pageTitle)) {
-                  $(this).text(newTitle);
+                if (_.trim($(this).html()) === pageTitle) {
+                  $(this).html(newPageTitle);
                   $el.hide();
                 }
               });
-              pageTitle = newTitle;
+              pageTitle = newPageTitle;
+              documentTitle = newDocumentTitle;
             });
           }
 
-          scope.$watch(function() {return $el.html();}, update);
+          scope.$watch(function() {return scope.crmDocumentTitle + $el.html();}, update);
         }
       };
     })