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.

Sign up for GitHub

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

Jump to bottom

Omar Okasha - Video Streaming #29

Open
mariamyoussefwiliam opened this issue Feb 28, 2022 · 8 comments
Open

Omar Okasha - Video Streaming #29

mariamyoussefwiliam opened this issue Feb 28, 2022 · 8 comments

Comments

@mariamyoussefwiliam
Copy link
Collaborator

https://google.github.io/shaka-packager/html/docker_instructions.html

https://google.github.io/shaka-packager/html/tutorials/dash.html

@omarokasha1 Check this Out
@mariamyoussefwiliam
Copy link
Collaborator Author 


<html>
  <head>
    <!-- Shaka Player compiled library: -->
    <script type="application/javascript" >
        console.log("TEST");console.log("TEST");console.log("TEST");
    </script>
    <script src="node_modules/shaka-player/dist/shaka-player.compiled.js"></script>
    <!-- Your application source: -->
    <script src="myapp.js"></script>
  </head>
  <body>
    <video id="video"
           width="640"
           
           controls autoplay></video>
           <button onclick="initPlayer('Videos/h264.mpd')" id="Video1">Video 1</button>
           
           <button onclick="initPlayer('Videos/1.mpd')" id="Video2">Video 2</button>
           
           <button onclick="initPlayer('Videos/2.mpd')" id="Video3">Video 3</button>
  </body>
</html>

@mariamyoussefwiliam
Copy link
Collaborator Author

mariamyoussefwiliam commented Feb 28, 2022 •
edited 

function initApp() {
  // Install built-in polyfills to patch browser incompatibilities.
  
  shaka.polyfill.installAll();
  console.log('111');

  // Check to see if the browser supports the basic APIs Shaka needs.
  if (shaka.Player.isBrowserSupported()) {
    // Everything looks good!
    console.log('11111');
    initPlayer("Videos/1.mpd");
  } else {
    console.log('11111111');
    // This browser does not have the minimum set of APIs we need.
    console.error('Browser not supported!');
  }
}

async function initPlayer(manifestUri) {
  console.log(manifestUri);
  // Create a Player instance.
  const video = document.getElementById('video');
  
 
  const player = new shaka.Player(video);
  console.log('2');
  // Attach player to the window to make it easy to access in the JS console.
  window.player = player;
    console.log('3');
  // Listen for error events.
  player.addEventListener('error', onErrorEvent);

  // Try to load a manifest.
  // This is an asynchronous process.
  console.log('Start');
  try {
    console.log('Omar');

    await player.load(manifestUri);
    // This runs if the asynchronous load is successful.

    console.log('The video has now been loaded!');
    console.log('The video has now been loaded!');
  } catch (e) {
    console.log('Hi');
    // onError is executed if the asynchronous load fails.
    onError(e);
  }
}

function onErrorEvent(event) {
  // Extract the shaka.util.Error object from the event.
  onError(event.detail);
}

function onError(error) {
  // Log the error.
  console.error('Error code', error.code, 'object', error);
}

document.addEventListener('DOMContentLoaded', initApp);

@mariamyoussefwiliam
Copy link
Collaborator Author

function initApp() {
// Install built-in polyfills to patch browser incompatibilities.

shaka.polyfill.installAll();
console.log('111');

// Check to see if the browser supports the basic APIs Shaka needs.
if (shaka.Player.isBrowserSupported()) {
// Everything looks good!
console.log('11111');
initPlayer("Videos/1.mpd");
} else {
console.log('11111111');
// This browser does not have the minimum set of APIs we need.
console.error('Browser not supported!');
}
}

async function initPlayer(manifestUri) {
console.log(manifestUri);
// Create a Player instance.
const video = document.getElementById('video');

if (video.requestFullscreen) {
video.requestFullscreen();
} else if (video.mozRequestFullScreen) {
video.mozRequestFullScreen();
} else if (video.webkitRequestFullscreen) {
video.webkitRequestFullscreen();
} else if (video.msRequestFullscreen) {
video.msRequestFullscreen();
}

const player = new shaka.Player(video);
console.log('2');
// Attach player to the window to make it easy to access in the JS console.
window.player = player;
console.log('3');
// Listen for error events.
player.addEventListener('error', onErrorEvent);

// Try to load a manifest.
// This is an asynchronous process.
console.log('Start');
try {
console.log('Omar');

await player.load(manifestUri);
// This runs if the asynchronous load is successful.

console.log('The video has now been loaded!');
console.log('The video has now been loaded!');

} catch (e) {
console.log('Hi');
// onError is executed if the asynchronous load fails.
onError(e);
}
}

function onErrorEvent(event) {
// Extract the shaka.util.Error object from the event.
onError(event.detail);
}

function onError(error) {
// Log the error.
console.error('Error code', error.code, 'object', error);
}

document.addEventListener('DOMContentLoaded', initApp);

@mariamyoussefwiliam
Copy link
Collaborator Author

packager in=1.mp4,stream=video,out=video1.mp4 \ in=1.mp4,stream=audio,out=audio1.mp4 --mpd_output 1.mpd

@mariamyoussefwiliam
Copy link
Collaborator Author

Screenshot from 2022-02-28 19-48-11

@mariamyoussefwiliam
Copy link
Collaborator Author

@youssefelgebaly how can we do this ? this is omar okasha from Github Mariam

@mariamyoussefwiliam
Copy link
Collaborator Author

mariamyoussefwiliam commented Feb 28, 2022 •
edited

Contributors

This project exists thanks to all the people who contribute. [Contribute].

@mariamyoussefwiliam
Copy link
Collaborator Author 

### Contributors

This project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].
<a href="https://github.com/serialport/node-serialport/graphs/contributors"><img src="https://opencollective.com/serialport/contributors.svg?width=890&button=false" /></a>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@mariamyoussefwiliam