From 9f5c93f4d84c766f8ba7a981859e07f88fa9aa82 Mon Sep 17 00:00:00 2001 From: reasje Date: Wed, 20 Dec 2023 18:53:42 +0330 Subject: [PATCH 1/3] fix: avoid icons being shown before reload --- .../open_dapp/widgets/drag_down_panel.dart | 158 +++++++++--------- 1 file changed, 82 insertions(+), 76 deletions(-) diff --git a/lib/features/dapps/subfeatures/open_dapp/widgets/drag_down_panel.dart b/lib/features/dapps/subfeatures/open_dapp/widgets/drag_down_panel.dart index b5d2886c..51dc576c 100644 --- a/lib/features/dapps/subfeatures/open_dapp/widgets/drag_down_panel.dart +++ b/lib/features/dapps/subfeatures/open_dapp/widgets/drag_down_panel.dart @@ -35,91 +35,97 @@ class DragDownPanel extends HookConsumerWidget { return Stack( clipBehavior: Clip.hardEdge, children: [ - Container( - height: maxPanelHeight * state.animationController!.value / 1.5, - width: double.infinity, - padding: const EdgeInsetsDirectional.only( - start: Sizes.spaceSmall, - end: Sizes.space2XSmall, - top: Sizes.spaceSmall, - bottom: Sizes.spaceSmall), - decoration: BoxDecoration( - color: ColorsTheme.of(context).primaryBackground, - ), - child: Row( - children: [ - Expanded( - child: Container( - decoration: BoxDecoration( - color: ColorsTheme.of(context).screenBackground, - borderRadius: const BorderRadius.all( - Radius.circular(10), - ), - border: Border.all( - color: ColorsTheme.of(context).screenBackground, - )), - child: Stack( - children: [ - Row( - children: [ - IconButton( - key: const Key('closedAppButton'), - onPressed: () { - presenter.closedApp(); - }, - icon: const Icon( - Icons.close_rounded, - size: 24, - )), - InkWell( - onTap: - presenter.showNetworkDetailsBottomSheet, - child: ChainLogoWidget(logo: logo)), - ], - ), - Center( - child: Row( - mainAxisAlignment: MainAxisAlignment.center, + state.animationController!.value == 0 + ? Container() + : Container( + height: + maxPanelHeight * state.animationController!.value / 1.5, + width: double.infinity, + padding: const EdgeInsetsDirectional.only( + start: Sizes.spaceSmall, + end: Sizes.space2XSmall, + top: Sizes.spaceSmall, + bottom: Sizes.spaceSmall), + decoration: BoxDecoration( + color: ColorsTheme.of(context).primaryBackground, + ), + child: Row( + children: [ + Expanded( + child: Container( + decoration: BoxDecoration( + color: ColorsTheme.of(context).screenBackground, + borderRadius: const BorderRadius.all( + Radius.circular(10), + ), + border: Border.all( + color: + ColorsTheme.of(context).screenBackground, + )), + child: Stack( children: [ - const SizedBox( - width: Sizes.space2XSmall, + Row( + children: [ + IconButton( + key: const Key('closedAppButton'), + onPressed: () { + presenter.closedApp(); + }, + icon: const Icon( + Icons.close_rounded, + size: 24, + )), + InkWell( + onTap: presenter + .showNetworkDetailsBottomSheet, + child: ChainLogoWidget(logo: logo)), + ], ), - isSecure - ? Icon( - Icons.lock_rounded, - color: - ColorsTheme.of(context).textPrimary, - size: 16, - ) - : Icon( - Icons.warning, - color: ColorsTheme.of(context).mainRed, - size: 16, + Center( + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + const SizedBox( + width: Sizes.space2XSmall, ), - const SizedBox( - width: Sizes.space2XSmall, - ), - InkWell( - onTap: () => presenter.copyUrl(), - child: Text( - url?.host ?? '', - style: FontTheme.of(context) - .body1 - .primary() - .copyWith(fontWeight: FontWeight.w500), - overflow: TextOverflow.ellipsis, + isSecure + ? Icon( + Icons.lock_rounded, + color: ColorsTheme.of(context) + .textPrimary, + size: 16, + ) + : Icon( + Icons.warning, + color: ColorsTheme.of(context) + .mainRed, + size: 16, + ), + const SizedBox( + width: Sizes.space2XSmall, + ), + InkWell( + onTap: () => presenter.copyUrl(), + child: Text( + url?.host ?? '', + style: FontTheme.of(context) + .body1 + .primary() + .copyWith( + fontWeight: FontWeight.w500), + overflow: TextOverflow.ellipsis, + ), + ) + ], ), - ) + ), ], ), ), - ], - ), + ), + ], ), ), - ], - ), - ), Transform.translate( offset: Offset( 0.0, maxPanelHeight * state.animationController!.value / 1.5), From 59efb06c0330d99561b03f8327539e7bfc570fa2 Mon Sep 17 00:00:00 2001 From: reasje Date: Wed, 20 Dec 2023 18:54:15 +0330 Subject: [PATCH 2/3] feat: Added new panel behavior --- .../subfeatures/open_dapp/open_dapp_page.dart | 15 +-- .../open_dapp/open_dapp_presenter.dart | 113 +++++++++++++++--- .../open_dapp/open_dapp_state.dart | 2 - 3 files changed, 95 insertions(+), 35 deletions(-) diff --git a/lib/features/dapps/subfeatures/open_dapp/open_dapp_page.dart b/lib/features/dapps/subfeatures/open_dapp/open_dapp_page.dart index 7d45f9ae..a4052b91 100644 --- a/lib/features/dapps/subfeatures/open_dapp/open_dapp_page.dart +++ b/lib/features/dapps/subfeatures/open_dapp/open_dapp_page.dart @@ -72,17 +72,13 @@ class OpenAppPage extends HookConsumerWidget { chainId: state.network?.chainId, rpcUrl: state.network?.web3RpcHttpUrl, walletAddress: state.account!.address, - pullToRefreshController: state.pullToRefreshController, - // onOverScrolled: (controller, x, y, clampedX, clampedY) => - // presenter.handleOverScroll(y.toDouble()), - onScrollChanged: (controller, x, y) => - presenter.handleScroll(y.toDouble()), isDebug: false, initialUrlRequest: URLRequest( url: Uri.parse(url), ), onLoadStop: (controller, url) { presenter.injectCopyHandling(); + presenter.injectScrollDetector(); }, onLoadError: (controller, url, code, message) => collectLog('onLoadError: $code: $message'), @@ -214,12 +210,3 @@ class OpenAppPage extends HookConsumerWidget { ); } } - -Widget getContainer() { - return Container( - margin: EdgeInsets.symmetric(vertical: 10), - height: 100, - width: double.infinity, - color: Colors.black, - ); -} diff --git a/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart b/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart index be655924..bd7855d9 100644 --- a/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart +++ b/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart @@ -1,3 +1,4 @@ +import 'dart:async'; import 'dart:convert'; import 'package:clipboard/clipboard.dart'; import 'package:datadashwallet/common/common.dart'; @@ -39,14 +40,6 @@ class OpenDAppPresenter extends CompletePresenter { void initState() { super.initState(); - state.pullToRefreshController = PullToRefreshController( - options: PullToRefreshOptions( - backgroundColor: Colors.transparent, - color: Colors.transparent, - enabled: true), - onRefresh: showPanel, - ); - listen( _accountUseCase.account, (value) { @@ -68,7 +61,6 @@ class OpenDAppPresenter extends CompletePresenter { void onWebViewCreated(InAppWebViewController controller) async { notify(() => state.webviewController = controller); - updateCurrentUrl(null); } @@ -549,18 +541,97 @@ class OpenDAppPresenter extends CompletePresenter { final cancelDuration = const Duration(milliseconds: 400); final settleDuration = const Duration(milliseconds: 400); - void handleScroll(double scroll) { - // If opposite direction then get back - final isScrollDownward = scroll > 0; - if (isScrollDownward) { - hidePanel(); - } else { - showPanel(); - } + injectScrollDetector() { + String jsCode = """ + var pStart = { x: 0, y: 0 }; + var pStop = { x: 0, y: 0 }; + + function swipeStart(e) { + if (typeof e["targetTouches"] !== "undefined") { + var touch = e.targetTouches[0]; + pStart.x = touch.screenX; + pStart.y = touch.screenY; + } else { + pStart.x = e.screenX; + pStart.y = e.screenY; + } + } + + function swipeEnd(e) { + if (typeof e["changedTouches"] !== "undefined") { + var touch = e.changedTouches[0]; + pStop.x = touch.screenX; + pStop.y = touch.screenY; + } else { + pStop.x = e.screenX; + pStop.y = e.screenY; + } + + swipeCheck(); + } + + function swipeCheck() { + var changeY = pStart.y - pStop.y; + var changeX = pStart.x - pStop.x; + if (isPullDown(changeY, changeX)) { + window.flutter_inappwebview?.callHandler("axs-scroll-detector", true); + } else if (isPullUp(changeY, changeX)) { + window.flutter_inappwebview?.callHandler("axs-scroll-detector", false); + } + } + + function isPullDown(dY, dX) { + // methods of checking slope, length, direction of line created by swipe action + console.log(dY); + console.log(dX ); + return ( + dY < 0 && + ((Math.abs(dX) <= 100 && Math.abs(dY) >= 100 ) || + (Math.abs(dX) / Math.abs(dY) <= 0.1 && dY >= 60)) + ); + } + + function isPullUp(dY, dX) { + // Check if the gesture is a pull-up + console.log(dY); + console.log(dX); + return ( + dY > 0 && + ((Math.abs(dX) <= 100 && Math.abs(dY) >= 100) || + (Math.abs(dX) / Math.abs(dY) <= 0.1 && dY >= 60)) + ); + } + + document.addEventListener( + "touchstart", + function (e) { + swipeStart(e); + }, + false + ); + document.addEventListener( + "touchend", + function (e) { + swipeEnd(e); + }, + false + ); + """; + state.webviewController!.evaluateJavascript(source: jsCode); + + state.webviewController!.addJavaScriptHandler( + handlerName: 'axs-scroll-detector', + callback: (args) { + if (args[0] is bool) { + args[0] == true ? showPanel() : hidePanel(); + } + }, + ); } + Timer? panelTimer; + void showPanel() async { - state.pullToRefreshController!.endRefreshing(); final status = state.animationController!.status; if (state.animationController!.value != 1 && status == AnimationStatus.completed || @@ -568,6 +639,11 @@ class OpenDAppPresenter extends CompletePresenter { await state.animationController!.animateTo( 1.0, duration: settleDuration, + curve: Curves.ease, + ); + Future.delayed( + const Duration(seconds: 3), + hidePanel, ); } } @@ -594,7 +670,6 @@ class OpenDAppPresenter extends CompletePresenter { doubleTapTime = DateTime.now(); } - void showNetworkDetailsBottomSheet() { showNetworkDetailsDialog(context!, network: state.network!); } diff --git a/lib/features/dapps/subfeatures/open_dapp/open_dapp_state.dart b/lib/features/dapps/subfeatures/open_dapp/open_dapp_state.dart index 04b61fbb..6f649098 100644 --- a/lib/features/dapps/subfeatures/open_dapp/open_dapp_state.dart +++ b/lib/features/dapps/subfeatures/open_dapp/open_dapp_state.dart @@ -7,7 +7,6 @@ class OpenDAppState with EquatableMixin { Account? account; InAppWebViewController? webviewController; AnimationController? animationController; - PullToRefreshController? pullToRefreshController; int progress = 0; Network? network; int panelHideTimer = 5; @@ -21,7 +20,6 @@ class OpenDAppState with EquatableMixin { progress, network, animationController, - pullToRefreshController, currentUrl, isSecure ]; From 75a3bda0403768cc945f91fe4a19075e87eb8bd4 Mon Sep 17 00:00:00 2001 From: reasje Date: Wed, 20 Dec 2023 18:57:19 +0330 Subject: [PATCH 3/3] imprv: Improved over all auto hide panel --- .../subfeatures/open_dapp/open_dapp_presenter.dart | 13 ++++--------- .../open_dapp/widgets/allow_multiple_gestures.dart | 10 ++++++++++ .../subfeatures/open_dapp/widgets/widgets.dart | 1 + 3 files changed, 15 insertions(+), 9 deletions(-) create mode 100644 lib/features/dapps/subfeatures/open_dapp/widgets/widgets.dart diff --git a/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart b/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart index bd7855d9..97a67c8f 100644 --- a/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart +++ b/lib/features/dapps/subfeatures/open_dapp/open_dapp_presenter.dart @@ -54,11 +54,6 @@ class OpenDAppPresenter extends CompletePresenter { }); } - @override - Future dispose() { - return super.dispose(); - } - void onWebViewCreated(InAppWebViewController controller) async { notify(() => state.webviewController = controller); updateCurrentUrl(null); @@ -641,10 +636,7 @@ class OpenDAppPresenter extends CompletePresenter { duration: settleDuration, curve: Curves.ease, ); - Future.delayed( - const Duration(seconds: 3), - hidePanel, - ); + panelTimer = Timer(const Duration(seconds: 3), hidePanel); } } @@ -657,6 +649,9 @@ class OpenDAppPresenter extends CompletePresenter { duration: cancelDuration, curve: Curves.easeInExpo, ); + if (panelTimer != null) { + panelTimer!.cancel(); + } } } diff --git a/lib/features/dapps/subfeatures/open_dapp/widgets/allow_multiple_gestures.dart b/lib/features/dapps/subfeatures/open_dapp/widgets/allow_multiple_gestures.dart index e6818c46..35b33e22 100644 --- a/lib/features/dapps/subfeatures/open_dapp/widgets/allow_multiple_gestures.dart +++ b/lib/features/dapps/subfeatures/open_dapp/widgets/allow_multiple_gestures.dart @@ -16,4 +16,14 @@ class AllowMultipleDoubleTap extends DoubleTapGestureRecognizer { void rejectGesture(int pointer) { acceptGesture(pointer); } + + +} + + +class AllowMultipleVerticalDrag extends VerticalDragGestureRecognizer { + @override + void rejectGesture(int pointer) { + acceptGesture(pointer); + } } diff --git a/lib/features/dapps/subfeatures/open_dapp/widgets/widgets.dart b/lib/features/dapps/subfeatures/open_dapp/widgets/widgets.dart new file mode 100644 index 00000000..5ca8a18a --- /dev/null +++ b/lib/features/dapps/subfeatures/open_dapp/widgets/widgets.dart @@ -0,0 +1 @@ +// export \ No newline at end of file