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

Add text direction to default ATTO generated markup

    XMLWordPrintable

    Details

    • Testing Instructions:
      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  
    • Affected Branches:
      MOODLE_27_STABLE, MOODLE_29_STABLE, MOODLE_32_STABLE, MOODLE_37_STABLE, MOODLE_38_STABLE
    • Fixed Branches:
      MOODLE_39_STABLE
    • Pull from Repository:
    • Pull Master Branch:
      MDL-45227-master
    • Story Points:
      1
    • Sprint:
      International 3.9 - Sprint 6, International 3.9 - Sprint 8

      Description

      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
      

        Attachments

        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

          Issue Links

            Activity

              People

              Assignee:
              rezaie9 Shamim Rezaie
              Reporter:
              nadavkav Nadav Kavalerchik
              Peer reviewer:
              Michael Hawkins
              Integrator:
              Sara Arjona (@sarjona)
              Tester:
              Anna Carissa Sadia
              Participants:
              Component watchers:
              Andrew Nicols, Jun Pataleta, Michael Hawkins, Shamim Rezaie, Simey Lameze
              Votes:
              8 Vote for this issue
              Watchers:
              19 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved:
                Fix Release Date:
                15/Jun/20

                  Time Tracking

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