Merge pull request #2132 from jpetto/bug-1031046-fxos-devices-zte-open2

Add ZTE Open II to FxOS devices page. Bug 1031046.

bedrock/firefox/templates/firefox/os/devices.html

@@ -213,7 +213,7 @@
                   <tr>
                     <th>{{ _('Screen') }}</th>
                     <td>
-                      {{ _('3.5” HVGA 320 x 480 pixels, 262K color display') }}
+                      {{ _('3.5" HVGA 320 x 480 pixels, 262K color display') }}
                       <br>
                       {{ _('TFT capacitive touch') }}
                     </td>
@@ -379,7 +379,7 @@
                   <tr>
                     <th>{{ _('Screen') }}</th>
                     <td>
-                      {{ _('4.0” 320 x 480 pixels (~144 ppi pixel density)') }}
+                      {{ _('4.0" 320 x 480 pixels (~144 ppi pixel density)') }}
                       <br>
                       {{ _('TFT capacitive touch') }}
                     </td>
@@ -569,7 +569,7 @@
                   <tr>
                     <th>{{ _('Screen') }}</th>
                     <td>
-                      {{ _('3.5” HVGA 320 x 480 pixels, 262K color display') }}
+                      {{ _('3.5" HVGA 320 x 480 pixels, 262K color display') }}
                       <br>
                       {{ _('TFT capacitive touch') }}
                     </td>
@@ -762,7 +762,7 @@
                   <tr>
                     <th>{{ _('Screen') }}</th>
                     <td>
-                      {{ _('4.0” WVGA 800 x 480 pixels') }}
+                      {{ _('4.0" WVGA 800 x 480 pixels') }}
                     </td>
                   </tr>
                   <tr>
@@ -941,7 +941,7 @@
                   <tr>
                     <th>{{ _('Screen') }}</th>
                     <td>
-                      {{ _('4.0” WVGA 800 x 400 pixels') }}
+                      {{ _('4.0" WVGA 800 x 400 pixels') }}
                     </td>
                   </tr>
                   <tr>
@@ -991,6 +991,127 @@
           </div><!--/.container-->
         </section><!--/#zte_openc-->
       </div><!--/.device-detail-list-->
