diff --git a/bigbluebutton-html5/imports/locales/en.json b/bigbluebutton-html5/imports/locales/en.json
index 07e9a2eba330865fdeecbf2f48b216d5eebff612..1d1ca682474e6a82a37e166d0a79d6777bb49ebd 100755
--- a/bigbluebutton-html5/imports/locales/en.json
+++ b/bigbluebutton-html5/imports/locales/en.json
@@ -26,19 +26,26 @@
"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.fullscreenLabel": "Make fullscreen",
- "app.dropdown.settingsLabel": "Open settings",
- "app.dropdown.leaveSessionLabel": "Logout",
- "app.dropdown.fullscreenDesc": "Make the settings menu fullscreen",
- "app.dropdown.settingsDesc": "Change the general settings",
- "app.dropdown.leaveSessionDesc": "Leave the meeting",
+ "app.navBar.settingsDropdown.optionsLabel": "Options",
+ "app.navBar.settingsDropdown.fullscreenLabel": "Make fullscreen",
+ "app.navBar.settingsDropdown.settingsLabel": "Open settings",
+ "app.navBar.settingsDropdown.leaveSessionLabel": "Logout",
+ "app.navBar.settingsDropdown.fullscreenDesc": "Make the settings menu fullscreen",
+ "app.navBar.settingsDropdown.settingsDesc": "Change the general settings",
+ "app.navBar.settingsDropdown.leaveSessionDesc": "Leave the meeting",
"app.leaveConfirmation.title": "Leave Session",
"app.leaveConfirmation.message": "Do you want to leave this meeting?",
"app.leaveConfirmation.confirmLabel": "Leave",
"app.leaveConfirmation.confirmDesc": "Logs you out of the meeting",
"app.leaveConfirmation.dismissLabel": "Cancel",
"app.leaveConfirmation.dismissDesc": "Closes and rejects the leave confirmation",
+ "app.actionsBar.actionsDropdown.actionsLabel": "Actions",
+ "app.actionsBar.actionsDropdown.presentationLabel": "Upload a presentation",
+ "app.actionsBar.actionsDropdown.initPollLabel": "Initiate a poll",
+ "app.actionsBar.actionsDropdown.desktopShareLabel": "Share your screen",
+ "app.actionsBar.actionsDropdown.presentationDesc": "Upload your presentation",
+ "app.actionsBar.actionsDropdown.initPollDesc": "Initiate a poll",
+ "app.actionsBar.actionsDropdown.desktopShareDesc": "Share your screen with others",
"app.actionsBar.emojiMenu.statusTriggerLabel": "Status",
"app.actionsBar.emojiMenu.awayLabel": "Away",
"app.actionsBar.emojiMenu.awayDesc": "Change your status to away",
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx
new file mode 100755
index 0000000000000000000000000000000000000000..b9312a25d567f5ab5aa589c101381077308b1eb8
--- /dev/null
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx
@@ -0,0 +1,97 @@
+import React, { Component, PropTypes } from 'react';
+import { defineMessages, injectIntl } from 'react-intl';
+
+import Button from '/imports/ui/components/button/component';
+import Dropdown from '/imports/ui/components/dropdown/component';
+import DropdownTrigger from '/imports/ui/components/dropdown/trigger/component';
+import DropdownContent from '/imports/ui/components/dropdown/content/component';
+import DropdownList from '/imports/ui/components/dropdown/list/component';
+import DropdownListItem from '/imports/ui/components/dropdown/list/item/component';
+
+const intlMessages = defineMessages({
+ actionsLabel: {
+ id: 'app.actionsBar.actionsDropdown.actionsLabel',
+ defaultMessage: 'Actions',
+ },
+ presentationLabel: {
+ id: 'app.actionsBar.actionsDropdown.presentationLabel',
+ defaultMessage: 'Upload a presentation',
+ },
+ initPollLabel: {
+ id: 'app.actionsBar.actionsDropdown.initPollLabel',
+ defaultMessage: 'Initiate a poll',
+ },
+ desktopShareLabel: {
+ id: 'app.actionsBar.actionsDropdown.desktopShareLabel',
+ defaultMessage: 'Share your screen',
+ },
+ presentationDesc: {
+ id: 'app.actionsBar.actionsDropdown.presentationDesc',
+ defaultMessage: 'Upload your presentation',
+ },
+ initPollDesc: {
+ id: 'app.actionsBar.actionsDropdown.initPollDesc',
+ defaultMessage: 'Initiate a poll',
+ },
+ desktopShareDesc: {
+ id: 'app.actionsBar.actionsDropdown.desktopShareDesc',
+ defaultMessage: 'Share your screen with others',
+ },
+});
+
+const presentation = () => {console.log('Should show the uploader component');};
+
+const polling = () => {console.log('Should initiate a polling');};
+
+const shareScreen = () => {console.log('Should start screen sharing');};
+
+class ActionsDropdown extends Component {
+ constructor(props) {
+ super(props);
+ }
+
+ render() {
+ const { intl } = this.props;
+ return (
+ <Dropdown ref="dropdown">
+ <DropdownTrigger>
+ <Button
+ label={intl.formatMessage(intlMessages.actionsLabel)}
+ icon="circle-add"
+ color="primary"
+ size="lg"
+ circle={true}
+ onClick={() => null}
+ />
+ </DropdownTrigger>
+ <DropdownContent placement="top left">
+ <DropdownList>
+ <DropdownListItem
+ icon="presentation"
+ label={intl.formatMessage(intlMessages.presentationLabel)}
+ description={intl.formatMessage(intlMessages.presentationDesc)}
+ onClick={presentation.bind(this)}
+ />
+
+ {/* These icons are unaligned because of the font issue
+ Check it later */}
+ <DropdownListItem
+ icon="polling"
+ label={intl.formatMessage(intlMessages.initPollLabel)}
+ description={intl.formatMessage(intlMessages.initPollDesc)}
+ onClick={polling.bind(this)}
+ />
+ <DropdownListItem
+ icon="desktop"
+ label={intl.formatMessage(intlMessages.desktopShareLabel)}
+ description={intl.formatMessage(intlMessages.desktopShareDesc)}
+ onClick={shareScreen.bind(this)}
+ />
+ </DropdownList>
+ </DropdownContent>
+ </Dropdown>
+ );
+ }
+}
+
+export default injectIntl(ActionsDropdown);
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
index ffe28356e869ae395b64b3e7b78ccd624b1ee1b6..5ca57ce65b0e9ac481efa1ee68f117cb95477f86 100755
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
@@ -4,6 +4,8 @@ import styles from './styles.scss';
import Button from '../button/component';
import EmojiContainer from './emoji-menu/container';
+import ActionsDropdown from './actions-dropdown/component';
+
export default class ActionsBar extends Component {
constructor(props) {
super(props);
@@ -16,14 +18,7 @@ export default class ActionsBar extends Component {
return (
<div className={styles.actionsbar}>
<div className={styles.left}>
- <Button
- onClick={this.handleClick}
- label={'Actions'}
- color={'primary'}
- icon={'circle-add'}
- size={'lg'}
- circle={true}
- />
+ <ActionsDropdown />
</div>
<div className={styles.center}>
<Button
diff --git a/bigbluebutton-html5/imports/ui/components/dropdown/component.jsx b/bigbluebutton-html5/imports/ui/components/dropdown/component.jsx
index 6004fcef9bcd3b863ac0933739ddd6ba8e8d3fcd..d7d4063f32365e93587fd928e959496f8173256d 100755
--- a/bigbluebutton-html5/imports/ui/components/dropdown/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/dropdown/component.jsx
@@ -41,6 +41,7 @@ const propTypes = {
};
const defaultProps = {
+ isOpen: false,
};
export default class Dropdown extends Component {
diff --git a/bigbluebutton-html5/imports/ui/components/nav-bar/settings-dropdown/component.jsx b/bigbluebutton-html5/imports/ui/components/nav-bar/settings-dropdown/component.jsx
index e6f1b900819d89db778e2a324c1a1c154903068b..92f7dc830c6c6e31984eb64c6ddff419fbca9ab9 100755
--- a/bigbluebutton-html5/imports/ui/components/nav-bar/settings-dropdown/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/nav-bar/settings-dropdown/component.jsx
@@ -1,14 +1,11 @@
-import React, { Component, PropTyes } from 'react';
-import { FormattedMessage } from 'react-intl';
-import ReactDOM from 'react-dom';
-import classNames from 'classnames';
+import React, { Component, PropTypes } from 'react';
+import { defineMessages, injectIntl } from 'react-intl';
import styles from '../styles';
import { showModal } from '/imports/ui/components/app/service';
import LogoutConfirmation from '/imports/ui/components/logout-confirmation/component';
import Settings from '/imports/ui/components/settings/component';
-import Icon from '/imports/ui/components/icon/component';
import Button from '/imports/ui/components/button/component';
import Dropdown from '/imports/ui/components/dropdown/component';
import DropdownTrigger from '/imports/ui/components/dropdown/trigger/component';
@@ -17,6 +14,37 @@ import DropdownList from '/imports/ui/components/dropdown/list/component';
import DropdownListItem from '/imports/ui/components/dropdown/list/item/component';
import DropdownListSeparator from '/imports/ui/components/dropdown/list/separator/component';
+const intlMessages = defineMessages({
+ optionsLabel: {
+ id: 'app.navBar.settingsDropdown.optionsLabel',
+ defaultMessage: 'Options',
+ },
+ fullscreenLabel: {
+ id: 'app.navBar.settingsDropdown.fullscreenLabel',
+ defaultMessage: 'Make fullscreen',
+ },
+ settingsLabel: {
+ id: 'app.navBar.settingsDropdown.settingsLabel',
+ defaultMessage: 'Open settings',
+ },
+ leaveSessionLabel: {
+ id: 'app.navBar.settingsDropdown.leaveSessionLabel',
+ defaultMessage: 'Logout',
+ },
+ fullscreenDesc: {
+ id: 'app.navBar.settingsDropdown.fullscreenDesc',
+ defaultMessage: 'Make the settings menu fullscreen',
+ },
+ settingsDesc: {
+ id: 'app.navBar.settingsDropdown.settingsDesc',
+ defaultMessage: 'Change the general settings',
+ },
+ leaveSessionDesc: {
+ id: 'app.navBar.settingsDropdown.leaveSessionDesc',
+ defaultMessage: 'Leave the meeting',
+ },
+});
+
const toggleFullScreen = () => {
let element = document.documentElement;
@@ -47,18 +75,18 @@ const openSettings = () => showModal(<Settings />);
const openLogoutConfirmation = () => showModal(<LogoutConfirmation />);
-export default class SettingsDropdown extends Component {
+class SettingsDropdown extends Component {
constructor(props) {
super(props);
}
render() {
+ const { intl } = this.props;
return (
<Dropdown ref="dropdown">
<DropdownTrigger>
<Button
- role="button"
- label="Settings"
+ label={intl.formatMessage(intlMessages.optionsLabel)}
icon="more"
ghost={true}
circle={true}
@@ -73,22 +101,22 @@ export default class SettingsDropdown extends Component {
<DropdownContent placement="bottom right">
<DropdownList>
<DropdownListItem
- icon="full-screen"
- label="Fullscreen"
- defaultMessage="Make the application fullscreen"
+ icon="fullscreen"
+ label={intl.formatMessage(intlMessages.fullscreenLabel)}
+ description={intl.formatMessage(intlMessages.fullscreenDesc)}
onClick={toggleFullScreen.bind(this)}
/>
<DropdownListItem
icon="more"
- label="Settings"
- description="Change the general settings"
+ label={intl.formatMessage(intlMessages.settingsLabel)}
+ description={intl.formatMessage(intlMessages.settingsDesc)}
onClick={openSettings.bind(this)}
/>
<DropdownListSeparator />
<DropdownListItem
icon="logout"
- label="Leave Session"
- description="Leave the meeting"
+ label={intl.formatMessage(intlMessages.leaveSessionLabel)}
+ description={intl.formatMessage(intlMessages.leaveSessionDesc)}
onClick={openLogoutConfirmation.bind(this)}
/>
</DropdownList>
@@ -97,3 +125,5 @@ export default class SettingsDropdown extends Component {
);
}
}
+
+export default injectIntl(SettingsDropdown);
diff --git a/bigbluebutton-html5/package.json b/bigbluebutton-html5/package.json
index 992ae05d990d62a71123511ad036f77455b80dfe..d93857ab195fb6460fd8ccc755267a41293d2026 100755
--- a/bigbluebutton-html5/package.json
+++ b/bigbluebutton-html5/package.json
@@ -11,6 +11,7 @@
"dependencies": {
"classnames": "^2.2.3",
"grunt-cli": "~1.2.0",
+ "hiredis": "^0.5.0",
"history": "^2.1.2",
"image-size": "~0.5.0",
"meteor-node-stubs": "^0.2.3",