2017-06-26 00:23:03 +02:00
|
|
|
// import 'font-awesome/scss/font-awesome.scss';
|
2016-09-22 02:18:54 +02:00
|
|
|
import './sass/main.scss';
|
2016-09-21 22:40:25 +02:00
|
|
|
|
2017-01-14 20:55:42 +01:00
|
|
|
import Inferno from 'inferno';
|
2018-02-22 07:47:39 +01:00
|
|
|
import { Component, render } from 'inferno';
|
2018-01-22 02:09:52 +01:00
|
|
|
import store from 'store';
|
2016-09-21 22:40:25 +02:00
|
|
|
|
2017-12-22 20:16:25 +01:00
|
|
|
import removeDiacritics from '../vendor/StackOverflow/removeDiacritics';
|
2017-12-16 18:14:34 +01:00
|
|
|
import { addHelpfulPrototypes, getWordsStats } from './Helpers';
|
2017-08-21 07:53:59 +02:00
|
|
|
addHelpfulPrototypes();
|
|
|
|
|
2017-04-19 23:11:37 +02:00
|
|
|
import dictionary from './managers/DictionaryData';
|
2017-08-20 19:57:17 +02:00
|
|
|
import { Updater } from './managers/Updater';
|
2017-12-22 20:16:25 +01:00
|
|
|
import SEARCH_METHOD from './components/management/SearchBox/SearchMethod';
|
2017-08-17 00:53:55 +02:00
|
|
|
|
2017-04-04 22:39:35 +02:00
|
|
|
if (process.env.NODE_ENV !== 'production') {
|
|
|
|
require('inferno-devtools');
|
|
|
|
}
|
|
|
|
|
2017-07-26 06:11:33 +02:00
|
|
|
import { Header } from './components/structure/Header';
|
|
|
|
import { MainDisplay } from './components/MainDisplay';
|
|
|
|
import { Footer } from './components/structure/Footer';
|
2017-04-04 22:39:35 +02:00
|
|
|
|
2017-04-04 06:24:14 +02:00
|
|
|
class App extends Component {
|
|
|
|
constructor (props) {
|
2016-09-21 22:40:25 +02:00
|
|
|
super(props);
|
2017-04-19 23:11:37 +02:00
|
|
|
|
|
|
|
this.state = {
|
2017-06-25 23:49:23 +02:00
|
|
|
name: dictionary.name,
|
|
|
|
specification: dictionary.specification,
|
|
|
|
description: dictionary.description,
|
|
|
|
partsOfSpeech: dictionary.partsOfSpeech,
|
2017-08-20 22:41:08 +02:00
|
|
|
details: dictionary.details,
|
2017-12-12 18:16:15 +01:00
|
|
|
settings: dictionary.settings,
|
2017-12-17 21:48:48 +01:00
|
|
|
stats: {},
|
2017-08-20 22:41:08 +02:00
|
|
|
alphabeticalOrder: dictionary.alphabeticalOrder,
|
|
|
|
|
2017-06-25 23:49:23 +02:00
|
|
|
displayedWords: [],
|
2018-02-22 07:14:39 +01:00
|
|
|
currentPage: 0,
|
|
|
|
itemsPerPage: 30,
|
2018-05-18 19:44:14 +02:00
|
|
|
useIpaPronunciationField: true,
|
2017-12-22 20:16:25 +01:00
|
|
|
searchConfig: {
|
|
|
|
searchingIn: 'name',
|
|
|
|
searchMethod: SEARCH_METHOD.contains,
|
|
|
|
searchTerm: '',
|
|
|
|
caseSensitive: false,
|
|
|
|
ignoreDiacritics: false,
|
|
|
|
filteredPartsOfSpeech: [...dictionary.partsOfSpeech, 'Uncategorized'],
|
|
|
|
},
|
2018-03-09 20:06:02 +01:00
|
|
|
isLoadingWords: true,
|
2018-03-09 19:39:16 +01:00
|
|
|
wordsInCurrentList: null,
|
2017-04-19 23:11:37 +02:00
|
|
|
}
|
2017-08-17 00:53:55 +02:00
|
|
|
|
|
|
|
this.updater = new Updater(this, dictionary);
|
2017-11-15 19:00:04 +01:00
|
|
|
|
2018-01-22 02:09:52 +01:00
|
|
|
this.updateDisplayedWords(() => {
|
|
|
|
if (store.get('LexicongaToken')) this.updater.sync();
|
|
|
|
});
|
2017-04-19 23:11:37 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
get dictionaryInfo () {
|
2017-08-20 22:41:08 +02:00
|
|
|
const {
|
2017-06-25 23:49:23 +02:00
|
|
|
name,
|
|
|
|
specification,
|
|
|
|
description,
|
|
|
|
partsOfSpeech,
|
2017-08-20 22:41:08 +02:00
|
|
|
details,
|
2017-12-12 18:16:15 +01:00
|
|
|
settings,
|
2017-12-16 18:14:34 +01:00
|
|
|
stats,
|
2017-08-20 22:41:08 +02:00
|
|
|
alphabeticalOrder,
|
|
|
|
} = this.state;
|
2017-04-19 23:11:37 +02:00
|
|
|
|
2017-08-20 22:41:08 +02:00
|
|
|
return {
|
|
|
|
name,
|
|
|
|
specification,
|
|
|
|
description,
|
|
|
|
partsOfSpeech,
|
|
|
|
details,
|
2017-12-12 18:16:15 +01:00
|
|
|
settings,
|
2017-12-16 18:14:34 +01:00
|
|
|
stats,
|
2017-08-20 22:41:08 +02:00
|
|
|
alphabeticalOrder,
|
|
|
|
};
|
2017-04-19 23:11:37 +02:00
|
|
|
}
|
|
|
|
|
2017-12-22 20:35:50 +01:00
|
|
|
get isUsingFilter () {
|
|
|
|
const partsOfSpeechForFilter = [...this.state.partsOfSpeech, 'Uncategorized'];
|
|
|
|
return this.state.searchConfig.searchTerm !== ''
|
|
|
|
|| partsOfSpeechForFilter.length !== this.state.searchConfig.filteredPartsOfSpeech.length;
|
|
|
|
}
|
|
|
|
|
2017-06-25 23:49:23 +02:00
|
|
|
updatePartsOfSpeech () {
|
|
|
|
this.setState({
|
|
|
|
partsOfSpeech: dictionary.partsOfSpeech,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2017-12-17 21:48:48 +01:00
|
|
|
updateDisplayedWords (callback = () => {}) {
|
2018-02-22 07:14:39 +01:00
|
|
|
const {currentPage, itemsPerPage} = this.state;
|
2017-12-16 18:14:34 +01:00
|
|
|
dictionary.wordsPromise.then(words => {
|
2018-02-22 07:14:39 +01:00
|
|
|
const { searchConfig, partsOfSpeech, currentPage, itemsPerPage } = this.state;
|
2017-12-22 20:16:25 +01:00
|
|
|
const partsOfSpeechForFilter = [...partsOfSpeech, 'Uncategorized'];
|
2018-02-22 07:14:39 +01:00
|
|
|
const pageStart = currentPage * itemsPerPage;
|
|
|
|
const pageEnd = pageStart + itemsPerPage;
|
2018-03-09 19:39:16 +01:00
|
|
|
let displayedWords = words;
|
2017-12-22 20:35:50 +01:00
|
|
|
if (this.isUsingFilter) {
|
2017-12-22 20:16:25 +01:00
|
|
|
const {
|
|
|
|
searchingIn,
|
|
|
|
searchTerm,
|
|
|
|
searchMethod,
|
|
|
|
caseSensitive,
|
|
|
|
ignoreDiacritics,
|
|
|
|
filteredPartsOfSpeech
|
|
|
|
} = searchConfig;
|
2017-12-22 20:35:50 +01:00
|
|
|
|
2018-03-09 19:39:16 +01:00
|
|
|
displayedWords = displayedWords.filter((word, index) => {
|
2017-12-22 20:16:25 +01:00
|
|
|
const wordPartOfSpeech = word.partOfSpeech === '' ? 'Uncategorized' : word.partOfSpeech;
|
|
|
|
if (!filteredPartsOfSpeech.includes(wordPartOfSpeech)) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
if (searchingIn === 'details') {
|
|
|
|
let term = searchTerm;
|
|
|
|
let wordsOnly = word.details
|
|
|
|
.replace(/[\*_\|]|(\s*[\*-]\s)|-+/g, '') // Common Markdown
|
|
|
|
.replace(/\[\[(.+)\]\]/g, '$&') // Double brackets
|
|
|
|
.replace(/\!?\[(.+)\]\(.*\)/g, '$&'); // Links/images
|
|
|
|
|
|
|
|
if (ignoreDiacritics) {
|
|
|
|
wordsOnly = removeDiacritics(wordsOnly);
|
|
|
|
term = removeDiacritics(term);
|
|
|
|
}
|
|
|
|
if (!caseSensitive) {
|
|
|
|
wordsOnly = wordsOnly.toLowerCase();
|
|
|
|
term = term.toLowerCase();
|
|
|
|
}
|
|
|
|
|
|
|
|
console.log(wordsOnly);
|
|
|
|
|
|
|
|
return wordsOnly.includes(term);
|
|
|
|
} else {
|
|
|
|
let wordPart = word[searchingIn];
|
|
|
|
let term = searchTerm;
|
|
|
|
if (ignoreDiacritics) {
|
|
|
|
wordPart = removeDiacritics(wordPart);
|
|
|
|
term = removeDiacritics(term);
|
|
|
|
}
|
|
|
|
if (!caseSensitive) {
|
|
|
|
wordPart = wordPart.toLowerCase();
|
|
|
|
term = term.toLowerCase();
|
|
|
|
}
|
|
|
|
switch (searchMethod) {
|
|
|
|
case 'contains':
|
|
|
|
default: {
|
|
|
|
return wordPart.includes(term);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
case 'start': {
|
|
|
|
return wordPart.startsWith(term);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
case 'end': {
|
|
|
|
return wordPart.endsWith(term);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
case 'exact': {
|
|
|
|
return wordPart === term;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2018-03-09 19:39:16 +01:00
|
|
|
const wordsInCurrentList = displayedWords.length;
|
|
|
|
|
|
|
|
displayedWords = displayedWords.filter((word, index) => {
|
|
|
|
if (index < pageStart || index >= pageEnd) {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
return true;
|
|
|
|
});
|
|
|
|
|
2017-06-25 22:23:42 +02:00
|
|
|
this.setState({
|
2017-12-22 20:16:25 +01:00
|
|
|
displayedWords,
|
|
|
|
stats: getWordsStats(words, partsOfSpeech, this.state.settings.caseSensitive),
|
2018-03-09 19:39:16 +01:00
|
|
|
wordsInCurrentList,
|
2018-03-09 20:06:02 +01:00
|
|
|
isLoadingWords: false,
|
2017-12-17 21:48:48 +01:00
|
|
|
}, () => callback());
|
2017-06-25 22:23:42 +02:00
|
|
|
});
|
2017-04-19 23:11:37 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
search (searchConfig) {
|
|
|
|
this.setState({
|
2018-03-09 20:06:02 +01:00
|
|
|
isLoadingWords: true,
|
2017-06-25 23:49:23 +02:00
|
|
|
searchConfig: searchConfig,
|
2017-12-22 20:16:25 +01:00
|
|
|
}, () => this.updateDisplayedWords());
|
2016-09-22 22:05:49 +02:00
|
|
|
}
|
|
|
|
|
2018-02-22 07:14:39 +01:00
|
|
|
setPage (newPage) {
|
|
|
|
this.setState({
|
2018-03-09 20:06:02 +01:00
|
|
|
isLoadingWords: true,
|
2018-02-22 07:14:39 +01:00
|
|
|
currentPage: newPage,
|
|
|
|
}, () => this.updateDisplayedWords());
|
|
|
|
}
|
|
|
|
|
2017-04-04 06:24:14 +02:00
|
|
|
render () {
|
2016-09-21 22:40:25 +02:00
|
|
|
return (
|
2016-09-22 02:18:54 +02:00
|
|
|
<div>
|
2017-04-19 23:11:37 +02:00
|
|
|
<Header
|
2017-06-25 23:49:23 +02:00
|
|
|
partsOfSpeech={ this.state.partsOfSpeech }
|
2017-08-17 00:53:55 +02:00
|
|
|
search={ (searchConfig) => this.search(searchConfig) }
|
2018-01-12 22:58:21 +01:00
|
|
|
updater={ this.updater }
|
2017-08-17 00:53:55 +02:00
|
|
|
/>
|
2017-01-14 20:55:42 +01:00
|
|
|
|
2017-04-19 23:11:37 +02:00
|
|
|
<MainDisplay
|
2017-06-25 23:49:23 +02:00
|
|
|
dictionaryInfo={ this.dictionaryInfo }
|
2018-03-09 20:06:02 +01:00
|
|
|
isLoadingWords={ this.state.isLoadingWords }
|
2017-06-25 23:49:23 +02:00
|
|
|
wordsToDisplay={ this.state.displayedWords }
|
2017-12-22 20:35:50 +01:00
|
|
|
wordsAreFiltered={ this.isUsingFilter }
|
2018-03-09 19:39:16 +01:00
|
|
|
wordsInCurrentList={ this.state.wordsInCurrentList }
|
2018-02-22 07:14:39 +01:00
|
|
|
currentPage={ this.state.currentPage }
|
|
|
|
itemsPerPage={ this.state.itemsPerPage }
|
2018-05-18 19:44:14 +02:00
|
|
|
useIpaPronunciationField={ this.state.useIpaPronunciationField }
|
2018-02-22 07:14:39 +01:00
|
|
|
stats={ this.state.stats }
|
|
|
|
setPage={ this.setPage.bind(this) }
|
2017-08-17 00:53:55 +02:00
|
|
|
updateDisplay={ this.updateDisplayedWords.bind(this) }
|
|
|
|
updater={ this.updater }
|
|
|
|
/>
|
2016-09-27 23:12:48 +02:00
|
|
|
|
2017-04-04 22:39:35 +02:00
|
|
|
<Footer />
|
2016-09-22 02:18:54 +02:00
|
|
|
</div>
|
2016-09-21 22:40:25 +02:00
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2018-02-22 07:47:39 +01:00
|
|
|
render(<App />, document.getElementById('site'));
|