1

Estoy creando mi pagina para descargar videos de YouTube. Ya el código tiene la forma de llamar una variable para que muestre el thumbnail del video en un DIV. El problema es cuando intento llamar la variable para que muestre el video en el iframe:

<iframe id="iframe" style="width: 560px; height: 315px"
        src="//www.youtube.com/embed/<?= htmlspecialchars($urlVideo) ?>"
        data-autoplay-src="//www.youtube.com/embed/<?= htmlspecialchars($urlVideo) ?>?autoplay=1"></iframe>

Aqui les dejo el codigo completo por si ustedes saben como encontrar la variable y llamarla al iframe. Aqui tambien les dejo la url de la página: https://abrahamjuarbe.us/jytdownload/

Aqui tambien les dejo el codigo fuente en GITHUB, que muy probablemente les pueda ayudar: https://github.com/ScarletsFiction/LittleYoutube-PHP

<head>
    <title>JYTDownload</title>
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
    <link rel="stylesheet" href="example/style.css">
    <script src="//code.jquery.com/jquery-3.1.1.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"></script>
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script> 
</head>
<body>  
<div class="masthead clearfix">
  <div class="inner">
    <h3 class="masthead-brand">JYTDownload</h3>
    <script type="text/javascript">function hideNext(){$('#nextButton').css('display', 'none');}</script>
    <nav class="nav nav-masthead">
      <a onclick="hideNext()" class="nav-link active" href="#collapseVideo" data-toggle="tab">Video</a>
      <a onclick="hideNext()" class="nav-link" href="#collapseChannel" data-toggle="tab">Canal</a>
      <a onclick="hideNext()" class="nav-link" href="#collapsePlaylist" data-toggle="tab">Playlist</a>
      <a onclick="hideNext()" class="nav-link" href="#collapseSearch" data-toggle="tab">Buscar</a>
    </nav>
  </div>
</div>

<div class="site-wrapper">
  <div class="site-wrapper-inner">
    <div class="cover-container">

      <div class="inner cover">
        <div id='content' class="tab-content">
            <div class="tab-pane fade active show" aria-expanded="true" id="collapseVideo">
                <div class="form-group">
                  <label>URL del Video:</label>
                  <input type="text" class="form-control text-half" id="urlVideo">
                  <small id="urlVideoText" class="form-text text-muted"></small>
                </div>
                <p class="lead">
                  <p id="videoError"></p>
                  <a onclick="videoButton()" class="btn btn-lg btn-secondary">DESCARGAR</a>
                </p>

                <div id="videoDetail" style="display: none">
                    <h2 id="title"></h2>
                    <p id="info"></p>
                    <p id="like"></p>
                    <img id="picture" src="" alt="" height="340px"/><br><br>
                </div>

                <div id="encoded" style="display: none">
                    <label>Codificado (Audio+Video):</label>
                    <div class="button-group">
                    </div><br>
                </div>
                <div id="adaptive" style="display: none">
                    <label>Adaptado (Solo Audio o Video):</label>
                    <div class="button-group">
                    </div><br>
                    <a id="mediaCombiner" onclick="initMediaCombiner()" type="button" class="btn btn-secondary">Medios Combinados</a>
                </div><br><br>
                <div id="subtitle" style="display: none">
                    <label>Subtítulos:</label>
                    <div class="button-group">
                    </div>
                </div>
            </div>
            <div class="tab-pane fade" id="collapseChannel">
                <div class="form-group">
                  <label>URL del Canal:</label>
                  <input type="text" class="form-control text-half" id="urlChannel">
                  <small id="urlChannelText" class="form-text text-muted"></small>
                </div>
                <p class="lead">
                  <p id="channelError"></p>
                  <a onclick="channelButton()" class="btn btn-lg btn-secondary">DESCARGAR</a>
                </p>
                <div id="channelGroupList" style="width: 760px;margin: 0 auto;" class="list-group">
                </div>
            </div>
            <div class="tab-pane fade" id="collapsePlaylist">
                <div class="form-group">
                  <label>URL del Lista de Reproducción:</label>
                  <input type="text" class="form-control text-half" id="urlPlaylist">
                  <small id="urlPlaylistText" class="form-text text-muted"></small>
                </div>
                <p class="lead">
                  <p id="playlistError"></p>
                  <a onclick="playlistButton()" class="btn btn-lg btn-secondary">DESCARGAR</a>
                </p>
                <div id="playlistGroupList" style="width: 760px;margin: 0 auto;" class="list-group">
                </div>
            </div>
            <div class="tab-pane fade" id="collapseSearch">
                <div class="form-group">
                  <label>Buscar en YouTube:</label>
                  <input type="text" class="form-control text-half" id="urlSearch">
                  <small id="urlSearchText" class="form-text text-muted"></small>
                </div>
                <p class="lead">
                  <p id="searchError"></p>
                  <a onclick="searchButton()" class="btn btn-lg btn-secondary">BUSCAR</a>
                </p>
                <div id="searchGroupList" style="width: 760px;margin: 0 auto;" class="list-group">
                </div>
            </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="mastfoot">
  <button id="nextButton" onclick="searchButton(true)" style="margin-top: 20px;display: none;">PRÓXIMO</button>
  <div class="inner">
    <p>¿Alguna vez has soñado con poner tu propio canal en tu propio sitio web?<br><a href="https://github.com/ScarletsFiction/LittleYoutube-PHP" target="_blank">LittleYoutube</a> está aquí para ayudarte</p>
  </div>
</div>
<script src="example/script.js"></script>

1 respuesta 1

1

Es el front-end (JavaScript) el que se encarga de actualizar el contenido de la página. No puedes llamar a una variable inexistente en PHP y que se muestre.

Es en el script donde tienes que actualizar la URL del iframe, a la hora de pulsar el botón de enviar y recibir la respuesta de base.php.

De hecho, ya que estás, en el script podrías hacer el iframe invisible para que no se vea vacío previo a enviar la URL.

3
  • 1
    La variable ya existe, esta en otra carpeta que puedes ver aqui: github.com/ScarletsFiction/LittleYoutube-PHP/blob/master/src/… Commented el 28 sept. 2019 a las 4:57
  • 1
    Y ahí es donde no se donde está la variable que se vincula a la URL del video, o como llamarla desde la carpeta SRC a la carpeta principal. Por cierto, como oculto el iframe antes de enviar la URL? Commented el 28 sept. 2019 a las 5:01
  • @AbrahamJuarbeToledo esa variable no se define hasta que no envías la URL, por ende cuando abres la web no existe. Cuando envías la URL no cambia de web, carga datos por ajax, por ende no hay forma de usar esa variable previo enviar URL como intentas. Todo tiene que ser con JavaScript, si es lo que buscas deberías indagar, o hacer una pregunta concreta sobre eso
    – maduranma
    Commented el 28 sept. 2019 a las 15:40

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.