HTML5 - Settings : added description messages and changed to label

This commit is contained in:
JaeeunCho 2016-09-22 13:51:00 -07:00
parent 0e1728ce50
commit b0947c85c1
3 changed files with 47 additions and 20 deletions

View File

@ -26,7 +26,7 @@
"app.failedMessage": "Apologies, trouble connecting to the server.",
"app.connectingMessage": "Connecting...",
"app.waitingMessage": "Disconnected. Trying to reconnect in {seconds} seconds...",
"app.dropdown.options": "Options",
"app.dropdown.optionsLabel": "Options",
"app.dropdown.fullscreenLabel": "Make fullscreen",
"app.dropdown.settingsLabel": "Open settings",
"app.dropdown.leaveSessionLabel": "Logout",
@ -39,8 +39,11 @@
"app.leaveConfirmation.confirmDesc": "Logs you out of the meeting",
"app.leaveConfirmation.dismissLabel": "Cancel",
"app.leaveConfirmation.dismissDesc": "Closes and rejects the leave confirmation",
"app.actions.options": "Actions",
"app.actions.options.presentation": "Upload a presentation",
"app.actions.options.initPoll": "Initiate a poll",
"app.actions.options.desktopShare": "Share your screen"
"app.actions.actionsLabel": "Actions",
"app.actions.options.presentationLabel": "Upload a presentation",
"app.actions.options.initPollLabel": "Initiate a poll",
"app.actions.options.desktopShareLabel": "Share your screen",
"app.actions.options.presentationDesc": "Upload your presentation",
"app.actions.options.initPollDesc": "Initiate a poll",
"app.actions.options.desktopShareDesc": "Share your screen with others"
}

View File

@ -9,22 +9,34 @@ import DropdownList from '/imports/ui/components/dropdown/list/component';
import DropdownListItem from '/imports/ui/components/dropdown/list/item/component';
const intlMessages = defineMessages({
buttonLabel: {
id: 'app.actions.options',
actionsLabel: {
id: 'app.actions.actionsLabel',
defaultMessage: 'Actions button',
},
presentationLabel: {
id: 'app.actions.options.presentation',
id: 'app.actions.options.presentationLabel',
defaultMessage: 'Upload a presentation',
},
initPollLabel: {
id: 'app.actions.options.initPoll',
id: 'app.actions.options.initPollLabel',
defaultMessage: 'Initiate a poll',
},
desktopShareLabel: {
id: 'app.actions.options.desktopShare',
id: 'app.actions.options.desktopShareLabel',
defaultMessage: 'Share your screen',
},
presentationDesc: {
id: 'app.actions.options.presentationDesc',
defaultMessage: 'Upload your presentation',
},
initPollDesc: {
id: 'app.actions.options.initPollDesc',
defaultMessage: 'Initiate a poll',
},
desktopShareDesc: {
id: 'app.actions.options.desktopShareDesc',
defaultMessage: 'Share your screen with others',
},
});
const presentation = () => {console.log('Should show the uploader component');};
@ -45,7 +57,7 @@ export default class Actions extends Component {
<DropdownTrigger>
<Button
role="button"
label={intl.formatMessage(intlMessages.buttonLabel)}
label={intl.formatMessage(intlMessages.actionsLabel)}
icon="circle-add"
color="primary"
size="lg"
@ -58,7 +70,7 @@ export default class Actions extends Component {
<DropdownListItem
icon="presentation"
label={intl.formatMessage(intlMessages.presentationLabel)}
description="Upload a presentation"
description={intl.formatMessage(intlMessages.presentationDesc)}
onClick={presentation.bind(this)}
/>
@ -67,13 +79,13 @@ export default class Actions extends Component {
<DropdownListItem
icon="polling"
label={intl.formatMessage(intlMessages.initPollLabel)}
description="Initiate a poll"
description={intl.formatMessage(intlMessages.initPollDesc)}
onClick={polling.bind(this)}
/>
<DropdownListItem
icon="desktop"
label={intl.formatMessage(intlMessages.desktopShareLabel)}
description="Share your screen"
description={intl.formatMessage(intlMessages.desktopShareDesc)}
onClick={shareScreen.bind(this)}
/>
</DropdownList>

View File

@ -15,8 +15,8 @@ import DropdownListItem from '/imports/ui/components/dropdown/list/item/componen
import DropdownListSeparator from '/imports/ui/components/dropdown/list/separator/component';
const intlMessages = defineMessages({
buttonLabel: {
id: 'app.dropdown.options',
optionsLabel: {
id: 'app.dropdown.optionsLabel',
defaultMessage: 'Options',
},
fullscreenLabel: {
@ -31,6 +31,18 @@ const intlMessages = defineMessages({
id: 'app.dropdown.leaveSessionLabel',
defaultMessage: 'Logout',
},
fullscreenDesc: {
id: 'app.dropdown.fullscreenDesc',
defaultMessage: 'Make the settings menu fullscreen',
},
settingsDesc: {
id: 'app.dropdown.settingsDesc',
defaultMessage: 'Change the general settings',
},
leaveSessionDesc: {
id: 'app.dropdown.leaveSessionDesc',
defaultMessage: 'Leave the meeting',
},
});
const toggleFullScreen = () => {
@ -75,7 +87,7 @@ export default class SettingsDropdown extends Component {
<DropdownTrigger>
<Button
role="button"
label={intl.formatMessage(intlMessages.buttonLabel)}
label={intl.formatMessage(intlMessages.optionsLabel)}
icon="more"
ghost={true}
circle={true}
@ -92,20 +104,20 @@ export default class SettingsDropdown extends Component {
<DropdownListItem
icon="fullscreen"
label={intl.formatMessage(intlMessages.fullscreenLabel)}
description="Make the application fullscreen"
description={intl.formatMessage(intlMessages.fullscreenDesc)}
onClick={toggleFullScreen.bind(this)}
/>
<DropdownListItem
icon="more"
label={intl.formatMessage(intlMessages.settingsLabel)}
description="Change the general settings"
description={intl.formatMessage(intlMessages.settingsDesc)}
onClick={openSettings.bind(this)}
/>
<DropdownListSeparator />
<DropdownListItem
icon="logout"
label={intl.formatMessage(intlMessages.leaveSessionLabel)}
description="Leave the meeting"
description={intl.formatMessage(intlMessages.leaveSessionDesc)}
onClick={openLogoutConfirmation.bind(this)}
/>
</DropdownList>