add sound, transcription and examples picker
This commit is contained in:
parent
e57d06019f
commit
d4cb3c07d3
|
@ -10,9 +10,6 @@
|
||||||
"lint": "eslint ."
|
"lint": "eslint ."
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@fortawesome/fontawesome-svg-core": "^1.2.28",
|
|
||||||
"@fortawesome/free-solid-svg-icons": "^5.13.0",
|
|
||||||
"@fortawesome/react-native-fontawesome": "^0.2.3",
|
|
||||||
"@react-native-community/async-storage": "^1.8.1",
|
"@react-native-community/async-storage": "^1.8.1",
|
||||||
"axios": "^0.19.2",
|
"axios": "^0.19.2",
|
||||||
"babel-preset-react-native": "^4.0.1",
|
"babel-preset-react-native": "^4.0.1",
|
||||||
|
@ -20,10 +17,9 @@
|
||||||
"native-base": "^2.13.8",
|
"native-base": "^2.13.8",
|
||||||
"node-fetch": "^2.6.0",
|
"node-fetch": "^2.6.0",
|
||||||
"react": "16.13.0",
|
"react": "16.13.0",
|
||||||
"react-native": "^0.62.0",
|
"react-native": "^0.61.5",
|
||||||
"react-native-ankidroid": "^0.4.0",
|
"react-native-ankidroid": "^0.4.0",
|
||||||
"react-native-material-textfield": "^0.16.1",
|
"react-native-material-textfield": "^0.16.1",
|
||||||
"react-native-svg": "^12.0.3",
|
|
||||||
"react-native-vector-icons": "^6.6.0",
|
"react-native-vector-icons": "^6.6.0",
|
||||||
"react-redux": "^7.2.0",
|
"react-redux": "^7.2.0",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5",
|
||||||
|
|
|
@ -140,5 +140,5 @@ const setSavedData = data => ({
|
||||||
|
|
||||||
export const getSavedData = () => async dispatch => {
|
export const getSavedData = () => async dispatch => {
|
||||||
const data = await getAnkiData();
|
const data = await getAnkiData();
|
||||||
setSavedData(data);
|
await dispatch(setSavedData(data));
|
||||||
};
|
};
|
||||||
|
|
|
@ -9,5 +9,5 @@ export const createDictionary = async apiRes => {
|
||||||
|
|
||||||
const compounded = await compoundWithYDictionary(parsedDictionary, word);
|
const compounded = await compoundWithYDictionary(parsedDictionary, word);
|
||||||
//TODO add shrinkToOneExample(compounded)
|
//TODO add shrinkToOneExample(compounded)
|
||||||
return {...compounded, sound: audio};
|
return {...compounded, sound: audio, examples: parsedDictionary.examples};
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import yDictionary from '../api/yandex-dictionary';
|
import yDictionary from '../api/yandex-dictionary';
|
||||||
|
import {parseDictionary} from './parsing-dictionary';
|
||||||
|
|
||||||
const selectByPos = wordArray => {
|
const selectByPos = wordArray => {
|
||||||
let posSet = new Set();
|
let posSet = new Set();
|
||||||
|
@ -50,7 +51,6 @@ export const compoundWithYDictionary = async (definitionList, word) => {
|
||||||
word,
|
word,
|
||||||
pronunciation: `/${definitionList.pronunciation}/`,
|
pronunciation: `/${definitionList.pronunciation}/`,
|
||||||
compounded,
|
compounded,
|
||||||
examples: words.examples,
|
|
||||||
};
|
};
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.log('error is HERE', e);
|
console.log('error is HERE', e);
|
||||||
|
|
|
@ -4,7 +4,7 @@ import TextField from 'react-native-material-textfield/src/components/field';
|
||||||
import {StyleSheet, TextInput} from 'react-native';
|
import {StyleSheet, TextInput} from 'react-native';
|
||||||
import {View, Text, Button, Picker} from 'native-base';
|
import {View, Text, Button, Picker} from 'native-base';
|
||||||
import Icon from 'react-native-vector-icons/FontAwesome5';
|
import Icon from 'react-native-vector-icons/FontAwesome5';
|
||||||
import IconedButton from './iconed-button.jsx';
|
import IconedButton from '../view/iconed-button.jsx';
|
||||||
const FieldEditor = props => {
|
const FieldEditor = props => {
|
||||||
const [data, setData] = useState({});
|
const [data, setData] = useState({});
|
||||||
const [editing, setEditing] = useState(true);
|
const [editing, setEditing] = useState(true);
|
||||||
|
@ -14,6 +14,7 @@ const FieldEditor = props => {
|
||||||
const input = useRef();
|
const input = useRef();
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setData(props.data);
|
setData(props.data);
|
||||||
|
console.log(props.data)
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const selectValue = value => {
|
const selectValue = value => {
|
||||||
|
@ -85,7 +86,7 @@ const FieldEditor = props => {
|
||||||
<Picker
|
<Picker
|
||||||
selectedValue={selectedValue}
|
selectedValue={selectedValue}
|
||||||
onValueChange={value => selectValue(value)}>
|
onValueChange={value => selectValue(value)}>
|
||||||
{data.values.map((value, id) => {
|
{props.data.values.map((value, id) => {
|
||||||
return <Picker.Item value={value} label={value} key={id} />;
|
return <Picker.Item value={value} label={value} key={id} />;
|
||||||
})}
|
})}
|
||||||
</Picker>
|
</Picker>
|
38
src/components/Form/field-list.jsx
Normal file
38
src/components/Form/field-list.jsx
Normal file
|
@ -0,0 +1,38 @@
|
||||||
|
import React, {useState, useEffect} from 'react'
|
||||||
|
import {connect} from 'react-redux';
|
||||||
|
import {View, Input} from 'native-base'
|
||||||
|
import {TextField} from 'react-native-material-textfield';
|
||||||
|
import FieldEditor from './field-editor';
|
||||||
|
import TextInput from './text-input';
|
||||||
|
import PickerList from './picker-list';
|
||||||
|
|
||||||
|
const FieldList = props => {
|
||||||
|
const [pronunciation, setPronunciation] = useState()
|
||||||
|
const [sound, setSound] = useState()
|
||||||
|
const [examples, setExamples] = useState([])
|
||||||
|
useEffect(() => {
|
||||||
|
setSound(props.response.sound)
|
||||||
|
setPronunciation(props.response.pronunciation)
|
||||||
|
setExamples(props.response.examples)
|
||||||
|
},[props.response])
|
||||||
|
useEffect(() => {
|
||||||
|
console.log(sound, pronunciation)
|
||||||
|
console.log("EXFSDFS", examples)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
return (
|
||||||
|
<View>
|
||||||
|
<PickerList/>
|
||||||
|
<TextInput value={sound} label={'Sound'}/>
|
||||||
|
<TextInput value={pronunciation} label={'Transcription'}/>
|
||||||
|
<FieldEditor data={{
|
||||||
|
label: 'Usage example',
|
||||||
|
values: examples || ['can not find the example']
|
||||||
|
}}/>
|
||||||
|
</View>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(state => ({
|
||||||
|
response: state.api.parsedDictionary
|
||||||
|
}))(FieldList)
|
19
src/components/Form/picker-list.jsx
Normal file
19
src/components/Form/picker-list.jsx
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
import React,{useState, useEffect, useRef} from 'react'
|
||||||
|
import {View} from 'native-base';
|
||||||
|
import {connect} from 'react-redux'
|
||||||
|
|
||||||
|
/*
|
||||||
|
****************** props:*****************
|
||||||
|
* startId props.data[0] / [1] /[8] ...
|
||||||
|
* labelNum // Translate 1 / Translate 2 ...
|
||||||
|
* */
|
||||||
|
const PickerList = props => {
|
||||||
|
return(
|
||||||
|
<View>
|
||||||
|
|
||||||
|
</View>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default connect(state => ({
|
||||||
|
data: state.api.parsedDictionary.compounded
|
||||||
|
}))(PickerList)
|
34
src/components/Form/text-input.jsx
Normal file
34
src/components/Form/text-input.jsx
Normal file
|
@ -0,0 +1,34 @@
|
||||||
|
import React, {useState, useEffect, useRef} from 'react';
|
||||||
|
import {connect} from 'react-redux';
|
||||||
|
import {TextField} from 'react-native-material-textfield';
|
||||||
|
import {View} from 'native-base';
|
||||||
|
const TextInput = props => {
|
||||||
|
const input = useRef();
|
||||||
|
const [text, setText] = useState(props.value);
|
||||||
|
useEffect(() => {
|
||||||
|
console.log('changing');
|
||||||
|
console.log(props.value);
|
||||||
|
setText(props.value);
|
||||||
|
input.current.setValue(props.value);
|
||||||
|
}, [props, props.value]);
|
||||||
|
return (
|
||||||
|
<View>
|
||||||
|
<TextField
|
||||||
|
value={props.value}
|
||||||
|
label={props.label}
|
||||||
|
editable={true}
|
||||||
|
onChangeText={text => setText(text)}
|
||||||
|
ref={input}
|
||||||
|
lineType={'none'}
|
||||||
|
/>
|
||||||
|
<View
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: 1,
|
||||||
|
backgroundColor: '#00000050',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default connect()(TextInput);
|
|
@ -4,9 +4,10 @@ import DeckPicker from './view/deck-picker';
|
||||||
import {Form, Container, Item} from 'native-base';
|
import {Form, Container, Item} from 'native-base';
|
||||||
import {checkAnkiLanModelForExisting} from '../actions/anki-get-actions';
|
import {checkAnkiLanModelForExisting} from '../actions/anki-get-actions';
|
||||||
import InputWord from './view/translatable-word';
|
import InputWord from './view/translatable-word';
|
||||||
import SubmitButton from './view/submit-button';
|
import SubmitButton from './Form/submit-button';
|
||||||
import {wordInfo} from '../actions/api/dictionary';
|
import {wordInfo} from '../actions/api/dictionary';
|
||||||
import FieldEditor from './view/field-editor';
|
import FieldEditor from './Form/field-editor';
|
||||||
|
import FieldList from './Form/field-list';
|
||||||
|
|
||||||
const AnkiForm = props => {
|
const AnkiForm = props => {
|
||||||
const [target, setTarget] = useState('');
|
const [target, setTarget] = useState('');
|
||||||
|
@ -35,12 +36,13 @@ const AnkiForm = props => {
|
||||||
<DeckPicker />
|
<DeckPicker />
|
||||||
<InputWord word={getWord} onSubmit={submit} />
|
<InputWord word={getWord} onSubmit={submit} />
|
||||||
{submitted ? (
|
{submitted ? (
|
||||||
<FieldEditor
|
// <FieldEditor
|
||||||
data={{
|
// data={{
|
||||||
type: 'part of speech',
|
// type: 'part of speech',
|
||||||
values: ['1', '2', '3','5',],
|
// values: ['1', '2', '3','5',],
|
||||||
}}
|
// }}
|
||||||
/>
|
// />
|
||||||
|
<FieldList/>
|
||||||
) : (
|
) : (
|
||||||
<SubmitButton onSubmit={submit} />
|
<SubmitButton onSubmit={submit} />
|
||||||
)}
|
)}
|
||||||
|
|
Loading…
Reference in a new issue