diff options
Diffstat (limited to 'pages/editor.tsx')
| -rw-r--r-- | pages/editor.tsx | 56 |
1 files changed, 55 insertions, 1 deletions
diff --git a/pages/editor.tsx b/pages/editor.tsx index 0ab0307..6273dc6 100644 --- a/pages/editor.tsx +++ b/pages/editor.tsx @@ -4,7 +4,12 @@ import { animated, useSpring } from 'react-spring'; import { useDrag } from 'react-use-gesture'; import create from 'zustand'; -import { PressureIcon, SlideKeyframe } from '../components/icons'; +import { + FullScreenControlsRoundedIcon, + MenuBarControlsRoundedIcon, + PressureIcon, + SlideKeyframe, +} from '../components/icons'; import PlaySkipIconAni from '../components/play-skip'; import Selection from '../components/selection'; import { anySlide, loopBeginSlide, loopSlide, slide, slideTypes, toolToSlide } from '../timeline'; @@ -13,6 +18,10 @@ import { TimedVideoPlayer } from './present'; import AppBar from '@material-ui/core/AppBar'; import Button from '@material-ui/core/Button'; import Fab from '@material-ui/core/Fab'; +import FormControl from '@material-ui/core/FormControl'; +import InputLabel from '@material-ui/core/InputLabel'; +import MenuItem from '@material-ui/core/MenuItem'; +import Select from '@material-ui/core/Select'; import Slider from '@material-ui/core/Slider'; import Switch from '@material-ui/core/Switch'; import Toolbar from '@material-ui/core/Toolbar'; @@ -22,6 +31,7 @@ import ToggleButton from '@material-ui/lab/ToggleButton'; import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup'; import Icon from '@mdi/react'; +import ArrowDropDownRoundedIcon from '@material-ui/icons/ArrowDropDownRounded'; import FullscreenRoundedIcon from '@material-ui/icons/FullscreenRounded'; import NavigateBeforeRoundedIcon from '@material-ui/icons/NavigateBeforeRounded'; import NavigateNextRoundedIcon from '@material-ui/icons/NavigateNextRounded'; @@ -629,6 +639,50 @@ function DefaultSettings() { <span className='body'>Allow remote control during presentation</span> <Switch /> </div> + <FormControl variant='filled'> + <InputLabel>On-screen controls</InputLabel> + <Select + labelId='demo-simple-select-filled-label' + id='demo-simple-select-filled' + onChange={console.log} + IconComponent={ArrowDropDownRoundedIcon} + > + <MenuItem value='FullScreen'> + <div className='posrel os-controls-type fullscreen'> + <div className='sidebyside'> + <div className='posrel icon'> + <div className='posabs abscenterv'> + <FullScreenControlsRoundedIcon /> + </div> + </div> + <div className='description'> + <span className='title'>Full screen</span> + <span className='body'> + Full screen columns to click through slides. Press center to show menu + </span> + </div> + </div> + </div> + </MenuItem> + <MenuItem value='MenuBar'> + <div className='posrel os-controls-type menubar'> + <div className='sidebyside'> + <div className='posrel icon'> + <div className='posabs abscenterv'> + <MenuBarControlsRoundedIcon /> + </div> + </div> + <div className='description'> + <span className='title'>Menu bar</span> + <span className='body'> + Floating controls that snap to the screen edge + </span> + </div> + </div> + </div> + </MenuItem> + </Select> + </FormControl> </div> <div className='section'> <span className='title'>Cool temporary buttons</span> |