nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-26 15:40:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

Camera fixes

Browse Source
This commit is contained in:
Bill 2024-07-12 23:11:31 -04:00
parent cb31d98e10
commit 831738d569
3 changed files with 25 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/App.tsx
View File

@ -1,4 +1,4 @@
import { GetAssetManager, GetAvatarRenderManager, GetCommunication, GetConfiguration, GetLocalizationManager, GetRoomCameraWidgetManager, GetRoomEngine, GetRoomSessionManager, GetSessionDataManager, GetSoundManager, GetStage, GetTexturePool, GetTicker, HabboWebTools, LegacyExternalInterface, LoadGameUrlEvent, NitroLogger, NitroVersion, PrepareRenderer } from '@nitrots/nitro-renderer'; import { GetAssetManager, GetAvatarRenderManager, GetCommunication, GetConfiguration, GetLocalizationManager, GetRoomEngine, GetRoomSessionManager, GetSessionDataManager, GetSoundManager, GetStage, GetTexturePool, GetTicker, HabboWebTools, LegacyExternalInterface, LoadGameUrlEvent, NitroLogger, NitroVersion, PrepareRenderer } from '@nitrots/nitro-renderer';
import { FC, useEffect, useState } from 'react'; import { FC, useEffect, useState } from 'react';
import { GetUIVersion } from './api'; import { GetUIVersion } from './api';
import { Base } from './common'; import { Base } from './common';
@ -55,8 +55,7 @@ export const App: FC<{}> = props =>
GetAvatarRenderManager().init(), GetAvatarRenderManager().init(),
GetSoundManager().init(), GetSoundManager().init(),
GetSessionDataManager().init(), GetSessionDataManager().init(),
GetRoomSessionManager().init(), GetRoomSessionManager().init()
GetRoomCameraWidgetManager().init()
] ]
); );

40
src/components/camera/views/editor/CameraWidgetEditorView.tsx
View File

@ -1,5 +1,5 @@
import { GetRoomCameraWidgetManager, IRoomCameraWidgetEffect, IRoomCameraWidgetSelectedEffect, RoomCameraWidgetSelectedEffect } from '@nitrots/nitro-renderer'; import { GetRoomCameraWidgetManager, IRoomCameraWidgetEffect, IRoomCameraWidgetSelectedEffect, NitroLogger, RoomCameraWidgetSelectedEffect } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useMemo, useState } from 'react'; import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { FaSave, FaSearchMinus, FaSearchPlus, FaTrash } from 'react-icons/fa'; import { FaSave, FaSearchMinus, FaSearchPlus, FaTrash } from 'react-icons/fa';
import ReactSlider from 'react-slider'; import ReactSlider from 'react-slider';
import { CameraEditorTabs, CameraPicture, CameraPictureThumbnail, LocalizeText } from '../../../../api'; import { CameraEditorTabs, CameraPicture, CameraPictureThumbnail, LocalizeText } from '../../../../api';
@ -27,6 +27,7 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
const [ effectsThumbnails, setEffectsThumbnails ] = useState<CameraPictureThumbnail[]>([]); const [ effectsThumbnails, setEffectsThumbnails ] = useState<CameraPictureThumbnail[]>([]);
const [ isZoomed, setIsZoomed ] = useState(false); const [ isZoomed, setIsZoomed ] = useState(false);
const [ currentPictureUrl, setCurrentPictureUrl ] = useState<string>(''); const [ currentPictureUrl, setCurrentPictureUrl ] = useState<string>('');
const isBusy = useRef<boolean>(false);
const getColorMatrixEffects = useMemo(() => const getColorMatrixEffects = useMemo(() =>
{ {
@ -158,29 +159,28 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
useEffect(() => useEffect(() =>
{ {
(async () => const processThumbnails = async () =>
{ {
const thumbnails: CameraPictureThumbnail[] = []; const renderedEffects = await Promise.all(availableEffects.map(effect => GetRoomCameraWidgetManager().applyEffects(picture.texture, [ new RoomCameraWidgetSelectedEffect(effect, 1) ], false)));
for await (const effect of availableEffects) setEffectsThumbnails(renderedEffects.map((image, index) => new CameraPictureThumbnail(availableEffects[index].name, image.src)));
{ };
const image = await GetRoomCameraWidgetManager().applyEffects(picture.texture, [ new RoomCameraWidgetSelectedEffect(effect, 1) ], false);
thumbnails.push(new CameraPictureThumbnail(effect.name, image.src)); processThumbnails();
}
setEffectsThumbnails(thumbnails);
})();
}, [ picture, availableEffects ]); }, [ picture, availableEffects ]);
useEffect(() => useEffect(() =>
{ {
(async () => GetRoomCameraWidgetManager()
{ .applyEffects(picture.texture, selectedEffects, isZoomed)
const imageUrl = await GetRoomCameraWidgetManager().applyEffects(picture.texture, selectedEffects, isZoomed); .then(imageElement =>
{
setCurrentPictureUrl(imageUrl.src); setCurrentPictureUrl(imageElement.src);
})(); })
.catch(error =>
{
NitroLogger.error('Failed to apply effects to picture', error);
});
}, [ picture, selectedEffects, isZoomed ]); }, [ picture, selectedEffects, isZoomed ]);
return ( return (
@ -208,9 +208,9 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
min={ 0 } min={ 0 }
max={ 1 } max={ 1 }
step={ 0.01 } step={ 0.01 }
value={ getCurrentEffect.alpha } value={ getCurrentEffect.strength }
onChange={ event => setSelectedEffectAlpha(event) } onChange={ event => setSelectedEffectAlpha(event) }
renderThumb={ (props, state) => <div { ...props }>{ state.valueNow }</div> } /> renderThumb={ ({ key, ...props }, state) => <div key={ key } { ...props }>{ state.valueNow }</div> } />
</Column> } </Column> }
</Column> </Column>
<Flex justifyContent="between"> <Flex justifyContent="between">

9
src/hooks/camera/useCamera.ts
View File

@ -26,14 +26,11 @@ const useCameraState = () =>
useEffect(() => useEffect(() =>
{ {
if(!GetRoomCameraWidgetManager().isLoaded) if(GetRoomCameraWidgetManager().isLoaded) return;
{
GetRoomCameraWidgetManager().init();
SendMessageComposer(new RequestCameraConfigurationComposer()); GetRoomCameraWidgetManager().init();
return; SendMessageComposer(new RequestCameraConfigurationComposer());
}
}, []); }, []);
return { availableEffects, cameraRoll, setCameraRoll, selectedPictureIndex, setSelectedPictureIndex, myLevel, price }; return { availableEffects, cameraRoll, setCameraRoll, selectedPictureIndex, setSelectedPictureIndex, myLevel, price };