Skip to content

Commit

Permalink
Added bottom sheet for hls quality
Browse files Browse the repository at this point in the history
  • Loading branch information
Decoder07 committed Apr 29, 2024
1 parent eb9063d commit 50c9a4c
Show file tree
Hide file tree
Showing 8 changed files with 247 additions and 80 deletions.
28 changes: 27 additions & 1 deletion packages/hms_room_kit/lib/src/hls_viewer/hls_player_store.dart
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,10 @@ class HLSPlayerStore extends ChangeNotifier

String? caption;

Map<String, HMSHLSLayer> layerMap = {};

HMSHLSLayer? selectedLayer;

///This method starts a timer for 5 seconds and then hides the buttons
///
///[isStreamPlaying] is used to check if the video is playing or not
Expand Down Expand Up @@ -217,7 +221,28 @@ class HLSPlayerStore extends ChangeNotifier

void getHLSLayers() async {
var layers = await HMSHLSPlayerController.getHLSLayers();
log("Layers are $layers");
layers.sort((a, b) => (b.bitrate ?? 0).compareTo(a.bitrate ?? 0));
int layersSize = layers.length;
if (layers[layersSize - 1].bitrate == 0 ||
layers[layersSize - 1].bitrate == null) {
layerMap["AUTO"] = layers[layersSize - 1];
}
layerMap["HIGH"] = layers[0];
if (layersSize > 1) {
layerMap["LOW"] = layers[layersSize - 2];
}
layerMap["MEDIUM"] = layers[layersSize ~/ 2];
}

void getCurrentHLSLayer() async {
var layer = await HMSHLSPlayerController.getCurrentHLSLayer();
selectedLayer = layer;
}

void setHLSLayer(HMSHLSLayer hmsHLSLayer) async {
selectedLayer = hmsHLSLayer;
await HMSHLSPlayerController.setHLSLayer(hmsHLSLayer: hmsHLSLayer);
notifyListeners();
}

@override
Expand Down Expand Up @@ -250,6 +275,7 @@ class HLSPlayerStore extends ChangeNotifier
setHLSPlayerStats(true);
startTimer();
getHLSLayers();
getCurrentHLSLayer();
isStreamPlaying = true;
isPlayerFailed = false;
break;
Expand Down
44 changes: 33 additions & 11 deletions packages/hms_room_kit/lib/src/hls_viewer/hls_viewer_header.dart
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ library;
///Package imports
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hms_room_kit/src/meeting/meeting_store.dart';
import 'package:hms_room_kit/src/widgets/bottom_sheets/hls_viewer_quality_selector_bottom_sheet.dart';
import 'package:provider/provider.dart';

///Project imports
Expand Down Expand Up @@ -87,18 +89,38 @@ class HLSViewerHeader extends StatelessWidget {
}),

///This will be added later
// const SizedBox(
// width: 16,
// ),
const SizedBox(
width: 16,
),

// ///This renders the settings button
// SvgPicture.asset(
// "packages/hms_room_kit/lib/src/assets/icons/settings.svg",
// colorFilter: ColorFilter.mode(
// HMSThemeColors.onSurfaceHighEmphasis,
// BlendMode.srcIn),
// semanticsLabel: "caption_toggle_button",
// )
///This renders the settings button
GestureDetector(
onTap: () {
var _meetingStore =
context.read<MeetingStore>();
var _hlsPlayerStore =
context.read<HLSPlayerStore>();
showModalBottomSheet(
isScrollControlled: true,
backgroundColor: Colors.transparent,
context: context,
builder: (ctx) =>
ChangeNotifierProvider.value(
value: _meetingStore,
child: ChangeNotifierProvider.value(
value: _hlsPlayerStore,
child:
HLSViewerQualitySelectorBottomSheet()),
));
},
child: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/settings.svg",
colorFilter: ColorFilter.mode(
HMSThemeColors.onSurfaceHighEmphasis,
BlendMode.srcIn),
semanticsLabel: "caption_toggle_button",
),
)
],
)
],
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,129 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hms_room_kit/src/hls_viewer/hls_player_store.dart';
import 'package:hms_room_kit/src/layout_api/hms_theme_colors.dart';
import 'package:hms_room_kit/src/meeting/meeting_store.dart';
import 'package:hms_room_kit/src/widgets/common_widgets/hms_cross_button.dart';
import 'package:hms_room_kit/src/widgets/common_widgets/hms_subtitle_text.dart';
import 'package:hms_room_kit/src/widgets/common_widgets/hms_title_text.dart';
import 'package:hmssdk_flutter/hmssdk_flutter.dart';
import 'package:provider/provider.dart';
import 'package:tuple/tuple.dart';

