From da1d52d546121e6c36cca9dea90c4a3bc540b0b7 Mon Sep 17 00:00:00 2001 From: =Corey Hulen Date: Fri, 22 Jan 2016 09:10:08 -0600 Subject: PLT-7 adding lang selector --- .../components/user_settings/manage_languages.jsx | 101 +++++++++++++++++++++ .../components/user_settings/user_settings.jsx | 1 + .../user_settings/user_settings_display.jsx | 44 +++++++++ 3 files changed, 146 insertions(+) create mode 100644 web/react/components/user_settings/manage_languages.jsx (limited to 'web/react/components') diff --git a/web/react/components/user_settings/manage_languages.jsx b/web/react/components/user_settings/manage_languages.jsx new file mode 100644 index 000000000..123165b76 --- /dev/null +++ b/web/react/components/user_settings/manage_languages.jsx @@ -0,0 +1,101 @@ +// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved. +// See License.txt for license information. + +import * as Client from '../../utils/client.jsx'; +import * as Utils from '../../utils/utils.jsx'; + +export default class ManageLanguage extends React.Component { + constructor(props) { + super(props); + + this.setupInitialState = this.setupInitialState.bind(this); + this.setLanguage = this.setLanguage.bind(this); + this.changeLanguage = this.changeLanguage.bind(this); + this.submitUser = this.submitUser.bind(this); + this.state = this.setupInitialState(props); + } + setupInitialState(props) { + var user = props.user; + return { + languages: Utils.languages(), + locale: user.locale + }; + } + setLanguage(e) { + this.setState({locale: e.target.value}); + } + changeLanguage(e) { + e.preventDefault(); + + var user = this.props.user; + var locale = this.state.locale; + + user.locale = locale; + + this.submitUser(user); + } + submitUser(user) { + Client.updateUser(user, + () => { + window.location.reload(true); + }, + (err) => { + let serverError; + if (err.message) { + serverError = err.message; + } else { + serverError = err; + } + this.setState({serverError}); + } + ); + } + render() { + let serverError; + if (this.state.serverError) { + serverError = ; + } + + const options = []; + this.state.languages.forEach((lang) => { + options.push( + ); + }); + + return ( +
+
+ +
+ + {serverError} +
+ + {'Set language'} + +
+
+
+ ); + } +} + +ManageLanguage.propTypes = { + user: React.PropTypes.object +}; \ No newline at end of file diff --git a/web/react/components/user_settings/user_settings.jsx b/web/react/components/user_settings/user_settings.jsx index 54d98bbde..9303d874d 100644 --- a/web/react/components/user_settings/user_settings.jsx +++ b/web/react/components/user_settings/user_settings.jsx @@ -11,6 +11,7 @@ import DeveloperTab from './user_settings_developer.jsx'; import IntegrationsTab from './user_settings_integrations.jsx'; import DisplayTab from './user_settings_display.jsx'; import AdvancedTab from './user_settings_advanced.jsx'; +import LanguagesTab from './user_settings_language.jsx'; export default class UserSettings extends React.Component { constructor(props) { diff --git a/web/react/components/user_settings/user_settings_display.jsx b/web/react/components/user_settings/user_settings_display.jsx index 1ff0a2913..b12eb2d9c 100644 --- a/web/react/components/user_settings/user_settings_display.jsx +++ b/web/react/components/user_settings/user_settings_display.jsx @@ -6,6 +6,7 @@ import SettingItemMin from '../setting_item_min.jsx'; import SettingItemMax from '../setting_item_max.jsx'; import Constants from '../../utils/constants.jsx'; import PreferenceStore from '../../stores/preference_store.jsx'; +import ManageLanguages from './manage_languages.jsx'; import * as Utils from '../../utils/utils.jsx'; function getDisplayStateFromStores() { @@ -78,6 +79,7 @@ export default class UserSettingsDisplay extends React.Component { let clockSection; let nameFormatSection; let fontSection; + let languagesSection; if (this.props.activeSection === 'clock') { const clockFormat = [false, false]; @@ -292,6 +294,46 @@ export default class UserSettingsDisplay extends React.Component { ); } + if (this.props.activeSection === 'languages') { + var inputs = []; + inputs.push( + + ); + + languagesSection = ( + { + this.updateSection(''); + e.preventDefault(); + }} + /> + ); + } else { + var locale = 'English'; + Utils.languages().forEach((l) => { + if (l.value === this.props.user.locale) { + locale = l.name; + } + }); + + languagesSection = ( + { + this.updateSection('languages'); + }} + /> + ); + } + return (
@@ -324,6 +366,8 @@ export default class UserSettingsDisplay extends React.Component {
{nameFormatSection}
+ {languagesSection} +
); -- cgit v1.2.3-1-g7c22 From 058d6b24672ce22d72451607eef7c9dcc48a255a Mon Sep 17 00:00:00 2001 From: =Corey Hulen Date: Fri, 22 Jan 2016 09:27:27 -0600 Subject: PLT-7 adding loc feature to preview --- .../user_settings/user_settings_display.jsx | 76 +++++++++++----------- 1 file changed, 39 insertions(+), 37 deletions(-) (limited to 'web/react/components') diff --git a/web/react/components/user_settings/user_settings_display.jsx b/web/react/components/user_settings/user_settings_display.jsx index b12eb2d9c..f2c2502fb 100644 --- a/web/react/components/user_settings/user_settings_display.jsx +++ b/web/react/components/user_settings/user_settings_display.jsx @@ -5,6 +5,7 @@ import {savePreferences} from '../../utils/client.jsx'; import SettingItemMin from '../setting_item_min.jsx'; import SettingItemMax from '../setting_item_max.jsx'; import Constants from '../../utils/constants.jsx'; +const PreReleaseFeatures = Constants.PRE_RELEASE_FEATURES; import PreferenceStore from '../../stores/preference_store.jsx'; import ManageLanguages from './manage_languages.jsx'; import * as Utils from '../../utils/utils.jsx'; @@ -294,44 +295,46 @@ export default class UserSettingsDisplay extends React.Component { ); } - if (this.props.activeSection === 'languages') { - var inputs = []; - inputs.push( - - ); + if (Utils.isFeatureEnabled(PreReleaseFeatures.LOC_PREVIEW)) { + if (this.props.activeSection === 'languages') { + var inputs = []; + inputs.push( + + ); - languagesSection = ( - { - this.updateSection(''); - e.preventDefault(); - }} - /> - ); - } else { - var locale = 'English'; - Utils.languages().forEach((l) => { - if (l.value === this.props.user.locale) { - locale = l.name; - } - }); + languagesSection = ( + { + this.updateSection(''); + e.preventDefault(); + }} + /> + ); + } else { + var locale = 'English'; + Utils.languages().forEach((l) => { + if (l.value === this.props.user.locale) { + locale = l.name; + } + }); - languagesSection = ( - { - this.updateSection('languages'); - }} - /> - ); + languagesSection = ( + { + this.updateSection('languages'); + }} + /> + ); + } } return ( @@ -367,7 +370,6 @@ export default class UserSettingsDisplay extends React.Component { {nameFormatSection}
{languagesSection} -
); -- cgit v1.2.3-1-g7c22 From 0b3c988ed3ced12c64f84e9c5afd08470cbb84bc Mon Sep 17 00:00:00 2001 From: =Corey Hulen Date: Fri, 22 Jan 2016 09:29:21 -0600 Subject: PLT-7 adding loc feature to preview --- web/react/components/user_settings/user_settings.jsx | 1 - 1 file changed, 1 deletion(-) (limited to 'web/react/components') diff --git a/web/react/components/user_settings/user_settings.jsx b/web/react/components/user_settings/user_settings.jsx index 9303d874d..54d98bbde 100644 --- a/web/react/components/user_settings/user_settings.jsx +++ b/web/react/components/user_settings/user_settings.jsx @@ -11,7 +11,6 @@ import DeveloperTab from './user_settings_developer.jsx'; import IntegrationsTab from './user_settings_integrations.jsx'; import DisplayTab from './user_settings_display.jsx'; import AdvancedTab from './user_settings_advanced.jsx'; -import LanguagesTab from './user_settings_language.jsx'; export default class UserSettings extends React.Component { constructor(props) { -- cgit v1.2.3-1-g7c22