{{ page_meta.name }}｜{{ group.public_title }}｜{{ site_settings.logo_alt }}

<button class="btn btn-raised btn-primary waves-effect waves-light" id="screensharing">SCREENSHARING</button>
    

  $("#screensharing").on("click", function (e) {
        e.preventDefault();
        console.log("screensharing")
        const params = serializeFormData();
        if (validator(params, fields)) {
        rtc.screensharing(params);
        }
      })
    

  screensharing(data){
        console.log("screensharing start");
    
        // create local stream
        const streamSpec = {
          streamID: this._params.uid,
          audio: false,
          video: false,
          screen: true,
          microphoneId: data.microphoneId,
          cameraId: data.cameraId
        }
    
        // Your firefox need use support mediaSource at least
        if (isFirefox()) {
          streamSpec.mediaSource = 'window';
        } else if (!isCompatibleChrome()) {
          // before chrome 72 need install chrome extensions
          // You can download screen share plugin here https://chrome.google.com/webstore/detail/agora-web-screensharing/minllpmhdgpndnkomcoccfekfegnlikg
          streamSpec.extensionId = 'minllpmhdgpndnkomcoccfekfegnlikg';
        }
    
        this._localStream = AgoraRTC.createStream(streamSpec);
    
        // set screen sharing video resolution
        if (data.screenShareResolution != 'default') {
          this._localStream.setScreenProfile(data.screenShareResolution);
          console.log("set screen profile", data.screenShareResolution);
        }
    
        // Occurs when sdk emit error 
        this._localStream.on("error", (evt) => {
          Toast.error("error", JSON.stringify([evt]))
        })
    
        // Occurs when a you stop screen sharing
        this._localStream.on("stopScreenSharing", (evt) => {
          this._localStream.stop();
          this._showProfile = false;
          Toast.notice("stop screen sharing")
        })
    
        // init local stream
        this._localStream.init(() => {
          console.log("init local stream success");
          // play stream with html element id "local_stream"
          this._localStream.play("local_stream", {fit: "cover"})
          // run callback
          resolve();
        }, (err) =>  {
          Toast.error("stream init failed, please open console see more detail")
          console.error("init local stream failed ", err);
          if (isFirefox()) {
            console.error('Failed to start screen sharing, maybe firefox not support mediaSource, please upgrade your firefox to latest version')
            return;
          }
          if (!isCompatibleChrome()) {
            console.error('Failed to start screen sharing, maybe chrome extension was not installed properly, you can get it from https://chrome.google.com/webstore/detail/minllpmhdgpndnkomcoccfekfegnlikg');
            return;
          }
        })
        console.log("screensharing success");
        return;
      }