tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

ShortcutsModal.js (4127B)

      1 /* This Source Code Form is subject to the terms of the Mozilla Public
      2 * License, v. 2.0. If a copy of the MPL was not distributed with this
      3 * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
      4 
      5 import React, { Component } from "devtools/client/shared/vendor/react";
      6 import {
      7  div,
      8  ul,
      9  h2,
     10  span,
     11  li,
     12 } from "devtools/client/shared/vendor/react-dom-factories";
     13 import PropTypes from "devtools/client/shared/vendor/react-prop-types";
     14 import Modal from "./shared/Modal";
     15 const {
     16  stringifyFromElectronKey,
     17 } = require("resource://devtools/client/shared/key-shortcuts.js");
     18 const classnames = require("resource://devtools/client/shared/classnames.js");
     19 
     20 const isMacOS = Services.appinfo.OS === "Darwin";
     21 
     22 export class ShortcutsModal extends Component {
     23  static get propTypes() {
     24    return {
     25      enabled: PropTypes.bool.isRequired,
     26      handleClose: PropTypes.func.isRequired,
     27    };
     28  }
     29 
     30  renderPrettyCombos(combo) {
     31    return combo
     32      .split(" ")
     33      .map(c =>
     34        span(
     35          {
     36            key: c,
     37            className: "keystroke",
     38          },
     39          c
     40        )
     41      )
     42      .reduce((prev, curr) => [prev, " + ", curr]);
     43  }
     44 
     45  renderShorcutItem(title, combo) {
     46    return li(
     47      null,
     48      span(null, title),
     49      span(null, this.renderPrettyCombos(combo))
     50    );
     51  }
     52 
     53  renderEditorShortcuts() {
     54    return ul(
     55      {
     56        className: "shortcuts-list",
     57      },
     58      this.renderShorcutItem(
     59        L10N.getStr("shortcuts.toggleBreakpoint"),
     60        stringifyFromElectronKey(L10N.getStr("toggleBreakpoint.key"))
     61      ),
     62      this.renderShorcutItem(
     63        L10N.getStr("shortcuts.toggleCondPanel.breakpoint"),
     64        stringifyFromElectronKey(L10N.getStr("toggleCondPanel.breakpoint.key"))
     65      ),
     66      this.renderShorcutItem(
     67        L10N.getStr("shortcuts.toggleCondPanel.logPoint"),
     68        stringifyFromElectronKey(L10N.getStr("toggleCondPanel.logPoint.key"))
     69      )
     70    );
     71  }
     72 
     73  renderSteppingShortcuts() {
     74    return ul(
     75      {
     76        className: "shortcuts-list",
     77      },
     78      this.renderShorcutItem(L10N.getStr("shortcuts.pauseOrResume"), "F8"),
     79      this.renderShorcutItem(L10N.getStr("shortcuts.stepOver"), "F10"),
     80      this.renderShorcutItem(L10N.getStr("shortcuts.stepIn"), "F11"),
     81      this.renderShorcutItem(
     82        L10N.getStr("shortcuts.stepOut"),
     83        stringifyFromElectronKey(L10N.getStr("stepOut.key"))
     84      )
     85    );
     86  }
     87 
     88  renderSearchShortcuts() {
     89    return ul(
     90      {
     91        className: "shortcuts-list",
     92      },
     93      this.renderShorcutItem(
     94        L10N.getStr("shortcuts.fileSearch2"),
     95        stringifyFromElectronKey(L10N.getStr("sources.search.key2"))
     96      ),
     97      this.renderShorcutItem(
     98        L10N.getStr("shortcuts.projectSearch2"),
     99        stringifyFromElectronKey(L10N.getStr("projectTextSearch.key"))
    100      ),
    101      this.renderShorcutItem(
    102        L10N.getStr("shortcuts.functionSearch2"),
    103        stringifyFromElectronKey(L10N.getStr("functionSearch.key"))
    104      ),
    105      this.renderShorcutItem(
    106        L10N.getStr("shortcuts.gotoLine"),
    107        stringifyFromElectronKey(L10N.getStr("gotoLineModal.key3"))
    108      )
    109    );
    110  }
    111 
    112  renderShortcutsContent() {
    113    return div(
    114      {
    115        className: classnames("shortcuts-content", isMacOS ? "mac" : ""),
    116      },
    117      div(
    118        {
    119          className: "shortcuts-section",
    120        },
    121        h2(null, L10N.getStr("shortcuts.header.editor")),
    122        this.renderEditorShortcuts()
    123      ),
    124      div(
    125        {
    126          className: "shortcuts-section",
    127        },
    128        h2(null, L10N.getStr("shortcuts.header.stepping")),
    129        this.renderSteppingShortcuts()
    130      ),
    131      div(
    132        {
    133          className: "shortcuts-section",
    134        },
    135        h2(null, L10N.getStr("shortcuts.header.search")),
    136        this.renderSearchShortcuts()
    137      )
    138    );
    139  }
    140 
    141  render() {
    142    const { enabled } = this.props;
    143 
    144    if (!enabled) {
    145      return null;
    146    }
    147 
    148    return React.createElement(
    149      Modal,
    150      {
    151        additionalClass: "shortcuts-modal",
    152        handleClose: this.props.handleClose,
    153      },
    154      this.renderShortcutsContent()
    155    );
    156  }
    157 }