duckietm/Nitro-Cool-UI
1
0
Fork 0
mirror of https://github.com/duckietm/Nitro-Cool-UI.git synced 2025-06-21 22:36:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

🆙 Camera fix and some small updates

Browse Source
This commit is contained in:
duckietm 2024-09-13 08:06:26 +02:00
parent 34c52c69eb
commit 20cd6fc28f
14 changed files with 84 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
public/renderer-config.json
View File

@ -11,17 +11,17 @@
"${gamedata.url}//config/UITexts.json"
],
"external.samples.url": "${hof.furni.url}/mp3/sound_machine_sample_%sample%.mp3",
"furnidata.url": "${gamedata.url}/config/FurnitureData.json",
"productdata.url": "${gamedata.url}/config/ProductData.json",
"avatar.actions.url": "${gamedata.url}/config/HabboAvatarActions.json",
"avatar.figuredata.url": "${gamedata.url}/config/FigureData.json",
"avatar.figuremap.url": "${gamedata.url}/config/FigureMap.json",
"avatar.effectmap.url": "${gamedata.url}/config/EffectMap.json",
"furnidata.url": "${gamedata.url}/config/FurnitureData.json?v=1",
"productdata.url": "${gamedata.url}/config/ProductData.json?v=1",
"avatar.actions.url": "${gamedata.url}/config/HabboAvatarActions.json?v=1",
"avatar.figuredata.url": "${gamedata.url}/config/FigureData.json?v=1",
"avatar.figuremap.url": "${gamedata.url}/config/FigureMap.json?v=1",
"avatar.effectmap.url": "${gamedata.url}/config/EffectMap.json?v=1",
"avatar.asset.url": "${asset.url}/clothes/%libname%.nitro",
"avatar.asset.effect.url": "${asset.url}/effect/%libname%.nitro",
"furni.asset.url": "${asset.url}/furniture/%libname%.nitro",
"furni.asset.icon.url": "${gamedata.url}/icons/%libname%%param%_icon.png",
"pet.asset.url": "${asset.url}/pet/%libname%.nitro",
"pet.asset.url": "${asset.url}/pets/%libname%.nitro",
"generic.asset.url": "${asset.url}/generic/%libname%.nitro",
"badge.asset.url": "${image.library.url}album1584/%badgename%.gif",
"furni.rotation.bounce.steps": 20,
@ -38,6 +38,7 @@
"system.pong.interval.ms": 20000,
"room.color.skip.transition": true,
"room.landscapes.enabled": true,
"room.zoom.enabled": true,
"avatar.mandatory.libraries": [
"bd:1",
"li:0"

3
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';
@ -57,7 +57,6 @@ export const App: FC<{}> = props =>
GetSoundManager().init(),
GetSessionDataManager().init(),
GetRoomSessionManager().init(),
GetRoomCameraWidgetManager().init()
]
);

11
src/api/room/widgets/FurnitureDimmerUtilities.ts
View File

@ -19,10 +19,17 @@ export class FurnitureDimmerUtilities
}
public static previewDimmer(color: number, brightness: number, bgOnly: boolean): void
{
GetRoomEngine().updateObjectRoomColor(GetRoomSession().roomId, color, brightness, bgOnly);
{
const roomSession = GetRoomSession();
if (!roomSession || !roomSession.roomId) {
console.error('Room session or roomId is not available.');
return;
}
GetRoomEngine().updateObjectRoomColor(roomSession.roomId, color, brightness, bgOnly);
}
public static scaleBrightness(value: number): number
{
return ~~((((value - this.MIN_BRIGHTNESS) * (100 - 0)) / (this.MAX_BRIGHTNESS - this.MIN_BRIGHTNESS)) + 0);

8
src/components/camera/CameraWidgetView.tsx
View File

@ -14,7 +14,7 @@ export const CameraWidgetView: FC<{}> = props =>
{
const [ mode, setMode ] = useState<number>(MODE_NONE);
const [ base64Url, setSavedPictureUrl ] = useState<string>(null);
const { availableEffects = [], selectedPictureIndex = -1, cameraRoll = [], setCameraRoll = null, myLevel = 0, price = { credits: 0, duckets: 0, publishDucketPrice: 0 }} = useCamera();
const { availableEffects = [], selectedPictureIndex = -1, cameraRoll = [], setCameraRoll = null, myLevel = 0, price = { credits: 0, duckets: 0, publishDucketPrice: 0 } } = useCamera();
const processAction = (type: string) =>
{
@ -40,13 +40,13 @@ export const CameraWidgetView: FC<{}> = props =>
setMode(MODE_CAPTURE);
return;
}
}
};
const checkoutPictureUrl = (pictureUrl: string) =>
{
setSavedPictureUrl(pictureUrl);
setMode(MODE_CHECKOUT);
}
};
useNitroEvent<RoomSessionEvent>(RoomSessionEvent.ENDED, event => setMode(MODE_NONE));
@ -93,4 +93,4 @@ export const CameraWidgetView: FC<{}> = props =>
{ (mode === MODE_CHECKOUT) && <CameraWidgetCheckoutView base64Url={ base64Url } onCloseClick={ () => processAction('close') } onCancelClick={ () => processAction('editor_cancel') } price={ price }></CameraWidgetCheckoutView> }
</>
);
}
};

