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

Allow users to resize images in atto

    XMLWordPrintable

    Details

    • Type: Epic
    • Status: Development in progress
    • Priority: Minor
    • Resolution: Unresolved
    • Affects Version/s: 2.7
    • Fix Version/s: FRONTEND
    • Component/s: HTML Editor (Atto)
    • Labels:
    • Testing Instructions:
      Hide

      On all supported browsers

      Basic Test

      1. Visit your profile page.
      2. Click to edit your profile.
      3. Upload an image in the description.
      4. Confirm that you can resize the image in the editor.
      5. Save the description and ensure the image is the size you resized to earlier.

      From (4) in Basic Test. Test copy/paste.

      1. Click on the image in the editor.
      2. Once resize helpers show up. Do 'Ctrl+C'.
      3. Do 'Ctrl+V' in a specified position via cursor (add some text to have a place to position the cursor).
      4. Image should be copied, WITHOUT, the resize helpers.

      From (4) in Basic Test. Test delete.

      1. Click on the image in the editor.
      2. Once resize helpers show up. Press 'Delete' or 'Backspace'.
      3. Image should be gone.

      From (4) in Basic Test. Test image replace.

      1. Click on the image in the editor.
      2. Once resize helpers show up, double click it (or click the image plugin button).
      3. Replace the image.
      4. The image should be replaced.

      Multiple editor instance test.

      1. Create a course.
      2. Add a quiz.
      3. Add a multiple choice question.
      4. The multiple choice question editor have multiple atto editor.
      5. Do All test above

      Alignment (No more image styling in the image dialogue).

      1. Go to an editor.
      2. Add and double click an image.
      3. A dialogue should show up.
      4. In the dialouge, the drop down alignment options at the bottom of the preview image should not exist.

      Alignment should not break existing functionality (e.g. could still align text).

      1. Go to an editor.
      2. Add and click the image.
      3. Click the alignment buttons (assuming atto_align plugin is enabled).
      4. The text should be aligned.

      Alignment should work for editable image.

      1. Go to an editor.
      2. Add a paragraph. Some lorem ipsum stuff.
      3. In the middle of the paragraph, add an image.
      4. Select a text surrounding the image.
      5. Click the alignment buttons (assuming atto_align is enabled).
      6. The text and image should be aligned.
      Show
      On all supported browsers Basic Test Visit your profile page. Click to edit your profile. Upload an image in the description. Confirm that you can resize the image in the editor. Save the description and ensure the image is the size you resized to earlier. From (4) in Basic Test . Test copy/paste. Click on the image in the editor. Once resize helpers show up. Do 'Ctrl+C'. Do 'Ctrl+V' in a specified position via cursor (add some text to have a place to position the cursor). Image should be copied, WITHOUT, the resize helpers. From (4) in Basic Test . Test delete. Click on the image in the editor. Once resize helpers show up. Press 'Delete' or 'Backspace'. Image should be gone. From (4) in Basic Test . Test image replace. Click on the image in the editor. Once resize helpers show up, double click it (or click the image plugin button). Replace the image. The image should be replaced. Multiple editor instance test. Create a course. Add a quiz. Add a multiple choice question. The multiple choice question editor have multiple atto editor. Do All test above Alignment (No more image styling in the image dialogue). Go to an editor. Add and double click an image. A dialogue should show up. In the dialouge, the drop down alignment options at the bottom of the preview image should not exist. Alignment should not break existing functionality (e.g. could still align text). Go to an editor. Add and click the image. Click the alignment buttons (assuming atto_align plugin is enabled). The text should be aligned. Alignment should work for editable image. Go to an editor. Add a paragraph. Some lorem ipsum stuff. In the middle of the paragraph, add an image. Select a text surrounding the image. Click the alignment buttons (assuming atto_align is enabled). The text and image should be aligned.
    • Affected Branches:
      MOODLE_27_STABLE
    • Epic Name:
      Allow users to crop/resize/rotate images in atto
    • Pull Master Branch:
      wip-MDL-44239

      Description

      Being able to resize the images from within the editor.

        Attachments

          Issue Links

            Activity

              People

              • Votes:
                27 Vote for this issue
                Watchers:
                24 Start watching this issue

                Dates

                • Created:
                  Updated: