Merge pull request #2010 from ZBoxApp/PLT-7-tutorial

PLT-7: Refactoring frontend (chunk 3)
Этот коммит содержится в:
Corey Hulen
2016-01-28 11:43:10 -05:00
родитель 211fa8e5cc a72ba14024
Коммит db37897538
9 изменённых файлов: 297 добавлений и 44 удалений

Просмотреть файл

@@ -9,6 +9,9 @@ import * as Utils from '../../utils/utils.jsx';
import * as AsyncClient from '../../utils/async_client.jsx';
import Constants from '../../utils/constants.jsx';
import {FormattedMessage, FormattedHTMLMessage} from 'mm-intl';
const Preferences = Constants.Preferences;
const NUM_SCREENS = 3;
@@ -61,10 +64,13 @@ export default class TutorialIntroScreens extends React.Component {
return (
<div>
<h3>{'Welcome to:'}</h3>
<h1>{'Mattermost'}</h1>
<p>{'Your team communication all in one place, instantly searchable and available anywhere.'}</p>
<p>{'Keep your team connected to help them achieve what matters most.'}</p>
<FormattedHTMLMessage
id='tutorial_intro.screenOne'
defaultMessage='<h3>Welcome to:</h3>
<h1>Mattermost</h1>
<p>Your team communication all in one place, instantly searchable and available anywhere</p>
<p>Keep your team connected to help them achieve what matters most.</p>'
/>
{circles}
</div>
);
@@ -74,9 +80,12 @@ export default class TutorialIntroScreens extends React.Component {
return (
<div>
<h3>{'How Mattermost works:'}</h3>
<p>{'Communication happens in public discussion channels, private groups and direct messages.'}</p>
<p>{'Everything is archived and searchable from any web-enabled desktop, laptop or phone.'}</p>
<FormattedHTMLMessage
id='tutorial_intro.screenTwo'
defaultMessage='<h3>How Mattermost works:</h3>
<p>Communication happens in public discussion channels, private groups and direct messages.</p>
<p>Everything is archived and searchable from any web-enabled desktop, laptop or phone.</p>'
/>
{circles}
</div>
);
@@ -92,7 +101,10 @@ export default class TutorialIntroScreens extends React.Component {
data-toggle='modal'
data-target='#invite_member'
>
{'Invite teammates'}
<FormattedMessage
id='tutorial_intro.invite'
defaultMessage='Invite teammates'
/>
</a>
);
} else {
@@ -105,7 +117,10 @@ export default class TutorialIntroScreens extends React.Component {
data-title='Team Invite'
data-value={Utils.getWindowLocationOrigin() + '/signup_user_complete/?id=' + team.id}
>
{'Invite teammates'}
<FormattedMessage
id='tutorial_intro.teamInvite'
defaultMessage='Team Invite'
/>
</a>
);
}
@@ -116,7 +131,10 @@ export default class TutorialIntroScreens extends React.Component {
if (global.window.mm_config.SupportEmail) {
supportInfo = (
<p>
{'Need anything, just email us at '}
<FormattedMessage
id='tutorial_intro.support'
defaultMessage='Need anything, just email us at '
/>
<a
href={'mailto:' + global.window.mm_config.SupportEmail}
target='_blank'
@@ -130,13 +148,24 @@ export default class TutorialIntroScreens extends React.Component {
return (
<div>
<h3>{'Youre all set'}</h3>
<h3>
<FormattedMessage
id='tutorial_intro.allSet'
defaultMessage='Youre all set'
/>
</h3>
<p>
{inviteModalLink}
{' when youre ready.'}
<FormattedMessage
id='tutorial_intro.whenReady'
defaultMessage=' when youre ready.'
/>
</p>
{supportInfo}
{'Click “Next” to enter Town Square. This is the first channel teammates see when they sign up. Use it for posting updates everyone needs to know.'}
<FormattedMessage
id='tutorial_intro.end'
defaultMessage='Click “Next” to enter Town Square. This is the first channel teammates see when they sign up. Use it for posting updates everyone needs to know.'
/>
{circles}
</div>
);
@@ -186,14 +215,20 @@ export default class TutorialIntroScreens extends React.Component {
tabIndex='1'
onClick={this.handleNext}
>
{'Next'}
<FormattedMessage
id='tutorial_intro.next'
defaultMessage='Next'
/>
</button>
<a
className='tutorial-skip'
href='#'
onClick={this.skipTutorial}
>
{'Skip tutorial'}
<FormattedMessage
id='tutorial_intro.skip'
defaultMessage='Skip tutorial'
/>
</a>
</div>
</div>

Просмотреть файл

@@ -6,6 +6,9 @@ import PreferenceStore from '../../stores/preference_store.jsx';
import * as AsyncClient from '../../utils/async_client.jsx';
import Constants from '../../utils/constants.jsx';
import {FormattedMessage} from 'mm-intl';
const Preferences = Constants.Preferences;
const Overlay = ReactBootstrap.Overlay;
@@ -46,7 +49,17 @@ export default class TutorialTip extends React.Component {
AsyncClient.savePreferences([preference]);
}
render() {
const buttonText = this.state.currentScreen === this.props.screens.length - 1 ? 'Okay' : 'Next';
const buttonText = this.state.currentScreen === this.props.screens.length - 1 ? (
<FormattedMessage
id='tutorial_tip.ok'
defaultMessage='Okay'
/>
) : (
<FormattedMessage
id='tutorial_tip.next'
defaultMessage='Next'
/>
);
const dots = [];
if (this.props.screens.length > 1) {
@@ -111,12 +124,18 @@ export default class TutorialTip extends React.Component {
{buttonText}
</button>
<div className='tip-opt'>
{'Seen this before? '}
<FormattedMessage
id='tutorial_tip.seen'
defaultMessage='Seen this before? '
/>
<a
href='#'
onClick={this.skipTutorial}
>
{'Opt out of these tips.'}
<FormattedMessage
id='tutorial_tip.out'
defaultMessage='Opt out of these tips.'
/>
</a>
</div>
</div>