From b7c978c7860d27043757dcb0bb260a573fa5f04c Mon Sep 17 00:00:00 2001 From: dank074 Date: Tue, 16 Nov 2021 01:03:59 -0600 Subject: [PATCH] add another handler --- .../events/RoomWidgetPollUpdateEvent.ts | 110 ++++++++++++++++++ .../widgets/handlers/PollWidgetHandler.ts | 76 ++++++++++++ .../widgets/messages/RoomWidgetPollMessage.ts | 44 +++++++ src/views/room/RoomView.tsx | 2 + src/views/room/widgets/RoomWidgets.scss | 1 + .../widgets/word-quiz/WordQuizWidgetView.scss | 12 ++ .../widgets/word-quiz/WordQuizWidgetView.tsx | 44 ++++++- .../widgets/word-quiz/common/VoteValue.ts | 2 + .../word-quiz/views/question/QuestionView.tsx | 14 +++ .../views/question/QuestionView.types.ts | 7 ++ 10 files changed, 310 insertions(+), 2 deletions(-) create mode 100644 src/api/nitro/room/widgets/events/RoomWidgetPollUpdateEvent.ts create mode 100644 src/api/nitro/room/widgets/handlers/PollWidgetHandler.ts create mode 100644 src/api/nitro/room/widgets/messages/RoomWidgetPollMessage.ts create mode 100644 src/views/room/widgets/word-quiz/WordQuizWidgetView.scss create mode 100644 src/views/room/widgets/word-quiz/common/VoteValue.ts create mode 100644 src/views/room/widgets/word-quiz/views/question/QuestionView.tsx create mode 100644 src/views/room/widgets/word-quiz/views/question/QuestionView.types.ts diff --git a/src/api/nitro/room/widgets/events/RoomWidgetPollUpdateEvent.ts b/src/api/nitro/room/widgets/events/RoomWidgetPollUpdateEvent.ts new file mode 100644 index 00000000..58e8d644 --- /dev/null +++ b/src/api/nitro/room/widgets/events/RoomWidgetPollUpdateEvent.ts @@ -0,0 +1,110 @@ +import { PollQuestion } from '@nitrots/nitro-renderer'; +import { RoomWidgetUpdateEvent } from './RoomWidgetUpdateEvent'; + +export class RoomWidgetPollUpdateEvent extends RoomWidgetUpdateEvent +{ + public static readonly OFFER = 'RWPUW_OFFER'; + public static readonly ERROR = 'RWPUW_ERROR'; + public static readonly CONTENT = 'RWPUW_CONTENT'; + + private _id = -1; + private _summary: string; + private _headline: string; + private _numQuestions = 0; + private _startMessage = ''; + private _endMessage = ''; + private _questionArray: PollQuestion[] = null; + private _pollType = ''; + private _npsPoll = false; + + constructor(type: string, id: number) + { + super(type); + this._id = id; + } + + public get id(): number + { + return this._id; + } + + public get summary(): string + { + return this._summary; + } + + public set summary(k: string) + { + this._summary = k; + } + + public get headline(): string + { + return this._headline; + } + + public set headline(k: string) + { + this._headline = k; + } + + public get numQuestions(): number + { + return this._numQuestions; + } + + public set numQuestions(k: number) + { + this._numQuestions = k; + } + + public get startMessage(): string + { + return this._startMessage; + } + + public set startMessage(k: string) + { + this._startMessage = k; + } + + public get endMessage(): string + { + return this._endMessage; + } + + public set endMessage(k: string) + { + this._endMessage = k; + } + + public get questionArray(): PollQuestion[] + { + return this._questionArray; + } + + public set questionArray(k: PollQuestion[]) + { + this._questionArray = k; + } + + public get pollType(): string + { + return this._pollType; + } + + public set pollType(k: string) + { + this._pollType = k; + } + + public get npsPoll(): boolean + { + return this._npsPoll; + } + + public set npsPoll(k: boolean) + { + this._npsPoll = k; + } +} diff --git a/src/api/nitro/room/widgets/handlers/PollWidgetHandler.ts b/src/api/nitro/room/widgets/handlers/PollWidgetHandler.ts new file mode 100644 index 00000000..df4d67b7 --- /dev/null +++ b/src/api/nitro/room/widgets/handlers/PollWidgetHandler.ts @@ -0,0 +1,76 @@ +import { NitroEvent, RoomSessionPollEvent, RoomWidgetEnum } from '@nitrots/nitro-renderer'; +import { RoomWidgetPollUpdateEvent } from '../events/RoomWidgetPollUpdateEvent'; +import { RoomWidgetUpdateEvent } from '../events/RoomWidgetUpdateEvent'; +import { RoomWidgetMessage } from '../messages/RoomWidgetMessage'; +import { RoomWidgetPollMessage } from '../messages/RoomWidgetPollMessage'; +import { RoomWidgetHandler } from './RoomWidgetHandler'; + +export class PollWidgetHandler extends RoomWidgetHandler +{ + public processEvent(event: NitroEvent): void + { + const pollEvent = (event as RoomSessionPollEvent); + + let widgetEvent: RoomWidgetPollUpdateEvent; + + switch(event.type) + { + case RoomSessionPollEvent.OFFER: + widgetEvent = new RoomWidgetPollUpdateEvent(RoomWidgetPollUpdateEvent.OFFER, pollEvent.id); + widgetEvent.summary = pollEvent.summary; + widgetEvent.headline = pollEvent.headline; + break; + case RoomSessionPollEvent.ERROR: + widgetEvent = new RoomWidgetPollUpdateEvent(RoomWidgetPollUpdateEvent.ERROR, pollEvent.id); + widgetEvent.summary = pollEvent.summary; + widgetEvent.headline = pollEvent.headline; + break; + case RoomSessionPollEvent.CONTENT: + widgetEvent = new RoomWidgetPollUpdateEvent(RoomWidgetPollUpdateEvent.CONTENT, pollEvent.id); + widgetEvent.startMessage = pollEvent.startMessage; + widgetEvent.endMessage = pollEvent.endMessage; + widgetEvent.numQuestions = pollEvent.numQuestions; + widgetEvent.questionArray = pollEvent.questionArray; + widgetEvent.npsPoll = pollEvent.npsPoll; + break; + } + + if(!widgetEvent) return; + + this.container.eventDispatcher.dispatchEvent(widgetEvent); + } + + public processWidgetMessage(message: RoomWidgetMessage): RoomWidgetUpdateEvent + { + const pollMessage = (message as RoomWidgetPollMessage); + + switch(message.type) + { + case RoomWidgetPollMessage.START: + this.container.roomSession.sendPollStartMessage(pollMessage.id); + break; + case RoomWidgetPollMessage.REJECT: + this.container.roomSession.sendPollRejectMessage(pollMessage.id); + break; + case RoomWidgetPollMessage.ANSWER: + this.container.roomSession.sendPollAnswerMessage(pollMessage.id, pollMessage.questionId, pollMessage.answers); + break; + } + return null; + } + + public get type(): string + { + return RoomWidgetEnum.ROOM_POLL; + } + + public get eventTypes(): string[] + { + return [RoomSessionPollEvent.OFFER, RoomSessionPollEvent.ERROR, RoomSessionPollEvent.CONTENT]; + } + + public get messageTypes(): string[] + { + return [RoomWidgetPollMessage.ANSWER, RoomWidgetPollMessage.REJECT, RoomWidgetPollMessage.START]; + } +} diff --git a/src/api/nitro/room/widgets/messages/RoomWidgetPollMessage.ts b/src/api/nitro/room/widgets/messages/RoomWidgetPollMessage.ts new file mode 100644 index 00000000..a74d97bf --- /dev/null +++ b/src/api/nitro/room/widgets/messages/RoomWidgetPollMessage.ts @@ -0,0 +1,44 @@ +import { RoomWidgetMessage } from './RoomWidgetMessage'; + +export class RoomWidgetPollMessage extends RoomWidgetMessage +{ + public static readonly START = 'RWPM_START'; + public static readonly REJECT = 'RWPM_REJECT'; + public static readonly ANSWER = 'RWPM_ANSWER'; + + private _id = -1; + private _questionId = 0; + private _answers: string[] = null; + + constructor(type: string, id: number) + { + super(type); + + this._id = id; + } + + public get id(): number + { + return this._id; + } + + public get questionId(): number + { + return this._questionId; + } + + public set questionId(k: number) + { + this._questionId = k; + } + + public get answers(): string[] + { + return this._answers; + } + + public set answers(k: string[]) + { + this._answers = k; + } +} diff --git a/src/views/room/RoomView.tsx b/src/views/room/RoomView.tsx index 1118a685..eecff624 100644 --- a/src/views/room/RoomView.tsx +++ b/src/views/room/RoomView.tsx @@ -2,6 +2,7 @@ import { EventDispatcher, NitroRectangle, RoomGeometry, RoomVariableEnum, Vector import { FC, useEffect, useRef, useState } from 'react'; import { DispatchMouseEvent, DispatchTouchEvent, DoorbellWidgetHandler, FurniChooserWidgetHandler, FurnitureContextMenuWidgetHandler, FurnitureCreditWidgetHandler, FurnitureCustomStackHeightWidgetHandler, FurnitureDimmerWidgetHandler, FurnitureExternalImageWidgetHandler, FurnitureMannequinWidgetHandler, FurniturePresentWidgetHandler, GetNitroInstance, GetRoomEngine, InitializeRoomInstanceRenderingCanvas, IRoomWidgetHandlerManager, RoomWidgetAvatarInfoHandler, RoomWidgetChatHandler, RoomWidgetChatInputHandler, RoomWidgetHandlerManager, RoomWidgetInfostandHandler, RoomWidgetRoomToolsHandler, RoomWidgetUpdateRoomViewEvent, UserChooserWidgetHandler } from '../../api'; import { FurnitureYoutubeDisplayWidgetHandler } from '../../api/nitro/room/widgets/handlers/FurnitureYoutubeDisplayWidgetHandler'; +import { PollWidgetHandler } from '../../api/nitro/room/widgets/handlers/PollWidgetHandler'; import { WordQuizWidgetHandler } from '../../api/nitro/room/widgets/handlers/WordQuizWidgetHandler'; import { RoomContextProvider } from './context/RoomContext'; import { RoomColorView } from './RoomColorView'; @@ -39,6 +40,7 @@ export const RoomView: FC = props => widgetHandlerManager.registerHandler(new UserChooserWidgetHandler()); widgetHandlerManager.registerHandler(new DoorbellWidgetHandler()); widgetHandlerManager.registerHandler(new WordQuizWidgetHandler()); + widgetHandlerManager.registerHandler(new PollWidgetHandler()); widgetHandlerManager.registerHandler(new FurniChooserWidgetHandler()); widgetHandlerManager.registerHandler(new FurnitureContextMenuWidgetHandler()); diff --git a/src/views/room/widgets/RoomWidgets.scss b/src/views/room/widgets/RoomWidgets.scss index 4cac258a..6c2a2f2b 100644 --- a/src/views/room/widgets/RoomWidgets.scss +++ b/src/views/room/widgets/RoomWidgets.scss @@ -8,3 +8,4 @@ @import './object-location/ObjectLocationView'; @import './room-tools/RoomToolsWidgetView'; @import './choosers/ChooserWidgetView'; +@import './word-quiz/WordQuizWidgetView'; diff --git a/src/views/room/widgets/word-quiz/WordQuizWidgetView.scss b/src/views/room/widgets/word-quiz/WordQuizWidgetView.scss new file mode 100644 index 00000000..d4291278 --- /dev/null +++ b/src/views/room/widgets/word-quiz/WordQuizWidgetView.scss @@ -0,0 +1,12 @@ +.word-quiz-question-container { + position: absolute; + top: 10px; + left: 0px; + .wordquiz-question { + font-size: large; + background: rgba($dark, 0.90); + //box-shadow: inset 0px 5px lighten(rgba($dark,.6),2.5), inset 0 -4px darken(rgba($dark,.6),4); + border-radius: $border-radius; + transition: all 0.2s ease; + } +} diff --git a/src/views/room/widgets/word-quiz/WordQuizWidgetView.tsx b/src/views/room/widgets/word-quiz/WordQuizWidgetView.tsx index 13f54726..a529f409 100644 --- a/src/views/room/widgets/word-quiz/WordQuizWidgetView.tsx +++ b/src/views/room/widgets/word-quiz/WordQuizWidgetView.tsx @@ -1,6 +1,46 @@ -import { FC } from 'react'; +import { IQuestion } from '@nitrots/nitro-renderer'; +import { FC, useCallback, useState } from 'react'; +import { RoomWidgetWordQuizUpdateEvent } from '../../../../api/nitro/room/widgets/events/RoomWidgetWordQuizUpdateEvent'; +import { BatchUpdates, CreateEventDispatcherHook } from '../../../../hooks'; +import { useRoomContext } from '../../context/RoomContext'; +import { QuestionView } from './views/question/QuestionView'; export const WordQuizWidgetView: FC<{}> = props => { - return null; + const { eventDispatcher = null, widgetHandler = null } = useRoomContext(); + const [pollId, setPollId ] = useState(-1); + const [question, setQuestion] = useState(null); + const [ answerSent, setAnswerSent ] = useState(false); + + const onRoomWidgetWordQuizUpdateEvent = useCallback((event: RoomWidgetWordQuizUpdateEvent) => + { + switch(event.type) + { + case RoomWidgetWordQuizUpdateEvent.NEW_QUESTION: + BatchUpdates(() => + { + setPollId(event.id); + setQuestion(event.question); + setAnswerSent(false); + }); + //this._showSignCounters = new Dictionary(); + //this.showNewQuestion(this._question, k.duration); + break; + } + }, []); + + const vote = useCallback((vote: string) => + { + + }, []); + + CreateEventDispatcherHook(RoomWidgetWordQuizUpdateEvent.NEW_QUESTION, eventDispatcher, onRoomWidgetWordQuizUpdateEvent); + CreateEventDispatcherHook(RoomWidgetWordQuizUpdateEvent.QUESTION_ANSWERED, eventDispatcher, onRoomWidgetWordQuizUpdateEvent); + CreateEventDispatcherHook(RoomWidgetWordQuizUpdateEvent.QUESTION_FINISHED, eventDispatcher, onRoomWidgetWordQuizUpdateEvent); + + return ( + <> + {question && } + + ); } diff --git a/src/views/room/widgets/word-quiz/common/VoteValue.ts b/src/views/room/widgets/word-quiz/common/VoteValue.ts new file mode 100644 index 00000000..ef84aaff --- /dev/null +++ b/src/views/room/widgets/word-quiz/common/VoteValue.ts @@ -0,0 +1,2 @@ +export const VALUE_KEY_DISLIKE = '0'; +export const VALUE_KEY_LIKE = '1'; diff --git a/src/views/room/widgets/word-quiz/views/question/QuestionView.tsx b/src/views/room/widgets/word-quiz/views/question/QuestionView.tsx new file mode 100644 index 00000000..13bbf225 --- /dev/null +++ b/src/views/room/widgets/word-quiz/views/question/QuestionView.tsx @@ -0,0 +1,14 @@ +import { FC } from 'react'; +import { QuestionViewProps } from './QuestionView.types'; + +export const QuestionView:FC = props => +{ + const { question = null, canVote = null } = props; + + return ( +
+
{question}
+
+ + ) +} diff --git a/src/views/room/widgets/word-quiz/views/question/QuestionView.types.ts b/src/views/room/widgets/word-quiz/views/question/QuestionView.types.ts new file mode 100644 index 00000000..09fda7b4 --- /dev/null +++ b/src/views/room/widgets/word-quiz/views/question/QuestionView.types.ts @@ -0,0 +1,7 @@ + +export interface QuestionViewProps +{ + question: string; + canVote: boolean; + vote(value: string): void; +}