antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-01 10:23:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Add fullscreen player view (#27)

Browse source 
* Add store controls for fullscreen player

* Normalize styles for playback config

* Add fullscreen player component

* Add option component

* Update player controls to use option/popover components

* Add esc hotkey to close player

* Add usePlayerData hook
This commit is contained in:
Jeff 2023-03-28 14:19:23 -07:00 • committed by GitHub
parent 6cfdb8ff84
commit e47fcfc62e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 780 additions and 62 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/renderer/layouts/default-layout.tsx
View file

@ -11,10 +11,11 @@ import { DrawerPlayQueue, SidebarPlayQueue } from '/@/renderer/features/now-play
import { Playerbar } from '/@/renderer/features/player';
import { Sidebar } from '/@/renderer/features/sidebar/components/sidebar';
import { AppRoute } from '/@/renderer/router/routes';
import { useAppStore, useAppStoreActions } from '/@/renderer/store';
import { useAppStore, useAppStoreActions, useFullScreenPlayerStore } from '/@/renderer/store';
import { useSettingsStore, useGeneralSettings } from '/@/renderer/store/settings.store';
import { PlaybackType } from '/@/renderer/types';
import { constrainSidebarWidth, constrainRightSidebarWidth } from '/@/renderer/utils';
import { FullScreenPlayer } from '/@/renderer/features/player/components/full-screen-player';
if (!isElectron()) {
useSettingsStore.getState().actions.setSettings({
@ -84,7 +85,7 @@ const ResizeHandle = styled.div<{
right: ${(props) => props.placement === 'right' && 0};
bottom: ${(props) => props.placement === 'bottom' && 0};
left: ${(props) => props.placement === 'left' && 0};
z-index: 100;
z-index: 90;
width: 2px;
height: 100%;
background-color: var(--sidebar-handle-bg);
@ -147,6 +148,7 @@ export const DefaultLayout = ({ shell }: DefaultLayoutProps) => {
location.pathname !== AppRoute.NOW_PLAYING;
const showSideQueue = sidebar.rightExpanded && location.pathname !== AppRoute.NOW_PLAYING;
const { expanded: isFullScreenPlayerExpanded } = useFullScreenPlayerStore();
const queueDrawerButtonVariants: Variants = {
hidden: {
@ -259,6 +261,12 @@ export const DefaultLayout = ({ shell }: DefaultLayoutProps) => {
>
{!shell && (
<>
<AnimatePresence
initial={false}
mode="wait"
>
{isFullScreenPlayerExpanded && <FullScreenPlayer />}
</AnimatePresence>
<SidebarContainer id="sidebar">
<ResizeHandle
ref={sidebarRef}