Redesign Auth page

.github/workflows/ci.yml

@@ -126,13 +126,14 @@ jobs:
 
       - run: sudo apt-get update -y
         if: ${{ matrix.platform == 'linux' }}
-      - run: sudo apt-get install -y
+      - run: sudo apt-get install -y --allow-downgrades
                           ninja-build
                           libunwind-dev
                           libgtk-3-dev
                           libgstreamer1.0-dev
                           libgstreamer-plugins-base1.0-dev
                           libpulse-dev
+                          libudev1=249.11-0ubuntu3
         if: ${{ matrix.platform == 'linux' }}
 
       - run: flutter config --enable-${{ matrix.platform }}-desktop

CHANGELOG.md

@@ -18,10 +18,17 @@ All user visible changes to this project will be documented in this file. This p
 - UI:
     - Chat page:
         - Missing avatars in group creation popup ([#15], [#2]).
+
+### Changed
+
+- UI:
+    - Auth page:
+        - New auth page design ([#29])
 
 [#2]: /../../issues/2
 [#14]: /../../pull/14
 [#15]: /../../pull/15
+[#29]: /../../pull/29
 
 
 

lib/l10n/en_us.dart

@@ -90,7 +90,7 @@ final Map<String, String> enUS = {
   'btn_resend_code': 'Resend confirmation code',
   'btn_saved_messages': 'Saved messages',
   'btn_settings': 'Settings',
-  'btn_start_chatting': 'Start chatting',
+  'btn_start': 'Start',
   'btn_submit': 'Submit',
   'btn_video_call': 'Video call',
   'btn_write_message': 'Write a message',

lib/l10n/ru_ru.dart

@@ -91,7 +91,7 @@ final Map<String, String> ruRU = {
   'btn_resend_code': 'Отправить код ещё раз',
   'btn_saved_messages': 'Сохранённые сообщения',
   'btn_settings': 'Настройки',
-  'btn_start_chatting': 'Начать общение',
+  'btn_start': 'Начать',
   'btn_submit': 'Применить',
   'btn_your_profile': 'Ваш профиль',
   'btn_write_message': 'Написать сообщение',

lib/ui/page/auth/controller.dart

@@ -16,9 +16,12 @@
 
 import 'dart:async';
 
+import 'package:flutter/widgets.dart' show GlobalKey;
 import 'package:get/get.dart';
+import 'package:rive/rive.dart';
 
 import '/domain/service/auth.dart';
+import '/l10n/_l10n.dart';
 import '/routes.dart';
 import '/util/message_popup.dart';
 
@@ -34,12 +37,48 @@ class AuthController extends GetxController {
   /// Current logo's animation frame.
   RxInt logoFrame = RxInt(0);
 
+  /// Index number of selected language.
+  late final RxInt selectedLanguage;
+
+  /// Prevents instant language change after the user has set
+  ///  [selectedLanguage].
+  late final Worker _languageDebounce;
+
+  /// A trigger of blink logo animation.
+  SMITrigger? blink;
+
+  /// [GlobalKey] of an animated button used to share it between overlays.
+  final GlobalKey languageKey = GlobalKey();
+
   /// Timer that periodically increases [logoFrame].
   Timer? _animationTimer;
 
   /// Returns user authentication status.
   Rx<RxStatus> get authStatus => _auth.status;
 
+  @override
+  void onInit() {
+    selectedLanguage = RxInt(L10n.languages.keys.toList().indexOf(L10n.chosen));
+    _languageDebounce = debounce(
+      selectedLanguage,
+      (int i) {
+        L10n.chosen = L10n.languages.keys.elementAt(i);
+        Get.updateLocale(L10n.locales[L10n.chosen]!);
+      },
+      time: 500.milliseconds,
+    );
+
+    super.onInit();
+  }
+
+  @override
+  void onClose() {
+    _animationTimer?.cancel();
+    blink?.controller.dispose();
+    _languageDebounce.dispose();
+    super.onClose();
+  }
+
   @override
   void onReady() => Future.delayed(const Duration(milliseconds: 500), animate);
 
@@ -56,6 +95,8 @@ class AuthController extends GetxController {
 
   /// Resets the [logoFrame] and starts the animation.
   void animate() {
+    blink?.fire();
+
     logoFrame.value = 1;
     _animationTimer?.cancel();
     _animationTimer = Timer.periodic(const Duration(milliseconds: 45), (t) {