BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Dropdown with dropdown_v3 branch

Browse Source
This commit is contained in:
Jaeeun Cho 2016-08-23 07:05:54 -07:00
parent 47f1447bc4
commit add3cb0d9a
2 changed files with 22 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
bigbluebutton-html5/imports/ui/components/modals/dropdown/Dropdown.jsx
View File

@ -17,7 +17,7 @@ export default class Dropdown extends Component {
}
showMenu(event) {
this.setState({ isMenuOpen: true, });
this.setState({ isMenuOpen: !this.state.isMenuOpen, });
let pressedKey = event.keyCode;
if (pressedKey === 9 || pressedKey == 40) {
@ -59,7 +59,7 @@ export default class Dropdown extends Component {
}
render() {
const toggleMenu = this.toggle.bind(this);
const toggleMenu = this.showMenu.bind(this);
// stick callback on trigger element
const boundChildren = React.Children.map(this.props.children, (child) => {

37
bigbluebutton-html5/imports/ui/components/modals/dropdown/component.jsx
View File

@ -31,7 +31,7 @@ export default class SettingsDropdown extends Component {
}
componentWillUpdate() {
if (!this.refs.dropdown.state.isMenuOpen && this.state.activeMenu > 0) {
if (this.refs.dropdown.state.isMenuOpen && this.state.activeMenu >= 0) {
this.setState({ activeMenu: -1, focusMenu: 0, });
}
}
@ -50,7 +50,9 @@ export default class SettingsDropdown extends Component {
let newIndex = 0;
if (this.state.focusMenu >= menusLength) {
newIndex = 0;
this.refs.dropdown.hideMenu();
if(!event.shiftKey) {
this.refs.dropdown.hideMenu();
}
} else {
newIndex = this.state.focusMenu;
}
@ -59,19 +61,6 @@ export default class SettingsDropdown extends Component {
return;
}
// Down key
if (pressedKey === 40) {
if (this.state.focusMenu >= menusLength) { // checks if at end of menu
this.setState({ focusMenu: 0 },
() => { this.setFocus(); });
} else {
this.setState({ focusMenu: this.state.focusMenu + 1 },
() => { this.setFocus(); });
}
return;
}
// shift + tab
if (event.shiftKey && pressedKey === 9) {
let newIndex = 0;
@ -81,7 +70,8 @@ export default class SettingsDropdown extends Component {
newIndex = this.state.focusMenu - 1;
}
this.setState({ focusMenu: newIndex });
this.setState({ focusMenu: newIndex },
() => {console.log(this.state.focusMenu);});
return;
}
@ -98,6 +88,19 @@ export default class SettingsDropdown extends Component {
return;
}
// Down key
if (pressedKey === 40) {
if (this.state.focusMenu >= menusLength) { // checks if at end of menu
this.setState({ focusMenu: 0 },
() => { this.setFocus(); });
} else {
this.setState({ focusMenu: this.state.focusMenu + 1 },
() => { this.setFocus(); });
}
return;
}
// Enter and SpaceBar
if (pressedKey === 13 || pressedKey === 32) {
this.clickMenu(this.state.focusMenu);
@ -170,7 +173,7 @@ export default class SettingsDropdown extends Component {
<Icon key={index} prependIconName={value.props.prependIconName}
iconName={value.props.icon} title={value.props.title}/>
<span className={styles.settingsMenuItemText}>{value.props.title}</span>
{index == '0' ? <hr /> : null}
{index == '0' ? <hr className={styles.hrDropdown}/> : null}
</li>
))}
</ul>