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

Merge branch 'dev' of https://git.krews.org/nitro/nitro-react into dev

Browse Source
This commit is contained in:
Endrit 2022-03-16 19:25:21 +01:00
commit 92ad096419
19 changed files with 75 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
.github/workflows/build.yml vendored
View File

@ -1,34 +0,0 @@
name: Build
on:
push:
branches: [dev]
jobs:
build:
runs-on: dedicated-server
strategy:
matrix:
node-version: [16.x]
steps:
- name: Checkout Repository
uses: actions/checkout@v2
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v2
with:
node-version: ${{ matrix.node-version }}
cache: "yarn"
- name: Install dependencies
run: |
yarn remove @nitrots/nitro-renderer
yarn add git+https://git@git.krews.org/nitro/nitro-renderer#dev
yarn install
- name: Build Nitro
run: |
yarn build
- name: Archive Artifacts
uses: actions/upload-artifact@v2
with:
path: |
build

0
.gitlab-ci.yml → .gitlab-ci.yml-disabled
View File

1
src/api/notification/NotificationUtilities.ts
View File

@ -1,6 +1,5 @@
import { HabboWebTools, RoomEnterEffect } from '@nitrots/nitro-renderer';
import { CreateLinkEvent, GetConfiguration, GetNitroInstance, LocalizeText } from '..';
import { CatalogPageName } from '../../components/catalog/common/CatalogPageName';
import { NotificationAlertEvent, NotificationConfirmEvent } from '../../events';
import { NotificationBubbleEvent } from '../../events/notification-center/NotificationBubbleEvent';
import { DispatchUiEvent } from '../../hooks';

18
src/common/layout/LayoutRoomPreviewerView.tsx
View File

