add anki Model creator
This commit is contained in:
parent
c9230f7254
commit
7471e58aa9
|
@ -60,11 +60,20 @@ export const getDeckList = () => async dispatch => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getModelList = async (
|
const setModelList = res => {
|
||||||
getModelListFunction = AnkiDroid.getModelList,
|
return {type: GET_MODEL_LIST, payload: res};
|
||||||
) => {
|
};
|
||||||
const [err, res] = await getModelListFunction();
|
export const getModelList = () => async dispatch => {
|
||||||
return err ? {type: ERROR, err} : {type: GET_MODEL_LIST, payload: res};
|
try {
|
||||||
|
const [err, res] = await AnkiDroid.getModelList();
|
||||||
|
if (err) {
|
||||||
|
throw err;
|
||||||
|
}
|
||||||
|
console.log(res);
|
||||||
|
await dispatch(setModelList(res));
|
||||||
|
} catch (err) {
|
||||||
|
console.log(err);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
export const getFieldList = async (
|
export const getFieldList = async (
|
||||||
|
@ -82,9 +91,9 @@ const setExistingOfAnkiLanModel = existing => {
|
||||||
payload: existing,
|
payload: existing,
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
export const checkAnkiLanModelForExisting = id => async dispatch => {
|
export const checkAnkiLanModelForExisting = name => async dispatch => {
|
||||||
try {
|
try {
|
||||||
const [err, res] = await AnkiDroid.getFieldList('', id);
|
const [err, res] = await AnkiDroid.getFieldList(name);
|
||||||
if (err) {
|
if (err) {
|
||||||
throw err;
|
throw err;
|
||||||
}
|
}
|
||||||
|
@ -94,6 +103,5 @@ export const checkAnkiLanModelForExisting = id => async dispatch => {
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
await dispatch(setExistingOfAnkiLanModel(false));
|
await dispatch(setExistingOfAnkiLanModel(false));
|
||||||
await createAnkiLanModel(id);
|
await createAnkiLanModel(id);
|
||||||
console.log('errrororo', err);
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,6 +1,13 @@
|
||||||
import {AnkiDroid} from 'react-native-ankidroid/dist/ankidroid';
|
import {AnkiDroid} from 'react-native-ankidroid/dist/ankidroid';
|
||||||
|
|
||||||
export const createAnkiLanModel = model => async dispatch => {
|
export const createAnkiLanModel = model => async dispatch => {
|
||||||
|
try {
|
||||||
|
/*
|
||||||
|
(async function() {
|
||||||
|
const [err, res] = await AnkiDroid.getSelectedDeckName();
|
||||||
|
console.log(model.deck);
|
||||||
|
console.log(typeof res);
|
||||||
|
})();
|
||||||
try {
|
try {
|
||||||
const modelFields = [
|
const modelFields = [
|
||||||
'Word or sentence',
|
'Word or sentence',
|
||||||
|
@ -15,8 +22,8 @@ export const createAnkiLanModel = model => async dispatch => {
|
||||||
'Sound',
|
'Sound',
|
||||||
];
|
];
|
||||||
|
|
||||||
const css = `<style>
|
const css = `<style>
|
||||||
.card {
|
.card {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content:center;
|
justify-content:center;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -28,7 +35,7 @@ export const createAnkiLanModel = model => async dispatch => {
|
||||||
.span: {
|
.span: {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-around;
|
justify-content: space-around;
|
||||||
|
|
||||||
}</style>`;
|
}</style>`;
|
||||||
|
|
||||||
const answerFormat = `
|
const answerFormat = `
|
||||||
|
@ -38,7 +45,7 @@ export const createAnkiLanModel = model => async dispatch => {
|
||||||
|
|
||||||
<ol>
|
<ol>
|
||||||
<li>
|
<li>
|
||||||
<div style='font-family: Arial; font-size: 20px;'>{{Translate 1}}</div>
|
<div style='font-family: Arial; font-size: 20px;'>{{Translate 1}}</div> Qq
|
||||||
<div style='font-family: Arial; font-size: 20px;'>{{Definition 1}}</div>
|
<div style='font-family: Arial; font-size: 20px;'>{{Definition 1}}</div>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
|
@ -77,10 +84,9 @@ export const createAnkiLanModel = model => async dispatch => {
|
||||||
const settings = {
|
const settings = {
|
||||||
modelId: model.id,
|
modelId: model.id,
|
||||||
modelProperties,
|
modelProperties,
|
||||||
deckId: '1582019808117',
|
deckId: model.deck.id,
|
||||||
};
|
};
|
||||||
const currentDeck = new AnkiDroid(settings);
|
new AnkiDroid(settings).addNote(
|
||||||
currentDeck.addNote(
|
|
||||||
[
|
[
|
||||||
'Word or sentence',
|
'Word or sentence',
|
||||||
'Part of speech 1',
|
'Part of speech 1',
|
||||||
|
@ -97,5 +103,190 @@ export const createAnkiLanModel = model => async dispatch => {
|
||||||
);
|
);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.log(err);
|
console.log(err);
|
||||||
|
}*/
|
||||||
|
|
||||||
|
///////////////////////////////////
|
||||||
|
// SETTING UP THE DECK AND MODEL //
|
||||||
|
///////////////////////////////////
|
||||||
|
|
||||||
|
// Name of deck which will be created in AnkiDroid
|
||||||
|
const deckName = model.deck.name;
|
||||||
|
// Name of model which will be created in AnkiDroid (can be any string)
|
||||||
|
const modelName = model.name + '_test';
|
||||||
|
// Used to save a reference to this deck in the SharedPreferences (can be any string)
|
||||||
|
const dbDeckReference = 'com.anki.decks';
|
||||||
|
// Used to save a reference to this model in the SharedPreferences (can be any string)
|
||||||
|
const dbModelReference = 'com.anki.models';
|
||||||
|
// Optional space separated list of tags to add to every note
|
||||||
|
const tags = ['AnkiLan'];
|
||||||
|
// List of field names that will be used in AnkiDroid model
|
||||||
|
const modelFields = [
|
||||||
|
'Word or sentence',
|
||||||
|
'Part of speech 1',
|
||||||
|
'Translation 1',
|
||||||
|
'Definition 1',
|
||||||
|
'Part of speech 2',
|
||||||
|
'Translation 2',
|
||||||
|
'Definition 2',
|
||||||
|
'Usage example',
|
||||||
|
'Transcription',
|
||||||
|
'Sound',
|
||||||
|
];
|
||||||
|
// List of card names that will be used in AnkiDroid (one for each direction of learning)
|
||||||
|
const cardNames = ['Russian>English', 'English>Russian'];
|
||||||
|
// CSS to share between all the cards (optional).
|
||||||
|
const css = `.card {
|
||||||
|
font-family: 'Roboto', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
|
||||||
|
font-size: 24px;
|
||||||
|
text-align: center;
|
||||||
|
color: black;
|
||||||
|
background-color: white;
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
.big {
|
||||||
|
font-size: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.small {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sound--container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 0px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sound {
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.transcription {
|
||||||
|
color: #1e7efc;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.list{
|
||||||
|
list-style: none;
|
||||||
|
display: flex;
|
||||||
|
flex-direction:column;
|
||||||
|
align-items:center;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.definition{
|
||||||
|
font-size: 20px;
|
||||||
|
font-famyli: sans-serif;
|
||||||
|
font-style: italic;
|
||||||
|
display: block;
|
||||||
|
margin: 7px ;
|
||||||
|
padding: 0 20px ;
|
||||||
|
white-space: normal;
|
||||||
|
width: 70vw;
|
||||||
|
}
|
||||||
|
.usage{
|
||||||
|
background-color: rgba(100,100,100,0.1);
|
||||||
|
padding: 10px;
|
||||||
|
font-size: 20px;
|
||||||
|
white-space: normal;
|
||||||
|
width: 70vw;
|
||||||
|
margin: 0 auto;
|
||||||
|
border-radius: 5px;
|
||||||
|
}`;
|
||||||
|
// Template for the question of each card
|
||||||
|
const questionFmt1 = `
|
||||||
|
<div class="big">{{Word or sentence}}</div>
|
||||||
|
<ul class="list">
|
||||||
|
<li>
|
||||||
|
<div class="small">{{Part of speech 1}}</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div class="small">{{Part of speech 2}}</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div class="sound--container">
|
||||||
|
<div class="transcription">{{Transcription}}</div>
|
||||||
|
<span class="sound">{{Sound}}</span>
|
||||||
|
`;
|
||||||
|
const questionFmt2 = '<div class="big">{{Translation 1}}</div>';
|
||||||
|
const questionFormat = [questionFmt1, questionFmt2];
|
||||||
|
// Template for the answer (this example is identical for both sides)
|
||||||
|
const answerFmt1 = `
|
||||||
|
<div class="big">{{Word or sentence}}</div>
|
||||||
|
<div class="sound--container">
|
||||||
|
<div class="transcription">{{Transcription}}</div>
|
||||||
|
<span class="sound">{{Sound}}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<div class="usage">{{Usage example}}</div>
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
<ul class="list">
|
||||||
|
<li>
|
||||||
|
<div>
|
||||||
|
<div class="small">{{Part of speech 1}}</div>
|
||||||
|
<pre class="definition">{{Definition 1}}</pre>
|
||||||
|
<div>{{Translation 1}}</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<div>
|
||||||
|
<div class="small">{{Part of speech 2}}</div>
|
||||||
|
<pre class="definition">{{Definition 2}}</pre>
|
||||||
|
<div>{{Translation 2}}</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>`;
|
||||||
|
const answerFormat = [answerFmt1, answerFmt1];
|
||||||
|
|
||||||
|
//////////////////
|
||||||
|
// ADDING NOTES //
|
||||||
|
//////////////////
|
||||||
|
|
||||||
|
const deckProperties = {
|
||||||
|
name: deckName,
|
||||||
|
reference: dbDeckReference,
|
||||||
|
};
|
||||||
|
const modelProperties = {
|
||||||
|
name: modelName,
|
||||||
|
reference: dbModelReference,
|
||||||
|
fields: modelFields,
|
||||||
|
tags,
|
||||||
|
cardNames,
|
||||||
|
questionFormat,
|
||||||
|
answerFormat,
|
||||||
|
css,
|
||||||
|
};
|
||||||
|
|
||||||
|
const valueFields = [
|
||||||
|
'Word or sentence',
|
||||||
|
'Part of speech 1',
|
||||||
|
'Translation 1',
|
||||||
|
'Definition 1',
|
||||||
|
'Part of speech 2',
|
||||||
|
'Translation 2',
|
||||||
|
'Definition 2',
|
||||||
|
'Usage example',
|
||||||
|
'Transcription',
|
||||||
|
'Sound',
|
||||||
|
];
|
||||||
|
|
||||||
|
const settings = {
|
||||||
|
modelId: undefined,
|
||||||
|
modelProperties: modelProperties,
|
||||||
|
deckId: model.deck.id,
|
||||||
|
deckProperties: deckProperties,
|
||||||
|
};
|
||||||
|
|
||||||
|
const selectedDeck = new AnkiDroid(settings);
|
||||||
|
|
||||||
|
selectedDeck.addNote(valueFields, modelFields);
|
||||||
|
// returns a promise that returns the added note ID
|
||||||
|
} catch (err) {
|
||||||
|
console.log(err);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -8,13 +8,13 @@ import {ScrollView} from 'react-native';
|
||||||
const AddWordForm = props => {
|
const AddWordForm = props => {
|
||||||
return (
|
return (
|
||||||
<Container style={{padding: 20}}>
|
<Container style={{padding: 20}}>
|
||||||
|
<DeckPicker/>
|
||||||
{props.ankiLanModelExists ?
|
{props.ankiLanModelExists ?
|
||||||
<Form>
|
<Form>
|
||||||
<DeckPicker/>
|
|
||||||
</Form>
|
</Form>
|
||||||
:
|
:
|
||||||
<AnkiTemplate/>
|
<AnkiTemplate/>
|
||||||
}
|
}
|
||||||
</Container>
|
</Container>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,14 +6,14 @@ import {createAnkiLanModel} from '../../actions/createAnkiLanModel';
|
||||||
|
|
||||||
const AnkiTemplate = props => {
|
const AnkiTemplate = props => {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
props.checkAnkiLanModelForExisting(props.id)
|
props.checkAnkiLanModelForExisting(props.modelName)
|
||||||
}, [])
|
}, [])
|
||||||
return(
|
return(
|
||||||
<Grid style={{display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
|
<Grid style={{display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
|
||||||
<Text>You have no AnkiLan card template</Text>
|
<Text>You have no AnkiLan card template</Text>
|
||||||
<Button onPress={() => props.createAnkiLanModel({
|
<Button onPress={() => props.createAnkiLanModel({
|
||||||
id: props.modelId,
|
|
||||||
name: props.modelName,
|
name: props.modelName,
|
||||||
|
...props.currentDeck
|
||||||
})}><Text>Create</Text></Button>
|
})}><Text>Create</Text></Button>
|
||||||
|
|
||||||
</Grid>
|
</Grid>
|
||||||
|
@ -22,8 +22,8 @@ const AnkiTemplate = props => {
|
||||||
}
|
}
|
||||||
|
|
||||||
export default connect(state => ({
|
export default connect(state => ({
|
||||||
modelId: state.anki.ankiLanModelID,
|
modelName: state.anki.ankiLanModelName,
|
||||||
modelName: state.anki.ankiLanModelName
|
currentDeck: state.anki.selectedDeck
|
||||||
}), {
|
}), {
|
||||||
createAnkiLanModel,
|
createAnkiLanModel,
|
||||||
checkAnkiLanModelForExisting
|
checkAnkiLanModelForExisting
|
||||||
|
|
|
@ -1,17 +1,20 @@
|
||||||
import React, {useEffect, useState} from 'react'
|
import React, {useEffect, useState} from 'react'
|
||||||
import {connect} from 'react-redux'
|
import {connect} from 'react-redux'
|
||||||
import {Picker, Text} from 'native-base'
|
import {Picker, Text} from 'native-base'
|
||||||
import { getDeckList} from '../../actions/anki-get-actions';
|
import { getDeckList, getModelList} from '../../actions/anki-get-actions';
|
||||||
import {selectDeck} from '../../actions/anki-set-actions';
|
import {selectDeck} from '../../actions/anki-set-actions';
|
||||||
|
|
||||||
const DeckPicker = props => {
|
const DeckPicker = props => {
|
||||||
const [deckList, setDeckList] = useState([{name: "no decks", id: 0}]);
|
const [deckList, setDeckList] = useState([{name: "no decks", id: 0}]);
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
props.getDeckList()
|
props.getDeckList()
|
||||||
setDeckList(props.decks)
|
props.getModelList()
|
||||||
}, [])
|
}, [])
|
||||||
|
useEffect(() => {
|
||||||
|
setDeckList(props.decks)
|
||||||
|
}, [props.decks])
|
||||||
return (
|
return (
|
||||||
<Picker onValueChange={id => props.selectDeck(id)} selectedValue={props.selectedDeck} >
|
<Picker onValueChange={id => props.selectDeck({id, deck: deckList[id]})} selectedValue={props.selectedDeck.id}>
|
||||||
{deckList.map((deck, index) => (
|
{deckList.map((deck, index) => (
|
||||||
<Picker.Item label={deck.name} key={deck.id} value={index}/>
|
<Picker.Item label={deck.name} key={deck.id} value={index}/>
|
||||||
))}
|
))}
|
||||||
|
@ -24,5 +27,6 @@ export default connect(state => ({
|
||||||
selectedDeck: state.anki.selectedDeck
|
selectedDeck: state.anki.selectedDeck
|
||||||
}),{
|
}),{
|
||||||
getDeckList,
|
getDeckList,
|
||||||
selectDeck
|
selectDeck,
|
||||||
|
getModelList
|
||||||
})(DeckPicker)
|
})(DeckPicker)
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import {
|
import {
|
||||||
GET_DECK_LIST,
|
GET_DECK_LIST,
|
||||||
|
GET_MODEL_LIST,
|
||||||
REQUEST_PERMISSIONS,
|
REQUEST_PERMISSIONS,
|
||||||
SET_DECK,
|
SET_DECK,
|
||||||
SET_EXISTING_OF_ANKI_LAN_MODEL,
|
SET_EXISTING_OF_ANKI_LAN_MODEL,
|
||||||
|
@ -9,12 +10,15 @@ const initialState = {
|
||||||
isApiAvailable: false,
|
isApiAvailable: false,
|
||||||
appHasAccess: false,
|
appHasAccess: false,
|
||||||
deckList: [],
|
deckList: [],
|
||||||
selectedDeck: '1',
|
modelList: [],
|
||||||
|
selectedDeck: {
|
||||||
|
id: '1',
|
||||||
|
deck: Object,
|
||||||
|
},
|
||||||
mainFieldIsAvailable: false,
|
mainFieldIsAvailable: false,
|
||||||
fieldList: [],
|
fieldList: [],
|
||||||
ankiLanModelIsAlreadyExists: false,
|
ankiLanModelIsAlreadyExists: false,
|
||||||
ankiLanModelID: '7410448765670',
|
ankiLanModelName: 'AnkiLan_test',
|
||||||
ankiLanModelName: 'AnkiLan',
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const ankiReducer = (state = initialState, action) => {
|
const ankiReducer = (state = initialState, action) => {
|
||||||
|
@ -24,8 +28,13 @@ const ankiReducer = (state = initialState, action) => {
|
||||||
return {...state, appHasAccess: action.payload};
|
return {...state, appHasAccess: action.payload};
|
||||||
case GET_DECK_LIST:
|
case GET_DECK_LIST:
|
||||||
return {...state, deckList: action.payload};
|
return {...state, deckList: action.payload};
|
||||||
|
case GET_MODEL_LIST:
|
||||||
|
return {...state, modelList: action.payload};
|
||||||
case SET_DECK:
|
case SET_DECK:
|
||||||
return {...state, selectedDeck: action.payload};
|
return {
|
||||||
|
...state,
|
||||||
|
selectedDeck: {...state.selectedDeck, ...action.payload},
|
||||||
|
};
|
||||||
case SET_EXISTING_OF_ANKI_LAN_MODEL:
|
case SET_EXISTING_OF_ANKI_LAN_MODEL:
|
||||||
return {...state, ankiLanModelIsAlreadyExists: action.payload};
|
return {...state, ankiLanModelIsAlreadyExists: action.payload};
|
||||||
default:
|
default:
|
||||||
|
|
Loading…
Reference in New Issue