Tuesday 26 March 2013

YouTube Search functionality in facebook app


YouTube Search functionality in facebook app

Someday 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 hereZend_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 isfbyoutube/youtube.php and I assume you place Zend folder in fbyoutube/Zend
First Include the Zend_GData library:
1
2
3
4
5
6
7
<?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:
1
2
3
4
5
6
7
<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:
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<?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:
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<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
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<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:

No comments:

Post a Comment