Corrections

team113 · Jul 22, 2022 · 83060b3 · 83060b3
1 parent 777f29f
commit 83060b3
Show file tree

Hide file tree

Showing 6 changed files with 382 additions and 302 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -16,16 +16,15 @@ All user visible changes to this project will be documented in this file. This p
 - UI:
     - User information auto-updating on changes ([#7], [#4]).
     - Menu:
-        - Language selection ([#23]).
+        - Language selection ([#23], [#29]).
 
 ### Changed
 
 - UI:
     - Media panel:
         - Redesigned desktop interface ([#26]);
         - Redesigned mobile interface ([#31]).
-    - Auth page:
-        - Redesigned `Auth` page ([#29]).
+    - Redesigned `Auth` page ([#29]).
 
 ### Fixed
 

diff --git a/lib/ui/page/auth/controller.dart b/lib/ui/page/auth/controller.dart
@@ -39,10 +39,10 @@ class AuthController extends GetxController {
   /// [SMITrigger] triggering the blinking animation.
   SMITrigger? blink;
 
-  /// [GlobalKey] of an animated button used to share it between overlays.
+  /// [GlobalKey] of the button opening the [Language] selection.
   final GlobalKey languageKey = GlobalKey();
 
-  /// [Timer] periodically increasing [logoFrame].
+  /// [Timer] periodically increasing the [logoFrame].
   Timer? _animationTimer;
 
   /// Returns user authentication status.

diff --git a/lib/ui/page/auth/view.dart b/lib/ui/page/auth/view.dart
@@ -57,7 +57,7 @@ class AuthView extends StatelessWidget {
           ...List.generate(10, (i) => 'assets/images/logo/logo000$i.svg')
               .map((e) => Offstage(child: SvgLoader.asset(e)))
               .toList(),
-          ...List.generate(10, (i) => 'assets/images/logo/logo000$i.svg')
+          ...List.generate(10, (i) => 'assets/images/logo/head000$i.svg')
               .map((e) => Offstage(child: SvgLoader.asset(e)))
               .toList(),
           const SizedBox(height: 30),
@@ -134,37 +134,34 @@ class AuthView extends StatelessWidget {
 
         // Language selection popup.
         Widget language = CupertinoButton(
-            key: c.languageKey,
-            child: Text(
-              '${L10n.chosen.value!.locale.countryCode}, ${L10n.chosen.value!.name}',
-              style: thin?.copyWith(fontSize: 13, color: primary),
-            ),
-            onPressed: () async {
-              await Selector.show<Language>(
-                context,
-                items: L10n.languages,
-                itemBuilder: (Language lang) => Row(
-                  children: [
-                    Text(
-                      lang.name,
-                      style: thin?.copyWith(
-                        fontSize: 15,
-                      ),
-                    ),
-                    const Spacer(),
-                    Text(
-                      lang.locale.languageCode.toUpperCase(),
-                      style: thin?.copyWith(
-                        fontSize: 15,
-                      ),
-                    ),
-                  ],
+          key: c.languageKey,
+          child: Text(
+            '${L10n.chosen.value!.locale.countryCode}, ${L10n.chosen.value!.name}',
+            style: thin?.copyWith(fontSize: 13, color: primary),
+          ),
+          onPressed: () => Selector.show<Language>(
+            context: context,
+            buttonKey: c.languageKey,
+            initial: L10n.chosen.value!,
+            items: L10n.languages,
+            onSelected: (l) => L10n.set(l),
+            debounce:
+                context.isMobile ? const Duration(milliseconds: 500) : null,
+            itemBuilder: (Language e) => Row(
+              children: [
+                Text(
+                  e.name,
+                  style: thin?.copyWith(fontSize: 15),
+                ),
+                const Spacer(),
+                Text(
+                  e.locale.languageCode.toUpperCase(),
+                  style: thin?.copyWith(fontSize: 15),
                 ),
-                initialValue: L10n.chosen.value!,
-                globalKey: c.languageKey,
-                onSelect: (selected) => L10n.set(selected),
-              );
-            });
+              ],
+            ),
+          ),
+        );
 
         // Footer part of the page.
         List<Widget> footer = [

diff --git a/lib/ui/page/home/page/settings/controller.dart b/lib/ui/page/home/page/settings/controller.dart
@@ -14,6 +14,7 @@
 // along with this program. If not, see
 // <https://www.gnu.org/licenses/agpl-3.0.html>.
 
+import 'package:flutter/widgets.dart' show GlobalKey;
 import 'package:get/get.dart';
 
 import '/domain/model/application_settings.dart';
@@ -24,6 +25,9 @@ import '/l10n/l10n.dart';
 class SettingsController extends GetxController {
   SettingsController(this._settingsRepo);
 
+  /// [GlobalKey] of a button opening the [Language] selection.
+  final GlobalKey languageKey = GlobalKey();
+
   /// Settings repository, used to update the [ApplicationSettings].
   final AbstractSettingsRepository _settingsRepo;
 

diff --git a/lib/ui/page/home/page/settings/view.dart b/lib/ui/page/home/page/settings/view.dart
@@ -19,6 +19,8 @@ import 'package:get/get.dart';
 
 import '/l10n/l10n.dart';
 import '/routes.dart';
+import '/ui/widget/selector.dart';
+import '/util/platform_utils.dart';
 import 'controller.dart';
 
 /// View of the [Routes.settings] page.
@@ -52,32 +54,43 @@ class SettingsView extends StatelessWidget {
                   ],
                 ),
               ),
-              ListTile(
-                title: ConstrainedBox(
-                  constraints: const BoxConstraints(maxWidth: 200),
-                  child: Obx(
-                    () => DropdownButton<Language>(
-                      key: const Key('LanguageDropdown'),
-                      value: L10n.chosen.value,
-                      items:
-                          L10n.languages.map<DropdownMenuItem<Language>>((e) {
-                        return DropdownMenuItem(
-                          key: Key(
-                              'Language_${e.locale.languageCode}${e.locale.countryCode}'),
-                          value: e,
-                          child: Text('${e.locale.countryCode}, ${e.name}'),
-                        );
-                      }).toList(),
-                      onChanged: c.setLocale,
-                      borderRadius: BorderRadius.circular(18),
-                      style: TextStyle(
-                        color: Theme.of(context).colorScheme.primary,
-                        fontSize: 15,
-                      ),
-                      icon: const SizedBox(),
-                      underline: const SizedBox(),
-                    ),
+              KeyedSubtree(
+                key: c.languageKey,
+                child: ListTile(
+                  key: const Key('LanguageDropdown'),
+                  title: Text(
+                    '${L10n.chosen.value!.locale.countryCode}, ${L10n.chosen.value!.name}',
                   ),
+                  onTap: () async {
+                    final TextStyle? thin = context.textTheme.caption
+                        ?.copyWith(color: Colors.black);
+                    await Selector.show<Language>(
+                      context: context,
+                      buttonKey: c.languageKey,
+                      alignment: Alignment.bottomCenter,
+                      items: L10n.languages,
+                      initial: L10n.chosen.value!,
+                      onSelected: (l) => L10n.set(l),
+                      debounce: context.isMobile
+                          ? const Duration(milliseconds: 500)
+                          : null,
+                      itemBuilder: (Language e) => Row(
+                        key: Key(
+                            'Language_${e.locale.languageCode}${e.locale.countryCode}'),
+                        children: [
+                          Text(
+                            e.name,
+                            style: thin?.copyWith(fontSize: 15),
+                          ),
+                          const Spacer(),
+                          Text(
+                            e.locale.languageCode.toUpperCase(),
+                            style: thin?.copyWith(fontSize: 15),
+                          ),
+                        ],
+                      ),
+                    );
+                  },
                 ),
               )
             ],