AliceClass/pages/live.html

---
layout: default
permalink: /live.html
---

<script src="/assets/js/dash.all.min.js"></script>


<div class="player-container">
    <video
        class="player"
        data-dashjs-player
        autoplay
        controls
        muted 
    ></video>
    
    <div class="player-off">
        <h1>Offline</h1>
    </div>
</div>

<style>
    .player-container {
        position: relative;
        width: 100%;
        height: 100%;
    }

    .player {
        width: 100%;
        height: 100%;
        border-radius: 15px;
    }

    .player-off {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.6); /* Cor de fundo semitransparente */
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 15px;
        z-index: 10; /* Garante que a mensagem "Offline" apareça em cima do vídeo */
        
    }

    .player-info {
        border-radius: 15px;
        background-color: #0b1a33;
    }

    /* Estilos específicos para o player, se necessário */
    video::-webkit-media-controls {
        background-color: hsl(0, 0%, 14%);
    }

    video::-webkit-media-controls-play-button {
        color: #fff;
    }
</style>


<script>
    // Obter a string de query da URL
    const queryString = window.location.search;

      // Criar um objeto URLSearchParams com a string de query
      const urlParams = new URLSearchParams(queryString);

      // Obter o valor do parâmetro 'user'
      const user = urlParams.get('user');

      // Exemplo de como usar o valor
      console.log(user); // Isso vai exibir o valor do parâmetro 'user'
      const videoElement = document.querySelector('video');
      const playerOffElement = document.querySelector('.player-off');
      const url = `https://cast.alice.ufsj.edu.br/dash/${user}.mpd`;
      videoElement.src = url;

      

    fetch(url)
        .then(response => {
            if (response.ok) {
                console.log("Arquivo existe.");
                playerOffElement.style.display = "none";

                
            } else {
                console.log("Arquivo não encontrado.");
                // Coloque o código para ocultar o vídeo aqui
                videoElement.style.display = "none";
                
            }
        })
</script>