Amire80 has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/212287

Change subject: Set direction and language attributes on the title input fields
......................................................................

Set direction and language attributes on the title input fields

The placeholder alignment trick is based on
http://stackoverflow.com/questions/6729837/text-align-right-only-for-placeholder

Change-Id: I9f1c013ce6f26ed314cb13e7fc900dcb243d48f6
---
M modules/source/ext.cx.source.selector.js
M modules/source/styles/ext.cx.source.selector.less
2 files changed, 39 insertions(+), 10 deletions(-)


  git pull 
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/ContentTranslation 
refs/changes/87/212287/1

diff --git a/modules/source/ext.cx.source.selector.js 
b/modules/source/ext.cx.source.selector.js
index 8c0f3e9..b65f3e2 100644
--- a/modules/source/ext.cx.source.selector.js
+++ b/modules/source/ext.cx.source.selector.js
@@ -163,13 +163,32 @@
         * @param {string} localStorageItem The localStorage item name that 
will be set to the language
         *     if localStorage is available.
         */
-       CXSourceSelector.prototype.setLanguage = function ( language, $element, 
localStorageItem ) {
-               $element
-                       .prop( {
-                               lang: language,
-                               dir: $.uls.data.getDir( language )
-                       } )
+       CXSourceSelector.prototype.setLanguage = function ( language, direction 
) {
+               var $trigger, $input, localStorageItem, langProps;
+
+               switch ( direction ) {
+                       case 'source':
+                               $trigger = this.$sourceLanguage;
+                               $input = this.$sourceTitleInput;
+                               localStorageItem = 'cxSourceLanguage';
+                               break;
+                       case 'target':
+                               $trigger = this.$targetLanguage;
+                               $input = this.$targetTitleInput;
+                               localStorageItem = 'cxTargetLanguage';
+                               break;
+               }
+
+               langProps = {
+                       lang: language,
+                       dir: $.uls.data.getDir( language )
+               };
+
+               $trigger
+                       .prop( langProps )
                        .text( $.uls.data.getAutonym( language ) );
+
+               $input.prop( langProps );
 
                if ( window.localStorage ) {
                        localStorage.setItem( localStorageItem, language );
@@ -195,7 +214,7 @@
                        this.setTargetLanguage( this.getSourceLanguage() );
                }
 
-               this.setLanguage( language, this.$sourceLanguage, 
'cxSourceLanguage' );
+               this.setLanguage( language, 'source' );
 
                this.fillTargetLanguages();
        };
@@ -213,7 +232,7 @@
         * @param {string} language A language code
         */
        CXSourceSelector.prototype.setTargetLanguage = function ( language ) {
-               this.setLanguage( language, this.$targetLanguage, 
'cxTargetLanguage' );
+               this.setLanguage( language, 'target' );
        };
 
        /**
@@ -838,8 +857,6 @@
                        .addClass( 'cx-sourceselector-dialog__language' )
                        .append( this.$targetLanguage );
 
-               this.setDefaultLanguages();
-
                this.$sourceTitleInput = $( '<input>' )
                        .attr( {
                                name: 'sourceTitle',
@@ -880,6 +897,8 @@
                                $targetTitleInputContainer
                        );
 
+               this.setDefaultLanguages();
+
                this.$messageBar = $( '<div>' )
                        .addClass( 'cx-sourceselector-dialog__messagebar' );
                $messageText = $( '<span>' )
diff --git a/modules/source/styles/ext.cx.source.selector.less 
b/modules/source/styles/ext.cx.source.selector.less
index 987081c..4a6e57e 100644
--- a/modules/source/styles/ext.cx.source.selector.less
+++ b/modules/source/styles/ext.cx.source.selector.less
@@ -101,6 +101,16 @@
                        background-size: 20px;
                        padding: 2px 2px 2px 30px;
                }
+
+               // Make sure that the placeholder has a consistent alignment,
+               // so it won't be in opposite ends when the languages' 
direction is different
+               &::-moz-placeholder {
+                       text-align: left;
+               }
+
+               &::-webkit-input-placeholder {
+                       text-align: left;
+               }
        }
 }
 

-- 
To view, visit https://gerrit.wikimedia.org/r/212287
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: I9f1c013ce6f26ed314cb13e7fc900dcb243d48f6
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/ContentTranslation
Gerrit-Branch: master
Gerrit-Owner: Amire80 <amir.ahar...@mail.huji.ac.il>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to