Merge pull request #6186 from himdel/ssui-i18n

SSUI i18n tooling
ManageIQ · Jan 21, 2016 · e5a3720 · e5a3720
2 parents 2bf6766 + 719dd7b
commit e5a3720
Show file tree

Hide file tree

Showing 20 changed files with 130 additions and 20 deletions.
diff --git a/spa_ui/self_service/.jscsrc b/spa_ui/self_service/.jscsrc
@@ -1,5 +1,4 @@
 {
-  "disallowDanglingUnderscores": true,
   "disallowImplicitTypeConversion": [
     "numeric",
     "binary",
@@ -148,9 +147,5 @@
   "safeContextKeyword": ["self", "vm"],
   "validateIndentation": 2,
   "validateLineBreaks": "LF",
-  "validateParameterSeparator": ", ",
-  "validateQuoteMarks": {
-    "mark": "'",
-    "escape": true
-  }
+  "validateParameterSeparator": ", "
 }
diff --git a/spa_ui/self_service/.jshintrc b/spa_ui/self_service/.jshintrc
@@ -20,11 +20,6 @@
   "nonbsp"        : true,     // true: Prohibit "non-breaking whitespace" characters.
   "nonew"         : false,    // true: Prohibit use of constructors for side-effects (without assignment)
   "plusplus"      : false,    // true: Prohibit use of `++` & `--`
-  "quotmark"      : "single", // Quotation mark consistency:
-  //   false    : do nothing (default)
-  //   true     : ensure whatever is used is consistent
-  //   "single" : require single quotes
-  //   "double" : require double quotes
   "undef"         : true,     // true: Require all non-global variables to be declared (prevents global leaks)
   "unused"        : false,    // true: Require all defined variables be used
   "strict"        : false,    // true: Requires all functions run in ES5 Strict Mode

diff --git a/spa_ui/self_service/bower.json b/spa_ui/self_service/bower.json
@@ -22,6 +22,7 @@
     "angular-animate": "~1.4.6",
     "angular-base64": "~2.0.5",
     "angular-bootstrap": "~0.13.0",
+    "angular-gettext": "~2.2.0",
     "angular-messages": "~1.4.6",
     "angular-mocks": "~1.4.6",
     "angular-patternfly": "~2.3.2",

diff --git a/spa_ui/self_service/client/app/app.module.js b/spa_ui/self_service/client/app/app.module.js
@@ -1,21 +1,26 @@
 (function() {
   'use strict';
+
   angular.module('app', [
     'app.core',
     'app.config',
     'app.states',
     'ngProgress',
+    'gettext',
   ]);
+
   angular.module('app').controller('AppController', ['$rootScope', '$scope', 'ngProgressFactory',
     function($rootScope, $scope, ngProgressFactory) {
       $scope.progressbar = ngProgressFactory.createInstance();
       $scope.progressbar.setColor('#0088ce');
       $scope.progressbar.setHeight('3px');
+
       $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
         if (toState.resolve) {
           $scope.progressbar.start();
         }
       });
+
       $rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams) {
         if (toState.resolve) {
           $scope.progressbar.complete();

diff --git a/spa_ui/self_service/client/app/config/gettext.config.js b/spa_ui/self_service/client/app/config/gettext.config.js
@@ -0,0 +1,23 @@
+(function() {
+  'use strict';
+
+  angular.module('app')
+    .run(init);
+
+  /** @ngInject */
+  function init(gettextCatalog, gettext) {
+    // prepend [MISSING] to untranslated strings
+    gettextCatalog.debug = false;
+
+    gettextCatalog.loadAndSet = function(lang) {
+      gettextCatalog.setCurrentLanguage(lang);
+
+      if (lang) {
+        gettextCatalog.loadRemote("gettext/json/" + lang + ".json");
+      }
+    };
+
+    window.N_ = gettext;
+    window.__ = gettextCatalog.getString.bind(gettextCatalog);
+  }
+})();
diff --git a/spa_ui/self_service/client/app/services/dialog-field-refresh.service.spec.js b/spa_ui/self_service/client/app/services/dialog-field-refresh.service.spec.js
@@ -1,7 +1,7 @@
 /* jshint -W117, -W030 */
 describe('app.services.DialogFieldRefresh', function() {
   beforeEach(function() {
-    module('app.states', 'app.config', 'app.services', bard.fakeToastr);
+    module('app.states', 'app.config', 'app.services', 'gettext', bard.fakeToastr);
     bard.inject('CollectionsApi', 'Notifications', 'DialogFieldRefresh');
   });
 

diff --git a/spa_ui/self_service/client/app/services/session.service.js b/spa_ui/self_service/client/app/services/session.service.js
@@ -5,7 +5,7 @@
     .factory('Session', SessionFactory);
 
   /** @ngInject */
-  function SessionFactory($http, moment, $sessionStorage) {
+  function SessionFactory($http, moment, $sessionStorage, gettextCatalog) {
     var model = {
       token: null,
       user: {}
@@ -41,6 +41,9 @@
       return $http.get('/api')
         .then(function(response) {
           currentUser(response.data.identity);
+
+          var locale = response.data.settings && response.data.settings.locale;
+          gettextCatalog.loadAndSet(locale);
         });
     }
 

diff --git a/spa_ui/self_service/client/app/states/404/404.state.spec.js b/spa_ui/self_service/client/app/states/404/404.state.spec.js
@@ -1,7 +1,7 @@
 /* jshint -W117, -W030 */
 describe('404', function() {
   beforeEach(function() {
-    module('app.states', 'app.config');
+    module('app.states', 'app.config', 'gettext');
   });
 
   describe('route', function() {

diff --git a/spa_ui/self_service/client/app/states/dashboard/dashboard.state.spec.js b/spa_ui/self_service/client/app/states/dashboard/dashboard.state.spec.js
@@ -1,7 +1,7 @@
 /* jshint -W117, -W030 */
 describe('Dashboard', function() {
   beforeEach(function() {
-    module('app.states', 'app.config', bard.fakeToastr);
+    module('app.states', 'app.config', 'gettext', bard.fakeToastr);
     bard.inject('$location', '$rootScope', '$state', '$templateCache', 'Session', '$httpBackend', '$q');
   });
 

diff --git a/spa_ui/self_service/client/app/states/error/error.state.spec.js b/spa_ui/self_service/client/app/states/error/error.state.spec.js
@@ -1,7 +1,7 @@
 /* jshint -W117, -W030 */
 describe('error', function() {
   beforeEach(function() {
-    module('app.states', 'app.config');
+    module('app.states', 'app.config', 'gettext');
   });
 
   describe('route', function() {

diff --git a/spa_ui/self_service/client/app/states/marketplace/details/details.state.spec.js b/spa_ui/self_service/client/app/states/marketplace/details/details.state.spec.js
@@ -1,7 +1,7 @@
 /* jshint -W117, -W030 */
 describe('Marketplace.details', function() {
   beforeEach(function() {
-    module('app.states', 'app.config', bard.fakeToastr);
+    module('app.states', 'app.config', 'gettext', bard.fakeToastr);
   });
 
   describe('#resolveDialogs', function() {

diff --git a/spa_ui/self_service/client/app/states/requests/list/list.state.spec.js b/spa_ui/self_service/client/app/states/requests/list/list.state.spec.js
@@ -1,7 +1,7 @@
 /* jshint -W117, -W030 */
 describe('Dashboard', function() {
   beforeEach(function() {
-    module('app.states', 'app.config', bard.fakeToastr);
+    module('app.states', 'app.config', 'gettext', bard.fakeToastr);
     bard.inject('$location', '$rootScope', '$state', '$templateCache', 'Session');
   });
 

diff --git a/spa_ui/self_service/client/app/states/services/list/list.state.spec.js b/spa_ui/self_service/client/app/states/services/list/list.state.spec.js
@@ -1,7 +1,7 @@
 /* jshint -W117, -W030 */
 describe('Dashboard', function() {
   beforeEach(function() {
-    module('app.states', 'app.config', bard.fakeToastr);
+    module('app.states', 'app.config', 'gettext', bard.fakeToastr);
     bard.inject('$location', '$rootScope', '$state', '$templateCache', 'Session');
   });
 

diff --git a/spa_ui/self_service/client/index.html b/spa_ui/self_service/client/index.html
@@ -53,6 +53,7 @@
   <script src="/bower_components/angular-animate/angular-animate.js"></script>
   <script src="/bower_components/angular-base64/angular-base64.js"></script>
   <script src="/bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
+  <script src="/bower_components/angular-gettext/dist/angular-gettext.js"></script>
   <script src="/bower_components/angular-messages/angular-messages.js"></script>
   <script src="/bower_components/angular-mocks/angular-mocks.js"></script>
   <script src="/bower_components/angular-patternfly/dist/angular-patternfly.js"></script>
@@ -112,6 +113,7 @@
   <script src="/client/app/components/toasts/toasts.factory.js"></script>
   <script src="/client/app/config/api.config.js"></script>
   <script src="/client/app/config/authorization.config.js"></script>
+  <script src="/client/app/config/gettext.config.js"></script>
   <script src="/client/app/config/layouts.config.js"></script>
   <script src="/client/app/config/navigation.config.js"></script>
   <script src="/client/app/core/config.js"></script>

diff --git a/spa_ui/self_service/gulp/config.js b/spa_ui/self_service/gulp/config.js
@@ -382,6 +382,30 @@ module.exports = (function() {
     }
   };
 
+  var poDir = 'client/gettext/po/';
+
+  config.gettextExtract = {
+    inputs: ['client/**/*.js', 'client/**/*.html'],
+    potFile: 'manageiq-ssui.pot',
+    extractorOptions: {
+      markerNames: ['__', 'N_'],
+    },
+    outputDir: poDir,
+  };
+
+  config.gettextCompile = {
+    inputs: poDir + '**/*.po',
+    compilerOptions: {
+      format: 'json',
+    },
+    outputDir: 'client/gettext/json/',
+  };
+
+  config.gettextCopy = {
+    inputs: 'client/gettext/json/*.json',
+    outputDir: build + 'gettext/json/',
+  };
+
   // task bump: Revs the package and bower files
   config.bump = {
     packages: [

diff --git a/spa_ui/self_service/gulp/tasks/gettext-compile.js b/spa_ui/self_service/gulp/tasks/gettext-compile.js
@@ -0,0 +1,20 @@
+'use strict';
+
+var gettext = require('gulp-angular-gettext');
+var log = require('../utils/log');
+
+module.exports = function(gulp, options) {
+  var config = require('../config')[options.key || 'gettextCompile'];
+
+  return task;
+
+  function task() {
+    if (options.verbose) {
+      log('Compiling gettext translations (po -> json)');
+    }
+
+    return gulp.src(config.inputs)
+      .pipe(gettext.compile(config.compilerOptions))
+      .pipe(gulp.dest(config.outputDir));
+  }
+};
diff --git a/spa_ui/self_service/gulp/tasks/gettext-copy.js b/spa_ui/self_service/gulp/tasks/gettext-copy.js
@@ -0,0 +1,18 @@
+'use strict';
+
+var log = require('../utils/log');
+
+module.exports = function(gulp, options) {
+  var config = require('../config')[options.key || 'gettextCopy'];
+
+  return task;
+
+  function task() {
+    if (options.verbose) {
+      log('Copying gettext JSON files to build dir');
+    }
+
+    return gulp.src(config.inputs)
+      .pipe(gulp.dest(config.outputDir));
+  }
+};
diff --git a/spa_ui/self_service/gulp/tasks/gettext-extract.js b/spa_ui/self_service/gulp/tasks/gettext-extract.js
@@ -0,0 +1,20 @@
+'use strict';
+
+var gettext = require('gulp-angular-gettext');
+var log = require('../utils/log');
+
+module.exports = function(gulp, options) {
+  var config = require('../config')[options.key || 'gettextExtract'];
+
+  return task;
+
+  function task() {
+    if (options.verbose) {
+      log('Extracting gettext translations (* -> po)');
+    }
+
+    return gulp.src(config.inputs)
+      .pipe(gettext.extract(config.potFile, config.extractorOptions))
+      .pipe(gulp.dest(config.outputDir));
+  }
+};
diff --git a/spa_ui/self_service/gulpfile.js b/spa_ui/self_service/gulpfile.js
@@ -44,13 +44,16 @@ gulp.task('dev-fonts', task('fonts', {key: 'devFonts'}));
 gulp.task('dev-images', task('images', {key: 'devImages'}));
 gulp.task('dev-skin-images', ['dev-images'], task('images', {key: 'devSkinImages'}));
 gulp.task('dev-imgs', task('images', {key: 'devImgs'}));
+gulp.task('gettext-extract', task('gettext-extract'));
+gulp.task('gettext-compile', task('gettext-compile'));
+gulp.task('gettext-copy', task('gettext-copy'));
 
 /**
  * Build tasks
  */
 gulp.task('inject', ['wiredep', 'sass', 'templatecache'], task('inject'));
 gulp.task('optimize', ['inject'], task('optimize'));
-gulp.task('build', ['optimize', 'images', 'imgs', 'skin-images', 'fonts'], task('build'));
+gulp.task('build', ['optimize', 'images', 'imgs', 'skin-images', 'fonts', 'gettext-copy'], task('build'));
 gulp.task('build-specs', ['templatecache'], task('buildSpecs'));
 
 /**

diff --git a/spa_ui/self_service/package.json b/spa_ui/self_service/package.json
@@ -26,6 +26,7 @@
     "express-http-proxy": "^0.6.0",
     "glob": "^5.0.3",
     "gulp": "^3.8.11",
+    "gulp-angular-gettext": "^2.1.0",
     "gulp-angular-templatecache": "^1.5.0",
     "gulp-autoprefixer": "^3.0.1",
     "gulp-bump": "^0.3.0",