Introduction

ClipBucket Player system allows you to add any kind of web player to integerate with ClipBucket easily. Using our core code, asll you have to do is to add code of bunch of lines as we will guide you how to do that but first let me tell you how our system works..

  • Write your player function, that will load player
  • Register your player function using ‘register_actions_play_video’
  • ClipBucket calls ‘flashPlayer’ that simple checks if there is already registered function then load it otherwise let the default player do the job

please check following diagram for reference.

ClipBucket Flas Player Flow Chart

ClipBucket Flas Player Flow Chart

our “how to add new player in clipbucket has 5 steps”

  1. Player Source
  2. Writing Plugin Code
  3. Setting Up The Functions
  4. Something Extra
  5. Testing & Debugging

Player source

first part of your player plugin is to find some good flash player, i am using JWPlayer as its the most basic and easy player that you can integerate and use. you can download it from http://www.longtailvideo.com/players/jw-flv-player/ , please will have following files

– media
–\ player.swf
–\ preview.jpg
–\ readme.html
–\ swfojbect.js
–\ video.flv
–\ yt.swf

for this player plugin, we only need “player.swf” and “yt.swf” , player.swf is used to player videos as it is meant to be while yt.swf is used to player youtube’s video in JW player. Lets just setup our source , now create new folder in “players” folder called “jwplayer5″ and create “jwplayer5.php” file under that folder. Now copy “player.swf” and “yt.swf” to newly created folder. Finally your plugins folder will have

ClipBucket Player Plugin Tree

ClipBucket Player Plugin Tree

Writing Plugin Code

well, lets just start writing player plugin, code, its not as difficult but first you have to add comments so that ClipBucket can understand its a Player Plugin. Simple copy and paste the following code in your jwplayer5.php

  <?php
/*
	Player Name: JW Player v5
	Description: Jw player for clipbucket from longtail.com
	Author: Arslan Hassan
	ClipBucket Version: 2
	Plugin Version: 1.0 - JW 5
	Website: http://clip-bucket.com/
*/

?>

Setting Up The Function

Now, lets setup a call video function, first lets just copy and paste the following code in your jwplayer5.php before ?>.

if(!function_exists(jwplayer5))
  {
  function jwplayer5($data)
  {

  $vdata = $data['vdetails'];
  global $swfobj;

  $vid_file = get_video_file($vdata,$no_video,false);
  if($vid_file)
  {
  $hd = $data['hq'];

  $swfobj->width = $data['width'];
  $swfobj->height = $data['height'];
  $swfobj->playerFile = PLAYER_URL.'/jwplayer/player.swf';
  $swfobj->DivId = $data['player_div'] ? $data['player_div'] : config('player_div_id');

  $swfobj->FlashObj();
  //Writing Param
  $swfobj->addParam('allowfullscreen','true');
  $swfobj->addParam('allowscriptaccess','always');
  $swfobj->addParam('wmode','opaque');

  if($hd=='yes') $file = get_hq_video_file($vdata); else $file = get_video_file($vdata,true,true);

  $swfobj->addVar('file',$file);

  $swfobj->CreatePlayer();
  return $swfobj->code;
  }else
  return false;
  }

  add_js(array('swfobject.obj.js'=>'global'));
  register_actions_play_video('jwplayer5');
  }

Each player function ie “jwplayer5()” must be unique, incase it is not, we added “!function_exists()” so that it wont create conflict .

function functioname($data array);

$data is an array which has following values

  $data['player_div']; //Player Div Id
  $data['key']; //Video Key
  $data['flv']; //Flv Name (file name)
  $data['height']; //Player Heigh
  $data['width']; //Player Width
  $data['hq']; //Boolean : if you true, then play HQ video otherwise player normal
  $data['autoplay'];  //Auto Player
  $data['vdetails']; //Video Details array ie $data['vdetails']['title'] will return video data

this $data is passed from flashPlayer($data) function so you dont need to worry about it, just focus on your function

function get_video_file() is used to get video file, if there is any, it will return file otherwise return false, read more about get_video_file here

get_video_file($vdetails,$return_default=true,$with_path=true,$multi=false,$count_only=false,$hq=false)

i used swfobject class to order to make this player run, you can read more about how to use this class here, it simply works the same as swobject.js does..

add_js();

this function is very simple, just add swfobject.js in our player page, please read more about this here

register_actions_play_video()

this function register “jwplayer5″ function so that flashPlayer() can call it…

Something Extra

now, your payer is ready to go, if you want to add admin control in this player so that you can control your player from admin panel , you can read a tutorial later.

if you want to add a preview for the player, right now only image preview is available so lets use it, create a preview image called preview.jpg and save it to your player folder “/player/jwplayer5/preview.jpg” , image dimensions should be 175×105 in pixels..

Testing and Debugging

now goto admin panel > players > manage player, you should be able to see your player, Activate it and test it, if you get any problem please right add your coment..