AMBARI-741. Use ember-i18n to externalize string resources in Ambari Web. (yusaku)

git-svn-id: https://svn.apache.org/repos/asf/incubator/ambari/branches/AMBARI-666@1385205 13f79535-47bb-0310-9956-ffa450edef68

AMBARI-666-CHANGES.txt

@@ -12,6 +12,9 @@ AMBARI-666 branch (unreleased changes)
 
   NEW FEATURES
 
+  AMBARI-741. Use ember-i18n to externalize string resources in Ambari Web.
+  (yusaku)
+
   AMBARI-735. Clean up Installer Welcome page and Install Options page.
   (Jaimin Jetly via yusaku)
 

ambari-web/app/assets/licenses/NOTICE.txt

@@ -20,3 +20,6 @@ This product includes LESS (http://lesscss.org - Apache License v2.0.)
 
 This product includes Sinon.JS (http://sinonjs.org - BSD license)
 Copyright (c) 2010-2012, Christian Johansen.
+
+This product includes ember-i18n (http://github.com/zendesk/ember-i18n - MIT license)
+Copyright (C) 2011 by James A. Rosen; Zendesk, Inc.

ambari-web/app/controllers/installer/step1.js

@@ -24,37 +24,34 @@ App.InstallerStep1Controller = Em.Controller.extend({
   clusterName: '',
   invalidClusterName: false,
   clusterNameError: '',
+
+  /**
+   * Returns true if the cluster name is valid and stores it in localStorage.
+   * Returns false otherwise, and sets appropriate field error message.
+   */
   validateStep1: function () {
-    //TODO: Done
-    //task1 =  checks on valid cluster name
-    //task2 (prereq(task1 says it's a valid cluster name)) =  storing cluster name in localstorage
-    var result;
-    console.log('TRACE: Entering controller:InstallerStep1:evaluateStep1 function');
+    console.log('TRACE: Entering controller:InstallerStep1:validateStep1 function');
     if (this.get('clusterName') == '') {
-      this.set('clusterNameError', App.messages.step1_clusterName_error_required);
+      this.set('clusterNameError', Em.I18n.t('installer.step1.clusterName.error.required'));
       this.set('invalidClusterName', true);
-      result = false;
+      return false;
     } else if (/\s/.test(this.get('clusterName'))) {
       console.log('White spaces not allowed for cluster name');
-      this.set('clusterNameError', App.messages.step1_clusterName_error_whitespaces);
+      this.set('clusterNameError', Em.I18n.t('installer.step1.clusterName.error.whitespaces'));
       this.set('invalidClusterName', true);
-      result = false;
+      return false;
     } else if (/[^\w\s]/gi.test(this.get('clusterName'))) {
       console.log('Special characters are not allowed for the cluster name');
-      this.set('clusterNameError', App.messages.step1_clusterName_error_specialChar);
+      this.set('clusterNameError', Em.I18n.t('installer.step1.clusterName.error.specialChar'));
       this.set('invalidClusterName', true);
-      result = false;
+      return false;
     } else {
-      console.log('value of clusterNmae is: ' + this.get('clusterName'));
+      console.log('value of clusterName is: ' + this.get('clusterName'));
       this.set('clusterNameError', '');
       this.set('invalidClusterName', false);
-      result = true;
-    }
-    if (result === true) {
       App.db.setClusterName(this.get('clusterName'));
+      return true;
     }
-    console.log('Exiting the evaluatestep1 function');
-    return result;
   }.observes('clusterName')
 
 })

ambari-web/app/controllers/installer/step2.js

@@ -26,7 +26,7 @@ App.InstallerStep2Controller = Em.Controller.extend({
   hostNameEmptyError: false,
   hostNameErr: false,
   manualInstall: false,
-  hostNameNotRequireErr: false,
+  hostNameNotRequiredErr: false,
   hostNameErrMsg: '',
   sshKey: '',
   passphrase: '',
@@ -52,49 +52,43 @@ App.InstallerStep2Controller = Em.Controller.extend({
     }
   }.observes('localRepo'),
 
-  checkHostNames: function () {
+  validateHostNames: function () {
     this.hostNameArr = this.get('hostNames').split(new RegExp("\\s"));
     for (var i = 0; i < this.hostNameArr.length; i++) {
       //TODO: other validation for hostnames will be covered over here
-      // For now hostname that are starting or ending with '-' are not allowed
+      // For now hostnames that start or end with '-' are not allowed
       if (/^\-/.test(this.hostNameArr[i]) || /\-$/.test(this.hostNameArr[i])) {
         console.log('Invalid host name: ' + this.hostNameArr[i]);
-        var hostNameErrMsg = App.messages.step2_hostNameErr;
-        this.set('hostNameErrMsg', hostNameErrMsg);
+        this.set('hostNameErrMsg', Em.I18n.t('installer.step2.hostName.error.invalid'));
         this.set('hostNameErr', true);
         this.set('hostNameEmptyError', false);
-        this.set('hostNameNotRequireErr', false);
+        this.set('hostNameNotRequiredErr', false);
         return false;
       }
     }
-    this.set('hostNameErrMsg', '');
-    this.set('hostNameEmptyError', false);
-    this.set('hostNameNotRequireErr', false);
-    this.set('hostNameErr', false);
     return true;
   },
 
-  hostErr: function () {
+  validateHosts: function () {
     if (this.get('hostNames') === '' && this.get('manualInstall') === false) {
       this.set('hostNameEmptyError', true);
-      this.set('hostNameNotRequireErr', false);
+      this.set('hostNameNotRequiredErr', false);
       this.set('hostNameErr', false);
-      this.set('hostNameErrMsg', App.messages.step2_hostNameEmptyError);
+      this.set('hostNameErrMsg', Em.I18n.t('installer.step2.hostName.error.required'));
     } else if (this.get('hostNames') !== '' && this.get('manualInstall') === true) {
-      this.set('hostNameNotRequireErr', true);
+      this.set('hostNameNotRequiredErr', true);
       this.set('hostNameEmptyError', false);
       this.set('hostNameErr', false);
-      this.set('hostNameErrMsg', App.messages.step2_hostNameNotRequireErr);
+      this.set('hostNameErrMsg', Em.I18n.t('installer.step2.hostName.error.notRequired'));
     } else {
       this.set('hostNameErr', false);
       this.set('hostNameEmptyError', false);
-      this.set('hostNameNotRequireErr', false);
+      this.set('hostNameNotRequiredErr', false);
       this.set('hostNameErrMsg', '');
     }
-
   }.observes('hostNames', 'manualInstall'),
 
-  sshKeyErr: function () {
+  validateSSHKey: function () {
     if (this.get('manualInstall') === false) {
       if (this.get('sshKey') === '') {
         this.set('sshKeyNullErr', true);
@@ -106,7 +100,7 @@ App.InstallerStep2Controller = Em.Controller.extend({
 
   }.observes('manualInstall', 'sshKey'),
 
-  passphraseErr: function () {
+  validatePassphrase: function () {
     if (this.get('manualInstall') === false) {
       if (this.get('passphrase') !== this.get('confirmPassphrase')) {
         this.set('passphraseMatchErr', true);
@@ -116,7 +110,7 @@ App.InstallerStep2Controller = Em.Controller.extend({
     }
   }.observes('manualInstall', 'passphrase', 'confirmPassphrase'),
 
-  localRepoErr: function () {
+  validateLocalRepo: function () {
     if (this.get('localRepo') === true) {
       if (this.get('localRepoPath') === '') {
         this.set('softRepoLocalPathNullErr', true);
@@ -129,16 +123,15 @@ App.InstallerStep2Controller = Em.Controller.extend({
   }.observes('localRepoPath'),
 
   validateStep2: function () {
-    this.hostErr();
-    this.sshKeyErr();
-    this.passphraseErr();
-    this.localRepoErr();
-    return (this.checkHostNames());
+    this.validateHosts();
+    this.validateSSHKey();
+    this.validatePassphrase();
+    this.validateLocalRepo();
+    return this.validateHostNames();
   },
 
-
   hostManageErr: function () {
-    return (this.get('hostNameEmptyError') || this.get('hostNameNotRequireErr') ||
+    return (this.get('hostNameEmptyError') || this.get('hostNameNotRequiredErr') ||
       this.get('hostNameErr') || this.get('sshKeyNullErr') || this.get('passphraseMatchErr'));
   }.property('hostNameErrMsg', 'sshKeyNullErr', 'passphraseMatchErr'),
 
@@ -178,12 +171,12 @@ App.InstallerStep2Controller = Em.Controller.extend({
     //task4 = Storing ambari agent Install type in localStorage (installType maps at host level and so every host will have this as an property)
     //task5 = Storing path of software repository(remote/local repo) to localStorage
     //task6 = call to rest API: @Post http://ambari_server/api/bootstrap
-    //task7 = On manual Install, next button click pops up a warning with "proceed" and "close" buttons
-    //task8 =  On faliure of the previous call, show 'error injecting host information in server db'
-    //task9 =  On success of the previous call, go to step 3(awesome....)
+    //task7 = On Manual Install, next button click pops up a warning with "proceed" and "close" buttons
+    //task8 = On faliure of the previous call, show 'error injecting host information in server db'
+    //task9 = On success of the previous call, go to step 3
 
     console.log('TRACE: Entering controller:InstallerStep2:evaluateStep2 function');
-    /**                 task1                **/
+
     console.log('value of manual install is: ' + this.get('manualInstall'));
 
     var validateResult = this.validateStep2();
@@ -198,33 +191,22 @@ App.InstallerStep2Controller = Em.Controller.extend({
       }
     }
 
-
     var hostInfo = {};
     for (var i = 0; i < this.hostNameArr.length; i++) {
-      hostInfo[this.hostNameArr[i]] = {'name': this.hostNameArr[i]};
-      // hostInfo[this.hostNameArr[i]].name =  this.hostNameArr[i];
-      hostInfo[this.hostNameArr[i]].installType = this.get('installType');
+      hostInfo[this.hostNameArr[i]] = {
+        name: this.hostNameArr[i],
+        installType: this.get('installType')
+      };
     }
     App.db.setHosts(hostInfo);
 
-
-    /**                     task5                    **/
-    var repoType;
-    var repoPath;
     if (this.get('localRepo') === false) {
-      repoType = 'remote';
-      repoPath = null;
+      App.db.setSoftRepo({ 'repoType': 'remote', 'repoPath': null});
     } else {
-      repoType = 'local';
-      repoPath = this.get('localRepoPath');
+      App.db.setSoftRepo({ 'repoType': 'local', 'repoPath': this.get('localRepoPath') });
     }
-    var softRepoInfo = {'type': repoType, 'path': repoPath};
-    App.db.setSoftRepo(softRepoInfo);
 
-
-    /**                      task6                  **/
-
-    //just an additional check. If manualInstall is true, program should have not reached over here
+    // Just an additional check. If manualInstall is true, program should have not reached over here
     if (this.get('manualInstall') === false) {
       // For now using mock jquery call
       //TODO: hook up with bootstrap call
@@ -251,7 +233,6 @@ App.InstallerStep2Controller = Em.Controller.extend({
             console.log("TRACE: In faliure function for the post bootstrap function");
             //Remove below line, once bootstrap has been implemented
             App.router.transitionTo('step3');
-
             return true;
           }
         },
@@ -263,10 +244,9 @@ App.InstallerStep2Controller = Em.Controller.extend({
 
   },
 
-
   manualInstallPopup: function (event) {
     App.ModalPopup.show({
-      header: 'Manual Install',
+      header: Em.I18n.t('installer.step2.manualInstall.popup.header'),
       onPrimary: function () {
         this.hide();
         App.router.transitionTo('step3');

ambari-web/app/controllers/login.js

@@ -33,7 +33,7 @@ App.LoginController = Em.Object.extend({
       App.get('router').login(this.get('loginName'));
     } else {
       console.log('Failed to login as: ' + this.get('loginName'));
-      this.set('errorMessage', App.messages.login_error);
+      this.set('errorMessage', Em.I18n.t('login.error'));
     }
 
   },

ambari-web/app/messages.js

@@ -16,75 +16,73 @@
  * limitations under the License.
  */
 
+Em.I18n.translations = {
 
-var App = require('app');
+  'app.name': 'Ambari',
 
-App.messages = {
-  'app_name': 'Ambari',
-  'page_title': 'Ambari',
-  'installer_welcome': 'Welcome to Ambari installation wizard',
-  'login_error': 'Invalid username/password combination.',
-  'login_header': 'Sign in',
-  'username_label': 'Username',
-  'password_label': 'Password',
-  'login_button': 'Sign in',
-  'step1_header': 'Ambari Cluster Install Wizard',
-  'step1_body': 'Welcome to Apache Ambari<br>' +
-    'Ambari makes it really easy to install,manage, and monitor Hadoop clusters.<br\>' +
-    'We will walk you through the cluster installation process with this ' +
-    'step-by-step wizard.',
-  'step2_header': 'Install Options',
-  'step3_header': 'Confirm Hosts',
-  'step3_body': 'Here are the results of the host discovery process.<br/> ' +
-    'Please verify and remove the ones that you do not want to be the part of the cluster.',
-  'step4_header': 'Choose Services',
-  'step5_header': 'Assign Masters',
-  'step6_header': 'Assign Slaves',
-  'step7_header': 'Customize Services',
-  'step8_header': 'Review',
-  'step9_header': 'Install, Start and Test',
-  'step10_header': 'Summary',
-  'step1_clusterPop': 'Enter a unique cluster name. Cluster name cannot be changed later.',
-  'step1_clusterName_error_required': 'Cluster Name is required',
-  'step1_clusterName_error_whitespaces': 'Cluster Name cannot contain white spaces',
-  'step1_clusterName_error_specialChar': 'Cluster Name cannot contain special character',
-  'topnav_help_link': 'http://incubator.apache.org/ambari/install.html',
-  'welcome_header': 'Welcome to Ambari!',
-  'step2_targetHosts': 'Enter a list of host names, one per line. Or use',
-  'step2_targetHosts_label': 'Specify Hosts to Manage',
-  'step2_hostNameEmptyError': 'host names cannot be left empty',
-  'step2_sshKeyNullErr': 'ssh key cannot be empty',
-  'step2_passphraseMatchErr': 'Passphrases do not match',
-  'step2_hostNameNotRequireErr': 'Host names not required for ssh-less install of ambari agents',
-  'step2_hostNameErr': 'Invalid host name: host name cannot start or end with hyphen',
-  'step2_manualInstallOpt': 'Do not use SSH to automatically configure the hosts ',
-  'step2_localRepoOpt': '',
-  'step2_softRepo_default_localPath': '/etc/yum/repos.d/hdp',
-  'step2_softRepo_remotePath': '',
-  'step2_advancedOption_label': 'Advanced Options',
-  'step2_repoConf_label': 'Software Repository Configuration File Path',
-  'step2_localRepoOpt': 'Use a local software repository',
-  'step2_localRepoErr': 'Local repository file path is required',
-  'step2_localRepoExplan': '<p class=\"text-info\">The repository configuration file should be installed on each host in your cluster. ' +
-    'This file instructs package manager to use your local software repository to retrieve software packages,instead of ' +
-    'using internet.</p>',
-  'step2_hostPatternPop': 'Space, tab or new line can be used as deliminiter',
-  'step2_localRepoPop': 'The repository configuration file should be installed on each host' +
+  'login.header': 'Sign in',
+  'login.username': 'Username',
+  'login.password': 'Password',
+  'login.loginButton': 'Sign in',
+  'login.error': 'Invalid username/password combination.',
+
+  'topnav.help.href': 'http://incubator.apache.org/ambari/install.html',
+
+  'installer.step1.header': 'Ambari Cluster Install Wizard',
+  'installer.step1.body': 'Welcome to Apache Ambari!<br>' +
+    'Ambari makes it easy to install, manage, and monitor Hadoop clusters.<br>' +
+    'We will walk you through the cluster installation process with this step-by-step wizard.',
+  'installer.step1.clusterName': 'Name your cluster',
+  'installer.step1.clusterName.tooltip.title': 'Cluster Name',
+  'installer.step1.clusterName.tooltip.content': 'Enter a unique cluster name. Cluster name cannot be changed later.',
+  'installer.step1.clusterName.error.required': 'Cluster Name is required',
+  'installer.step1.clusterName.error.whitespaces': 'Cluster Name cannot contain white spaces',
+  'installer.step1.clusterName.error.specialChar': 'Cluster Name cannot contain special characters',
+
+  'installer.step2.header': 'Install Options',
+  'installer.step2.targetHosts': 'Specify Hosts to Manage',
+  'installer.step2.targetHosts.info': 'Enter a list of host names, one per line',
+  'installer.step2.hostPattern.tooltip.title': 'Pattern Expressions',
+  'installer.step2.hostPattern.tooltip.content': 'You can use pattern expressions to specify a number of target hosts.  Explain brackets.',
+  'installer.step2.hostName.error.required': 'Host Names cannot be left empty',
+  'installer.step2.hostName.error.notRequired': 'Host Names will be ignored for if not using SSH to automatically configure hosts',
+  'installer.step2.hostName.error.invalid': 'Invalid Host Name(s) - cannot start or end with a hyphen',
+  'installer.step2.sshKey.error.required': 'SSH Private Key is required',
+  'installer.step2.passphrase.error.match': 'Passphrases do not match',
+  'installer.step2.manualInstallOption': 'Do not use SSH to automatically configure hosts ',
+  'installer.step2.advancedOption': 'Advanced Options',
+  'installer.step2.repoConf': 'Software Repository Configuration File Path',
+  'installer.step2.localRepoOption': 'Use a local software repository',
+  'installer.step2.localRepo.error.required': 'Local repository file path is required',
+  'installer.step2.localRepo.info': '<p class=\"text-info\">The repository configuration file should be installed on each host in your cluster. ' +
+    'This file instructs package manager to use your local software repository to retrieve software packages, instead of ' +
+    'downloading from the internet.</p>',
+  'installer.step2.localRepo.tooltip.title': 'Local Software Repository',
+  'installer.step2.localRepo.tooltip.content': 'The repository configuration file should be installed on each host' +
     'in your cluster. This file instructs package manager to use your local' +
     'software repository to retrieve software packages, instead of using the internet.',
-  'step2_manualInstallExplain': 'Ambari agents will not be installed ' +
-    'automatically. You will require to install it manually on each host of ' +
-    'your cluster. Agents should be started before you move to next stage.',
-  'step2_popupBody': 'Ambari agents should be manually installed before you proceed ahead.',
-  'welcome_body': '<p>Ambari makes it easy for you to install, configure, and manage your Hadoop cluster.<br>First, ' +
-    'we will walk you through setting up your cluster with a step-by-step wizard.</p>',
-  'welcome_note': 'Before you proceed, make sure you have performed all the pre-installation steps.',
-  'welcome_submit_label': 'Get started',
-  'installFailed_header': 'Cluster installation failed',
-  'installFailed_body': 'Cluster installation failed.  To continue, you will need to uninstall the cluster first and ' +
-    're-install the cluster.',
-  'installFailed_submit_label': 'Start the uninstall process',
-  'uninstallFailed_header': 'Cluster uninstallation failed',
-  'uninstallFailed_body': 'Failed to uninstall the cluster'
-};
+  'installer.step2.manualInstall.tooltip.title': 'Not Using SSH (Manual Install)',
+  'installer.step2.manualInstall.tooltip.content': 'Ambari agents will not be installed ' +
+    'automatically. You need to install it manually on each host that you want to manage as part of ' +
+    'your cluster. Agents should be started before you move to the next stage.',
+  'installer.step2.manualInstall.popup.header': 'Before You Proceed',
+  'installer.step2.manualInstall.popup.body': 'You must install Ambari Agents on each host you want to manage before you proceed.  <a href="#" target="_blank">Learn more</a>',
+
+  'installer.step3.header': 'Confirm Hosts',
+  'installer.step3.body': 'Here are the results of the host discovery process.<br>' +
+    'Please verify and remove the ones that you do not want to be the part of the cluster.',
 
+  'installer.step4.header': 'Choose Services',
+
+  'installer.step5.header': 'Assign Masters',
+
+  'installer.step6.header': 'Assign Slaves',
+
+  'installer.step7.header': 'Customize Services',
+
+  'installer.step8.header': 'Review',
+
+  'installer.step9.header': 'Install, Start and Test',
+
+  'installer.step10.header': 'Summary'
+};

ambari-web/app/templates/application.hbs

@@ -20,9 +20,9 @@
         <div class="navbar-inner">
             <div class="container">
                 <a {{action gotoStep1}}><img id="logo" src="/img/logo-small.gif"></a>
-                <a class="brand" href="#">{{App.messages.app_name}}</a>
+                <a class="brand" href="#">{{t app.name}}</a>
                 <ul class="nav">
-                    <li class="right"><a class="help" {{bindAttr href="App.messages.topnav_help_link"}} target="_blank">Help</a></li>
+                    <li class="right"><a class="help" {{translateAttr href="topnav.help.href"}} target="_blank">Help</a></li>
                     {{#if App.router.loggedIn}}
                     <li class="right"><a class="help" href="" {{action logoff}}>Sign out</a></li>
                     {{/if}}

ambari-web/app/templates/installer.hbs

@@ -17,39 +17,30 @@
 -->
 
 <div id="installer">
-    <div class="container">
-        <div class="container-fluid">
-            <div class="row-fluid">
-                <div class="span3">
-                    <!--Sidebar content-->
-                    <div class="well">
-                        <ul class="nav nav-pills nav-stacked">
-                            <li {{bindAttr class="isStep1:active"}}><a {{action gotoStep1}}>{{App.messages.step1_header}}</a></li>
-                            <li {{bindAttr class="isStep2:active"}}><a {{action gotoStep2}}>{{App.messages.step2_header}}</a></li>
-                            <li {{bindAttr class="isStep3:active"}}><a {{action gotoStep3}}>{{App.messages.step3_header}}</a></li>
-                            <li {{bindAttr class="isStep4:active"}}><a {{action gotoStep4}}>{{App.messages.step4_header}}</a></li>
-                            <li {{bindAttr class="isStep5:active"}}><a {{action gotoStep5}}>{{App.messages.step5_header}}</a></li>
-                            <li {{bindAttr class="isStep6:active"}}><a {{action gotoStep6}}>{{App.messages.step6_header}}</a></li>
-                            <li {{bindAttr class="isStep7:active"}}><a {{action gotoStep7}}>{{App.messages.step7_header}}</a></li>
-                            <li {{bindAttr class="isStep8:active"}}><a {{action gotoStep8}}>{{App.messages.step8_header}}</a></li>
-                            <li {{bindAttr class="isStep9:active"}}><a {{action gotoStep9}}>{{App.messages.step9_header}}</a></li>
-                            <li {{bindAttr class="isStep10:active"}}><a {{action gotoStep10}}>{{App.messages.step10_header}}</a></li>
-                        </ul>
-                    </div>
-                </div>
-                <div class="well span9 content">
-                    {{#unless currentStep}}
-                    <h4>{{App.messages.installer_welcome}}</h4>
-
-                    <!--  below gotoStep1 call should be replaced by a function in installerController that checks
-                         the existing incomplete installation and cleans all the local stored data related to it -->
-
-                    <a class="btn btn-success" {{action "gotoStep1"}}>New cluster</a>
-
-                    {{/unless}}
-                    {{outlet}}
-                </div>
-            </div>
+  <div class="container">
+    <div class="container-fluid">
+      <div class="row-fluid">
+        <div class="span3">
+          <!--Sidebar content-->
+          <div class="well">
+            <ul class="nav nav-pills nav-stacked">
+              <li {{bindAttr class="isStep1:active"}}><a {{action gotoStep1}}>{{t installer.step1.header}}</a></li>
+              <li {{bindAttr class="isStep2:active"}}><a {{action gotoStep2}}>{{t installer.step2.header}}</a></li>
+              <li {{bindAttr class="isStep3:active"}}><a {{action gotoStep3}}>{{t installer.step3.header}}</a></li>
+              <li {{bindAttr class="isStep4:active"}}><a {{action gotoStep4}}>{{t installer.step4.header}}</a></li>
+              <li {{bindAttr class="isStep5:active"}}><a {{action gotoStep5}}>{{t installer.step5.header}}</a></li>
+              <li {{bindAttr class="isStep6:active"}}><a {{action gotoStep6}}>{{t installer.step6.header}}</a></li>
+              <li {{bindAttr class="isStep7:active"}}><a {{action gotoStep7}}>{{t installer.step7.header}}</a></li>
+              <li {{bindAttr class="isStep8:active"}}><a {{action gotoStep8}}>{{t installer.step8.header}}</a></li>
+              <li {{bindAttr class="isStep9:active"}}><a {{action gotoStep9}}>{{t installer.step9.header}}</a></li>
+              <li {{bindAttr class="isStep10:active"}}><a {{action gotoStep10}}>{{t installer.step10.header}}</a></li>
+            </ul>
+          </div>
+        </div>
+        <div class="well span9 content">
+          {{outlet}}
         </div>
+      </div>
     </div>
+  </div>
 </div>

ambari-web/app/templates/installer/step1.hbs

@@ -17,18 +17,16 @@
 -->
 
 
-<h2>{{App.messages.step1_header}}</h2>
-<p class="alert alert-info">{{{App.messages.step1_body}}}</p>
+<h2>{{t installer.step1.header}}</h2>
+<p class="alert alert-info">{{t installer.step1.body}}</p>
 <div {{bindAttr class="invalidClusterName:error :control-group"}}>
-  <label class="control-label" for="cluster-name">Name of Your Cluster
+  <label class="control-label" for="cluster-name">{{t installer.step1.clusterName}}
     <a href="javascript:void(null)"
        rel="popover"
-       title="Cluster name"
-      {{bindAttr data-content= "App.messages.step1_clusterPop"}}>
-      Learn more</a>
+      {{translateAttr title="installer.step1.clusterName.tooltip.title"
+       data-content="installer.step1.clusterName.tooltip.content"}}>Learn more</a>
   </label>
 
-
   <div class="controls">
     {{view Ember.TextField id="cluster-name" valueBinding="clusterName" placeholder="cluster name" target="controller"}}
     <p class="help-inline">{{clusterNameError}}</p>
@@ -36,8 +34,7 @@
 </div>
 
 <div class="btn-area">
-  <a
-    class="btn btn-success" {{bindAttr disabled= "invalidClusterName"}} {{action next}}>Next</a>
+  <a class="btn btn-success" {{bindAttr disabled= "invalidClusterName"}} {{action next}}>Next</a>
 </div>
 
 

ambari-web/app/templates/installer/step10.hbs

@@ -16,7 +16,7 @@
 * limitations under the License.
 -->
 
-<h2>{{App.messages.step10_header}}</h2>
+<h2>{{t installer.step10.header}}</h2>
 <div class="btn-area">
     <a class="btn" {{action back}}>Back</a>
     <a class="btn btn-success" {{action complete}}>Complete</a>

ambari-web/app/templates/installer/step2.hbs

@@ -16,17 +16,18 @@
 * limitations under the License.
 -->
 
-<h2>{{App.messages.step2_header}}</h2>
+<h2>{{t installer.step2.header}}</h2>
 
-<h5 {{bindAttr class="hostManageErr:text-error"}}>{{App.messages.step2_targetHosts_label}}</h5>
+<h5 {{bindAttr class="hostManageErr:text-error"}}>{{t installer.step2.targetHosts}}</h5>
 
 <div {{bindAttr class="hostNameErrMsg:error :control-group"}}>
-  <p>{{App.messages.step2_targetHosts}}
+  <p>{{t installer.step2.targetHosts.info}}.  Or use
     <a href="javascript:void(null)"
        rel="popover"
-       title="Delimiters"
-      {{bindAttr data-content= "App.messages.step2_hostPatternPop"}}>
-      Pattern expressions</a></p>
+       {{translateAttr title="installer.step2.hostPattern.tooltip.title" data-content="installer.step2.hostPattern.tooltip.content"}}>
+      {{t installer.step2.hostPattern.tooltip.title}}
+    </a>
+  </p>
 
   <div class="controls">
     {{view Ember.TextArea class="span6" valueBinding="hostNames" rows="5" placeholder="host names"}}
@@ -39,12 +40,11 @@
 <div id="hostConnectId">
   <div class="ambari-agents">
 
-    <!-- <ul class="unstyled"> -->
     <div {{bindAttr class="sshKeyNullErr:error :control-group"}}>
       <div class="controls">
         {{view Ember.TextArea class="span6" rows="4" placeholder="ssh private key" valueBinding="sshKey"}}
         {{#if sshKeyNullErr}}
-        <span class="help-inline">{{App.messages.step2_sshKeyNullErr}}</span>
+        <span class="help-inline">{{t installer.step2.sshKey.error.required}}</span>
         {{/if}}
       </div>
     </div>
@@ -56,51 +56,47 @@
         {{view Ember.TextField type="text" placeholder="confirm passphrase" valueBinding="confirmPassphrase"}}
 
         {{#if passphraseMatchErr}}
-        <p class="help-inline">{{App.messages.step2_passphraseMatchErr}}</p>
+        <p class="help-inline">{{t installer.step2.passphrase.error.match}}</p>
         {{/if}}
       </div>
     </div>
 
-    </ul>
   </div>
 
 </div>
 
-<h5 {{bindAttr class="advOptErr:text-error"}}>{{App.messages.step2_advancedOption_label}}</h5>
+<h5 {{bindAttr class="advOptErr:text-error"}}>{{t installer.step2.advancedOption}}</h5>
 <label class="checkbox">
-  {{App.messages.step2_manualInstallOpt}}
+  {{t installer.step2.manualInstallOption}}
   <a href="javascript:void(null)"
      rel="popover"
-     title="Manual Install"
-    {{bindAttr data-content= "App.messages.step2_manualInstallExplain"}}>
+    {{translateAttr title="installer.step2.manualInstall.tooltip.title" data-content="installer.step2.manualInstall.tooltip.content"}}>
     Learn more</a>
   {{view Ember.Checkbox checkedBinding="manualInstall"}}
 </label>
 <label class="checkbox">
-  {{App.messages.step2_localRepoOpt}}
+  {{t installer.step2.localRepoOption}}
   <a href="javascript:void(null)"
      rel="popover"
-     title="Local repository"
-    {{bindAttr data-content= "App.messages.step2_localRepoPop"}}>
+    {{translateAttr title="installer.step2.localRepo.tooltip.title" data-content="installer.step2.localRepo.tooltip.content"}}>
     Learn more</a>
   {{view Ember.Checkbox checkedBinding="localRepo"}}
 </label>
 
 {{#if localRepo}}
 <div {{bindAttr class="softRepoLocalPathNullErr:error :control-group"}}>
+  <div class="alert alert-info">
+    {{t installer.step2.localRepo.info}}
+  </div>
   <div class="controls">
-    {{view Ember.TextField type="text" placeholder="/etc/yum/repos.d/hdp" valueBinding="localRepoPath"}}
+    {{view Ember.TextField type="text" class="span6" placeholder="Local repo file path (e.g., /etc/yum/repos.d/hdp)" valueBinding="localRepoPath"}}
     {{#if softRepoLocalPathNullErr}}
-    <p class="help-inline">{{App.messages.step2_localRepoErr}}</p>
+    <p class="help-inline">{{t installer.step2.localRepo.error.required}}</p>
     {{/if}}
   </div>
-  <div class="alert alert-info">
-    {{{App.messages.step2_localRepoExplan}}}
-  </div>
 </div>
 {{/if}}
 
-
 <div class="btn-area">
   <a class="btn" {{action back}}>Previous</a>
   {{#if manualInstall}}

ambari-web/app/templates/installer/step2ManualInstallPopup.hbs

@@ -0,0 +1 @@
+<p>{{t installer.step2.manualInstall.popup.body}}</p>

ambari-web/app/templates/installer/step3.hbs

@@ -16,8 +16,8 @@
 * limitations under the License.
 -->
 
-<h2>{{App.messages.step3_header}} </h2>
-<p class="alert alert-info">{{{App.messages.step3_body}}}</p>
+<h2>{{t installer.step3.header}}</h2>
+<p class="alert alert-info">{{t installer.step3.body}}</p>
 <div id="hosts" class="box">
   <div class="box-header">
     <div class="button-section">

ambari-web/app/templates/installer/step4.hbs

@@ -17,7 +17,7 @@
 -->
 
 
-<h2>{{App.messages.step4_header}}</h2>
+<h2>{{t installer.step4.header}}</h2>
 <div class="btn-area">
     <a class="btn" {{action back}}>Back</a>
     <a class="btn btn-success" {{action next}}>Next</a>

ambari-web/app/templates/installer/step5.hbs

@@ -17,7 +17,7 @@
 -->
 
 
-<h2>{{App.messages.step5_header}}</h2>
+<h2>{{t installer.step5.header}}</h2>
 <div class="btn-area">
     <a class="btn" {{action back}}>Back</a>
     <a class="btn btn-success" {{action next}}>Next</a>

ambari-web/app/templates/installer/step6.hbs

@@ -17,7 +17,7 @@
 -->
 
 
-<h2>{{App.messages.step6_header}}</h2>
+<h2>{{t installer.step6.header}}</h2>
 <div class="btn-area">
     <a class="btn" {{action back}}>Back</a>
     <a class="btn btn-success" {{action next}}>Next</a>

ambari-web/app/templates/installer/step7.hbs

@@ -16,7 +16,7 @@
 * limitations under the License.
 -->
 <div id="serviceConfig">
-<h2>{{App.messages.step7_header}}{{isValid}}</h2>
+<h2>{{t installer.step7.header}}</h2>
 {{#view App.ServiceConfigTabs}}
 <ul class="nav nav-tabs">
 {{#each service in controller}}
@@ -61,4 +61,4 @@
     <a class="btn" {{action back}}>Back</a>
     <a {{bindAttr class=":btn :btn-success"}} {{bindAttr disabled="isSubmitDisabled"}} style="float:right" {{action submit target="controller"}}>Next</a>
 </div>
-</div>
+</div>

ambari-web/app/templates/installer/step8.hbs

@@ -16,7 +16,7 @@
 * limitations under the License.
 -->
 
-<h2>{{App.messages.step8_header}}</h2>
+<h2>{{t installer.step8.header}}</h2>
 <div class="btn-area">
     <a class="btn" {{action back}}>Back</a>
     <a class="btn btn-success" {{action next}}>Next</a>

ambari-web/app/templates/installer/step9.hbs

@@ -16,7 +16,7 @@
 * limitations under the License.
 -->
 
-<h2>{{App.messages.step9_header}}</h2>
+<h2>{{t installer.step9.header}}</h2>
 <div class="btn-area">
     <a class="btn" {{action back}}>Back</a>
     <a class="btn btn-success" {{action next}}>Next</a>

ambari-web/app/templates/login.hbs

@@ -17,17 +17,17 @@
 -->
 
 <div class="well login span4">
-    <h2>{{App.messages.login_header}}</h2>
+    <h2>{{t login.header}}</h2>
     {{#if errorMessage}}
     <div class="alert alert-error">
         {{errorMessage}}
     </div>
     {{/if}}
-    <label>{{App.messages.username_label}}</label>
+    <label>{{t login.username}}</label>
     {{view Ember.TextField valueBinding="loginName" class="span4"}}
-    <label>{{App.messages.password_label}}</label>
+    <label>{{t login.password}}</label>
     {{view Ember.TextField type="password" valueBinding="password" class="span4"}}
     <div>
-        <a class="btn btn-success" {{action "submit" target="controller"}}>{{App.messages.login_button}}</a>
+        <a class="btn btn-success" {{action "submit" target="controller"}}>{{t login.loginButton}}</a>
     </div>
 </div>

ambari-web/config.coffee

@@ -38,6 +38,7 @@ exports.config =
           'vendor/scripts/handlebars-1.0.0.beta.6.js',
           'vendor/scripts/ember-latest.js',
           'vendor/scripts/ember-data-latest.js',
+          'vendor/scripts/ember-i18n-1.2.0.js',
           'vendor/scripts/bootstrap.js',
           'vendor/scripts/sinon-1.4.2.js'
           ]

ambari-web/vendor/scripts/ember-i18n-1.2.0.js

@@ -0,0 +1,144 @@
+/*
+Copyright (C) 2011 by James A. Rosen; Zendesk, Inc.
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
+*/
+(function() {
+  var I18n, findTemplate, getPath, isBinding, isTranslatedAttribute, pluralForm;
+
+  isTranslatedAttribute = /(.+)Translation$/;
+
+  getPath = Ember.Handlebars.getPath || Ember.getPath;
+
+  if (typeof CLDR !== "undefined" && CLDR !== null) pluralForm = CLDR.pluralForm;
+
+  if (pluralForm == null) {
+    Ember.Logger.warn("CLDR.pluralForm not found. Em.I18n will not support count-based inflection.");
+  }
+
+  findTemplate = function(key, setOnMissing) {
+    var result;
+    Ember.assert("You must provide a translation key string, not %@".fmt(key), typeof key === 'string');
+    result = I18n.translations[key];
+    if (setOnMissing) {
+      if (result == null) {
+        result = I18n.translations[key] = I18n.compile("Missing translation: " + key);
+      }
+    }
+    if ((result != null) && !$.isFunction(result)) {
+      result = I18n.translations[key] = I18n.compile(result);
+    }
+    return result;
+  };
+
+  I18n = {
+    compile: Handlebars.compile,
+    translations: {},
+    template: function(key, count) {
+      var interpolatedKey, result, suffix;
+      if ((count != null) && (pluralForm != null)) {
+        suffix = pluralForm(count);
+        interpolatedKey = "%@.%@".fmt(key, suffix);
+        result = findTemplate(interpolatedKey, false);
+      }
+      return result != null ? result : result = findTemplate(key, true);
+    },
+    t: function(key, context) {
+      var template;
+      if (context == null) context = {};
+      template = I18n.template(key, context.count);
+      return template(context);
+    },
+    TranslateableAttributes: Em.Mixin.create({
+      didInsertElement: function() {
+        var attribute, isTranslatedAttributeMatch, key, path, result, translatedValue;
+        result = this._super.apply(this, arguments);
+        for (key in this) {
+          path = this[key];
+          isTranslatedAttributeMatch = key.match(isTranslatedAttribute);
+          if (isTranslatedAttributeMatch) {
+            attribute = isTranslatedAttributeMatch[1];
+            translatedValue = I18n.t(path);
+            this.$().attr(attribute, translatedValue);
+          }
+        }
+        return result;
+      }
+    })
+  };
+
+  // SC.I18n = I18n;
+
+  Em.I18n = I18n;
+
+  Ember.I18n = I18n;
+
+  isBinding = /(.+)Binding$/;
+
+  Handlebars.registerHelper('t', function(key, options) {
+    var attrs, context, elementID, result, tagName, view;
+    context = this;
+    attrs = options.hash;
+    view = options.data.view;
+    tagName = attrs.tagName || 'span';
+    delete attrs.tagName;
+    elementID = "i18n-" + (jQuery.uuid++);
+    Em.keys(attrs).forEach(function(property) {
+      var bindPath, currentValue, invoker, isBindingMatch, observer, propertyName;
+      isBindingMatch = property.match(isBinding);
+      if (isBindingMatch) {
+        propertyName = isBindingMatch[1];
+        bindPath = attrs[property];
+        currentValue = getPath(bindPath);
+        attrs[propertyName] = currentValue;
+        invoker = null;
+        observer = function() {
+          var elem, newValue;
+          newValue = getPath(context, bindPath);
+          elem = view.$("#" + elementID);
+          if (elem.length === 0) {
+            Em.removeObserver(context, bindPath, invoker);
+            return;
+          }
+          attrs[propertyName] = newValue;
+          return elem.html(I18n.t(key, attrs));
+        };
+        invoker = function() {
+          return Em.run.once(observer);
+        };
+        return Em.addObserver(context, bindPath, invoker);
+      }
+    });
+    result = '<%@ id="%@">%@</%@>'.fmt(tagName, elementID, I18n.t(key, attrs), tagName);
+    return new Handlebars.SafeString(result);
+  });
+
+  Handlebars.registerHelper('translateAttr', function(options) {
+    var attrs, result;
+    attrs = options.hash;
+    result = [];
+    Em.keys(attrs).forEach(function(property) {
+      var translatedValue;
+      translatedValue = I18n.t(attrs[property]);
+      return result.push('%@="%@"'.fmt(property, translatedValue));
+    });
+    return new Handlebars.SafeString(result.join(' '));
+  });
+
+}).call(this);