Make useIPAPronunciation a browser/session setting

This commit is contained in:
Robbie Antenesse 2018-06-23 12:41:22 -06:00
parent e21316ff36
commit c6abce8cc6
7 changed files with 43 additions and 28 deletions

View File

@ -81,13 +81,12 @@ VALUES (?, ?, ?, ?, ?, ?)';
public function setUserData ($token, $user_data) {
$token_data = $this->token->decode($token);
if ($token_data !== false) {
$query = 'UPDATE users SET email=?, public_name=?, username=?, allow_email=?, use_ipa=? WHERE id=?';
$query = 'UPDATE users SET email=?, public_name=?, username=?, allow_email=? WHERE id=?';
$properties = array(
$user_data['email'],
$user_data['publicName'],
$user_data['username'],
$user_data['allowEmail'],
$user_data['useIPAPronunciation'],
$user_id,
);
$update_success = $this->db->execute($query, $properties);
@ -112,7 +111,6 @@ VALUES (?, ?, ?, ?, ?, ?)';
'username' => $user['username'],
'publicName' => $user['public_name'],
'allowEmails' => $user['allow_email'] == 1 ? true : false,
'useIPAPronunciation' => $user['use_ipa'] == 1 ? true : false,
);
}

View File

@ -21,7 +21,7 @@ CREATE TABLE IF NOT EXISTS `dictionaries` (
`last_updated` int(11) DEFAULT NULL,
`created_on` int(11) NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=421 DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
) ENGINE=MyISAM AUTO_INCREMENT=422 DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
DELIMITER $$
CREATE TRIGGER `delete_dictionary_parts` AFTER DELETE ON `dictionaries` FOR EACH ROW BEGIN
DELETE FROM words WHERE words.dictionary=old.id;
@ -56,7 +56,6 @@ CREATE TABLE IF NOT EXISTS `users` (
`username` varchar(50) COLLATE utf8_unicode_ci NOT NULL,
`current_dictionary` int(11) DEFAULT NULL,
`allow_email` tinyint(1) NOT NULL DEFAULT '1',
`use_ipa` tinyint(1) NOT NULL DEFAULT '1',
`last_login` int(11) DEFAULT NULL,
`password_reset_code` varchar(20) COLLATE utf8_unicode_ci DEFAULT NULL,
`password_reset_date` int(11) DEFAULT NULL,
@ -64,7 +63,7 @@ CREATE TABLE IF NOT EXISTS `users` (
PRIMARY KEY (`id`),
UNIQUE KEY `email` (`email`),
UNIQUE KEY `username` (`username`)
) ENGINE=MyISAM AUTO_INCREMENT=183 DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
) ENGINE=MyISAM AUTO_INCREMENT=184 DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
DELIMITER $$
CREATE TRIGGER `Delete_User_Dictionaries` AFTER DELETE ON `users` FOR EACH ROW DELETE FROM dictionaries WHERE dictionaries.user = old.id
$$

View File

