PHP& MySQL Video Playlist (JW Player)

[jj-dr]

Hi guys. I am  trying to implement a video playlist for my church website: http://maranatha.tv ... Click on "CULTOS."

Currently, I am using the JW Player for videos and this one uses an XML playlist to show the videos or LiveStream. I would like to implement a MySQL playlist, so the content can be managed dynamically rather than manually, as is in the case using the XML playlist. Whether I can implement this for the JW player, or another player, I have no idea where to start and how to go about it.

Can someone share some light as to how to implement a PHP & MYSQL video playlist?  Any help will be greatly appreciated.

Thanks!

[ErnieAlex]

When you say "Playlist" do you mean a simple list of videos that you already know or own?

I looked at your site and there were no playlists show on your link.  Did you mean that you want to create a list of things to play and allow users to select them or only play under your control.

A little more info and we can help you out...

PHP and MySQL can do just about anything.  Remember two things.  First, PHP is SERVER-SIDE ONLY.  It runs on the server and can not change anything in a browser.  Second, PHP can "load" a page with data such as a list of videos from a database.  This is very easy to do.  But, to alter them, select them or order them into a playlist, you would have to do that with HTML or JAVASCRIPT.  Also, quite easy to do.     Send more info...

[jj-dr]

Thanks ErnieAlex for your reply.

Yes, as you mention, I want to create a database driven playlist of videos, which I own (or in this case, the church owns). I know the videos should be on a folder and not the database in itself for bandwidth issues.

I would like the user to be able to select or skip videos... just like would normally do in any player, your iphone, or Youtube for instance. Of course, it would be nice to have the first video start playing automatically, then move to the next, and so on. Ideally, the user has full control to stop, pause, advance, rewind, skip. These latter functionalioties are usually provided by the media player used.

