253 lines
10 KiB
Dart
253 lines
10 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:manager_api_new/api.dart';
|
|
import 'package:manager_app/Components/audio_input_container.dart';
|
|
import 'package:manager_app/Components/resource_input_container.dart';
|
|
import 'package:manager_app/app_context.dart';
|
|
import 'package:manager_app/constants.dart';
|
|
import 'package:provider/provider.dart';
|
|
import 'package:quill_html_editor/quill_html_editor.dart';
|
|
|
|
import 'flag_decoration.dart';
|
|
|
|
class TranslationInputAndResourceContainer extends StatefulWidget {
|
|
TranslationInputAndResourceContainer({
|
|
Key? key,
|
|
required this.isTitle,
|
|
required this.values,
|
|
required this.newValues,
|
|
required this.onGetResult,
|
|
required this.maxLines,
|
|
required this.resourceTypes,
|
|
}) : super(key: key);
|
|
|
|
bool isTitle;
|
|
List<TranslationAndResourceDTO> values;
|
|
List<TranslationAndResourceDTO> newValues;
|
|
Function onGetResult;
|
|
int maxLines;
|
|
List<ResourceType>? resourceTypes;
|
|
|
|
@override
|
|
State<TranslationInputAndResourceContainer> createState() => _TranslationInputAndResourceContainerState();
|
|
}
|
|
|
|
class _TranslationInputAndResourceContainerState extends State<TranslationInputAndResourceContainer> with TickerProviderStateMixin {
|
|
TabController? _tabController;
|
|
QuillEditorController controllerQuill = QuillEditorController();
|
|
ValueNotifier<String?>? currentLanguage;
|
|
bool isInit = false;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
|
|
_tabController = new TabController(length: widget.newValues.length, vsync: this);
|
|
currentLanguage = ValueNotifier<String>(widget.newValues.first.language!);
|
|
|
|
controllerQuill.onEditorLoaded(() {
|
|
isInit = true;
|
|
});
|
|
|
|
Future.delayed(Duration(milliseconds: 500), () {
|
|
controllerQuill.clear();
|
|
controllerQuill.insertText(widget.newValues[_tabController!.index].value!);
|
|
isInit = true;
|
|
});
|
|
|
|
controllerQuill.onTextChanged((p0) async {
|
|
var plainText = await controllerQuill.getPlainText();
|
|
if(widget.isTitle) {
|
|
if(plainText.length > kTitleMaxLength) {
|
|
controllerQuill.undo();
|
|
}
|
|
} else {
|
|
if(plainText.length > kDescriptionMaxLength) {
|
|
print("to much text description au dessus");
|
|
controllerQuill.undo();
|
|
}
|
|
}
|
|
});
|
|
|
|
_tabController!.addListener(() {
|
|
if (!_tabController!.indexIsChanging) {
|
|
setState(() {
|
|
currentLanguage!.value = widget.newValues[_tabController!.index].language;
|
|
//if(widget.resourceTypes == null) {
|
|
print("insert try without ress");
|
|
print(widget.newValues[_tabController!.index].value!);
|
|
controllerQuill.clear();
|
|
controllerQuill.insertText(widget.newValues[_tabController!.index].value!);
|
|
//}
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
super.dispose();
|
|
_tabController!.dispose();
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final customToolBarList = widget.isTitle ? [
|
|
ToolBarStyle.bold,
|
|
ToolBarStyle.italic,
|
|
ToolBarStyle.color,
|
|
ToolBarStyle.background,
|
|
ToolBarStyle.clean
|
|
] : [
|
|
ToolBarStyle.bold,
|
|
ToolBarStyle.italic,
|
|
ToolBarStyle.color,
|
|
ToolBarStyle.background,
|
|
ToolBarStyle.listBullet,
|
|
ToolBarStyle.listOrdered,
|
|
ToolBarStyle.clean
|
|
];
|
|
|
|
return Container(
|
|
height: widget.isTitle ? MediaQuery.of(context).size.height *0.45 : MediaQuery.of(context).size.height *0.5,
|
|
//color: Colors.orange,
|
|
width: MediaQuery.of(context).size.width *0.7,
|
|
constraints: BoxConstraints(
|
|
minHeight: 300,
|
|
minWidth: 300
|
|
),
|
|
child: DefaultTabController(
|
|
length: widget.newValues.length,
|
|
child: Column(
|
|
children: [
|
|
RotatedBox(
|
|
quarterTurns: 0, // Can be used to test vertical tab in case of smaller screen
|
|
child: TabBar(
|
|
indicatorColor: kPrimaryColor,
|
|
//overlayColor: MaterialStateProperty().c,
|
|
labelColor: kPrimaryColor,
|
|
unselectedLabelColor: Colors.black,
|
|
controller: _tabController,
|
|
tabs: widget.newValues.map((v) => Tab(icon: FlagDecoration(language: v.language!))).toList(), // text: v.language!.toUpperCase(),
|
|
),
|
|
),
|
|
getTranslation(context, Provider.of<AppContext>(context), controllerQuill, customToolBarList, widget.isTitle, widget.resourceTypes, widget.newValues, currentLanguage!)
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
getTranslation(BuildContext context, AppContext appContext, QuillEditorController controllerQuill, List<ToolBarStyle> customToolBarList, bool isTitle, List<ResourceType>? resourceTypes, List<TranslationAndResourceDTO> newValues, ValueNotifier<String?> currentLanguage) {
|
|
return Padding(
|
|
padding: const EdgeInsets.all(6.0),
|
|
child: Padding(
|
|
padding: const EdgeInsets.only(left: 8.0),
|
|
child: Container(
|
|
width: MediaQuery.of(context).size.width *0.7,
|
|
//color: Colors.blueAccent,
|
|
height: widget.isTitle ? MediaQuery.of(context).size.height *0.34 : MediaQuery.of(context).size.height *0.37,
|
|
child: resourceTypes != null ?
|
|
Column(
|
|
children: [
|
|
ToolBar(
|
|
toolBarColor: kSecond,
|
|
activeIconColor: kPrimaryColor,
|
|
padding: const EdgeInsets.all(8),
|
|
iconSize: 20,
|
|
toolBarConfig: customToolBarList,
|
|
controller: controllerQuill,
|
|
customButtons: [],
|
|
),
|
|
SingleChildScrollView(
|
|
child: Column(
|
|
children: [
|
|
Container(
|
|
height: widget.isTitle ? MediaQuery.of(context).size.height *0.13 : MediaQuery.of(context).size.height *0.2,
|
|
child: QuillHtmlEditor(
|
|
text: newValues.where((element) => element.language! == currentLanguage.value).first.value!,
|
|
hintText: '',
|
|
controller: controllerQuill,
|
|
minHeight: widget.isTitle ? 80 : 240,
|
|
/*textStyle: _editorTextStyle,
|
|
hintTextStyle: _hintTextStyle,*/
|
|
hintTextAlign: TextAlign.start,
|
|
padding: const EdgeInsets.only(left: 10, right: 10, top: 5),
|
|
hintTextPadding: EdgeInsets.zero,
|
|
backgroundColor: kBackgroundColor,
|
|
ensureVisible: true,
|
|
inputAction: widget.isTitle ? InputAction.send : InputAction.newline, // don't accept enter if title
|
|
//onFocusChanged: (hasFocus) => debugPrint('has focus $hasFocus'),
|
|
//onTextChanged: (text) => debugPrint('widget text change $text'),
|
|
onTextChanged: (value) {
|
|
if(isInit) {
|
|
newValues.where((element) => element.language! == currentLanguage.value).first.value = value;
|
|
}
|
|
},
|
|
onEditorCreated: () => debugPrint('Editor has been loaded'),
|
|
onEditorResized: (height) =>
|
|
debugPrint('Editor resized $height'),
|
|
onSelectionChanged: (sel) =>
|
|
debugPrint('${sel.index},${sel.length}'),
|
|
),
|
|
),
|
|
ValueListenableBuilder<String?>(
|
|
valueListenable: currentLanguage,
|
|
builder: (context, value, _) {
|
|
return ResourceInputContainer(
|
|
label: "Ressource à afficher :",
|
|
initialValue: newValues.where((element) => element.language! == value).first.resourceId,
|
|
color: kPrimaryColor,
|
|
inResourceTypes: resourceTypes,
|
|
isLanguageTab: true,
|
|
onChanged: (ResourceDTO resource) {
|
|
setState(() {
|
|
if(resource.id == null) {
|
|
newValues.where((element) => element.language! == value).first.resourceId = null;
|
|
newValues.where((element) => element.language! == value).first.resource = null;
|
|
} else {
|
|
newValues.where((element) => element.language! == value).first.resourceId = resource.id;
|
|
newValues.where((element) => element.language! == value).first.resource = resource;
|
|
/*newValues.where((element) => element.language! == value).first.resourceUrl = resource.url;
|
|
newValues.where((element) => element.language! == value).first.resourceType = resource.type;*/
|
|
}
|
|
});
|
|
},
|
|
isSmall: true
|
|
);
|
|
}
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
) :
|
|
Container(
|
|
width: 250,
|
|
height: 120,
|
|
child: ValueListenableBuilder<String?>(
|
|
valueListenable: currentLanguage,
|
|
builder: (context, value, _) {
|
|
return ResourceInputContainer(
|
|
label: "",
|
|
initialValue: newValues.where((element) => element.language! == value).first.resourceId,
|
|
inResourceTypes: widget.resourceTypes!,
|
|
onChanged: (ResourceDTO resource) {
|
|
newValues.where((element) => element.language! == value).first.value = resource.id;
|
|
}
|
|
);
|
|
return AudioInputContainer(
|
|
initialValue: newValues.where((element) => element.language! == value).first.value,
|
|
color: kPrimaryColor,
|
|
onChanged: (ResourceDTO resource) {
|
|
newValues.where((element) => element.language! == value).first.value = resource.id;
|
|
},
|
|
);
|
|
}
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|