Merge pull request #85 from duckietm/Dev

🆙 Cleanup old youtube link in chat, now broadcasting is working

src/api/utils/RoomChatFormatter.ts

@@ -1,4 +1,3 @@
-import { GetConfigurationValue } from '../nitro/GetConfigurationValue';
 import { LocalizeText } from './LocalizeText';
 
 const allowedColours: Map<string, string> = new Map();
@@ -47,16 +46,6 @@ export const RoomChatFormatter = (content: string) =>
     content = encodeHTML(content);
     //content = (joypixels.shortnameToUnicode(content) as string)
 
-    if(!GetConfigurationValue<boolean>('youtube.publish.disabled', false))
-    {
-        const labelShared = LocalizeText('widget.room.youtube.shared');
-        const labelOpen = LocalizeText('widget.room.youtube.open_video');
-        content = content.replace(
-            /(?:http:\/\/|https:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?.*v=|shorts\/)?([a-zA-Z0-9_-]{11})/g,
-            `<div style="margin:2px 0"><strong>&#x1F4FA; ${ labelShared }</strong></div><div><a href="https://youtu.be/$1" target="_blank" style="background-color:red;color:white;padding:3px 8px;border-radius:4px;text-decoration:none;font-size:12px">&#9654; ${ labelOpen }</a></div>`
-        );
-    }
-
     if(content.startsWith('@') && content.indexOf('@', 1) > -1)
     {
         let match = null;

src/components/MainView.tsx

@@ -31,7 +31,6 @@ import { UserProfileView } from './user-profile/UserProfileView';
 import { UserSettingsView } from './user-settings/UserSettingsView';
 import { WiredView } from './wired/WiredView';
 import { WiredCreatorToolsView } from './wired-tools/WiredCreatorToolsView';
-import { YoutubeTvView } from './youtube-tv/YoutubeTvView';
 
 export const MainView: FC<{}> = props =>
 {
@@ -124,7 +123,6 @@ export const MainView: FC<{}> = props =>
             <GameCenterView />
             <FloorplanEditorView />
             <FurniEditorView />
-            <YoutubeTvView />
             <ExternalPluginLoader />
         </>
     );

src/components/youtube-tv/YoutubeTvView.tsx

@@ -1,57 +0,0 @@
-import { AddLinkEventTracker, RemoveLinkEventTracker } from '@nitrots/nitro-renderer';
-import { FC, useEffect, useMemo, useState } from 'react';
-import { GetConfigurationValue } from '../../api';
-import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../common';
-
-export const YoutubeTvView: FC<{}> = props =>
-{
-    const [ videoId, setVideoId ] = useState<string>('');
-    const [ isVisible, setIsVisible ] = useState<boolean>(false);
-
-    const close = () => setIsVisible(false);
-
-    useEffect(() =>
-    {
-        const linkTracker: ILinkEventTracker = {
-            linkReceived: (url: string) =>
-            {
-                const parts = url.split('/');
-
-                if(parts.length < 3) return;
-
-                switch(parts[1])
-                {
-                    case 'show':
-                        setVideoId(parts[2]);
-                        setIsVisible(true);
-                        return;
-                }
-            },
-            eventUrlPrefix: 'youtube-tv/'
-        };
-
-        AddLinkEventTracker(linkTracker);
-
-        return () => RemoveLinkEventTracker(linkTracker);
-    }, []);
-
-    const originUrl = useMemo(() => GetConfigurationValue<string>('url.prefix', ''), []);
-
-    if(!isVisible) return null;
-
-    return (
-        <NitroCardView className="w-[560px] h-[345px]" uniqueKey="youtube-tv">
-            <NitroCardHeaderView headerText="YouTube TV" onCloseClick={ close } />
-            <NitroCardContentView grow gap={ 0 } overflow="hidden">
-                { (videoId.length > 0) &&
-                    <iframe
-                        className="w-full h-full border-0"
-                        allowFullScreen
-                        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-                        src={ `https://www.youtube.com/embed/${ videoId }?autoplay=1&mute=0&controls=1&origin=${ originUrl }&playsinline=1&showinfo=0&rel=0&iv_load_policy=3&modestbranding=1&disablekb=1&enablejsapi=1&widgetid=3` }
-                    />
-                }
-            </NitroCardContentView>
-        </NitroCardView>
-    );
-};

src/components/youtube-tv/index.ts

@@ -1 +0,0 @@
-export * from './YoutubeTvView';

src/hooks/useOnClickChat.ts

@@ -1,10 +1,7 @@
-import { CreateLinkEvent } from '@nitrots/nitro-renderer';
 import { useBetween } from 'use-between';
 import { LocalizeText } from '../api';
 import { useNotification } from './notification';
 
-const YOUTUBE_REGEX = /(?:http:\/\/|https:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?.*v=|shorts\/)?([a-zA-Z0-9_-]{11})/;
-
 const useOnClickChatState = () =>
 {
     const { showConfirm = null } = useNotification();
@@ -17,19 +14,11 @@ const useOnClickChatState = () =>
         event.preventDefault();
 
         const url = event.target.href;
-        const youtubeMatch = url.match(YOUTUBE_REGEX);
 
-        if(youtubeMatch)
+        showConfirm(LocalizeText('chat.confirm.openurl', [ 'url' ], [ url ]), () =>
         {
-            CreateLinkEvent('youtube-tv/show/' + youtubeMatch[1]);
+            window.open(url, '_blank');
-        }
+        }, null, null, null, LocalizeText('generic.alert.title'), null, 'link');
-        else
-        {
-            showConfirm(LocalizeText('chat.confirm.openurl', [ 'url' ], [ url ]), () =>
-            {
-                window.open(url, '_blank');
-            }, null, null, null, LocalizeText('generic.alert.title'), null, 'link');
-        }
     };
 
     return { onClickChat };