The idea is that the playlist resides in a database so it can be manipulated on the back-end to add, delete, upload, etc. using a control panel that I am using (which I have been building by following many tutorials online: i.e, http://www.youtube.com/watch?v=geoF9fqQbKI).  Using the JW player I can create an XML playlists, but I have to update the playlists MANUALLY.  Here's another site where you can see that working (This is not a PHP site: http://dographics.com/r/videos.html 

I know is possible to implement a PHP &  MySQL playlist on the JW player (http://www.longtailvideo.com/) but I am still a beginner in programming and don't know how to go about it.  As long as I get the job done, I don't mind  using a different player, if need be. I use the JW player because I can integrate a LiveStream (http://www.livestream.com) and/or use a video playlist as well.

Since I already have an admin panel for updating content, I know could apply the same concept to manage the videos, unless there are other strict rules I might be unaware of.

So at this point, I only need help on developing the PHP MySQL video playlist (with any other scripting such as jQuery, etc.) and connecting it to the video player. I don't mind updating database playlist manually for now, as I will later integrate this to the admin panel I have been working on.

Essentially, I just want to be able to generate and manage my video content dynamically, just like everything else on my website: maranatha.tv

Does all of this make sense?

Once again, thanks for your feedback.

[ErnieAlex]

JJ-dr,

   Okay, let's review the simple parts first.  You have a bunch of videos.  I assume they are standard formats such as AVI's or MPG's.  They just have to be a format that the player can handle.  These reside in one or more folders somewhere on your server system.  All normal!

   You want to use PHP and MySQL which is standard these days and that's all you need.  You database would be a video collection database.  Simply holding your video collection such as "Video Name", "Video Length","Video Location", "Video Details"...  (Whatever you need to put on the page...  Most users will want to know what they are selecting so some details are needed.)

   In the PHP code would be all the behind the scenes code to access the database and create a playlist for the user.  In the HTML, you would show the list of videos in whatever way you wish.  One example is that you can easier load a drop-down list with all the videos and the user can select one or more to view.  Once these have been selected and the "View Selected Videos" button has been pressed, the form can switch to a page that plays all of the selected files.

   It would be much easier to just have two files.

  The first is the video-selection page that uses a form to POST the selected files to the second page.  (this first page would have PHP code to load the list of videos)

  The second page would have PHP code inside it to load the actual addresses of each video and play it.

There are hundreds of ways to do this, but, this sounds the easiest.

Any further questions, ask away...

[jj-dr]

You are 99.99% on it. The only thing is that I would like the player to start playing when the user enters that video page. In my case, for instance, when the users clicks on the CUTLTOS or BACKTO SCHOOL buttons on maranatha.tv  These are just testing places for now. For now they just load LiveStream stream. But there will be section with  the playlist videos as you can see from the two links below the player:

Video En vivo (live or LivesStream)| Video Pregrabado (pre-recorded or the playlist).

I don't mind how many pages are used to accomplish this, as it will all happen in the background. These two sections, Video Evivo and video Pregrabado, will thus be called from perhaps two different php or html pages.

Generally speaking, I think you already get the concept. Think of a Youtube playlist for instance; once a video finished playing, it advances to the next. And at the same time you have full control of what to play.

[ErnieAlex]

Okay, I get it...  Oddly enough, I have been working on a page that needed some "Dynamic" changes made.
The site needed a drop-down list or scrollable side table with options that the user could select.  Once they picked a selection or two, the new info would "appear" below in a formatted list.  I finally got this working although it was a little tricky.

First, I took a quick look at JW and downloaded it and will play with it some tomorrow.  I might set up a testing site on my server for it as it looks interesting...

As far as I see, you can access the buttons on it, so you can stop forward backup etc just as any viewer does.  So, to change videos, you would just have to dynamically change the file that is viewing.  If you use XML, you would just write out a new XML file and refresh the page and let the viewer that comes up default to that XML file.  But, that seems like over-kill!  Simpler, just user some old Javascript and use fill a dynamic iFrame.

   To do this, you do NOT post out to another form.  You post to yourself and the code on the current form changes.  You would basically be just telling the video viewer to switch to a different movie.  This could be controlled by ANY way you wanted without XML.  You would keep a list of the videos in the database, along with any created playlists you wanted.  Next, the page would load whatever/however you want the videos and playlists to appear.  Such as similar to YouTube or some better way that matches the site better.
   Next, the code is made as one big "FORM" and each of the sample videos on the list would have an action something like   onclick="videoselected()"  which would send it to a previously created Javascript that would make the needed changes in the the video area to start playing the next video.
   In the Javascript area, the "videoselected" function would stop the currently playing video, look up the new videos location, load it into the player and start playing it.  The JW player actually stays right where it is and is just controlled by the Javascript.  This way the page is "dynamic" with changing "content" but does not need a second page.

      Crazy, huh?   Hope all that made sense to you.  I have never used the JW player, but, will look at it and set something up.  Let me know what you are thinking about all this and I will check in soon...

[ErnieAlex]

One further item...  If you use the JW video viewer users will have to install the plugin in their browser.
Not sure if that is a good thing.  The other choice would be Microsoft's webplayer.  Not sure if much of
a difference in that...

[jj-dr]

Just a bit overwhelming on my end, but I am following you.

The JW Player is actually a Flash Player. It's probably the most widely know and used player outher because of its versatility with playlist, skinning, and scripting. So users don't need any extra plggings on their machines, just Flash. If they don't have it, The JW Player will generated the download link. So that's not really an issue at all.

Just so you get an idea, here's a link of an thread in the JW's forum page twhere someone posts some to code to do just that. The thing is this is a very old thread and can't get it to work, and it's not well documented: http://www.longtailvideo.com/support/forums/jw-player/setup-issues-and-embedding/216/help-implementing-mysql-playlist

See Will's reply to this post. This should probably lead you in the right direction.


One more note, since you will be using the JW Player, you will not need the drop down list. The JW Players playlist support will do that for you. Play with the Player's setting, right on LongTail Video's website by using the wizard, which allows you to customize the look on the player and generate the embed code:  http://www.longtailvideo.com/support/jw-player-setup-wizard

See 1: Select an Example Setup and choose
flvplayer with a bottom playlist from youtube so you actually see what I mean.

You will see the player in action from LongTail's website.

[jj-dr]

Here's another link with the playlist in acction:

1. flvplayer Stylish skin (desktop player style)
http://www.longtailvideo.com/support/jw-player-setup-wizard?example=244

[ErnieAlex]

That link was for the "SETUP" of the JW.  I understand all that.  I was talking about how your users will select what they want to view.  Or are you going to create the playlist for them.  You mentioned YouTube which show a bunch of links of the next videos...   Usually on the right side or underneath and you select the next one you want to view.

   This is easy to do, you just put up multiple JW's, but do not allow them to play.  Then when a user clicks on one, that one moves to the live version and a different list of next ones appear.  All done with Javascript.

I am leaving for the night here in New England.  I will look at it more when I get home or in the morning. (Our morning... LOL )

[jj-dr]

I think you mean, for instance, like having two different Albums: Album A and Album B.
When user click on Album A, its playlist is loaded and played, and vice verse for album B.

Well, you are the programer here. I curious as to what you will come up, and we'll teak it from there.  Good night from Philly.

[ErnieAlex]

JJ-dr,
   Sorry, I have not had any time.  I am looking at it for a bit right now.  I assume you have a database set up so you can add some tables to it to hold the "albums"?  I will create something that might help you and then you can alter in any way you want.

   Another quick question...  Do you want to have the album be just a name or actual videos like youtube?
Just names are easy and quick to create.  Sliding videos are easy if you limit the number on the screen.
To make that more clear, let's say there are 20 albums with 5 videos in each.  The first video would be the one that the user sees in a list, of let's say 5, buttons on each side would allow them to slide the videos left and right.  Once they see one they want, they click on it and it moves up into the viewing area and starts.
This would be very nice but it will take a lot more code than just an album list.

   Think about it and let me know more about how you want this laid out on screen.  (Off to learn JW..)

[jj-dr]

whatever is simpler to execute will be fine.

Anything that comes close to the way the JW player works with XML playlists as in http://www.longtailvideo.com/support/jw-player-setup-wizard?example=244, but with databse instead of XML playlist, of course.

The album with just a name will be fine as I want to have the ability to create that particular album name and generate its playlist.

The JW Players provides sliding video functionality. Not quite sure if this is what you meant. I am not sure if you are trying to recreate functionalities that the player already has.  As far as I know, the main weakness the JW player has is that it doesn't support multiple playlists, or in our example, albums  (natively). However, this is easily remedied, as you sated, by creating the albums (dropdown list or with the buttons you mentioned?) outside the player and interacting with Javascript.

I have created and deleted a lot of things that did not work. At this point, I will create the same database you yo will create for the execution. Renaming is always the easiest thing to do, if need be. So, if I have to breakdown the project task, it would be something like this:

1. Download JW Player  to your project folder

2. Create database: VIDEOs.
   a) create tables: albums, videoplaylists
   b) Create album fields: id, albumname , description
   c) Create videoplaylist fields: id_videos, filename (coming from video uploaded, i.e, video01.flv), description, author, videosource (file folder),   etc.

