kamal pandey

Joined

280 Experience
1 Lesson Completed
0 Questions Solved

Activity

Posted in Multiuser Live Video Chat in Rails Discussion

I am trying to implement group video functionality and I have following code

class App extends Component {
  this.state = {
     subscribers: [],
     subscriberVideos: [],
     screenVideo: undefined,
     publisherVideo: undefined,
     publisher: undefined,
  }
}
async start() {
  let publisher = OT.initPublisher(null, this.defaultPublisherProps, error => {
    if(error) {
    }  
  })
 publisher.on('videoElementCreated', this.onPublisherVideoElement);
 this.state.otSession.publish(publisher, error => {
    if (error) {
   }
   this.setState(() => {
     return { publisher: publisher };
   }
  }
}

onPublisherVideoElement = event {
  this.setState(() => {
   return { publisherVideo: event.element }
   });
  }
}
onPublisherScreenElement = event => {
  this.setState(() => {
    return { screenVideo: event.element }
 }
}
onSubscriberVideoElement = event => {
   this.setState(() => {
      return { 
        subscriberVideos: [...this.state.subscriberVideos, event.element]
      }
     }
   })
}
onSessionStreamCreated = event => {
  let subscriber = this.state.otSession.subscriber(event.stream, null, this.defaultSubscriberProps, error => {
     if (error) {
     }
    if (event.stream.videoType == 'screen') {
      subscriber.on('videoElementCreated', this.onPublisherScreenElement);
      this.setState(() => {
        return { screenSubscriber: subscriber };
      })
   } else {
     subscriber.on('videoElementCreated', this.onSubscriberVideoElement);
       if (this.props.mdm === "m") {
          this.setState((prevState) => {
             return {
               subscribers: [...this.state.subscribers, subscriber]
             }
          }
        }
     else {
       return { subscribers: [...this.state.subscribers, subscriber] }
     }
   }
  }
}

While showing subscribers I am doing

showSubscribers() {
    return this.state.subscribers.filter(subscriber => subscriber.stream !== null).map((subscriber, index) => {
       return(
          <VideoSubscriber
             key={index}
             otok={this.otok}
             subscriber={this.state.subscribers[index]
             subscriberVidoe={this.state.subscriberVideos[index]
            />
       )
    }
}

But at random times the video goes black and also while some of the subscriber refresh the page it goes blank creates multiple subscirber with null stream.
How can i resolve this?

Posted in Multiuser Live Video Chat in Rails Discussion

I am trying to implement group video functionality and I have following code

class App extends Component {
  this.state = {
     subscribers: [],
     subscriberVideos: [],
     screenVideo: undefined,
     publisherVideo: undefined,
     publisher: undefined,
  }
}
async start() {
  let publisher = OT.initPublisher(null, this.defaultPublisherProps, error => {
    if(error) {
    }  
  })
 publisher.on('videoElementCreated', this.onPublisherVideoElement);
 this.state.otSession.publish(publisher, error => {
    if (error) {
   }
   this.setState(() => {
     return { publisher: publisher };
   }
  }
}

onPublisherVideoElement = event {
  this.setState(() => {
   return { publisherVideo: event.element }
   });
  }
}
onPublisherScreenElement = event => {
  this.setState(() => {
    return { screenVideo: event.element }
 }
}
onSubscriberVideoElement = event => {
   this.setState(() => {
      return { 
        subscriberVideos: [...this.state.subscriberVideos, event.element]
      }
     }
   })
}
onSessionStreamCreated = event => {
  let subscriber = this.state.otSession.subscriber(event.stream, null, this.defaultSubscriberProps, error => {
     if (error) {
     }
    if (event.stream.videoType == 'screen') {
      subscriber.on('videoElementCreated', this.onPublisherScreenElement);
      this.setState(() => {
        return { screenSubscriber: subscriber };
      })
   } else {
     subscriber.on('videoElementCreated', this.onSubscriberVideoElement);
       if (this.props.mdm === "m") {
          this.setState((prevState) => {
             return {
               subscribers: [...this.state.subscribers, subscriber]
             }
          }
        }
     else {
       return { subscribers: [...this.state.subscribers, subscriber] }
     }
   }
  }
}

While showing subscribers I am doing

showSubscribers() {
    return this.state.subscribers.filter(subscriber => subscriber.stream !== null).map((subscriber, index) => {
       return(
          <VideoSubscriber
             key={index}
             otok={this.otok}
             subscriber={this.state.subscribers[index]
             subscriberVidoe={this.state.subscriberVideos[index]
            />
       )
    }
}

But at random times the video goes black and also while some of the subscriber refresh the page it goes blank creates multiple subscirber with null stream.
How can i resolve this?

Posted in Multiuser Live Video Chat in Rails Discussion

I am trying to implement group video functionality and I have following code

class App extends Component {
  this.state = {
     subscribers: [],
     subscriberVideos: [],
     screenVideo: undefined,
     publisherVideo: undefined,
     publisher: undefined,
  }
}
async start() {
  let publisher = OT.initPublisher(null, this.defaultPublisherProps, error => {
    if(error) {
    }  
  })
 publisher.on('videoElementCreated', this.onPublisherVideoElement);
 this.state.otSession.publish(publisher, error => {
    if (error) {
   }
   this.setState(() => {
     return { publisher: publisher };
   }
  }
}

onPublisherVideoElement = event {
  this.setState(() => {
   return { publisherVideo: event.element }
   });
  }
}
onPublisherScreenElement = event => {
  this.setState(() => {
    return { screenVideo: event.element }
 }
}
onSubscriberVideoElement = event => {
   this.setState(() => {
      return { 
        subscriberVideos: [...this.state.subscriberVideos, event.element]
      }
     }
   })
}
onSessionStreamCreated = event => {
  let subscriber = this.state.otSession.subscriber(event.stream, null, this.defaultSubscriberProps, error => {
     if (error) {
     }
    if (event.stream.videoType == 'screen') {
      subscriber.on('videoElementCreated', this.onPublisherScreenElement);
      this.setState(() => {
        return { screenSubscriber: subscriber };
      })
   } else {
     subscriber.on('videoElementCreated', this.onSubscriberVideoElement);
       if (this.props.mdm === "m") {
          this.setState((prevState) => {
             return {
               subscribers: [...this.state.subscribers, subscriber]
             }
          }
        }
     else {
       return { subscribers: [...this.state.subscribers, subscriber] }
     }
   }
  }
}

While showing subscribers I am doing

showSubscribers() {
    return this.state.subscribers.filter(subscriber => subscriber.stream !== null).map((subscriber, index) => {
       return(
          <VideoSubscriber
             key={index}
             otok={this.otok}
             subscriber={this.state.subscribers[index]
             subscriberVidoe={this.state.subscriberVideos[index]
            />
       )
    }
}

But at random times the video goes black and also while some of the subscriber refresh the page it goes blank creates multiple subscirber with null stream.
How can i resolve this?

Posted in Help Needed to implement Group Video in opentok

I am trying to implement group video functionality and I have following code

class App extends Component {
  this.state = {
     subscribers: [],
     subscriberVideos: [],
     screenVideo: undefined,
     publisherVideo: undefined,
     publisher: undefined,
  }
}
async start() {
  let publisher = OT.initPublisher(null, this.defaultPublisherProps, error => {
    if(error) {
    }  
  })
 publisher.on('videoElementCreated', this.onPublisherVideoElement);
 this.state.otSession.publish(publisher, error => {
    if (error) {
   }
   this.setState(() => {
     return { publisher: publisher };
   }
  }
}

onPublisherVideoElement = event {
  this.setState(() => {
   return { publisherVideo: event.element }
   });
  }
}
onPublisherScreenElement = event => {
  this.setState(() => {
    return { screenVideo: event.element }
 }
}
onSubscriberVideoElement = event => {
   this.setState(() => {
      return { 
        subscriberVideos: [...this.state.subscriberVideos, event.element]
      }
     }
   })
}
onSessionStreamCreated = event => {
  let subscriber = this.state.otSession.subscriber(event.stream, null, this.defaultSubscriberProps, error => {
     if (error) {
     }
    if (event.stream.videoType == 'screen') {
      subscriber.on('videoElementCreated', this.onPublisherScreenElement);
      this.setState(() => {
        return { screenSubscriber: subscriber };
      })
   } else {
     subscriber.on('videoElementCreated', this.onSubscriberVideoElement);
       if (this.props.mdm === "m") {
          this.setState((prevState) => {
             return {
               subscribers: [...this.state.subscribers, subscriber]
             }
          }
        }
     else {
       return { subscribers: [...this.state.subscribers, subscriber] }
     }
   }
  }
}

While showing subscribers I am doing

showSubscribers() {
    return this.state.subscribers.filter(subscriber => subscriber.stream !== null).map((subscriber, index) => {
       return(
          <VideoSubscriber
             key={index}
             otok={this.otok}
             subscriber={this.state.subscribers[index]
             subscriberVidoe={this.state.subscriberVideos[index]
            />
       )
    }
}

But at random times the video goes black and also while some of the subscriber refresh the page it goes blank creates multiple subscirber with null stream.
How can i resolve this?

Posted in Webpacker

Suppose I have vendor/assets/javascripts/a.js, vendor/assets/stylesheets/a.css, vendor/assets/images/a.png how can i import these in webpacker

Posted in Active Amdin real time notification

How can i implement real time notification in active admin? Like I have admin and super admin and when something is updated by super admin real time notification is to be seen by admin

logo Created with Sketch.

Ruby on Rails tutorials, guides, and screencasts for web developers learning Ruby, Rails, Javascript, Turbolinks, Stimulus.js, Vue.js, and more. Icons by Icons8

© 2020 GoRails, LLC. All rights reserved.