Merge pull request #63 from jostw/josyeh/Marketplace/master/Bug1260093

Bug 1260093 - [TV][2.5] Legal documents should be independent from the UI strings

config.js

@@ -43,7 +43,7 @@ var localConfig = extend(true, {
         },
         'dev': {
             domain: 'https://marketplace-dev.allizom.org',
-            media_url: 'https://marketplace-dev.mozflare.net/media/',
+            media_url: 'https://marketplace-dev.allizom.org/media/',
             name: 'Dev',
             origin: 'app://marketplace-dev.allizom.org'
         },

locale/en_US/LC_MESSAGES/messages.po

@@ -1,15 +1,21 @@
-#: /media/js/views/homepage.js
-msgid "Add to Apps"
-msgstr "Add to Apps"
-
 #: /media/js/views/homepage.js
 msgid "Homepage"
 msgstr "Homepage"
 
+#: /media/js/views/app_context_menu.js
+#: /templates/tutorial.html
+msgid "Add to Apps"
+msgstr "Add to Apps"
+
 #: /media/js/views/tutorial.js
 msgid "Tutorial"
 msgstr "Tutorial"
 
+#: /media/js/views/privacy.js
+#: /templates/_includes/footer.html
+msgid "Privacy Notice"
+msgstr "Privacy Notice"
+
 #: /media/js/views/offline.js
 msgid "Offline"
 msgstr "Offline"
@@ -22,14 +28,14 @@ msgstr "Suggested"
 msgid "by {author}"
 msgstr "by {author}"
 
+#: /templates/_includes/footer.html
+msgid "Powered by Mozilla"
+msgstr "Powered by Mozilla"
+
 #: /templates/homepage.html
 msgid "URL"
 msgstr "URL"
 
-#: /templates/footer.html
-msgid "Powered by Mozilla"
-msgstr "Powered by Mozilla"
-
 #: /templates/tutorial.html
 msgid "Learn how to use"
 msgstr "Learn how to use"
@@ -46,14 +52,6 @@ msgstr "Press <b>OPTION</b> to add an app to the Apps folder"
 msgid "Press <b>APPS</b> to see apps added to the Apps folder"
 msgstr "Press <b>APPS</b> to see apps added to the Apps folder"
 
-#: /templates/tutorial.html
-msgid "Add to Apps"
-msgstr "Add to Apps"
-
-#: /templates/tutorial.html
-msgid "Apps"
-msgstr "Apps"
-
 #: /templates/tutorial.html
 msgid "Next"
 msgstr "Next"
@@ -66,38 +64,14 @@ msgstr "Back"
 msgid "Done"
 msgstr "Done"
 
+#: /templates/privacy.html
+msgid "OK"
+msgstr "OK"
+
 #: /templates/offline.html
 msgid "Unable to Connect"
 msgstr "Unable to Connect"
 
 #: /templates/offline.html
 msgid "A network error occurred while trying to reach the site."
 msgstr "A network error occurred while trying to reach the site."
-
-#: /templates/privacy.html
-msgid "Privacy Notice"
-msgstr "Privacy Notice"
-
-#: /templates/privacy.html
-msgid "Privacy Notice Summary"
-msgstr "Privacy Notice Summary"
-
-#: /templates/privacy.html
-msgid "This notice is a summary of our privacy practices. To learn more about the information we collect from users and how we handle that information please read our <a href=\"{privacy_url}\" target=\"_blank\">Mozilla Website Privacy Notice</a> and <a href=\"{terms_url}\" target=\"_blank\">Terms of Use</a>."
-msgstr "This notice is a summary of our privacy practices. To learn more about the information we collect from users and how we handle that information please read our <a href=\"{privacy_url}\" target=\"_blank\">Mozilla Website Privacy Notice</a> and <a href=\"{terms_url}\" target=\"_blank\">Terms of Use</a>."
-
-#: /templates/privacy.html
-msgid "Unless indicated otherwise, the Web Apps on the Web Apps Discovery Portal are not made by us and you should check their privacy policies before using them."
-msgstr "Unless indicated otherwise, the Web Apps on the Web Apps Discovery Portal are not made by us and you should check their privacy policies before using them."
-
-#: /templates/privacy.html
-msgid "The Web Apps Discovery Portal uses cookies and other web technologies to help us understand how users use the service through aggregate analytics."
-msgstr "The Web Apps Discovery Portal uses cookies and other web technologies to help us understand how users use the service through aggregate analytics."
-
-#: /templates/privacy.html
-msgid "For more information on how to report claims of copyright or trademark infringement, please see: https://www.mozilla.org/about/legal/report-infringement/."
-msgstr "For more information on how to report claims of copyright or trademark infringement, please see: https://www.mozilla.org/about/legal/report-infringement/."
-
-#: /templates/privacy.html
-msgid "OK"
-msgstr "OK"

src/dev.html

@@ -17,10 +17,11 @@
       <link rel="stylesheet" href="/media/css/app-preview.styl.css">
       <link rel="stylesheet" href="/media/css/app-list.styl.css">
       <link rel="stylesheet" href="/media/css/smart-button.styl.css">
+      <link rel="stylesheet" href="/media/css/spinner.styl.css">
       <link rel="stylesheet" href="/media/css/footer.styl.css">
       <link rel="stylesheet" href="/media/css/tutorial.styl.css">
-      <link rel="stylesheet" href="/media/css/offline.styl.css">
       <link rel="stylesheet" href="/media/css/privacy.styl.css">
+      <link rel="stylesheet" href="/media/css/offline.styl.css">
     {% endif %}
   </head>
 

src/media/css/app-list.styl

@@ -46,6 +46,7 @@
 
         &.focused {
             transform: scale(1.2);
+            cursor: pointer;
         }
 
         &.pressed {

src/media/css/app-preview.styl

@@ -124,7 +124,7 @@ $app-preview-background-color = #72C9B0;
     }
 
     .description {
-        height: 19rem;
+        height: 3.1rem * 6;
         overflow: hidden;
 
         font-size: 2.6rem;

src/media/css/privacy.styl

@@ -42,7 +42,7 @@ $privacy-scrollbar-color = #CACCCE;
         cubic-bezier-transition();
     }
 
-    .title {
+    h3 {
         margin: 0 0 7rem;
 
         font-family: $light-italic-font-family;
@@ -51,12 +51,12 @@ $privacy-scrollbar-color = #CACCCE;
         text-align: center;
     }
 
-    .statement {
+    ul {
         font-size: 2.6rem;
         line-height: 3.6rem;
     }
 
-    .item {
+    li {
         margin-bottom: 3.6rem;
 
         list-style: none;

src/media/css/spinner.styl

@@ -0,0 +1,29 @@
+/**
+ * Spinner styles.
+ */
+
+@import 'lib';
+
+@keyframes spinner {
+    0%{
+        background-position: 0 0;
+    }
+
+    100%{
+        background-position: -6600px 0;
+    }
+}
+
+.spinner {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+
+    width: 200px;
+    height: 200px;
+    margin: -100px 0 0 -100px;
+
+    background-image: url('../img/spinner_sprite.png');
+
+    animation: spinner 1.133s steps(33) infinite;
+}

src/media/css/tutorial.styl

@@ -4,16 +4,6 @@
 
 @import 'lib';
 
-@keyframes spinner {
-    0%{
-        background-position: 0 0;
-    }
-
-    100%{
-        background-position: -6600px 0;
-    }
-}
-
 .slide-container {
     position: fixed;
     top: 0;
@@ -52,20 +42,6 @@
     }
 }
 
-.slide-spinner {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-
-    width: 200px;
-    height: 200px;
-    margin: -100px 0 0 -100px;
-
-    background-image: url('../img/spinner_sprite.png');
-
-    animation: spinner 1.133s steps(33) infinite;
-}
-
 .slide-section-top,
 .slide-section-bottom {
     position: absolute;

src/media/js/image_helper.js

@@ -1,36 +1,31 @@
 define('image_helper', ['core/defer'], function(defer) {
     function findLargestIcon(icons) {
-        var iconSizes = Object.keys(icons);
-        var maxIconSize = iconSizes.reduce(function(prev, current) {
-            return parseInt(prev, 10) < parseInt(current, 10) ? current : prev;
-        });
-
-        return icons[maxIconSize];
+        return icons[Math.max.apply(null, Object.keys(icons))];
     }
 
     function getIconURL(icon) {
         // The path of icon is different from server.
+        var path = '/img/' + icon;
 
         // On marketplace server:
         // `media/marketplace-tv-front-end/img/{icon}.png`
-        var path = ['media', 'marketplace-tv-front-end', 'img', icon];
+        if (location.origin.match(/marketplace/)) {
+            path = 'media/marketplace-tv-front-end' + path;
+        }
 
         // On github page:
-        // `marketplace-tv-front-end/media/img/{icon}.png`
-        if (!location.origin.match(/marketplace/)) {
-            var tempPath = path[0];
-
-            path[0] = path[1];
-            path[1] = tempPath;
+        // `/marketplace-tv-front-end/media/img/{icon}.png`
+        if (location.origin.match(/github/)) {
+            path = '/marketplace-tv-front-end/media' + path;
         }
 
         // On local server:
         // `/media/img/{icon}.png`
         if (location.origin.match(/localhost/)) {
-            path[0] = '';
+            path = '/media' + path;
         }
 
-        return path.join('/');
+        return path;
     }
 
     function getBackgroundImageURL($element) {

src/media/js/routes.js

@@ -6,8 +6,8 @@ define('routes',
         {pattern: '^/$', view_name: 'homepage'},
         {pattern: '^/index.html$', view_name: 'homepage'},
         {pattern: '^/tv/tutorial/?$', view_name: 'tutorial'},
-        {pattern: '^/tv/offline/?$', view_name: 'offline'},
         {pattern: '^/tv/privacy/?$', view_name: 'privacy'},
+        {pattern: '^/tv/offline/?$', view_name: 'offline'},
         {pattern: '^/tv/?$', view_name: 'homepage'}
     ]);
 

src/media/js/views/homepage.js

@@ -70,13 +70,11 @@ define('views/homepage',
     });
 
     z.page.on('mouseover', '.app-button', function() {
-        scrollToApp.call(this, function() {
-            this.focus();
-        });
+        scrollToApp.call(this, this.focus);
     });
 
     z.page.on('sn:willfocus', '.app-button', function(e) {
-        if (e.originalEvent.detail.previousElement) {
+        if (e.originalEvent.detail.hasOwnProperty('previousElement')) {
             SpatialNavigation.pause();
 
             scrollToApp.call(this, function() {

src/media/js/views/tutorial.js

@@ -5,18 +5,18 @@ define('views/tutorial',
              keyHelper, imageHelper, smartButton, SpatialNavigation) {
     var gettext = l10n.gettext;
 
-    var $slideSpinner;
+    var $spinner;
 
     // Ensure background image is loaded.
     function loadBackgroundImage($slide, callback) {
         var imagePromise = imageHelper.loadImage(
             imageHelper.getBackgroundImageURL($slide.find('.slide-image'))
         );
 
-        $slideSpinner.removeClass('hidden');
+        $spinner.removeClass('hidden');
 
         imagePromise.done(function() {
-            $slideSpinner.addClass('hidden');
+            $spinner.addClass('hidden');
             $slide.removeClass('invisible');
 
             callback();
@@ -31,7 +31,7 @@ define('views/tutorial',
 
     z.page.on('loaded reloaded_chrome', function() {
         if (z.page.find('.slide-container').length) {
-            $slideSpinner = z.page.find('.slide-spinner');
+            $spinner = z.page.find('.spinner');
 
             loadBackgroundImage(z.page.find('.invisible'), function() {
                 SpatialNavigation.startFocus();

src/templates/docs/privacy/en-US.html

@@ -0,0 +1,8 @@
+<h3>Privacy Notice Summary</h3>
+
+<ul>
+  <li>This notice is a summary of our privacy practices. To learn more about the information we collect from users and how we handle that information please read our <a href="https://www.mozilla.org/en-US/privacy/websites/" target="_blank">Mozilla Website Privacy Notice</a> and <a href="https://www.mozilla.org/en-US/about/legal/terms/mozilla/" target="_blank">Terms of Use</a>.</li>
+  <li>Unless indicated otherwise, the Web Apps on the Web Apps Discovery Portal are not made by us and you should check their privacy policies before using them.</li>
+  <li>The Web Apps Discovery Portal uses cookies and other web technologies to help us understand how users use the service through aggregate analytics.</li>
+  <li>For more information on how to report claims of copyright or trademark infringement, please see: https://www.mozilla.org/about/legal/report-infringement/.</li>
+</ul>

src/templates/privacy.html

@@ -2,16 +2,7 @@
   <div class="privacy-window">
     <div class="privacy-content">
       <div class="scrollable">
-        <h1 class="title">{{ _('Privacy Notice Summary') }}</h1>
-
-        <ul class="statement">
-          <li class="item">{{ _('This notice is a summary of our privacy practices. To learn more about the information we collect from users and how we handle that information please read our <a href="{privacy_url}" target="_blank">Mozilla Website Privacy Notice</a> and <a href="{terms_url}" target="_blank">Terms of Use</a>.')
-                              |format(privacy_url='https://www.mozilla.org/en-US/privacy/websites/',
-                                      terms_url='https://www.mozilla.org/en-US/about/legal/terms/mozilla/') }}</li>
-          <li class="item">{{ _('Unless indicated otherwise, the Web Apps on the Web Apps Discovery Portal are not made by us and you should check their privacy policies before using them.') }}</li>
-          <li class="item">{{ _('The Web Apps Discovery Portal uses cookies and other web technologies to help us understand how users use the service through aggregate analytics.') }}</li>
-          <li class="item">{{ _('For more information on how to report claims of copyright or trademark infringement, please see: https://www.mozilla.org/about/legal/report-infringement/.') }}</li>
-        </ul>
+        {% include "docs/privacy/" + language + ".html" %}
       </div>
 
       <div class="scrollbar hidden">

src/templates/tutorial.html

@@ -43,5 +43,5 @@
     </div>
   {% endfor %}
 
-  <span class="slide-spinner hidden"></span>
+  <span class="spinner hidden"></span>
 </div>