Upload de vídeo do YouTube

[IgorC 0]

Olá pessoal, preciso da ajuda de vocês para tirar uma dúvida...

A minha dúvida é, como eu posso fazer um sistema que no caso seria para fazer upload de um vídeo do youtube a partir da sua URL, seria parecido com o facebook, que quando você vai postar algo coloca a URL do vídeo lá e ele carrega automaticamente e então você posta, etc...

 

Só que seria mais simples, eu queria que houvesse um campo text no qual eu colocaria a URL do vídeo e um submit que executaria a função de carregar o vídeo, eu sei que é possível pois já vi em um site...

 

Se alguém puder me dizer como posso fazer eu agradeço, não tenho a mínima ideia de como é isso...

 

Muito obrigado, segue a imagem de exemplo:

 

 

Então, após colocar a URL do vídeo no campo de texto e clicar em enviar o vídeo ia carregar automaticamente dentro da textarea em forma de embed eu acho... Obrigado novamente.

[André Wielki 6]

Mescla o código HTML de abrir o video junto com a url do video quando a pessoa clicar em enviar.

 

Tipo:

Código html de inserir imagem: <img src="imagem.extencao"/>

Ao inserir a imagem voce poe para aparecer a imagem inserida, dentro da tag <img>, e vai aparecer.

 

A mesma logica é feita para videos e etc

[Playerbr 21]

Você quer fazer o upload de um arquivo do youtube para seu servidor? Se for isso, vai usar curl.

Agora se você quiser usar o link do youtube para apresentar na sua página e depois salvar, você vai usar javascript e não php.

[IgorC 0]

Então, é isso que eu preciso Playerbr, eu quero que, após colocar a url do vídeo, e clicar em Enviar ele apareça automaticamente, e que a pessoa possa reproduzi-lo etc, achei que era com php porque pensava que os valores digitados no campo de texto e mais alguma coisa, mas acredito que você conseguiu me entender, pode me ajudar?

 

Obrigado.

Gravei um vídeozinho e postei no YouTube para vocês verem o que eu quero...

 

https://www.youtube.com/watch?v=B35uf1onOEk

 

Muito obrigado :D.

[Playerbr 21]

você vai precisar adicionar um evento onclick no botão,

pegar os dados do input

filtrar os dados

incluir os dados no html

 

Isso já vai te dar um luz mas vai ter que montar filtro, etc.

html

<span id="campo_youtube"></span>
    <input type="text" id="input_youtube"/>
    <a onclick="return mostra_youtube()">testar</a>

js

function mostra_youtube(){

    var end_youtube=document.getElementById("input_youtube").value;
    document.getElementById('campo_youtube').innerHTML='<iframe width="560" height="315" src="//'+end_youtube+'" frameborder="0" allowfullscreen></iframe>'

    return false;
}

Como eu não montei o filtro você vai precisar testar com o link de embebed que youtube fornece

 

www.youtube.com/embed/B35uf1onOEk

[IgorC 0]

Não funcionou, ao colocar o link do embeded que o youtube fornece e clicar em testar ele fica meio que "carregando" pois a página fica atualizando, demora e aí então aparece isso:

 

[diogoand1 7]

Vc pode fazer isso com Zend_Gdata_YouTube, o único "problema" é que a página será recarregada, com essa lib do Zend vc consegue puxar todos os dados públicos do vídeo e de usuários tmb.

[IgorC 0]

É que no caso, eu queria que fosse como no vídeo mesmo, que carregasse no momento, sem precisar de refresh, etc.

[Playerbr 21]

Tenta a api do youtube

https://developers.google.com/youtube/js_api_reference

[IgorC 0]

eu dei uma olhada no código fonte da página da qual eu gravei o vídeo e da uma olhadinha...

// Adiciona vídeo ao STREAM
	root.delegate('#includeVideoStream','click',function(){

        var streamLink = getURL($("#stream-video").val());

        if(streamLink && !$('#stream-link-status').attr('value')){
                
            var video = $('#stream-video').val();
			
			$('#add-stream-image').parent().hide();
			
            $('#stream-description').append(video);

            $('#stream-video').val('');

            $('.formPublishVideo').hide();
            $('#cont-video-publish').hide();

            if(streamLink[0]=='YOUTUBE'){
                var ajx = new ajxQuery({
                    'post' : '&videoID=' + streamLink[2],
                    'url' : SYS_URL + 'youtube',
                    'retorno' : 'json',
                    'onCarregando' : function(){},
                    'onRetorno' : function(json){
                        if(json[0]){

                            $('#stream-link-status').attr('value',1);
                            $('#stream-link').attr('value',streamLink[1]);
                            $('#stream-link-type').attr('value','YOUTUBE');
                            $('#stream-link-thumb').attr('value',json[2]);
                            $('#stream-link-title').attr('value',json[0]);
                            $('#stream-link-description').attr('value',json[1]);
                            $('#stream-link-embed').attr('value',json[3]);

                            $('#link-thumb').attr('src',json[2]);
                            $('#link-titulo').text(json[0]);
                            $('#link-description').text(json[1]);
							
                            $('#cont-stream-link').show();
							
                        }
                    }
                });
                ajx.conectar();
            }
        }
    })

