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

Allow users to enter a long description for complex images

XMLWordPrintable

    • MOODLE_402_STABLE, MOODLE_500_STABLE
    • MOODLE_500_STABLE
    • MDL-78453-main
    • Hide

      1. AI Placement

      1.1. Prerequisite

      1. Navigate to Site Admin > General > AI > Manage settings for AI providers.
        Ensure the available AI provider and its generated image action are enabled and ready to use.
      2. Navigate to Site Admin > General > AI > Manage settings for AI placements.
        Ensure the HTML Text Editor AI Placement and its generate image action are enabled.

      1.2. Testing

      1. Login as admin.
      2. Edit your profile.
      3. At the Description, click the AI button on the TinyMCE editor.
      4. Select AI generate image.
      5. Agree with the Policy (If any).
      6. Input the below text in the Describe the image you want AI to create:
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet.
      7. Press Generate Image.
      8. Verify you will see the Generated image on the right.
      9. Press Next.
      10. Verify that you will see another screen for image insert.
      11. Verify that your previous prompt text is added to the image description with the following text:
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut ... - Generated by AI
      12. Press Save
      13. Verify that the image is inserted into the text editor.

       

      Show
      1. AI Placement 1.1. Prerequisite Navigate to Site Admin > General > AI > Manage settings for AI providers. Ensure the available AI provider and its generated image action are enabled and ready to use. Navigate to Site Admin > General > AI > Manage settings for AI placements. Ensure the HTML Text Editor AI Placement and its generate image action are enabled. 1.2. Testing Login as admin. Edit your profile. At the Description, click the AI button on the TinyMCE editor. Select AI generate image. Agree with the Policy (If any). Input the below text in the Describe the image you want AI to create: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Press Generate Image. Verify you will see the Generated image on the right. Press Next. Verify that you will see another screen for image insert. Verify that your previous prompt text is added to the image description with the following text: Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut ... - Generated by AI Press Save Verify that the image is inserted into the text editor.  
    • Hide

      Code verified against automated checks.

      Checked MDL-78453 using repository: https://github.com/meirzamoodle/moodle.git

      More information about this report

      Built on: Mon 21 Oct 2024 06:46:19 AM UTC

      Show
      Code verified against automated checks. Checked MDL-78453 using repository: https://github.com/meirzamoodle/moodle.git main (0 errors / 0 warnings) [branch: MDL-78453-main | CI Job ] More information about this report Built on: Mon 21 Oct 2024 06:46:19 AM UTC
    • 2
    • Team Hedgehog 2024 Sprint 3.3, Team Hedgehog 2024 Review 4, Team Hedgehog 2024 Sprint 4.1

      Image alt text has a limit of 125 characters. This is an issue when teachers need to provide alternative text for complex images such a charts and other learning material.

      Whilst there are valid reasons to keep the alt text short, users are left with adding a description (or link to a description) as their only option.

      This issue was initially described in MDL-77044 for the Atto plugin.

      Based on research and in consultation with our own Accessibility team members, there isn't a defined max for alt text in WCAG or others. However we shouldn't make it too open ended.
      Doing some initial research, in English the average length of a paragrah is 100-150 words, with the average word length being 5 characters. So this give us a range of 500-750 characters for a single paragraph. Accounting for differences in languages, 750 characters feels like a good upper limit. For reference the below lipsum is 750 chars:

       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum rutrum varius nulla, ut consequat leo gravida et. Ut ultricies diam ac lobortis posuere. Duis tristique laoreet leo, quis facilisis est auctor a. Vivamus arcu enim, rutrum id ante vel, viverra maximus metus. Fusce rutrum enim ante, vitae lacinia nunc vulputate eu. Aliquam quis ultricies tortor. Suspendisse potenti. Sed bibendum vitae neque in imperdiet. Mauris eget pretium augue. Maecenas sit amet augue suscipit mauris lacinia rhoncus aliquet quis nunc. Maecenas et imperdiet nisi. Aliquam elementum bibendum nunc, nec maximus nunc pretium sed. Vivamus consectetur eget metus a fringilla. Vestibulum nec odio massa. Donec vestibulum malesuada turpis ut molestie. Integer dolor.

            meirza.arson@moodle.com Meirza
            Zanatta Susanna
            David Woloszyn David Woloszyn
            Jun Pataleta Jun Pataleta
            Ron Carl Alfon Yu Ron Carl Alfon Yu
            Votes:
            3 Vote for this issue
            Watchers:
            8 Start watching this issue

              Created:
              Updated:
              Resolved:

                Estimated:
                Original Estimate - 0 minutes
                0m
                Remaining:
                Remaining Estimate - 0 minutes
                0m
                Logged:
                Time Spent - 3 days, 3 hours, 21 minutes
                3d 3h 21m

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