Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HOW CAN WE ADD SCREEN SHARING OPTION ?? #7

Open
PRANEETH-REDDY-23899 opened this issue Aug 14, 2020 · 13 comments
Open

HOW CAN WE ADD SCREEN SHARING OPTION ?? #7

PRANEETH-REDDY-23899 opened this issue Aug 14, 2020 · 13 comments

Comments

@PRANEETH-REDDY-23899
Copy link

can you please let me knew how can i add a screen sharing option to it

@idsus
Copy link

idsus commented Sep 2, 2020

I need same help I will support this question so people see it.

@Pratik-Hub
Copy link

Pratik-Hub commented Sep 7, 2020

Guys I am creating my own Video Chat App but not using this I have used react and etc... If you want to include share screen in this wonder project of Zoom-Clone then You may use my API and do it!. I will release it in few weeks!!!!

Is That Cool!!! 😎😎😎

@micaiah-effiong
Copy link

Also have it in mind the mobile browsers don't support screen sharing

@Pratik-Hub
Copy link

Also have it in mind the mobile browsers don't support screen sharing

It does works Man

Maybe I am wrong. If yes please forgive me. I am testing my API and it's working correctly in all devices including screenshare in mobile

@ChandanRabha
Copy link

ChandanRabha commented Sep 20, 2020

Yes please i have been trying to find sources where screen sharing is possible. I even tried changing the mediastream of my webcam video stream to screen share video stream but it then the screen on peer side just freezes as soon as i changed the video stream. Would really be big help if someone finds a way. Thank You

@pankajjossy1
Copy link

Guys I am creating my own Video Chat App but not using this I have used react and etc... If you want to include share screen in this wonder project of Zoom-Clone then You may use my API and do it!. I will release it in few weeks!!!!

Is That Cool!!! 😎😎😎

how pls tell how can i add screen share

@ChitrangSharma
Copy link

For all of you guys, who want to integrate Screen-Sharing option in the project .
you can get what you want to build here in this channel link below..
https://youtu.be/X8QHHB7DA90
I hope it will help you

@ChitrangSharma
Copy link

Guys I am creating my own Video Chat App but not using this I have used react and etc... If you want to include share screen in this wonder project of Zoom-Clone then You may use my API and do it!. I will release it in few weeks!!!!
Is That Cool!!! 😎😎😎

how pls tell how can i add screen share

well if you want to make it, super quick I have given a link there , okay let me paste the link here as well https://youtu.be/X8QHHB7DA90
in this video you will get how to make screen sharing possible in this application .Thanks.

@Boopalan-M
Copy link

can you please let me knew how can i add a screen sharing option to it

i also having that question.Are u acheived that one

@ttejas123
Copy link

I added screenShare via replacing video stream with screen share.
and user who started screen share == can't see screen share
other user connected == can see screen share;
for that I use this code down below

`//IN HTML
//add button
//IN JS FILE
//screenShare
const screenshare = () =>{
navigator.mediaDevices.getDisplayMedia({
video:{
cursor:'always'
},
audio:{
echoCancellation:true,
noiseSupprission:true
}

}).then(stream =>{
let videoTrack = stream.getVideoTracks()[0];
videoTrack.onended = function(){
stopScreenShare();
}
for (let x=0;x<currentPeer.length;x++){

   let sender = currentPeer[x].getSenders().find(function(s){  //replace video track 
      return s.track.kind == videoTrack.kind;
    })
    
    sender.replaceTrack(videoTrack);

}
})

}

function stopScreenShare(){
let videoTrack = myVideoStream.getVideoTracks()[0];
for (let x=0;x<currentPeer.length;x++){
let sender = currentPeer[x].getSenders().find(function(s){
return s.track.kind == videoTrack.kind;
})
sender.replaceTrack(videoTrack);
}
}`

@Boopalan-M
Copy link

I added screenShare via replacing video stream with screen share.
and user who started screen share == can't see screen share
other user connected == can see screen share;
for that I use this code down below

`//IN HTML
//add button
//IN JS FILE
//screenShare
const screenshare = () =>{
navigator.mediaDevices.getDisplayMedia({
video:{
cursor:'always'
},
audio:{
echoCancellation:true,
noiseSupprission:true
}

}).then(stream =>{
let videoTrack = stream.getVideoTracks()[0];
videoTrack.onended = function(){
stopScreenShare();
}
for (let x=0;x<currentPeer.length;x++){

   let sender = currentPeer[x].getSenders().find(function(s){  //replace video track 
      return s.track.kind == videoTrack.kind;
    })
    
    sender.replaceTrack(videoTrack);

}
})

}

function stopScreenShare(){
let videoTrack = myVideoStream.getVideoTracks()[0];
for (let x=0;x<currentPeer.length;x++){
let sender = currentPeer[x].getSenders().find(function(s){
return s.track.kind == videoTrack.kind;
})
sender.replaceTrack(videoTrack);
}
}`

i use this code i didn't get any error. but the screen is not visible to others..

@idsus
Copy link

idsus commented Nov 7, 2020

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

10 participants