Added translation capability to the main module, and people search components.

pom.xml

@@ -700,6 +700,11 @@
             <artifactId>angular-ui-router</artifactId>
             <version>1.0.0-beta.3</version>
         </dependency>
+        <dependency>
+            <groupId>org.webjars.npm</groupId>
+            <artifactId>angular-translate</artifactId>
+            <version>2.13.0</version>
+        </dependency>
     </dependencies>
 
     <repositories>

src/main/angular/package.json

@@ -23,11 +23,13 @@
   "devDependencies": {
     "@types/angular": "1.5.8",
     "@types/angular-mocks": "1.5.5",
+    "@types/angular-translate": "2.4.33",
     "@types/angular-ui-router": "1.1.34",
     "@types/jasmine": "2.5.35",
     "@types/node": "6.0.45",
     "angular": "1.5.8",
     "angular-mocks": "1.5.8",
+    "angular-translate": "2.13.0",
     "concurrently": "3.1.0",
     "copy-webpack-plugin": "3.0.1",
     "cpx": "1.5.0",

src/main/angular/src/i18n/translations_en.json

@@ -0,0 +1,14 @@
+{
+  "TITLE_PEOPLE_SEARCH": "People Search",
+  "TITLE_MANAGEMENT": "Management",
+  "TITLE_DIRECT_REPORTS": "Direct Reports",
+  "TITLE_ORGANIZATION": "Organization",
+
+  "COLUMN_FIRST_NAME": "First Name",
+  "COLUMN_LAST_NAME": "Last Name",
+  "COLUMN_TITLE": "Title",
+  "COLUMN_EMAIL": "Email",
+  "COLUMN_TELEPHONE": "Telephone",
+
+  "LOADING": "Loading..."
+}

src/main/angular/src/main.ts

@@ -2,15 +2,19 @@ import { bootstrap, module } from 'angular';
 import uiRouter from 'angular-ui-router';
 import peopleSearchModule from './peoplesearch/peoplesearch.module';
 import routes from './routes';
+import translations from './translations';
 import PeopleService from './services/people.service';
 
 module('app', [
     uiRouter,
     peopleSearchModule,
+    'pascalprecht.translate'
 ])
 
     .config(routes)
+    .config(translations)
     .service('PeopleService', PeopleService);
 
 // Attach to the page document
 bootstrap(document, ['app']);
+

src/main/angular/src/peoplesearch/orgchart-search.component.html

@@ -1,5 +1,5 @@
 <app-bar>
-    <div class="page-content-title">Organization</div>
+    <div class="page-content-title">{{ 'TITLE_ORGANIZATION' | translate }}</div>
     <auto-complete flex
                    search="$ctrl.autoCompleteSearch(query)"
                    item-selected="$ctrl.onAutoCompleteItemSelected(person)"

src/main/angular/src/peoplesearch/orgchart.component.html

@@ -1,7 +1,7 @@
 <div class="org-chart-section managers"
      ng-class="{ 'overflow': $ctrl.showingOverflow() }"
      ng-if="$ctrl.hasManagementChain() || $ctrl.isPersonOrphan()">
-    <h3>Management</h3>
+    <h3>{{ 'TITLE_MANAGEMENT' | translate }}</h3>
     <div ng-if="!$ctrl.isPersonOrphan()">
         <div class="manager"
              ng-repeat="manager in $ctrl.getManagementChain() track by $id(manager.displayNames)">
@@ -26,7 +26,7 @@
 </div>
 
 <div class="org-chart-section direct-reports" ng-if="$ctrl.hasDirectReports()">
-    <h3>Direct Reports</h3>
+    <h3>{{ 'TITLE_DIRECT_REPORTS' | translate }}</h3>
     <div class="org-chart-connector"></div>
 
     <div class="person-card-list">

src/main/angular/src/peoplesearch/peoplesearch-table.component.html

@@ -1,11 +1,11 @@
 <table st-table="rowCollection" ng-if="$ctrl.people.length" class="table table-striped">
     <thead>
         <tr>
-            <th>First Name</th>
-            <th>Last Name</th>
-            <th>Title</th>
-            <th>Email</th>
-            <th>Telephone</th>
+            <th>{{ 'COLUMN_FIRST_NAME' | translate }}</th>
+            <th>{{ 'COLUMN_LAST_NAME' | translate }}</th>
+            <th>{{ 'COLUMN_TITLE' | translate }}</th>
+            <th>{{ 'COLUMN_EMAIL' | translate }}</th>
+            <th>{{ 'COLUMN_TELEPHONE' | translate }}</th>
         </tr>
     </thead>
     <tbody>

src/main/angular/src/peoplesearch/peoplesearch.component.html

@@ -1,5 +1,5 @@
 <app-bar>
-    <div class="page-content-title">People Search</div>
+    <div class="page-content-title">{{ 'TITLE_PEOPLE_SEARCH' | translate }}</div>
     <span flex></span>
     <icon-button ng-click="$ctrl.viewToggleClicked()" ng-class="$ctrl.viewToggleClass"></icon-button>
 </app-bar>
@@ -18,4 +18,4 @@
     </div>
 </div>
 
-<ui-view>Loading...</ui-view>
+<ui-view>{{ 'LOADING' | translate }}</ui-view>

src/main/angular/src/translations.ts

@@ -0,0 +1,8 @@
+import 'angular-translate';
+
+export default ($translateProvider: angular.translate.ITranslateProvider) => {
+    // Register a translation file for each supported language:
+    $translateProvider.translations('en', require('i18n/translations_en.json'));
+
+    $translateProvider.preferredLanguage('en');
+};

src/main/angular/webpack.common.js

@@ -19,7 +19,8 @@ module.exports = {
     {
         'angular': true,
         // Wrapped in window because of hyphens
-        'angular-ui-router': 'window["angular-ui-router"]'
+        'angular-ui-router': 'window["angular-ui-router"]',
+        'angular-translate': 'window["angular-translate"]'
     },
     module: {
         preLoaders: [

src/main/resources/password/pwm/AppProperty.properties

@@ -79,7 +79,7 @@ http.resources.expirationSeconds=3600
 http.resources.gzip.enable=true
 http.resources.pathNonceEnable=true
 http.resources.pathNoncePrefix=nonce-
-http.resources.webjarMappings={"/public/resources/dojo/dgrid/":"/webjars/dgrid/1.1.0/","/public/resources/dojo/dojo/":"/webjars/dojo/1.11.2/","/public/resources/dojo/dijit/":"/webjars/dijit/1.11.2/","/public/resources/dojo/dojox/":"/webjars/dojox/1.11.2/","/public/resources/font/font-awesome/":"/webjars/font-awesome/4.6.3/","/public/resources/flags/":"/webjars/famfamfam-flags/1.0.0/dist/","/public/resources/systemjs/":"/webjars/systemjs/0.19.39/","/public/resources/angular/":"/webjars/angular/1.5.8/","/public/resources/angular-ui-router/":"/webjars/angular-ui-router/1.0.0-beta.3/","/public/resources/angular-ui-bootstrap/":"/webjars/angular-ui-bootstrap/2.1.4/","/public/resources/angular-ui-grid/":"/webjars/angular-ui-grid/3.2.9/"}
+http.resources.webjarMappings={"/public/resources/dojo/dgrid/":"/webjars/dgrid/1.1.0/","/public/resources/dojo/dojo/":"/webjars/dojo/1.11.2/","/public/resources/dojo/dijit/":"/webjars/dijit/1.11.2/","/public/resources/dojo/dojox/":"/webjars/dojox/1.11.2/","/public/resources/font/font-awesome/":"/webjars/font-awesome/4.6.3/","/public/resources/flags/":"/webjars/famfamfam-flags/1.0.0/dist/","/public/resources/angular/":"/webjars/angular/1.5.8/","/public/resources/angular-ui-router/":"/webjars/angular-ui-router/1.0.0-beta.3/","/public/resources/angular-translate/":"/webjars/angular-translate/2.13.0/"}
 http.resources.zipFiles=[]
 http.gzip.enable=true
 http.errors.allowHtml=true

src/main/webapp/WEB-INF/jsp/peoplesearch.jsp

@@ -41,6 +41,7 @@
 <%-- TODO: change these to the 'min' versions (i.e. angular.min.js) --%>
 <pwm:script-ref url="/public/resources/angular/angular.js" />
 <pwm:script-ref url="/public/resources/angular-ui-router/release/angular-ui-router.js" />
+<pwm:script-ref url="/public/resources/angular-translate/dist/angular-translate.js" />
 
 <%@ include file="fragment/footer.jsp" %>
 <pwm:script-ref url="/public/resources/js/peoplesearch.js" />