@ -65,7 +65,6 @@ export class MainDisplay extends Component {
wordsAreFiltered,
wordsInCurrentList,
currentPage,
useIpaPronunciationField,
stats,
setPage,
updateDisplay,

View File

@ -11,7 +11,6 @@ export class MyAccount extends Component {
username: PropTypes.string.isRequired,
publicName: PropTypes.string.isRequired,
allowEmails: PropTypes.bool.isRequired,
useIPAPronunciation: PropTypes.bool.isRequired,
userDictionaries: PropTypes.array.isRequired,
updateUserData: PropTypes.func,
changeDictionary: PropTypes.func,
@ -22,7 +21,6 @@ export class MyAccount extends Component {
username: this.props.username,
publicName: this.props.publicName,
allowEmails: this.props.allowEmails,
useIPAPronunciation: this.props.useIPAPronunciation,
userDictionaries: this.props.userDictionaries,
};
}
@ -59,14 +57,6 @@ export class MyAccount extends Component {
</label>
</div>
</div>
<div className='field'>
<input className='is-checkradio is-rtl' type='checkbox' id='useIPAPronunciation'
checked={this.state.useIPAPronunciation ? 'checked' : false}
onChange={(event) => { this.setState({ useIPAPronunciation: !this.state.useIPAPronunciation }) }} />
<label className='label is-unselectable' htmlFor='useIPAPronunciation'>
Use IPA in Pronunciation Fields
</label>
</div>
</div>
<div className='column'>

View File

@ -28,7 +28,6 @@ export class AccountManager extends Component {
username: userData && userData.hasOwnProperty('username') ? userData.username : DEFAULT_USER_DATA.username,
publicName: userData && userData.hasOwnProperty('publicName') ? userData.publicName : DEFAULT_USER_DATA.publicName,
allowEmails: userData && userData.hasOwnProperty('allowEmails') ? userData.allowEmails : DEFAULT_USER_DATA.allowEmails,
useIPAPronunciation: userData && userData.hasOwnProperty('useIPAPronunciation') ? userData.useIPAPronunciation : DEFAULT_USER_DATA.useIPAPronunciation,
itemsPerPage: userData && userData.hasOwnProperty('itemsPerPage') ? userData.itemsPerPage : DEFAULT_USER_DATA.itemsPerPage,
},
userDictionaries: [],
@ -123,7 +122,6 @@ export class AccountManager extends Component {
username={ userData.username }
publicName={ userData.publicName }
allowEmails={ userData.allowEmails }
useIPAPronunciation={ userData.useIPAPronunciation }
userDictionaries={ this.state.userDictionaries }
updateUserData={ this.updateUserData.bind(this) }
changeDictionary={ () => {} } />

View File

@ -1,6 +1,9 @@
import Inferno from 'inferno';
import { Component } from 'inferno';
import PropTypes from 'prop-types';
import store from 'store';
import { DEFAULT_USER_DATA } from '../../Constants';
const phondueUsage = require('../../../vendor/KeyboardFire/phondue/usage.html');
const digraphs = require('../../../vendor/KeyboardFire/phondue/digraphs.json');
@ -22,7 +25,7 @@ export class IPAField extends Component {
helpText: PropTypes.string,
placeholder: PropTypes.string,
isDisplayOnly: PropTypes.bool,
preventIPA: PropTypes.bool,
useIPASetting: PropTypes.bool,
onInput: PropTypes.func,
onChange: PropTypes.func,
}, props, 'prop', 'IPAField');
@ -31,6 +34,7 @@ export class IPAField extends Component {
value: props.value || '',
doShowHelp: false,
doShowTable: false,
useIPA: this.useIPA,
}
this.field = null;
@ -42,6 +46,23 @@ export class IPAField extends Component {
});
}
get useIPA() {
if (this.props.useIPASetting) {
const userData = store.get('LexicongaUserData');
return userData && userData.hasOwnProperty('useIPAPronunciation')
? userData.useIPAPronunciation : DEFAULT_USER_DATA.useIPAPronunciation;
}
return true;
}
toggleIPA () {
const userData = store.get('LexicongaUserData');
userData.useIPAPronunciation = !this.useIPA;
this.setState({ useIPA: userData.useIPAPronunciation }, () => {
store.set('LexicongaUserData', userData);
});
}
showHelp () {
if (this.state.doShowHelp) {
return (
@ -105,7 +126,7 @@ export class IPAField extends Component {
onInput (event) {
let val = event.target.value;
let pos;
if (!this.props.preventIPA) {
if (this.state.useIPA) {
pos = this.field.selectionStart || val.length;
if (event.key) {
@ -121,7 +142,7 @@ export class IPAField extends Component {
if (val !== this.state.value) {
this.setState({ value: val }, () => {
if (!this.props.preventIPA) {
if (this.state.useIPA) {
this.field.focus();
this.field.setSelectionRange(pos, pos);
}
@ -144,6 +165,19 @@ export class IPAField extends Component {
<div className='field'>
<label className='label' htmlFor={ this.props.id || null }>
{ this.props.label || 'Pronunciation' }
{ this.props.useIPASetting &&
<a className='button is-small is-pulled-right is-inline'
title='Toggle IPA'
aria-label={`Toggle IPA`}
onClick={this.toggleIPA.bind(this)}>
<span className='icon'>
<i className={`fa fa-${this.state.useIPA ? 'ban' : 'check-circle-o'}`} />
</span>
<span className='is-hidden-touch'>
{this.state.useIPA ? 'Dis' : 'En' }able IPA
</span>
</a>
}
</label>
{
this.props.helpText
@ -155,7 +189,7 @@ export class IPAField extends Component {
}
<div className='control'>
<input className='input' id={ this.props.id || null } type='text'
placeholder={ this.props.placeholder || (!this.props.preventIPA ? '[prə.ˌnʌn.si.ˈeɪ.ʃən]' : 'pronunciation') }
placeholder={ this.props.placeholder || (this.state.useIPA ? '[prə.ˌnʌn.si.ˈeɪ.ʃən]' : 'pronunciation') }
disabled={ !!this.props.isDisplayOnly }
ref={ (input) => this.field = input }
value={ this.state.value }
@ -163,7 +197,7 @@ export class IPAField extends Component {
onKeyDown={ (event) => this.onInput(event) }
onChange={ () => this.onChange() } />
</div>
{ !this.props.preventIPA && this.showButtons() }
{ this.state.useIPA && this.showButtons() }
</div>
);
}

View File

@ -103,9 +103,6 @@ export class WordForm extends Component {
}
render () {
const userData = store.get('LexicongaUserData');
const useIpaField = userData && userData.hasOwnProperty('useIPAPronunciation')
? userData.useIPAPronunciation : DEFAULT_USER_DATA.useIPAPronunciation;
return (
<div className='box'>
<div className='field'>
@ -125,7 +122,7 @@ export class WordForm extends Component {
</div>
<IPAField value={ this.state.wordPronunciation }
preventIPA={ !useIpaField }
useIPASetting={ true }
onChange={ (newValue) => this.setState({ wordPronunciation: newValue }) } />
<div className='field'>