mirror of
https://github.com/cypherstack/stack_wallet.git
synced 2025-01-03 17:29:23 +00:00
update onion animation and some tor settings refactoring
This commit is contained in:
parent
b148ae2ad4
commit
4ca352e713
3 changed files with 186 additions and 147 deletions
File diff suppressed because one or more lines are too long
|
@ -75,7 +75,7 @@ class _TorSettingsViewState extends ConsumerState<TorSettingsView> {
|
||||||
useSafeArea: false,
|
useSafeArea: false,
|
||||||
barrierDismissible: true,
|
barrierDismissible: true,
|
||||||
builder: (context) {
|
builder: (context) {
|
||||||
return const StackDialog(
|
return StackDialog(
|
||||||
title: "What is Tor?",
|
title: "What is Tor?",
|
||||||
message:
|
message:
|
||||||
"Short for \"The Onion Router\", is an open-source software that enables internet communication"
|
"Short for \"The Onion Router\", is an open-source software that enables internet communication"
|
||||||
|
@ -83,6 +83,7 @@ class _TorSettingsViewState extends ConsumerState<TorSettingsView> {
|
||||||
" to obscure the origin and destination of data.",
|
" to obscure the origin and destination of data.",
|
||||||
rightButton: SecondaryButton(
|
rightButton: SecondaryButton(
|
||||||
label: "Close",
|
label: "Close",
|
||||||
|
onPressed: Navigator.of(context).pop,
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
@ -144,7 +145,7 @@ class _TorSettingsViewState extends ConsumerState<TorSettingsView> {
|
||||||
useSafeArea: false,
|
useSafeArea: false,
|
||||||
barrierDismissible: true,
|
barrierDismissible: true,
|
||||||
builder: (context) {
|
builder: (context) {
|
||||||
return const StackDialog(
|
return StackDialog(
|
||||||
title: "What is Tor killswitch?",
|
title: "What is Tor killswitch?",
|
||||||
message:
|
message:
|
||||||
"A security feature that protects your information from accidental exposure by"
|
"A security feature that protects your information from accidental exposure by"
|
||||||
|
@ -152,6 +153,8 @@ class _TorSettingsViewState extends ConsumerState<TorSettingsView> {
|
||||||
" connection is disrupted or compromised.",
|
" connection is disrupted or compromised.",
|
||||||
rightButton: SecondaryButton(
|
rightButton: SecondaryButton(
|
||||||
label: "Close",
|
label: "Close",
|
||||||
|
onPressed:
|
||||||
|
Navigator.of(context).pop,
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
@ -243,54 +246,31 @@ class _TorAnimatedButtonState extends ConsumerState<TorAnimatedButton>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Color _color(
|
Future<void> _playConnecting() async {
|
||||||
TorConnectionStatus status,
|
|
||||||
StackColors colors,
|
|
||||||
) {
|
|
||||||
switch (status) {
|
|
||||||
case TorConnectionStatus.disconnected:
|
|
||||||
return colors.textSubtitle3;
|
|
||||||
|
|
||||||
case TorConnectionStatus.connected:
|
|
||||||
return colors.accentColorGreen;
|
|
||||||
|
|
||||||
case TorConnectionStatus.connecting:
|
|
||||||
return colors.accentColorYellow;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
String _label(
|
|
||||||
TorConnectionStatus status,
|
|
||||||
) {
|
|
||||||
switch (status) {
|
|
||||||
case TorConnectionStatus.disconnected:
|
|
||||||
return "CONNECT";
|
|
||||||
|
|
||||||
case TorConnectionStatus.connected:
|
|
||||||
return "STOP";
|
|
||||||
|
|
||||||
case TorConnectionStatus.connecting:
|
|
||||||
return "CONNECTING";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
void _playConnecting() async {
|
|
||||||
await _play(
|
await _play(
|
||||||
from: "connection-start",
|
from: "connecting-start",
|
||||||
to: "connection-end",
|
to: "connecting-end",
|
||||||
repeat: true,
|
repeat: true,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
void _playConnected() async {
|
Future<void> _playConnectingDone() async {
|
||||||
await _play(
|
await _play(
|
||||||
from: "connection-end",
|
from: "connecting-end",
|
||||||
to: "disconnection-start",
|
to: "connected-start",
|
||||||
|
repeat: false,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
Future<void> _playConnected() async {
|
||||||
|
await _play(
|
||||||
|
from: "connected-start",
|
||||||
|
to: "connected-end",
|
||||||
repeat: true,
|
repeat: true,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
void _playDisconnect() async {
|
Future<void> _playDisconnect() async {
|
||||||
await _play(
|
await _play(
|
||||||
from: "disconnection-start",
|
from: "disconnection-start",
|
||||||
to: "disconnection-end",
|
to: "disconnection-end",
|
||||||
|
@ -308,6 +288,8 @@ class _TorAnimatedButtonState extends ConsumerState<TorAnimatedButton>
|
||||||
final start = composition.getMarker(from)!.start;
|
final start = composition.getMarker(from)!.start;
|
||||||
final end = composition.getMarker(to)!.start;
|
final end = composition.getMarker(to)!.start;
|
||||||
|
|
||||||
|
controller1.value = start;
|
||||||
|
|
||||||
if (repeat) {
|
if (repeat) {
|
||||||
await controller1.repeat(
|
await controller1.repeat(
|
||||||
min: start,
|
min: start,
|
||||||
|
@ -348,19 +330,20 @@ class _TorAnimatedButtonState extends ConsumerState<TorAnimatedButton>
|
||||||
final width = MediaQuery.of(context).size.width / 1.5;
|
final width = MediaQuery.of(context).size.width / 1.5;
|
||||||
|
|
||||||
return TorSubscription(
|
return TorSubscription(
|
||||||
onTorStatusChanged: (status) {
|
onTorStatusChanged: (status) async {
|
||||||
_status = status;
|
_status = status;
|
||||||
switch (_status) {
|
switch (_status) {
|
||||||
case TorConnectionStatus.disconnected:
|
case TorConnectionStatus.disconnected:
|
||||||
_playDisconnect();
|
await _playDisconnect();
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case TorConnectionStatus.connected:
|
case TorConnectionStatus.connected:
|
||||||
_playConnected();
|
await _playConnectingDone();
|
||||||
|
await _playConnected();
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case TorConnectionStatus.connecting:
|
case TorConnectionStatus.connecting:
|
||||||
_playConnecting();
|
await _playConnecting();
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -381,21 +364,8 @@ class _TorAnimatedButtonState extends ConsumerState<TorAnimatedButton>
|
||||||
// height: width,
|
// height: width,
|
||||||
onLoaded: (composition) {
|
onLoaded: (composition) {
|
||||||
_completer.complete(composition);
|
_completer.complete(composition);
|
||||||
// setState(() {
|
|
||||||
controller1.duration = composition.duration;
|
controller1.duration = composition.duration;
|
||||||
|
|
||||||
// TODO: clean up (waiting for updated onion lottie animation file)
|
|
||||||
// });
|
|
||||||
print(
|
|
||||||
"=======================================================");
|
|
||||||
|
|
||||||
composition.markers.forEach((e) {
|
|
||||||
print(e.name);
|
|
||||||
});
|
|
||||||
print(
|
|
||||||
"=======================================================");
|
|
||||||
//
|
|
||||||
|
|
||||||
if (_status == TorConnectionStatus.connected) {
|
if (_status == TorConnectionStatus.connected) {
|
||||||
_playConnected();
|
_playConnected();
|
||||||
} else if (_status == TorConnectionStatus.connecting) {
|
} else if (_status == TorConnectionStatus.connecting) {
|
||||||
|
@ -404,19 +374,7 @@ class _TorAnimatedButtonState extends ConsumerState<TorAnimatedButton>
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
Text(
|
const UpperCaseTorText(),
|
||||||
_label(
|
|
||||||
_status,
|
|
||||||
),
|
|
||||||
style: STextStyles.pageTitleH2(
|
|
||||||
context,
|
|
||||||
).copyWith(
|
|
||||||
color: _color(
|
|
||||||
_status,
|
|
||||||
Theme.of(context).extension<StackColors>()!,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
)
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
@ -546,6 +504,78 @@ class _TorButtonState extends ConsumerState<TorButton> {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class UpperCaseTorText extends ConsumerStatefulWidget {
|
||||||
|
const UpperCaseTorText({super.key});
|
||||||
|
|
||||||
|
@override
|
||||||
|
ConsumerState<UpperCaseTorText> createState() => _UpperCaseTorTextState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _UpperCaseTorTextState extends ConsumerState<UpperCaseTorText> {
|
||||||
|
late TorConnectionStatus _status;
|
||||||
|
|
||||||
|
Color _color(
|
||||||
|
TorConnectionStatus status,
|
||||||
|
StackColors colors,
|
||||||
|
) {
|
||||||
|
switch (status) {
|
||||||
|
case TorConnectionStatus.disconnected:
|
||||||
|
return colors.textSubtitle3;
|
||||||
|
|
||||||
|
case TorConnectionStatus.connected:
|
||||||
|
return colors.accentColorGreen;
|
||||||
|
|
||||||
|
case TorConnectionStatus.connecting:
|
||||||
|
return colors.accentColorYellow;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
String _label(
|
||||||
|
TorConnectionStatus status,
|
||||||
|
) {
|
||||||
|
switch (status) {
|
||||||
|
case TorConnectionStatus.disconnected:
|
||||||
|
return "CONNECT";
|
||||||
|
|
||||||
|
case TorConnectionStatus.connected:
|
||||||
|
return "STOP";
|
||||||
|
|
||||||
|
case TorConnectionStatus.connecting:
|
||||||
|
return "CONNECTING";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
void initState() {
|
||||||
|
_status = ref.read(pTorService).status;
|
||||||
|
|
||||||
|
super.initState();
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return TorSubscription(
|
||||||
|
onTorStatusChanged: (status) {
|
||||||
|
setState(() {
|
||||||
|
_status = status;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
child: Text(
|
||||||
|
_label(
|
||||||
|
_status,
|
||||||
|
),
|
||||||
|
style: STextStyles.pageTitleH2(
|
||||||
|
context,
|
||||||
|
).copyWith(
|
||||||
|
color: _color(
|
||||||
|
_status,
|
||||||
|
Theme.of(context).extension<StackColors>()!,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/// Connect to the Tor network.
|
/// Connect to the Tor network.
|
||||||
///
|
///
|
||||||
/// This method is called when the user taps the "Connect" button.
|
/// This method is called when the user taps the "Connect" button.
|
||||||
|
|
|
@ -219,8 +219,21 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
children: [
|
children: [
|
||||||
Row(
|
Row(
|
||||||
mainAxisAlignment:
|
mainAxisAlignment:
|
||||||
MainAxisAlignment.end,
|
MainAxisAlignment
|
||||||
|
.spaceBetween,
|
||||||
children: [
|
children: [
|
||||||
|
Padding(
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.only(
|
||||||
|
left: 32,
|
||||||
|
),
|
||||||
|
child: Text(
|
||||||
|
"What is Tor?",
|
||||||
|
style:
|
||||||
|
STextStyles.desktopH2(
|
||||||
|
context),
|
||||||
|
),
|
||||||
|
),
|
||||||
DesktopDialogCloseButton(
|
DesktopDialogCloseButton(
|
||||||
onPressedOverride: () =>
|
onPressedOverride: () =>
|
||||||
Navigator.of(context)
|
Navigator.of(context)
|
||||||
|
@ -229,20 +242,13 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
Padding(
|
Padding(
|
||||||
padding: const EdgeInsets.all(20),
|
padding: const EdgeInsets.only(
|
||||||
child: Column(
|
top: 12,
|
||||||
mainAxisSize: MainAxisSize.max,
|
left: 32,
|
||||||
children: [
|
bottom: 32,
|
||||||
Text(
|
right: 32,
|
||||||
"What is Tor?",
|
|
||||||
style:
|
|
||||||
STextStyles.desktopH2(
|
|
||||||
context),
|
|
||||||
),
|
),
|
||||||
const SizedBox(
|
child: Text(
|
||||||
height: 20,
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
"Short for \"The Onion Router\", is an open-source software that enables internet communication"
|
"Short for \"The Onion Router\", is an open-source software that enables internet communication"
|
||||||
" to remain anonymous by routing internet traffic through a series of layered nodes,"
|
" to remain anonymous by routing internet traffic through a series of layered nodes,"
|
||||||
" to obscure the origin and destination of data.",
|
" to obscure the origin and destination of data.",
|
||||||
|
@ -251,13 +257,10 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
context)
|
context)
|
||||||
.copyWith(
|
.copyWith(
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.extension<
|
.extension<StackColors>()!
|
||||||
StackColors>()!
|
|
||||||
.textDark3,
|
.textDark3,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
|
@ -289,12 +292,11 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
children: [
|
children: [
|
||||||
Row(
|
Row(
|
||||||
children: [
|
children: [
|
||||||
RichText(
|
Column(
|
||||||
textAlign: TextAlign.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
text: TextSpan(
|
|
||||||
children: [
|
children: [
|
||||||
TextSpan(
|
Text(
|
||||||
text: "Tor killswitch",
|
"Tor killswitch",
|
||||||
style: STextStyles.desktopTextExtraExtraSmall(
|
style: STextStyles.desktopTextExtraExtraSmall(
|
||||||
context)
|
context)
|
||||||
.copyWith(
|
.copyWith(
|
||||||
|
@ -302,8 +304,13 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
.extension<StackColors>()!
|
.extension<StackColors>()!
|
||||||
.textDark),
|
.textDark),
|
||||||
),
|
),
|
||||||
TextSpan(
|
const SizedBox(
|
||||||
text: "\nWhat is Tor killswitch?",
|
height: 8,
|
||||||
|
),
|
||||||
|
RichText(
|
||||||
|
textAlign: TextAlign.start,
|
||||||
|
text: TextSpan(
|
||||||
|
text: "What is Tor killswitch?",
|
||||||
style: STextStyles.richLink(context).copyWith(
|
style: STextStyles.richLink(context).copyWith(
|
||||||
fontSize: 14,
|
fontSize: 14,
|
||||||
),
|
),
|
||||||
|
@ -321,8 +328,20 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
children: [
|
children: [
|
||||||
Row(
|
Row(
|
||||||
mainAxisAlignment:
|
mainAxisAlignment:
|
||||||
MainAxisAlignment.end,
|
MainAxisAlignment
|
||||||
|
.spaceBetween,
|
||||||
children: [
|
children: [
|
||||||
|
Padding(
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.only(
|
||||||
|
left: 32,
|
||||||
|
),
|
||||||
|
child: Text(
|
||||||
|
"What is Tor killswitch?",
|
||||||
|
style: STextStyles
|
||||||
|
.desktopH2(context),
|
||||||
|
),
|
||||||
|
),
|
||||||
DesktopDialogCloseButton(
|
DesktopDialogCloseButton(
|
||||||
onPressedOverride: () =>
|
onPressedOverride: () =>
|
||||||
Navigator.of(context)
|
Navigator.of(context)
|
||||||
|
@ -332,20 +351,13 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
),
|
),
|
||||||
Padding(
|
Padding(
|
||||||
padding:
|
padding:
|
||||||
const EdgeInsets.all(20),
|
const EdgeInsets.only(
|
||||||
child: Column(
|
top: 12,
|
||||||
mainAxisSize:
|
left: 32,
|
||||||
MainAxisSize.max,
|
bottom: 32,
|
||||||
children: [
|
right: 32,
|
||||||
Text(
|
|
||||||
"What is Tor killswitch?",
|
|
||||||
style: STextStyles
|
|
||||||
.desktopH2(context),
|
|
||||||
),
|
),
|
||||||
const SizedBox(
|
child: Text(
|
||||||
height: 20,
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
"A security feature that protects your information from accidental exposure by"
|
"A security feature that protects your information from accidental exposure by"
|
||||||
" disconnecting your device from the Tor network if the"
|
" disconnecting your device from the Tor network if the"
|
||||||
" connection is disrupted or compromised.",
|
" connection is disrupted or compromised.",
|
||||||
|
@ -353,15 +365,12 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
.desktopTextMedium(
|
.desktopTextMedium(
|
||||||
context)
|
context)
|
||||||
.copyWith(
|
.copyWith(
|
||||||
color: Theme.of(
|
color: Theme.of(context)
|
||||||
context)
|
|
||||||
.extension<
|
.extension<
|
||||||
StackColors>()!
|
StackColors>()!
|
||||||
.textDark3,
|
.textDark3,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
|
@ -370,8 +379,8 @@ class _TorSettingsState extends ConsumerState<TorSettings> {
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
],
|
|
||||||
),
|
),
|
||||||
|
],
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
|
|
Loading…
Reference in a new issue