Implemented Video Upload and Player (#2)

* Implementing video upload features

* setup image resize processor

* Add video thumbnail with duration and icon

* Fixed issue with video upload timeout and upper case file type on ios

* Added video player page

* Added video player page

* Fixing video player not play on ios

* Added partial file streaming for ios/android video request

* Added nginx as proxy server for better file serving

* update nginx and docker-compose file

* Video player working correctly

* Video player working correctly

* Split duration to the second

mobile/lib/modules/home/views/home_page.dart

@@ -2,10 +2,10 @@ import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/modules/home/ui/draggable_scrollbar.dart';
+import 'package:immich_mobile/modules/home/ui/image_grid.dart';
 import 'package:immich_mobile/modules/home/ui/immich_sliver_appbar.dart';
 import 'package:immich_mobile/modules/home/ui/profile_drawer.dart';
 import 'package:immich_mobile/modules/home/models/get_all_asset_respose.model.dart';
-import 'package:immich_mobile/modules/home/ui/image_grid.dart';
 import 'package:immich_mobile/modules/home/providers/asset.provider.dart';
 import 'package:intl/intl.dart';
 
@@ -16,9 +16,9 @@ class HomePage extends HookConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     final ValueNotifier<bool> _showBackToTopBtn = useState(false);
     ScrollController _scrollController = useScrollController();
+
     List<ImmichAssetGroupByDate> assetGroup = ref.watch(assetProvider);
     List<Widget> imageGridGroup = [];
-    final scrollLabelText = useState("");
 
     _scrollControllerCallback() {
       var endOfPage = _scrollController.position.maxScrollExtent;
@@ -40,39 +40,10 @@ class HomePage extends HookConsumerWidget {
       _scrollController.addListener(_scrollControllerCallback);
 
       return () {
-        debugPrint("Remove scroll listener");
         _scrollController.removeListener(_scrollControllerCallback);
       };
     }, []);
 
-    SliverToBoxAdapter _buildDateGroupTitle(String dateTitle) {
-      var currentYear = DateTime.now().year;
-      var groupYear = DateTime.parse(dateTitle).year;
-      var formatDateTemplate = currentYear == groupYear ? 'E, MMM dd' : 'E, MMM dd, yyyy';
-      var dateText = DateFormat(formatDateTemplate).format(DateTime.parse(dateTitle));
-
-      return SliverToBoxAdapter(
-        child: Padding(
-          padding: const EdgeInsets.only(top: 24.0, bottom: 24.0, left: 3.0),
-          child: Row(
-            children: [
-              Padding(
-                padding: const EdgeInsets.only(left: 8.0, bottom: 5.0, top: 5.0),
-                child: Text(
-                  dateText,
-                  style: const TextStyle(
-                    fontSize: 14,
-                    fontWeight: FontWeight.bold,
-                    color: Colors.black87,
-                  ),
-                ),
-              ),
-            ],
-          ),
-        ),
-      );
-    }
-
     Widget _buildBody() {
       if (assetGroup.isNotEmpty) {
         String lastGroupDate = assetGroup[0].date;
@@ -86,44 +57,27 @@ class HomePage extends HookConsumerWidget {
 
           // Add Monthly Title Group if started at the beginning of the month
           if ((currentMonth! - previousMonth!) != 0) {
-            var monthTitleText = DateFormat('MMMM, y').format(DateTime.parse(dateTitle));
-
             imageGridGroup.add(
-              MonthlyTitleText(monthTitleText: monthTitleText),
+              MonthlyTitleText(isoDate: dateTitle),
             );
           }
 
           // Add Daily Title Group
           imageGridGroup.add(
-            DailyTitleText(dateTitle: dateTitle),
+            DailyTitleText(isoDate: dateTitle),
           );
 
           // Add Image Group
           imageGridGroup.add(
             ImageGrid(assetGroup: assetGroup),
           );
-
+          //
           lastGroupDate = dateTitle;
         }
       }
 
       return SafeArea(
         child: DraggableScrollbar.semicircle(
-          // labelTextBuilder: (offset) {
-          //   final int currentItem = _scrollController.hasClients
-          //       ? (_scrollController.offset / _scrollController.position.maxScrollExtent * imageGridGroup.length)
-          //           .floor()
-          //       : 0;
-
-          //   if (imageGridGroup[currentItem] is MonthlyTitleText) {
-          //     MonthlyTitleText item = imageGridGroup[currentItem] as MonthlyTitleText;
-
-          //     scrollLabelText.value = item.monthTitleText;
-          //   }
-
-          //   return Text(scrollLabelText.value);
-          // },
-          // labelConstraints: const BoxConstraints.tightFor(width: 200.0, height: 30.0),
           backgroundColor: Theme.of(context).primaryColor,
           controller: _scrollController,
           heightScrollThumb: 48.0,
@@ -148,13 +102,15 @@ class HomePage extends HookConsumerWidget {
 class MonthlyTitleText extends StatelessWidget {
   const MonthlyTitleText({
     Key? key,
-    required this.monthTitleText,
+    required this.isoDate,
   }) : super(key: key);
 
-  final String monthTitleText;
+  final String isoDate;
 
   @override
   Widget build(BuildContext context) {
+    var monthTitleText = DateFormat('MMMM, y').format(DateTime.parse(isoDate));
+
     return SliverToBoxAdapter(
       child: Padding(
         padding: const EdgeInsets.only(left: 10.0, top: 32),
@@ -174,17 +130,17 @@ class MonthlyTitleText extends StatelessWidget {
 class DailyTitleText extends StatelessWidget {
   const DailyTitleText({
     Key? key,
-    required this.dateTitle,
+    required this.isoDate,
   }) : super(key: key);
 
-  final String dateTitle;
+  final String isoDate;
 
   @override
   Widget build(BuildContext context) {
     var currentYear = DateTime.now().year;
-    var groupYear = DateTime.parse(dateTitle).year;
+    var groupYear = DateTime.parse(isoDate).year;
     var formatDateTemplate = currentYear == groupYear ? 'E, MMM dd' : 'E, MMM dd, yyyy';
-    var dateText = DateFormat(formatDateTemplate).format(DateTime.parse(dateTitle));
+    var dateText = DateFormat(formatDateTemplate).format(DateTime.parse(isoDate));
 
     return SliverToBoxAdapter(
       child: Padding(