|
|
|
@ -1,4 +1,4 @@ |
|
|
|
|
import React, {useContext} from "react"; |
|
|
|
|
import React, {useContext, useEffect, useRef} from "react"; |
|
|
|
|
|
|
|
|
|
import {Folder2Open, Cast, InfoCircle, XSquare, LayoutSplit} from "react-bootstrap-icons"; |
|
|
|
|
|
|
|
|
@ -8,6 +8,7 @@ import Mode from "../models/Mode"; |
|
|
|
|
import {ReactComponent as Logo} from "../assets/images/logo_ation.svg"; |
|
|
|
|
|
|
|
|
|
const Toolbar = ({openFile, setShowTips, version, toggleEdit}) => { |
|
|
|
|
const toolbar = useRef(); |
|
|
|
|
const {setMode, setSlide, slideCount} = useContext(SlideContext); |
|
|
|
|
|
|
|
|
|
const present = () => { |
|
|
|
@ -16,12 +17,30 @@ const Toolbar = ({openFile, setShowTips, version, toggleEdit}) => { |
|
|
|
|
document.documentElement.requestFullscreen(); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
const toggleMaximize = () => { |
|
|
|
|
const toggleMaximize = event => { |
|
|
|
|
if (event.target !== toolbar.current) |
|
|
|
|
return; |
|
|
|
|
window.api.maximize(); |
|
|
|
|
event.stopPropagation(); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// prevent text selection on doubleclick
|
|
|
|
|
useEffect(() => { |
|
|
|
|
const tBar = toolbar.current; |
|
|
|
|
const doubleClickListener = event => { |
|
|
|
|
if (event.detail > 1) |
|
|
|
|
event.preventDefault(); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
tBar?.addEventListener("mousedown", doubleClickListener); |
|
|
|
|
|
|
|
|
|
return () => { |
|
|
|
|
tBar?.removeEventListener("mousedown", doubleClickListener); |
|
|
|
|
}; |
|
|
|
|
}, [toolbar]); |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<nav className="toolbar" onDoubleClick={toggleMaximize}> |
|
|
|
|
<nav className="toolbar" onDoubleClick={toggleMaximize} ref={toolbar}> |
|
|
|
|
<button onClick={openFile} title="Open file [⌘+O]"><Folder2Open /></button> |
|
|
|
|
<button onClick={present} title="Start presentation [F5]"><Cast /></button> |
|
|
|
|
<Logo /> |
|
|
|
|