+
+      <div class="container device-list">
+        <ul class="device-thumbnails">
+          <li>
+            <a href="#zte_open2" class="device-thumbnail device-coming-soon">
+              <img src="{{ media('/img/firefox/os/devices/smartphones/zte-open2-thumb.png') }}" alt="">
+              <span class="device-name">{{ _('ZTE Open II') }}</span>
+              <div class="availability-notice">
+                <span class="is-available">{{ _('Available') }}</span>
+              </div>
+            </a>
+          </li>
+        </ul>
+      </div>
+
+      <div class="device-detail-list smartphone-detail-list">
+        <section class="device-detail smartphone-detail" id="zte_open2">
+          <div id="zte_open2-pager" class="container pager pager-with-tabs pager-no-history">
+            <header class="device-detail-header">
+              <h3 class="device-title">{{ _('ZTE Open II') }}</h3>
+
+              <ul class="pager-tabs">
+                <li><a href="#p1" data-label="Features">{{_('Features')}}</a></li>
+                <li><a href="#p2" data-label="Specifications">{{_('Specifications')}}</a></li>
+              </ul>
+
+              <button class="device-detail-close">{{ _('Close') }}</button>
+            </header>
+
+            <div class="pager-content">
+              <div class="device-details features pager-page default-page" id="zte_open2-features">
+                <div class="feature-group logo-colors">
+                </div>
+
+                <div class="feature-group image">
+                  <img src="{{ media('/img/firefox/os/devices/smartphones/zte-open2.png') }}" alt="{{ _('ZTE Open II') }}">
+                </div>
+
+                <div class="feature-group stats">
+                  <ul>
+                    <li class="stat-screen">
+                      <strong>{{ _('3.5" HVGA') }}</strong>
+                      {{ _('320 x 480 pixels') }}
+                    </li>
+                    <li class="stat-camera">
+                      <strong>{{ _('2.0 MP') }}</strong>
+                      {{ _('Rear camera') }}
+                    </li>
+                    <li class="stat-storage">
+                      <strong>{{ _('2 GB') }}</strong>
+                      {{ _('Internal memory') }} *
+                    </li>
+                  </ul>
+
+                  <small>* {{ memory_disclaimer }}</small>
+                </div>
+
+                <div class="feature-group availability">
+                  <h5>{{ _('Available in') }}</h5>
+
+                  <ul class="comma-list">
+                    <li>{{ _('Peru') }}</li>
+                  </ul>
+
+                  <h5>{{ _('Operator') }}</h5>
+                  <ul class="comma-list">
+                    <li>{{ _('Movistar') }}</li>
+                  </ul>
+                </div>
+              </div><!--/.features-->
+              <div class="device-details specifications pager-page" id="zte_open2-specifications">
+                <h4 class="device-details-title">{{ _('Specifications') }}</h4>
+
+                <table>
+                  <tr>
+                    <th>{{ _('Screen') }}</th>
+                    <td>
+                      {{ _('3.5" HVGA 320 x 480 pixels') }}
+                    </td>
+                  </tr>
+                  <tr>
+                    <th>{{ _('Camera') }}</th>
+                    <td>
+                      {{ _('2.0 MP') }}
+                    </td>
+                  </tr>
+                  <tr>
+                    <th>{{ _('Processor') }}</th>
+                    <td>
+                      {{ _('MSM8210 dual core 1.2 GHz') }}
+                    </td>
+                  </tr>
+                  <tr>
+                    <th>{{ _('Memory') }}</th>
+                    <td>
+                      <dl>
+                        <dt>{{ _('ROM') }} *</dt>
+                        <dd>{{ _('2 GB') }}</dd>
+
+                        <dt>{{ _('RAM') }}</dt>
+                        <dd>{{ _('256 MB') }}</dd>
+                      </dl>
+
+                      <small>* {{ memory_disclaimer }}</small>
+                    </td>
+                  </tr>
+                  <tr>
+                    <th>{{ _('Battery') }}</th>
+                    <td>
+                      <dl>
+                        <dt>{{ _('Capacity') }}</dt>
+                        <dd>{{ _('1150 mAh') }}</dd>
+                      </dl>
+                    </td>
+                  </tr>
+                </table>
+              </div><!--/.specifications-->
+            </div><!--/.pager-content-->
+          </div><!--/.container-->
+        </section><!--/#zte_open2-->
+      </div><!--/.device-detail-list-->
     </section><!--/#smartphones-->
     <div class="container">
       <aside id="fxos-links">

media/css/firefox/os/devices.less

@@ -839,7 +839,11 @@ html, body {
             width: auto;
             padding-left: 0;
             margin-right: 0;
-            .clearfix;
+            margin-bottom: @baseLine;
+
+            ul {
+                .clearfix;
+            }
 
             li {
                 float: left;

media/js/firefox/os/devices.js

@@ -229,7 +229,16 @@ if (typeof Mozilla === 'undefined') {
 
     // display specific device if in URL hash
     if (window.location.hash !== '') {
-        $('.device-thumbnail[href="' + window.location.hash + '"]').trigger('click');
+        setTimeout(function() {
+            var $deviceThumb = $('.device-thumbnail[href="' + window.location.hash + '"]');
+
+            if ($deviceThumb.length) {
+                $deviceThumb.trigger('click');
+                $('html, body').animate({
+                    scrollTop: $deviceThumb.offset().top
+                }, 600);
+            }
+        }, 500);
     }
 
     // GA specific interactions

media/js/firefox/os/partner_data.js

@@ -241,6 +241,11 @@ if (typeof Mozilla == 'undefined') {
             'type': 'smartphone',
             'display': 'ZTE Open C',
             'countries': ['de', 'ru', 'gb', 'us', 'uy']
+        },
+        'zte_open2': {
+            'type': 'smartphone',
+            'display': 'ZTE Open II',
+            'countries': ['pe']
         }
     };
 })(window.jQuery);