Merge branch '3078-refresh-on-copy' into develop

Issue #3078
PR #3199

Author: mssalvatore

monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage/RunManually/LocalManualRunOptions.js

@@ -83,7 +83,7 @@ const getContents = (props) => {
           </Form>
         </div>
       </div>
-      <CommandDisplay commands={commands}/>
+      <CommandDisplay commands={commands} onCopy={getOtp} />
         <Col lg={{span:3, offset: 9}} md={{span:4, offset: 8}} sm={{span:4, offset: 8}} xs={12}>
           <Button style={{'float': 'right'}} title="Refresh OTP" onClick={getOtp}>Refresh OTP</Button>
         </Col>

monkey/monkey_island/cc/ui/src/components/pages/RunMonkeyPage/utils/CommandDisplay.js

@@ -26,6 +26,22 @@ export default function commandDisplay(props) {
     }
   }, [props.commands]);
 
+  function handleKeyDown(event) {
+    let charCode = String.fromCharCode(event.which).toLowerCase();
+    if ((event.ctrlKey || event.metaKey) && charCode === 'c') {
+      props.onCopy();
+    }
+    if ((event.ctrlKey || event.metaKey) && charCode === 'a') {
+      event.preventDefault();
+      let codeElement = event.target.querySelector('code');
+      let selection = window.getSelection();
+      let range = document.createRange();
+      range.selectNode(codeElement);
+      selection.addRange(range);
+    }
+    console.log(charCode);
+  }
+
   function renderNav() {
     return (
       <Nav variant='tabs' activeKey={selectedCommand.type} onSelect={setSelectedCommandByName}>
@@ -42,9 +58,9 @@ export default function commandDisplay(props) {
     <div className={'command-display'}>
       {renderNav()}
       <Card>
-        <div style={{'overflow': 'auto', 'padding': '0.5em'}}>
+        <div style={{'overflow': 'auto', 'padding': '0.5em'}} onKeyDown={handleKeyDown} tabIndex={-1}>
           <CopyToClipboard text={selectedCommand.command} className="pull-right btn-sm">
-            <Button style={{margin: '-0.5em'}} title="Copy to Clipboard">
+            <Button style={{margin: '-0.5em'}} title="Copy to Clipboard" onClick={props.onCopy}>
               <FontAwesomeIcon icon={faClipboard}/>
             </Button>
           </CopyToClipboard>