Também encontrei em outro arquivo .js separado:

function getURL(text) {
    var patternLink = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
    var patternYoutube = /youtu(be.com|.b)(\/v\/|\/watch\\?v=|e\/|\/watch(.+)v=)(.{11})/;

    var er = new RegExp(patternLink);
    var arLink = er.exec(text);

    if(arLink){
        var er = new RegExp(patternYoutube);
        var arYoutube = er.exec(arLink[0]);
        if(arYoutube){
            return [
            'YOUTUBE',
            arLink[0],
            arYoutube[4]
            ];
        }else{
            return [
            'LINK',
            arLink[0],
            null
            ];
        }
        return true;
    }else{
        return false;
    }
}

e:

/**************** START STREAM ********************/

function openVideo(newsID,param){

    var obj = $("#item-"+newsID+" .link-thumb");

    $(obj).html("");
    $(obj).css("paddingBottom","10px");

    switch(param[0]){
        case "YOUTUBE":
            $(obj).append("<iframe width='408' height='230' src='http://www.youtube.com/embed/"+param[1]+"?wmode=transparent' frameborder='0' allowfullscreen></iframe>");
            break;
    }

}

function streamCapture(){

    var streamLink = getURL($("#stream-text").val());

    if(streamLink && !$('#stream-link-status').attr('value')){
        if(streamLink[0] == 'YOUTUBE'){

            var ajx = new ajxQuery({
                'post' : '&videoID=' + streamLink[2],
                'url' : SYS_URL + 'youtube',
                'retorno' : 'json',
                'onCarregando' : function(){
                    $('#content-loading').show();
                },
                'onRetorno' : function(json){
                    if(json[0]){
                        $('#stream-link-status').attr('value',1);
                        $('#stream-link').attr('value',streamLink[1]);
                        $('#stream-link-type').attr('value','YOUTUBE');
                        $('#stream-link-thumb').attr('value',json[2]);
                        $('#stream-link-title').attr('value',json[0]);
                        $('#stream-link-description').attr('value',json[1]);
                        $('#stream-link-embed').attr('value',json[3]);
						
                        $('#link-thumb').attr('src',json[2]);
                        $('#link-titulo').text(json[0]);
                        $('#link-description').text(json[1]);
                        $('#link').show();
                    }
					
                    $('#content-loading').hide();
                }
            });
            ajx.conectar();
        }else{
	}
    }
}
function closeLink(){
    $(
        '#stream-link-status,'+
        '#stream-link,'+
        '#stream-link-type,'+
        '#stream-link-thumb,'+
        '#stream-link-title,'+
        '#stream-link-description,'+
        '#stream-link-embed'
        ).attr("value","");
    $('#link').slideUp();
    $('#cont-addVideoPublish').show();
}

Como posso utilizar esses arquivos para fazer igual ao do vídeo? Obrigado.

[Playerbr 21]

Comece estudando js

http://www.w3schools.com/js/default.asp

 

O código que te passei funciona, mas como disse, não têm o filtro.

Teste ele no

http://www.w3schools.com/js/default.asp

Vai precisar do link do embeded para testar

 

No youtube, em incoporar, ele vai te dar isso

<iframe width="420" height="315" src="//www.youtube.com/embed/82xh5tV04qA" frameborder="0" allowfullscreen></iframe>

Você só vai usar essa parte

www.youtube.com/embed/82xh5tV04qA

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
function mostra_youtube(){

    var end_youtube=document.getElementById("input_youtube").value;
    document.getElementById('campo_youtube').innerHTML='<iframe width="560" height="315" src="//'+end_youtube+'" frameborder="0" allowfullscreen></iframe>'

    return false;
}


</script>
</head>
<body>
<span id="campo_youtube"></span>
    <input type="text" id="input_youtube"/>
    <a onclick="return mostra_youtube()">testar</a>
</body>
</html>

[IgorC 0]

Playerbr, obrigado por responder novamente.

 

Então cara, sim eu entendi a lógica do seu código, e já consegui criar o filtro etc, porém eu quero criar algo igual o vídeo demonstra mesmo pois eu realmente preciso para aplicar em um projeto...

 

Se você puder me ajudar eu agradeço, sei que tem haver com a API do YouTube para puxar os dados ( descrição, título, thumbnail, etc ) mas não sei como usá-la, já estudei, vi exemplos mas realmente estou com uma enorme dificuldade para conseguir o resultado que quero...

 

Obrigado.

[Playerbr 21]

Poste o código do que você já fez, com os filtros.

E seja específico na dúvida, se você não consegue fazer nada do que você precisa, vai ter que estudar e ir conseguindo fazer aos poucos ou contratar alguém que faça para você.