Merge pull request #864 from tom-anders/input_method

feat: support changing input method in settings (tap+drag, tag, drag)
lichess-org · Jul 18, 2024 · 64160cb · 64160cb
2 parents 66cae78 + b32ceaa
commit 64160cb
Show file tree

Hide file tree

Showing 9 changed files with 128 additions and 7 deletions.
diff --git a/lib/src/model/settings/board_preferences.dart b/lib/src/model/settings/board_preferences.dart
@@ -1,6 +1,6 @@
 import 'dart:convert';
 
-import 'package:chessground/chessground.dart' hide BoardTheme;
+import 'package:chessground/chessground.dart';
 import 'package:flutter/widgets.dart';
 import 'package:freezed_annotation/freezed_annotation.dart';
 import 'package:lichess_mobile/src/db/shared_preferences.dart';
@@ -33,6 +33,10 @@ class BoardPreferences extends _$BoardPreferences {
     await _save(state.copyWith(boardTheme: boardTheme));
   }
 
+  Future<void> setPieceShiftMethod(PieceShiftMethod pieceShiftMethod) async {
+    await _save(state.copyWith(pieceShiftMethod: pieceShiftMethod));
+  }
+
   Future<void> toggleHapticFeedback() {
     return _save(state.copyWith(hapticFeedback: !state.hapticFeedback));
   }
@@ -91,6 +95,7 @@ class BoardPrefs with _$BoardPrefs {
     required bool coordinates,
     required bool pieceAnimation,
     required bool showMaterialDifference,
+    required PieceShiftMethod pieceShiftMethod,
   }) = _BoardPrefs;
 
   static const defaults = BoardPrefs(
@@ -103,6 +108,7 @@ class BoardPrefs with _$BoardPrefs {
     coordinates: true,
     pieceAnimation: true,
     showMaterialDifference: true,
+    pieceShiftMethod: PieceShiftMethod.either,
   );
 
   factory BoardPrefs.fromJson(Map<String, dynamic> json) {

diff --git a/lib/src/view/analysis/analysis_screen.dart b/lib/src/view/analysis/analysis_screen.dart
@@ -515,6 +515,7 @@ class _BoardState extends ConsumerState<_Board> {
           onCompleteShape: _onCompleteShape,
           onClearShapes: _onClearShapes,
         ),
+        pieceShiftMethod: boardPrefs.pieceShiftMethod,
       ),
     );
   }

diff --git a/lib/src/view/settings/board_behavior_settings_screen.dart b/lib/src/view/settings/board_behavior_settings_screen.dart
@@ -1,10 +1,14 @@
+import 'package:chessground/chessground.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:lichess_mobile/src/model/settings/board_preferences.dart';
 import 'package:lichess_mobile/src/utils/android.dart';
 import 'package:lichess_mobile/src/utils/l10n_context.dart';
+import 'package:lichess_mobile/src/utils/navigation.dart';
 import 'package:lichess_mobile/src/utils/screen.dart';
+import 'package:lichess_mobile/src/view/settings/piece_shift_method_settings_screen.dart';
+import 'package:lichess_mobile/src/widgets/adaptive_choice_picker.dart';
 import 'package:lichess_mobile/src/widgets/list.dart';
 import 'package:lichess_mobile/src/widgets/platform.dart';
 import 'package:lichess_mobile/src/widgets/settings.dart';
