diff --git a/assets/images/DE.png b/assets/images/DE.png new file mode 100644 index 0000000..c4caaaf Binary files /dev/null and b/assets/images/DE.png differ diff --git a/assets/images/EN.png b/assets/images/EN.png new file mode 100644 index 0000000..b81442d Binary files /dev/null and b/assets/images/EN.png differ diff --git a/assets/images/FR.png b/assets/images/FR.png new file mode 100644 index 0000000..feff210 Binary files /dev/null and b/assets/images/FR.png differ diff --git a/assets/images/NL.png b/assets/images/NL.png new file mode 100644 index 0000000..e456302 Binary files /dev/null and b/assets/images/NL.png differ diff --git a/lib/Components/MainView/dropDown_configuration.dart b/lib/Components/MainView/dropDown_configuration.dart new file mode 100644 index 0000000..db4f996 --- /dev/null +++ b/lib/Components/MainView/dropDown_configuration.dart @@ -0,0 +1,52 @@ +import 'package:flutter/material.dart'; +import 'package:managerapi/api.dart'; +import 'package:provider/provider.dart'; +import 'package:tablet_app/app_context.dart'; +import 'package:tablet_app/constants.dart'; + +class DropDownConfig extends StatefulWidget { + final List configurations; + final ValueChanged onChange; + const DropDownConfig({ + Key key, + this.configurations, + this.onChange, + }) : super(key: key); + + @override + _DropDownConfigState createState() => _DropDownConfigState(); +} + +class _DropDownConfigState extends State { + ConfigurationDTO configurationDTO; + + @override + Widget build(BuildContext context) { + final appContext = Provider.of(context); + Size size = MediaQuery.of(context).size; + return DropdownButton( + value: configurationDTO, + icon: const Icon(Icons.arrow_downward), + iconSize: 24, + elevation: 16, + style: const TextStyle(color: kMainGrey), + underline: Container( + height: 2, + color: kMainRed, // TODO CHANGEEEEE + ), + onChanged: (ConfigurationDTO newValue) { + setState(() { + configurationDTO = newValue; + widget.onChange(configurationDTO); + }); + }, + items: widget.configurations.map>((ConfigurationDTO value) { + return DropdownMenuItem( + value: value, + child: Text(value.label, style: TextStyle(fontSize: 20, fontWeight: FontWeight.w400)), + ); + }).toList(), + ); + } + +} \ No newline at end of file diff --git a/lib/Components/MainView/language_selection.dart b/lib/Components/MainView/language_selection.dart new file mode 100644 index 0000000..cf3e03e --- /dev/null +++ b/lib/Components/MainView/language_selection.dart @@ -0,0 +1,153 @@ +import 'package:flutter/material.dart'; +import 'package:provider/provider.dart'; +import 'package:tablet_app/Models/tabletContext.dart'; +import 'package:tablet_app/app_context.dart'; +import 'package:tablet_app/constants.dart'; +import 'package:webview_flutter/webview_flutter.dart'; + +class LanguageSelection extends StatefulWidget { + LanguageSelection(); + + @override + _LanguageSelection createState() => _LanguageSelection(); +} + +class _LanguageSelection extends State with TickerProviderStateMixin { + Size sizeScreen = new Size(1080.0, 1920.0); // Tablet resolution + + double flagSize = 60; + + String selectedLanguage; + double elementMinimizedSize; + bool minimized = false; + double _leftLanguage; + double _topLanguage; + double _rightLanguage; + double _bottomLanguage; + + AnimationController _controller; + + @override + void initState() { + setState(() { + _leftLanguage = sizeScreen.width - (sizeScreen.width *0.07); //size.width - size.width *0.07; + _topLanguage = sizeScreen.height * 0.075; + _rightLanguage = 0; + _bottomLanguage = minimized ? sizeScreen.height*0.6 : sizeScreen.height - (sizeScreen.height *0.07); + }); + + _controller = AnimationController( + value: 12, vsync: this, duration: Duration(seconds: 1)); + _controller.animateBack(0); + + super.initState(); + } + + @override + void dispose() { + _controller.dispose(); + super.dispose(); + } + + @override + Widget build(BuildContext context) { + final appContext = Provider.of(context); + Size size = MediaQuery.of(context).size; + selectedLanguage = (appContext.getContext() as TabletAppContext).language; + + return Stack( + children: [ + Positioned( + top: 0, + right: 0, + child: Padding( + padding: const EdgeInsets.only(right: 0.0, top: 25.0), + child: InkWell( + onTap: () { + minimizedAnimation(size); + }, + child: Container( + height: size.height *0.07,//size.height *0.07, + width: size.width *0.07,//size.width *0.07, + decoration: flagDecoration(selectedLanguage), + ), + ), + ) + ), + AnimatedPositioned( + duration: const Duration(milliseconds: 1500), + curve: Curves.fastLinearToSlowEaseIn, + top: _topLanguage, + left: _leftLanguage, + right: _rightLanguage, + bottom: _bottomLanguage, + child: Container( + child: + ListView( + children: [ + if(minimized) ... [ + for(var language in languages.where((element) => element.toUpperCase() != selectedLanguage )) + InkWell( + onTap: () { + setState(() { + // TODO STORE IT LOCALLY !! + TabletAppContext tabletAppContext = appContext.getContext(); + tabletAppContext.language = language; + appContext.setContext(tabletAppContext); + minimizedAnimation(size); + }); + }, + child: Padding( + padding: const EdgeInsets.all(8.0), + child: Container( + width: sizeScreen.height *0.07, + height: sizeScreen.width *0.07, + decoration: flagDecoration(language), + ), + ), + ) + ] + ], + ) + , + ), + ), + ], + ); + } + + minimizedAnimation(Size size) { + minimized = !minimized; + if (minimized) { + _controller.animateBack(15.0); + } else { + _controller.animateBack(0.0); + } + setState(() { + _leftLanguage = size.width - (size.width *0.07); //size.width - size.width *0.07; + _topLanguage = sizeScreen.height * 0.07; + _rightLanguage = 0; + _bottomLanguage = minimized ? size.height*0.6 : size.height - (size.height *0.07); + }); + } + + flagDecoration(String language) { + return BoxDecoration( + color: kBackgroundColor, + shape: BoxShape.circle, + border: Border.all(width: 1.5, color: kSecondGrey), + image: new DecorationImage( + fit: BoxFit.contain, + image: new AssetImage("assets/images/"+language+".png"), + ), + boxShadow: [ + BoxShadow( + color: kSecondGrey, + spreadRadius: 0.5, + blurRadius: 5, + offset: Offset(0, 1.5), // changes position of shadow + ), + ], + ); + } +} \ No newline at end of file diff --git a/lib/Components/MainView/main_view.dart b/lib/Components/MainView/main_view.dart index 29d5caa..7aea06a 100644 --- a/lib/Components/MainView/main_view.dart +++ b/lib/Components/MainView/main_view.dart @@ -3,6 +3,7 @@ import 'package:flutter/rendering.dart'; import 'package:flutter/services.dart'; import 'package:managerapi/api.dart'; import 'package:provider/provider.dart'; +import 'package:tablet_app/Components/MainView/dropDown_configuration.dart'; import 'package:tablet_app/Components/Map/map_context.dart'; import 'package:tablet_app/Components/Map/map_view.dart'; import 'package:tablet_app/Components/loading.dart'; @@ -15,6 +16,8 @@ import 'package:tablet_app/constants.dart'; import 'package:http/http.dart' as http; import 'package:auto_size_text/auto_size_text.dart'; +import 'language_selection.dart'; + class MainViewWidget extends StatefulWidget { MainViewWidget(); @@ -166,88 +169,132 @@ class _MainViewWidget extends State { height: size.height, width: size.width, color: kBackgroundGrey, - child: Column( - crossAxisAlignment: CrossAxisAlignment.center, - mainAxisAlignment: MainAxisAlignment.spaceAround, + child: Stack( children: [ - Align( - alignment: Alignment.centerRight, + LanguageSelection(), + Center( child: Container( - height: size.height * 0.1, - color: Colors.blue, - child: Text("Langues") - ), - ), - Container( - height: size.height * 0.9, - width: size.width * 0.9, - child: FutureBuilder( - future: getSections(appContext), - builder: (context, AsyncSnapshot snapshot) { - print('helloo test'); - if (snapshot.connectionState == ConnectionState.done) { - if (snapshot.data == null) { - return Text("NO CONFIGURATION"); - } - else { - return GridView.builder( - shrinkWrap: true, - gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4), - itemCount: snapshot.data?.length, - itemBuilder: (BuildContext context, int index) { - return // User Picture - InkWell( - onTap: () { - setState(() { - sectionSelected = snapshot.data[index]; - }); - }, - child: Container( - decoration: boxDecoration(snapshot.data[index]), - padding: const EdgeInsets.all(25), - margin: EdgeInsets.symmetric(vertical: 25, horizontal: 25), - child: Align( - alignment: Alignment.bottomRight, - child: FractionallySizedBox( - heightFactor: 0.4, - child: Column( - children: [ - Align( - alignment: Alignment.centerRight, - child: AutoSizeText( - snapshot.data[index].title.firstWhere((translation) => translation.language == appContext.getContext().language).value, - style: new TextStyle(fontSize: 25), - maxLines: 1, - ), + height: size.height * 0.85, + width: size.width * 0.9, + child: FutureBuilder( + future: getSections(appContext), + builder: (context, AsyncSnapshot snapshot) { + print('helloo test'); + if (snapshot.connectionState == ConnectionState.done) { + if (snapshot.data == null) { + //return Text("NO CONFIGURATION"); + return FutureBuilder( + future: getConfigurations(appContext), + builder: (context, AsyncSnapshot snapshot) { + if (snapshot.connectionState == ConnectionState.done) { + return Center( + child: Container( + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(29), + color: kBackgroundLight, + ), + height: size.height*0.3, + width: size.width*0.3, + child: Column( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Padding( + padding: const EdgeInsets.all(15.0), + child: Text( + "Choisir une configuration", + style: new TextStyle( + fontSize: 25 ), - Align( - alignment: Alignment.centerRight, - child: AutoSizeText( - snapshot.data[index].description.firstWhere((translation) => translation.language == appContext.getContext().language).value, - style: new TextStyle(fontSize: 18, fontFamily: ""), - maxLines: 1, - ), - ), - ], - ) + ), + ), + DropDownConfig( + configurations: snapshot.data, + onChange: (ConfigurationDTO configurationOut) { + setState(() { + // TODO STORE IT LOCALLY !! + + TabletAppContext tabletAppContext = appContext.getContext(); + tabletAppContext.configuration = configurationOut; + appContext.setContext(tabletAppContext); + }); + }, + ), + ], ), ), - ), - ); - } + ); + } else if (snapshot.connectionState == ConnectionState.none) { + return Text("No data"); + } else { + return Center( + child: Container( + height: size.height * 0.2, + child: Loading() + ) + ); + } + } + ); + } + else { + return GridView.builder( + shrinkWrap: true, + gridDelegate: new SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4), + itemCount: snapshot.data?.length, + itemBuilder: (BuildContext context, int index) { + return InkWell( + onTap: () { + setState(() { + sectionSelected = snapshot.data[index]; + }); + }, + child: Container( + decoration: boxDecoration(snapshot.data[index]), + padding: const EdgeInsets.all(25), + margin: EdgeInsets.symmetric(vertical: 25, horizontal: 25), + child: Align( + alignment: Alignment.bottomRight, + child: FractionallySizedBox( + heightFactor: 0.4, + child: Column( + children: [ + Align( + alignment: Alignment.centerRight, + child: AutoSizeText( + snapshot.data[index].title.firstWhere((translation) => translation.language == appContext.getContext().language).value, + style: new TextStyle(fontSize: 25), + maxLines: 1, + ), + ), + Align( + alignment: Alignment.centerRight, + child: AutoSizeText( + snapshot.data[index].description.firstWhere((translation) => translation.language == appContext.getContext().language).value, + style: new TextStyle(fontSize: 18, fontFamily: ""), + maxLines: 1, + ), + ), + ], + ) + ), + ), + ), + ); + } + ); + } + } else if (snapshot.connectionState == ConnectionState.none) { + return Text("No data"); + } else { + return Center( + child: Container( + child: Loading() + ) ); } - } else if (snapshot.connectionState == ConnectionState.none) { - return Text("No data"); - } else { - return Center( - child: Container( - height: size.height * 0.2, - child: Loading() - ) - ); } - } + ), ), ), ]), @@ -258,15 +305,6 @@ class _MainViewWidget extends State { Future> getSections(dynamic appContext) async { TabletAppContext tabletAppContext = await appContext.getContext(); - - // TODO if null ask user to select a config (first use) - if (tabletAppContext.configuration == null) { - print("config is null"); - tabletAppContext.configuration = await tabletAppContext.clientAPI.configurationApi.configurationGetDetail("60b1257a2939c9163c3f0921"); - print("Set context.. if no config"); - appContext.setContext(tabletAppContext); - } - print(tabletAppContext.toString()); List sections = await tabletAppContext.clientAPI.sectionApi.sectionGetFromConfiguration(tabletAppContext.configuration.id); print(sections); @@ -314,4 +352,13 @@ boxDecoration(SectionDTO section) { ), ], ); +} + +Future> getConfigurations(dynamic appContext) async { + List configurations = await appContext.getContext().clientAPI.configurationApi.configurationGet(); + print("number of configurations " + configurations.length.toString()); + configurations.forEach((element) { + print(element); + }); + return configurations; } \ No newline at end of file diff --git a/lib/constants.dart b/lib/constants.dart index 47cbda6..b9572fb 100644 --- a/lib/constants.dart +++ b/lib/constants.dart @@ -14,6 +14,8 @@ const kBackgroundSecondGrey = Color(0xFF5b5b63); const kBackgroundLight = Color(0xfff3f3f3); +const List languages = ["FR", "NL", "EN", "DE"]; + /* const kTextStyle = TextStyle( fontSize: 23, diff --git a/lib/main.dart b/lib/main.dart index ebc69d9..b61a5c1 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -46,7 +46,6 @@ class _MyAppState extends State { tabletAppContext = new TabletAppContext(); // store user info locally tabletAppContext.clientAPI = clientAPI; - tabletAppContext.configuration = new ConfigurationDTO(id: "60b1257a2939c9163c3f0921"); tabletAppContext.language = "FR"; //appContext.setContext(tabletAppContext);