Construtor Audio e métodos comuns

• Definição: O construtor Audio, como outros construtores, é uma função especial chamada com a palavra-chave new. Ele retorna um HTMLAudioElement, que você pode usar para reproduzir áudio para o usuário ou anexar ao DOM para que o usuário controle por conta própria. Quando você chama o construtor, pode opcionalmente passar uma URL como o (único) argumento. Essa URL deve apontar para a fonte do arquivo de áudio que você deseja reproduzir. Ou, se precisar alterar a fonte dinamicamente, você pode atribuir a URL à propriedade src do elemento de áudio retornado.
• Método play(): Este método é usado com os elementos audio ou video para iniciar a reprodução da mídia.

<audio id="audio" controls>
  <source src="https://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
</audio>

<button id="playBtn">Play Audio</button>

<script>
  const audio = document.getElementById("audio");
  const playBtn = document.getElementById("playBtn");

  playBtn.addEventListener("click", () => {
    audio.play();
  });
</script>

• Método pause(): Este método é usado com os elementos audio ou video para pausar a reprodução da mídia. Ele mantém a posição atual, então se play() for chamado, a reprodução começa dessa posição.

<audio id="myAudio" controls>
  <source src="https://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
</audio>

<br>

<button id="pauseBtn">Pause Audio</button>

<script>
  document.addEventListener("DOMContentLoaded", () => {
    const audio = document.getElementById("myAudio");
    const pauseBtn = document.getElementById("pauseBtn");

    pauseBtn.addEventListener("click", () => {
      audio.pause();
    });
  });
</script>

• Método addTextTrack(): Este método permite especificar uma faixa de texto para associar ao elemento de mídia — o que é especialmente útil para adicionar legendas a um vídeo.
• Método fastSeek(): Este método permite mover a posição de reprodução para um tempo específico dentro da mídia.

O construtor Audio() tem propriedades assim como métodos. Essas propriedades incluem:

• currentTime: para obter o tempo atual de reprodução de um áudio
• loop: para fazer o áudio tocar continuamente reiniciando automaticamente quando chega ao fim
• muted: para silenciar a saída de áudio de um elemento de mídia independentemente da configuração de volume

Diferentes formatos de áudio e vídeo

• Tipo MIME: Um tipo MIME, que significa Multipurpose Internet Mail Extensions, é uma forma padronizada de indicar programaticamente um tipo de arquivo. O tipo MIME pode informar a uma aplicação, como seu navegador, como lidar com um arquivo específico. No caso de áudio e vídeo, o tipo MIME indica que é um formato multimídia que pode ser incorporado na página web.
• Elemento source: É usado para especificar um tipo de arquivo e fonte — e pode incluir múltiplos tipos diferentes usando vários elementos source. Quando você faz isso, o navegador determina o melhor formato para usar no ambiente atual do usuário.
• MP3: É um tipo de formato digital usado para armazenar música, áudio ou som. É uma versão comprimida de uma gravação sonora que torna o tamanho do arquivo menor, facilitando o armazenamento e compartilhamento. MP3 tem o suporte mais amplo entre navegadores e o tipo MIME audio/mpeg.
• MP4: Um MP4 é um tipo de formato digital usado para armazenar vídeo e áudio. Ele serve como um container que contém tanto o vídeo (imagens) quanto o som (música ou fala) em um único arquivo. Um MP4 pode ter o tipo MIME audio/mp4 OU video/mp4, dependendo se é um arquivo de vídeo ou apenas áudio.
• Outros formatos são WMV, associado ao app Windows Media Player, OGG, MKV, AVI e mais.

codecs

• Definição: Um codec, abreviação de "encoder/decoder", é um algoritmo ou software que pode converter áudio e vídeo entre formatos analógicos e digitais. Codecs podem ser especificados como parte do tipo MIME. A sintaxe básica para definir um codec é adicionar um ponto e vírgula após o tipo de mídia, depois codecs= e o codec.

API HTMLMediaElement

• Definição: A API HTMLMediaElement é usada para controlar o comportamento dos elementos de áudio e vídeo na sua página. Ela estende a interface base HTMLElement, então você tem acesso às propriedades e métodos básicos, assim como a eventos úteis como waiting, ended, canplay, canplaythrough e mais. Exemplos de métodos incluem play(), fastSeek(), pause() e canPlayType() para verificar se um navegador provavelmente consegue reproduzir um arquivo de áudio.

API Media Capture and Streams

• Definição: A Media Capture and Streams API, ou a MediaStream API, é usada para capturar áudio e vídeo do seu dispositivo. Para usar a API, você precisa criar o objeto MediaStream. Você poderia fazer isso com o construtor, mas ele não estaria ligado ao hardware do usuário. Em vez disso, a propriedade mediaDevices do objeto global navigator tem um método getUserMedia() para você usar.

window.navigator.mediaDevices.getUserMedia({
  audio: true,
  video: {
    width: {
      min: 1280,
      ideal: 1920,
      max: 3840
    },
    height: {
      min: 720,
      ideal: 1080,
      max: 2160
    }
  }
});

API de captura de tela

• Definição: A Screen Capture API é usada para gravar a tela do usuário. Esta API é acessada chamando o método getDisplayMedia() do objeto mediaDevices e consumindo o fluxo de mídia retornado.

API de gravação MediaStream

• Definição: A MediaStream Recording API funciona em conjunto com as MediaStreams APIs, permitindo que você grave um MediaStream (ou até mesmo um HTMLMediaElement diretamente).

API de Media Source Extensions

• tópico: A API Media Source Extensions é o que permite que você passe diretamente o feed da webcam de um usuário para um elemento de vídeo com a propriedade srcObject.

Web Audio API

• Definição: A Web Audio API que alimenta tudo que é audível na web. Esta API inclui objetos importantes como um AudioBuffer (que representa um Buffer contendo especificamente dados de áudio) e o AudioContext, usado para representar um grafo de processamento de áudio.