nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-22 22:30:52 +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 { GetUIVersion } from './api';
import { Base } from './common';
@ -55,8 +55,7 @@ export const App: FC<{}> = props =>
GetAvatarRenderManager().init(),
GetSoundManager().init(),
GetSessionDataManager().init(),
GetRoomSessionManager().init(),
GetRoomCameraWidgetManager().init()
GetRoomSessionManager().init()
]
);

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

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

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

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