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

Tiny/RecordRTC: Add Screen-recorder button

Details

    • MOODLE_404_STABLE
    • MDL-81212-master
    • Hide

      Step 1:

      1. Go to Site administration > Plugins > Text editors > TinyMCE editor > Tiny RecordRTC
      2. Verify that the dropdown selection for "Recording type" has been changed to a selection of checkboxes.

      Step 2: Check the Screen recording checkbox.

      Step 3:  Go to Edit profile page

      Step 4: 

      1. Verify that the dropdown button with a video icon on the toolbar contains both the "Video record" button and the "Screen record" button.
      2. Click on the "Record screen button.

      Step 5: 

      1. A popup will appear, allowing you to select the screen you want to share.
      2. Choose the screen you want to share.

      Step 6:  Verify that the screen you selected to share is streaming on the Recrod Screen dialog.

      Step 7: Click on the "Star recording" button

      Step 8: When you're ready to stop recording, click the "Stop recording" button, or you can wait for the countdown to end.

      Step 9: Click on the "Attach recording" button

      Step 10: Click on the "Update profile" button

      Step 11: Verify screen recording

      Repeat the above test with other supported browsers to verify that nothing was broken.

      Show
      Step 1: Go to Site administration > Plugins > Text editors > TinyMCE editor > Tiny RecordRTC Verify that the dropdown selection for "Recording type" has been changed to a selection of checkboxes. Step 2: Check the Screen recording checkbox. Step 3:  Go to Edit profile page Step 4:  Verify that the dropdown button with a video icon on the toolbar contains both the "Video record" button and the "Screen record" button. Click on the "Record screen button. Step 5:  A popup will appear, allowing you to select the screen you want to share. Choose the screen you want to share. Step 6:   Verify that the screen you selected to share is streaming on the Recrod Screen dialog. Step 7: Click on the "Star recording" button Step 8: When you're ready to stop recording, click the "Stop recording" button, or you can wait for the countdown to end. Step 9: Click on the "Attach recording" button Step 10: Click on the "Update profile" button Step 11: Verify screen recording Repeat the above test with other supported browsers to verify that nothing was broken.

    Description

      As a user, I want to be able to record my screen via the TinyMCE editor so that I can share what's on my screen.

      AC1: Add a new button to TinyMCE named "Screen-recording." When users click on it, they should see a dialogue similar to "Record Video," with the button text saying "Start screen recording."

      AC2: Clicking on the "Start Screen-recording" button should prompt the user to select the screen they want to share. The browser should also prompt the user for permission to use the microphone.

      AC3: After users allow/block the microphone, select the screen, and click on the "Share" button, they should be able to record the screen. The "Start screen recording" button should change to "Stop screen recording," including a time limit similar to Audio/Video recording.

      AC4: Additional Settings in Tiny RecordRTC Settings Page: To support the new screen recording button in Tiny Editor, propose adding settings to the Tiny RecordRTC settings page (via Site administration > Plugins > Text editors > TinyMCE editor > Tiny RecordRTC). The settings would include:

      • Screen time limit - config duration: default: 2 minutes for consistency with existing Audio and Video time limits
      • Screen bitrate - config text: default: 2500000
      • Video output resolution - config selection with two options1280 x 720 (16:9) and 1920 x1080 (16:9): default: 1280 x 720 (16:9)

      AC5: Update Options for Existing Recording Type in Tiny RecordRTC: Instead of adding more options to the "Recording type" drop-down:

      E.g:

      •  Audio only
      •  Video only
      •  Screen-recording only (New)
      •  Audio and video
      •  Audio, video, and screen-recording (New)

      Perhaps we should simplify it through moving to a tickbox design? It's getting quite long/complicated, and you could argue "None" should also be an option.

      Three tickboxes capture that flexibility much more simply (see below) - far better than 6+ drop-down options.

      Attachments

        1. allow-audio-permission.png
          allow-audio-permission.png
          66 kB
        2. image-2024-03-27-14-55-17-593.png
          image-2024-03-27-14-55-17-593.png
          114 kB
        3. record_button_dropdown.png
          record_button_dropdown.png
          22 kB
        4. record_button_menu_update.png
          record_button_menu_update.png
          16 kB
        5. record_button_menu.png
          record_button_menu.png
          22 kB
        6. record_button_toolbar.png
          record_button_toolbar.png
          14 kB
        7. recording-type-checkbox.png
          recording-type-checkbox.png
          7 kB

        Issue Links

          Activity

            People

              toanlam Toan Lam
              toanlam Toan Lam
              Meirza Meirza
              Huong Nguyen Huong Nguyen
              Votes:
              6 Vote for this issue
              Watchers:
              10 Start watching this issue

              Dates

                Created:
                Updated:

                Time Tracking

                  Estimated:
                  Original Estimate - Not Specified
                  Not Specified
                  Remaining:
                  Remaining Estimate - 0 minutes
                  0m
                  Logged:
                  Time Spent - 3 hours, 8 minutes
                  3h 8m

                  Clockify

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