@@ -51,6 +55,36 @@ class _Body extends ConsumerWidget {
             hasLeading: false,
             showDivider: false,
             children: [
+              SettingsListTile(
+                settingsLabel: Text(context.l10n.preferencesHowDoYouMovePieces),
+                settingsValue:
+                    pieceShiftMethodl10n(context, boardPrefs.pieceShiftMethod),
+                onTap: () {
+                  if (Theme.of(context).platform == TargetPlatform.android) {
+                    showChoicePicker(
+                      context,
+                      choices: PieceShiftMethod.values,
+                      selectedItem: boardPrefs.pieceShiftMethod,
+                      labelBuilder: (t) =>
+                          Text(pieceShiftMethodl10n(context, t)),
+                      onSelectedItemChanged: (PieceShiftMethod? value) {
+                        ref
+                            .read(boardPreferencesProvider.notifier)
+                            .setPieceShiftMethod(
+                              value ?? PieceShiftMethod.either,
+                            );
+                      },
+                    );
+                  } else {
+                    pushPlatformRoute(
+                      context,
+                      title: context.l10n.preferencesHowDoYouMovePieces,
+                      builder: (context) =>
+                          const PieceShiftMethodSettingsScreen(),
+                    );
+                  }
+                },
+              ),
               SwitchSettingTile(
                 title: Text(context.l10n.mobileSettingsHapticFeedback),
                 value: boardPrefs.hapticFeedback,

diff --git a/lib/src/view/settings/piece_shift_method_settings_screen.dart b/lib/src/view/settings/piece_shift_method_settings_screen.dart
@@ -0,0 +1,79 @@
+import 'package:chessground/chessground.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:lichess_mobile/src/model/settings/board_preferences.dart';
+import 'package:lichess_mobile/src/utils/l10n_context.dart';
+import 'package:lichess_mobile/src/widgets/platform.dart';
+import 'package:lichess_mobile/src/widgets/settings.dart';
+
+class PieceShiftMethodSettingsScreen extends StatelessWidget {
+  const PieceShiftMethodSettingsScreen({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return PlatformWidget(
+      androidBuilder: _androidBuilder,
+      iosBuilder: _iosBuilder,
+    );
+  }
+
+  Widget _androidBuilder(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(title: Text(context.l10n.preferencesHowDoYouMovePieces)),
+      body: _Body(),
+    );
+  }
+
+  Widget _iosBuilder(BuildContext context) {
+    return CupertinoPageScaffold(
+      navigationBar: const CupertinoNavigationBar(),
+      child: _Body(),
+    );
+  }
+}
+
+String pieceShiftMethodl10n(
+  BuildContext context,
+  PieceShiftMethod pieceShiftMethod,
+) =>
+    switch (pieceShiftMethod) {
+      // This is called 'Either' in the Web UI, but in the app we might display this string
+      // without having the other values as context, so we need to be more explicit.
+      // TODO add this to mobile translations
+      PieceShiftMethod.either => 'Click or drag pieces',
+      PieceShiftMethod.drag => context.l10n.preferencesDragPiece,
+      // TODO This string uses 'click', we might want to use 'tap' instead in a mobile-specific translation
+      PieceShiftMethod.tapTwoSquares => context.l10n.preferencesClickTwoSquares,
+    };
+
+class _Body extends ConsumerWidget {
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final pieceShiftMethod = ref.watch(
+      boardPreferencesProvider.select(
+        (state) => state.pieceShiftMethod,
+      ),
+    );
+
+    void onChanged(PieceShiftMethod? value) {
+      ref
+          .read(boardPreferencesProvider.notifier)
+          .setPieceShiftMethod(value ?? PieceShiftMethod.either);
+    }
+
+    return SafeArea(
+      child: ListView(
+        children: [
+          ChoicePicker(
+            notchedTile: true,
+            choices: PieceShiftMethod.values,
+            selectedItem: pieceShiftMethod,
+            titleBuilder: (t) => Text(pieceShiftMethodl10n(context, t)),
+            onSelectedItemChanged: onChanged,
+          ),
+        ],
+      ),
+    );
+  }
+}
diff --git a/lib/src/widgets/board_preview.dart b/lib/src/widgets/board_preview.dart
@@ -1,4 +1,4 @@
-import 'package:chessground/chessground.dart' hide BoardTheme;
+import 'package:chessground/chessground.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';

diff --git a/lib/src/widgets/board_table.dart b/lib/src/widgets/board_table.dart
@@ -1,4 +1,4 @@
-import 'package:chessground/chessground.dart' hide BoardTheme;
+import 'package:chessground/chessground.dart';
 import 'package:collection/collection.dart';
 import 'package:fast_immutable_collections/fast_immutable_collections.dart';
 import 'package:flutter/cupertino.dart';
@@ -162,6 +162,7 @@ class _BoardTableState extends ConsumerState<BoardTable> {
             onCompleteShape: _onCompleteShape,
             onClearShapes: _onClearShapes,
           ),
+          pieceShiftMethod: boardPrefs.pieceShiftMethod,
         );
 
         final settings = widget.boardSettingsOverrides != null

diff --git a/lib/src/widgets/board_thumbnail.dart b/lib/src/widgets/board_thumbnail.dart
@@ -1,4 +1,4 @@
-import 'package:chessground/chessground.dart' hide BoardTheme;
+import 'package:chessground/chessground.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:lichess_mobile/src/constants.dart';

diff --git a/pubspec.lock b/pubspec.lock
@@ -186,10 +186,10 @@ packages:
     dependency: "direct main"
     description:
       name: chessground
-      sha256: f5b97003ace24c105bad63e2e6ee3d33fa7c55c3c55678f904c80dbd7d0c2e20
+      sha256: "44b2f20c8df56d7f42c5d10c68dc8b79f766db65f9f1b4cca45c4d30579d4e57"
       url: "https://pub.dev"
     source: hosted
-    version: "3.1.2"
+    version: "3.2.0"
   ci:
     dependency: transitive
     description:

diff --git a/pubspec.yaml b/pubspec.yaml
@@ -10,7 +10,7 @@ environment:
 dependencies:
   async: ^2.10.0
   cached_network_image: ^3.2.2
-  chessground: ^3.1.1
+  chessground: ^3.2.0
   collection: ^1.17.0
   connectivity_plus: ^6.0.2
   cronet_http: ^1.3.1
-Original file line number
+Diff line change
@@ Expand Up / @@ -515,6 +515,7 @@ class _BoardState extends ConsumerState<_Board> { @@
               onCompleteShape: _onCompleteShape,
               onClearShapes: _onClearShapes,
             ),
+            pieceShiftMethod: boardPrefs.pieceShiftMethod,
           ),
         );
       }
@@ Expand Down @@