@ -1,5 +1,5 @@
import { ColorConverter, IRoomRenderingCanvas, RoomPreviewer, TextureUtils } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useRef, useState } from 'react';
import { FC, MouseEvent, useCallback, useEffect, useRef, useState } from 'react';
import { GetNitroInstance } from '../../api';
export interface LayoutRoomPreviewerViewProps
@ -14,6 +14,20 @@ export const LayoutRoomPreviewerView: FC<LayoutRoomPreviewerViewProps> = props =
const [ renderingCanvas, setRenderingCanvas ] = useState<IRoomRenderingCanvas>(null);
const elementRef = useRef<HTMLDivElement>();
const onClick = (event: MouseEvent<HTMLDivElement>) =>
{
if(!roomPreviewer) return;
if(event.shiftKey)
{
roomPreviewer.changeRoomObjectDirection();
}
else
{
roomPreviewer.changeRoomObjectState();
}
}
const update = useCallback((time: number) =>
{
if(!roomPreviewer || !renderingCanvas || !elementRef.current) return;
@ -83,7 +97,7 @@ export const LayoutRoomPreviewerView: FC<LayoutRoomPreviewerViewProps> = props =
return (
<div className="room-preview-container">
<div ref={ elementRef } className="room-preview-image" style={ { height } } />
<div ref={ elementRef } className="room-preview-image" style={ { height } } onClick={ onClick } />
{ props.children }
</div>
);

1
src/components/catalog/CatalogView.scss
View File

@ -98,7 +98,6 @@
.layout-grid-item {
height: 75px !important;
max-height: 75px !important;
}
}

2
src/components/catalog/views/page/layout/marketplace/CatalogLayoutMarketplaceItemView.tsx
View File

@ -67,7 +67,7 @@ export const CatalogLayoutMarketplaceItemView: FC<MarketplaceItemViewProps> = pr
}, [offerData]);
return (
<LayoutGridItem center={ false } column={ false } alignItems="center" className="p-1">
<LayoutGridItem shrink center={ false } column={ false } alignItems="center" className="p-1">
<LayoutImage imageUrl={ getImageUrlForOffer() } fit={ false } style={ { width: 50, height: 50 } } />
<Column grow gap={ 0 }>
<Text fontWeight="bold">{ getMarketplaceOfferTitle }</Text>

2
src/components/catalog/views/page/layout/marketplace/CatalogLayoutMarketplaceOwnItemsView.tsx
View File

@ -83,7 +83,7 @@ export const CatalogLayoutMarketplaceOwnItemsView: FC<CatalogLayoutProps> = prop
});
return (
<Column>
<Column overflow="hidden">
{ (creditsWaiting <= 0) &&
<Text center className="bg-muted rounded p-1">
{ LocalizeText('catalog.marketplace.redeem.no_sold_items') }

10
src/components/navigator/NavigatorMessageHandler.tsx
View File

@ -1,7 +1,7 @@
import { CantConnectMessageParser, GenericErrorEvent, GetGuestRoomResultEvent, LegacyExternalInterface, NavigatorCategoriesComposer, NavigatorCategoriesEvent, NavigatorHomeRoomEvent, NavigatorMetadataEvent, NavigatorSearchEvent, NavigatorSettingsComposer, RoomCreatedEvent, RoomDataParser, RoomDoorbellAcceptedEvent, RoomDoorbellEvent, RoomDoorbellRejectedEvent, RoomEnterErrorEvent, RoomEntryInfoMessageEvent, RoomForwardEvent, RoomInfoComposer, RoomSettingsUpdatedEvent, UserInfoEvent } from '@nitrots/nitro-renderer';
import { CantConnectMessageParser, GenericErrorEvent, GetGuestRoomResultEvent, LegacyExternalInterface, NavigatorCategoriesComposer, NavigatorCategoriesEvent, NavigatorHomeRoomEvent, NavigatorMetadataEvent, NavigatorOpenRoomCreatorEvent, NavigatorSearchEvent, NavigatorSettingsComposer, RoomCreatedEvent, RoomDataParser, RoomDoorbellAcceptedEvent, RoomDoorbellEvent, RoomDoorbellRejectedEvent, RoomEnterErrorEvent, RoomEntryInfoMessageEvent, RoomForwardEvent, RoomInfoComposer, RoomSettingsUpdatedEvent, UserInfoEvent } from '@nitrots/nitro-renderer';
import { FC, useCallback } from 'react';
import { CreateRoomSession, GetSessionDataManager, LocalizeText, NotificationAlertType, NotificationUtilities, SendMessageComposer, VisitDesktop } from '../../api';
import { UpdateDoorStateEvent } from '../../events';
import { NavigatorEvent, UpdateDoorStateEvent } from '../../events';
import { DispatchUiEvent, UseMessageEventHook } from '../../hooks';
import { useNavigatorContext } from './NavigatorContext';
import { NavigatorActions } from './reducers/NavigatorReducer';
@ -221,6 +221,11 @@ export const NavigatorMessageHandler: FC<{}> = props =>
VisitDesktop();
}, []);
const onRoomCreatorEvent = useCallback((event: RoomEnterErrorEvent) =>
{
DispatchUiEvent(new NavigatorEvent(NavigatorEvent.SHOW_ROOM_CREATOR));
},[]);
UseMessageEventHook(UserInfoEvent, onUserInfoEvent);
UseMessageEventHook(RoomForwardEvent, onRoomForwardEvent);
UseMessageEventHook(RoomEntryInfoMessageEvent, onRoomEntryInfoMessageEvent);
@ -236,6 +241,7 @@ export const NavigatorMessageHandler: FC<{}> = props =>
UseMessageEventHook(NavigatorHomeRoomEvent, onNavigatorHomeRoomEvent);
UseMessageEventHook(RoomSettingsUpdatedEvent, onRoomSettingsUpdatedEvent);
UseMessageEventHook(RoomEnterErrorEvent, onRoomEnterErrorEvent);
UseMessageEventHook(NavigatorOpenRoomCreatorEvent, onRoomCreatorEvent);
return null;
}

3
src/components/navigator/NavigatorView.scss
View File

