I have a mysql table that has two fields - an identifier number, and text based url's stored in it of locations of some mp4 videos. I want to make a very simple html5 video player that when opened, looks at the database, loads the queue, and starts playing. when one song ends, it loads the next one in the list.
I'm pretty proficient with php and mysql, but what's stumping me is what code to alter on the html5 video player to get it to move to the next song in the database when the current song ends. basically in pseudo code :
(php/mysql) select idNum, URL from tracklist
HTML5 video source = first URL in the list
play the video
function (video's over)
get the next url
using ajax or something (???) swap out the player's source
keep playing with as little a gap as possible.
rinse and repeat :-)
simple really. just dont quite understand how to harness the html5 video and make it play nice with php. help!
If your playlist isn't likely to change very often, then I would generate some JavaScript containing an object for it when the page is called. You can load the HTML5 player with the source of the first video in the playlist and bind an event handler to the player such that when the video ends, it loads up the next one. See http://www.w3.org/2010/05/video/mediaevents.html for an example of a player and the events that are fired.
If the playlist is likely to change very often (i.e. after the page loads), you could make an Ajax call to update the playlist.
Related
Need advice, guidance on triggering a .wav file to play when a web page loads content and a specific keyword is within body of that content.
The content is being pulled from a Yammer network thru a custom app I created to look for certain hashtag messages using PHP. Now, I'd like to have a sound play (like a bell) when a specific hashtag has a new message. The bell would not ring a second time, just on the intial display.
Suggestions (using PHP)?
To play music in your site, place, <embed src="yourfile.wav"></embed> anywhere in page and checkout.
You can make it dynamic by using php in src.
I'm trying to track down a tricky issue with MediaElement.js players. I'm using the player in multiple locations on a page, all of which are video files. These video files all point to the same url, which is a file download script that streams the file given an id. Each file has a unique id, which means the url given to the MediaElement player is of the type "/fileDownload.php?fileId={some file id}"
When I press play on one of the videos, it loads fine and starts streaming the video. However, when I pause the video and try to play another one of the videos, it won't load them at all, and will just spin forever like it's loading them. The videos won't play until the page is refreshed.
I'm not tremendously familiar with the implementation of the MediaElement players. Is it possible this occurs because MediaElement.js can't handle files coming from the same URL but with different GET parameters?
Recently stumbled upon a stock video footage site http://www.pond5.com/stock-video-footage/1/*.html , and saw that they had a preview of a video when the user hovered over a thumbnail. I want to recreate this, because it seems like useful practice and it will allow me to workout my web developing muscles.
I would like to be able to preview a video when a user hovers over a thumbnail.
For example like pond5.com. Audio is not necessary, but I would like it to look smooth like a video rather than a video preview that contains a frame every 5 seconds.
On pond5.com, I originally thought they used a gif, but it plays very smoothly. Some also contain audio. As far as I thought, audio can't be used in .GIFs
Is this a case where I would have to just upload a 2nd video for the preview?
Thank you for any help.
Pond5, the website you specifically mentioned, creates a video thumbnail with watermark and lowered quality and stores it. It is then played back using JavaScript to dynamically load a div element that contains the flash player. So no GIFs are involved. You do need to upload a 2nd video, but the steps to this project are as follows:
Server-side video thumbnail/watermarking: Not sure if there are any PHP packages that are up to the task on this one. I would write a more powerful program in C++ or C#. If you go with C#, quick and easy solution would be Microsoft Expression Encoder.
Flash/Silverlight/HTML5 video player: To play the video.
Client-side JavaScript: To load the fancy popup and the aforementioned video player. Note that you might need to use PHP and a database engine to load the thumbnail URL for the video requested.
This is what Pond5, and what many other stock-footage sites use, and the basic outline of what you would need to do to achieve similar results.
I am wondering if there is a way to include a playlist as a variable or link to an external file in Flowplayer. I know that you can use RSS playlists, but I need to use the start and duration parameters to combine clips into a single stream and am not sure that those can be used with RSS playlists.
I would like to be able to keep my playlist external from the player if possible, so that it is easier to manage. What I am trying to do is have a player and several buttons on my page. The buttons each cause a different playlist to be played. I have everything worked out up until the point of actually inserting the playlist.
Right now I am simply writing the content of my playlist file to the player page using a search and replace, but I am hoping there is a better way.
Thank you for reading my post.
You can use an array of JSON objects that can be loaded even by AJAX.
You can also use an external configuration file, that can be generated by PHP itself.
Here are some help links:
http://flowplayer.org/demos/configuration/external.html
http://flowplayer.org/documentation/configuration/playlists.html
http://flowplayer.org/plugins/javascript/playlist.html
What is the best way to construct a audio player that can communicate with the jquery on my site?
Can I have flash send jquery commands when a song is finished playing?
Does html5 audio support a onSongEnd or similar function?
Songs on my site are a series of links that trigger jquery to reload a flash audio player with the appropriate song info. I would like to improve it so that I will automatically move on to the next song, or not depending on the users listening preferences. I would also like to be able to randomly play a promotional clip before playing the chosen song.
Do I need a custom flash player for this?
What is the best way to go about this?
Can I have flash send jquery commands when a song is finished playing?
Yes, you can; you can listen to the soundComplete event on the corresponding SoundChannel object and call the appropriate JavaScript (and hence jQuery) function from Flash using ExternalInterface.call().
You can find sample code for both classes in the examples section of their corresponding pages. The example for soundComplete demonstrates how to load and play the next song upon completing the currently played one - basically you load the next song from the soundComplete event handler of the current song.
I think Flash is still a safe bet. Take a look at jPlayer; it is a JQuery plugin for playing audio files. It has a beautiful with some useful items, user interface.