From 1e938162dbd35b0882e0e4ed690755c22206acdc Mon Sep 17 00:00:00 2001
From: asadiqbal <aiqbal@edx.org>
Date: Thu, 11 Aug 2016 19:15:43 +0500
Subject: [PATCH] OLIVE-75 - CourseID Term not rendering correctly

---
 cms/static/js/index.js                       | 27 +++++++++++++++++---
 cms/static/js/spec/views/pages/index_spec.js | 10 ++++++++
 cms/static/sass/views/_dashboard.scss        |  8 ++++++
 3 files changed, 42 insertions(+), 3 deletions(-)

diff --git a/cms/static/js/index.js b/cms/static/js/index.js
index 533f0d7cdb..b0b1c8c673 100644
--- a/cms/static/js/index.js
+++ b/cms/static/js/index.js
@@ -67,6 +67,23 @@ define(['domReady', 'jquery', 'underscore', 'js/utils/cancel_on_escape', 'js/vie
             });
         };
 
+        var rtlTextDirection = function() {
+            var Selectors = {
+                new_course_run: '#new-course-run'
+            };
+
+            if ($('body').hasClass('rtl')) {
+                $(Selectors.new_course_run).addClass('course-run-text-direction placeholder-text-direction');
+                $(Selectors.new_course_run).on('input', function() {
+                    if (this.value === '') {
+                        $(Selectors.new_course_run).addClass('placeholder-text-direction');
+                    } else {
+                        $(Selectors.new_course_run).removeClass('placeholder-text-direction');
+                    }
+                });
+            }
+        };
+
         var makeCancelHandler = function(addType) {
             return function(e) {
                 e.preventDefault();
@@ -81,18 +98,22 @@ define(['domReady', 'jquery', 'underscore', 'js/utils/cancel_on_escape', 'js/vie
         };
 
         var addNewCourse = function(e) {
+            var $newCourse,
+                $cancelButton,
+                $courseName;
             e.preventDefault();
             $('.new-course-button').addClass('is-disabled').attr('aria-disabled', true);
             $('.new-course-save').addClass('is-disabled').attr('aria-disabled', true);
-            var $newCourse = $('.wrapper-create-course').addClass('is-shown');
-            var $cancelButton = $newCourse.find('.new-course-cancel');
-            var $courseName = $('.new-course-name');
+            $newCourse = $('.wrapper-create-course').addClass('is-shown');
+            $cancelButton = $newCourse.find('.new-course-cancel');
+            $courseName = $('.new-course-name');
             $courseName.focus().select();
             $('.new-course-save').on('click', saveNewCourse);
             $cancelButton.bind('click', makeCancelHandler('course'));
             CancelOnEscape($cancelButton);
             CreateCourseUtils.setupOrgAutocomplete();
             CreateCourseUtils.configureHandlers();
+            rtlTextDirection();
         };
 
         var saveNewLibrary = function(e) {
diff --git a/cms/static/js/spec/views/pages/index_spec.js b/cms/static/js/spec/views/pages/index_spec.js
index 94ab96bbe9..a47c9983ef 100644
--- a/cms/static/js/spec/views/pages/index_spec.js
+++ b/cms/static/js/spec/views/pages/index_spec.js
@@ -60,6 +60,16 @@ define(['jquery',
                 $('.new-course-org').autocomplete('destroy');
             });
 
+            it('set the correct direction of text in case of rtl', function() {
+                $('body').addClass('rtl');
+                $('.new-course-button').click();
+                $('.new-course-run').val('2014_T2').trigger('input');
+                expect($('.new-course-run').hasClass('placeholder-text-direction')).toBe(false);
+                $('.new-course-run').val('').trigger('input');
+                expect($('.new-course-run').hasClass('placeholder-text-direction')).toBe(true);
+            });
+
+
             it('displays an error when saving fails', function() {
                 var requests = AjaxHelpers.requests(this);
                 $('.new-course-button').click();
diff --git a/cms/static/sass/views/_dashboard.scss b/cms/static/sass/views/_dashboard.scss
index a1614a9dc3..1473d8cd67 100644
--- a/cms/static/sass/views/_dashboard.scss
+++ b/cms/static/sass/views/_dashboard.scss
@@ -677,6 +677,14 @@
     .new-course-run {
       width: 100%;
     }
+    .course-run-text-direction {
+      direction: ltr;
+      text-align: right;
+    }
+
+    .placeholder-text-direction {
+        direction: rtl;
+      }
 
     .new-course-name {
       @extend %t-title5;