YouTube Search functionality in facebook app


fb_logoSomeday ago I had to add youtube video search functionality in a facebook app. Here I described how I added youtube search functionality in that facebook app using Zend_Gdata php library.

Here is a screenshot of that facebook application, where I added YouTube video search functionality.

search_youtube_video

If you use Zend Framework for developing facebook application, then you don’t need to download any additional library. If you don’t use zend framework then download the latest version of Zend GData Component library from here. Zend_Gdata is distributed as part of the Zend Framework

After downloading¬† Zend_GData, unzip it. You’ll see a folder named Zend within it you’ll see some folders and files like below screen.

zend_gdata

Now put the Zend folder in your project root folder or library folder. I assume your project name is fbyoutube and the file where you’ll integrate youtube search is fbyoutube/youtube.php and I assume you place Zend folder in fbyoutube/Zend

First Include the Zend_GData library:

<?php
    //filename youtube.php
    set_include_path('.' . 'Zend/' . PATH_SEPARATOR . get_include_path());

    include "Zend/Loader.php";
    Zend_Loader::loadClass('Zend_Gdata_YouTube');
?>

Now create a search field from where user can provide text to search:

<div>
       <form name="fvideo" action="youtube.php" method="POST">
            <input type="text" name="videotext" size="80" value="<?=isset($qs) ? $qs : ''?>" />
            <br />
            <input type="submit" value="Search" name="submit" />
       </form>
</div>

Now see the search functionality code here:

<?php
        $qs             =   isset($_REQUEST['videotext']) ? $_REQUEST['videotext'] : '';
        if (empty($qs)){
            $data['notext'] = true;
            return;
        }

        $result =   true;
        //youtube part
        $yt = new Zend_Gdata_YouTube();
        $query = $yt->newVideoQuery();
        $query->videoQuery = $qs;
        $query->startIndex = 10;
        $query->maxResults = 10;
        $query->orderBy = 'viewCount';

        //echo $query->queryUrl . "<br />";
        $videoFeed = $yt->getVideoFeed($query);

        foreach ($videoFeed as $videoEntry) {
              $videoThumbnails = $videoEntry->getVideoThumbnails();

              $vidparser =    parse_url($videoEntry->getVideoWatchPageUrl());
              parse_str($vidparser['query'], $query);
              $vidid     =    ($query['v']);

              $link      =    "http://www.youtube.com/v/$vidid&hl=en&fs=1&rel=0";

              $data['videos'][]   =   array(
                     0 => $link,
                     1 => $videoThumbnails[0]['url'],
                     2 => $videoEntry->getVideoTitle(),
                     3 => "http://www.youtube.com/watch?v=" . $vidid
              );
        }
?>

After searching now we will show the result with thumbnail in facebook canvas page:

<style type="text/css">
.content1 .week_box {
      float:left;
      height:180px;
      position:relative;
      width:179px;
      text-align: center;
    }
</style>

<?php if (isset($data['notext'] )) { ?>
    <b>No Query. Please enter something to search! </b>
<?php } ?>
<?php if (isset($data['videos'])) { ?>
    <div class="content1" >
    <?php foreach($data['videos'] as $video) { ?>
        <div class="week_box">
            <b> <?=$video[2]?> </b> <br />
            <fb:swf swfbgcolor="000000" imgstyle="border-width:3px; border-color:white;"
                    swfsrc='<?=$video[0]?>'
                    width='150' height='120' />
            <br />
        </div>
    <?php } ?>
   </div>
<?php } ?>

Done. No one wants to be confused so here I’ve shown the full code in one file:

youtube.php

<div>
    <form name="fvideo" action="youtube.php" method="POST">
        <input type="text" name="videotext" size="80" value="<?=isset($qs) ? $qs : ''?>" />
        <br />
        <input type="submit" value="Search" name="submit" />
    </form>
</div>

<?php
set_include_path('.' . 'Zend/' . PATH_SEPARATOR . get_include_path());

