voxeet / voxeet-uxkit-react Goto Github PK
View Code? Open in Web Editor NEWHome Page: https://www.npmjs.com/package/@voxeet/react-components
License: MIT License
Home Page: https://www.npmjs.com/package/@voxeet/react-components
License: MIT License
Wanted a way to show a default thumbnail images/ loading image while presentation is not active.
Current behavior => 1) When no presentation is active the listener can see a black screen with a profile logo along with the name on the dolby ios screen as shown in above image
2) When we add new presentation file, first the dolby presentation stops showing the above black screen and then restarts with new slide.
Required behavior => can we show a default images/ a thumbnail images, which will be shown to listener when no presentation is active or in between changing of presentation.
Thank You
**Icons on DolbyIo UI are not loading **
1. All images for button have broken image
Steps to Reproduce the Problem
Specifications
On Windows machine
I have used this plugin to share the file presentation in our client project, recently client came up with a requirement where in we need to manange the slides we are presenting to the end user as below
From the above image add button will be used to ADD a presentaion in between 2 slides and Delete button will be used to delete a particular slide.
Hide Slide button will prevent/alllow the slide to be shown to the listerner.
Is this achivable using this plugin?
Thank you
Describe the bug
Getting this error while using voxeet web sdk.
Expected Behaviour
Should have launched the live conference.
Specifications
Describe the bug
console.log("Quality indicators:", indicators)
This piece of code gets invoked periodically and keeps on printing logs in the dev console, it should be removed.
https://github.com/voxeet/voxeet-uxkit-react/blob/master/src/app/actions/ConferenceActions.js#L1226
Describe the bug
In Firefox Private Window, the audio and video drop-downs are empty in the ConferencePreConfigContainer
.
They are not empty in the Settings tab.
Also, this does not happen in a regular Firefox window.
https://webrtc.github.io/samples/src/content/devices/input-output/ works fine in Firefox Private Window.
Expected Behaviour
Drop-downs list devices.
Steps to Reproduce the Problem
Minimalistic code (recommended)
This repo.
Specifications
Device: MacBook Pro
OS: MacOS 11.5.1
Platform: Firefox 91.0
Subsystem: Private Browser
Version:
Hardware:
Hi there! After starting the conference call, the enter (keycode 13) events are not propagated anymore, I assume the faulty code lies here:
Describe the bug
When leaving the conference when use leave - some activities are happening (state dump or others) and if during that team use leave again it will stack and join is not possible again. Only refresh works. Other problem is that even if you are outside conference web browser indicates that camera is in use and nothing can be done from there.
Expected Behaviour
If leave is initiated, other leave will return in progress or other state.
Steps to Reproduce the Problem
After conference use leave twice one after another. On showcase app after conference click leave twice.
Specifications
Describe the bug
The example listed here crashes when you click the Join Room button.
Expected Behaviour
[Describe the expected behaviour of the feature.]
Steps to Reproduce the Problem
Specifications
Hi,
This project use the GitHub action rlespinasse/github-slug-action on the master branch.
Due to changes into the branches management, the master
branch is not longer supported and will be removed in few months (EOL: 2020-10-25).
The current latest version is 2.0.0
from the v2.x branch.
- uses: rlespinasse/[email protected]
- uses: rlespinasse/[email protected]
If you want to avoid breaking changes, you can use the 1.1.0
version or the v1.1.x branch.
- uses: rlespinasse/[email protected]
- uses: rlespinasse/[email protected]
Describe the bug
In our application, we have our own text chat and we want to add audio/video call feature to it.
So did a simple POC with your react component and everything seems to work great.
Usually our chat will be loaded into our web app via an iframe, so i was trying the same with the POC i created.
But while loaded it via an iframe i am getting the following error.
core.js:6014 ERROR Error: Uncaught (in promise): TypeError: me is not a constructor
TypeError: me is not a constructor
Steps to Reproduce the Problem
Specifications
Describe the bug
The Readme instructs to use the following command to install this package via npm
:
npm i @voxeet/voxeet-web-sdk @voxeet/react-components @voxeet/[email protected] --save
The result is:
npm ERR! code ENOSELF
npm ERR! Refusing to install package with name "@voxeet/react-components" under a package
npm ERR! also called "@voxeet/react-components". Did you name your project the same
npm ERR! as the dependency you're installing?
Using yarn
works successfully, though there is this warning:
warning " > @voxeet/[email protected]" has incorrect peer dependency "@voxeet/[email protected]".
Expected Behaviour
Packages are correctly installed.
Steps to Reproduce the Problem
Specifications
Is it possible to provide a custom AttendeesSettings Component in order to control video source etc through the Voxeet SDK API? Or at least be able to use a custom component to interact with the Voxeet SDK
The app stack during joining. Error message:
Uncaught (in promise) ReferenceError: spatialAudio is not defined
Probably it is related to
spatialAudio
I see on the Dolby website (https://dolby.io/products/interactivity-apis) it is possible to create a live stream over RTMP + HLS. Does the ConferenceRoom component support this, and if so, is there any documentation on how to use it? All that I can see is boolean props for isWebinar
and autoHls
?
Thanks
Describe the bug
After approximately 25 minutes into a video call, the loading conference splash screen appears for the participants. While other participants can still see and hear the affected participant. The affected participant must rejoin the conference in order to see others again.
This happens for all the participants but not in the same time (it depends when they join in).
Expected Behaviour
The expected behaviour is that the loading screen doesn't interfere with the video call after it started.
Steps to Reproduce the Problem
Join a video conference and wait about 25 minutes
Specifications
Customer asked:
Is there any way to change the sounds's paths for joining / leaving / etc. the conference?
Right now those sounds use relative path to access the files, which does not work with our setup. Would it be possible to pass the sound files as props so that they can be served form our server?
Expected result:
The expected behavior/result
Customer should be able to set custom url for audio file (e.g. to serve from CDN)
Actual result:
The actual faulty behavior/state
Audio files' path used in UXKit can't be overridden in application build (e.g. in voxeet.io)
iOS Chrome does not load Demo
Error
(This Browser is currently not supported)
iOS version 16.1
Chrome Version latest
Build will open in Safari.
Created from dolbyio-samples#19
Describe the bug
This repo needs a licence for it to be used anywhere outside of a developer test environment.
Expected Behaviour
The repo has a licence.
Steps to Reproduce the Problem
Look at the repo
Describe the bug
When we hang up, there is an error in the console
ReferenceError: VoxeetSdk is not defined
Expected Behaviour
there should be no error and the session should close (I guess?)
Steps to Reproduce the Problem
open a conference and hang up
Minimalistic code (recommended)
Specifications
Additional Observations
The issue seems to come from this code in ConferenceActions.js
this._removeListeners().then(() => { if(VoxeetSdk.session && VoxeetSdk.session.participant) { VoxeetSDK.session.close().catch((err) => { // console.error(err); }); } });
it is both in handleConferenceLeft() and leave()
VoxeetSdk is undefined and should be spelled VoxeetSDK as js is case sensitive (developers should also run their code at least once I guess)
Hey There
Describe the bug
On going Dolby io conference disconnects after 3 hour.
Expected Behaviour
Conference should be connected until the Admin ends it.
Steps to Reproduce the Problem
Specifications
OS: Windows
Version: 3.5.1
Is this some kind of timeout?
Is this something default with dolby io?
If yes can we increase the time?
Thank You
Describe the bug
Conference settings audio output device selector doesn't show on Safari, even if you have more than one device (I have 3 on one comp, 1 on macbook, both same issue)
Expected Behaviour
Should see output device selector when pressing 'Settings' in default UX kit.
Steps to Reproduce the Problem
or use UX kit with basic component
Minimalistic code (recommended)
<ConferenceRoom
attendeesWaiting={AttendeesWaiting}
loadingScreen={LoadingScreen}
isWidget={false}
dolbyVoice={true}
autoJoin
videoRatio={videoRatio}
handleOnLeave={handleOnLeave}
handleOnConnect={() => {}}
constraints={constraints}
consumerKey={settings.consumerKey}
consumerSecret={settings.consumerSecret}
conferenceAlias={callId}
videoCodec={'H264'}
sdk={voxeet.instance}
displayModes={['tiles']}
userInfo={userInfo}
/>
Specifications
Describe the bug
when using uxkit, the default is set to worst. in 2.4+, the default is now "average". The best approach would be to pass in nothing, and let the sdk decide if the developer does not choose a mode.
Minimalistic code (recommended)
https://github.com/voxeet/voxeet-uxkit-react/blob/master/src/app/components/ConferenceRoom.js#L488
Describe the bug
Unable to read the readme due to overload of release notes that are duplicated in the release section of github.
Expected Behaviour
A nice clean readme to allow for a developer to get started faster.
Steps to Reproduce the Problem
Describe the bug
The documentation for customLocalizedStrings
is not correct on two counts.
...Use an array prefixed with the correct language key. (en, fr, it, ...)
[en: {
noPstnNumbers: "There is no PSTN numbers...",
electronloading: "Voxeet is loading, please wait",
...
doesn't work. I assume this should be an object e.g.
{en: {
noPstnNumbers: "There is no PSTN numbers...",
electronloading: "Voxeet is loading, please wait",
...
as this is the case in the code itself https://github.com/voxeet/voxeet-uxkit-react/blob/e19918aaccd2a1075e90b5b222d7e4064f1a1e36/src/app/languages/localizedStrings.js
I cloned the master project for customizing the UI & socket implementation for the chat function.
But when I end the conference, redirect to other customize page, and navigate to ConferenceRoom Again.
The timer showing 2 time, one is the time ended, another is the new one.
In /src/app/action/ConferenceActions.js.
static initialize(consumerKey, consumerSecret) {
return (dispatch) => {
return this._initializeListeners(dispatch)
.then(() => {
console.log('initialize:',VoxeetSDK.session.participant,'|',VoxeetSDK) < ----- added this log
VoxeetSDK.session.participant ||
VoxeetSDK.initialize(consumerKey, consumerSecret).catch((err) => {
this._throwErrorModal(err);
});
})
.then((userId) => {
dispatch(this._sdkInitializedSuccessful(userId));
})
.catch((err) => {
dispatch(ErrorActions.onError(err));
});
};
}
First time VoxeetSDK.session.participant is undifined,
Second time it show:
{ id: "f1b20cb0-1f8e-3170-8428-8405468ec9fc"
info: {name: "XXXXXX", externalId: "", avatarUrl: undefined, sdkVersion: "2.3.1"}
status: "Connected"
streams: []
_events: {}
_eventsCount: 0
_maxListeners: undefined
}
then i added a log to :
static leave() {
return (dispatch, getState) => {
const {
voxeet: { controls },
} = getState();
return VoxeetSDK.conference.leave().then(() => {
dispatch(TimerActions.stopTime());
dispatch(ConferenceActions._conferenceLeave());
dispatch(ConferenceActions._conferenceLeave(controls.disableSounds));
if (controls.closeSessionAtHangUp) {
this._removeListeners().then(() => {
console.log('VoxeetSDK.session.close') <-----------added this line, but no log in console
VoxeetSDK.session.close();
});
}
});
};
}
but it never fires the log, please note that controls.closeSessionAtHangUp == true
I have checked the session storage in chrome but doesn't exist.
Please advise how to clean the session.
Describe the bug
SDK prop ignored.
Expected Behaviour
The documentation says that an external instance of the VoxeetSDK can be passed as a prop, but from what I can tell it is never used or passed down to the action components that would use it.
Greeting the below error and Dolby io screen not loading
Package version on which error is occurring
"@voxeet/react-components": "^3.2.4",
"@voxeet/react-redux-5.1.1": "^5.1.1",
"@voxeet/voxeet-web-sdk": "^3.0.3"
Works fine when i downgraded to
"@voxeet/react-components": "^3.0.0",
"@voxeet/react-redux-5.1.1": "^5.1.1",
"@voxeet/voxeet-web-sdk": "^3.0.0",
Describe the bug
The logo prop described in the docs has been simply commented out in the LoadingScreen
component.
Expected Behaviour
To be able to pass my logo, I assume it was a string before?
Describe the bug
When using the ConferenceRoom component, when I am in either a room by myself or another participant, I notice the video preview for myself flickers (a single black flicker, roughly every 5 seconds) however videos of other participants do not seem to flicker. Is there settings or something I am missing, or any known issues?
My settings for the ConferenceRoom that are being passed as props are as follows -
{
consumerKey: process.env.DOLBY_VOXEET_KEY,
consumerSecret: process.env.DOLBY_VOXEET_SECRET,
constraints: {
audio: true,
video: true,
},
videoRatio: {
width: 1920,
height: 1080,
},
videoCodec: 'H264',
userInfo,
sdk: voxeet.instance,
};
}
Expected Behaviour
Video should not flicker
Steps to Reproduce the Problem
As above
Minimalistic code (recommended)
As above
Specifications
Describe the bug
npm install gives 404 error for media-engine node_module
Expected Behaviour
npm install succeeds without any error
Steps to Reproduce the Problem
npm WARN ERESOLVE overriding peer dependency
npm WARN Found: @voxeet/media-engine@undefined
npm WARN node_modules/@voxeet/media-engine
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer @voxeet/media-engine@"0.16.0" from @voxeet/[email protected]
npm WARN node_modules/@voxeet/voxeet-web-sdk
npm WARN peer @voxeet/voxeet-web-sdk@"2.3.0" from the root project
npm WARN 1 more (@voxeet/react-components)
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@voxeet%2fmedia-engine - Not found
npm ERR! 404
npm ERR! 404 '@voxeet/[email protected]' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\USER\AppData\Local\npm-cache_logs\2021-02-26T06_54_04_852Z-debug.log
Describe the bug
Installing @voxeet/react-components
renders warnings concerning @babel/polyfill
and it's dependencies.
$ yarn add @voxeet/voxeet-web-sdk @voxeet/react-components @voxeet/[email protected]
...
warning @voxeet/react-components > @babel/[email protected]: 🚨 This package has been deprecated in favor of separate inclusion of a polyfill and regenerator-runtime (when needed). See the @babel/polyfill docs (https://babeljs.io/docs/en/babel-polyfill) for more information.
warning @voxeet/react-components > @babel/polyfill > [email protected]: core-js@<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
...
The warnings recommend the path to go moving forward, with using other libs explicitly.
Hi
How to i customize the Hang-up button click event?
So basically i want to show a popup on click of end call button whether to end the call or not
if user click yes then leave the conference or else just close the message popup
If i try to customize the Action button still i wont get the Click handler
Any clue on how to go abt
Thank you
In the below image by default audio is set to true and video to be false, I am facing issue with the Dolby io file sharing If i set both to false since i want a conference without any audio and video.
Expected Behaviour
User having admin rights to share file and all the listener should able to connect to conference without audio and video and must be able to view the shared file
Steps to Reproduce the Problem
constraints: { audio: false, video: false, },
isAdmin:true
Specifications
Note
The problem
We want to change some texts on the UI. For this we specify the object for the customLocalizedStrings
with
the strings we want to display. The problem is that the component seems to ignore this, and still shows the defaults.
This is how we use it
The customization object we use:
const localizedStrings = {
en: {
noPstnNumbers: "There is no PSTN numbers...",
electronloading: "The conference is loading, please wait",
error: "Error",
// ... the rest of the strings
}
};
<ConferenceRoom
customLocalizedStrings={localizedStrings}
//.....
>
Expected Behaviour
The UI should show the "The conference is loading, please wait" message instead of the default "Voxeet is loading, please wait" before the conference is loaded.
Describe the bug
Since upgrading to the latest version v2.1.5, I am always prompted before entering the conference room to set up my audio and video devices. I tried to set the preConfig
prop to false, however that has no effect. I see a message in the console - "No audio device configured... forcing preConfig". I haven't changed anything on my side and never had an issue with an audio device not being configured on start up before.
Reverting to 2.1.2 I do not get the preConfig screen displayed
Expected Behaviour
No pre config should display when set to false
Steps to Reproduce the Problem
Minimalistic code (recommended)
[Please provide a link to a repository showing specifically the issue. It should only have the minimal footprint of your own implementation - something which does not requires any NDA.]
Specifications
Describe the bug
Using the conference component, when I start a video call with another browser, clicking on the screenshare button does nothing
Expected Behaviour
Screensharing should start
Steps to Reproduce the Problem
Minimalistic code (recommended)
const getSettings = () => {
const { user } = props;
let userInfo = {};
if (user) {
userInfo = {
...user,
};
}
return {
consumerKey: process.env.DOLBY_VOXEET_KEY,
consumerSecret: process.env.DOLBY_VOXEET_SECRET,
constraints: {
audio: true,
video: true,
},
videoRatio: {
width: 1920,
height: 1080,
},
videoCodec: 'H264',
userInfo,
sdk: voxeet.instance,
};
};
return (
<>
<GlobalStyles />
<ConferenceRoom
loadingScreen={Loading}
actionsButtons={ActionButtons}
attendeesChat={() => null}
isWidget={false}
autoJoin
kickOnHangUp
handleOnLeave={handleOnLeave}
handleOnConnect={handleOnConnect}
{...getSettings()}
conferenceAlias={callId}
/>
</>
);
Specifications
Hi there,
When i select a ppt file to share the using the share file button for file presentation, the converted file seems to be cropped
add the ppt file and the dolby io ui screen shot
ppt which i selected using share button
ImagesConvertedToPPT (10).pptx
Dolby io UI
any clue on what's going wrong?
Describe the bug
ConferenceRoom component does not clean up itself. When the component isn't rendered after any react component change or state transition, the connection to the VTC client is still intact, and other clients can still see / hear the previous session.
Expected Behaviour
When the component unmounts, at minimum I'd expect the session to close and the conference to be left.
Steps to Reproduce the Problem
Minimalistic code (recommended)
I've had to handle this myself... you can do this with useEffect
hooks as well, but I'd expect the ConferenceRoom
component to do this itself.
public async componentDidMount() {
const sdk = await import('@voxeet/voxeet-web-sdk')
this.setState({sdk: sdk.default})
}
public componentWillUnmount() {
this.state.sdk.conference.leave()
}
I tried to install this is in an existing project, but it does not seem to work with [email protected]?
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: [email protected] npm ERR! Found: [email protected] npm ERR! node_modules/react npm ERR! react@"^17.0.1" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@"^0.14.0 || ^15.0.0-0 || ^16.0.0-0" from @voxeet/[email protected] npm ERR! node_modules/@voxeet/react-redux-5.1.1 npm ERR! @voxeet/react-redux-5.1.1@"5.1.1" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.