\r\n
\r\n );\r\n }\r\n}\r\n","//import classNames from 'classnames';\r\nimport React, { useCallback, useMemo, useState } from 'react';\r\nimport { createStore, createStyleSet } from 'botframework-webchat';\r\n\r\nimport WebChat from './WebChat';\r\n\r\nimport './NormalWebChat.css';\r\n\r\nconst NormalWebChat = ({ evntCB }) => {\r\n const store = useMemo(\r\n () =>\r\n createStore({}, ({ dispatch }) => next => action => {\r\n if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {\r\n //dispatch({\r\n // type: 'WEB_CHAT/SEND_EVENT',\r\n // payload: {\r\n // name: 'webchat/join',\r\n // value: {\r\n // language: window.navigator.language\r\n // }\r\n // }\r\n //});\r\n } else if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {\r\n if (action.payload.activity.from.role === 'bot') {\r\n console.log('Activity ', action.payload.activity);\r\n\r\n if (action.payload.activity.channelData && (action.payload.activity.channelData.Type === 'PlayVideo'\r\n || action.payload.activity.channelData.Type ==='HaveVoipCall')) {\r\n //const event = new Event('webchatincomingeventactivity');\r\n\r\n //event.data = action.payload.activity;\r\n //window.dispatchEvent(event);\r\n \r\n // evntCB(action.payload.activity.channelData.Type, action.payload.activity.channelData.Data);\r\n }\r\n }\r\n }\r\n\r\n return next(action);\r\n }),\r\n []\r\n );\r\n\r\n const styleSet = useMemo(\r\n () =>\r\n createStyleSet({\r\n backgroundColor: 'Transparent',\r\n rootHeight: '100%',\r\n rootWidth: '100%'\r\n }),\r\n []\r\n );\r\n\r\n const [token, setToken] = useState();\r\n const [conversationId, setConvId] = useState();\r\n const [streamUrl, setStreamUrl] = useState();\r\n\r\n const handleFetchToken = useCallback(async () => {\r\n if (!token) {\r\n //const res = await fetch('https://webchat-mockbot.azurewebsites.net/directline/token', { method: 'POST' });\r\n const res = await fetch('api/getUserDlToken', { method: 'POST' });\r\n //const res = await fetch('weatherforecast', { method: 'POST' });\r\n\r\n const { token, conversationId, streamUrl } = await res.json();\r\n\r\n if (streamUrl !== null) {\r\n setConvId(conversationId);\r\n setStreamUrl(streamUrl);\r\n\r\n //console.log(\"Setting conv/url; \", streamUrl);\r\n }\r\n\r\n // Set Token last as triggers rely on this\r\n setToken(token);\r\n }\r\n }, [setToken, token, setConvId, setStreamUrl]);\r\n\r\n\r\n return (\r\n \r\n
\r\n \r\n {isCall === true && }\r\n {isCall === false ?\r\n console.log('onReady')}\r\n onStart={() => console.log('onStart')}\r\n onBuffer={() => console.log('onBuffer')}\r\n onSeek={e => console.log('onSeek', e)}\r\n onEnded={() => console.log('onEnded')}\r\n onError={e => console.log('onError', e)}\r\n />\r\n :\r\n
\r\n \r\n console.log('Activity Event CB', a); }\r\n evntCB={ this.chatEvnt }\r\n />\r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nexport default NormalWebChat;\r\n","import React, { Component } from 'react';\r\n\r\nimport NormalWebChat from './NormalWebChat';\r\n\r\nexport class ChatApp extends Component {\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}","import classNames from 'classnames';\r\nimport React, { useCallback, useMemo, useState } from 'react';\r\nimport { createStore, createStyleSet } from 'botframework-webchat';\r\n\r\nimport WebChat from './WebChat';\r\n\r\nimport './fabric-icons-inline.css';\r\nimport './MinimizableWebChat.css';\r\n\r\nconst MinimizableWebChat = ({ evntCB }) => {\r\n const store = useMemo(\r\n () =>\r\n createStore({}, ({ dispatch }) => next => action => {\r\n if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {\r\n dispatch({\r\n type: 'WEB_CHAT/SEND_EVENT',\r\n payload: {\r\n name: 'webchat/join',\r\n value: {\r\n language: window.navigator.language\r\n }\r\n }\r\n });\r\n } else if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {\r\n if (action.payload.activity.from.role === 'bot') {\r\n setNewMessage(true);\r\n\r\n console.log('Activity ', action.payload.activity);\r\n\r\n if (action.payload.activity.channelData && (action.payload.activity.channelData.Type === 'PlayVideo'\r\n || action.payload.activity.channelData.Type === 'HaveVoipCall')) {\r\n //const event = new Event('webchatincomingeventactivity');\r\n\r\n //event.data = action.payload.activity;\r\n //window.dispatchEvent(event);\r\n\r\n evntCB(action.payload.activity.channelData.Type, action.payload.activity.channelData.Data);\r\n }\r\n }\r\n }\r\n\r\n return next(action);\r\n }),\r\n []\r\n );\r\n\r\n const styleSet = useMemo(\r\n () =>\r\n createStyleSet({\r\n backgroundColor: 'Transparent'\r\n }),\r\n []\r\n );\r\n\r\n const [loaded, setLoaded] = useState(false);\r\n const [minimized, setMinimized] = useState(true);\r\n const [newMessage, setNewMessage] = useState(false);\r\n const [side, setSide] = useState('right');\r\n const [token, setToken] = useState();\r\n\r\n const handleFetchToken = useCallback(async () => {\r\n if (!token) {\r\n //const res = await fetch('https://webchat-mockbot.azurewebsites.net/directline/token', { method: 'POST' });\r\n const res = await fetch('api/getDlToken', { method: 'POST' });\r\n const { token } = await res.json();\r\n\r\n setToken(token);\r\n }\r\n }, [setToken, token]);\r\n\r\n const handleMaximizeButtonClick = useCallback(async () => {\r\n setLoaded(true);\r\n setMinimized(false);\r\n setNewMessage(false);\r\n }, [setMinimized, setNewMessage]);\r\n\r\n const handleMinimizeButtonClick = useCallback(() => {\r\n setMinimized(true);\r\n setNewMessage(false);\r\n }, [setMinimized, setNewMessage]);\r\n\r\n const handleSwitchButtonClick = useCallback(() => {\r\n setSide(side === 'left' ? 'right' : 'left');\r\n }, [setSide, side]);\r\n\r\n // TODO: [P2] Currently, we cannot unmount Web Chat from DOM when it is minimized.\r\n // Today, if we unmount it, Web Chat will call disconnect on DirectLineJS object.\r\n // When minimized, we still want to maintain that connection while the UI is gone.\r\n // This is related to https://github.com/microsoft/BotFramework-WebChat/issues/2750.\r\n\r\n return (\r\n \r\n {minimized && (\r\n \r\n )}\r\n {loaded && (\r\n
\r\n );\r\n};\r\n\r\nexport default MinimizableWebChat;\r\n","import React, { Component } from 'react';\r\n\r\nimport ReactPlayer from 'react-player'\r\nimport MinimizableWebChat from './MinimizableWebChat';\r\nimport WebPageBackground from './WebPage.jpg';\r\nimport './MinimiseChatApp.css';\r\n\r\nexport class MinimiseChatApp extends Component {\r\n // static displayName = Home.name;\r\n state = {\r\n url: null,\r\n pip: false,\r\n playing: true,\r\n controls: false,\r\n light: false,\r\n volume: 0.8,\r\n muted: false,\r\n played: 0,\r\n loaded: 0,\r\n duration: 0,\r\n playbackRate: 1.0,\r\n loop: false,\r\n isCall: false\r\n }\r\n\r\n load = url => {\r\n this.setState({\r\n url,\r\n played: 0,\r\n loaded: 0,\r\n pip: false\r\n })\r\n }\r\n\r\n chatEvnt = (type, act) => {\r\n console.log('Activity Type', type);\r\n if (type === 'PlayVideo') {\r\n console.log('Activity Video Data', act);\r\n this.load(act.Video);\r\n }\r\n else {\r\n this.setState({ isCall: true });\r\n }\r\n }\r\n\r\n render() {\r\n const { url, playing, controls, light, volume, muted, loop, pip } = this.state\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n )}\r\n \r\n {/*
*/}\r\n console.log('onReady')}\r\n onStart={() => console.log('onStart')}\r\n onBuffer={() => console.log('onBuffer')}\r\n onSeek={e => console.log('onSeek', e)}\r\n onEnded={() => console.log('onEnded')}\r\n onError={e => console.log('onError', e)}\r\n />\r\n
\r\n );\r\n }\r\n}","import React, { useCallback, useEffect, useState } from 'react';\r\n\r\n/*\r\nimport {\r\n Invitation,\r\n Inviter,\r\n InviterOptions,\r\n Referral,\r\n Registerer,\r\n RegistererOptions,\r\n Session,\r\n SessionState,\r\n UserAgent,\r\n UserAgentOptions,\r\n InvitationAcceptOptions\r\n} from \"./sip.js\";\r\n*/\r\n\r\nconst SipShare = () => {\r\n/*\r\n useEffect(() => {\r\n const uri = UserAgent.makeURI(\"sip:websiptest2@twwebrtctest.northeurope.cloudapp.azure.com\");\r\n if (!uri) {\r\n throw new Error(\"Failed to create URI\");\r\n }\r\n\r\n const userAgentOptions = {\r\n uri,\r\n authorizationPassword: \"T3l3W4r3-22\",\r\n sessionDescriptionHandlerFactoryOptions: {\r\n peerConnectionConfiguration: {\r\n iceServers: [\r\n {\r\n urls: 'turn:twwebrtctest.northeurope.cloudapp.azure.com:3478',\r\n username: 'websip',\r\n credential: 'websip'\r\n }\r\n ]\r\n }\r\n }\r\n\r\n };\r\n const userAgent = new UserAgent(userAgentOptions);\r\n\r\n // Assumes you have a media element on the DOM\r\n const mediaElement = document.getElementById('mediaElement');\r\n\r\n const remoteStream = new MediaStream();\r\n function setupRemoteMedia(session) {\r\n session.sessionDescriptionHandler.peerConnection.getReceivers().forEach((receiver) => {\r\n if (receiver.track) {\r\n remoteStream.addTrack(receiver.track);\r\n }\r\n });\r\n mediaElement.srcObject = remoteStream;\r\n mediaElement.play();\r\n }\r\n\r\n function cleanupMedia() {\r\n mediaElement.srcObject = null;\r\n mediaElement.pause();\r\n }\r\n\r\n\r\n userAgent.delegate = {\r\n onInvite(invitation) {\r\n\r\n // An Invitation is a Session\r\n const incomingSession = invitation;\r\n\r\n // Setup incoming session delegate\r\n incomingSession.delegate = {\r\n // Handle incoming REFER request.\r\n onRefer(referral) {\r\n // ...\r\n }\r\n };\r\n\r\n // Handle incoming session state changes.\r\n incomingSession.stateChange.addListener((newState) => {\r\n switch (newState) {\r\n case SessionState.Establishing:\r\n // Session is establishing.\r\n console.log(\"Establishing\");\r\n break;\r\n case SessionState.Established:\r\n // Session has been established.\r\n console.log(\"Established\");\r\n setupRemoteMedia(incomingSession);\r\n break;\r\n case SessionState.Terminated:\r\n // Session has terminated.\r\n console.log(\"Terminated\");\r\n cleanupMedia();\r\n break;\r\n default:\r\n break;\r\n }\r\n });\r\n\r\n // Handle incoming INVITE request.\r\n let constrainsDefault = {\r\n audio: true,\r\n video: false,\r\n }\r\n\r\n const options = {\r\n sessionDescriptionHandlerOptions: {\r\n constraints: constrainsDefault,\r\n },\r\n }\r\n\r\n incomingSession.accept(options)\r\n }\r\n };\r\n\r\n const registererOptions = { };\r\n const registerer = new Registerer(userAgent, registererOptions);\r\n\r\n userAgent.start().then(() => {\r\n\r\n // Register the user agent\r\n registerer.register();\r\n });\r\n\r\n }, []);\r\n*/\r\n return (\r\n \r\n\r\n
\r\n );\r\n};\r\n\r\nexport default SipShare;","import React, { Component } from 'react';\r\n\r\nimport SipShare from './SipShare';\r\n\r\nexport class ShareApp extends Component {\r\n render() {\r\n return (\r\n \r\n
\r\n );\r\n }\r\n}","import React, { Component } from 'react';\r\nimport { Route } from 'react-router';\r\nimport { Layout } from './components/Layout';\r\nimport { Home } from './components/Home';\r\nimport { ChatApp } from './components/ChatApp';\r\nimport { MinimiseChatApp } from './components/MinimiseChatApp';\r\nimport { ShareApp } from './components/ShareApp';\r\n\r\nimport './custom.css'\r\n\r\nexport default class App extends Component {\r\n static displayName = App.name;\r\n\r\n render () {\r\n return (\r\n