Merge pull request #617 from mozilla/issue-556-translate-noscript

fix(server) render index.html on the server for l10n.

grunttasks/build.js

@@ -11,6 +11,8 @@ module.exports = function (grunt) {
     'useminPrepare',
     'selectconfig:dist',
     'l10n-create-json',
+    // server templates are needed for requirejs to replace the require script
+    'copy:server_templates',
     'requirejs',
     'css',
     'concurrent:dist',

grunttasks/copy.js

@@ -6,6 +6,20 @@ module.exports = function (grunt) {
   'use strict';
 
   grunt.config('copy', {
+    server_templates: {
+      files: [{
+        // server side rendered templates. Copied so requirejs can
+        // replace the require script tag and embedded js/css
+        // links can be updated to use minified versions.
+        expand: true,
+        dot: true,
+        cwd: '<%= yeoman.page_template_src %>',
+        dest: '<%= yeoman.page_template_dist %>',
+        src: [
+          '*.html'
+        ]
+      }]
+    },
     dist: {
       files: [
         {
@@ -19,20 +33,12 @@ module.exports = function (grunt) {
             '.htaccess',
             'images/{,*/}*.{webp,gif}',
             'styles/fonts/{,*/}*.*',
-            'bower_components/{,*/}{,*/}*.*',
+            // only modernizr is left unbundled in main.js. It should be
+            // the only thing copied over.
+            'bower_components/modernizr/modernizr.js',
             'i18n/{,*/}{,*/}*.*',
             'sync/*.html'
           ]
-        }, {
-          // server side rendered templates. Copied so embedded js/css
-          // links can be updated to use minified versions.
-          expand: true,
-          dot: true,
-          cwd: '<%= yeoman.page_template_src %>',
-          dest: '<%= yeoman.page_template_dist %>',
-          src: [
-            '*.html'
-          ]
         }
       ]
     },

grunttasks/requirejs.js

@@ -9,9 +9,18 @@ module.exports = function (grunt) {
     dist: {
       // Options: https://github.com/jrburke/r.js/blob/master/build/example.build.js
       options: {
-        // `name` and `out` are set by grunt-usemin
+        almond: true,
+        replaceRequireScript: [{
+          files: ['<%= yeoman.page_template_dist %>/index.html'],
+          module: 'main',
+          modulePath: '/scripts/main'
+        }],
         baseUrl: '<%= yeoman.app %>/scripts',
         optimize: 'none',
+        name: 'main',
+        out: '<%= yeoman.tmp %>/scripts/main.js',
+        mainConfigFile: '<%= yeoman.app %>/scripts/main.js',
+        keepBuildDir: true,
         // TODO: (Issue #560) Figure out how to make sourcemaps work with grunt-usemin
         // https://github.com/yeoman/grunt-usemin/issues/30
         //generateSourceMaps: true,

grunttasks/uglify.js

@@ -14,8 +14,8 @@ module.exports = function (grunt) {
     dist: {
       files: [{
         expand: true,
-        cwd: '<%= yeoman.dist %>/scripts',
-        src: '**/*.js',
+        cwd: '<%= yeoman.tmp %>/scripts',
+        src: ['**/*.js'],
         dest: '<%= yeoman.dist %>/scripts'
       }]
     }

grunttasks/usemin.js

@@ -6,13 +6,26 @@ module.exports = function (grunt) {
   'use strict';
 
   grunt.config('useminPrepare', {
-    options: {
-      dest: '<%= yeoman.dist %>'
+    client_rendered: {
+      dest: '<%= yeoman.dist %>',
+      src: [
+        '<%= yeoman.app %>/{,*/}*.html',
+        '!<%= yeoman.app %>/tests/{,*/}*.html'
+      ],
+      type: 'html'
     },
-    html: [
-      '<%= yeoman.app %>/index.html',
-      '<%= yeoman.app %>/sync/*.html'
-    ]
+    server_rendered: {
+      options: {
+        // root must be specified or else useminPrepare uses the template
+        // directory as the root from where to search for assets.
+        root: '<%= yeoman.app %>',
+        type: 'html'
+      },
+      dest: '<%= yeoman.dist %>',
+      src: [
+        '<%= yeoman.page_template_src %>/{,*/}*.html'
+      ],
+    }
   });
 
   grunt.config('usemin', {

lockdown.json

@@ -563,7 +563,7 @@
     "0.8.0": "6bd52325dcce1d995dbbf648030c59e1a606acda"
   },
   "grunt-contrib-uglify": {
-    "0.2.0": "feca69e0fb53cb4088068089df3d3b119c56fc72"
+    "0.3.2": "865b00ae0d11d1f5fafca3967c9b099f8929684b"
   },
   "grunt-contrib-watch": {
     "0.5.2": "9bb73392aeeda093792cd82d67675b0a84b51adf"
@@ -615,7 +615,7 @@
     "0.1.2": "fce3afaedb8a944edbd6dce5667cc6b9fc30313d"
   },
   "grunt-usemin": {
-    "0.1.10": "70a2591ea34a56368bac4490a61c5ce65fc176cf"
+    "2.0.2": "35a7786581ad4454c98706fb044ea92c952f1a9b"
   },
   "grunt-z-schema": {
     "0.1.0": "4fd3f205ce684cd7baa6964ecbcc004b60ee9804"
@@ -1281,7 +1281,11 @@
     "1.2.6": "d354b2d3c1cf10ebc18fa78c11a28bdd9ce1580d",
     "1.3.3": "ddd3e98aa27f5f47e589cfb3f95cddba26096190",
     "2.2.5": "a6e02a70d839792b9780488b7b8b184c095c99c7",
-    "2.3.6": "fa0984770b428b7a9b2a8058f46355d14fef211a"
+    "2.3.6": "fa0984770b428b7a9b2a8058f46355d14fef211a",
+    "2.4.12": "2354d9659f85330c1e3e2910f8acd77fe14bb4a8"
+  },
+  "uglify-to-browserify": {
+    "1.0.2": "6e0924d6bda6b5afe349e39a6d632850a0f882b7"
   },
   "uid2": {
     "0.0.2": "107fb155c82c1136620797ed4c88cf2b08f6aab8"

package.json

@@ -46,7 +46,7 @@
     "grunt-contrib-htmlmin": "0.1.3",
     "grunt-contrib-imagemin": "0.5.0",
     "grunt-contrib-jshint": "0.8.0",
-    "grunt-contrib-uglify": "0.2.0",
+    "grunt-contrib-uglify": "0.3.2",
     "grunt-contrib-watch": "0.5.2",
     "grunt-conventional-changelog": "1.1.0",
     "grunt-copyright": "0.1.0",
@@ -61,7 +61,7 @@
     "grunt-sass": "0.11.0",
     "grunt-svgmin": "0.2.0",
     "grunt-todo": "0.1.2",
-    "grunt-usemin": "0.1.10",
+    "grunt-usemin": "2.0.2",
     "grunt-z-schema": "0.1.0",
     "handlebars": "1.3.0",
     "helmet": "0.1.2",

server/lib/routes.js

@@ -67,7 +67,6 @@ module.exports = function (fxAccountUrl, templates) {
     // an array is used instead of a regexp simply because the regexp
     // became too long. One route is created for each item.
     var FRONTEND_ROUTES = [
-      '/',
       '/signin',
       '/signin_complete',
       '/signup',
@@ -94,6 +93,11 @@ module.exports = function (fxAccountUrl, templates) {
         next();
       });
     });
+
+
+    app.get('/', function(req, res) {
+      res.render('index');
+    });
   };
 
 };

server/templates/pages/src/index.html

@@ -6,7 +6,7 @@
     <head>
         <meta charset="utf-8">
         <meta http-equiv="X-UA-Compatible" content="IE=edge">
-        <title>Firefox Accounts</title>
+        <title>{{#t}}Firefox Accounts{{/t}}</title>
         <meta name="description" content="">
         <meta name="viewport" content="width=device-width">
         <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
@@ -25,15 +25,17 @@
         <![endif]-->
         <div id="stage">
           <!-- this will be overwritten if JS is enabled -->
-          <!-- TODO - (Issue #556) this needs to be translated on the server -->
           <noscript>
-            Firefox Accounts requires JavaScript.
+            {{#t}}Firefox Accounts requires JavaScript.{{/t}}
           </noscript>
 
         </div>
 
-        <!-- build:js /scripts/main.js -->
+        <!-- no build declaration, main.js build
+             is done by requirejs and not concat.
+             rev/usemin will still replace the URL
+             with a cache aware URL.
+         -->
         <script data-main="/scripts/main" src="/bower_components/requirejs/require.js"></script>
-        <!-- endbuild -->
     </body>
 </html>