include "Zend/Loader.php";
Zend_Loader::loadClass('Zend_Gdata_YouTube');

//getting search text
$qs             =   isset($_REQUEST['videotext']) ? $_REQUEST['videotext'] : '';
if (empty($qs)) {
    $data['notext'] = true;
    return;
}

$result =   true;
//youtube part
$yt = new Zend_Gdata_YouTube();
$query = $yt->newVideoQuery();
$query->videoQuery = $qs;
$query->startIndex = 10;
$query->maxResults = 10;
$query->orderBy = 'viewCount';

//echo $query->queryUrl . "<br />";
$videoFeed = $yt->getVideoFeed($query);

foreach ($videoFeed as $videoEntry) {
    $videoThumbnails = $videoEntry->getVideoThumbnails();

    $vidparser =    parse_url($videoEntry->getVideoWatchPageUrl());
    parse_str($vidparser['query'], $query);
    $vidid     =    ($query['v']);

    $link      =    "http://www.youtube.com/v/$vidid&hl=en&fs=1&rel=0";

    $data['videos'][]   =   array(
        0 => $link,
        1 => $videoThumbnails[0]['url'],
        2 => $videoEntry->getVideoTitle(),
        3 => "http://www.youtube.com/watch?v=" . $vidid
    );
}
?>

<style type="text/css">
.content1 .week_box {
      float:left;
      height:180px;
      position:relative;
      width:179px;
      text-align: center;
}
</style>

<?php if (isset($data['notext'] )) { ?>
    <b>No Query. Please enter something to search! </b>
<?php } ?>
<?php if (isset($data['videos'])) { ?>
   <div class="content1" >
    <?php foreach($data['videos'] as $video) { ?>
        <div class="week_box">
            <b> <?=$video[2]?> </b> <br />
            <fb:swf swfbgcolor="000000" imgstyle="border-width:3px; border-color:white;"
                    swfsrc='<?=$video[0]?>'
                    width='150' height='120' />
            <br />
        </div>
    <?php } ?>
  </div>
<?php } ?>

I hope this code will help you to add youtube video search functionality in your facebook app. You could also add youtube search functionality in your normal website and you could use some more functionalities of Zend_GData. See the references:

http://code.google.com/apis/youtube/2.0/developers_guide_php.html
http://code.google.com/apis/gdata/articles/php_client_lib.html

mahmud ahsan

Love computer programming and write occasional blog post. In my early career I worked mostly on web based application and since 2011, I exclusively working on iPhone and android applications. I work at home, father of a nice kid and husband of a beautiful wife. [My Business | Twitter | Linkedin]

You may also like

4 Comments

  • Sanam
    December 11, 2009 at 11:36 am

    Very interesting and amusing subject. I read with great pleasure.

  • Vijay
    July 18, 2010 at 2:08 pm

    very intersting ,need to work out in the facebook applicaion

  • Juan Bimba
    September 8, 2010 at 8:39 pm

    Hi Mahmud,

    I got this error message:

    Fatal error: Class ‘Zend_Uri_Http’ not found in …/public_html/fbyoutube/Zend/Gdata/App.php on line 643

    Then I added in youtube.php after the sentence:
    Zend_Loader::loadClass(‘Zend_Gdata_YouTube’);

    This one:
    Zend_Loader::loadClass(‘Zend_Uri_Http’);

    and it works.

    Thanks and regards
    Juan B

    • mahmud ahsan
      mahmud ahsan
      September 12, 2010 at 11:24 pm

      I developed this project long time ago, probably 8 months ago. So i’m not sure if Zend_Gdata has updated or not.

Comments are closed here.

About Me

Hi I am Mahmud Ahsan. I Love computer programming and write occasional blog post. In my early career I worked mostly on web based application and since 2011, I exclusively working on iPhone and android applications. I work at home, father of a nice kid and husband of a beautiful wife. [My Business | Twitter | Linkedin]

Twitter Feed

Fanpage