ChromeOS Gaia: Fixed slide-from-right transitions for rtl languages.

BUG=479091

Review URL: https://codereview.chromium.org/1113553002

Cr-Commit-Position: refs/heads/master@{#327488}

chrome/browser/resources/chromeos/login/offline_gaia.html

@@ -41,8 +41,9 @@
         on-tap="{{onBack}}">
     </gaia-core-icon-button>
     <core-animated-pages id="animatedPages" transitions="slide-from-right"
+        valueattr="id"
         on-core-animated-pages-transition-end="{{onTransitionEnd}}" flex>
-      <section flex>
+      <section flex id="emailSection">
         <gaia-card>
           <div class="header" flex vertical layout end-justified start>
             <h1 class="welcome-message" i18n-content="offlineLoginWelcome"></h1>
@@ -62,7 +63,7 @@
           </div>
         </gaia-card>
       </section>
-      <section flex>
+      <section flex id="passwordSection">
         <gaia-card>
           <gaia-header class="header" id="passwordHeader">
           </gaia-header>

chrome/browser/resources/chromeos/login/offline_gaia.js

@@ -12,7 +12,7 @@ Polymer('offline-gaia', (function() {
     },
 
     focus: function() {
-      if (this.$.animatedPages.selected == 0)
+      if (this.$.animatedPages.selected == 'emailSection')
         this.$.emailInput.focus();
       else
         this.$.passwordInput.focus();
@@ -61,6 +61,11 @@ Polymer('offline-gaia', (function() {
     },
 
     setEmail: function(email) {
+      // Reorder elements for proper animation for rtl languages.
+      if (document.querySelector('html[dir=rtl]')) {
+        this.$.emailSection.parentNode.insertBefore(this.$.passwordSection,
+                                                    this.$.emailSection);
+      }
       if (email) {
         if (this.emailDomain)
           email = email.replace(this.emailDomain, '');
@@ -81,7 +86,7 @@ Polymer('offline-gaia', (function() {
       this.$.passwordInput.setValid(true);
       this.$.emailInput.setValid(true);
       this.$.backButton.hidden = true;
-      this.$.animatedPages.selected = 0;
+      this.$.animatedPages.selected = 'emailSection';
     },
 
     switchToPasswordCard(email) {
@@ -94,7 +99,7 @@ Polymer('offline-gaia', (function() {
       }
       this.$.passwordHeader.email = email;
       this.$.backButton.hidden = false;
-      this.$.animatedPages.selected = 1;
+      this.$.animatedPages.selected = 'passwordSection';
     }
   };
 })());