Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-45227

Add text direction to default ATTO generated markup

XMLWordPrintable

    • MOODLE_27_STABLE, MOODLE_29_STABLE, MOODLE_32_STABLE, MOODLE_37_STABLE, MOODLE_38_STABLE
    • MOODLE_39_STABLE
    • MDL-45227-master
    • Hide

      Notes

      • To be tested with all themes (boost & classic)

      Set up

      1. Log in as admin
      2. From the user menu at top right, go to Preferences > Editor preferences, and set your preferred text editor to "Atto HTML editor"
      3. Go to "Site administration > Plugins > Text editors > Atto HTML editor > Atto toolbar settings" and add ",rtl" to the align section. when finished, it should look like "align = align,rtl". Save the new settings.
      4. Go to your profile, and click on "Edit profile" link.
      5. In the "Description" field, switch to HTML mode (use the "<>" icon on the Atto's second/hidden toolbar), clean its content if there is anything there, and save changes.
      6. Install an RTL language pack

      Test 1 (to be performed at very least with FF/Chrome/Edge/IE11...)

      1. Log in as admin
      2. Switch your language to the RTL language you installed in the setup phase.
      3. Go to your profile, and click on "Edit profile" link
      4. In the "Description", type some characters and press Enter
      5. Type some characters and then change the direction of the second paragraph to LTR (It's button might be on the second row of the editor's buttons)
      6. Change the Alignment of the paragraph to left
      7. Press Enter to go to the third paragraph
      8. Type ABC in the editor and put a full stop at the end.
      9. Verify that the text is left-aligned.
      10. Verify that the full-stop is placed at the right side of the text.
      11. Switch to HTML mode (use the "<>" icon on the Atto's second/hidden toolbar) and check the html code
      12. Verify that the first paragraph is RTL and the other 2 paragraphs are LTR
      13. Verify that the alignment of the first paragraph is right, and the alignment of the other 2 paragraphs is set to left

      Test 2 (to be performed at very least with FF/Chrome/Edge/IE11...)

      1. Log in as admin
      2. Switch your language to the RTL language you installed in the setup phase.
      3. Go to your profile, and click on "Edit profile" link
      4. In the "Description", Enter 4 paragraphs of text with the following attributes:
        1. Paragraph 1 should be RTL and right-aligned
        2. Paragraph 2 should be LTR and left-aligned
        3. Paragraph 3 should be RTL and right-aligned
        4. Paragraph 4 should be LTR and left-aligned
      5. Go to the end of the 2nd paragraph, then press 'Enter' and type ABC and put a full-stop at the end.
      6. Verify that the newly created paragraph is LTR and left-aligned
      7. Go to the end of 4th paragraph (which used to be the 3rd paragraph before step 5), then press 'Enter' and type ABC and put a full-stop at the end.
      8. Verify that the newly created paragraph is RTL and right-aligned

       

      Show
      Notes To be tested with all themes (boost & classic) Set up Log in as admin From the user menu at top right, go to Preferences > Editor preferences, and set your preferred text editor to "Atto HTML editor" Go to "Site administration > Plugins > Text editors > Atto HTML editor > Atto toolbar settings" and add ",rtl" to the align section. when finished, it should look like "align = align,rtl". Save the new settings. Go to your profile, and click on "Edit profile" link. In the "Description" field, switch to HTML mode (use the "<>" icon on the Atto's second/hidden toolbar), clean its content if there is anything there, and save changes. Install an RTL language pack Test 1 (to be performed at very least with FF/Chrome/Edge/IE11...) Log in as admin Switch your language to the RTL language you installed in the setup phase. Go to your profile, and click on "Edit profile" link In the "Description", type some characters and press Enter Type some characters and then change the direction of the second paragraph to LTR (It's button might be on the second row of the editor's buttons) Change the Alignment of the paragraph to left Press Enter to go to the third paragraph Type ABC in the editor and put a full stop at the end. Verify that the text is left-aligned. Verify that the full-stop is placed at the right side of the text. Switch to HTML mode (use the "<>" icon on the Atto's second/hidden toolbar) and check the html code Verify that the first paragraph is RTL and the other 2 paragraphs are LTR Verify that the alignment of the first paragraph is right, and the alignment of the other 2 paragraphs is set to left Test 2 (to be performed at very least with FF/Chrome/Edge/IE11...) Log in as admin Switch your language to the RTL language you installed in the setup phase. Go to your profile, and click on "Edit profile" link In the "Description", Enter 4 paragraphs of text with the following attributes: Paragraph 1 should be RTL and right-aligned Paragraph 2 should be LTR and left-aligned Paragraph 3 should be RTL and right-aligned Paragraph 4 should be LTR and left-aligned Go to the end of the 2nd paragraph, then press 'Enter' and type ABC and put a full-stop at the end. Verify that the newly created paragraph is LTR and left-aligned Go to the end of 4th paragraph (which used to be the 3rd paragraph before step 5), then press 'Enter' and type ABC and put a full-stop at the end. Verify that the newly created paragraph is RTL and right-aligned  
    • 1
    • International 3.9 - Sprint 6, International 3.9 - Sprint 8

      Considering word processing desktop applications, when a new (or existing) document is opened up, the RTL/LTR (directionality) and the Left/Right (Alignment) buttons are "pressed" according to the user's current language.
      So each paragraph is embedded (inlined) with the proper style.

      The above behaviour should also be implemented on the web, especially in the HTML editor we use (Atto) since the user is under the illusion (due to the theme's styles) that the content that is entered is properly aligned to his/her current language preferences, but when the content is send by email (Forum) the theme's style is removed (not added) and the RTL content is displayed as LTR when the user open the email.

      There is already a similar suggested fix MDL-40520 for TinyMCE editor,
      Which detects the user's language and enables (set) the proper directionality and alignment buttons, when the editor initiates.
      All this, to make it more easy for the users to start inputting content without the need to click those buttons. (which they mostly forget or not aware of, due to desktop word processing habits)

      Also, system setting should include by default the RTL/LTR buttons
      editor_atto | toolbar

       align = align,rtl

        1. chrome-ff-safari.png
          chrome-ff-safari.png
          291 kB
        2. edge.png
          edge.png
          42 kB
        3. MDL-45227_Test1.jpg
          MDL-45227_Test1.jpg
          31 kB
        4. MDL-45227_Test2.jpg
          MDL-45227_Test2.jpg
          49 kB
        5. MDL-45227.jpg
          MDL-45227.jpg
          19 kB

            rezaie9 Shamim Rezaie
            nadavkav Nadav Kavalerchik
            Michael Hawkins Michael Hawkins
            Sara Arjona (@sarjona) Sara Arjona (@sarjona)
            Anna Carissa Sadia Anna Carissa Sadia
            Votes:
            8 Vote for this issue
            Watchers:
            20 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 2 days, 6 hours, 54 minutes
                2d 6h 54m

                  Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.