From 0ffb6b0d47dfe3316e264ca3a08aa89ffb1957d1 Mon Sep 17 00:00:00 2001 From: Batman Date: Wed, 21 Apr 2021 18:31:09 -0300 Subject: [PATCH 1/3] Context Fix --- src/views/navigator/NavigatorView.tsx | 2 +- .../navigator/lock/NavigatorLockView.tsx | 4 +- .../result/NavigatorResultView.tsx | 44 +++++++++---------- 3 files changed, 23 insertions(+), 27 deletions(-) diff --git a/src/views/navigator/NavigatorView.tsx b/src/views/navigator/NavigatorView.tsx index 6cf31e94..c5f9a0fb 100644 --- a/src/views/navigator/NavigatorView.tsx +++ b/src/views/navigator/NavigatorView.tsx @@ -140,7 +140,7 @@ export function NavigatorView(props: NavigatorViewProps): JSX.Element - + diff --git a/src/views/navigator/lock/NavigatorLockView.tsx b/src/views/navigator/lock/NavigatorLockView.tsx index cefbbf7c..7a48e7d6 100644 --- a/src/views/navigator/lock/NavigatorLockView.tsx +++ b/src/views/navigator/lock/NavigatorLockView.tsx @@ -15,7 +15,6 @@ export function NavigatorLockView(props: NavigatorLockViewProps): JSX.Element } return ( - <>
@@ -32,7 +31,6 @@ export function NavigatorLockView(props: NavigatorLockViewProps): JSX.Element }
- - + ); } diff --git a/src/views/navigator/result-lists/result-list/result/NavigatorResultView.tsx b/src/views/navigator/result-lists/result-list/result/NavigatorResultView.tsx index 97f388ce..08a303e1 100644 --- a/src/views/navigator/result-lists/result-list/result/NavigatorResultView.tsx +++ b/src/views/navigator/result-lists/result-list/result/NavigatorResultView.tsx @@ -1,6 +1,6 @@ import classNames from 'classnames'; import { RoomDataParser } from 'nitro-renderer'; -import React from 'react'; +import React, { useContext } from 'react'; import { NavigatorContext } from '../../../NavigatorView'; import { NavigatorResultViewProps } from './NavigatorResultView.types'; @@ -8,6 +8,8 @@ export function NavigatorResultView(props: NavigatorResultViewProps): JSX.Elemen { const { result = null } = props; + const navigatorContext = useContext(NavigatorContext); + function getUserCounterColor(): string { const num: number = (100 * (result.userCount / result.maxUserCount)); @@ -37,28 +39,24 @@ export function NavigatorResultView(props: NavigatorResultViewProps): JSX.Elemen } return ( - - { navigatorContext => { - return
navigatorContext.onTryVisitRoom(result) }> -
-
-
- { result.userCount } -
-
- { result.roomName } -
-
-
- - { result.habboGroupId > 0 && } - { result.doorMode !== RoomDataParser.OPEN_STATE && - - } -
-
+
navigatorContext.onTryVisitRoom(result) }> +
+
+
+ { result.userCount }
- }} - +
+ { result.roomName } +
+
+
+ + { result.habboGroupId > 0 && } + { result.doorMode !== RoomDataParser.OPEN_STATE && + + } +
+
+
); } From e5d81b7a536fc041380795a054e665ac0f0d2d33 Mon Sep 17 00:00:00 2001 From: Batman Date: Wed, 21 Apr 2021 19:52:06 -0300 Subject: [PATCH 2/3] Init Chat widget --- src/views/room/RoomView.tsx | 6 +++++- src/views/room/widgets/Widgets.scss | 1 + src/views/room/widgets/chat/ChatWidgetsView.scss | 1 + src/views/room/widgets/chat/ChatWidgetsView.tsx | 15 +++++++++++++++ .../room/widgets/chat/ChatWidgetsView.types.ts | 3 +++ .../widgets/chat/form/ChatFormWidgetView.scss | 16 ++++++++++++++++ .../widgets/chat/form/ChatFormWidgetView.tsx | 15 +++++++++++++++ .../chat/form/ChatFormWidgetView.types.tsx | 2 ++ .../chat/messages/ChatMessagesWidgetView.tsx | 10 ++++++++++ .../messages/ChatMessagesWidgetView.types.ts | 2 ++ .../messages/message/ChatMessageWidgetView.tsx | 10 ++++++++++ .../message/ChatMessageWidgetView.types.ts | 2 ++ 12 files changed, 82 insertions(+), 1 deletion(-) create mode 100644 src/views/room/widgets/chat/ChatWidgetsView.scss create mode 100644 src/views/room/widgets/chat/ChatWidgetsView.tsx create mode 100644 src/views/room/widgets/chat/ChatWidgetsView.types.ts create mode 100644 src/views/room/widgets/chat/form/ChatFormWidgetView.scss create mode 100644 src/views/room/widgets/chat/form/ChatFormWidgetView.tsx create mode 100644 src/views/room/widgets/chat/form/ChatFormWidgetView.types.tsx create mode 100644 src/views/room/widgets/chat/messages/ChatMessagesWidgetView.tsx create mode 100644 src/views/room/widgets/chat/messages/ChatMessagesWidgetView.types.ts create mode 100644 src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.tsx create mode 100644 src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.types.ts diff --git a/src/views/room/RoomView.tsx b/src/views/room/RoomView.tsx index 60665fa0..97e066f1 100644 --- a/src/views/room/RoomView.tsx +++ b/src/views/room/RoomView.tsx @@ -6,6 +6,7 @@ import { WindowResizeEvent } from '../../api/nitro/room/DispatchResizeEvent'; import { DispatchTouchEvent } from '../../api/nitro/room/DispatchTouchEvent'; import { GetRoomEngine } from '../../api/nitro/room/GetRoomEngine'; import { RoomViewProps } from './RoomView.types'; +import { ChatWidgetsView } from './widgets/chat/ChatWidgetsView'; import { FurnitureWidgetsView } from './widgets/furniture/FurnitureWidgetsView'; export function RoomView(props: RoomViewProps): JSX.Element @@ -85,7 +86,10 @@ export function RoomView(props: RoomViewProps): JSX.Element { roomSession &&
} { roomSession && events && roomCanvas && createPortal(props.children, document.getElementById('room-view').appendChild(roomCanvas)) && - } + <> + + + }
); } diff --git a/src/views/room/widgets/Widgets.scss b/src/views/room/widgets/Widgets.scss index 91839885..dfbccd40 100644 --- a/src/views/room/widgets/Widgets.scss +++ b/src/views/room/widgets/Widgets.scss @@ -1 +1,2 @@ +@import './chat/ChatWidgetsView'; @import './furniture/FurnitureWidgets'; diff --git a/src/views/room/widgets/chat/ChatWidgetsView.scss b/src/views/room/widgets/chat/ChatWidgetsView.scss new file mode 100644 index 00000000..e59bacd8 --- /dev/null +++ b/src/views/room/widgets/chat/ChatWidgetsView.scss @@ -0,0 +1 @@ +@import './form/ChatFormWidgetView'; diff --git a/src/views/room/widgets/chat/ChatWidgetsView.tsx b/src/views/room/widgets/chat/ChatWidgetsView.tsx new file mode 100644 index 00000000..9b9e966c --- /dev/null +++ b/src/views/room/widgets/chat/ChatWidgetsView.tsx @@ -0,0 +1,15 @@ +import { ChatWidgetsViewProps } from './ChatWidgetsView.types'; +import { ChatFormWidgetView } from './form/ChatFormWidgetView'; +import { ChatMessagesWidgetView } from './messages/ChatMessagesWidgetView'; + +export function ChatWidgetsView(props: ChatWidgetsViewProps): JSX.Element +{ + const {} = props; + + return ( + <> + + + + ); +} diff --git a/src/views/room/widgets/chat/ChatWidgetsView.types.ts b/src/views/room/widgets/chat/ChatWidgetsView.types.ts new file mode 100644 index 00000000..afb43ce7 --- /dev/null +++ b/src/views/room/widgets/chat/ChatWidgetsView.types.ts @@ -0,0 +1,3 @@ + +export interface ChatWidgetsViewProps +{} diff --git a/src/views/room/widgets/chat/form/ChatFormWidgetView.scss b/src/views/room/widgets/chat/form/ChatFormWidgetView.scss new file mode 100644 index 00000000..73c2afca --- /dev/null +++ b/src/views/room/widgets/chat/form/ChatFormWidgetView.scss @@ -0,0 +1,16 @@ +.nitro-chat-form-input { + display: inline-grid; + vertical-align: top; + align-items: center; + position: relative; + height: 100%; + padding:0 10px; + + input { + width: auto; + height: 45px; + border-radius: 10px; + border: 1px solid rgb(0, 0, 0); + background: #EDEDED; + } +} diff --git a/src/views/room/widgets/chat/form/ChatFormWidgetView.tsx b/src/views/room/widgets/chat/form/ChatFormWidgetView.tsx new file mode 100644 index 00000000..025dd1fa --- /dev/null +++ b/src/views/room/widgets/chat/form/ChatFormWidgetView.tsx @@ -0,0 +1,15 @@ +import { LocalizeText } from '../../../../../utils/LocalizeText'; +import { ChatFormWidgetViewProps } from './ChatFormWidgetView.types'; + +export function ChatFormWidgetView(props: ChatFormWidgetViewProps): JSX.Element +{ + const {} = props; + + return ( +
+
+ +
+
+ ); +} diff --git a/src/views/room/widgets/chat/form/ChatFormWidgetView.types.tsx b/src/views/room/widgets/chat/form/ChatFormWidgetView.types.tsx new file mode 100644 index 00000000..955e50de --- /dev/null +++ b/src/views/room/widgets/chat/form/ChatFormWidgetView.types.tsx @@ -0,0 +1,2 @@ +export interface ChatFormWidgetViewProps +{} diff --git a/src/views/room/widgets/chat/messages/ChatMessagesWidgetView.tsx b/src/views/room/widgets/chat/messages/ChatMessagesWidgetView.tsx new file mode 100644 index 00000000..ac9c52d4 --- /dev/null +++ b/src/views/room/widgets/chat/messages/ChatMessagesWidgetView.tsx @@ -0,0 +1,10 @@ +import { ChatMessagesWidgetViewProps } from './ChatMessagesWidgetView.types'; + +export function ChatMessagesWidgetView(props: ChatMessagesWidgetViewProps): JSX.Element +{ + const {} = props; + + return ( + <> + ); +} diff --git a/src/views/room/widgets/chat/messages/ChatMessagesWidgetView.types.ts b/src/views/room/widgets/chat/messages/ChatMessagesWidgetView.types.ts new file mode 100644 index 00000000..17bcbbca --- /dev/null +++ b/src/views/room/widgets/chat/messages/ChatMessagesWidgetView.types.ts @@ -0,0 +1,2 @@ +export interface ChatMessagesWidgetViewProps +{} diff --git a/src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.tsx b/src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.tsx new file mode 100644 index 00000000..6bb59b84 --- /dev/null +++ b/src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.tsx @@ -0,0 +1,10 @@ +import { ChatMessageWidgetViewProps } from './ChatMessageWidgetView.types'; + +export function ChatMessageWidgetView(props: ChatMessageWidgetViewProps): JSX.Element +{ + const {} = props; + + return ( + <> + ); +} diff --git a/src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.types.ts b/src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.types.ts new file mode 100644 index 00000000..357642e9 --- /dev/null +++ b/src/views/room/widgets/chat/messages/message/ChatMessageWidgetView.types.ts @@ -0,0 +1,2 @@ +export interface ChatMessageWidgetViewProps +{} From 4ebc638eb4f76d42424ae4a11a9bf03eb9767d2e Mon Sep 17 00:00:00 2001 From: Batman Date: Wed, 21 Apr 2021 19:54:58 -0300 Subject: [PATCH 3/3] Chat widget pointer event fix --- src/views/room/widgets/chat/ChatWidgetsView.scss | 4 ++++ src/views/room/widgets/chat/ChatWidgetsView.tsx | 4 ++-- src/views/room/widgets/chat/form/ChatFormWidgetView.scss | 3 ++- 3 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/views/room/widgets/chat/ChatWidgetsView.scss b/src/views/room/widgets/chat/ChatWidgetsView.scss index e59bacd8..c3d016cf 100644 --- a/src/views/room/widgets/chat/ChatWidgetsView.scss +++ b/src/views/room/widgets/chat/ChatWidgetsView.scss @@ -1 +1,5 @@ +.nitro-chat-widget { + pointer-events: none; +} + @import './form/ChatFormWidgetView'; diff --git a/src/views/room/widgets/chat/ChatWidgetsView.tsx b/src/views/room/widgets/chat/ChatWidgetsView.tsx index 9b9e966c..9c0ac65f 100644 --- a/src/views/room/widgets/chat/ChatWidgetsView.tsx +++ b/src/views/room/widgets/chat/ChatWidgetsView.tsx @@ -7,9 +7,9 @@ export function ChatWidgetsView(props: ChatWidgetsViewProps): JSX.Element const {} = props; return ( - <> +
- +
); } diff --git a/src/views/room/widgets/chat/form/ChatFormWidgetView.scss b/src/views/room/widgets/chat/form/ChatFormWidgetView.scss index 73c2afca..3cd029c9 100644 --- a/src/views/room/widgets/chat/form/ChatFormWidgetView.scss +++ b/src/views/room/widgets/chat/form/ChatFormWidgetView.scss @@ -4,7 +4,8 @@ align-items: center; position: relative; height: 100%; - padding:0 10px; + padding: 0 10px; + pointer-events: all; input { width: auto;