3. Create videos page: index
    a) Connect to db
    b) add JW Player to page
    c) Add relevant Javascript
    d) Create PHP code or functions that will interact with JW Player, along with the javascript.

WORK FLOW
   1. On videos index page the JW Player is loaded

  2. The Albums names (links) are populated from the database, and item  "0" the first album's (ordered by something like name,   date, etc.) is played automatically (on page load).
   
3. If no user interaction, videos advance until the end of album, and play next album.
       a) on a side note, selected album should be highlighted, so the user know where he/she is.

4. If there's user interaction (on click), appropriate album should be selected and and highlighted, and of course deselect previous album
   a) If user clicks on a particular video (or song as this can also be a music player),  then that particular  playlist item (video or song) should be played and highlighted on the player. The JW players usually provides this latter highlighting functionality.

This is all what I have in mind... more or less. Of course, fell free to implement as you see fit.

Bets luck.

[ErnieAlex]

    I Hate You!  Just joking, LOL...  I just wasted nearly an hour watching YouTube from the samples I was playing with...     Not sure if that was good or bad.  Was fun...

Okay, looks fairly simple.  I will send some real code for you in a few hours, I have to leave for an errand...

   Oh, YouTube is basically like a RSS feed.  But, it will be easier to do-you-own.  At least I think so.  Am moving some samples to the server and will be back later to test my system...  Later...

[jj-dr]

Love Me, Feed Me, Never Leave Me.  (Scene from Garfield Movie)

ONE LAST THING:  I want you to take a look at this REALLY OLD website (that needs to be updated) I created long time ago with a very good execution (then) of the JW Player: http://movimiento22.com/videoplayer/videos.html It will best rendered in IE.

Take a look how I managed to create albums using the Javascript. I Even to Managed to crate different Categories or Tabs (Videos, Music). Of course there's nothing dynamic here as this is a pure HTML page where the albums, and playlist are managed manually and not through a database. However, the essence of what I want accomplished is there.