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

Create a new activity UI component

    XMLWordPrintable

Details

    • MOODLE_311_STABLE, MOODLE_400_STABLE
    • MOODLE_400_STABLE
    • MDL-71691-master-9
    • Hide

      Setup

      In Site Administration > Advanced features enable "Allow stealth activities"
      Restore the attached featured demo course (backup-moodle2-course-8-fd2-20211206-0950-nu.mbz) as a new course
      Enable completion tracking for the course (file backup-moodle2-course-8-fd2-20211206-0950-nu.mbz)
      Create a student account and enrol the student in the restored courses

      Test the restrictions show more feature

      1. Login as admin and navigate to the restored course
      2. Click the 'show more' link for the 'Offline Activity' assignment
      3. Verify you now see all restrictions
      4. Turn editing on
      5. Hide the 'Offline Activity' assignment
      6. Verify the restriction information is no longer visible
      7. Show the 'Offline Activity' assignment
      8. Verify the restriction information is shown
      9. Click the 'show more' link
      10. Verify you see all the restriction information

      Test the new activity / section badges

      1. As admin on the restored course turn editing on
      2. Hide a section
      3. Verify the section and all activities within the section get a 'Hidden from students' badge
      4. For one of the activities in this hidden section click the 'Make available' link in the activity menu
      5. Verify the activity now shows the 'Available but not shown on course page' badge

      Test the activity description

      1. Go to the choices section in the course
      2. Check the activity info for open/close datas, the activity description and activity availability are shown in the grey box underneath the activity title

      Test moving / deleting / duplicating activities

      1. In edit mode scroll to the Databases Section
      2. Drag and hold the activities and reorder them
      3. Verify you can move the activities and there is a black line to indicate where the activities will be dropped on moving
      4. Verify you are able to duplicate activities
      5. Verify you are able to delete activities

      Test the homepage activity design + home main manu

      Note: activities on the homepage or in blocks do not use the new drag&drop features yet.

      1. Navigate to the site homepage
      2. Turn edit mode on
      3. Add 2 activities of type choice (these are easy to add)
      4. Add the Main menu block
      5. Add 2 more activities in this block
      6. Verify you see the move arrows icon to move these activities
      7. Verify can move the activities when clicking the move arrows
      8. Verify that on hiding an activity you see the new 'hidden from students' badge
      9. The activities should follow the design of activities on a normal course page, except for the move arrows.

      Test the Social activities block

      1. Create a new course of type social
      2. On the course page add the 'Social activities' block
      3. Add 2 or more activities to the block
      4. Verify the activity design matches the activity design on the homepage
      Show
      Setup In Site Administration > Advanced features enable "Allow stealth activities" Restore the attached featured demo course ( backup-moodle2-course-8-fd2-20211206-0950-nu.mbz ) as a new course Enable completion tracking for the course (file backup-moodle2-course-8-fd2-20211206-0950-nu.mbz) Create a student account and enrol the student in the restored courses Test the restrictions show more feature Login as admin and navigate to the restored course Click the 'show more' link for the 'Offline Activity' assignment Verify you now see all restrictions Turn editing on Hide the 'Offline Activity' assignment Verify the restriction information is no longer visible Show the 'Offline Activity' assignment Verify the restriction information is shown Click the 'show more' link Verify you see all the restriction information Test the new activity / section badges As admin on the restored course turn editing on Hide a section Verify the section and all activities within the section get a 'Hidden from students' badge For one of the activities in this hidden section click the 'Make available' link in the activity menu Verify the activity now shows the 'Available but not shown on course page' badge Test the activity description Go to the choices section in the course Check the activity info for open/close datas, the activity description and activity availability are shown in the grey box underneath the activity title Test moving / deleting / duplicating activities In edit mode scroll to the Databases Section Drag and hold the activities and reorder them Verify you can move the activities and there is a black line to indicate where the activities will be dropped on moving Verify you are able to duplicate activities Verify you are able to delete activities Test the homepage activity design + home main manu Note: activities on the homepage or in blocks do not use the new drag&drop features yet. Navigate to the site homepage Turn edit mode on Add 2 activities of type choice (these are easy to add) Add the Main menu block Add 2 more activities in this block Verify you see the move arrows icon to move these activities Verify can move the activities when clicking the move arrows Verify that on hiding an activity you see the new 'hidden from students' badge The activities should follow the design of activities on a normal course page, except for the move arrows. Test the Social activities block Create a new course of type social On the course page add the 'Social activities' block Add 2 or more activities to the block Verify the activity design matches the activity design on the homepage
    • Moppies Kanban

    Description

      EDIT: replaced by Moodle 4 activity design spec:

      https://docs.google.com/document/d/1gWHVF1yTvVcKl4HeSIy_VYUM0QPdLH5Uq-Afv8dl0NQ/edit#

       

      As a course creator / editor 
      I want to easily move activity, resources and sections within a course
      So I can quickly build & organise my course

      ––

      As a course viewer 
      I want to easily access activity, resources and sections within a course
      So I can easily complete my course

      Acceptance criteria:

      When editing mode is turned on

      • When Editor hover the card, it changes the background color+stroke colours of the card as per design (also reveal drag & drop icon)
      • Editor can drag & drop activities by doing a longpress anywhere on the activity card
      • Editor can open a dropdown menu when clicking on the kebab menu
      •  Editor can go the activity itself by clicking anywhere on the card except, the kebab icon or drag & drop icon **

      When editing mode is turned off

      • Student can only access to the activity by clicking on 
        • activity name link or activity icon
      • When student hover the card, nothing happens
      • When student hover the activity link, it shows an underline

      Out of scope:

      Figma Designs: 

      https://www.figma.com/file/OfCvqK069Oz6Fvqq2xcZWI/Create-a-course?node-id=1385%3A2837

       -- 

      View mode : No hover effect on card, just on the link

        

       -- 

      Edit mode : Hover on card 

      Edit mode: drag & drop when long press (from anywhere in the card)

       Edit mode: when hovering + clicking the more button (opens dropdown)

       

      Attachments

        1. Activity-hover_editMode.png
          388 kB
          marc decerle
        2. Activity-hover_viewMode.png
          378 kB
          marc decerle
        3. Activity-hoverDropdown_editMode.png
          398 kB
          marc decerle
        4. Activity-LongPress_editMode.png
          392 kB
          marc decerle
        5. backup-moodle2-course-8-fd2-20211206-0950-nu.mbz
          251 kB
          Bas Brands
        6. centered.png
          27 kB
          Bas Brands
        7. MDL-71691_activity description.png
          163 kB
          Angelia Dela Cruz
        8. MDL-71691_homepage.webm
          387 kB
          Angelia Dela Cruz
        9. MDL-71691_move duplicate delete activities.webm
          1.17 MB
          Angelia Dela Cruz
        10. MDL-71691_new activity section badges.png
          179 kB
          Angelia Dela Cruz
        11. MDL-71691_new activity section badges 2.png
          180 kB
          Angelia Dela Cruz
        12. MDL-71691_pr01_01.png
          8 kB
          Ferran Recio
        13. MDL-71691_pr01_02.png
          33 kB
          Ferran Recio
        14. MDL-71691_pr01_03.png
          5 kB
          Ferran Recio
        15. MDL-71691_restrictions show more.png
          173 kB
          Angelia Dela Cruz
        16. MDL-71691_restrictions show more 2.png
          162 kB
          Angelia Dela Cruz
        17. MDL-71691_restrictions show more 3.png
          166 kB
          Angelia Dela Cruz
        18. MDL-71691_restrictions show more 4.png
          184 kB
          Angelia Dela Cruz
        19. MDL-71691_social activity.png
          140 kB
          Angelia Dela Cruz

        Issue Links

          Activity

            People

              basbrands Bas Brands
              mdecerle marc decerle
              Ferran Recio Ferran Recio
              Jun Pataleta Jun Pataleta
              Angelia Dela Cruz Angelia Dela Cruz
              Amaia Anabitarte, Carlos Escobedo, Ferran Recio, Ilya Tregubov, Laurent David, Sara Arjona (@sarjona), Huong Nguyen, Barbara Ramiro, Bas Brands, Mathew May
              Votes:
              0 Vote for this issue
              Watchers:
              9 Start watching this issue

              Dates

                Created:
                Updated:
                Resolved:
                19/Apr/22

                Time Tracking

                  Estimated:
                  Original Estimate - Not Specified
                  Not Specified
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 2 weeks, 3 days, 2 hours, 2 minutes
                  2w 3d 2h 2m