Local Video Files
When serving local video files, we have to consider first how a video will be placed onto the server and if we require any manipulation of the video. We may wish to use an upload field from a web form, or we may wish to use FTP to upload large files, or we may wish to be able to email a video to the server as from a cell phone. All of these options are available, so we will examine each in turn.
FileField
The first heavy hitter is the FileField module. This light-weight module goes a long way. At its most basic level, it adds the functionality of the core Upload module to CCK. Besides serving as an invisible API for imageField, it can also expose file uploads as fields. The module supports any file type such as .txt, .pdf, images, video, or audio.
Before continuing, if you haven't aine ad y, you111 need to install the File Field module by d ownloadmg and enabling it from littp ¡//drupal . org/ project/ file field.
N ow we'll create a new content type called Cartoon. You'll need to add an Image Field to the node type, called Cartoon Thunfonai 1.
Next, set up a FileField also named Cartoon, For this example, our movies will always be quicklime hies with a mov extension, since that's how our video editors will deliver their c ontent.
Go to Administer | Content management | Content types | Cartoon | Add field
(at /admin/content/node- type/cartoon/add_field). Enter the Field name of Cartoon and label of Caitoon, set the Field type to File, arid click Continue. Leave the Widget type to File Upload, and press Continue again:
Create new field
Held name:
|fleld_cartoon
The machine-readable name of the field. This name cannot be changed.
Label:_
[cartoon
A human-readable name to be used as the label for this field in the Cartoon content type.
field type:
pile TJ
The type of data you would like to store in the database with this field. This option cannot be changed.
Widget type: +
The type of form element you would like to present to the user when creating this field in the Cartoon content type.
On the resulting screen, change bit 111 the Permitted upload file extensions text field to read mov (with out a "," in front). In the Glottal settings fieldset; set the Default list value to Listed and How should tlie file be listed? to Enforce default. This will ensure the file is always listed with the node display:
Default list value:
$ Listed Hidden
The list option determines whether files are visible on node views. This will be used as the default value for the list option.
How should the list value be handled?:
User Configurable, [Users will be able to set the list value per file,)
(?) Enforce Default. [The default list value will be used for all files, and the list checkbox will not be displayed to users.)
Mow add a video with its thumbnail from the c onterit submission screen at Create content | Cartoon (at /node/add/cartoon). You'll see on the Cartoon field that it only allows . mov tiles; other iiie types will give a validation error.
You may riot be ¡able to add files above a certain size, depending on the PHP settings of your server. If you have t lie Upload module enabled, you can see your current upload size limit settings at Administer | Site configuration J File uploads (at /admin/settings;/uploads). If you see something like Your PHP settings Limit the maximum fiJ e size per upload to 4MB, but you need to be able to upload 8 MB videos, you'll needtoedit your php ,ini file an d a d d, for instancE, p c s t_niax_s i z e = 3000000 and upload_oaax_filesize = 8000000.
Cartoon:
f^ Sample,mov 54.32 KB videoyquicktime
Description:
fWallah Wallah
Replace:
Maximum Filesne: 2 MB Allowed Extensions: mov
Upload | Remove J
When you save this video node, you'll see a link to the video. Users could now click on that link to load the video in an external viewer. But that's obviously not what we have in our mind. We need to do a little more to make the video display in the browser:
Cartoon:
0 Sample.mov
Curabitur odio, Nullarri euismod ■
rutrunn, quann sed vestibulurn lac
The FileField module is little more than an API for file handling. As ImageField does, other modules may tap into its functionality, allowing them all to be light-weight, flexible, and powerful.
Theme Your Video
When using the FileField module to display cartoons, we want to actually display our video, rather than just a listing of the video.
To make the FileField module work for our purposes, we'll need to add our own theme files. To spice things up, our client wants us to display a custom thumbnail before displaying the uploaded video after clicking the image. Additionally, they want a logo watermarked on the video while it plays.
We'll use a combination of ImageField and FileField for the first task. Set up the ImsgeField named Cartoon Thumbnail, configuring twoIrnageCache ptesets: cartoori_thuiribnail and cartoon_ over lay, which Scale and Crop to 100x100 and 240x360 respectively. If you are unfamiliar with the process of creatingImageCache presets, you can follow the instructions from the Developing for Images chapter for a refresher.
As of this writing, to use the FileField module to display your video, you need to add a theme function. This may have changed by the time you read this chapter; work is in progress to add better video support to that module. It maybe that there is an option in the Display fields page for our Cartoon field at Administer | Content management | Content types | Cartoon | Display fields (at/admi.n/c on tent/ types/cartoon/display).
However, because we plan to override this with our overlay thumbnail, we're going to do this manually. This is a good exercise in overriding theme functions.
Preprocess Hook
We've already seen how to override a theme function by creating a phptoefaplia?te_ [function. We've also seen how to override or create a template file for a theme function with something like [tiseaffjname ] . tpl. php. There are times, however, when we want to do a bit of both. For instance, we may wish to make new variables available to a template file, and keep the PHP largely separate from the HTML.
We can achieve this by tapping into the theming structure with a preprocess hook. Specifically, we can create a prepro®g$s_itheme_ii5iitte] function to add variables that would then be available to [feijetitejt&rrie] .:tpl.;.pb;p.
We're going to take advantage of this to override the default filefield link.
For more information about preprocess hooks than what we're about to cover, visit http : fydrupal. QEgf/2230.
Examining the tfeme filef^ld_fiM function, we see the following code of the alpha version of the module available at this time (in /sitea/ali/modules/
f'xlef tfjeld/f ilef ield_f oirmatter . inc:): /* *
* Thefrie function "E-or the 'igigns-iic' single file f ulict ion tliemsj:_jGl 1 ef i;^ 1 d f ile ( $;f i 1 { $pateii = $£¿1 e [' f i 1 1 ] ;
$url =. "f il-ejr®|ite_url;(^path) ; $icon = tliisnj^C'' filef ield_icon-' , $ffiej§
returil '■■■«jilv clas.s=":|:il.e.Jield-iiiie clear-block"r: §4con „
l-t$f il&P 'filename 1 ] , |jurl) . ' is/div>:-s^ }
We want to override this to display an embedded object for a movie file. We could simply overwrite the function by creating aphptemplate filefield file or my_thsme_filef i:eld_file function. But we also wish to create a template file available for our themer who may wish to insert specific style classes or wrappers, and we want that file to be easily maintainable in the future.
Therefore, we'll use this theme as a baseband additionally create a $ object, variable that will contain our movie object, while leaving links in place for other types of files.
Let's first create our template file named filefield_file . tpl. php in our theme directory with the following code:
* filefield_file.tpl.php
* This will display the file object or link for all filefields.
* The following variables are available:
* $file: The original file object.
* $icon: A representative icon based on the file's mime type.
* {object: The HTML to display our file, as an object or link.
<div class="filefield-file clear-block">
As we see here, we're making more variables available to the template file than we plan to use. This makes future changes easier, particularly when we document this.
Now in template . php, add the following function. Note that any item inserted into the {variables array will be made available to our template file as a variable with the name of its key. So {variables [1 ob j ect1 ] will later become $ob j ect:
* implement hook_preprocess_filefield_f ile .
* This interjects itself in the theme('filefield_file')
* structure, creating variables available for use by
* fielfield_file.tpl.php.
function phptemplate_preprocess_filefield_file(&{variables) { $file = $variables [ 'file'] ; {path = $file['filepath']; {url = file_create_url({path); {variables ['url'] = {url;
{variables[1 icon1] = theme('filefield_icon', $file); if ($file['filemime'] == 'video/quicktime') { {variables ['object'] = <<<OBJECT cobj ect classid="clsid:0 2BF2 5D5-8C17 -4B23-BC80-D3488ABDDC6B" codebase = "http : //www. apple . com/qtactivex/qtplugin. cab" width=" 360 " height="24 0 " > <param name="src" value="$url" /> <param name="controller" value="true" />
íS^Staurl; ;ílatEie="auficipI.ay" valus="trué" /> <!-- [if J IE]>- - >
< ob j a e t tyWp = "Yidep/qu i akt i m.er" ■
JEparam name=''aut:p£3lay" Valüe="tríSS-® f>
<:g.a-r ara jíam.e = "'oon tito 11 er "■ va 1 ue = " tjií ué:" / >
ef/iOb JpaSI >
^variables [.' ¿ib j ect' ] = 1 (ile [1 f i léñame ' ] , $urlj,j;
Thanks to the good folks atÁ List Apart, in the article Bye Bye Embed by Elizabeth Castro (at htiSg^//|íM^..Él.ista.part, comyartI_cle.s/byebye.eág..ed)/ we see how to ensure our Quicktime movie will be displayed properly on all compatible browsers. Using a conditional statement will allow any other file types to be displayed using the default link originally provided by the module.
Note the ¿^«OBJECT . . . OBJECT; notation: This PHP notation allows I
us to insert HTML without needing to worry about whether to escape a quote, and keeping an HTML block easily visible..#j3:0,B!2T could be any keyword of our choice.
Post a comment