From ad8afa515b0dddeedd6a37e91c6bcda914d1c309 Mon Sep 17 00:00:00 2001 From: Stas Vilchik Date: Mon, 29 May 2017 10:49:12 +0200 Subject: rework some modals (#2113) --- .../main/js/app/components/nav/global/GlobalNav.js | 20 ++- .../js/app/components/nav/global/ShortcutsHelp.js | 188 +++++++++++++++++++++ .../app/components/nav/global/ShortcutsHelpView.js | 26 --- 3 files changed, 201 insertions(+), 33 deletions(-) create mode 100644 server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelp.js delete mode 100644 server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelpView.js (limited to 'server/sonar-web/src/main/js/app/components/nav/global') diff --git a/server/sonar-web/src/main/js/app/components/nav/global/GlobalNav.js b/server/sonar-web/src/main/js/app/components/nav/global/GlobalNav.js index 86ed0974c5c..2e2659d7125 100644 --- a/server/sonar-web/src/main/js/app/components/nav/global/GlobalNav.js +++ b/server/sonar-web/src/main/js/app/components/nav/global/GlobalNav.js @@ -23,10 +23,12 @@ import GlobalNavBranding from './GlobalNavBranding'; import GlobalNavMenu from './GlobalNavMenu'; import GlobalNavUserContainer from './GlobalNavUserContainer'; import Search from '../../search/Search'; -import ShortcutsHelpView from './ShortcutsHelpView'; +import ShortcutsHelp from './ShortcutsHelp'; import { getCurrentUser, getAppState } from '../../../../store/rootReducer'; class GlobalNav extends React.PureComponent { + state = { helpOpen: false }; + componentDidMount() { window.addEventListener('keypress', this.onKeyPress); } @@ -46,13 +48,15 @@ class GlobalNav extends React.PureComponent { } }; - openHelp = e => { - if (e) { - e.preventDefault(); - } - new ShortcutsHelpView().render(); + handleHelpClick = event => { + event.preventDefault(); + this.openHelp(); }; + openHelp = () => this.setState({ helpOpen: true }); + + closeHelp = () => this.setState({ helpOpen: false }); + render() { /* eslint-disable max-len */ return ( @@ -65,7 +69,7 @@ class GlobalNav extends React.PureComponent { + + {this.state.helpOpen && } ); } diff --git a/server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelp.js b/server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelp.js new file mode 100644 index 00000000000..273b370f17a --- /dev/null +++ b/server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelp.js @@ -0,0 +1,188 @@ +/* + * SonarQube + * Copyright (C) 2009-2017 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ +// @flow +import React from 'react'; +import Modal from 'react-modal'; +import { Link } from 'react-router'; +import { translate } from '../../../../helpers/l10n'; + +type Props = { + onClose: () => void +}; + +export default class ShortcutsHelp extends React.PureComponent { + props: Props; + + handleCloseClick = (event: Event) => { + event.preventDefault(); + this.props.onClose(); + }; + + render() { + return ( + + +
+

{translate('help')}

+
+ +
+
+ {translate('footer.community')}{' - '} + + {translate('footer.documentation')} + + {' - '} + + {translate('footer.support')} + + {' - '} + + {translate('footer.plugins')} + + {' - '} + {translate('footer.web_api')} + {' - '} + {translate('footer.about')} +
+ +

{translate('shortcuts.modal_title')}

+ +
+
+
+

{translate('shortcuts.section.global')}

+
    +
  • + s + {translate('shortcuts.section.global.search')} +
    • +
  • + ? + {translate('shortcuts.section.global.shortcuts')} +
    • +
+
+ +

{translate('shortcuts.section.rules')}

+
    +
  • + ↑ + ↓ + {translate('shortcuts.section.rules.navigate_between_rules')} +
    • +
  • + → + {translate('shortcuts.section.rules.open_details')} +
    • +
  • + ← + {translate('shortcuts.section.rules.return_to_list')} +
    • +
  • + a + {translate('shortcuts.section.rules.activate')} +
    • +
  • + d + {translate('shortcuts.section.rules.deactivate')} +
    • +
+
+ +
+

{translate('shortcuts.section.issues')}

+
    +
  • + ↑ + ↓ + {translate('shortcuts.section.issues.navigate_between_issues')} +
    • +
  • + → + {translate('shortcuts.section.issues.open_details')} +
    • +
  • + ← + {translate('shortcuts.section.issues.return_to_list')} +
    • +
  • + alt + + + ↑ + ↓ + {translate('issues.to_navigate_issue_locations')} +
    • +
  • + alt + + + ← + → + {translate('issues.to_switch_flows')} +
    • +
  • + f + {translate('shortcuts.section.issue.do_transition')} +
    • +
  • + a + {translate('shortcuts.section.issue.assign')} +
    • +
  • + m + {translate('shortcuts.section.issue.assign_to_me')} +
    • +
  • + i + {translate('shortcuts.section.issue.change_severity')} +
    • +
  • + c + {translate('shortcuts.section.issue.comment')} +
    • +
  • + ctrl + enter + {translate('shortcuts.section.issue.submit_comment')} +
    • +
  • + t + {translate('shortcuts.section.issue.change_tags')} +
    • +
+
+
+
+ +
+ + {translate('close')} + +
+ + + ); + } +} diff --git a/server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelpView.js b/server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelpView.js deleted file mode 100644 index 893e4930ad6..00000000000 --- a/server/sonar-web/src/main/js/app/components/nav/global/ShortcutsHelpView.js +++ /dev/null @@ -1,26 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2017 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import ModalView from '../../../../components/common/modals'; -import ShortcutsHelpTemplate from '../templates/nav-shortcuts-help.hbs'; - -export default ModalView.extend({ - className: 'modal modal-large', - template: ShortcutsHelpTemplate -}); -- cgit v1.2.3