Added right click pasting for terminal
This commit is contained in:
parent
3a8362c408
commit
919afa3c92
3 changed files with 57 additions and 3 deletions
|
|
@ -140,10 +140,30 @@ export function Terminal() {
|
||||||
return visibleHistory.slice(startIndex).map(({ text }, index) => {
|
return visibleHistory.slice(startIndex).map(({ text }, index) => {
|
||||||
return <OutputLine text={text} key={index}/>
|
return <OutputLine text={text} key={index}/>
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
|
const onMouseDown = (event) => {
|
||||||
|
if (event.button === 2) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
navigator.clipboard.readText().then((text) => {
|
||||||
|
setInputValue(inputValue + text);
|
||||||
|
}).catch((error) => {
|
||||||
|
console.error(error);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const onContextMenu = (event) => {
|
||||||
|
event.preventDefault();
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.Terminal}>
|
<div
|
||||||
|
className={styles.Terminal}
|
||||||
|
onMouseDown={onMouseDown}
|
||||||
|
onContextMenu={onContextMenu}
|
||||||
|
>
|
||||||
{displayHistory()}
|
{displayHistory()}
|
||||||
<InputLine
|
<InputLine
|
||||||
key={inputKey}
|
key={inputKey}
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,9 @@
|
||||||
import { useEffect } from "react";
|
import { useEffect } from "react";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Hook that alerts clicks outside of the passed ref
|
* @param {Object} params
|
||||||
|
* @param {Function} params.onKeyDown
|
||||||
|
* @param {Function} params.onKeyUp
|
||||||
*/
|
*/
|
||||||
export function useKeyboardListener({ onKeyDown, onKeyUp }) {
|
export function useKeyboardListener({ onKeyDown, onKeyUp }) {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
||||||
32
src/hooks/utils/mouse.js
Normal file
32
src/hooks/utils/mouse.js
Normal file
|
|
@ -0,0 +1,32 @@
|
||||||
|
import { useEffect } from "react";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {Object} params
|
||||||
|
* @param {Function} params.onMouseDown
|
||||||
|
* @param {Function} params.onMouseUp
|
||||||
|
* @param {Function} params.onClick
|
||||||
|
* @param {Function} params.onContextMenu
|
||||||
|
*/
|
||||||
|
export function useMouseListener({ onMouseDown, onMouseUp, onClick, onContextMenu }) {
|
||||||
|
useEffect(() => {
|
||||||
|
if (onMouseDown)
|
||||||
|
document.addEventListener("mousedown", onMouseDown);
|
||||||
|
if (onMouseUp)
|
||||||
|
document.addEventListener("mouseup", onMouseUp);
|
||||||
|
if (onClick)
|
||||||
|
document.addEventListener("click", onClick);
|
||||||
|
if (onContextMenu)
|
||||||
|
document.addEventListener("contextmenu", onContextMenu);
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
if (onMouseDown)
|
||||||
|
document.removeEventListener("mousedown", onMouseDown);
|
||||||
|
if (onMouseUp)
|
||||||
|
document.removeEventListener("mouseup", onMouseUp);
|
||||||
|
if (onClick)
|
||||||
|
document.removeEventListener("click", onClick);
|
||||||
|
if (onContextMenu)
|
||||||
|
document.removeEventListener("contextmenu", onContextMenu);
|
||||||
|
};
|
||||||
|
}, [onMouseDown, onMouseUp, onClick, onContextMenu]);
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue