Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Prebuilt/feature 114 recording state #1605

Merged
merged 3 commits into from
Oct 12, 2023
Merged

Prebuilt/feature 114 recording state #1605

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3513b0c
Added recording state ui
Decoder07 Oct 11, 2023
eae8349
Merge branch 'develop' into prebuilt/feature-114-recording-state
Decoder07 Oct 12, 2023
313e194
Added recording state implementation
Decoder07 Oct 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 21 additions & 8 deletions packages/hms_room_kit/lib/src/hls_viewer/hls_viewer_header.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import 'dart:io';

///Package imports
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hms_room_kit/src/common/utility_functions.dart';
import 'package:provider/provider.dart';
Expand Down Expand Up @@ -85,22 +86,34 @@ class HLSViewerHeader extends StatelessWidget {
///We render the recording icon based on the recording status
///If the recording is started we show the recording icon
///If the recording is not started we show nothing
Selector<MeetingStore, Tuple3<bool, bool, bool>>(
selector: (_, meetingStore) => Tuple3(
///
///If recording initialising state is true we show the loader
Selector<MeetingStore, Tuple4<bool, bool, bool,bool>>(
selector: (_, meetingStore) => Tuple4(
meetingStore.recordingType["browser"] ?? false,
meetingStore.recordingType["server"] ?? false,
meetingStore.recordingType["hls"] ?? false,
meetingStore
.isRecordingInInitialisingState
),
builder: (_, data, __) {
return (data.item1 || data.item2 || data.item3)
? SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/record.svg",
? SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/record.svg",
height: 24,
width: 24,
colorFilter: ColorFilter.mode(
HMSThemeColors.alertErrorDefault,
BlendMode.srcIn),
)
: data.item4
? SizedBox(
height: 24,
width: 24,
colorFilter: ColorFilter.mode(
HMSThemeColors.alertErrorDefault,
BlendMode.srcIn),
)
child: CircularProgressIndicator(
strokeWidth: 1,
color: HMSThemeColors.onSurfaceHighEmphasis,
))
: Container();
}),
const SizedBox(
Expand Down
25 changes: 18 additions & 7 deletions packages/hms_room_kit/lib/src/meeting/meeting_header.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,8 @@ class _MeetingHeaderState extends State<MeetingHeader> {
///else we render an empty Container
///
///For hls streaming status we use the streamingType map from the [MeetingStore]
///
///If recording initialising state is true we show the loader
Selector<MeetingStore, bool>(
selector: (_, meetingStore) =>
meetingStore.streamingType['hls'] ?? false,
Expand Down Expand Up @@ -91,12 +93,13 @@ class _MeetingHeaderState extends State<MeetingHeader> {
///else we render an empty Container
///
///For recording status we use the recordingType map from the [MeetingStore]
Selector<MeetingStore, Tuple3<bool, bool, bool>>(
selector: (_, meetingStore) => Tuple3(
meetingStore.recordingType["browser"] ?? false,
meetingStore.recordingType["server"] ?? false,
meetingStore.recordingType["hls"] ?? false,
),
Selector<MeetingStore, Tuple4<bool, bool, bool, bool>>(
selector: (_, meetingStore) => Tuple4(
meetingStore.recordingType["browser"] ?? false,
meetingStore.recordingType["server"] ?? false,
meetingStore.recordingType["hls"] ?? false,
meetingStore
.isRecordingInInitialisingState),
builder: (_, data, __) {
return (data.item1 || data.item2 || data.item3)
? SvgPicture.asset(
Expand All @@ -107,7 +110,15 @@ class _MeetingHeaderState extends State<MeetingHeader> {
HMSThemeColors.alertErrorDefault,
BlendMode.srcIn),
)
: Container();
: data.item4
? SizedBox(
height: 24,
width: 24,
child: CircularProgressIndicator(
strokeWidth: 2,
color: HMSThemeColors.onSurfaceHighEmphasis,
))
: Container();
}),
const SizedBox(
width: 8,
Expand Down
8 changes: 8 additions & 0 deletions packages/hms_room_kit/lib/src/meeting/meeting_store.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -228,6 +228,9 @@ class MeetingStore extends ChangeNotifier
///This stores the number of peers in the room
int peersInRoom = 0;

///Check whether recording is in intialising state
bool isRecordingInInitialisingState = false;

Future<HMSException?> join(String userName, String roomCode,
{HMSConfig? roomConfig}) async {
//If roomConfig is null then only we call the methods to get the authToken
Expand Down Expand Up @@ -520,6 +523,8 @@ class MeetingStore extends ChangeNotifier
meetingUrl: meetingUrl, toRecord: toRecord, rtmpUrls: rtmpUrls);

_hmsSDKInteractor.startRtmpOrRecording(hmsRecordingConfig, this);
isRecordingInInitialisingState = true;
notifyListeners();
}

void cancelPreview() async {
Expand Down Expand Up @@ -879,6 +884,8 @@ class MeetingStore extends ChangeNotifier
case HMSRoomUpdate.browserRecordingStateUpdated:
recordingType["browser"] =
room.hmsBrowserRecordingState?.running ?? false;
isRecordingInInitialisingState =
room.hmsBrowserRecordingState?.initialising ?? false;
break;
case HMSRoomUpdate.serverRecordingStateUpdated:
recordingType["server"] =
Expand Down Expand Up @@ -2154,6 +2161,7 @@ class MeetingStore extends ChangeNotifier
case HMSActionResultListenerMethod.startRtmpOrRecording:
toasts.add(HMSToastModel(hmsException,
hmsToastType: HMSToastsType.errorToast));
isRecordingInInitialisingState = false;
notifyListeners();
break;
case HMSActionResultListenerMethod.stopRtmpAndRecording:
Expand Down
171 changes: 89 additions & 82 deletions packages/hms_room_kit/lib/src/widgets/bottom_sheets/app_utilities_bottom_sheet.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -199,100 +199,107 @@ class _AppUtilitiesBottomSheetState extends State<AppUtilitiesBottomSheet> {
///start/stop browser recording
///
///The recording permission is checked using the role of the local peer
///
///If Streaming is already running we disable the recording option
if (meetingStore.localPeer?.role.permissions.browserRecording ??
false)
((meetingStore.streamingType["hls"] ?? false) ||
(meetingStore.streamingType["rtmp"] ?? false))
? MoreOptionItem(
onTap: () {},
isActive: false,
optionIcon: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/record.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceLowEmphasis,
BlendMode.srcIn),
),
optionText: "Start Recording",
optionTextColor: HMSThemeColors.onSurfaceLowEmphasis,
)
: MoreOptionItem(
onTap: () async {
bool isRecordingRunning =
((meetingStore.recordingType["hls"] ?? false) ||
///If streaming is on or in initialising state disable the button
((meetingStore.streamingType["hls"] ?? false) ||
(meetingStore.streamingType["rtmp"] ?? false) || meetingStore.isRecordingInInitialisingState)
? MoreOptionItem(
onTap: () {},
isActive: false,
optionIcon: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/record.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceLowEmphasis,
BlendMode.srcIn),
),
optionText: "Start Recording",
optionTextColor:
HMSThemeColors.onSurfaceLowEmphasis,
)
: MoreOptionItem(
onTap: () async {
bool isRecordingRunning = ((meetingStore
.recordingType["hls"] ??
false) ||
(meetingStore.recordingType["browser"] ??
false) ||
(meetingStore.recordingType["server"] ??
false));
if (isRecordingRunning) {
Navigator.pop(context);
showModalBottomSheet(
isScrollControlled: true,
backgroundColor: HMSThemeColors.surfaceDim,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(16),
topRight: Radius.circular(16)),
),
context: context,
builder: (ctx) => EndServiceBottomSheet(
onButtonPressed: () =>
meetingStore.stopRtmpAndRecording(),
title: HMSTitleText(
text: "Stop Recording",
textColor: HMSThemeColors.alertErrorDefault,
letterSpacing: 0.15,
fontSize: 20,
),
bottomSheetTitleIcon: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/alert.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.alertErrorDefault,
BlendMode.srcIn),
),
subTitle: HMSSubheadingText(
text:
"Are you sure you want to stop recording? You\n can’t undo this action.",
maxLines: 2,
textColor:
HMSThemeColors.onSurfaceMediumEmphasis,
),
buttonText: "Stop Recording",
),
);
} else {
Navigator.pop(context);
meetingStore.startRtmpOrRecording(
meetingUrl: Constant.streamingUrl,
toRecord: true,
rtmpUrls: null);
}
},
isActive: ((meetingStore.recordingType["hls"] ??
false) ||
(meetingStore.recordingType["browser"] ??
false) ||
(meetingStore.recordingType["server"] ?? false)),
optionIcon: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/record.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceHighEmphasis,
BlendMode.srcIn),
),
optionText:
((meetingStore.recordingType["hls"] ?? false) ||
if (isRecordingRunning) {
Navigator.pop(context);
showModalBottomSheet(
isScrollControlled: true,
backgroundColor: HMSThemeColors.surfaceDim,
shape: const RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(16),
topRight: Radius.circular(16)),
),
context: context,
builder: (ctx) => EndServiceBottomSheet(
onButtonPressed: () =>
meetingStore.stopRtmpAndRecording(),
title: HMSTitleText(
text: "Stop Recording",
textColor:
HMSThemeColors.alertErrorDefault,
letterSpacing: 0.15,
fontSize: 20,
),
bottomSheetTitleIcon: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/alert.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.alertErrorDefault,
BlendMode.srcIn),
),
subTitle: HMSSubheadingText(
text:
"Are you sure you want to stop recording? You\n can’t undo this action.",
maxLines: 2,
textColor: HMSThemeColors
.onSurfaceMediumEmphasis,
),
buttonText: "Stop Recording",
),
);
} else {
Navigator.pop(context);
meetingStore.startRtmpOrRecording(
meetingUrl: Constant.streamingUrl,
toRecord: true,
rtmpUrls: null);
}
},
isActive: ((meetingStore.recordingType["hls"] ??
false) ||
(meetingStore.recordingType["browser"] ??
false) ||
(meetingStore.recordingType["server"] ??
false)),
optionIcon: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/record.svg",
height: 20,
width: 20,
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceHighEmphasis,
BlendMode.srcIn),
),
optionText: ((meetingStore.recordingType["hls"] ??
false) ||
(meetingStore.recordingType["browser"] ??
false) ||
(meetingStore.recordingType["server"] ??
false))
? "Stop Recording"
: "Start Recording",
)
)
],
),
],
Expand Down