From 20b2f7df0ab423756bef63510288d6f0e51e972a Mon Sep 17 00:00:00 2001 From: Nikolai Rodionov Date: Fri, 3 May 2024 13:10:06 +0200 Subject: [PATCH] Some updates to the frontend --- lib/components/catalog_card.dart | 49 ---------- lib/components/environment_card.dart | 13 ++- lib/components/environment_preview.dart | 91 +++++++++++++++++ lib/components/environments.dart | 50 +++++----- lib/components/sign_in_form.dart | 103 ------------------- lib/components/sign_up_form.dart | 125 ------------------------ lib/main.dart | 1 - 7 files changed, 129 insertions(+), 303 deletions(-) delete mode 100644 lib/components/catalog_card.dart create mode 100644 lib/components/environment_preview.dart delete mode 100644 lib/components/sign_in_form.dart delete mode 100644 lib/components/sign_up_form.dart diff --git a/lib/components/catalog_card.dart b/lib/components/catalog_card.dart deleted file mode 100644 index 8f0469e..0000000 --- a/lib/components/catalog_card.dart +++ /dev/null @@ -1,49 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:softplayer_web/models/catalog_entry.dart'; - -class CatalogCard extends StatelessWidget { - const CatalogCard({ - super.key, - required this.data, - }); - final List data; - - List createCards(List data) { - List createCards = []; - for (var app in data) { - createCards.add(Card( - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - ListTile( - //leading: Image.network(app.logoUrl), - leading: const Icon(Icons.nfc), - title: Text(app.name), - subtitle: Text(app.description), - ), - Row( - mainAxisAlignment: MainAxisAlignment.end, - children: [ - TextButton( - child: const Text('INSTALL'), - onPressed: () { - print("installing"); - }, - ), - const SizedBox(width: 8), - ], - ), - ], - ), - )); - } - return createCards; - } - - @override - Widget build(BuildContext context) { - return Column( - children: createCards(data), - ); - } -} diff --git a/lib/components/environment_card.dart b/lib/components/environment_card.dart index 280c638..948a9cf 100644 --- a/lib/components/environment_card.dart +++ b/lib/components/environment_card.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:softplayer_web/api/grpc/environments.dart'; +import 'package:softplayer_web/components/environment_preview.dart'; import 'package:softplayer_web/helpers/providers/common.dart'; class EnvirnomentCard extends StatefulWidget { @@ -48,9 +49,17 @@ class _EnvirnomentCardState extends State { elevation: elevation, child: SelectionArea( child: InkWell( - onTap: () => showBottomSheet( + onLongPress: () => showMenu( + position: RelativeRect.fromSize(Rect.largest, Size.infinite), context: context, - builder: (context) => Text(widget.env.uuid!), + items: [ + PopupMenuItem(child: Text("test")), + PopupMenuItem(child: Text("text")), + ], + ), + onTap: () => showDialog( + context: context, + builder: (context) => EnvirnomentPreiview(env: widget.env), ), child: Column( children: [ diff --git a/lib/components/environment_preview.dart b/lib/components/environment_preview.dart new file mode 100644 index 0000000..d684283 --- /dev/null +++ b/lib/components/environment_preview.dart @@ -0,0 +1,91 @@ +import 'package:flutter/material.dart'; +import 'package:flutter/widgets.dart'; +import 'package:softplayer_web/api/grpc/environments.dart'; +import 'package:softplayer_web/helpers/providers/common.dart'; + +class EnvirnomentPreiview extends StatefulWidget { + @override + State createState() => _EnvirnomentPreviewState(); + final EnvironmentLocalData env; + + const EnvirnomentPreiview({ + super.key, + required this.env, + }); +} + +class _EnvirnomentPreviewState extends State { + @override + Widget build(BuildContext context) { + Provider provider = ProviderHelper().getProvider(widget.env.provider); + + String serverType; + String serverLocation; + try { + serverType = ProviderHelper().getServerType(widget.env.serverType); + serverLocation = provider.getServerLocation(widget.env.serverLocation); + } catch (e) { + rethrow; + } + + return AlertDialog( + title: Text(widget.env.name), + content: SizedBox( + height: 420, + width: 420, + child: Column( + children: [ + Table( + border: const TableBorder( + bottom: BorderSide.none, + left: BorderSide.none, + right: BorderSide.none, + top: BorderSide.none, + ), + children: [ + TableRow(children: [ + const Text("Description"), + Text(widget.env.description), + ]), + TableRow(children: [ + const Text("Provider"), + Text(provider.getProviderName()), + ]), + TableRow(children: [ + const Text("Server Type"), + Text(serverType), + ]), + TableRow(children: [ + const Text("Location"), + Text(serverLocation), + ]), + ], + ), + Divider(), + Table( + border: const TableBorder( + bottom: BorderSide.none, + left: BorderSide.none, + right: BorderSide.none, + top: BorderSide.none, + ), + children: [ + TableRow(children: [ + const Text("Price per hour"), + Text("0.52"), + ]), + TableRow(children: [ + const Text("Current usage"), + Text("10.5"), + ]), + ], + ), + ], + ), + ), + actions: [ + TextButton(onPressed: () => print("lala"), child: Text("test")), + TextButton(onPressed: () => print("lala"), child: Text("test")), + ]); + } +} diff --git a/lib/components/environments.dart b/lib/components/environments.dart index 42322ab..25a6686 100644 --- a/lib/components/environments.dart +++ b/lib/components/environments.dart @@ -52,31 +52,35 @@ class _EnvirnomentListState extends State { if (snapshot.hasData) { var data = snapshot.requireData; if (data.isNotEmpty) { - return Column(children: [ - Flexible( - child: Container( - margin: const EdgeInsetsDirectional.fromSTEB( - 50.0, 20.0, 50.0, 10.0), - child: const TextField( - decoration: InputDecoration( - fillColor: Colors.white, - filled: true, - labelText: "Search", - prefixIcon: Icon(Icons.search)), + return Container( + margin: const EdgeInsetsDirectional.fromSTEB( + 50.0, 20.0, 50.0, 10.0), + child: Column(children: [ + Flexible( + child: Container( + child: const TextField( + decoration: InputDecoration( + fillColor: Colors.white, + filled: true, + labelText: "Search", + prefixIcon: Icon(Icons.search)), + ), ), ), - ), - Flexible( - child: GridView.count( - childAspectRatio: (30 / 13), - crossAxisCount: 4, - children: snapshot.data! - .map((e) => EnvirnomentCard( - env: e, - )) - .toList(), - )) - ]); + Container( + child: Flexible( + child: GridView.count( + childAspectRatio: (30 / 13), + crossAxisCount: 4, + children: snapshot.data! + .map((e) => EnvirnomentCard( + env: e, + )) + .toList(), + )), + ) + ]), + ); } else { return Center( child: Container( diff --git a/lib/components/sign_in_form.dart b/lib/components/sign_in_form.dart deleted file mode 100644 index 6df8f9b..0000000 --- a/lib/components/sign_in_form.dart +++ /dev/null @@ -1,103 +0,0 @@ -import 'dart:html'; - -import 'package:flutter/material.dart'; -import 'package:grpc/grpc_web.dart'; -import 'package:softplayer_web/api/grpc/accounts.dart'; - -class SignInForm extends StatefulWidget { - const SignInForm({ - super.key, - required this.accountsGrpc, - }); - - final AccountsGrpc accountsGrpc; - @override - State createState() => _SignInFormState(); -} - -class _SignInFormState extends State { - final _formKey = GlobalKey(); - final usernameCtrl = TextEditingController(); - final passwordCtrl = TextEditingController(); - static const dialogName = "Sign In"; - void submitForm() { - // Validate returns true if the form is valid, or false otherwise. - if (_formKey.currentState!.validate()) { - final username = usernameCtrl.text; - final password = passwordCtrl.text; - widget.accountsGrpc.signIn(username, "", password).then((rs) { - window.localStorage["token"] = rs.token; - window.localStorage["uuid"] = rs.uuid; - Navigator.of(context, rootNavigator: true).pop(); - }).catchError((e) { - GrpcError error = e; - String msg; - if (error.message != null) { - msg = error.message!; - } else { - msg = error.toString(); - } - ScaffoldMessenger.of(context).showSnackBar(SnackBar( - content: Text(msg), - backgroundColor: Colors.red, - showCloseIcon: true, - behavior: SnackBarBehavior.floating, - )); - passwordCtrl.clear(); - }); - } - } - - @override - Widget build(BuildContext context) => AlertDialog( - title: const Text(dialogName), - content: SizedBox( - width: 420, - height: 140, - child: Form( - key: _formKey, - child: Center( - child: Column(children: [ - TextFormField( - controller: usernameCtrl, - autofocus: true, - decoration: const InputDecoration( - hintText: "Enter your username or email", - icon: Icon(Icons.account_circle), - label: Text("Username"), - ), - cursorWidth: 1, - cursorHeight: 18, - cursorRadius: const Radius.circular(10), - ), - TextFormField( - controller: passwordCtrl, - obscureText: true, - decoration: const InputDecoration( - hintText: "Enter your password", - icon: Icon(Icons.password), - label: Text("Password")), - cursorWidth: 1, - cursorHeight: 18, - cursorRadius: const Radius.circular(10), - onFieldSubmitted: (v) { - if (usernameCtrl.text.isEmpty) { - FocusScope.of(context).nextFocus(); - } else { - submitForm(); - } - }, - ), - ])))), - actions: [ - TextButton( - onPressed: () => Navigator.pop(context, 'Cancel'), - child: const Text('Cancel'), - ), - TextButton( - onPressed: submitForm, - child: const Text('OK'), - ), - ], - ); -} diff --git a/lib/components/sign_up_form.dart b/lib/components/sign_up_form.dart deleted file mode 100644 index 956f048..0000000 --- a/lib/components/sign_up_form.dart +++ /dev/null @@ -1,125 +0,0 @@ -import 'dart:html'; - -import 'package:flutter/material.dart'; -import 'package:grpc/grpc_web.dart'; -import 'package:softplayer_web/api/grpc/accounts.dart'; - -class SignUpForm extends StatefulWidget { - const SignUpForm({ - super.key, - required this.accountsGrpc, - }); - - final AccountsGrpc accountsGrpc; - @override - State createState() => _SignUpFormState(); -} - -class _SignUpFormState extends State { - final _formKey = GlobalKey(); - - final usernameCtrl = TextEditingController(); - final passwordCtrl = TextEditingController(); - final passwordVerifyCtrl = TextEditingController(); - final emailCtrl = TextEditingController(); - - static const dialogName = "Sign Up"; - - void submitForm() { - // Validate returns true if the form is valid, or false otherwise. - if (_formKey.currentState!.validate()) { - final username = usernameCtrl.text; - final password = passwordCtrl.text; - final email = emailCtrl.text; - widget.accountsGrpc.signUp(username, email, password).then((rs) { - window.localStorage["token"] = rs.token; - window.localStorage["uuid"] = rs.uuid; - Navigator.of(context, rootNavigator: true).pop(); - }).catchError((e) { - GrpcError error = e; - String msg; - if (error.message != null) { - msg = error.message!; - } else { - msg = error.toString(); - } - ScaffoldMessenger.of(context).showSnackBar(SnackBar( - content: Text(msg), - backgroundColor: Colors.red, - showCloseIcon: true, - behavior: SnackBarBehavior.floating, - )); - passwordCtrl.clear(); - }); - } - } - - @override - Widget build(BuildContext context) => AlertDialog( - title: const Text(dialogName), - content: SizedBox( - width: 420, - height: 280, - child: Form( - key: _formKey, - child: Center( - child: Column(children: [ - TextFormField( - autofocus: true, - controller: usernameCtrl, - decoration: const InputDecoration( - hintText: "Enter your username", - icon: Icon(Icons.account_circle), - label: Text("Username"), - ), - cursorWidth: 1, - cursorHeight: 18, - cursorRadius: const Radius.circular(10), - ), - TextFormField( - controller: emailCtrl, - autofocus: true, - decoration: const InputDecoration( - hintText: "Enter your email", - icon: Icon(Icons.email), - label: Text("Email"), - ), - cursorWidth: 1, - cursorHeight: 18, - cursorRadius: const Radius.circular(10), - ), - TextFormField( - controller: passwordCtrl, - obscureText: true, - decoration: const InputDecoration( - hintText: "Enter your password", - icon: Icon(Icons.password), - label: Text("Password")), - cursorWidth: 1, - cursorHeight: 18, - cursorRadius: const Radius.circular(10), - ), - TextFormField( - controller: passwordVerifyCtrl, - obscureText: true, - decoration: const InputDecoration( - hintText: "Verify your password", - icon: Icon(Icons.password), - label: Text("Confirm Password")), - cursorWidth: 1, - cursorHeight: 18, - cursorRadius: const Radius.circular(10), - ), - ])))), - actions: [ - TextButton( - onPressed: () => Navigator.pop(context, 'Cancel'), - child: const Text('Cancel'), - ), - TextButton( - onPressed: submitForm, - child: const Text('OK'), - ), - ], - ); -} diff --git a/lib/main.dart b/lib/main.dart index 6105ecd..2bb4f2a 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -91,7 +91,6 @@ class _StateRootWidget extends State { centerTitle: false, title: const Text("Softplayer"), bottom: const TabBar( - tabs: [ Tab( icon: Icon(Icons.computer),