@ -52,8 +52,7 @@
width: 400px;
.list-container {
min-height: 100px;
max-height: 100px;
height: 100px;
.list-item {
background-color: $grid-active-bg-color;

5
src/components/navigator/NavigatorView.tsx
View File

@ -46,6 +46,10 @@ export const NavigatorView: FC<{}> = props =>
case NavigatorEvent.TOGGLE_ROOM_LINK:
setRoomLinkOpen(value => !value);
return;
case NavigatorEvent.SHOW_ROOM_CREATOR:
setIsVisible(true);
setCreatorOpen(true);
return;
}
}, []);
@ -54,6 +58,7 @@ export const NavigatorView: FC<{}> = props =>
UseUiEvent(NavigatorEvent.TOGGLE_NAVIGATOR, onNavigatorEvent);
UseUiEvent(NavigatorEvent.TOGGLE_ROOM_INFO, onNavigatorEvent);
UseUiEvent(NavigatorEvent.TOGGLE_ROOM_LINK, onNavigatorEvent);
UseUiEvent(NavigatorEvent.SHOW_ROOM_CREATOR, onNavigatorEvent);
const onUpdateDoorStateEvent = useCallback((event: UpdateDoorStateEvent) =>
{

8
src/components/navigator/views/creator/NavigatorRoomCreatorView.tsx
View File

@ -21,13 +21,13 @@ export const NavigatorRoomCreatorView: FC<{}> = props =>
const getRoomModelImage = (name: string) => GetConfiguration<string>('images.url') + `/navigator/models/model_${ name }.png`;
const selectModel = (model: IRoomModel) =>
const selectModel = (model: IRoomModel, index) =>
{
if(!model) return;
if(model.clubLevel > GetClubMemberLevel()) return;
setSelectedModelName(name);
setSelectedModelName(RoomModels[index].name);
}
const createRoom = () =>
@ -97,9 +97,9 @@ export const NavigatorRoomCreatorView: FC<{}> = props =>
</Column>
<Column size={ 6 } gap={ 1 } overflow="auto">
{
RoomModels.map(model =>
RoomModels.map((model, index )=>
{
return (<LayoutGridItem fullHeight key={ model.name } onClick={ () => selectModel(model) } itemActive={ (selectedModelName === model.name) } overflow="unset" gap={ 0 } className="p-1" disabled={ (GetClubMemberLevel() < model.clubLevel) }>
return (<LayoutGridItem fullHeight key={ model.name } onClick={ () => selectModel(model, index) } itemActive={ (selectedModelName === model.name) } overflow="unset" gap={ 0 } className="p-1" disabled={ (GetClubMemberLevel() < model.clubLevel) }>
<Flex fullHeight center overflow="hidden">
<img alt="" src={ getRoomModelImage(model.name) } />
</Flex>

12
src/components/navigator/views/room-info/NavigatorRoomInfoView.tsx
View File

@ -111,7 +111,7 @@ export const NavigatorRoomInfoView: FC<NavigatorRoomInfoViewProps> = props =>
<>
<Flex gap={ 2 } overflow="hidden">
<LayoutRoomThumbnailView roomId={ roomInfoData.enteredGuestRoom.roomId } customUrl={ roomInfoData.enteredGuestRoom.officialRoomPicRef }>
{ hasPermission('settings') && <i className="icon icon-camera-small position-absolute b-0 r-0 m-1 cursor-pointer" onClick={ () => processAction('open_room_thumbnail_camera') } /> }
{ hasPermission('settings') && <i className="icon icon-camera-small position-absolute b-0 r-0 m-1 cursor-pointer top-0" onClick={ () => processAction('open_room_thumbnail_camera') } /> }
</LayoutRoomThumbnailView>
<Column grow gap={ 1 } overflow="hidden">
<Flex gap={ 1 }>
@ -140,12 +140,10 @@ export const NavigatorRoomInfoView: FC<NavigatorRoomInfoViewProps> = props =>
}) }
</Flex> }
</Column>
<Column>
<Flex alignItems="center" gap={ 1 }>
<FontAwesomeIcon icon="link" title={ LocalizeText('navigator.embed.caption') } className="cursor-pointer" onClick={ event => DispatchUiEvent(new NavigatorEvent(NavigatorEvent.TOGGLE_ROOM_LINK)) } />
{ hasPermission('settings') &&
<i className="icon icon-cog cursor-pointer" title={ LocalizeText('navigator.room.popup.info.room.settings') } onClick={ event => processAction('open_room_settings') } /> }
</Flex>
<Column alignItems="center" gap={ 1 }>
{ hasPermission('settings') &&
<i className="icon icon-cog cursor-pointer" title={ LocalizeText('navigator.room.popup.info.room.settings') } onClick={ event => processAction('open_room_settings') } /> }
<FontAwesomeIcon icon="link" title={ LocalizeText('navigator.embed.caption') } className="cursor-pointer" onClick={ event => DispatchUiEvent(new NavigatorEvent(NavigatorEvent.TOGGLE_ROOM_LINK)) } />
</Column>
</Flex>
<Text overflow="auto" style={ { maxHeight: 50 } }>{ roomInfoData.enteredGuestRoom.description }</Text>

26
src/components/navigator/views/room-settings/views/NavigatorRoomSettingsRightsTabView.tsx
View File

@ -23,22 +23,24 @@ export const NavigatorRoomSettingsRightsTabView: FC<NavigatorRoomSettingsTabView
}, [ roomSettingsData, handleChange ]);
return (
<Grid overflow="auto">
<Grid>
<Column size={ 6 }>
<Text bold>
{ LocalizeText('navigator.flatctrls.userswithrights', [ 'displayed', 'total' ], [ roomSettingsData.usersWithRights.size.toString(), roomSettingsData.usersWithRights.size.toString() ]) }
</Text>
<Column fullWidth className="bg-white rounded list-container p-2" overflow="auto" gap={ 1 }>
{ Array.from(roomSettingsData.usersWithRights.entries()).map(([id, name], index) =>
{
return (
<Flex key={ index } alignItems="center" gap={ 1 } overflow="hidden">
<UserProfileIconView userName={ name } />
<Text pointer grow key={index} onClick={ event => removeUserRights(id) }> { name }</Text>
</Flex>
);
}) }
</Column>
<Flex overflow="hidden" className="bg-white rounded list-container p-2">
<Column fullWidth overflow="auto" gap={ 1 }>
{ Array.from(roomSettingsData.usersWithRights.entries()).map(([id, name], index) =>
{
return (
<Flex key={ index } shrink alignItems="center" gap={ 1 } overflow="hidden">
<UserProfileIconView userName={ name } />
<Text pointer grow key={index} onClick={ event => removeUserRights(id) }> { name }</Text>
</Flex>
);
}) }
</Column>
</Flex>
<Button variant="danger" disabled={ !roomSettingsData.usersWithRights.size } onClick={ removeAllRights } >
{ LocalizeText('navigator.flatctrls.clear') }
</Button>

11
src/components/notification-center/views/alert-layouts/GetAlertLayout.tsx
View File

@ -1,6 +1,5 @@
import { NotificationAlertItem, NotificationAlertType } from '../../../../api';
import { NotificationAlertItem } from '../../../../api';
import { NotificationDefaultAlertView } from './NotificationDefaultAlertView';
import { NotificationEventAlertView } from './NotificationEventAlertView';
export const GetAlertLayout = (item: NotificationAlertItem, close: () => void) =>
{
@ -8,11 +7,5 @@ export const GetAlertLayout = (item: NotificationAlertItem, close: () => void) =
const props = { key: item.id, item, close };
switch(item.alertType)
{
case NotificationAlertType.EVENT:
return <NotificationEventAlertView { ...props } />
default:
return <NotificationDefaultAlertView { ...props } />
}
return <NotificationDefaultAlertView { ...props } />
}

9
src/components/notification-center/views/alert-layouts/NotificationDefaultAlertView.tsx
View File

@ -18,6 +18,8 @@ export const NotificationDefaultAlertView: FC<NotificationDefaultAlertViewProps>
close();
}, [ item, close ]);
const isAction = (item.clickUrl && item.clickUrl.startsWith('event:'));
return (
<LayoutNotificationAlertView title={ title } close={ close } { ...rest }>
{ (item.messages.length > 0) && item.messages.map((message, index) =>
@ -27,9 +29,12 @@ export const NotificationDefaultAlertView: FC<NotificationDefaultAlertViewProps>
return <Base grow fullHeight overflow="auto" key={ index } dangerouslySetInnerHTML={ { __html: htmlText } } />;
}) }
<Column alignItems="center" center gap={ 1 }>
<Button onClick={ close }>{ LocalizeText('generic.close') }</Button>
{ item.clickUrl && item.clickUrl.length &&
{ !isAction &&
<Button onClick={ close }>{ LocalizeText('generic.close') }</Button> }
{ !isAction && item.clickUrl && (item.clickUrl.length > 0) &&
<Button variant="link" onClick={ visitUrl }>{ LocalizeText(item.clickUrlText) }</Button> }
{ isAction && item.clickUrl && (item.clickUrl.length > 0) &&
<Button onClick={ visitUrl }>{ LocalizeText(item.clickUrlText) }</Button> }
</Column>
</LayoutNotificationAlertView>
);

36
src/components/notification-center/views/alert-layouts/NotificationEventAlertView.tsx
View File

@ -1,36 +0,0 @@
import { FC, useCallback } from 'react';
import { LocalizeText, NotificationAlertItem, NotificationUtilities } from '../../../../api';
import { LayoutNotificationAlertView, LayoutNotificationAlertViewProps } from '../../../../common';
export interface NotificationEventAlertViewProps extends LayoutNotificationAlertViewProps
{
item: NotificationAlertItem;
}
export const NotificationEventAlertView: FC<NotificationEventAlertViewProps> = props =>
{
const { item = null, title = ((props.item && props.item.title) || ''), close = null, ...rest } = props;
const visitUrl = useCallback(() =>
{
NotificationUtilities.openUrl(item.clickUrl);
close();
}, [ item, close ]);
return (
<LayoutNotificationAlertView title={ item.title } close={ close } { ...rest }>
{ (item.messages.length > 0) && item.messages.map((message, index) =>
{
const htmlText = message.replace(/\r\n|\r|\n/g, '<br />');
return (
<div key={ index } dangerouslySetInnerHTML={ { __html: htmlText } } />
);
}) }
<div className="d-flex justify-content-center align-items-center mt-1">
<button type="button" className="btn btn-primary" onClick={ visitUrl }>{ LocalizeText(item.clickUrlText) }</button>
</div>
</LayoutNotificationAlertView>
);
}

2
src/components/purse/views/SeasonalView.tsx
View File

@ -13,7 +13,7 @@ export const SeasonalView: FC<SeasonalViewProps> = props =>
const { type = -1, amount = -1 } = props;
return (
<Flex justifyContent="between" className="nitro-purse-seasonal-currency p-2 rounded">
<Flex fullWidth justifyContent="between" className="nitro-purse-seasonal-currency p-2 rounded">
<Text variant="white">{ LocalizeText(`purse.seasonal.currency.${ type }`) }</Text>
<Flex gap={ 1 }>
<Text variant="white">{ LocalizeFormattedNumber(amount) }</Text>

14
src/components/room/widgets/infostand/InfoStandWidgetUserView.tsx
View File

@ -138,14 +138,18 @@ export const InfoStandWidgetUserView: FC<InfoStandWidgetUserViewProps> = props =
<Column gap={ 1 }>
<Flex alignItems="center" className="bg-light-dark rounded py-1 px-2">
{ (userData.type !== RoomWidgetUpdateInfostandUserEvent.OWN_USER) &&
<Text fullWidth wrap textBreak variant="white" small className="motto-content">{ motto }</Text> }
<Flex grow alignItems="center" className="motto-content">
<Text fullWidth pointer wrap textBreak small variant="white">{ motto }</Text>
</Flex> }
{ userData.type === RoomWidgetUpdateInfostandUserEvent.OWN_USER &&
<Flex grow alignItems="center" gap={ 2 }>
<FontAwesomeIcon icon="pencil-alt" className="small" />
{ !isEditingMotto &&
<Text fullWidth pointer wrap textBreak small variant="white" className="motto-content" onClick={ event => setIsEditingMotto(true) }>{ motto }</Text> }
{ isEditingMotto &&
<input type="text" className="motto-input" maxLength={ 38 } value={ motto } onChange={ event => setMotto(event.target.value) } onBlur={ onMottoBlur } onKeyDown={ onMottoKeyDown } autoFocus={ true } /> }
<Flex grow alignItems="center" className="motto-content">
{ !isEditingMotto &&
<Text fullWidth pointer wrap textBreak small variant="white" onClick={ event => setIsEditingMotto(true) }>{ motto }</Text> }
{ isEditingMotto &&
<input type="text" className="motto-input" maxLength={ 38 } value={ motto } onChange={ event => setMotto(event.target.value) } onBlur={ onMottoBlur } onKeyDown={ onMottoKeyDown } autoFocus={ true } /> }
</Flex>
</Flex> }
</Flex>
<hr className="m-0" />

1
src/events/navigator/NavigatorEvent.ts
View File

@ -8,6 +8,7 @@ export class NavigatorEvent extends NitroEvent
public static TOGGLE_ROOM_INFO: string = 'NE_TOGGLE_ROOM_INFO';
public static TOGGLE_ROOM_LINK: string = 'NE_TOGGLE_ROOM_LINK';
public static TOGGLE_ROOM_SETTINGS: string = 'NE_TOGGLE_ROOM_SETTINGS';
public static SHOW_ROOM_CREATOR: string = 'NE_TOGGLE_CREATOR';
private _roomId: number;
private _password: string;