6
src/components/camera/views/CameraWidgetCaptureView.tsx
View File

@ -30,7 +30,7 @@ export const CameraWidgetCaptureView: FC<CameraWidgetCaptureViewProps> = props =
const frameBounds = elementRef.current.getBoundingClientRect();
return new NitroRectangle(Math.floor(frameBounds.x), Math.floor(frameBounds.y), Math.floor(frameBounds.width), Math.floor(frameBounds.height));
}
};
const takePicture = async () =>
{
@ -55,7 +55,7 @@ export const CameraWidgetCaptureView: FC<CameraWidgetCaptureViewProps> = props =
clone.push(new CameraPicture(texture, await TextureUtils.generateImageUrl(texture)));
setCameraRoll(clone);
}
};
return (
<DraggableWindow uniqueKey="nitro-camera-capture">
@ -87,4 +87,4 @@ export const CameraWidgetCaptureView: FC<CameraWidgetCaptureViewProps> = props =
</Column>
</DraggableWindow>
);
}
};

4
src/components/camera/views/CameraWidgetCheckoutView.tsx
View File

@ -70,7 +70,7 @@ export const CameraWidgetCheckoutView: FC<CameraWidgetCheckoutViewProps> = props
onCancelClick();
return;
}
}
};
useEffect(() =>
{
@ -156,4 +156,4 @@ export const CameraWidgetCheckoutView: FC<CameraWidgetCheckoutViewProps> = props
</NitroCardContentView>
</NitroCardView>
);
}
};

6
src/components/camera/views/CameraWidgetShowPhotoView.tsx
View File

@ -26,7 +26,7 @@ export const CameraWidgetShowPhotoView: FC<CameraWidgetShowPhotoViewProps> = pro
return newIndex;
});
}
};
const previous = () =>
{
@ -38,7 +38,7 @@ export const CameraWidgetShowPhotoView: FC<CameraWidgetShowPhotoViewProps> = pro
return newIndex;
});
}
};
useEffect(() =>
{
@ -68,4 +68,4 @@ export const CameraWidgetShowPhotoView: FC<CameraWidgetShowPhotoViewProps> = pro
}
</Grid>
);
}
};

48
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 () =>
{
const imageUrl = await GetRoomCameraWidgetManager().applyEffects(picture.texture, selectedEffects, isZoomed);
setCurrentPictureUrl(imageUrl.src);
})();
GetRoomCameraWidgetManager()
.applyEffects(picture.texture, selectedEffects, isZoomed)
.then(imageElement =>
{
setCurrentPictureUrl(imageElement.src);
})
.catch(error =>
{
NitroLogger.error('Failed to apply effects to picture', error);
});
}, [ picture, selectedEffects, isZoomed ]);
return (
@ -189,7 +189,7 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
<NitroCardTabsView>
{ TABS.map(tab =>
{
return <NitroCardTabsItemView key={ tab } isActive={ currentTab === tab } onClick={ event => processAction('change_tab', tab) }><i className={ 'icon icon-camera-' + tab }></i></NitroCardTabsItemView>
return <NitroCardTabsItemView key={ tab } isActive={ currentTab === tab } onClick={ event => processAction('change_tab', tab) }><i className={ 'icon icon-camera-' + tab }></i></NitroCardTabsItemView>;
}) }
</NitroCardTabsView>
<NitroCardContentView>
@ -205,12 +205,12 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
<Text>{ LocalizeText('camera.effect.name.' + selectedEffectName) }</Text>
<ReactSlider
className={ 'nitro-slider' }
max={ 1 }
min={ 0 }
renderThumb={ (props, state) => <div { ...props }>{ state.valueNow }</div> }
max={ 1 }
step={ 0.01 }
value={ getCurrentEffect.alpha }
onChange={ event => setSelectedEffectAlpha(event) } />
value={ getCurrentEffect.strength }
onChange={ event => setSelectedEffectAlpha(event) }
renderThumb={ ({ key, ...props }, state) => <div key={ key } { ...props }>{ state.valueNow }</div> } />
</Column> }
</Column>
<Flex justifyContent="between">
@ -240,4 +240,4 @@ export const CameraWidgetEditorView: FC<CameraWidgetEditorViewProps> = props =>
</NitroCardContentView>
</NitroCardView>
);
}
};

2
src/components/camera/views/editor/effect-list/CameraWidgetEffectListItemView.tsx
View File

@ -37,4 +37,4 @@ export const CameraWidgetEffectListItemView: FC<CameraWidgetEffectListItemViewPr
</Text> }
</LayoutGridItem>
);
}
};

2
src/components/camera/views/editor/effect-list/CameraWidgetEffectListView.tsx
View File

