UNPKG

@nethesis/phone-island

Version:
3 lines (2 loc) 6.61 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../Button.js");require("../../node_modules/react-redux/es/index.js");var a=require("../../node_modules/@fortawesome/react-fontawesome/index.es.js"),l=require("../../node_modules/@fortawesome/free-solid-svg-icons/index.mjs.js"),i=require("../../node_modules/i18next/dist/esm/i18next.js"),r=require("../../utils/customHooks/useIsomorphicLayoutEffect.js"),o=require("../../utils/genericFunctions/stringUtils.js"),n=require("../../utils/streaming/streamingUtils.js"),u=require("../Hangup.js"),s=require("../../lib/phone/call.js"),c=require("../CallView/Avatar.js"),d=require("../CallView/Timer.js"),m=require("../../lib/user/default_device.js"),p=require("../AudioBars.js"),f=require("../CustomThemedTooltip.js"),g=require("../../node_modules/react-redux/es/hooks/useDispatch.js"),h=require("../../node_modules/react-redux/es/hooks/useSelector.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var E=x(e),v=function(){var x=g.useDispatch(),v=h.useSelector((function(e){return e.currentCall})),b=v.muted,j=v.startTime,T=v.paused,w=v.streamingSourceNumber,k=h.useSelector((function(e){return e.island})),C=k.isOpen,N=k.isExtraLarge,S=h.useSelector((function(e){return e.webrtc})).remoteAudioStream,q=h.useSelector((function(e){return e.streaming})),y=q.videoSources,F=q.sourceImages,_=E.default.useMemo((function(){if(!w||!y)return{image:null,canUnlock:!1,tooltipText:""};var e=Object.values(y).find((function(e){return e.extension===w}));if(!e)return{image:null,canUnlock:!1,tooltipText:""};var t=F[e.id]||e.image||null,a=Boolean(e.cmdOpen&&""!==e.cmdOpen.trim());return{image:t,canUnlock:a,tooltipText:a?"".concat(i.t("VideoStreaming.Open"),": ").concat(e.description):""}}),[w,y,F,i.t]),A=e.useState(!1),B=A[0],L=A[1],O=e.useRef(null),V=e.useRef(null),z=e.useRef(null),I=e.useRef(null),R=e.useRef(null),U=e.useRef(null);r.useIsomorphicLayoutEffect((function(){x.player.updatePlayer({localScreen:V,remoteScreen:z,localVideo:I,largeRemoteVideo:R,smallRemoteVideo:U})}),[]);var D=function(){L(!!document.fullscreenElement)};e.useEffect((function(){return addEventListener("fullscreenchange",D),function(){removeEventListener("fullscreenchange",D)}}),[]);var M=E.default.useCallback((function(){if(w&&y){var e=Object.values(y).find((function(e){return e.extension===w}));if(e&&e.image){var t=e.description?"".concat(o.capitalizeFirstLetter(e.description).replace(/\s+/g,"_"),"_").concat(o.getISODateForFilename(),"_screenshot.jpg"):"screenshot_".concat(o.getISODateForFilename(),".jpg"),a=document.createElement("a");a.href=e.image,a.download=t,document.body.appendChild(a),a.click(),document.body.removeChild(a)}}}),[w,y]);return E.default.createElement(E.default.Fragment,null,C?E.default.createElement("div",{ref:O,className:B?"pi-h-screen pi-w-full":N?"pi-h-[748px] pi-w-[936px]":"pi-h-[480px] pi-w-[600px]"},E.default.createElement("div",{className:"".concat(B?"pi-h-[500px]":N?"pi-h-[648px]":"pi-h-[380px]"," pi-flex pi-relative pi-justify-center pi-w-full pi-flex-col")},E.default.createElement("div",{className:"pi-relative pi-flex-1"},_.image?E.default.createElement("img",{src:_.image,alt:"Streaming source",className:"pi-rounded-tl-[20px] pi-rounded-tr-[20px] pi-rounded-bl-[20px] pi-rounded-br-[20px] pi-w-full pi-h-full pi-object-cover"}):E.default.createElement("div",{className:"pi-w-full pi-h-full pi-bg-gray-200 dark:pi-bg-gray-800 pi-flex pi-items-center pi-justify-center pi-rounded-tl-[20px] pi-rounded-tr-[20px] pi-rounded-bl-[20px] pi-rounded-br-[20px]"},E.default.createElement(a.FontAwesomeIcon,{icon:l.faVideoSlash,className:"pi-w-24 pi-h-24 pi-text-gray-400 dark:pi-text-gray-600"})),E.default.createElement("div",{className:"pi-absolute pi-bottom-0 pi-left-0 pi-right-0 pi-bg-black/30 pi-p-4 pi-rounded-b-3xl"},E.default.createElement("div",null,E.default.createElement("div",{className:"pi-flex pi-items-center pi-justify-center pi-gap-6"},E.default.createElement(t.Button,{variant:"default",onClick:b?s.unmuteCurrentCall:s.muteCurrentCall,"data-tooltip-id":"tooltip-mute-streaming","data-tooltip-content":b?i.t("Tooltip.Unmute"):i.t("Tooltip.Mute")},E.default.createElement(a.FontAwesomeIcon,{className:"pi-h-6 pi-w-6",icon:b?l.faMicrophoneSlash:l.faMicrophone})),E.default.createElement(t.Button,{variant:"default",onClick:M,"data-tooltip-id":"tooltip-screenshot-streaming","data-tooltip-content":i.t("VideoStreaming.Take a screenshot")||"Take a screenshot"},E.default.createElement(a.FontAwesomeIcon,{className:"pi-h-6 pi-w-6",icon:l.faCamera})),(null==_?void 0:_.canUnlock)&&E.default.createElement(t.Button,{variant:"default",onClick:n.handleStreamingUnlock,"data-tooltip-id":"tooltip-unlock-streaming","data-tooltip-content":null==_?void 0:_.tooltipText},E.default.createElement(a.FontAwesomeIcon,{className:"pi-h-6 pi-w-6",icon:l.faLockOpen})))))),E.default.createElement("div",{className:"pi-bg-surfaceBackground dark:pi-bg-surfaceBackgroundDark pi-pt-4 pi-rounded-bl-[20px] pi-rounded-br-[20px]"},E.default.createElement(u.default,{buttonsVariant:"default",showFullscreenButton:!0,isFullscreen:B,onToggleFullscreen:function(){document.fullscreenElement?document.exitFullscreen():O.current&&O.current.requestFullscreen()},isExtraLarge:N,onToggleExtraLarge:function(){return x.island.setExtraLarge(!N)}}))),E.default.createElement(f.CustomThemedTooltip,{className:"pi-z-20",id:"tooltip-mute-streaming",place:"bottom"}),E.default.createElement(f.CustomThemedTooltip,{className:"pi-z-20",id:"tooltip-screenshot-streaming",place:"bottom"}),E.default.createElement(f.CustomThemedTooltip,{className:"pi-z-20",id:"tooltip-unlock-streaming",place:"bottom"}),E.default.createElement(f.CustomThemedTooltip,{className:"pi-z-20",id:"tooltip-record-streaming",place:"bottom"}),E.default.createElement(f.CustomThemedTooltip,{className:"pi-z-20",id:"tooltip-pause-streaming",place:"bottom"}),E.default.createElement(f.CustomThemedTooltip,{className:"pi-z-20",id:"tooltip-screen-share-streaming",place:"bottom"}),E.default.createElement(f.CustomThemedTooltip,{className:"pi-z-20",id:"tooltip-toggle-fullscreen",place:"bottom"})):E.default.createElement(E.default.Fragment,null,E.default.createElement("div",{className:"pi-flex pi-justify-between pi-items-center"},E.default.createElement(c.default,null),E.default.createElement(d.default,{startTime:j,isNotAlwaysWhite:!0}),!C&&S&&!m.isPhysical()&&E.default.createElement(p.AudioBars,{audioStream:S,paused:T,size:C?"large":"small"}))))};exports.StreamingAnswerView=v,exports.default=v; //# sourceMappingURL=index.js.map