class HLSViewerQualitySelectorBottomSheet extends StatefulWidget {
@override
State<HLSViewerQualitySelectorBottomSheet> createState() =>
_HLSViewerQualitySelectorBottomSheetState();
}

class _HLSViewerQualitySelectorBottomSheetState
extends State<HLSViewerQualitySelectorBottomSheet> {
@override
void initState() {
super.initState();
context.read<MeetingStore>().addBottomSheet(context);
}

@override
void deactivate() {
context.read<MeetingStore>().removeBottomSheet(context);
super.deactivate();
}

@override
Widget build(BuildContext context) {
double height = MediaQuery.of(context).size.height;
return SizedBox(
height: MediaQuery.of(context).orientation == Orientation.landscape? height * 0.8: height * 0.4,
width: ,
child: Container(
decoration: BoxDecoration(
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(16), topRight: Radius.circular(16)),
color: HMSThemeColors.backgroundDefault,
),
child: Selector<HLSPlayerStore,
Tuple2<Map<String, HMSHLSLayer>, int>>(
selector: (_, hlsPlayerStore) => Tuple2(
hlsPlayerStore.layerMap, hlsPlayerStore.layerMap.length),
builder: (context, data, _) {
return Padding(
padding:
const EdgeInsets.only(top: 24.0, left: 16, right: 16),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
HMSTitleText(
text: "Quality",
textColor:
HMSThemeColors.onSurfaceHighEmphasis,
letterSpacing: 0.15,
),
],
),
const Row(
children: [HMSCrossButton()],
),
],
),
Padding(
padding: const EdgeInsets.symmetric(vertical: 16),
child: Divider(
color: HMSThemeColors.borderDefault,
height: 5,
),
),
Expanded(
child: ListView.builder(
itemCount: data.item2,
itemBuilder: (context, index) {
return ListTile(
horizontalTitleGap: 2,
enabled: false,
contentPadding: EdgeInsets.zero,
title: HMSSubtitleText(
text:
data.item1.entries.elementAt(index).key,
fontSize: 14,
lineHeight: 20,
letterSpacing: 0.10,
fontWeight: FontWeight.w600,
textColor:
HMSThemeColors.onSurfaceHighEmphasis,
),
trailing: context
.read<HLSPlayerStore>()
.selectedLayer ==
data.item1.entries
.elementAt(index)
.value
? SizedBox(
height: 24,
width: 24,
child: SvgPicture.asset(
"packages/hms_room_kit/lib/src/assets/icons/tick.svg",
fit: BoxFit.scaleDown,
colorFilter: ColorFilter.mode(
HMSThemeColors
.onSurfaceHighEmphasis,
BlendMode.srcIn),
),
)
: const SizedBox(
height: 24,
width: 24,
),
);
}),
)
],
),
);
}),
));
}
}
4 changes: 2 additions & 2 deletions packages/hmssdk_flutter/example/ios/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ PODS:
- HMSSDK (1.9.0):
- HMSAnalyticsSDK (= 0.0.2)
- HMSWebRTC (= 1.0.6168)
- hmssdk_flutter (1.10.0):
- hmssdk_flutter (1.10.1):
- Flutter
- HMSBroadcastExtensionSDK (= 0.0.9)
- HMSHLSPlayerSDK (= 0.0.2)
Expand Down Expand Up @@ -300,7 +300,7 @@ SPEC CHECKSUMS:
HMSHLSPlayerSDK: 6a54ad4d12f3dc2270d1ecd24019d71282a4f6a3
HMSNoiseCancellationModels: a3bda1405a16015632f4bcabd46ce48f35103b02
HMSSDK: 96bdafc1c610aabfecd1155ad7e3c1bc45b3a6cb
hmssdk_flutter: 3febf31ba806e9a5ee540fe299c7331fc43135cf
hmssdk_flutter: c2ad70779ed9355577afbbe1047fb20f862820ac
HMSWebRTC: a302f0d6c94f7bee94f3265adb7bb1c6569e7ee5
MLImage: 7bb7c4264164ade9bf64f679b40fb29c8f33ee9b
MLKitBarcodeScanning: 04e264482c5f3810cb89ebc134ef6b61e67db505
Expand Down
Loading

0 comments on commit 50c9a4c

Please sign in to comment.