diff --git a/apple2js.html b/apple2js.html index e1259d3..71127cd 100644 --- a/apple2js.html +++ b/apple2js.html @@ -95,6 +95,13 @@ +
+ +
-
+
+ + +
diff --git a/css/apple2.css b/css/apple2.css index 3d79002..ebb1b42 100644 --- a/css/apple2.css +++ b/css/apple2.css @@ -701,6 +701,11 @@ a.button:hover { flex-grow: 1; } +.spacer.short { + flex-grow: 0; + width: 16px; +} + #reset-row { align-items: center; display: flex; diff --git a/js/components/ClipboardCopy.tsx b/js/components/ClipboardCopy.tsx new file mode 100644 index 0000000..ce6376d --- /dev/null +++ b/js/components/ClipboardCopy.tsx @@ -0,0 +1,25 @@ +import { h } from 'preact'; +import cs from 'classnames'; +import { VideoModes } from 'js/videomodes'; + +import styles from './css/ControlButton.module.scss'; + +export interface CopyToClipboardProps { + vm: VideoModes | undefined; +} + +export function ClipboardCopy({ vm }: CopyToClipboardProps) { + const doCopy = function () { + const asyncCopy = async function () { + if (vm) { + await navigator.clipboard.writeText(vm.getText()); + } + }; + void asyncCopy(); + }; + return ( + + ); +} diff --git a/js/components/ClipboardPaste.tsx b/js/components/ClipboardPaste.tsx new file mode 100644 index 0000000..4e654a9 --- /dev/null +++ b/js/components/ClipboardPaste.tsx @@ -0,0 +1,26 @@ +import { h } from 'preact'; +import cs from 'classnames'; +import Apple2IO from 'js/apple2io'; + +import styles from './css/ControlButton.module.scss'; + +export interface PasteToClipboardProps { + io: Apple2IO | undefined; +} + +export function ClipboardPaste({ io }: PasteToClipboardProps) { + function doPaste() { + const asyncPaste = async function () { + if (io) { + const text = await navigator.clipboard.readText(); + io.setKeyBuffer(text); + } + }; + void asyncPaste(); + } + return ( + + ); +} diff --git a/js/components/ControlStrip.tsx b/js/components/ControlStrip.tsx index fd6242c..36a420a 100644 --- a/js/components/ControlStrip.tsx +++ b/js/components/ControlStrip.tsx @@ -4,6 +4,8 @@ import { CPUMeter } from './CPUMeter'; import { Inset } from './Inset'; import { useHotKey } from './hooks/useHotKey'; import { AudioControl } from './AudioControl'; +import { ClipboardCopy } from './ClipboardCopy'; +import { ClipboardPaste } from './ClipboardPaste'; import { OptionsModal } from './OptionsModal'; import { OptionsContext } from './OptionsContext'; import { Printer } from './Printer'; @@ -14,8 +16,10 @@ import { JoyStick } from '../ui/joystick'; import { Screen, SCREEN_FULL_PAGE } from '../ui/screen'; import { System } from '../ui/system'; -import styles from './css/ControlStrip.module.scss'; import Apple2IO from 'js/apple2io'; +import { VideoModes } from 'js/videomodes'; + +import styles from './css/ControlStrip.module.scss'; const README = 'https://github.com/whscullin/apple2js#readme'; @@ -41,6 +45,7 @@ export const ControlStrip = ({ }: ControlStripProps) => { const [showOptions, setShowOptions] = useState(false); const [io, setIO] = useState(); + const [vm, setVM] = useState(); const options = useContext(OptionsContext); useEffect(() => { @@ -48,6 +53,7 @@ export const ControlStrip = ({ const io = apple2.getIO(); const vm = apple2.getVideoModes(); setIO(io); + setVM(vm); const system = new System(io, e); options.addOptions(system); @@ -94,6 +100,9 @@ export const ControlStrip = ({ +
+ +