Merge remote-tracking branch 'origin/EmojiReworked' into EmojiReworked

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",

bigbluebutton-html5/imports/ui/components/actions-bar/actions-dropdown/component.jsx

+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);

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

bigbluebutton-html5/imports/ui/components/dropdown/component.jsx

@@ -41,6 +41,7 @@ const propTypes = {
 };
 
 const defaultProps = {
+  isOpen: false,
 };
 
 export default class Dropdown extends Component {

bigbluebutton-html5/imports/ui/components/nav-bar/settings-dropdown/component.jsx

-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);

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",