@ -24,7 +24,7 @@ export const CameraWidgetEffectListView: FC<CameraWidgetEffectListViewProps> = p
const thumbnailUrl = (thumbnails.find(thumbnail => (thumbnail.effectName === effect.name)));
const isActive = (selectedEffects.findIndex(selectedEffect => (selectedEffect.effect.name === effect.name)) > -1);
return <CameraWidgetEffectListItemView key={ index } effect={ effect } isActive={ isActive } isLocked={ (effect.minLevel > myLevel) } removeEffect={ () => processAction('remove_effect', effect.name) } selectEffect={ () => processAction('select_effect', effect.name) } thumbnailUrl={ ((thumbnailUrl && thumbnailUrl.thumbnailUrl) || null) } />;
return <CameraWidgetEffectListItemView key={ index } effect={ effect } thumbnailUrl={ ((thumbnailUrl && thumbnailUrl.thumbnailUrl) || null) } isActive={ isActive } isLocked={ (effect.minLevel > myLevel) } selectEffect={ () => processAction('select_effect', effect.name) } removeEffect={ () => processAction('remove_effect', effect.name) } />;
}) }
</Grid>
);

2
src/components/room/widgets/RoomWidgetsView.tsx
View File

@ -21,7 +21,7 @@ export const RoomWidgetsView: FC<{}> = props =>
const { roomSession = null } = useRoom();
const { simpleAlert = null } = useNotification();
useNitroEvent<RoomZoomEvent>(RoomZoomEvent.ROOM_ZOOM, event => GetRoomEngine().setRoomInstanceRenderingCanvasScale(event.roomId, 1, event.level, null, null, false, event.asDelta));
useNitroEvent<RoomZoomEvent>(RoomZoomEvent.ROOM_ZOOM, event => GetRoomEngine().setRoomInstanceRenderingCanvasScale(event.roomId, 1, (((event.level)<1) ? 0.5 : (1 << (Math.floor(event.level) - 1))), null, null, event.isFlipForced));
useNitroEvent<RoomEngineObjectEvent>(
[

17
src/components/room/widgets/room-tools/RoomToolsWidgetView.tsx
View File

@ -1,7 +1,7 @@
import { CreateLinkEvent, GetGuestRoomResultEvent, GetRoomEngine, NavigatorSearchComposer, RateFlatMessageComposer, RoomDataParser } from '@nitrots/nitro-renderer';
import { AnimatePresence, motion } from 'framer-motion';
import { FC, useEffect, useState } from 'react';
import { LocalizeText, SendMessageComposer, SetLocalStorage, TryVisitRoom } from '../../../../api';
import { GetConfigurationValue, LocalizeText, SendMessageComposer, SetLocalStorage, TryVisitRoom } from '../../../../api';
import { Base, Column, Flex, Text, classNames } from '../../../../common';
import { useMessageEvent, useNavigator, useRoom } from '../../../../hooks';
@ -31,12 +31,17 @@ export const RoomToolsWidgetView: FC<{}> = props =>
case 'zoom':
setIsZoomedIn(prevValue =>
{
let scale = GetRoomEngine().getRoomInstanceRenderingCanvasScale(roomSession.roomId, 1);
if(GetConfigurationValue('room.zoom.enabled', true))
{
const scale = GetRoomEngine().getRoomInstanceRenderingCanvasScale(roomSession.roomId, 1);
GetRoomEngine().setRoomInstanceRenderingCanvasScale(roomSession.roomId, 1, scale === 1 ? 0.5 : 1);
}
else
{
const geometry = GetRoomEngine().getRoomInstanceGeometry(roomSession.roomId, 1);
if(!prevValue) scale /= 2;
else scale *= 2;
GetRoomEngine().setRoomInstanceRenderingCanvasScale(roomSession.roomId, 1, scale);
if(geometry) geometry.performZoom();
}
return !prevValue;
});

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

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

13
src/hooks/rooms/widgets/useChatInputWidget.ts
View File

@ -108,17 +108,8 @@ const useChatInputWidgetState = () =>
return null;
case ':zoom':
let requestedZoomLevel = parseFloat(secondPart);
if (isNaN(requestedZoomLevel)) {
requestedZoomLevel = 1;
}
if (requestedZoomLevel >= 1 && requestedZoomLevel <= 5) {
GetRoomEngine().events.dispatchEvent(new RoomZoomEvent(roomSession.roomId, requestedZoomLevel, false));
} else if (requestedZoomLevel === 0) {
GetRoomEngine().events.dispatchEvent(new RoomZoomEvent(roomSession.roomId, 1, false));
} else {
GetRoomEngine().events.dispatchEvent(new RoomZoomEvent(roomSession.roomId, 1, false));
};
GetEventDispatcher().dispatchEvent(new RoomZoomEvent(roomSession.roomId, parseInt(secondPart)));
return null;
case ':screenshot':
const texture = GetRoomEngine().createTextureFromRoom(roomSession.roomId, 1);