chore: adjust danmuku click logic

This commit is contained in:
molvqingtai 2024-10-10 16:45:13 +08:00
parent 619ebc70c4
commit ee829af279
2 changed files with 12 additions and 12 deletions

View file

@ -1,9 +1,5 @@
import { Avatar, AvatarFallback } from '@/components/ui/Avatar' import { Avatar, AvatarFallback } from '@/components/ui/Avatar'
import { Button } from '@/components/ui/Button' import { Button } from '@/components/ui/Button'
import { APP_STATUS_STORAGE_KEY } from '@/constants/config'
import { EVENT } from '@/constants/event'
import { AppStatus } from '@/domain/AppStatus'
import { LocalStorageImpl } from '@/domain/impls/Storage'
import { TextMessage } from '@/domain/Room' import { TextMessage } from '@/domain/Room'
import { cn } from '@/utils' import { cn } from '@/utils'
import { AvatarImage } from '@radix-ui/react-avatar' import { AvatarImage } from '@radix-ui/react-avatar'
@ -12,22 +8,17 @@ import { FC, MouseEvent } from 'react'
export interface PromptItemProps { export interface PromptItemProps {
data: TextMessage data: TextMessage
className?: string className?: string
onClick?: (e: MouseEvent<HTMLButtonElement>) => void
onMouseEnter?: (e: MouseEvent<HTMLButtonElement>) => void onMouseEnter?: (e: MouseEvent<HTMLButtonElement>) => void
onMouseLeave?: (e: MouseEvent<HTMLButtonElement>) => void onMouseLeave?: (e: MouseEvent<HTMLButtonElement>) => void
} }
const DanmakuMessage: FC<PromptItemProps> = ({ data, className, onMouseEnter, onMouseLeave }) => { const DanmakuMessage: FC<PromptItemProps> = ({ data, className, onClick, onMouseEnter, onMouseLeave }) => {
const handleOpenApp = async () => {
const appStatus = await LocalStorageImpl.value.get<AppStatus>(APP_STATUS_STORAGE_KEY)
LocalStorageImpl.value.set<AppStatus>(APP_STATUS_STORAGE_KEY, { ...appStatus!, open: true, unread: 0 })
dispatchEvent(new CustomEvent(EVENT.APP_OPEN))
}
return ( return (
<Button <Button
onMouseEnter={onMouseEnter} onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave} onMouseLeave={onMouseLeave}
onClick={handleOpenApp} onClick={onClick}
className={cn( className={cn(
'flex justify-center pointer-events-auto visible gap-x-2 border px-2.5 py-0.5 rounded-full bg-primary/30 text-base font-medium text-white backdrop-blur-md', 'flex justify-center pointer-events-auto visible gap-x-2 border px-2.5 py-0.5 rounded-full bg-primary/30 text-base font-medium text-white backdrop-blur-md',
className className

View file

@ -5,6 +5,10 @@ import { createElement } from 'react'
import DanmakuMessage from '@/app/content/components/DanmakuMessage' import DanmakuMessage from '@/app/content/components/DanmakuMessage'
import { createRoot } from 'react-dom/client' import { createRoot } from 'react-dom/client'
import { create, Manager } from 'danmu' import { create, Manager } from 'danmu'
import { LocalStorageImpl } from './Storage'
import { AppStatus } from '../AppStatus'
import { APP_STATUS_STORAGE_KEY } from '@/constants/config'
import { EVENT } from '@/constants/event'
export class Danmaku { export class Danmaku {
private container?: Element private container?: Element
@ -18,6 +22,11 @@ export class Danmaku {
createRoot(manager.node).render( createRoot(manager.node).render(
createElement(DanmakuMessage, { createElement(DanmakuMessage, {
data: manager.data, data: manager.data,
onClick: async () => {
const appStatus = await LocalStorageImpl.value.get<AppStatus>(APP_STATUS_STORAGE_KEY)
LocalStorageImpl.value.set<AppStatus>(APP_STATUS_STORAGE_KEY, { ...appStatus!, open: true, unread: 0 })
dispatchEvent(new CustomEvent(EVENT.APP_OPEN))
},
onMouseEnter: () => manager.pause(), onMouseEnter: () => manager.pause(),
onMouseLeave: () => manager.resume() onMouseLeave: () => manager.resume()
}) })