SWF Tools

In this week's episode, Bob has changed his ways. He no longer robs liquor stores, beats up little kids, or uses the jQuery Media module to display podcast audio and video on his websites. Instead, he shows how awesome, flexible, and easy SWFTools is to implement. All on this week's Mustardseed video podcast!

Ohhh... different players for different things, flexibility, configurability, lose the dependence on Javascript, there are a lot of advantages. :-) Thanks!
You actually do have to do a bit more work to support multiple players and various resolutions (working within template.php and preprocess functions [drupal 6 only] or the phptemplate variables [drupal 5]. It's not baked into jQuery Media now, but it seems that Aaron will be putting support in for this. SWF is great but there's one consideration to make when dealing with all this rich media stuff. It happens to be Apple's fault but if you wrap embed or object tags within your html then devices like the iPhone won't be able to play media like mp3 (podcast specific - flash doesn't work anyway). But, for files like mp3, which can be played on the iPhone. When provided as a raw anchor tag, the iPhone can play the mp3 natively. Using jQuery Media, you can make this decision and not hard code the embed/object tags into your html. Here's what I'm talking about. // Don't add the javascript player stuff for certain devices/browser (e.g iPhone) if (!useragent_noplayer()) { // Create the javascript - there's some overkill in here and it's not been optimized - should move to using the Metadata Plugin $media_js = "if (Drupal.jsEnabled) {\n$(document).ready(function() {\n"; $media_js .= "$('#$media_class').media( { width: 290, height: 24, flashvars: {soundFile:'". $media['path_raw'] ."', bg:'0xA4B940', leftbg:'0x183C45', lefticon:'0xFFFFFF', righticon:'0xFFFFFF', rightbg:'0x86982F', text:'0xFFFFFF', slider:'0x183C45'} } );"; $media_js .= "\n});\n}"; drupal_add_js($media_js, 'inline', 'header'); } The above snippet references this function in template.php /** * Helper function for not adding the player for certain browsers/devices. */ function useragent_noplayer() { $agent = $_SERVER['HTTP_USER_AGENT']; $browsers = array('iPhone'); foreach ($browsers as $browser) { if (preg_match("/$browser/", $agent)) { return TRUE; } } return FALSE; } Just something to think about when you consider how many iPhones there are out there.
Another great episode, I was just wondering what you are using for your video player?
@Joel: My video player of choice, currently, is what was demo'd previously with jQuery Media. It's the JW FLV Player. It's decent, but there's probably something better (which I'm totally open to!) Anyone have a good open source video player that I don't know about? @Matt: Thanks for the code! Looks interesting and I'll have to try it sometime...
This is great, but I have an idea... duplicate the file field module to use swf() direct . Is this possible ?
thanks Bob! looks like we are closing in on a great podcast/vidcast architecture for D6. Now to start playing... with the filefield module, is there a simple way of "uploading" files which are already sitting on the webserver? I've got a ton of existing MP3s sitting there (currently being used by the audio module) so rather than upload them all again from outside, it would be nice to be able to grab those files from the web server... any suggestions? Cheers Pete
On the latest 2 comments: @Florin: what you're talking about here (I think) is a filefield swftools formatter. So, in the "display fields" section of /admin/content/types you'd be able to choose it to display as a flash player. Thats something we're looking at writing in the near future to make this even easier to implement without touching any theme files. So, as of now it doesn't exist...but if its up to me, it will :) @pete: What it sounds like you're talking about is a 'filefield import' module. To my knowledge, this doesn't exist now. In my eyes this would be a great module but not something I'll be pursuing immediately for this workflow. This can be a 'generic' filefiled solution, though. If anyone writes a 'filefield import' of somekind, it should work just fine with a podcasting workflow like this. Thanks for sharing your ideas...all these thoughts will make this workflow even better!
For those of us with slow cpus, here is the link to the file so you can watch it localy: http://blip.tv/file/get/Mustardseed-SWFTools334.m4v Thanks guys for all you do!
Wow, thanks Bob! This SWF Tools works _A LOT_ better. Between this, Geeks & God, and Top 5, you're my new most favorite podcaster!
I don't know what I have done wrong but for the life of me I can't seem to get the swftools to work. I was able to get the jquery media to work but when I tried the swftools route it seem to be doing nada. I did however get a error message when I first installed the swftools telling me I didn't have a file setting setup correctly, telling me I had to setup something about mixed media. To fix that I had to install the jw flv player and turn it on to at least get that error message to go away. Then when I tried to create a test post and get a player to show up nothing happened. Thanks, Kelly
Bob, When it comes to setting up your theme, I am supposed to create the node-podcast.tpl.php file myself or should that occur automatically when I create the content type. I followed your steps very carefully (twice over!) and I cannot locate this file. My apologies, I'm certainly not a coder but I'm absolutely psyched about what drupal can accomplish. Any help would be appreciated.
Nevermind, some further searching of your site has given me my answer! Nice work btw!
Through a lot of hoops, prayer, some missing hair I finally got it to work so now I am going to play around with it and see what I can do with it. Thanks for these very valuable video casts Bob. Keep up the good work. Thanks, Kelly
If you are looking for an open source video player check out flowplayer, i believe it is integrated into swftool already. I'm about to check that out and I'll report back. http://flowplayer.org Also, I'd like to know what software / techniques you are using for your podcasts. I live the clean zoom in zoom out feature, and was wondering if this is happening live or during post production.. Feel free to email me , thanks Frank
Thanks for another excellent podcast. Your presentation and production make it a real pleasure so I watch for enjoyment as much as for learning. ... and I'm a drupalholic of course ;-) DK
@Frank: I use Screenflow to create these podcasts. It's great software! (Mac only, sorry!)
any clues as to how you did this.. I've made that file, and added that code, but I get errors on the front page since I uploaded a midi file: No player is configured to play a series mixed media files. Check the SWF Tools file handling settings on the configuration page.
Can I use the SWF tools with file content hosted with BLIP.TV? Rich
@Ben: Midi files are not intended for web browser playback. They're a composition file used in music production (and are distributed on the internet but shouldn't be used for playback on a normal basis). Therefore, no flash players that I know of support midi. Convert your file to MP3, MP4 or something else intended for internet playback first. @Rich: Absolutely! As long as you can get a URL to the original flv or mp3 file (depending on what you're playing) then you can show it using SWFTools. You'd do it in the theme layer of your node.tpl.php with something like this: <?php $filepath = 'http://example.com/myfile.mp3'; print swf($filepath); ?>
I used to use Jquery Media, but this looks conciderably better. In D6 I'm running into the situation of not being able to offer dynamic playlists. I noticed that this supported playlists, curious if you have any suggestions on how to get these to work? I'm trying to create a view containing filefields, and would like them to be made into a playlist for use with SWF Tools. Any tips or suggestions on where to look or achieve this?
hi, can i request a tutorial on the video_upload module? wherein you can upload videos from yoursite directly to youtube. and also how to post one of those videos uploaded to your youtube account to be in your homepage. and also how to make thumbnails of that videos. Phew.. I hope you can grant my request.. I really need a tutorial of these for my thesis.. thank you very much..
Good day. I have used flowplayer frequently in the past and it has worked excellent for me. Even without using flowplayer, I was wondering how I could support video using content templates. I have not been able to find anything yet. Thanks.
Hi BOB, i need some help...if you have some time for me. System (Drupal 6.6, SWF Tools newest, 1 Pixel out is the player for MP3-Files) I have reproduced your tutorial on my localhost it's works. Thanks. I have listed 4 mp3 files in the podcast page but only the first one can i see... My node-podcast.tpl.php have this inside: <?php print swf($node->field_audio_file[0]['filepath']); ?> I am not a programmer ... can you tell me how can i loop for all mp3-files in the Template file if more that one audio file loaded? Thanks Ati
In case it's helpful to anyone, here is the node-media.tpl.php file I use for the video/audio nodes of my site (see example). It is using a separate Imagefield to show a pre-selected frame of the video, and is using the JW Player 4, the Stylish custom skin using color settings in SWFTools, and a background image in CSS to simulate rounded edges for the player (the slideshow is of course powered by the excellent Views Carousel). Feel free to also look up and copy my CSS. Here's the node-media.tpl.php template: <?php if (!$status) { print " node-unpublished"; } ?>"> <?php print $title?> <?php print $node->field_media_description[0]['view'] ?> Music © <?php print $node->field_media_date[0]['view'] ?> <?php print $node->field_media_owner[0]['view'] ?> <?php // Displays the media player with an Imagefield preview and the Play icon turned off print swf($node->field_media[0]['filepath'], array( 'flashvars' => array( 'image' => 'media-image/' . ($node->field_media_image[0]['filename']), 'icons' => 'false') )); ?> <?php // Displays the music-only message if checked for this node $musiconly = $node->field_media_musiconly[0]['view']; if ($musiconly == 'musiconly') { print 'Music only, video not available'; } ?> <?php if (!$teaser): ?> <?php if ($links) { ?><?php print $links?><?php }; ?> <?php endif; ?> <?php if ($teaser): ?> <?php if ($links) { ?><?php print $links?><?php }; ?> <?php endif; ?> ------------- Also, for the person who asked about showing multiple media files, here's how I display a separate player for each audio or video file in a multi-value field: <?php foreach ((array)$node->field_media as $item) { ?> <?php print swf($item['filepath']) ?> <?php } ?> I haven't figured out yet how to make a single-player playlist for multiple media files, but will share that when I do. Quick note to Bob: would it be possible to add the code formatting/box to comments here on the site? I previewed my post and noticed it's a bit hard to read the code. God bless :D
I decided to write up a case study on how my own site was created, including the code/info about SWF Tools I've posted here. http://www.davidnewkerk.com/book/103 I also included my exported CCK type and Views, and relevant template files. Enjoy!
I was trying to do this exact thing today since Nate Haug has recommended this setup at the recent Do It With Drupal conference. I had everything working except adding the swf() function into my theme file. Thanks so much for showing how to set this up correctly!
could this method be used to add subtitles? An XML file somehow attached to the JWPlayer using SWFtools. Any ideas?
This technique works great on the node-whatever.tpl.php, but I'm having difficulty calling the same functionality on the page-front.tpl.php file that I am using. I have created a view that will display the most current media published with a title, teaser and the file-field content in a block and then calling that on the front page. If I use the code "print swf($node->field_myfile_file[0]['filepath']);" on the page-front.tpl.php file, the JW Player will be called, but I get a file path error. Any ideas on what I should use on the front page to have the Player find the file correctly?
forgot to include the file path error being displayed in the flash player: Erro #2032: Stream Error URL: http://localhost/site_name/sites/default/files/sites/default/files Obviously the player is trying to pull the file from the default/files but the path is being doubled. How is it that the file path is doubled when placed on the front page, but is correct on the node-page? I don't get it.
I wanted the audio upload/1pixelout player to be available on most of my content types so I was struggling with modifying node.tpl.php to include the player. The problem was I would get the following errors on nodes that did upload an audio file with: **No player is configured to play a series mixed media files. Check the SWF Tools file handling settings on the configuration page.** What finally fixed this is I wrapped the <?php print swf($node->field_audio_file[0]['filepath']); ?> in a conditional statement so I had: <?php if ($field_audio_file): ?> <?php print swf($node->field_audio_file[0]['filepath']); ?> <?php endif; ?> So far this works fine. Let me know if you see any problems with this. I also had to go into the Display Fields setting for my node type and toggle this cck field to "Hidden" so I don't end up seeing the download link.
I followed this podcast to the T. I also created my override for page-node-mycontent_type.tpl.php The problem I'm having is when I change that line of code suggested in the video, it stops playing the file. Is there any updated code that I need to insert in my content-type page so that all audio files attached to that node type will find the file and play. In IE it seems like it is buffering the file forever and in Firefox, it says "error opening file". I am almost certain that its the line code that as demonstrated in the video that I'm having a problem with. Can you please help? Thanks Navs
Hi Man thanks for the tutorials I would love to know how to use DASH PLAYER http://drupal.org/project/dashplayer this module is driving me crazy
I keep hearing about amazon AWS is it really worth it? how do i install drupal on it I found these article but i am lost so bad http://groups.drupal.org/node/11045
It appears the 1 pixel player is now called the audio player: http://www.1pixelout.net/code/audio-player-wordpress-plugin/ I'm not sure how to add this to swf tools. Anyone have more on how to do this?
Same experience here. Solution = Go to: http://www.1pixelout.net/code/audio-player-wordpress-plugin Download (and unzip): audio-player.zip Copy file: player.swf To your modules folder: /sites/all/modules/swftools/shared/1pixelout/player.swf Regards,
Hi, i am search for a easy to use player like swftools, but for video-files like mp4, avi or m4v. Is it possible to play such videos with swftools? Regards, Thomas
swftools is intended for 'web playback formats' such as mp3 and flv. Files like m4v aren't really intended to be played within a web browser so you won't find much support for them. However, JW Media Player (the video player I usually use with swftools) supports any formats that flash player supports including MP4. I haven't tried all of them but you can give it a try to see what works for you.
i followed u r whole video podcast but still wondering about that file that u mentioned... any way that you can help please....
The node-podcast.tpl.php is a custom theming file that doesn't exist by default. You have to create it when creating your theme in order to theme the podcast content type specifically. Note that the format for this template file is: node- + machine readable name of your content type + .tpl.php See more on theming content types here.
Between you and a guy named Newkirk who references you at http://www.davidnewkerk.com/book/103, I've almost got this figured out. Almost. I can get the simple player to autoplay my .flv files, but the JW Player loads then doesn't play the files. I get the "You are missing some Flash content that should appear here! Perhaps your browser cannot display it, or maybe it did not initialise correctly" message. The most frustrating part is that it worked on my local site before I went and put it on a live site. Any hints or general directions for troubleshooting this so I can get my live site live again? Thanks so much for your ever-useful work.
I have not been able to get flowplayer to install in swftools. I think part of the problem is that i cannot find the correct player on line. But I looked at the code, and experimented quite a bit. and its not really behaving itself. are there people out there that have comeup with a solutions? awsome cast as usual
In your theme's template.php file you could use this instead of using a separate node.tpl.php file for your media nodes. <?php function phptemplate_preprocess_node(&$vars, $hook) { if ($vars['node']->type == 'media' && module_exists('swftools') && count($vars['field_media'])) { foreach($vars['field_media'] as $file) { $vars['content'] .= swf($file['filepath']); } } } ?>
In my case, all the divs that will be replaced with the player get created dynamically, and when i try to use the sendEvent function from within the jQuery with something like " bind(sendEvent('stop') ", i get the " thisMovie("current_player") is not defined" error.I looked at all the examples, but they all use the swfobject, and this usually is where i fail, trying to convert them to my jQuery workflow.Any suggestions?
Without modifying template.php, you can create a custom themer for just podcast fields. Here's a quick recipe:
  1. Copy sites/all/modules/cck/theme/content-field.tpl.php to sites/all/themes/{yourtheme}/content-field.tpl.php. Very important: keep the same filename!
  2. Make another copy of the file, and this time name it sites/all/themes/{yourtheme}/content-field-podcast.tpl.php.
  3. Edit sites/all/themes/{yourtheme}/content-field-podcast.tpl.php to enable swf on the item. Replace <?php print $item['view'] ?> with <?php print swf($item['filepath'])?>.
That's all there is to it. Now you don't have to create a custom theme for every new node type that has a podcast in it. More details are available at http://www.advantagelabs.com/drupal-colonoscopy-or-how-theme-cck-field-d...
In #2 and #3, it's not content-field-podcast.tpl.php but content-field-field_podcast.tpl.php
Hey, just love these tutorials Bob ... You rock dude. Was just thinking, not that I need it, but it would be cool if you could do a podcast on mixing two of the tutorials already cover. Blocks and Podcast! I'd love to know how I can get my newly built player to display as a block that I can throw on the front page should I need to. I've given it a go, but I'm just not there with it. Any chance you could do a podcast for this? I mean, let's face it, everybody loves media right? Look forward to your next installment Bob. Jason
Hi First I want to thank you for the great video it was very helpful. However, I figure out you do not necessary need to create a custom node.tpl.php for you audio filefield in order to get the player to show up. Once you have created the cck with you fields. Then go to the Display Fields tab. On the audio filefield created in the either or both Teaser and Full Node click the dropdown (defaults to Generic file for filefields) scroll down if necessary. You will have 3 new options SWF Tools no download link, SWF Tools playlist, SWF Tools with download link. Choose the option you want and save. View your content that was added and now the player shows up. No code necessary. I am not sure why this is not stated in the SWF Tools documentation. To me this seem easier and no custom code to maintain. Also, note this same options are available when creating views of your audio cck, if you need to use the fields instead of nodes. I hope this helps others when setting up this. Thanks Pam
Thanks Pam! This is great news....this is something I've been wanting forever and apparently now exists (it never did before). This will make life even easier...thanks for pointing it out!
Hi. Great podcast as always. They're really helping me get to grips with Drupal. I am having a little trouble uploading an audio file. I create the content type and field and even implement Pam's suggestion but when I try to create an audio node and upload an audio file nothing gets uploaded. Is there something that I am doing wrong? I am using MAMP on my Mac. Please help. :)
Hi, I loved this tutorial, especially since my main problem was the folder name! I got everything working, except for one thing. The player always goes to the top of the page when I create a Flash page. How can I embed it in the body?