Add spot check for cards, use new Page paradigm

src/views/cards/cards.jsx

@@ -1,10 +1,10 @@
 var React = require('react');
 var injectIntl = require('react-intl').injectIntl;
 var FormattedMessage = require('react-intl').FormattedMessage;
-var FormattedHTMLMessage = require('react-intl').FormattedHTMLMessage;
 var render = require('../../lib/render.jsx');
 
 var Box = require('../../components/box/box.jsx');
+var Page = require('../../components/page/page.jsx');
 
 require('./cards.scss');
 
@@ -147,4 +147,4 @@ var Cards = injectIntl(React.createClass({
     }
 }));
 
-render(<Cards />, document.getElementById('view'));
+render(<Page><Cards /></Page>, document.getElementById('app'));

src/views/cards/l10n-static.json

@@ -5,4 +5,4 @@
     "cards.storyLink": "//scratch.mit.edu/scratchr2/static/pdfs/help/StoryCards.pdf",
     "cards.danceLink": "//scratch.mit.edu/scratchr2/static/pdfs/help/DanceCards.pdf",
     "cards.hideLink": "//scratch.mit.edu/scratchr2/static/pdfs/help/Hide-and-Seek-Cards.pdf"
-}
+}

src/views/cards/l10n.json

@@ -10,4 +10,4 @@
     "cards.story": "Animate a Story",
     "cards.dance": "Dance, Dance, Dance",
     "cards.hide": "Hide and Seek"
-}
+}

test/localization/spot_check_cards_has_strings.js

@@ -0,0 +1,36 @@
+/*
+ * spot check that each language has values for the string id keys on Cards page
+ * that are contained in English (i.e. make sure strings will show up, not ids")
+ */
+var merge = require('lodash.merge');
+var path = require('path');
+var tap = require('tap');
+
+var languages = require('../../languages.json');
+var localeCompare = require('../../bin/lib/locale-compare');
+
+tap.test('spotCheckAboutStrings', function (t) {
+    var isoCodes = Object.keys(languages);
+    isoCodes.splice(isoCodes.indexOf('en'), 1);
+    var viewLocales = {};
+    var idsWithICU = {};
+    var icuWithIds = {};
+    localeCompare.getIdsForView(
+        'cards',
+        path.resolve(__dirname, '../../src/views/cards/l10n.json'),
+        viewLocales,
+        idsWithICU,
+        icuWithIds
+    );
+    var md5WithIds = localeCompare.getMD5Map(icuWithIds);
+    var keysToCheck = Object.keys(merge(viewLocales['cards']['en'])).sort();
+    for (var i in isoCodes) {
+        var translations = localeCompare.getTranslationsForLanguage(isoCodes[i], idsWithICU, md5WithIds);
+        t.same(
+            Object.keys(translations['cards'][isoCodes[i]]).sort(),
+            keysToCheck,
+            'check Cards keys for language ' + isoCodes[i]
+        );
+    }
+    t.end();
+});