Merge pull request #6754 from OmarIthawi/edraak/omarithawi/bulk-mail-rtl

TinyMCE RTL in course bulk email

cms/static/sass/elements/_modal-window.scss

@@ -15,7 +15,8 @@
     border-radius: ($baseline/5);
     background-color: $gray-l4;
     padding: 7px;
-    text-align: left;
+    @include text-align(left);
+    @include direction();
 
     .modal-content {
       position: relative;
@@ -214,7 +215,7 @@
         .editor-modes {
           width: 48%;
           display: inline-block;
-          text-align: right;
+          @include text-align(right);
 
           .action-item {
             display: inline-block;

cms/static/sass/views/_settings.scss

@@ -2,6 +2,8 @@
 // ====================
 
 .view-settings {
+  @include text-align(left);
+  @include direction();
 
   .content-primary, .content-supplementary {
     @include box-sizing(border-box);
@@ -908,6 +910,19 @@
           top: 4px; /* Vertical alignment for monospace font */
         }
 
+        .CodeMirror-scroll {
+          @include margin-left(-30px);
+          @include margin-right(0);
+
+          @include padding-left(30px);
+          @include padding-right(0);
+        }
+
+        .CodeMirror-vscrollbar {
+          @include left(0);
+          @include right(auto);
+        }
+
         // editor color changes just for JSON
         .CodeMirror-lines {
 

common/lib/xmodule/xmodule/css/editor/edit.scss

@@ -15,7 +15,7 @@
 
     a {
       display: block;
-      float: left;
+      @include float(left);
       padding: 3px ($baseline/2) 7px;
       margin-left: 7px;
       border-radius: 2px;
@@ -29,14 +29,16 @@
   .editor-tabs {
     position: absolute;
     top: 10px;
-    right: 10px;
+    @include right(10px);
+    @include text-align(left);
+    @include direction();
 
     li {
-      float: left;
-      margin-right: ($baseline/4);
+      @include float(left);
+      @include margin-right($baseline/4);
 
       &:last-child {
-        margin-right: 0;
+        @include margin-right(0);
       }
     }
 

common/lib/xmodule/xmodule/js/src/html/edit.coffee

@@ -66,6 +66,8 @@ class @HTMLEditingDescriptor
         schema: "html5",
         # Necessary to preserve relative URLs to our images.
         convert_urls : false,
+        # Sniff UI direction from `.wrapper-view` in studio or `.window-wrap` in LMS
+        directionality: $(".wrapper-view, .window-wrap").prop('dir'),
         content_css : tiny_mce_css_links.join(", "),
         formats : {
           # tinyMCE does block level for code by default
@@ -91,7 +93,7 @@ class @HTMLEditingDescriptor
         height: '400px',
         menubar: false,
         statusbar: false,
-        
+
         # Necessary to avoid stripping of style tags.
         valid_children : "+body[style]",
 
@@ -99,7 +101,7 @@ class @HTMLEditingDescriptor
         valid_elements: "*[*]",
         extended_valid_elements: "*[*]",
         invalid_elements: "",
-        
+
         setup: @setupTinyMCE,
         # Cannot get access to tinyMCE Editor instance (for focusing) until after it is rendered.
         # The tinyMCE callback passes in the editor as a parameter.

common/lib/xmodule/xmodule/js/src/problem/edit.coffee

 class @MarkdownEditingDescriptor extends XModule.Descriptor
   # TODO really, these templates should come from or also feed the cheatsheet
-  @multipleChoiceTemplate : "( ) incorrect\n( ) incorrect\n(x) correct\n"
-  @checkboxChoiceTemplate: "[x] correct\n[ ] incorrect\n[x] correct\n"
-  @stringInputTemplate: "= answer\n"
-  @numberInputTemplate: "= answer +- 0.001%\n"
-  @selectTemplate: "[[incorrect, (correct), incorrect]]\n"
-  @headerTemplate: "Header\n=====\n"
-  @explanationTemplate: "[explanation]\nShort explanation\n[explanation]\n"
+  @multipleChoiceTemplate : "( ) #{gettext 'incorrect'}\n( ) #{gettext 'incorrect'}\n(x) #{gettext 'correct'}\n"
+  @checkboxChoiceTemplate: "[x] #{gettext 'correct'}\n[ ] incorrect\n[x] correct\n"
+  @stringInputTemplate: "= #{gettext 'answer'}\n"
+  @numberInputTemplate: "= #{gettext 'answer'} +- 0.001%\n"
+  @selectTemplate: "[[#{gettext 'incorrect'}, (#{gettext 'correct'}), #{gettext 'incorrect'}]]\n"
+  @headerTemplate: "#{gettext 'Header'}\n=====\n"
+  @explanationTemplate: "[explanation]\n#{gettext 'Short explanation'}\n[explanation]\n"
 
   constructor: (element) ->
     @element = element
@@ -67,7 +67,7 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
   ###
   confirmConversionToXml: ->
     # TODO: use something besides a JavaScript confirm dialog?
-    return confirm("If you use the Advanced Editor, this problem will be converted to XML and you will not be able to return to the Simple Editor Interface.\n\nProceed to the Advanced Editor and convert this problem to XML?")
+    return confirm(gettext "If you use the Advanced Editor, this problem will be converted to XML and you will not be able to return to the Simple Editor Interface.\n\nProceed to the Advanced Editor and convert this problem to XML?")
 
   ###
   Event listener for toolbar buttons (only possible when markdown editor is visible).